用超多案例,帮你掌握尼尔森十大设计原则(下)

释放双眼,带上耳机,听听看~!
对于尼尔森原则,很多人应该并不陌生,但是并没有系统的了解过。本文继上期,将为大家继续分享「尼尔森设计原则」。

对于尼尔森原则,很多人应该并不陌生,但是并没有系统的了解过。这篇是在学习过程中的想法与一些案例思考,希望与各位一起探讨。

本篇将继续学习尼尔森的6-10原则,关于1-5的原则请查阅:

关于尼尔森原则

「尼尔森十大原则」又称为「用户界面设计的10种可用性5 F – – Y ` D启发式」,是由雅各布尼尔a z I |森(Jakob Nielsen)提出的10条交互设计一般原则。之所以将其定义为“启发9 v )式”,是因为它们是广泛的经验法则,而不是特定的可用性准则。

在官方2019年的描述视频中将原则定义为「十大UX设计试探法」,运用这些原则有助于我们试探设计的边界,探索设计的可能性,千万不要让原则成为束缚我们设计的枷锁。

原则六:识别而不是回忆

“保证元素对象,操作选x e ! . I 8项的可见性,以此降低g o R k | Z V V用户的记忆负荷。”

这个原则直译文过来的话有点拗口,其实就是指尽量减少需要用户记忆的东西,特殊情1 w w m o ; s况下提供. ^ Q Y E 3 R可选项让用户在此确认信息。特别是在一些较为长流程的页面流转中,一定要注意上下文的关联性,以此协助用户进行回忆,而不是从头开始记忆。

1. 选项可视性

最常见的运用,将选项以用户最能理解的方式呈现出来,不让用户疑惑。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

在平常练习的飞机稿或者一些风格独特的产品中我们经常会看到只使用了iF e b ; Y [ ^ }con的tab栏,虽然美观,但是当用户量达到一定程度,且用户属性较多的情况下很容易造成识别上的问题。目前市面上较多的产品还 4 A ) C @ q & a是选择了I T n ! S 9 u文字+icon的展示形式,通过文字与图形加深用户的识别,高德则选择了使用表意最为明确的文字。

2. 页面可视性

页面标题也是最为常见的运用形式,产品需要清晰的告知用户目前所处的位置。特别是在一些需要长时间停留,存在操作被打断的界面中标题尤为重要。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

目前市面上常见的产品都会在用标题来告知用户当前所处页面,有段时间特别流行类似APP Store这种刻意放大来突出页面标题。值得一提的是,在IOS中如果从一个APP跳转至另一个A7 B h sPP左上角则会出现上一个APP的名称,切点击可以快速返回。如上图中的淘宝页面,我是通过微博点击广告链接后跳转进入的。O 2 F W T N | d

3. 交互通用性

只要是用户熟悉的交互形式,用户就不用浪费时间去记忆,即使不用文字说明,也能有效的保{ i 9 # h = d 1 {证用户. o K h的识别。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

在文字阅读或者编辑的时候,U 7 N c长按可以拷贝/粘贴,即使不用说明9 M N,绝大部分用户也能get到,还有就是预览图片时候,使用手指交换进行缩放。

4. 历史记录

提供最近访问项可以帮助用户恢复他们未完成的任务以及难以回忆的任务。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

最常见的莫过于浏览器的历史记录,可以帮助用户回忆寻找某个时间节点的内容,微信的聊天记录划分了更多的维度来帮助用户搜索相m i J v J ^应的记录。淘宝浏览商品不稳定性X H , j e较大,有时用户会因为某个宣传而点进某个商品,通过足迹可以查看浏览记录,这样就不用特地去记店铺名称或者加入收藏夹了。

原则七:灵活高效的使用

“用户看不见的加速器(快捷方式)通常可以加快专家用户的交互速度,从而使系统可以同时满足经验不足和经验丰富的用户。允许用户定– l .制频繁的操作。”

系统需要同时适用于新手用户与专家用户,对于新手用户来说,需要尽量降低他们的学习成本,帮助他们快速上手,而对于专家用户来说,他们需要的是快捷以及高效。

1. 千人千; & ? j d

在注重用户数据分析的今天,很多时候已经不用U u , |用户自己手动去设置自己的偏好,产品便能像你所想。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

左图的滴答清单是最为常见的为新手用户准备的引导方式,右图支付宝的( – O ) + A o X v财富界面,如果是新手用户,那么金D % 8刚区下方则展示现金红包,基金推荐等吸新人,如果是基金老用户了,则会展示更加专业的数# } & c h H据字段来帮助用户决策。

2. 重复操作

对于熟悉的产品,一般来说用户更希望一切趋于稳定。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

在外卖这种使用频次较高选择项较k n , ` D多的产品中,很大一部分用户不愿意冒着风险尝试新的菜品,或者点餐决策时间较短(比如开会),他们很多时候会选择“再来一单”。

