恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
读书笔记丨设计的125条通用法则(1-5条)
42.2°
2024-04-10 原创文章 经验/观点 举报 9430 12 182 0

“除非你足够优秀到可以忽略这些设计原则,否则你最好遵守。”

近期深入阅读威廉·立德威尔/克里蒂娜·霍顿/吉尔·巴特勒的《设计的125条通用法则》,相比网络上零零散散的设计原则文章,发现这本书足以帮助设计师建立一套系统、完善、标准的设计原则,从而理解设计底层的逻辑。于是督促自己以记录笔记的形式全部记下来,反复嚼蜡,吃透这本书。

最后,感谢本书三位作者无私的分享,向你们致以最高的敬意!


1.80/20法则80/20 rule


1.1定义

在所有大型系统中,大部分的性能由少数几项关键因素决定。


拓展阅读:

80/20法则也称为帕累托法则、二八法则和关键少数法则。


1.2核心价值

增强设计的易用性,提升设计决策效率。


1.3核心观点

  • 依照80/20法则的定义,在所有大型系统中,高达80%的效果是由仅占20%的关键因素决定的。比如80%的产品只用到了20%的功能,80%的城市交通集中在20%的道路上,80%的公司收益来自于20%的产品。
  • 80/20法则能让资源整合,从而使设计达到最大效率。
  • 设计中的元素并非一律平等。我们要利用80/20法则来评估系统元素在设计过程中的价值,确定重新设计与优化的范围,从而让资源有效地集中。


1.4阅读笔记

作为本书介绍的第一条设计原则,这一条实在太过出名了,几乎让我有点意外,它竟然和设计相关联。不过阅读完以后,我感觉自己有以下收获。

第一,任何产品设计,都需要聚焦到20%的核心功能,也可以理解为产品最终服务的目标人群只有20%。这和《交互设计精髓》作者艾伦库伯把用户分为初级、中级和高级用户是一个道理。其次这个设计原则和特劳特和艾·里斯的《聚焦》定律也如出一辙,每个团队都需要坚持聚焦的战略,锁定到核心目标人群进行服务,才能取得成功。

第二,对于产品设计师来说,在任何一个页面的设计中,一定要把内容和视觉的主次关系清晰划分,突出重点,我们要知道,用户只会注意到20%的内容,而不是一整页密密麻麻的内容(这其实呼应了尼尔森可用性原则的易扫原则,用户多数时候只会扫,不是逐字阅读)。

第三,国内的多数产品,无论是面向C端的APP还是面向B端的SaaS产品,功能都过于繁杂厄余。事实上,用户需要的也许只有20%,但整个设计环境却是比拼如何把产品做得更复杂、更笨重。但我们不能只是责怪管理层的经营理念和商业模式,我们更应该理解这些通用基础的设计原则,在产品立项的前期,就能从用户视角为管理团队提出有价值的设计参考方案,为企业降低因用糟糕的用户体验设计带来的产品失败或升级的成本风险。


2.无障碍使用 Accesibiliy


2.1定义

设计的产品和环境无需经过特意调整,就能尽可能地让更多人使用。

2.2核心价值

增强用户对设计的接受度和易用性,以及提升设计决策效率。

2.3核心观点

无障碍设计在过去是为了方便残疾人,但随着人们在无障碍设计方面的知识和经验不断积累,人们逐渐意识到,无障碍产品是适用于所有人的。无障碍设计有易理解性、易操作性、简易性和包容性这四个特点。

2.3.1易理解性

"易理解性"是指不管使用者的理解力有多大差异,每一位使用者都能理解设计。

如何提升易理解性?

用冗余编码来呈现信息(如文字、图像、触觉标注);

利用辅助性感官技术提升产品的使用多样性,例如在网页上的图片加注 ALT标签;

以合理的方式来呈现操控装置和信息,让使用者无论站或坐,都能轻易地理解和操作。

拓展阅读

冗余编码(Redundancy Encoding)是一种在信息传输或存储过程中,为了提高数据完整性和可靠性而增加冗余信息的方法。冗余编码的概念是指在原始数据中添加额外的数据,这些数据可以是原始数据的复制、计算结果或其他形式,以便在数据传输或存储过程中出现错误时进行纠错。冗余编码可以提高数据的可靠性、完整性以及恢复错误。

