各式各样结构设计自然法则都能充分运用于数十家情景,能是可视化结构设计,也能是界面结构设计等,通过结构设计自然法则展开应用领域,提升使用者新体验,译者归纳了安德森五大易用性准则的后四条,并紧密结合作战经验,深入细致探讨怎样应用领域,希望对你有所启迪。
推荐一个较为新颖的结构设计自然法则,上一则他们聊了前面5条,今天他们来谈谈前面的5条。
能说现在的任何网络商品都能看到这些方法论的课堂教学,此次主要与以较为多的事例展开两栖作战预测。
安德森的五大易用性准则是安德森教授在预测了毕鲁图易用性问题的基础上,提炼的九项可视化结构设计准则。被广为运用于页面、APP以及各式各样可视化式领域。
要注意的是,这10项准则是预测方法(heuristics)的、广为的经验自然法则,能辅导他们极具价值的思索界面结构设计。
各式各样结构设计准则都可充分运用于各地方,能是可视化结构设计,也能是界面结构设计,深入细致了解各式各样结构设计准则,让结构雕塑家在做结构设计的时候能找出更快的软件系统,提升使用者的使用新体验。
方法论如是说:
弗兰克·安德森(Jakob Nielsen)是理工学院毕业于斯德哥尔摩的瑞典技术理工学院的可视化式教授,堪称易用性试验的泰斗,2006年4月,并被列入美国计算机系统专业委员会可视化式理工学院,被突显可视化式课堂教学的终生荣誉奖。
安德森于1995年1月1日刊登了「五大易用性准则」,该准则被各阶层结构雕塑家奉为课本般存在。虽然20十多年过去了,但是对于时至今日的商品新体验结构设计仍然具有很大的参照象征意义。
一、易取准则
易取准则的根本目标是提升使用者在界面上的操作效率,系统应直观地协助使用者完成任务。
识别比回忆要好,对于路径较长的操作,他们更应该协助使用者记忆。
该准则在结构设计中的体现:
1. 易取准则-易扫描使用者心理学研究发现,网络使用者浏览页面的动作不是读,不是看,而是“扫”。这是网络使用者浏览的主要方式。所以他们在结构设计的时候,需要清晰的视觉层次结构,突出重点,弱化和剔除无关信息,降低页面干扰,来减轻使用者阅读成本。
2. 易取准则-让使用者选择而不是填写比起让使用者输入,让使用者选择更能降低使用者的记忆成本,更快地辅助使用者做决策。
如果,有很多的信息或者选项是使用者高频率会选择的,结构雕塑家不妨给使用者提前做好选择,提供默认选项,如下图。
通过智能读取使用者之前填写过的信息,或者智能识别等形式,减少使用者记忆负担与操作负担。
常见的是寄快递-新增地址,将使用者复制的文本字符类型展开识别并匹配,将有用的信息内容提取出来,对新体验而言显得高效又智能。
或者淘宝购物确认订单时,系统会自动为你带入之前的商品信息,包括选择的商品规则、数量、价格、默认记录显示常用的地址等。这些信息虽然之前都选择过,但是需要使用者在购买前二次确认,由于信息较为多,使用者很难记忆,所以确认订单再展示出来更加合理。
比如:
用手机登录时,收到的验证码直接展示在软键盘上,使用者无需记忆也无需输入,直接点选即可登录;
美团APP中,当使用者选择商品时,系统会自动计算商品价格和满减后的价格,还会帮使用者记录选择了哪些商品以及份数,不需要使用者自己花时间去计算还差多少才能满减等,减少使用者记忆负担,同时节省使用者点外卖的时间,这也用到了易取准则。
订单页面若某信息需要用户从一个页面复制到另一个页面完成查询或编辑输入,那就有必要为该信息提供快捷复制功能,如订单号紧跟着一个复制按钮。
如果,他们在搜索一个歌名的时候,记不住完整的歌曲名,他们只要输入关键的几个词,系统就是帮助他们记忆,出现相关的搜索。
4. 易取准则-草稿箱或历史记录作为使用者,你不记得的操作,系统能帮你记录。为使用者提供历史记录,文本创作的过程中自动保存草稿,让使用者方便查询自己的进程,这就是信息易取准则的结构设计。
保留历史,最为常见的就是为使用者保留历史搜索和历史浏览、储存账号和密码。视频APP会详细记录使用者的观看记录,当使用者没有看完某部电影时,下次进入直接从断点续播上次播放的位置,无需使用者记忆上次看到哪里了;
不只是观看记录,视频软件还会帮你记录同一账号在不同设备上的登录记录,观看记录也会在不同设备之间展开同步。
5. 易取准则-可视化将选择的对象,动作,选项可视化,让使用者一看就懂。注意图标符号化能让人理解,避免引起误解。
抽象图形+文字,提供了更多的信息,更加丰富了记忆效果,避免了使用者需要记忆才能想起图形代表的含义。他们常用的app导航栏都是以这种icon和文字相紧密结合的形式,这就是很符合易取准则的例子。
6. 易取准则-内容可预期在使用者使用商品的过程中,会有一些需要使用者记忆的内容、或者操作路径,在结构设计的时候他们要避免使用者记忆,把信息直接提取出来,送到使用者手里。同时每个页面传递的信息量尽量少,减少使用者的阅读压力。
常见的例子是各类优惠券,结构设计的时候会有明确的位置说明限制时间,类别等等,同时还会有清晰的入口引导去使用或者规则的入口。
7. 易取准则-行为输入代替字符输入这一点其实也非常好理解,一个简单的动作,比打字要轻松得多,常见的就是在设备解锁的时候,用手势解锁替代密码解锁。
随着技术发展,有了更多的行为代替输入的方式,比如指纹识别和面部识别,用简单的操作,就能达到进入系统的目的,这就避免了使用者需要较多的操作和密码的记忆。
二、灵活高效准则
灵活易用准则不仅是一个可视化结构设计准则,也代表了一种软件商品结构设计理念:系统既要做得简单、易用,让所有使用者用起来得心应手;
灵活易用准则的根本目标是保持系统的灵活性,以满足不同使用者的不同需求。
既要提供必要的帮助,让刚入门的初级使用者顺利上手,还需要支持灵活的个性化定制,让高级使用者能够快捷高效使用高频功能,充分发挥其价值。
该准则在结构设计中的体现:
1. 灵活高效-提供定制化服务让使用者灵活定制的最典型的例子是各类软件和App的配置功能,基本上所有软件都会提供定制化功能,从快捷键设置,到页面布局,再到自定义参数,软件系统会尽量提供全面的个性化设置功能,来满足不同使用者的使用诉求和习惯,提升使用者的使用效率和新体验。
例如支付宝首页,使用者能自定义首页的应用领域。对于使用频率较为高的老使用者来说,这是一个非常方便的功能。
还有一种是系统极具使用者常用自动整理归纳,以提升使用效率,减少使用者多余操作。
比如:微信的聊天表情,由于能选择的表情很多,正常情况下使用者很难快速找出自己想用的表情。而使用者的使用习惯往往是循环使用其中的某几个,所以把最近使用的表情展现出来,会极大的提升使用者的寻找效率。
除了从新老使用者的角度对使用者做区分,还能从其他维度区分使用者,针对不同使用者做不同的功能。
比如:微信为了让中老年使用者使用方便,推出了关怀模式。在关怀模式下(下图)文字更大、色彩更强、按钮更大,还能使用“听文字消息”的功能。这些功能充分考虑了“中老年使用者”的需求和痛点,让商品更加灵活易用。
2. 灵活高效-提升使用者使用效率灵活高效准则在可视化结构设计中使用会提升使用者使用效率,例如微信聊天页面中,当使用者输入某个字词之后,系统会自动帮你匹配相应的表情包;
当你输入某个词之后,输入法会帮你自动联想接下来你可能会输入的词;
截图后进入微信聊天页面后,系统会将你刚截的图前置,它会自动判断你可能想发送该截图。如下图:
3. 灵活高效-“跳过”按钮通过使用者快捷跳过的入口,比如常见的:引导页、操作手册、还是开屏广告,有“跳过”或者”立即进入“按钮真的很贴心。
4. 灵活高效-允许使用者重复操作对于使用者频繁使用的部分,提供快捷的重复使用操作,比如:外卖app,使用者能快捷地再来一单,同时保存上一次操作记录。
5. 灵活高效-各取所需在结构设计功能时,最好能考虑到不同层次使用者的需求,以此来让使用者「各取所需」(需要平台有多类型使用者);比如常见的Word、Photoshop等,有一个“二八定律”,就是说80%的功能是给20%的使用者使用的。
结构设计这类商品时,最常用的20%的功能一定摆在最显著的位置上,方便所有使用者使用,而80%的高端功能,要适度隐藏,使得整个商品看起来尽量简洁、美观。比如Sketch的工具栏和快捷键就是给新手或资深使用者准备的。
6. 大数据智能判断淘宝的首页每个人所推荐的商品都不相同,淘宝后台根据使用者的浏览习惯,购买/收藏记录等大数据智能判断使用者的喜好,对商品展开千人千面的分发。
但是切记不要太过依赖大数据算法的判断,因为一旦形成这种模式,会给使用者造成回音壁效应,你越喜欢的东西系统就越给你所推荐,其他的商品就像回音壁一样被吸收过滤,使用者永远没有办法发现新的东西,让使用者的选择永远都在一个死循环,所以做千人千面结构设计时一定要适度。
三、优美简约准则
优美而简约准则的根本目标是让使用者快速找出界面的重要信息,引导使用者的视线及操作行为。
“快扫”是网络使用者浏览的主要方式。他们熟知的商品结构设计的四大基本准则:亲密性、对齐、重复、对比,就是使页面优美而简约的方法。
该准则在结构设计中的体现:
1. 优美简约-视觉层级关系明显建立清晰的视觉层级,越重要的内容越突出,能够方便使用者无障碍地浏览信息,提升使用者操作与
他们通过颜色、大小、字体的字重、对比度、元素的间距、特殊造型、动效等来表现。
2. 优美简约-避免界面元素过于杂乱避免界面呈现过多元素,包括动效、配图、icon、按钮等等,降低使用者的视觉干扰。保留商品最主要的信息,如果不是优先级最高,要尽一切可能避免去影响商品的简洁和美观,可采用大留白增加页面呼吸感,聚焦内容。
3. 优美简约-对重要信息突出显示使用者注意力资源有限,应该保持信息精炼,突出重要信息,弱化次要信息。
上面两个事例通过加粗放大、标记颜色,从而让页面简洁,且突出重要信息。
四、容错准则
容错准则的根本目标是让那个使用者在操作出错后还能挽回错误的余地,从而给使用者一致商品很安全贴心的感觉。
系统需帮助使用者识别、诊断、并为使用者从错误中恢复提出建设性的软件系统。通过提示性文字或者插图让使用者意识到出错了,比如404页面的情感化插图、弹窗提示用户出错等。
该准则在结构设计中的体现:
1. 容错准则-引起使用者注意当发生错误时,提示信息一定要直观,视觉上能够引起使用者注意,可视化处理,文案要简单概要,并给出软件系统。
例如删除订单时,会提示二次确认,避免用户误操作。
2. 容错准则-提供软件系统在出错界面给出软件系统,能是文字提醒或者按钮跳转等形式,帮助使用者解决问题。比如缺省页的结构设计除了配置插图还会有提示文案与操作按钮,引导使用者去操作,去进一步解决问题。
3. 容错准则-帮助挽回损失系统能帮助使用者自动甄别错误,并及时展开纠正时,将会给使用者带来极大的便利,撤销或者找回功能,都是帮使用者把损失降到最低的有效方法。
比如微信信息的消息撤回重新编辑,相册的最近删除、回收站等等功能。
五、人性化帮助准则
人性化帮助准则的根本目标是使用者在使用商品的过程中有所依循,因为商品已经贴心地为他们准备好了帮助方式,或者即时提示和反馈,或者客服。
人性化帮助使用者最好的方式分别为:
最好的就是没有提示,使用者就能看懂与应用领域商品;其次是一次性提示,提示一次使用者就懂怎样使用,比如第一次进入app或新功能上线的引导结构设计、通常为气泡形式。常驻提示需要一直固定在某个位置实时帮助使用者。
最后就是帮助文档了,一般用于解释规则或者热点问题,通常以超链接的形式存在于页面中,或者以集合形式位于设置页中,此时需要注意要易于检索。
该准则在结构设计中的体现:
1. 人性化帮助-方便使用者查找帮助文档的入口容易找出,帮助信息方便使用者查找。常见的方式有:鼠标划过悬浮文字说明,帮助使用者更快地理解。
2. 人性化帮助-便于使用者理解使用者通过查看帮助文档来学习新功能,相对较为麻烦。如果能将教程和功能放在一起,使用者能“边学边练”,就更容易让使用者理解。
提示语避免使用专业术语,尽量使用图片或者图形,同时处理文字外还能使用示意图,操作步骤等,方便使用者应用领域。
3. 人性化帮助-便于使用者应用领域在操作时的帮助信息,比如帮助悬浮按钮:一直出现在页面固定位置,方便使用者遇到问题寻求帮助。
4. 人性化帮助-信息引导搜索时,预搜索词直观地显示出来,能让使用者更快地做出搜索判断。
微信转账页面,当使用者输入金额较大时,会在第一位数字下方提示转账金额的人民币单位,目的是为了避免使用者输入错误金额导致资金损失;
5. 人性化帮助-步骤引导复杂的流程能通过分步骤来引导使用者逐步完成,而不是一次完成所有任务。个性化的提示一次就够了,使用者用过一次就知道其用法。
现在很多C端商品普遍已经做了良好的可视化结构设计,能帮助使用者快速学习使用,而不用阅读、理解复杂的说明文档。
然而,B端商品的复杂性比C端商品高很多,因为B端商品蕴含很多业务流程的规则,系统中的一个按钮可能代表了一个复杂的业务处理规则,如果不了解整个业务情景和处理规则,是很难理解按钮的操作含义的。
因此,对于B端商品,使用者展开自助服务、自助操作的难度高很多,B端商品的帮助文档依然有存在的必要。商品结构设计人员要尽量在前端可视化上做好引导提示,对于复杂的规则和逻辑,能考虑通过帮助文档来辅导使用者。
归纳
安德森五大易用性准则可充分运用于各地方,能是可视化结构设计,也能是界面结构设计,深入细致了解该结构设计准则,能找出更好的软件系统,提升使用者的使用新体验。
要注意的是,这10项准则是预测方法(heuristics)的、广为的经验自然法则,而不是具体的规定。
状态可见准则:位置可见、数量可见、状态可见;环境贴近准则:语言应该是使用者所能理解和习惯的;使用者可控准则:可见导航、关闭与返回、撤销与重做;一致性准则:商品内部一致、可视化一致、迭代商品一致、同一商品线一致、结构设计语言一致、业内商品一致;防错准则:操作前预警、操作中确认、操作后、诊断,并从错误中恢复提供方法;人性化帮助准则:无需提示、一次性提示、常驻提示、帮助文档。本文由 @三原结构设计 原创发布于人人都是商品经理,未经许可,禁止转载。
题图来自Unsplash ,基于 CC0 协议
该文观点仅代表译者本人,人人都是商品经理平台仅提供信息存储空间服务。