尼尔森十大可用性原则

虽然是生物研究生毕业,但万万没想到自己一出校园就阴差阳错地开始在互联网这块并不熟悉的领域开始创业,成为发起人之一的同时,也被赶鸭子上架成了一名产品经理。

创业的这两年不断接受各种产品的洗礼,负责一个又一个有形无形的产品。作为产品狗其中很重要的一点就是口才,因为你要不断地和不同人去撕逼,和设计撕,投资人撕,技术撕,和别的产品撕。而对于各个产品功能的评估,大家几乎都是以自己的经验和知识背景为依据进行评估的(也不排除有时观点是站在自己当时情绪之上。下属全是女生,我这个负责人对于情绪撕逼深有感触/(ㄒoㄒ)/~~,就像同时交了6个女票,有的不是翻倍的浪漫而是成倍的折磨),没有相对统一的评估标准是非常容易起冲突和矛盾,并且大大拖缓项目进度。

一路走来学习和积累了很多产品原则,尼尔森可用性原则则是经典中的经典。虽然十大可用性原则是在web1.0背景下基于网页产品提出来的,而当今产品的应用场景和形态都发生了巨大的变化,但这时反过头去研究尼尔森十大可用性原则会有意想不到的惊喜。当你发现当今林林总总的移动互联网产品交互原则(比如隐喻的合理性,减少输入成本等)其实都是尼尔森十大可用性原则的变种时,你会感叹这些经典原则的时代超前性。

结合着现在的产品来回味一下这些经典的原则,相信你也会有不同的收获。

尼尔森十大可用性原则

交互设计的本质就是一种语言,一种人和物的沟通语言。而交互设计师在中间扮演翻译的角色,确保双方沟通方便顺畅。

一. Visibility of system status(状态可见原则)

原文:用户在网页上的任何操作,不论是单击、滚动还是按下键盘,页面应即时给出反馈。“即时”是指,页面响应时间小于用户能忍受的等待时间。(The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.)

英文应该被翻译为:让使用者能够看见系统当前状态。翻译成人话就是告诉用户系统现在在做什么,进行到哪一步了,刚刚的操作到底成功了还是失败了。简单来说就是不断的给用户反馈,用户的每个操作都要有相应的反馈,让用户获得掌控感,给用户安全感。

实践时如何使用这条原理呢?

1.向用户反馈系统现在所处状态,任务完成进度。短时间任务尽量让用户感受到“马上就要完成了”,长时间任务真实反馈当前进度和剩余时间

微信传图片进度反馈,时间较长显示进度,但这是用模态反馈似乎不是最好的选择,因为打断用户操作必须要等待

2.向用户反馈刚刚的操作成功还是失败

操作后的成功和失败的反馈,不打扰用户使用非模态反馈

3.反馈时尽量不要打断用户任务

4.引导和告知用户操作

我们再熟悉不过的下拉刷新操作,网易大大还是温馨提示
鼠标悬浮到图标上,图标变色并且显示文字提醒,“没错,按下去就行”


5.服务的话就要事无巨细地反馈当前进度,增加用户信心和掌握感

圣诞节,小黄车变成圣诞树了n(*≧▽≦*)n。显示你周围有多少小黄车,并且显示距离位置,不仅帮用户找车,而且给用户使用信心
我们常见的邮件进度,这项服务并不能提高邮寄的实际速度,但有助于用户获得掌控感。掌控感是提高用户体验重要因素之一
滴滴直接显示你周围的专车,并且显示等待时间。给用户信心叫车,并且给用户掌控感

我们说做产品就是和用户谈恋爱,满足她的需求,然后俘获她的心。既然是谈恋爱,那最重要的就是互动,她做一个动作你必须要有回应,做一个标准的暖男(气管炎)产品,别等着女友来问“你在干什么呢”,必须要时时向上级汇报情况。

因为我们必须要把客户想象成17岁的女孩(Luke大神的观点),极其没有安全感,笨笨的而且没有耐心,必须要时刻向这位大小姐汇报我在干什么,到哪一步了,结果怎么样,否则她就会感到无助,没有安全感。而且要在合适的时机告诉她应该去做什么,怎么做,这样她才不会没有方向。由于你的女孩极其没有耐心,所以更重要的是反馈必须要尽快,否则她的负面情绪肯定呈指数上涨,而且我们还要用设计的手段来“哄”她,“亲爱的,马上就好哦,再等一下下”,比如预加载,假进度条。