2.3.2简易性

"简易性”就是指不论使用者的经验、文化程度和注意力水平如何,都能轻松操控设计产物。

提高简易性的基本方法:

去掉不必要的复杂设计;

采用清楚明了、含义一致的提示符号和标识,对操控装置和操作方式做出标记;

要渐进地披露呈现相关信息和操控装置,省略无关的信息;

对于所有指令,都应提供清楚的提示和反馈,确保信息简单易懂,适合文化程度不同的使用者。

2.3.3包容性

“包容性”就是指尽可能地让操作错误的后果最小化。

提高包容性的基本方法:

使正确操作简单易懂,而错误操作无效化来防止错误发生;

设置"确认"和“警告”来减少错误的发生;

增加可撤销功能和安全网等手段,以减轻或避免因错误造成的后果。

2.3.4易操作性

"易操作性"是指不论使用者的身体状况如何,都可以使用某一设计。

提高易操作性的基本方法:

尽可能减少使用者的重复操作以及不必要的体力消耗;

让正确的操作变得简易,而错误的操作被设置为无效,使得操作更加便利;

利用辅助人体活动的技术,为使用者提供良好的操作环境;

以合理的方式来呈现操控装置和信息,让使用者无论站或坐,都能轻易操作。

2.4阅读笔记

关于无障碍使用,我觉得它是所有产品设计原则的基础,也是一个设计师的基本职业素养。如果我们设计出来的产品让人无法轻松理解、简单上手,那说明这样的产品更多是以交付为导向,而没有从用户的角度去思考。其次关于无障碍使用的四个特点,也深有启发,简单总结归纳如下:

易理解性就是要降低用户的学习成本,用户可以按自己的思维方式、行为习惯,甚至还可以通过视觉、听觉、触觉、嗅觉这些方式来获取信息。比如一个家用电器的开关按钮,虽然在我们看来已经是通俗易懂的标志,但你可能想象不到老年人根本无法理解这样的图标代表着什么,如果就简单加上“开/关”两个字,那么这部分群体将会对产品的设计更加容易理解。

简易性是指用户都渴望简单易上手的设计,就如同电视机遥控器的升级迭代之路,从满屏的按键到最后只保留最重要的按钮,但往往多数产品的设计都违背了简易性。

包容性和尼尔森十大可用性原则的容错原则相似,在用户可能出现错误的场景中,我们要尽量去避免;当用户出现了错误,要给出解决方案,降低用户的焦虑。

易操作性是指产品设计要让用户操作简单,无论是单手、双手,甚至一些极端的情况都尽量去思考,让用户在各种场景和身体状态中,都能便捷操作。


3.导引手册 Advance organizer


3.1定义

一种利用已知的信息来帮助人们理解新信息的教学技巧。

3.2核心价值

增强用户对设计的接受度。

3.3核心观点

导引手册是指在给出新信息之前,先向人们提供一些简略的信息模块,以口头、书面或图片的形式呈现,从而使人更易于学习并理解其中的内容。

"导引手册"分为说明型和比较型两种。

3.3.1说明型

如果对于新知识一无所知,那么"说明型导引手册"就比较适用。比如,要教一群对叉车毫不了解的人去操控叉车,那在教学之前就需要准备说明型导引手册,简要地向他们描述叉车及其功能。

阅读笔记

在我们下载一个全新APP的时候,说明型导引手册可以说随处可见。以前看上去好像可有可无,读完这条设计原则,才明白这是一个新产品上线时候需要准备的一个重要内容。

3.3.2分类型

比较型导引手册则对有相关知识背景的对象较为适用。例如,要教有经验的又车司机来操作新款叉车时,就可以使用比较型导引手册,让他们去对比新旧又车的特点和操控方法。

3.4阅读笔记

这条设计原则相对来说比较容易理解,其次也让人感到意外,原来我们习以为常的「新手指导」这些内容竟然有依可寻,也有设计原则支撑。突然想起我在拆解APP产品时候都会为读者提供的「一图看懂本文结构」图,这其实就是应用了「导引手册」,增强了用户对文章的理解度。

4.美即适用效应 Aesthetic-Usability Effect


4.1定义

人们通常认为美观的设计更为实用。

