交互设计的5个常见错误

交互设计从来都不容易。它包括了用户行为的深度分析,和一丝不苟的规划。随着新技术和交互设计模式的出现,事情并不会变容易。

艳丽的图片、顺畅的鼠标悬停效果和意外的动画,不再那么容易引起用户注意了。但难题却没有解决——如何创造令人愉快的用户体验,让用户面带笑容完成转化?如果你对常见的设计陷阱有所警觉,就能更少犯错。

9

为了方便——可能也为了让你知道你不是独自一人——以下总结了最常见的交互设计误区

1. 铺天盖地的创新

网页设计师都非常有创造力。我们希望通过作品来表达自我。我们总是在寻求创新的设计方法来脱颖而出。但是,当涉及到交互设计时,创新并不总是好事。甚至会给你的网站带来坏的影响。用户渴望熟悉的事物,他们总是会遵循一些特定的操作方式。

Randy J. Hunt,Etsy的创意总监和Product Design for the Web作者,清晰地陈述过:“嘿,设计师:别再TM自作聪明了。”在文章中,他详细解释了为什么别在网页设计上过分热衷创新。

以Iotorama网站为例。它挺漂亮,音乐深情,但是看着满屏幕移动的球,用户不知所措。不要误解我的意思,这个项目非常出色,超级有创造力!我喜欢这个大胆的创意,但它一点也不直观。

1

还有一个例子。Safety on the Slopes项目背后的创作者想到一个巧妙的交互式图形,用来警告用户冬季运动的危险。非常创新,同时也很直观、有趣、令人印象深刻。

2

2. 令人困惑的导航

不要自作聪明”的准则也可以沿用到导航上。有些设计师试图使用折衷的名称来寻求新颖。比如Chijoff网站就让用户不知道他们究竟提供什么,如何聘请他们。需要看上好一阵子,才能理解“共同创造”页面实际上就等同于“服务”。甚至还有,通读整页后用户仍然不知道该怎么做……页面末尾只有个小注册表单用来获取最新的行业新闻和提示!在“联系”页面也没有表单,只有邮编和邮箱地址。使人们联络或聘用他们非常困难。

3

你能猜出“Universe”在Maison Margiela网站中是什么意思吗?实际上它链接到他们的Facebook主页。谁能想到?

5

相反,看看legworkstudio的网站。它的创意与超凡令人震撼。导航非常清晰不含糊。用户绝对不会迷路。

3. 杂乱无章

有一段时期,网站都试图把一切可能的东西摆上台面。那些日子已经一去不复返,但是很多网站仍然在犯这个错误。看看这个在线商城:

6

设计师试图坚持一种单色配色,但是大量颜色不同的色块、logo和字体,在这个页面上就足够让用户步履蹒跚。搜索框有着醒目的文案:“那么,今天你想要什么?”,但整个布局的外观和感觉非常过时。

EBay是主要在在线零售商之一,在这点上做得不错。没有用产品图片、促销和各种行动召唤塞满整个页面,而是保持它干净简洁,强调他们确实希望用户首先关注的东西,并附上清晰的提示,接下来该怎么做。

7

4. 注意对比,大哥!

对比是创造视觉层级、吸引用户注意特定元素的最重要的方式之一。在网页设计中,对比不仅仅意味着颜色使用,也包括尺寸、形状和位置。

这个网站是最简单生动的例子。他们做到了统一一致,但整体背景和按钮并不够吸引人,尤其是在订购按钮上。

8

相比来看这个。颜色选用很接近,但结果却完全不同。而且,创新的滚动效果,流畅地介绍了产品的新功能——反光材料。很酷,对吧?

91

5. 忽视表单样式

表单设计是用户体验最基本的部分。每个网站都有一个目标——无论是树立榜样、直接售卖产品或是提供信息。不幸的是,许多网站有着光鲜的首页,却宁可用长表单和复杂的验证码来使用户厌烦致死。除非用户有强烈的先导动机,否则他们就会离开。

有了JCF这样的有效的跨浏览器的解决方案,是时候忘记那些丑陋的默认表单元素了,转向一种更加沉浸的用户体验吧。

10

另一件气人的事,是表单要求太多信息,或者没通过完善测试。例如sketchybusiness.io的表单高亮显示了所有的空白框,甚至包括非必填项。

11

如果你看了mostlyserious.io的表单,你绝对会喜欢它的鼠标悬停和按钮按下状态。而且,“别害羞”的提示文案增加了一丝亲切幽默的感觉。

12

最后……

不要懒于测试!对你重要的对于顾客未必重要。他们在哪里遇到问题卡住?是导航、奇特的视觉差滚动效果、还是长时间加载的视频?用户测试的最大好处之一,是你可以通过用户的视角来观察,关注他们的需求、做出改进。不要抑制你的创造力。要牢记网站访客可能会感到困惑和沮丧。

