尼尔森十大交互原则总结
掌握基础地设计原则,让设计更合理!
前言
对于设计而言,我们前期需要掌握一定的设计基础,了解一些前辈总结的设计原则,站在巨人的肩膀上继续前行才能为我们的成长节省时间,并且有利于我们做出更合理的设计。
设计中有很多原则可供我们学习并运用到实际设计工作中,例如我们常说的对齐、对比、亲密性、重复性原则等等。这些简单的设计原则已经被我们当做了设计中的口头禅。也相信大家对这些原则都不陌生,但是这一期我想要总结的是对于产品设计而言非常重要且实用的尼尔森十大原则。
尼尔森十大原则由毕业于哥本哈根的人机交互学博士Jakob Nielsen发表,Jakob Nielsen对人机交互有很多研究,他提出的尼尔森十大原则主要是用来评价用户体验的好坏。这一原则被广泛运用于产品设计中,设计师在做产品UI、UX时将这十大原则考虑到产品设计中,让产品的用户体验更友好。下面我们一起来看看这十大原则具体包含哪些:
(一)系统可见性原则(Visibility of system status)
系统应该保持界面的状态可见,变化可见,内容可见。当用户在系统中进行操作后需要让用户知道发生了什么,并且在合理的时间内做出正确且适当的反馈。
用户在系统中进行任何操作时,系统都需要及时的给出相应的反应,无论是重要级别的功能操作还是简单的交互响应,都需要及时的告诉用户在当前行为下系统的变化,让用户更顺心的使用。
案例列举:
简单的交互响应:当用户将鼠标移动到可点击的图标按钮上时,通过对图标做高亮效果,区分图标默认状态及hover状态,让用户更能清晰的知道自己鼠标当前的位置,以及知道该图标是可点击的。
当图标是不可点击时,图标默认置灰,大部分用户基本已经熟悉了置灰的图标是不可点击和操作的,但是为什么不可操作呢?有的系统直接将图标置灰却不给出相应的提示,让用户对该功能产生质疑。为了用户更好地理解产品功能,消除用户的疑虑,在这种情况下系统也需要给出对应的反馈。
例如:当系统中某个功能该用户没有权限时,图标置灰,当用户鼠标移动到图标上时,出现不可点击的📈提示,并且需要给出悬浮的文字提示,提示不能使用的具体原因如“您没有权限X X,请向管理员申请XX”,有了这个提示后,用户在使用时才明白为什么不能使用,如果想要使用应该怎么办。即说明了不能使用的原因,也告诉了用户对应的解决办法,这样才能让系统的用户体验更友好。
(2)贴近场景原则(Match between system and the real world)
用用户的语言,用词,短语和用户熟悉的概念,而不是系统术语。功能操作符合用户的使用场景。
简单地说就是用用户熟悉的且符合场景的来传达含义。这样用户在使用系统时才能更加自然顺畅,达到降低系统学习成本的同时增强用户的好感度。
案例列举:
在系统中会应用很多的图标,图标一般代表一个功能入口,而设计师在设计功能入口图标时就需要考虑图标的识别性,要明白该功能的真实业务场景,并且选择用户熟悉的标识来代表该功能的入口。这样用户在看到该图标时就能立即明白图标的作用,不用过多的思考。
例如系统中常用的删除图标采用垃圾桶🗑样式、编辑图标采用一支笔✏️的样式、消息图标采用铃铛或者信息✉️的样式等等。在系统设计中采用用户在生活中熟悉的东西来代表功能图标,用户就能毫不费力的明白功能的作用。系统也不需要为功能图标做过多的解释说明,系统最好的设计就是能让用户一眼看到就能明白,无需解释。
由于B端系统业务的复杂性,也无法做到所有的场景都去掉解释说明,但是最好在做设计时能尽可能的延用生活中用户所熟知的(这里不仅仅指图标设计,包含其它布局、交互、配色等),保持用户习惯同时降低用户学习成本。
(3)可控性原则(User control and freedom)
用户在使用系统时,会出现误点或者操作错误的情况,系统需要满足用户在这种情况下能够及时的恢复到错误发生之前的状态。
特别是对于B端系统,由于业务的复杂性及重要性,用户的每一个操作都有可能影响整个流程是否能够完整地进行,撤销恢复到初始状态的功能极为重要。
案例列举:
在系统中用户删除数据后,再按键盘ctr+z,数据就会恢复到初始状态,在很多的工具软件中,都带有撤销恢复的按钮,快捷键只是方便用户使用。另外一些特殊场景的数据无法满足在当前页面撤销恢复,也会有一个回收站收集删除的数据,用户可以在回收站页面再次撤销恢复,也能满足用户误点和错误操作后能够挽回损失。
(4)一致性和标准化原则(Consistency and standards)
系统设计需要遵循平台的惯例。现在用户已经使用过市面上大部分软件,市面上的产品设计已经存在一些约定俗成的规范。用户已经习惯了市面上的设计,所以在非必要的情况下需要保持布局、用语、功能、操作、配色等形成一致。
案例列举:
B端系统整体页面布局导航栏在左侧(居多)或者顶部,用户已经习惯了这样的布局方式,右侧为内容展示区,我们在做设计时无需再寻求标新立异的设计,因为在不符合用户习惯的场景下做的设计也许用户并不会为此买账。
另外列举一个配色上的一致性原则,当系统提示成功、警告、错误信息时,设计在选择配色时,需要选择符合用户熟知的配色,成功使用绿色、警告使用橙色/黄色,错误使用红色。(可看antdesign的组件规范)
(5)防错原则(Error prevention)
更用心的设计防止这类问题发生,在用户可能犯错时进行提醒。
前面有提到回退原则,这里的放错原则与回退原则不同,防错原则是在用户进行操作时就及时给出提示,让用户二次决定是否需要进行此操作,这样用户出现误点的可能性会更小。上面提到的一些特殊业务场景下,用户操作后是不可撤销恢复的,例如删除数据,但是没有做回收站,操作不可逆,就更需要在用户进行操作时给出相应的提示。
(6)协助记忆原则(Recognition rather than recall)
尽量减少用户对操作目标的记忆负荷,动作和选项都应该是可见的。用户不必记住一个页面到另一个页面的信息。系统的使用说明应该是可见的或者是容易获取的。
在B端系统中,一些复杂的业务用户在短时间无法全部完成,会在一段时间内才能完成,当用户再次进入系统时,需要告知用户当前任务的情况,让用户能够及时知道接下来做什么。
案例列举:
工作中曾设计过一个记录流程图节点和路径的位置,当用户在查看流程图时,会根据分析业务情况调整流程图组件的路径和节点,对于流程分析任务是一个长时间的思考,需要细致的分析得出结论,所以为了便于分析师再次进入到流程分析页面时能保持在上次分析状态,这里在设计时就运用了协助记忆原则。当分析师退出当前分析时,系统会记录当前分析状态,保证分析师再次进入页面时能更快进入分析。
(7)灵活高效原则(Flexibility and efficiency of use)
允许用户进行频繁的操作,更加便捷灵活的代码和反馈(这是百度的解释)。
这一原则我个人归纳总结为:灵活的代码,高效的交互。
灵活的代码:指的是研发人员在开发系统功能时要考虑代码的灵活性,扩展性,当业务发生变化(修改、增减业务)时,研发人员所开发的功能能够满足变化多端的需求,不能只考虑当前需求,不能将代码写死无法扩展。
对于B端而言,每家客户的需求都会存在较大的差异,系统会保留企业公用的功能需求,存在差异的需求会根据客户的实际需求定制化开发。所以系统也需要实现灵活定制化开发的需求。
高效的交互:需要在达到需求的情况下精简系统的交互设计,用最简单快捷的交互方式达到用户需求的完成,减少不必要的交互。当用户在使用方面存在疑问时,系统也需要及时给出反馈及解决方案,让用户的问题能够得到解决。
案例列举:
一个简单的灵活特性的案例,系统的主题色需要根据不同的客户定制化配色,系统需要满足界面中所相关的背景、按钮等配色都能灵活调整。那么开发人员在开发系统相关页面的配色定义时就需要考虑后期的灵活扩展。
(8)审美和简约设计原则(Aesthetic and minimalist design)
系统界面中不应该包含与当前页面及需求无关的信息。
系统界面需要满足简约的原则,对于B端系统而言,每一个字段、每一个图形、每一句话都会影响实际业务的真实性。每个需求都会与客户重复确认再展开设计与开发,不能在客户确认的需求上画蛇添足,否则只会适得其反。
另外对于美观设计而言,也是同样的道理,B端系统更注重的是业务、效率、质量,不需要像平面设计那么华丽,界面设计需要达到简约、易用。不要添加不需要的元素做装饰,过多无效的装饰只会干扰用户的使用。聚焦点一定是重要的、客户所关心的。
案例列举:
系统中常见的数据统计图表,一般企业的管理人员及高层会比较关心数据的总览,所以很多B端系统中都会做一个仪表盘模块,对于使用者来说更关心的是数据而不是绚丽的配图,用户更想一眼看到所关心的数据。而我见过很多仪表盘的设计界面采用了大量的底部背景装饰,让整个仪表盘看起来丰富多彩却找不到重点,这种非必要的设计只会影响用户使用体验,看的眼花缭乱却看不到自己想要的结果。
(9)容错原则(Help users recognize, diagnose, and recover from errors )
错误信息应该用语言表达(不要用代码),较准确地反映问题所在,并且提出一个建设性的解决方案。
用户在使用系统时会出现各种各样的错误,比如填写表单时字段信息填错、登陆账号密码输入错误、网络异常出错等等。系统允许出现这样的错误,在出错时及时给用户相应的反馈,让用户能及时知道错误以及出现错误的原因,如果系统能同时附上错误的解决办法就更友好。用户才能顺利的完成自己的任务。
案例列举:
拿一个最简单的登陆页面容错原则运用举例,用户经常将登陆账号和密码输入错误,很多时候用户也会忘记自己的账号和密码,毕竟现在市面上各种软件,用户很难记住每个平台的信息。系统允许用户输入任何信息,只需要当用户在输入账号密码出错时,系统应该及时给出反馈,在对应的输入框下显示提示信息。当用户对于自己的账号密码信息完全不记得时,系统也会给出忘记密码/找回密码等相关解决方案,让用户能够快速找回账号密码信息。
(10)人性化帮助原则(Help and documentation)
有必要提供帮助和文档。任何信息应容易去搜索,专注于用户的任务,列出具体的步骤来进行。帮助性提示最好的方式是:1、无需提示;2、一次性提示;3、常驻提示;4;帮助文档。
虽然常见的系统会存在很多相似之处,但是由于B端系统是具有强烈的业务属性,很多业务场景都是该平台独有的,很多功能也是根据不同企业的实际业务需求定制化的,所以会存在一些新的设计与理念。
为了保证用户在使用系统时能快速上手操作并完成任务,对于一些业务上的专业术语系统需要给出相应的提示帮助用户更好的理解业务并顺利完成任务。
案例列举:
B端系统中经常会有表单的填写,表单的字段信息都是与实际业务相关,很多字段对于不了解业务的人员来说并不熟悉,所以需要在字段信息处备注介绍详情,让用户可以随时查看。常用的备注方式有图标代表悬浮显示详情,或者直接显示文案在字段后面或者输入框下面。
其它例如系统中操作指引以及帮助中心模块设计都是属于帮助原则。
总结
在设计中有很多设计原则,这里总结的只是其中一小点,希望对大家有所帮助,有不对的地方希望大家指正!













































