4.2核心价值

增强设计的易用性和感染力。


4.3核心观点

功能优异但美观欠缺的产品,可能不会受人认可,优秀的功能会彻底失去价值。

对某人的第一印象会影响你对这个人的态度,而且你看待和对待此人的方式也因此受到了明显影响。

美丽的设计比不美的更能促使人们对此形成正面积极的态度,而且让人更包容产品设计方面的缺陷。人们往往很熟悉那些引发积极态度的设计,可以叫出它的名字,同时也能与其建立感情(比如为某款汽车起个昵称),而反过来则完全不同。

我们需要永远追求美观的设计。人们认为它们更加实用,它们也容易被接受,并被长期使用。美观的设计能够激发创意,帮助人们解决问题。它还能帮助品牌与消费者建立正面的关系,让人能容忍产品设计上的缺陷。


4.4阅读笔记

如果你为设计这个职业感到迷茫,那么读到这条设计原则,它可以告诉你,设计其实是缔造一个伟大产品最基础也是最重要的工作之一。都不用列举苹果的案例了,看看最近火遍全国的小米SU7汽车,正是它的设计感,让用户看见就充满了购买的欲望和冲动,这正是应用了美即是用效应的设计原则。我们应该坚信,设计是一个伟大的职业,用户对美观设计的的追求将会永不停歇,我们要不断鞭策自己,做出更优秀、更美观的设计。

另外在尼尔森十大可用性原则的第八条美学和简约设计(Aesthetic and Minimalist Design)也有相似的观点——保持界面简洁明了,去除不必要的干扰和复杂性。


5.功能可见性 Affordance


5.1定义

物品或环境的特质会影响其功能。

阅读笔记:

在二十年前,拟物化设计风格几乎就是界面设计的代名词,它是模拟生活中真实物品形状的一种设计形式,这种设计风格其实就是功能可见性设计原则的体现。

5.2核心价值

提升用户认知、增强设计易用性。


5.3核心观点

一些物品或环境会比其他的更适合某些功能。比如圆形轮胎比方形轮胎更容易滚动起来,因此圆形轮胎会比较适合滚动;楼梯比栏杆容易攀登,所以人们觉得楼梯更适合攀登。

如果物品或环境的功能可见性符合人们的感官预期,那么这种设计就会被充分接纳,也有着高使用率,同时会被认为易于操作。反之,当物品或环境的功能可见性与其预期功能相抵触,那么设计出来的产品就不会有很高的接纳率和使用率,同时也会被认为难以操作。

在抽象环境下(例如软件界面)要模拟人们熟悉的物品和环境,以提醒使用者要怎样使用新系统中的各个部件,它们的功能又是什么。

5.4阅读笔记

突然想起了Ant Design的设计价值观「自然」——在产品日益复杂的今天,用户的意识和注意力资源是有限的,所以他们追求感知自然和行为自然,帮助用户决策、减少操作,从而节约用户脑力和体力,让人机交互行为更自然。过去不太能理解,但读完这一条设计原则,突然发现这其实就是「功能可见性」设计原则的一种体现。在设计一个产品的时候,如果脱离了一个物品的功能本质和使命,那么这样的设计就会给用户造成极大的认知困扰。想想你第一次看见电动平衡车时候的场景,你是不是会忍不住用两只脚站上去就开始尝试骑行,还有小孩子平时玩的积木,凸凹有序的设计,小孩子几乎不会思考就会很自然把两个积木扣在一起,这就是自然,这就是功能可见性。

Powered by Froala Editor

更新:2024-04-10

收藏

12人已收藏

  • 52

    作品

  • 705

    粉丝

  • 5

    关注

  • 商业实战丨如何通过竞品分析快速提炼设计策略应用到售前设计?
  • 产品重构丨我给这款10亿人都要用的国民APP进行了重构升级①
  • 彩妆品牌官网设计丨一个让人心碎的项目
  • 医疗健康产品设计案例合集丨4个医疗官网
相关标签

    猜你喜欢

      2024-04-10 原创文章 经验/观点 举报 9430 12 182 0

      读书笔记丨设计的125条通用法则(1-5条)

      42.2°

      你确定要举报读书笔记丨设计的125条通用法则(1-5条)

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2024年04月10日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      182
      12
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录