让设计更有说服力的20条经典原则：美即好用效应

简介说明

1. 原理表述

当界面被设计得够美观时，用户往往容忍一为轻微、影响小的用问题。

2. 验背

1995 年，立设计中心的研究 Massaki Kurosu 和 Kaori Kashimura 通 26 种不同的 ATM 互界面对 252 位参与者进行详细的用户验测试，并对界面中表观用的决定因素（比数字键局、操流程等）进行评估。结果现，因素中很大一部分对用的影响微乎其微，反而界面美观度对用的影响出乎预料的大。

注：献中的数据表明，表观可性的决定因素对真实可性的影响系数大多在 0.000-0.310 之间，而界面美观这个数据达到了 0.589。

设计案例

从正面影响来说，将界面设计得足够美观，作是毋庸质疑的，每个设计师都应该着这个方向断努，户对好看的界面中一些轻微的可性问题会相当宽容。

应案例 1：Everest 官方页

△ https://www.everest.agency

页面中项目列表的滚使了一种极酷炫的方式，画自然流畅拖沓，虽然整个页面利率和操作效率没有直接展示在一个列表中的好，但是使者的感觉依然非好。

应案例 2：潮汐 APP 首页

潮汐将四个功能划分成两个模块，并且下方模块使用左右滚动的形式隐藏一部分，对用户来说操成是增加的。我们完以使用右的方式，将功能模块排列出来，让操更简洁。

但是为了界面的美观，增功视觉上的层次感，采取左右滚的卡片形式是会成户的反感的。

应案例 3：微信读书 APP 发现页

首页使用横向滑动的卡，一屏一卡一个主题，相比其他读书类 APP（比点、京东读书）而言，种界面的组织方式浏览效率不高，且浪费大量屏幕空间，但简洁、优雅的设计，就有让我们花一点耐心和操成看下去的欲望。

通过上面的案例，可读者会认为交互和视觉似乎是对立的，设计师为了更美观的界面就要降低户操作的效率。这种想法是错误的，和交互一样，良好的视觉设计是体验的一分，只是我们需要对具体的页面进行评估，强调视觉带来的体验是否超过牺牲掉的交互体验。

如果一强调观性，以此作设的主旨，得不偿失的，不会真的提升，也不 「美即好用效应」的本意。

注意事项

了解它的使案例，我们再看看该论有哪些应该注意的见问题。

注意点 1：

「美即好」并意味着一味追求界面好看，设计者应极避免设计好但丑、美却难这两种极端的界面，无论是哪一种对户的吸引都会大打折扣。

好用但丑的界面不用多，我们作设师终的目的就消灭丑陋。丑的界面即便任何可用性问题，依然会引起用户的争论差。比如下面这安卓应用 Fui 的界面具类似功能的 VOUN 相比较：

即使两者界面的结构几乎一样，交互也差不太多，但 Fui 界面粗糙，所以看起 Fui 难用，不讨喜。

美却难用，这是我们更容易进入极端──追求极致美而大幅忽略可用性。用户可用性极其敏感，即便他们自己可能没有意识到这，他们会用动证明，再好看界，太难用手动再见。

反案例 1：

△ https://florianmonfrini.com

比如上面这个 Florian Monfrini 的网站，好酷炫是没错，但是烈的前后景视差和后景缩放，形成了类似哈哈镜的效果，对于一部用户来说会产生眩晕、不适的受。

反面案例 2：

再比如这个名为 Vantage 的日历类应用，在交互和视觉上都做出了比较极致的个性，起来酷炫但实际使用起来略无奈，多了多不必要的视觉压力和操作成本，无法有效地将视觉焦点集中在想要的日程日期上，它用行动解释了什叫 「用力猛，过犹不及」。

注点 2：

用户并不是忽略了这些问题，只是容忍，只是能够受。所以在可用性测阶段，测者同可能因为「美即好用效应」而容忍一些可用性问题，在反馈中忽略了这一部的讲述。

何在测试程中现被测试者「隐藏」来的用问题，简单来说，一旦测试者答非所问，反馈的主要点在「界面看」上面，么测试主持者就需要更加谨慎，意味着「美即用效应」能正在挥用，有问题测试者并没有反馈出来。

在 Nielsen Norman Group 的章《The Aesthetic-Usability Effect》「2」中，对更细分的情况有具体的阐述，有兴趣的可看一看。

总结

• 尽量将界面计得好，而不响其可用性。
• 权衡之下以牺牲轻微的用，而将页面设计得更为美观，需要依靠经验来持它们的平衡。
• 可性测试过程中应留意测试者的反馈，从而消除「美即好效应」的影响，觉察到真正需要改进的问题。

参考文献

1. 《Apparent Usability vs. Inherent Usability. Conference companion on Human factors in computing systems》Kurosu, M. & Kashimura, K. (1995)
2. 《The Aesthetic-Usability Effect》 Kate, M. (2017)
3. 《The Aesthetic-Usability Effect: Why beautiful-looking products are preferred over usable-but-not-beautiful ones》 Abhishek, C. (2017)

欢迎关注作者微信公众号：「电话亭」