3. 快捷方式

在操作同一款软件时,专家用户的屏幕只有一个预览窗口,而我…恨不得屏幕再& – 0 t V P 1大点,塞下所有工具栏。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

在各种软件中都会设置快捷键便于专家用户的高效操作,比如专家用户Z Z j H ( $ B的Ph2 v 0 2 f ; y =otoshop和我的PS。

原则八:美学和简约设计

“对话中不应包含无关紧要g i 2 6 # $或很少需要的信息。对话中| n ;每增加一个信息单元都会与相关信息单元竞争,从而降低其相对可见度。”k Z W

我们在设计一个页面的时候,如果其中的元素都想突出,最终只会导致没有任何突出的元素。这里可以参考“信噪比”的概念,即相关信息与无关信息的. u ) A比例,用户的注意力是有限的,T F 4 , H降低不必要的视觉噪音,才不会过于分散用户的注意力,提高用户效率

1. 文字内容

资讯R i . 8 [ y Y 5类产 $ d t G u ^品中最为常见,如果一大段文字又臭又长,那么就很容易影响到想要传达给用户的核心思想。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

36氪在快讯页面中会将重点资讯标红来突出,此外默认情况下只展示资讯标题,方便用户快速浏览,如% V m L G y Y A果遇到感兴趣的资讯可以再选择展开9 m H浏览详细$ , = $ V信息。

2. 视觉元素

利用这个原理,现在的产品会在一些视觉元素处) S 8 ^ w } p X理上做出区分,不仅能引导用户快速完成预设的操作路径,且对产品本身业务也是相当有利。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

淘宝的结算页面中,为了促使用户剁手不受干扰,会将付款btn与其他做高反差处理,同理Airbnb在首页中将搜索房源作同样的的处理,只要促使用户搜索了,那就提高了剁手的转化率。

原则九:帮助用户识别,诊断错误并从错误中恢复

“错误信息应该使用简单的语言表示,准确指示问题并建设性地提出解决方案。”

原文中特地强调不要用代码去表示错误信息,即用用户能够理解的,通俗的,接地气的词汇,千万不要w b M用一些专业性术语。用语尽量礼貌,不要~ 0 r b ` w $ x责怪用户,让他们觉得自己是个傻逼,这样很容易让他们产生挫败感。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

得道在使用手机号登录的时候手机号少输入了一位,以至于登录btn一直无法点击,虽然诊断了错误,但是没有明确的告知用户错在哪。` 4 FBehance在这方面就显得更为完善,会实时判断状态,并且实时告知原因,协助用户进行改正。

原则十:帮助文档

“即使可以在没有文档R X 6 0 + | o O T的情况下使用系统会更好,但可能仍需要提供帮助和文档。任何此类信息都应该易于搜索,着眼于用户的任务,列出要执行的具体步骤,并且信息量不要太大。”a b { w n e

每个用户的背景都有所不同,所以很难确保所有用户都能畅/ I R通无阻的使用自己的产品。无论什么类型的产品,都O 3 m E尽量给用户提供一个帮助的途径,对于那些只需要一句话就能+ 7 : x t y b z概括的,可以考虑在附近进行简短的说明,而对于需要复杂说明的,最好统一一个帮助入口,且放置于用户易于找到的位置。

用超多案例,帮你掌握尼尔森十大设计原则(下)

用超多案例,帮你掌握尼尔森十大设计原则(下)

在IOS的设置中,会在一些设置项下添加简要的说明,以此来帮助用户更好的理解。印象笔记与普遍的产品一样,在菜单栏上有帮助的入口,而且提供精准的搜索功能,帮助用户更快的解决有可能遇到的( D g b ` E K ` G问题。

最后

至此尼尔森的十个原r : . t m i则就告一段落惹,虽然还有很多不足,但是好在坚持下来了。(晚饭奖励一个鸡腿)。接下来会继续学习其他的设计法则或者设计 . ; 5 6 x心理学方面的内容,每天都要积$ i F极向上鸭~

给TA打赏
共{{data.count}}人
人已打赏
教程分享

WHMCS伪静态规则

2020-9-16 18:59:01

教程分享

万字干货!超全面的B端设计指南:表格篇(上)

2021-1-10 1:29:47

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索