译文:常见的交互设计错误

好的交互设计可以区分开有质量的网站和其他普通网站。然而,如果有明显的设计错误,它只会给予你本来想打动的用户以刺激和挫败感。

10a0009d296856f1f8

1090009d0ab6e12784

原文来自Speckyboy,一个在线设计杂志网站

作者是Lana Lozovaya,来自PSD2HTML的内容策略与社交媒体经理。

 

1090009d0ada7bb5f7

下面是我最不喜欢的交互设计错误的列表,它们都让用户感到失望,困惑,有时甚至可以让他们有点生气。

1.缺乏对比

当浏览网站时,我们喜欢看页面设计展示出干净、清爽的对比。对比达到了一个重要的目的——它使内容可读,并毫不费力地在页面上指导用户。这是一个最基本的设计概念,只是很奇怪,有些网站似乎就是不明白!

没有足够的对比度的话,不管是颜色或整体展示,一个网站看起来,在最好的情况下,也会让你觉得有点儿丈二和尚摸不着头脑,在最坏的情况下,将会使页面完全不可读。

14d00037d2d22bbe56

2.疯狂的导航

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

1090009d0ace26ab4a

3.非响应式的或者不良的触摸目标

响应式网站在现在是至关重要的,我们没有借口去创建一个在你的智能手机上很难用的网站,除非你做了大量的用户测试,并证明了一个移动友好的网站并不是必需的。

4.令人心烦意乱的音乐

在晚上放些音乐很高兴而且也令放松。在正确的时间点上,音乐可以是很棒的体验。然而,在99.9%的情况下,正确的时间并不是当你浏览网站的时候。

很少有事情比你在浏览一个网站的同时有一个刺耳的管弦交响乐团在你耳边演奏更恼人的事情。如果你是广告你的下一张专辑,这可能还算是可以原谅的。但即使这样,也只是可能还算是。

10a0009d29772bf256

5.毫无意义的弹出窗口

是的,弹出窗口真的可以让人感到恼火。特别是注册窗口!每个人都需要更多的注册!但是,总有更好的方法来做你的营销。弹出式窗口可以像冲孩子大喊大叫以试图吸引其注意力一样恼人。如果你必须使用弹窗,请让它们简单,有创意,并且易于关闭。

14e00037d7fb892bfd

6.可怜的架构

我理解尝试创新是多么诱人。毕竟,你希望你的设计脱颖而出。然而,当创造变成了一场火热的混乱,就是时候带入一些必要的组织性。

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

7.棘手的排版

当我访问网站,我喜欢能够快速而方便地访问信息。我们都不喜欢混乱的不易阅读的带阴影效果的大号字体。或者是在一个移动的背景尝试阅读,或者与要用放大镜才能查看的小字体苦苦斗争。

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

——建立一个清晰的层次结构

——注意文本对齐方式

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

——必要时充分地利用空白

8.笨拙的表单

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

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

这里有一些小贴士:

——强调需要的字段

——必要时显示进度

——提供提示

——注意字段的长度

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

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

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

10.显著的不一致性

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

好的交互设计是具有一致性的。它使用户更好地理解事物是如何工作的,让用户在使用一个网页时,感觉到他们在控制局面,以及提高他们的工作效率。雅各布·尼尔森说:“用户的期望更多地被证实是正确的,他们就会越觉得他们在控制系统,并会更加喜欢它。”

11.太多的动效

偶尔使用的交互式动画可以提升你的网站内容。然而,让你的页面负担一个又一个疯狂的动效,会让你的用户感觉到有点像是进入了在线疯人院里,甚至更糟糕的东西。

下面这个网站是谈到疯狂设计时我一定会加冕为冠军的,我可以定下个挑战,你在看到它时有没有办法不感到精神错乱!

12.追逐趋势

保持一点时髦是很让人高兴的。然而,花时间去追逐最新的流行语和交互设计风格,你最终会得到一个网站,它阅读起来就像是陈词滥调。如果可以的话,你要敢于不同。

交互设计——四种正确设计的方式

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

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

