浅谈交互设计的七大定律

新年第一篇和小伙伴们聊聊交互设计七大定律在设计中的应用。说起法则、定律、原理一类的名词,大多时候我们会觉得有点故作高深,似乎离我们真实的工作很遥远,又或者似乎太过浅显熟悉不值得讨论。窃以为,如果不想每次聊起产品设计的时候,都是你看人家的用户体验做的多好,你看这交互做的多好,你看这动效做的多好……或许,我们可以更有趣除非有更好的选择,否则就遵从标准—Alan Cooper费茨定律(Fitts’ Law)由保罗·费茨(PaulM. Fitt...

浅谈交互设计的七大定律

新年第一篇和小伙伴们聊聊交互设计七大定律在设计中的应用。

说起法则、定律、原理一类的名词,大多时候我们会觉得有点故作高深,似乎离我们真实的工作很遥远,又或者似乎太过浅显熟悉不值得讨论。


窃以为,如果不想每次聊起产品设计的时候,都是你看人家的用户体验做的多好,你看这交互做的多好,你看这动效做的多好……

或许,我们可以更有趣

除非有更好的选择,否则就遵从标准

—Alan Cooper

费茨定律(Fitts’ Law)

由保罗·费茨(PaulM. Fitts)博士,1954年提出

浅谈交互设计的七大定律

T =a + b log2(D/S+1)

T:使用指点设备到达一个目标的时间

D:目标位置的距离

W:目标大小

怎么理解这个定律?

MM豆有个广告词,“快到碗里来!”“你就不能换个大点的碗吗?”

我们再来一个小的实验体验一下

当你指向面前的一本书,和指向远处书架上的一本书,是不是你指向远处的书本的时候,需要很多指向和辅助说明?

又或者你指向远处书架上的一本书和远处的那个书架,相比起来,指向书本的手势,会再指向书架后,有更多的细微方向的调整?

有没有觉得位于边角的位置更好描述?


那这样一些特点对我们设计有何启示

一 按钮等可点击对象需要合理的大小尺寸

浅谈交互设计的七大定律

登陆按钮被设计的更大

二 屏幕的边和角很适合放置像菜单栏和按钮这样的元素,边角是巨大的目标

浅谈交互设计的七大定律

Mac OS X默认将底栏(Dock)放到了屏幕的最下方


三 出现在用户正在操作的对象旁边的控制菜单比下拉菜单或工具栏可以被打开得更快。

浅谈交互设计的七大定律

 右键菜单缩短了光标的移动距离D,提高了效率 

除了提高效率,我们也有反向应用它,譬如iPhone的关机操作

浅谈交互设计的七大定律

如果我们愿意再多联想一些,生活中对于费茨定律的应用也是无处不在


开车的朋友是否有注意到,汽车上的刹车踏板和油门踏板:它们相距很近(D小),并且刹车踏板要比油门踏板大很多(W大),那么它们为什么没有被设计成相距很远,或者将两者的大小颠倒过来呢?使用经验告诉我们,这样的设计可以使得驾驶员能够以最短的时间把脚从油门踏板移动到刹车踏板上,从而达到以最快的速度准确制动的目的(D小,W大,时间短)。


可能去过电玩大世界的人会有这样的疑问,电玩大世界中那些赛车的油门和刹车踏板大小刚好与常规的相反,这又是为什么?这也正是应用费茨法则的高明之处,因为游戏中我们需要的是更快的速度去超越对手,因此你会更加容易的去踩到油门,争取更多的时间,而且你人身安全不会受到威胁,因为刹车踏板就明显变小了。

 

希克定律(Hick’s Law)

一个人面临的选择越多,所需要作出决定的时间就越长。

浅谈交互设计的七大定律

 RT=a+blog2(n)

RT反应时间

a与做决定无关的总时间

b对选项认知的处理时间衍生出来的常数

n选项数目


这个定律比较好理解,我们来直接看其在设计中的应用

一 减少用户决策时间

浅谈交互设计的七大定律

支付宝的公共支付页面,突出重点,让用户快速理解和完成任务


二 降低点击错误率

浅谈交互设计的七大定律

淘宝选购页面,对用户进行适当行为约束,提前去除掉不能继续的道路


三、提高信息获取效率

浅谈交互设计的七大定律

支付宝充值页面,让信息的选择更扁平化


7±2 法则

美国心理学家George A. Miller1956年发布的论文《神奇的数字7加减2:我们加工信息能力的某些限制》

浅谈交互设计的七大定律

人类头脑最好的状态能记忆含有7(±2)项信息块,在记忆了 5-9 项信息后人类的头脑就开始出错。


 该法则对设计的启示

一  PC端导航或选项卡尽量不要超过9个,移动应用的选项卡不会超过5个。

浅谈交互设计的七大定律

二 导航或选项卡内容很多,可以用一个层级结构来展示各段及其子段,注意其深广度的平衡。浅谈交互设计的七大定律

三 把大块整段的信息分割成各个小段,显著标记每个信息段和子段,以清晰确认各自的内容。浅谈交互设计的七大定律

接近法则(The Law Of Proximity)

1912年由韦特海墨(M,Wetheimer)提出

浅谈交互设计的七大定律

当对象离得太近的时候,意识会认为它们是相关的


在设计中应用启示,合理的间距排版布局,让用潜意识的就能将信息处理和分类

浅谈交互设计的七大定律

防错原则

新乡重夫被尊称为“纠错之父”,他首创POKA-YOKE的概念

大部分的意外都是由设计的疏忽,而不是人为操作疏忽。在设计中要有必要的防错机制;特别要注意在用户操作具有毁灭性效果的功能时要有提示,防止用户犯不可挽回的错误


我们不可能消除差错,但是必须及时发现和立即纠正,防止差错形成缺陷。

—新乡重夫

损失产生前给用户适当的提示

浅谈交互设计的七大定律

泰思勒定律( Tesler’s Law)

20世纪80年代中期,Larry Tesler认为用户如何使用应用程序和应用程序本身同样重要。

浅谈交互设计的七大定律

每一个过程都有其固有的复杂性,存在一个临界点,超过了这个点过程就不能再简化了,你只能将固有的复杂性从一个地方移动到另外一个地方。

让一位工程师花费额外的一周时间去减少软件程序的使用难度,还是应该让数以百万计的用户花费额外的一分钟来克服这一困难,你怎么选?

 

奥卡姆剃刀原理(Occam’s Razor)

14世纪逻辑学家、圣方济各会修士奥卡姆的威廉(Williamof Occam,约1285年至1349年)提出

如无必要,勿增实体

 

日本最大的化妆品公司收到客户抱怨,买来的肥皂盒里面是空的。于是他们为了预防生产线再次发生这样的事情,工程师想尽办法发明了一台X光监视器去透视每一台出货的肥皂盒。同样的问题也发生在另一家小公司,他们的解决方法是买一台强力工业用电扇去吹每个肥皂盒,被吹走的便是没放肥皂的空盒。同样的事情,采用的是两种截然不同的办法,你认为哪个更好呢?

 

万事万物应该尽量简单,而不是更简单。

01 精兵简政,不断简化组织结构

02 关注组织核心价值,资源集中于专长

03 简化流程,避免不必要的文书作业

聊及此,我思及《简约至上》,组织、删除、转移、隐藏,会发现大家反复探讨研究的问题,其实根本同源。

 

为什么我们要去做这些看似很学术的探究?

我这样理解

当我们开始一个产品设计,感到无从下手的时候,他们或许能给我指出一个尝试的方向;

当我们脑海浮现诸多方案,感到有些犹疑的时候,他们或许能给我提出一个参考的检验标准;

当我们看到别人好的设计,感到惊叹不已的时候,我们知其然亦知其所以然;

当我们提出设计方案,我们深知,这是我们多方探究,权衡取舍间,给出的当下最优的提案!

文末依例广告走一波~

大家乘坐长途的交通工具的时候都会带些什么吃?

浅谈交互设计的七大定律

窃以为速食小火锅秒杀一切泡面盒饭,详戳原文


阳历年已是新年,阴历年仍是辞旧迎新之际

祝愿我们每一个微小的生活愿望都能达成,想吃的时候有的吃,想被爱的时候有人来爱~

浅谈交互设计的七大定律 浅谈交互设计的七大定律

依然欢迎各位加arya微信,聊聊生活有趣事儿~

文章参考原文

设计法则: Fitts’ Law / 菲茨定律(费茨法则)

https://www.jianshu.com/p/36b610bac7a2

交互设计七大定律之复杂守恒定律

https://www.iamue.com/8916

生活中的定律——奥卡姆剃刀定律

https://www.mifengtd.cn/articles/occam-razor-life-tips.html

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/35136/

(0)
交互精选交互精选
上一篇 2018-02-06
下一篇 2018-02-06

相关推荐

  • 广告与用户体验只能二选一?

    最近公司的移动端产品在优化广告投放,其中也遇到了不少的困惑,我翻看了部分APP的广告展现形式并结合了几位设计师&产品经理的想法之后,整理总结出了这篇文章。本文将结合实际案例就常见的广告形式以及它们如何合适地呈现与大家进行分享。遇到的困惑我们知道无论是自身的品牌活动宣传还是第三方的商业广告都能为公司和产品带来不小的收益,但与此同时不恰当的广告也会对用户体验造成很大的影响,特别是移动端,因为屏幕有限更是“寸土寸金”,一不小心就会引起用户反感...

    2018-04-04
  • D4-交互设计工作困惑答疑

    作者:飞阿婷(公众号:飞阿婷的交互设计生活)自我成长1.面试攻略为什么强调说,不能把自己的不足归咎于之前公司没给自己带来很大成长?抛开你有推卸责任的人品问题来说,其实还有科学依据证明很多事情都是可以事在人为的。费斯汀格法则:“生活中的10%是由发生在你身上的事情组成,而另外的90%则是由你对所发生的事情如何反应所决定。”我的理解是那10%就是不受我们控制的自然发生的事情,而90%就是我们面对这10%的事情选择接下来要做的事情,而这个选择...

    微信热点 2018-04-12
  • 【线下沙龙】产品经理交互设计大会

    2018年产品经理交互设计交流分享大会活动背景一个优秀的产品经理不仅能引导产品的发展,而且还能引导公司的发展。同时,他还是一名优秀的执行者、项目管理和团队管理者,具备敏锐的洞察力,能在用户心理和产品细节间灵活游走,打磨出令人惊叹的产品。所以,在成为CEO之前,先成为一名出色的产品经理吧。然而当我们投入到实际工作中时,总是一次又_次遇到阻碍:和运营、枝术部门沟通不畅,项目推进难。公司要求不高,任务很轻松就能完成,想要挑战大公司,却深知自己...

    2018-04-22
  • 《2017中国设计行业价格报告》——交互设计

    《2017中国设计行业价格报告》——交互设计创意点亮生活设计美好人生创意设计一个有温度有格调的公众号合作、投稿:cda-zj@vip.163.com微信:13777850472微博:@浙江省创意设计协会

    2018-02-14
  • 交互设计——绘制流程图

    在上一篇文章中了解如何寻找接触点、梳理接触点,在这篇文章中主要就是如何来绘制流程图。现在普遍对流程图的分类有四种:业务流程图、页面流程图、功能流程图、程序流程图。在这主要通过现有的APP分析来进行区分不同流程图以及如何交互设计师或者产品经理选择应该使的流程图。何为流程图在上文中讲到了流程,流程是事物进行中的次序或顺序的布置和安排。流程是自然而然就存在的,它可以不规范,可以不固定,可以充满问题。而流程图的核心就在于如何排布事物进行的次序,...

    2018-05-06
  • 用户体验是玄学吗?

    恍恍惚惚又是一年年底。又到了设计师们的“季节性迷茫期”,最近我的公众号后台经常接到好多朋友的信息,自己行间透露着迷茫和不自信。大的趋势和节奏还是和去年一样,有些视觉设计师询问我如何转UI,有些UI设计师问我如何才能培养产品思维…其实大家都在迷茫,在这里我想分享一个用户体验相关的综述给大家,希望能对大家找准自家的定位有帮助。我最初是一名UI/视觉设计师,然后随着一步一步的发展,给自己的目标也在发生变化,我现阶段给自己的最终定位是成为一名用...

    2018-02-06
  • 用AB测试改进用户体验设计,做出正确决策

    本文转译自TubikStudio,全文有删减。设计师们每天都在面对一些难以抉择的情况。面对这样的问题,有经验的团队会对两者进行测试,来确定哪种方案最好,其中一种流行的方法是AB测试。AB测试将用户分成两组,每组都显示不同的版本,一半看到A版本,另一半看到B版本。AB两个选项的差异根据产品经理来决定,可以是颜色差异,也可以是位置差异等。两个版本的有效性可以用浏览量、点击次数或其他数据来衡量。对于设计师来说,这是分析目标受众群体行为模式和特...

    2018-02-24
  • 【优秀作业展示】交互设计基础(一)

    《交互设计基础》是学习交互设计的重要课程,在大三上学期开课。任课教师是工业设计系的华梅立老师,通过老师的认真指导和对该课程的学习,大家对交互设计有了进一步的了解,在老师的引导下,同学们对高铁取订票界面设计进行了深入的分析和再设计,并选取了感兴趣的小方向进一步拓展。接下来就看看学完本课程后同学们的优业。优秀学生作业第一期周亦辂产品设计1511高铁取订票界面设计色彩选取字体:冬青黑体字号:18、21、24、28、30、32、36风格:利用从...

    2018-04-04
  • 交互设计(一)表单设计

    此文来源于网络

    2018-04-04
  • 【交互设计排名】SKD独家 | 美国交互设计排名

    Alias工业设计点击关注 和工业设计做朋友关注数模师  JACKAlias建模学习ALias建模咨询加好友你心目中的交互设计是什么样的 ?也许Google这个产品所创造的场景是你所畅想的交互设计可以被认为是当下最热门的专业,受热捧的程度可以和金融媲美。但是,你真的了解开设这个专业的院校吗?每个院校之间的差异和设置有什么不同?SKD根据院校开设的课程设置、专业排名,特邀我们资深的教研团队根据对自身院校的了解、利用兄弟院校的校友资源、以及...

    2018-04-08