网页版面视觉元素设计心理学原则中提炼的五个有助于提升用户体验的技巧

我们需要挖掘用户希望的意愿本质，而不是我们根据他说的样子来设计。另见“不要仅靠逻辑”，世界上有一半的人是不会理性反思的。

就会有人误以为创意就是设计的全部，然而，设计不只是来自时尚。优秀的客户体验设计师通常只是优秀的心理学大师，他们了解客户如何对待和评价一个设计的好坏。

加州分校设计实验室教授，唐·诺曼在他的书《设计心理学》中那样描述：

我们需要挖掘用户希望的意愿本质，而不是我们根据他说的样子来设计。另见“不要仅靠逻辑”网页版面视觉元素，世界上有一半的人是不会理性反思的。

设计师要想帮助客户解决难题或减少效率，理解它们的痛点至关重要，这个过程包含了解客户行为和与它们形成共情。

为了帮助你更好地理解客户，本文介绍了从「设计心理学」原则中提炼的五个有助于提高用户体验的方法。

一、关注设计中的「少即是多，多即是少」

想象去一家餐厅，读完菜单上100多个菜品的时间比从精选的20个菜品中做出选择的时间还长，设计也常常这么。

大多数用户体验设计师喜欢为客户提供选择。毫无问题，人们偏爱有选用权，但太多选项反而会困扰用户，因为普通人脑一次只可以处理十分有限的信息。

这与心理学中的「希克定律」相关：「当应对更多选项时，人们也必须花更多的时间才会作出选择」。无论能否意识到，人们的决定很大程度上取决于它们觉得这件事是否「值得」，包括考量所花的费用和潜在的好处，这被称为「成本效益分析」。

Imagecredits:，中文为译者注

那么怎样将「希克定律」应用于设计呢？

设计师必须时刻记住：用户有特定的目的才能使用你的网站。不要提供太多选项，删除任何不必要的高亮，链接、文本、图片和图标，让用户无法不受干扰地、快速找到它们必须的东西。一条经验是将复杂的步骤分解为简洁可控的流程，通过清晰的鼓励让客户直达目标，以尽快激发人们的兴趣！

二、将最重要的信息放在最里面

Imagecredits:，中文为译者注

眼动追踪热力图可以体现用户注意力的分布和关注在特定点的时间。根据眼动跟踪研究，大多数客户阅读网站的方式类似。

最常见的方式是阅读跨度较短的“F”型。用户首先水平扫视屏幕底部，然后逐渐向上移动并阅读跨度较短的水平区域。

根据NielsenNormanGroup的一项基于45,237浏览量的网站研究，人们通常只阅读页面上20％的文本。更糟糕的是，在内容更多的网站上，网页文本每提高100个词，人们的阅读时间只下降4分钟。

那么，设计师怎么在客户体验策略中运用这一点？将关键信息放在最多人关注的位置，并尝试用更短且醒目的标题来引来用户注意力。

在这个人们不逐字逐句阅读的世界中，尼尔森诺曼为易浏览文本建立了下列方法：

突出显示关键词；有含义的小标题；项目符号列表；每个句子只讲一件事；倒金字塔原理：从结论开始；传统写作字数的一半或更少。

三、谨慎使用颜色

颜色是帮助他们辨认和区别同类物体的工具。从心理学层面来说，色彩能使人造成情绪。颜色本质上是主观而不是客观的，人们使用头脑的听觉系统来认知或创造颜色。

使用材质吸引用户注意是设计师常用的方式，颜色为设计师提供了一种与品牌联系的方式，大多数客户的选购时间和决定遭到颜色的影响。

那么，色彩心理学怎么帮助设计师创造更好的用户体验呢？

Azure的设计经理JoeHallock认为网页版面视觉元素，不同性别在色彩倾向上存在显著变化：男性一般偏爱更大胆的色调，而女人更偏爱更明亮的色调。

如下图所示的数据知道地说明了为什么蓝色是设计师最偏爱的色调，以及为什么橙色使用最少。不过，颜色的选取不需要仅仅依据个人偏好，还需要考量用户行为和倾向。

Imagecredits:，中文为译者注

四、清晰传达相关性

在设计时，利用元素的视觉差异来体现组织和关联更易于：如使用图案、颜色和长度等基本元素来体现相关（或相近性）或不相关（差异）。

如右图图示，沙龙（旧）网站的两个构成个别由他们的相对厚度来区别，用户可以知道地认知到两个独立的区域：左侧的「头条故事」和右侧的「最多阅读」。虽然这两个个别的功能：展示文章，都是一样的。但是，通过放大「头条故事」的版面，并以不同色彩显示作者名称，让客户首先注意到这个部分。

这与「相似定律」有关：即便元素是分开的，人眼倾向于将设计上相同的个别看作一个整体。

Imagecredits:，中文为译者注

如果里面的事例还没有说服你，让我们说说如何在设计中使用「相似定律」来传达关系。

链接和导航是便于客户快速浏览网站最常见的方式。通常，用户不会通读整个页面，而是浏览链接或使用导航来查找它们所需的信息。

设计师在日常网页设计中，经常有意无意地使用「相似定律」，它可以拿来解释为什么如此多设计师喜欢使用红色下划线或看上去一样的链接。

中国船主协会（BoatUS）的官网网站使用下划线和色彩来体现导航链接组之间的关系，让读者将触觉相似的导航链接感知为站点的数据结构中相关或层级相同的内容。

五、聚集、合并、拆分以简化视觉

大多数与我们合作的用户都说，「我们想要能给用户留下深刻印象的、简洁直观的应用设计」。

用户不偏爱混乱复杂的设计，Hubspot组织的一项调查显示，「访客注重是否能轻松找到所需信息达到漂亮的设计或愉悦的感受」。

Imagecredit:，中文为译者注

设计师必须组织合并类似的元素、信息或内容来简化布局。正确使用这种元素将对客户体验形成积极影响。

这涉及「邻近法则」：相关的元素应维持接近，而不相关的元素应避开或分开。

Imagecredits:，中文为译者注

设计师有两种运用「邻近法则」增强可用性的方法：

（1）帮助用户找到它们正在寻求的东西：你能否曾被分类杂乱的网站困住？

如下图，用户期望查看可选购的笔记本电脑类型。如果你期望用户能轻松找到，将相关物品归到“Computers＆Office”的以下（如右图右边），而不是提供混成一团的选项（如右图右边）。

（2）借助元素的视觉层级彰显界面结构：构建如字体层级、颜色层级等视觉层级，可以帮助设计师或者非设计师作出美观且信息传达有效的设计。

有一句老话也适用于设计：「如果一切都很突出，那么就什么也没有突出」。设计时需要考量用户意愿，而不是只是借助好看的设计来欺骗用户。

本文中，我们介绍了5种心理学机理，来帮助你提升设计。其中，你认为能最快应用到设计中的是哪一条，最难的呢？也请你们结合自己以前接触的项目案例探讨一下这个难题吧。

原文：