2)记住要有人情味。如果你属于艺术型(我们不都是么),那你面对的诱惑是去创造美丽的东西,一些优秀的,一些有人从未做过的事。然而,如果没有人创建过和使用过,可能有一个很好的原因就是,它们确实没用。记住,网站的访客都是人类。你创造出旨在能直接吸引他们的东西。

3)保持一致性。是的,网站本身应该是很令人惊叹的。然而,网站也应该需要正常可用。你会有需要遵守某些设计惯例,以使网站易于浏览和理解。不要为了与众不同而违背常理。相反,接受你将需要实现一定的规则的事实,能帮助你的用户轻松地访问你的网站。

4)测试测试再测试。如果你发现任何疑问,就进行测试!有很多用户研究工具可以帮助你发现在产品中用户受困或者分心的地方。a / b测试,分析眼动跟踪数据,或者是直接让你的客户,同事和朋友尝试你的新设计。没有什么比真正的反馈更有价值,并且几乎没有一个更好的方法能如此改进你的交互设想。

想提升你的技能吗?

如果你想提高你的交互设计能力,这里有一些来自其他几个网站的很好的指导,充满了有用的可以帮助你的信息:

原文地址:speckyboy

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

(0)
iouedioued
上一篇 2016-02-07 13:49
下一篇 2016-02-15 16:52

