12个常见的网站交互设计错误

Date 2025-05-09 11:37:00

1,缺乏对比

浏览网站时,我们喜欢看页面设计,以显示干净和清新的对比度。比较实现了一个重要的目的——它使内容可读,并在页面上毫不费力地指导用户。这是最基本的设计概念之一,但奇怪的是,有些网站似乎只是不理解。

如果没有足够的对比度,无论是颜色还是整体显示,一个网站看起来,在最好的情况下,也会让你感到有点困惑,在最坏的情况下,会使页面完全不可读。

interaction-design-mistakes-01

▲ 案例示范

疯狂导航

无论你使用什么导航想法跳出框架,首先考虑你的用户。这并不无聊,而是深思熟虑和务实的。充分利用导航设计的最佳实践和原则:清晰、简单、一致性和相关性。

interaction-design-mistakes-02

▲ 案例示范

3.非响应性或不良触摸目标

响应性网站现在非常重要。除非你做了大量的用户测试,证明一个移动友好的网站是不必要的,否则我们没有借口在你的智能手机上创建一个难以使用的网站。

interaction-design-mistakes-03

▲ 案例示范

4.令人心烦意乱的音乐

晚上播放一些音乐是非常愉快和放松的。在正确的时间点,音乐可以是一种很棒的体验。然而,99.9%正确的时间不是你浏览网站的时候。

很少有比你浏览一个网站时有一个刺耳的管弦乐队在你耳边演奏更烦人的事情。如果你是下一张广告专辑,这可能是可以原谅的。但即便如此,也只是可能的。

interaction-design-mistakes-04

▲ 案例示范

5.毫无意义的弹出窗口

是的,弹出窗口真的很烦人。尤其是注册窗口!每个人都需要更多的注册!然而,总有更好的方法来进行你的营销。弹出窗口可以像对孩子大喊大叫一样烦人,试图吸引他们的注意力。如果你必须使用弹出窗口,请让它们简单、有创意、易于关闭。

interaction-design-mistakes-05

▲ 案例示范

6.可怜的结构

我明白尝试创新有多有吸引力。毕竟,你希望你的设计脱颖而出。然而,当创造变成热混乱时,是时候带来一些必要的组织了。

伟大的设计师是伟大的沟通者。视觉层次结构和平衡是创造良好第一印象的重要层次。同时,它们可以影响用户的行为。更重要的是,它们可以有效地传递网页以外的信息。

interaction-design-mistakes-06

▲ 案例示范

7.棘手的排版

当我访问网站时,我喜欢快速方便地访问信息。我们都不喜欢带有阴影效果的混乱大字体。或者尝试在移动背景下阅读,或者与需要用放大镜查看的小字体作斗争。

这里有一些规则可以帮助你复习基础知识:

—— 建立清晰的层次结构

—— 注意文本对齐

—— 限制字体的数量、类型和颜色

—— 必要时充分利用空白

8、表单笨拙

有时你需要向你的用户要一些信息,这本身就很好。然而,这并不意味着你可以为他们提供一个长时间和浪费时间的表格。重复要求相同的信息并不是一个好主意。只向用户要求最少的必要信息,不要忽略表单的跨浏览器样式。

良好的表单交互体验来自于清晰度、简洁度和一致性。

这里有一些小贴士:

—— 强调所需的字段

—— 必要时显示进度

—— 提供提示

—— 注意字段的长度

—— 使用先进的工具定制表单元素

9.抄袭没有用户反馈和数据

从别人那里得到灵感并不一定是一件坏事,但如果你这样做,你需要确保你有正确的反馈和数据,以确保你为你的目标受众提供真正的设计价值。

interaction-design-mistakes-08

▲ 案例示范

10、明显的不一致性

在一定程度上,风格可以混搭。但是,如果整体效果成为一个巨大而丑陋的视觉“冲突”,建议返回绘图板并重新开始。

良好的互动设计是一致的。它使用户能够更好地理解事物是如何工作的,并使用户在使用网页时感觉到他们在控制情况并提高工作效率。雅各布·尼尔森说:“如果用户的期望得到更多的证实,他们会觉得自己在控制系统,更喜欢它。”

interaction-design-mistakes-09

▲ 案例示范

11、动效过多

偶尔使用的互动动画可以改善你的网站内容。然而,让你的页面一个接一个地承担疯狂的动态效果会让你的用户感觉有点像进入在线疯人院,甚至更糟。

当我谈到疯狂的设计时,下面的网站肯定会加冕为冠军。我可以设定一个挑战。当你看到它时,你有没有办法不感到精神上的混乱?

interaction-design-mistakes-10

▲ 案例示范

同类型的网站:“逼死设计师!2015年全球最丑网站排行榜新发布。

12,追逐趋势

保持一点时尚是非常愉快的。然而,如果你花时间追求最新的流行语和交互式设计风格,你最终会得到一个像陈词滥调一样阅读的网站。如果可以的话,你应该敢于改变。

交互设计-四种正确的设计方法

因此,以上是我最讨厌的交互设计错误。以下是一个方便的小列表,提醒你如何以正确的方式设计!

1)目标驱动。不要为了添加效果而添加效果。不要选择调色板、导航栏或图标,仅仅因为你认为它看起来不错。试着关注最终的目标。你想让你的网站实现什么目标?一旦你确定了这个目标,你很可能有一个关于你应该使用什么样的交互设计的好主意。

2)记住要有人情味。如果你是艺术的(我们不都是),你面临的诱惑是创造美丽的东西,一些优秀的东西,一些人从未做过的东西。然而,如果没有人创造和使用它,一个好原因可能是它们真的没用。记住,网站上的访问者都是人类。你创造了一些能直接吸引他们的东西。

3)保持一致性。是的,网站本身应该是惊人的。然而,网站也应该正常使用。您需要遵守一些设计实践,使网站易于浏览和理解。不要为了不同而违反常识。相反,接受你需要实现某些规则的事实可以帮助你的用户轻松访问你的网站。

4)测试和测试。如果您发现任何问题,请进行测试!有许多用户研究工具可以帮助您找到用户在产品中被困或分心的地方。a / b测试,分析视觉跟踪数据,或者直接让你的客户、同事和朋友尝试你的新设计。没有什么比真正的反馈更有价值,几乎没有更好的方法来改进你的互动想法。

课程推荐
— Course recommendation —
【红喵设计教育】ps教程-ps零基础课程

红喵设计

【红喵设计教育】C4D基础-C4D软件制作教程

红喵设计

【红喵设计教育】包装设计-免费/PS/AI/CDR/平面设计

红喵设计

【红喵设计教育】版式设计-版式的思路PS/AI/CDR/平面设计/排版技巧

红喵设计

【红喵设计教育】ps基础-ps基础入门教程

红喵设计

【红喵设计教育】CDR基础-CDR零基础入门教程

红喵设计

【红喵设计教育】海报基础-PS合成海报设计教程

红喵设计

【野马设计教育】AI基础-AI软件零基础到精通

红喵设计