二.Match between system and the real world(环境贴切原则)

原文:网页的一切表现和表述,应该尽可能贴近用户所在的环境(年龄、学历、文化、时代背景),而不要使用第二世界的语言。《iPhone人机交互指南》里提到的隐喻与拟物化是很好的实践。此外,还应该使用易懂和约定俗成的表达。The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

英文应该被翻译为:让系统和现实世界匹配。这其实就是语言的第二个基本特性:让别人能快速听懂你要表达的意思,简单来说就是说人话。

而设计语言和普通语言不同点在于,表达形式的多样化:不仅仅使用文字,还能使用图形和动效。所以不仅要让文字易懂,也要让画面和动效易懂,最好能够直接调用我们已经习以为常的元素。

当我们实践时如何使用这条原理呢?

1.文案人性化表达。文案表达包含两个层次,一使用用户看得懂的语言,二情感化幽默化表达,就像在和用户对话一样

2.隐喻符合用户实际生活中的认知。其中包括图形,动效,流程

首先说文字,对用户就别用专业术语和英文(中国环境)来装逼啦。关于这一点我们来看看我们最熟悉的window

什么是“错误769”,什么是“通用卷”?一脸懵逼,两脸懵逼

而MAC,不仅说人话,而且还给出口,教我怎么搞定这个问题。

再说图形和动效。在数字世界直接使用现实世界的语言无疑是最易懂的,IOS的拟物化设计和隐喻就是非常好的实践。

非常经典的IOS4界面,光影效果和质感都非常符合正常生活认知,用户能够快速通过图标识别应用入口

而Material Design对于动效的规定也是更加符合自然特点,元素的位移和展开都不是沿直线,而是曲线

(个人不太适应Metro Design的纯扁平化设计风,也许是水平太浅不能真正理解领会,也有可能是这种纯理性的设计风格把数字世界和现实世界断开联系,不太符合这条环境贴切原则吧。大师的作品我这种菜鸟怎么能够领悟/(ㄒoㄒ)/~~)

三.User control and freedom(撤销重做原则)

原文:为了避免用户的误用和误击,网页应提供撤销和重做功能。Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

英文翻译为:用户控制性和自由度。被人们普遍翻译成撤销重做原则,简单来说就是不要让用户走进死胡同,永远给用户提供出口和退路。

当我们实践时如何使用这条原理呢?

1.让用户可进可退,其中又分为及时性的和延后性的

2.在进行不可逆操作时给予二次确认

17岁的女孩笨笨的,出现误触和误击的情况是肯定,给她提前想好退路,如果是不可逆的操作一定要进行二次确认。

滴答清单中删除一条任务后有两秒的时间在底部显示非模态提醒,并且可以撤销上一步撤销操作,非常友好的设置

但是对于完成后的项目条却没有办法恢复,但用户很有可能是误触了前面的方框,实际却没有完成,但却没有退路。

四.Consistency and standards(一致性原则)

原文:同一用语、功能、操作保持一致。Users should not have to wonder whether different words, situations, or actions mean the same thing.

英文翻译为:一致性和标准化。这个原则现在可以说已经深入骨髓了,但是这里还是要唠叨两句。

当我们实践时如何使用这条原理呢?

1.和平台规则保持一致性

2.和自身保持一致性。其中包括迭代版本保持一致性,同一层级图标颜色字体保持一致性,品牌一致性

3.和用户预期保持一致性。其中包括用户未操作时和用户操作时

一致性的第一层表示产品的设计要和平台的规范保持一致。第二层是和自身保持一致性,不同的品牌有自己的调性,可以直接通过设计语言传达给用户,而且能够达到一个良好的品牌辨识度,成熟的产品有自己的设计标准。第三层是和用户认知保证一致,尽量使用大家约定俗成的图标,减少用户的认知成本。

第一层是理所当然的,否则通不过审核。第三层刚好符合惯性思维,很容易办成。关键在于第二层和自身保持一致,要让产品在不断迭代中还能一直保持调性是非常不容易的。