你见过最糟的交互设计错误是什么?可以在评论中分享你的想法和故事。


原文链接:http://designmodo.com/5-interaction-design-mistakes/

作者信息:
Anna Lisnyak
Anna Lisnyak is the Art Director at PSD2HTML.com, the leading PSD to HTML and web development company. With over 8 years of graphic design experience, Anna is an avid reader and blogger. She has an exceptional eye for details and enjoys everything related to typography, web and UI/UX design.

http://colachan.com/post/3458

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/10547/

(0)
iouedioued
上一篇 2015-11-09
下一篇 2015-11-09

相关推荐

  • APP设计:那些打动人心的设计点(二)

    上周写了一篇文章《APP设计:那些打动人心的设计点》,总结了八个APP的小设计点,这些小设计点不是针对APP的核心业务和功能的设计,但会给用户带来一点小便利和小惊喜,就像电影最后的彩蛋,让人期待而心动。紧接着上篇,我们继续说说那些打动人心的APP设计。

    2017-05-05
  • 交互设计三要素–目标、任务、行为

    设计文章,交互设计, 基础知识 2014-09-04 来源:阿里巴巴国际UED 作者:zhoudong 编者按:交互设计师是为用户创造好的使用体验,这么纠结出来的方案有时候用户根本不care,看一下这东西不是自己想要的扭头就走,哪怕…

    2014-09-04
  • 【交互设计】选择时间设计

    作者:Mufly 对于不少手机应用来说,都有一个选择时间的功能,那么从交互体验的角度来看,这个时间选择表格应该如何去设计比较理论呢?   时间选择,常见的一般分: 1、具体时间点选择,这种类型侧重于具体的…

    2015-09-07
  • 帮助视觉设计师高效工作的三大招

    互联网视觉设计师如何在职业上精深一直是我在思考的,遇到过许多视觉设计师想转行去做交互或者项目经理,找不到视觉设计师的价值和专深入点。我也在思考与探索中,下文是我现在想到的一些点,也欢迎同道中人一同探讨,互相启发。

    2017-05-05
  • WEB用户体验

    点击标题下「智业人」可快速关注摘要:随着软件行业的迅速发展,各种软件产品更是形形色色,用户不再满足软件对其所需要的功能实现,更追求一种使用过程中的心里感受,因此用户体验足够好的才能走向最前端。用户体验的定义有很多,用一种比较简单的说法就是“用户对访问网站的感受”。本文主要从用户体验角度出发,从网站的构建到数据渲染完毕的过程提高用户体验。关键字:加载速度、动画、用户体验、布局一个好的网站离不开对用户体验的追求。因为良好的用户体验才能增加用...

    2018-02-03
  • 40个全屏图片背景的网站设计欣赏

    Web设计灵感总是帮助我们走在新趋势, 设计结构、颜色和总体设计过程。有很多灵感的网站列出的主题就是我想要这一个是不同的。所以在这个今天的帖子我收集了40个全屏图片背景的网站设计欣赏,为你找设计的灵感。

    2017-06-03
  • 【笔记】设计师与产品经理该如何高效地进行团队协作?

    2017年5月14日,UXRen北京分舵在北辰泰岳大厦主办了《设计师与产品经理该如何高效地进行团队协作》的分享活动,本文基于分享嘉宾朱峰现场分享整理而成。   分享嘉宾: 朱峰(现任 “蓝湖”产品负责人&联合创始人…

    交互专题 2017-08-07
  • 常见的App应用界面交互框架

    掌握常见的APP应用界面交互框架,了解他们各自的优缺点,使用时才能游刃有余。你还在等什么呢?赶快去学习吧。标签式、跳板式、列表式和旋转木马等在等着你。 1>标签式 优点: 1、当前位置入口清晰   2、轻松在…

    2014-11-19
  • 当产品进入碎片迭代,设计师可以做些什么?

    也许是刚毕业的你最该看的一篇干货。如果你已经习惯了等别人给需求,然后开Photoshop,再等别人说改哪里就改哪里,肯定谈不上工作成就感。想掌握设计的主动权,证明自己不仅是个画图的,建议把这篇文章提到的3个方法好好实践一番,绝对会有大收获(严肃脸)。

    2017-06-01
  • 页面停留时间和网站停留时间详解

    摘要:一、页面停留时间与网站停留时间是如何计算出来的? 假设用户访问了网站的主页(Home)。分析工具将这个访问者标记为一个Visit,接着这个访问者又浏览了另外两个页面(Page2和Page3),然后他离开了你的网站…

    2014-12-16