第316期:【交互定律】交互...2023设计之旅39

用户头像
南京/艺术工作者/2年前/59浏览
第316期:【交互定律】交互...2023设计之旅39

推荐理由:适合人群:交互设计师。阅读耗时:字数1761,约5分钟。

推荐理由:适合人群:交互设计师。阅读耗时:字数1761,约5分钟。设计师在日常工作中需要掌握很多理论技巧,怎么样让设计出来的产品更加美观,更加符合大众审美呢?分享了交互设计5大定律。推荐对交互设计感兴趣的你。

在介绍重新定义的交互设计定律之前,我们先来回顾一下经典的,交互设计7大定律。

01费茨定律:告诉我们要节省操作时间。应该怎么做:放大目标对象,减小目标距离。

02席克定律:告诉我们要节省决策时间。应该怎么做:尽可能的减少选项的数量。

03米勒定律:告诉我们人类记忆的上限。所以要将信息数量控制在4±1内。

04接近法则:告诉我们相邻≈相关。所以要根据信息亲密性组织其位置关系。

05泰思勒定律:告诉我们复杂性是守恒的,我们要平衡复杂性的天平向谁倾斜。以实现整体效益最大化。

06防错原则:告诉我们用户出错是不可避免的,我们只能减少并降低其犯错的可能性。

07奥卡姆剃刀原理:告诉我们如无必要,勿增实体,设计要尽量的简约。

在交互设计的过程中,以交互设计定律为指导的过程指标是通用的,几乎可以说放之四海而皆准,我把这四个过程指标概括为四字箴言:少快好省。怎么理解呢?

所谓少,就是信息功能要精炼,要一目了然,要尽可能减少功能/信息的复杂度。

所谓快,既是性能也是效率,指的是要尽可能快的响应用户的操作,达成用户目标。

所谓好,就是产品的设计必须达成行业一流的设计标准,让用户用的顺手、满意。

所谓省,就是省心省力省时,能够帮助用户节约时间,降低操作和认知负荷。

基于这样的过程指标,我挑选了5个设计定律来进行设计指导,下面我们逐一来看。

一、奥卡姆剃刀原理

奥卡姆剃刀原理告诉我们:如无必要,勿增实体,即“简单有效原理”。对于工业产品适用,对于软件类产品也是如此。因为任何增加的非必要信息和功能,都会带来生产/维护成本的增加,以及用户认知/操作成本的增加。在现今这个注意力稀缺的时代,复杂会让人望而却步,也容易使人迷失,而精简的产品更利于人们的理解和操作。

二、米勒定律

米勒定律告诉我们:人们工作记忆平均能记住的元素数量仅为4±1。所以我们在设计时,首先要运用奥卡姆剃刀原理,尽可能的去做减法,尽量将数量控制在4±1的范围内。如果选项较多,且减无可减时,就需要对信息/选项进行分类和分组,保证类别的数量在4±1的范围内。

通过对页面功能使用频度及产品功能的重要程度进行分析,将功能划分为了三大类:重要功能,常用功能,必备功能。然后通过强化、保持和收纳的方式将其进行右图所示的呈现,界面复杂度迅速降低,功能清晰度和操作便捷度显著提升。

三、多尔蒂门槛

系统需要在400ms内对使用者的操作做出响应,这样才能够让使用者保持专注,并提高生产效率。

多尔蒂门槛对响应时间的上限给出了参考,而后续的研究则给出了更细致的响应标准,比如元素的点击反馈应控制在0.1s左右,尽量不要超过0.14s,单个元素入场退场时间应控制在0.2s左右,而页面的转场时长根据页面大小和转场动效的复杂度尽量控制在0.3s-0.4s之间。

四、雅各布定律

用户将大部分时间花在别人家的网站上,而不是你的。这意味着他们希望你的网站跟别人的有相同的操作方法和使用模式。雅各布定律告诉我们:作为设计师,我们必须要多研究把玩各种App,这样我们才能够对当下产品的设计趋势有更直观的感受。

对于新入行的设计师,我会建议大家好好研究一下ios和android的OS规范,了解平台的特性,同时再翻翻下面这些书籍,了解各种常见的设计模式,丰富自己的设计组件库。

五、可感知性原则

操作前有预期,操作时有反馈,操作后可撤销。这是十年前我入行时接触到的一句话,我不知道是谁提出来的,但却是这些年我做交互设计最重要的一条参考原则,我将其简单命名为可感知性原则。

操作前有预期,指的是要符合视觉认知原理,符合行业设计习惯,让用户一看就懂。

操作时有反馈,指的是操作时要即时反馈,就近反馈,并且反馈合理。

操作后可撤销,指的是任何操作都尽量让其可撤销,让用户无后顾之忧,安心探索。只要存在用户行为的交互,这个准则都是可以用来检验的,以下图为例。

读后感

围绕交互设计的过程指标,少、快、好、省依次展开,给你介绍了奥卡姆剃刀原理、米勒定律、多尔蒂门槛、雅各布定律、可感知性原则。针对作为新人的你,定要仔细研究定义的细节,反复例证,作为入行多年的你,可以将这些重要的理论应用到具体项目中,扩展延伸更多的方案。

0
举报
|
收藏
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
网页背景
三个青年站在网页周边矢量插画
卡通风格网页页面3D渲染
互联网,互联网插画,商务,数据,项目,合作,网页插画,插画,大数据,智能,商业,网页,网页设计,插画设计,互联,未来,沟通,渐变,蓝色插画,商铺,覆盖,管理,项目管理,效率,提升,高效,关系,拓展,
网页电商背景矢量插画
卡通风格网页页面3D渲染
网页设计——纸杯蛋糕
新年快乐送福网页矢量图banner
四个人物分别在上网贴纸合集
卡通风格网页页面3D渲染
卡通女孩与网页表格3D渲染
一个人拿着优惠券准备支付购物电商矢量插画
卡通女孩与网页表格3D渲染
男生坐在网页面前办公矢量插画
三位美女围着网页看信息矢量插画
网页图标
卡通风格网页页面3D渲染
男生和女生站在网页面前矢量扁平插画
三个青年正在装修网页矢量插画
互联网,互联网插画,商务,数据,项目,合作,精准,投放,网页插画,插画,大数据,智能,商业,网页,网页设计,插画设计,互联,未来,交流,沟通,渐变
卡通风格网页页面3D渲染
 网页背景
女生坐在网页面前办公矢量插画
一个男生和两个女生站在网页前面打招呼矢量
商务网页
你可能喜欢
相关收藏夹
大家都在看
登录注册