五.Error prevention(防错原则)

原文:通过网页的设计、重组或特别安排,防止用户出错。Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

当我们实践时如何使用这条原理呢?

1.按钮置灰或隐藏。对于不常用的按钮或负面功能进行隐藏

2.对于常犯的错误进行及时提醒或事前提醒

3.产品设计时尽量做到不让用户混淆,让用户一眼就能辨清

当用户操作错误的时候,系统会出现错误提醒,并且给正确操作出口。但比错误提醒各贴心的是提前防止用户操作错误。比如在撤销重做原则中提到的二次确认,就是一种防错机制,尤其是对于不可逆的操作来说。

六.Recognition rather than recall(易取原则)

原文:好记性不如烂笔头。尽可能减少用户回忆负担,把需要记忆的内容摆上台面。Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

当我们实践时如何使用这条原理呢?

1.在用户提交时把结果展示在用户面前,让他最后确认一遍,而不是直接结束

2.为用户提供历史记录,或草稿,让用户方便查询

3.以上是脑力上的易取,还有体力上的易取。让用户减少输入成本,尤其在移动端。a.提供选项,b.提供默认值,c.用手势代替输入

七.Flexibility and efficiency of use(灵活高效原则)

原文:中级用户的数量远高于初级和高级用户数。为大多数用户设计,不要低估,也不可轻视,保持灵活高效。Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

既要重视灵活又要重视效率,对于新手重视易用灵活,对老手重视效率

当我们实践时如何使用这条原理呢?

1.常用功能在最显眼顺手的位置,同时提供功能快捷键

2.对于新用户设置撤销重做功能

3.对于老用户设置历史记录功能,直接在以前基础上进行操作就行

八.Aesthetic and minimalist desig(易扫原则)

原文:互联网用户浏览网页的动作不是读,不是看,而是扫。易扫,意味着突出重点,弱化和剔除无关信息。Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

这条原则本质是对用户视觉注意力资源的规范,尽量让用户视觉注意力聚焦,花最少的精力获取注重要的信息

当我们实践时如何使用这条原理呢?

1.让用户注意力有承接性,不出现视觉跳跃

2.保证信息可读性,清晰明了,重点突出

3.如无必要,勿增实体。怎么简单怎么来,一个界面尽量做到一个核心操作加几个辅助操作,如果要增加选项(比如首页)一定不能超过9个!!!(7±2原则)

4.提示一次只给一个,而且是在必要时候,最好用手势动画来引导

5.沉浸式体验独占全屏

九.Help users recognize, diagnose, and recover from errors(容错原则)

原文:帮助用户从错误中恢复,将损失降到最低。如果无法自动挽回,则提供详尽的说明文字和指导方向,而非代码,比如404。Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

我们尽量避免用户出现操作错误,但当出现错误时,我们应该尽量去安抚用户的挫败感

当我们实践时如何使用这条原理呢?

1.用用户能够懂得语言告诉用户错误原因

2.给用户出口,确切的解决方法

3.安抚挫败感,用幽默的图片和文字博得一笑,给其他事情产生正面情绪(比如帮助寻找走失儿童)

十.Help and documentation(人性化帮助原则)

原文:帮助性提示最好的方式是:1、无需提示;2、一次性提示;3、常驻提示;4;帮助文档。Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.

帮助方式优先级:

1.无需提示。非常简单易懂,用户看界面就知道怎么操作,无需提示

2.一次性提示。只需要一次提示用户就懂如何使用

3.常驻提示。

4.帮助文档。稍微复杂一点的软件,虽然要让他尽量简单但帮助文档都是必要的

当我们实践时如何使用这条原理呢?

1.在需要的情况下自动出来提示

2.提示一次只出来一条

3.就在旁边,方便易取

4.鼠标悬浮文字说明

5.软件帮助方便易取

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,198评论 4 359
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,663评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 106,985评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,673评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 51,994评论 3 285
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,399评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,717评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,407评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,112评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,371评论 2 241
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,891评论 1 256
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,255评论 2 250
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,881评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,010评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,764评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,412评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,299评论 2 260

推荐阅读更多精彩内容