交互设计5大定律

考研

一、奥卡姆剃刀原理

奥卡姆剃刀原理告诉我们：如无必要，勿增实体，即“简单有效原理”。对于工业产品适用，对于软件类产品也是如此。因为任何增加的非必要信息和功能，都会带来生产/维护成本的增加，以及用户认知/操作成本的增加。

在现今这个注意力稀缺的时代，复杂会让人望而却步，也容易使人迷失，而精简的产品更利于人们的理解和操作。

典型案例：

小米的电视遥控器设计和传统遥控器设计相比，对奥卡姆剃刀原理的运用非常极致，相信大家都可以感受到精简前后的视觉/操作/认知负荷的降低。

我们再来看一个互联网产品设计的案例：

19年初，外销浏览器做了一次视觉焕新大改版，从交互结构到视觉界面变化都比较大，所以我们就增加了新版本的滑屏引导，告诉用户有哪些界面及功能的变化。

结果新版灰度期间，信息流渗透率下降了33%，搜索下降了18%，经过仔细的数据排查，发现都是滑屏引导惹的祸，当把滑屏引导去掉后，搜索和信息流的数据都恢复正向了。

19年底，我们做的另一个运营活动也经历了类似的教训。当时锦鲤很火，我们就做了一个锦鲤大作战的小活动，画面精致，奖励也比较诱人。

但是发现活动上线后转化率效果却不及预期，我们再次把矛头对准了蒙层引导，通过去掉蒙层引导，CTA按钮场景化，并增加微动效，转化效果立刻得到了提升。

去掉不必要的引导，让界面自己会说话，这也是奥卡姆剃刀原理的一个体现。

二、米勒定律

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

典型案例：

对于像手机号、银行卡号、身份证号这种类型的信息，因为其固有的信息长度无法做精简，所以在信息组织时就会采取分组的方式，保证分组的数量控制在4±1的范围内。

另一个案例也是关于我们的外销浏览器：

左一是改版前的页面，功能有12项之多，且产品认为减无可减了。我们的交互设计师通过对页面功能使用频度及产品功能的重要程度进行分析，将功能划分为了三大类：重要功能，常用功能，必备功能。然后通过强化、保持和收纳的方式将其进行右图所示的呈现，界面复杂度迅速降低，功能清晰度和操作便捷度显著提升。

三、多尔蒂门槛

多尔蒂门槛告诉我们：系统需要在 400ms 内对使用者的操作做出响应，这样才能够让使用者保持专注，并提高生产效率。

先来看一组模拟的响应效果：

从这组图片可以感受到，当图片在400ms内时，是勉强可以接受的，但当时间延长到600ms及以上时，人们就会感受到明显的延迟、等待和卡顿感。

多尔蒂门槛对响应时间的上限给出了参考，而后续的研究则给出了更细致的响应标准，比如元素的点击反馈应控制在0.1s左右，尽量不要超过0.14s，单个元素入场退场时间应控制在0.2s左右（入场一般比退场稍慢），而页面的转场时长根据页面大小和转场动效的复杂度尽量控制在0.3s-0.4s之间。只有响应时间符合上述标准，才不会让用户对产品的流畅性有所怀疑。

四、雅各布定律

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

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

此外，在做某种特定类型的产品设计时，也非常有必要做行业及竞品分析，这样才能确保我们在做产品设计时，可以延续用户的主要视觉及行为习惯，减少用户的学习及使用成本。

以视频App为例，行业内的头部产品在产品框架及元素布局上都具有高度的一致性，这也是雅各布定律的一个体现。

五、可感知性原则

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

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

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

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

当我们想要删除某张照片时：

操作前有预期：工具栏位于默认的底部位置，有删除图标+文字明确示意的功能按钮，让用户一看就知道应该选择哪一项操作；操作时有反馈：点击删除按钮时，删除按钮有一个灰色的点击态，随后马上出现一个确认弹窗，而且是就近位置出现，确认弹窗上提示简单，按钮用的是CTA的形式，操作交互一目了然。操作后可撤销：当用户确认删除后，照片消失，但是还可以去最近删除的文件夹中，恢复照片。