知其然知其所以然-设计准则从何而来（一）

最近在读《认知与设计，理解UI设计准则》，主要的内容是从底层分析设计原则：设计原则为什么是这样？为什么这个是原则？

从1976年开始就已经有界面设计准则，而到现在网络上也到处充斥着“表单设计十忌”，“注册的N种设计方式”等等等等类似的文章，看得少还好，看得多了难免会迷惑：有些准则，禁忌甚至是冲突的。就好像时间一样，你有一块表，问你几点了你知道，如果你有两块时间不一样的表，你知道几点了吗？

而这本书试图从更底层的角度来诠释设计准则，让你了解设计准则是由于什么原因推导出的，究其本质，还是回归到人类的心理，视觉，生理等方面的习惯，方式，本能等因素。而掌握这些因素，会让你更深入了解设计准则的意义和目的，甚至归纳自己的设计准则。

再多提一嘴作者：Jeff Johnson，《GUI设计禁忌》正是他的作品。

我们感知自己的期望

人类对于外部世界的感知，不是完全真实的描述，很大程度是我们“期望”感知到的，也会受到三个因素的影响

• 过去：我们的经验
• 现在：当前的环境
• 将来：我们的目标

再举下例子

被经验影响：看看下面这样随手泼墨的画，第一感觉就是各种无序的墨点构成

而如果告诉你这是一只花园里的斑点狗，你看出来了吗？因为你对场景和主体都已经有了自己的概念，即有了自己的理解。

被环境影响：

同样的一个不完整的字母，放到不同的场景下，第一个会被认为是H，第二个会认为是A

类似的还有海底捞的一个说法：在接受到的服务很好的情况下，客人会觉得味道也很好~

被目标影响：

这个例子更简单和直接了：新浪微博大家都用，顶部导航的第三个是什么？有印象吗？如果不是那个频道的目标用户，基本都不会有什么印象，因为我们的目标明确，不会关注其他的；这是目标影响视觉的例子。同时这个也是“网页为扫描而不是为阅读设计”的理论支持。

对于设计这些意味着什么？

1. 避免歧义：避免显示有歧义的信息，并通过测试确认所有用户对信息的理解是一致的。
2. 保持一致：在一致的位置摆放信息和控件。这样的一致性能让用户很快的找到和识别
3. 理解目标：用户去用一个系统是有目标的。在一次交互的每个点上，确保提供了用户需要的信息，并非常清晰的对应到一个可能的用户目标，是用户能够注意到并使用这些信息。

为观察结构优化我们的视觉

20世纪早期，一个由德国心理学家组成的研究小组试图解释人类视觉的工作原理。他们观察了许多重要的视觉现象并对它们编订了目录。其中最基础的发现是人类视觉是整体的：我们的视觉系统自动对视觉输入构建结构，并且在神经系统层面上感知形状，图形和物体，而不是只看到互不相连的边、线和区域。这些理论统称为“格式塔”原理，其中包括以下几条

1. 接近性：物体之间的相对距离会影响我们感知他们是否以及如何组织在一起
2. 相似性：如果其他因素相同，那么相似的物体看起来归属于一组
3. 连续性：我们的视觉倾向于感知连续的形式而不是离散的碎片
4. 封闭性：我们的视觉系统自动尝试将敞开的图形关闭起来，从而将其感知为完整的物体而不是分散的碎片
5. 对称性：我们倾向于分解复杂的场景来降低复杂度
6. 主体/背景：我们的大脑将区域分为主体和背景，主体包括一个场景中占据我们主要注意力的所有元素，其余的则是背景
7. 共同命运：针对运动的物体，一起运动的物体被感知为属于一组或者是彼此相关的
8. 格式塔原理可以综合

看看上面这个界面，可以用格式塔原理去解释中间很多设计方式和方法，比如位置，背景，相似性，接近性等等。

对于设计这些意味着什么？

我们平时做设计可能会导致无意产生的视觉关系。而为了能够满足这些人类视觉的特点，推荐的办法是在设计一个界面之后，使用每个格式塔原理，来考量各个设计元素之间的关系是否复核设计的初衷。

作者：党韬

文章来源：pd4.me

标签： 设计原则 UI设计准则 

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点！
本站所提供的图片等素材，版权归原作者所有，如需使用，请与原作者联系。