相关推荐

  • 产品设计中关于表格设计的一些经验分享

    由于长时间主导后台产品的设计服务,表格的大量应用,总结了些许经验,通过半个月的断断续续的整理归纳,希望对你有所帮助,欢迎阅读!

    2017-05-18
  • 交互设计篇|经历一个产品从0到1我都学会了什么

    好的设计不仅能满足用户需求、提升易用性,还能弥补技术上的短板。在经过一个产品从0到1的实现后,对这一点感受的尤其深刻。下面列出几个我产品设计中的教训和收获。图书馆打印插队如果不给出理由则此行为被接受的概率为60%;如果给出一个理解则此行为被接受的概率为94%;甚至在解释原因时只提供“因为”而无实质原因的情况下,此行为被接受的概率竟然为“93%”。足见,“人就是单纯地喜欢做事有个理由”。那么,产品与用户“交流”时,就需要有个“理由”让用户看到自己行为操作与产品回应之间的解释,从而顺应操作规则从而更好的使用产品。

    2017-05-06
  • UI中的文字设计总结与分析

    对于设计师来说,文字是一个可以很好提升产品用户体验的武器,希望这篇文章能够给各位设计师带来收获。

    2017-08-04
  • 平面设计里怎样提高作品的视觉冲击力?

    提高视觉冲击力的方法非常非常多,我将结合下我的平面设计经验,总结归纳一下我所学习到的平面设计理论。我一直觉得学习平面设计不能只着眼于平面,应该让眼光开阔些,所以我下面的一些例子会从传统平面海报,绘画,建筑,电影等各个方面来分析设计原则。

    2017-05-17
  • 澳洲留学 | 交互设计专业硕士大解析

    📢:1⃣️条信息,足以改变你的未来!欢迎关注本平台交互设计在中国是一个新兴的产业,但是随着中国电子系统对人们生活影响的逐渐扩大,中国交互设计师将面临一个很大的缺口。什么是交互设计专业?1.words 语言语言是互动的最基础部分。人与人之间的互动是通过语言来进行基本交流。人也通过语言与机器进行交流。这里的语言可以是文字形式、语音形式、或动作形式等。在美国,一个好的交互设计师,也是一个很好地copy writer,需要具备良好的语言沟通和文...

    2018-04-06
  • 界面设计中的动画原理:可理解的变速过渡效果-深入研究加速和减速

    注:“可读性”是说动画绘制者如何定义动画的精准度,用来清晰而容易地理解正在发生的事情。例如:不可读=不清楚发生的事情很易读=它非常清楚,立刻能懂弹跳背后的物理理论:球刚开始被放开的时候,它有一个相对缓慢的速度。在重力的作用下,球的速度持续增长,直到接触地面的那一刻速度达到最大。地面给球反作用力,使它以几乎相同的速度反弹回去。当球移动时,两种力量作用正在球上 - 反弹的力、想把它拉下来的重力。反弹的力量正在慢慢释放,这使得球随着升高逐渐减低速度,直到它耗费掉所有的反作用力,最终到达反弹的最高点。它在顶部停留一微秒,直到重力把它拉下来,使它像之前一样加速下降。我用言语来描述这句话是有原因的。我们试着将一种自然行为分解为具体的步骤,这样我们就可以重新创造它。注:不要羞于“照搬”大自然。你的观众会更快地与动画关联起来,从而更容易读懂动画。注意:这一术语有可能与其它术语混淆。如果你正在阅读传统的卡通书,例如迪斯尼的《生命的幻象》或《动画师的生存工具》,那么这些书会告诉你,当一个物体开始减速然后加速时,这一过程被称为渐慢(ease-out),因为它的姿态在“缓慢输出”。但是,在软件产业(CSS动画,Adobe Edge等),这一过程被称为渐快(ease in)!我不确定这一不同之处是怎么来的,但是不幸的是,这就是它的形成过程。所以,当你在阅读一篇文章时,而这篇文章把它们把“渐快”称为“渐慢”,那么不要觉得困惑。看一眼你所在的网站你就懂了:D。时间    Y轴的位置(秒) : (像素)—————-0.0  :   00.1  :  34
    0.2  :  68
    0.3  : 102
    0.4  : 136
    0.5  : 170时间    Y轴的位置(秒) : (像素)—————-0.0  :   00.1  :   2
    0.2  :  10
    0.3  :  36
    0.4  :  87
    0.5  : 170注意:你会在软件中看到更多用于设置缓冲的选项,例如二次的、三次的、四次的等等。它们只是缓和程度更高的选择,但是概念是相同的。只需记住——缓和的程度越高,你就会得到更多的缓和度。并不是规则,只是工具(There are no rules. Only tools)- Glenn Vilppu

    2017-06-05
  • 【交互设计】入门交互设计需要注意什么

    作者:Mufly 最近一直在想,交互设计的核心是什么?因为身边不少设计师对交互设计有也兴趣,常常被问到怎么学呢?交互设计要注意什么?对于入行不久的我,如何回答这类问题成了难点,因为我怕回答得不好,误人子弟…

    交互设计 2015-07-20
  • AxureUX企业及通用型网站WEB端原型模板发布

    01作品信息作品名称:AxureUX企业及通用型网站WEB端原型模板作品类型:模板类发布日期:2018-04-02最新版本:v1.0主要适用:Web端软件版本:Axure 8.0文件大小:1.5MB作品编号:TEM007作品售价:¥19.00详细介绍及演示:http://www.axureux.com/home/templateswebgp.html复制以上链接在浏览器打开或点击文章底部阅读原文,建议在电脑上查看原型演示。02作品介绍本...

    2018-04-05
  • 交互设计师高级:兴趣、场景推荐核心算法之‘多维空间的两个向量夹角的余弦公式’

    不知道大家有没有关注过你手里的APP,那么它在不停升级中变得越来越懂你,越来越知道你的喜好,举例先:网易云音乐的推荐、今日头条的新闻推荐,他们都是你使用越长时间使用频率越多对你兴趣越准确的判断从而推荐给…

    交互设计 2015-08-31
  • 画一本满满的Sketch Book,你有这样的执念吗?

    Sketch Book 到底对你意义为何我们收到过,看到过很多位插画师的速写本有随身的不到A5尺寸的也有十分大到A3的像作品集一样也收到过,很多后台询问可以推荐款速写本,可以推荐下用什么笔吗(这个真的,不重要 X3)你会发现,很多ins上国外插画师po出来完稿画作和平日速写本的风格截然不同对,速写本不是一本作品集需要每一页都是完整的,完美的它更像一个瞬时的思考把你的某一点切实地记录下来看看她们的速写本01 Eve尹光芒正在鲸字号 上海实...

    2018-03-26