- 一.尼尔森十项可用性原则的创立者和来源
- 二.尼尔森十项可用性原则适用在什么场景
- 三.它的作用是什么?为什么要有可用性原则?
- 四.10项尼尔森可用性原则详细讲解
- 1. 系统状态可见原则 System status is visible
- 2. 环境贴切原则 Match between system and the real world
- 3. 撤销重做原则 User control and freedom
- 4. 一致性原则 Consistency and standards
- 5. 防错原则 Error prevention
- 6. 易取原则 Recognition rather than recall
- 7. 灵活高效原则 Flexibility and efficiency of use
- 8. 易扫原则 Aesthetic and minimalist design
- 9. 容错原则 Help users recognize, diagnose, and recover from errors
- 10. 人性化帮助原则 Help and documentation
- 总结
编者按:在互联网产品的设计过程中,无论是产品经理还是交互设计师还是用户体验设计师应该对尼尔森十项原则都不会陌生。它在产品的开发和落地的整个过程,以及提升用户体验和设计质量方面,都是一个值得去遵循的设计方法论,它是一套相对统一和通用的体系以及评价标准,让我们的评估有据可依,它从人机交互的发展过程中总结出一些科学的,能解决问题的,以人为本的方法原则,让产品的设计者在设计的过程中能够更加清晰自己的设计方向,能够设计出更合理的更贴近用户需求的产品。
文章来源:简书 作者@Miuka设计包
本文是关于尼尔森10项可用性原则的系统整理和拓展说明,是自己的学习总结,也是一种分享。主要结合了日常生活中积累的优秀产品的案例来逐一说明尼尔森10项可用性原则的具体应用,便于读者更好的理解吸收并在工作中应用。
阅读全文大约需要15分钟左右的时间,适合各互联网从业者以拓展思维积累专业知识为目的进行阅读和实践。
一.尼尔森十项可用性原则的创立者和来源
尼尔森可用性原则的创立者:Jakob Nielsen博士
Jakob Nielsen博士是尼尔森诺曼集团的用户倡导者和校长,他与Donald A. Norman博士(苹果计算机前研究副总裁)共同创立了尼尔森诺曼集团。尼尔森博士建立了简单易用性机制“discount usability engineering”运动,快速和便宜地改进用户界面,并发明了几种可用性方法,包括启发式评估。他拥有79项美国专利,主要是使互联网更容易使用的方法。
尼尔森1995年1月1日发表了「十大可用性原则」。1995年以来,他通过自己的 Alertbox 邮件列表以及 useit.com 网站,向成千上万的 Web 设计师传授 Web 易用性方面的知识,尽管他的一些观点可能带来争议,至少在 Web 设计师眼中,他是 Web 易用性领域的顶尖领袖。
Jakob Nielsen对人机交互有很多研究,界面/交互/转换率/晕轮效应⋯⋯等,可以作为了解他的拓展性阅读材料。
这十项原则是他在分析了两百多个可用性原则的问题之后提炼出来的十项通用性原则。
二.尼尔森十项可用性原则适用在什么场景
适用在产品的启发式评估的过程中
启发式评估也被称为经验性评估,是专家评估的一种。在产品开发的前期准备和中期阶段可以作为一种简易的可用性评估方法,是由专业的评审人基于专业的知识和经验原则进行产品的评估,在产品立项之前或者产品上线之前快速找到产品的可用性问题。(这里就不对启发式评估的方法展开讲,感兴趣想要了解的可以自行搜索。)
三.它的作用是什么?为什么要有可用性原则?
1.由于评估者知识背景和经验的不同,很难以相同的标准去评估同一个产品或者内容,而可用性原则就是在建议相对统一和通用的体系以及评价标准,让我们的评估有据可依。
2.这些评估原则的作用是帮助评价者找出可用性的问题,而不是限制仅仅找出与这些启发式矛盾的问题,仅仅是一个参考而已(切勿做为一切问题的评价标准)
3.解决经验不足导致在刚开始做评估时不容易发现问题的矛盾。
四.10项尼尔森可用性原则详细讲解
1. 系统状态可见原则 System status is visible
原文:用户在网页上的任何操作,不论是单击、滚动还是按下键盘,页面应即时给出反馈。“即时”是指,页面响应时间小于用户能忍受的等待时间。 The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
简单说明:系统应该在适当的时间内做出适当的反馈,告知用户当前的系统状态。
案例:百度云盘pc端中,对当前选择的内容用深灰标记,当有下载内容时会显示正在下载的数量
如何应用该原则
1.(where)用户需要时刻知道自己处在系统的什么位置,这样能给用户一种可控感,知道自己从哪里来,要到哪里去。
2.(how)对于新手用户来说,需要提供必要的信息,否则容易产生迷失。
3.(what I doing)让用户知道自己在做什么(用户需要知到自己的操作是否被系统感知,所以,在用户操作后,应当第一时间提供反馈告诉用户这项操作是否被系统接受了。)
案例:探探app的选择匹配对象的滑动功能,用户向左滑动是不喜欢,向右滑动是喜欢。在滑动时立刻触发动效,告诉用户这个手势是有用的,并且同时是用来控制选择的。
4.(what Syetem doing)让用户知道系统在做什么(当系统在运行中时,尽可能向用户提供系统运行的状态)
案例1:得到app中,选择要下载的内容时会即时显示条数以及大小
案例2:当有正在收听的内容时会在app底部浮现,并在播放按钮上显示进度
案例3:在淘宝外卖中点餐,点餐完毕之后会提示用户骑手和店家分别处在什么样的状态,让焦急等待的用户直到自己大概还需要多长时间去等待。
5.(what Syetem done)让用户知道系统做了什么
-让用户知道操作的结果,从而进行下一步操作
-需要尽可能给予相关的信息反馈,即便是在没有结果时也是一样。
例如微信的“消息撤回”功能,之前有很多人讨论说微信的撤回功能最尴尬的是撤回不能默默的撤,非得有个文字提醒,是否有必要,这里可以设想一个场景:你在接受到一条微信消息提醒的时候打开去看,却发现什么消息都没有,你是觉得是微信的问题还是你自己的问题? 这个时候给予用户相关的信息就显得特别重要,意在提示双方用户刚刚发生了什么。
6.(feedback)利用多种形式的反馈
-反馈可以通过文字,动效,声音,震动,界面元素的变化等多种方式给用户提示。
滴滴打车,司机的车子移动,让用户减少等待的焦虑
7.对系统响应延迟进行反馈
-当系统响应小于1秒时不会打断用户思考,不需要特别的反馈。
-响应时间越长用户满意度越低,以前的说法是10秒钟是上线,但是现在互联网上信息高速无死角的传播速度来看,这个数字还应该缩短更多。当响应时间较长时,需要给出必要的反馈。
案例:fit time 内容未加载完时,会用闪动的占位条来降低用户等待的焦虑感
与这个可用性原则相关的问题有哪些?
1.缺少必要的反馈,没有清晰的系统状态 2.反馈不够持久,用户没有足够的时间注意到 3.反馈没有立即显示 4.反馈不容易看到或者不容易理解 5.提供了不必要的反馈 6.让用户误解
2. 环境贴切原则 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.
简单说:产品应该使用用户的语言来“说话”,使用用户熟悉的方式,词语,概念,符合真实世界中的习惯。比如95后的二次元社交软件和专为职场人士设计的产品,说使用的语言一定是不一样的。
如何应用该原则
**
1.使用用户的语言
-保证用户的语言是用户能理解和联想的
-并不是大众的语言,而是目标用户熟悉的语言(针对儿童开发的语言,针对专业的统计人员开发的工具软件,大众的软件如果用了隐晦的语言,就有可能导致用户看不懂)
左边是一款针对职场人的社交沟通软件,与右边的针对95后的以语言cosplay为主要玩法的社交聊天软件的“用户语言”就截然不同
2.符合现实世界中的使用习惯
-将产品的使用习惯和现实中产品的使用习惯联系起来
mac电脑,收起某个应用时,会出现被吸过去的动态效果
3.使用现实世界中的隐喻
网易云音乐,大家都不陌生了
4.操作手势符合联想
-使用的操作手势,应当是用户自然能够联想到的,不要轻易定义和创造用户难以联想到的手势,比如说IOS中对照片的放大缩小。
与这个可用性原则相关的问题有哪些?
1.使用了用户不熟悉的语言 2.系统的语言是以系统为中心,而不是以用户为中心 3.任务流程和真实使用的流程不一样 4.系统结构不符合用户对真实世界的理解 5.系统使用的暗喻或者比拟方法不容易理解
3. 撤销重做原则 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.用户可以自由的退出
-用户在感觉到迷失或困惑的时候,需要能够快速撤销的过程
-用户使用系统的过程,是一个试错的过程,在开始不熟悉的时候会进行很多的尝试。如果发现错误就立马改正错误,直到成功为止
3.不可逆转的操作需要警告
-重要的不可逆转的操作需要给用户明显的提醒,不然会对用户产生严重的影响
KEEP的退出提示
与这个可用性原则相关的问题有哪些?
1.在不可逆转的行动前没有提供足够多的警告 2.没有适当的时机提供取消的功能 3.取消功能不明显或是很难找到 4.不支持撤销
4. 一致性原则 Consistency and standards
原文:同一用语、功能、操作保持一致。 Users should not have to wonder whether different words, situations, or actions mean the same thing.
简单说:同一产品内,产品架构导航,功能名称内容,信息的视觉呈现,操作行为交互方式等方面保持一致,产品要与通用的业界标准保持一致。
如何应用该原则
**
1.产品内部保持一致
通用的信息应该使用一致的用词/外观和布局。可以帮助用户快速学习,记忆和熟悉产品的功能。
微信读书的布局,配色和元素,icon的含义都保持着高度的一致性
2.产品的不同版本之间保持延续性
-产品的不同版本之间,主要的功能,设计元素等,尽量有一定的延续性,避免老用户产生困惑。
-例如:IOS系统的几个版本之间都有一定的创新,但是仍然保留了很多原有的设计规范
iOS7的系统
最近更新的iOS11
3.与业内的产品保持一致
用户在使用其它产品,特别是大众型产品时已经形成了一定的习惯,不要轻易的违反业界的规范(例如,现在用户已经普遍养成了下拉刷新的习惯,你就不要刻意的给它设计一个下拉跳转到下一页或者其他更匪夷所思的结果,前几年微信对这个功能做过一次创新,把下拉刷新变成了下拉拍照,目的在于方便用户快速的使用朋友圈记录当下的精彩瞬间,但是还是被不少人吐槽“受惊吓”了。)
-不要创新,尽量不要给手势去定义新的用途。
与这个可用性原则相关的问题有哪些?
1.界面元素的外观/ 布局和分组不一致 2 界面元素的命名不一致 3.系统反馈信息的格式不一致 4.系统提供不一样的方法来操作相似的对象 5.表达含义不一样,例如在不同的地方红色代表不同的意义。 6.设计标准和通用标准不一致
5. 防错原则 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 利用用户的联想防止错误
-利用颜色,动效等提示警示信息
例如:重要的操作按钮,比如退出删除按钮,都会用红色来做出警示,让用户直接能感知到可能发生的错误。
与这个可用性原则相关的问题有哪些?
1.输入信息时,没有告诉用户的格式 2.缺少非语言暗示 3.界面上不同的物体太相似 4.没有对可能产生严重后或的操作进行提示和确认。
6. 易取原则 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.将选择对象可视化
-将选择对象/动作/选项可视化,使得用户一看就懂。
Keynote提供可视化图形向导,使得用户非常容易选择
2.丰富的记忆线索
-抽象图形+文字,提供更多信息,帮助用户确认
抽象的图像,再配上名字,避免用户需要回忆才能想起图形说代表的含义
其他例子:电商订单确认页面,需要提供完整的信息,在修改资料页面上保留原有的记录,在原有记录上进行修改而不是重新输入。
3.使用通用的命令
-通过使用通用的命令,减少用户的记忆负担.
例:使用通用的快捷方式:如复制黏贴,通用的操作手势
与这个可用性原则相关的问题有哪些?
1.系统的使用过于复杂,用户不得不记忆复杂的命令、 2.界面提供的信息不及时,用户不得不自己从系统的另一个部分找到相关的信息。 3.图像或符号难以理解,甚至误导用户。 4.菜单,选择或者链接有太多层次。
7. 灵活高效原则 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. 提供快捷健
-为频发操作的功能设置快捷键
PS中有很多快捷键功能
- 允许用户使用重复操作
-对用户频繁使用的部分,提供重复使用的功能或模板
外卖软件中的快速下单功能,保存上一次的操作记录。
3.提供系统默认值
-通过提供系统默认值,而减少用户多余的操作;
网易严选的购物流程中,刚刚加入购物车的商品会在查看购物车时自动勾选上
印象笔记会在你移动笔记之后,记住上次移入的笔记本,并在下次操作时可继续移动到该笔记本
与这个可用性原则相关的问题有哪些?
1.系统缺少自动化,没有自动地执行下面的任务。 2.系统没有提供应有的默认值。 3.默认值不正确 4.使用系统需要太多的控制动作 5.系统没有提供捷径
8. 易扫原则 Aesthetic and minimalist design
原文:互联网用户浏览网页的动作不是读,不是看,而是扫。易扫,意味着突出重点,弱化和剔除无关信息。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.避免界面元素过于杂乱
-同时呈现过多元素,动效
当然!这并不是正面案例,这只是一个大家再熟悉不过的辣眼睛的案例
再对比一下36氪的官网,不明觉厉
- 对重点信息突出显示
-用户注意力资源有限,应该保持信息精练,有突出,有弱化
谷歌翻译的网页版,将重要的内容集中中两个文字区域,并用蓝色描边的边框来强调当前的输入区域,着重强调“翻译”功能
与这个可用性原则相关的问题有哪些?
1.用户界面上的元素太大或者太小 2.元素的颜色,形状或者文字不适当,不容易识别 3.界面元素的移动太快,太慢或者不容易差距 4.界面过于拥挤,界面元素密度分布不均匀 5.不同的元素太相似,按键或者链接看上去像一般的文字。
9. 容错原则 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.引起用户的注意
-当错误发生时,提示信息一定要直观醒目,文字要简单易懂 。
Keep中的断网模式下的提示
2.提供建设性建议
-当用户遇到错误时,尽可能的提供有实质意义的信息,比如:问题是什么,如何从错误中恢复等等。
3.提供自动纠错的功能
-当如果系统能够帮助用户自动甄别出错误,并进行及时的修正,将给用户带来极大的使用便利。
豆瓣app中会对搜索不准确的内容进行纠错
与这个可用性原则相关的问题有哪些?
1.用用户不理解的语言进行提示,如404错误 2.没有给出有效的建议 3.错误信息使用户感到迷惑 4.错误信息用词不当
10. 人性化帮助原则 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.
简单说:提供帮助信息,帮助信息应当易于查找,聚焦于用户的使用任务,列出使用步骤,并且信息量不能过大。
如何应用该原则
- 方便用户查找
-帮助文档入口要容易找到,帮助信息要方便用户查找
网易考拉在个人中心页面的“帮助中心”,为用户解决购物相关的各种问题
- 便于用户理解
-避免使用专业术语,使用图片或者图表
-除了文字外,还可以使用示意图,操作步骤等,方便用户应用
淘宝app在增加新的功能时,会用新手引导的方式向用户做简明扼要的说明
3.便于用户应用
-在操作的同时,同时能见到帮助信息。
IOS系统中,在功能设置的同时提供帮助提示
与这个可用性原则相关的问题有哪些?
-帮助信息或者用户手册不存在 -帮助信息没有意义或使用户更加迷惑
总结
如果你觉得有所收获,可以随手转发给需要学习它的朋友,设计和创新都是在前人的肩膀上看的更远,思考的更多,你每一次对自己的知识体系和思维体系的迭代,都是为了更加接近世界。