‘格式塔’原理视觉解析

’格式塔‘视觉原理的运用

格式塔心理学科是认知心理学中的一个重要理论，在视觉设计中已经有较大的影响，了解大众的视觉认知工作原理不仅可以设计出更加符合用户认知的界面，而且还能做到每一个元素、颜色、布局都有严格的理论依据去支撑。

什么是格式塔？

格式塔心理学诞生于1912年，是由德国心理学家组成的研究小组试图解释人类视觉的工作原理。他们观察了许多重要的视觉现象并对它们编订了目录。其中最基础的发现是人类视觉是整体的:我们的视觉系统自动对视觉输入构建结构，并在神经系统层面上感知形状、图形和物体，而不是只看到互不相连的边、线和区域。“形状”和“图形”在德语中是Gestalt,因此这些理论也称做视觉感知的格式塔原理。

若去深究格式塔原理，可能需要相当长的时间来学习理解，作为交互设计师和界面设计师，其实只要理解这几个原理的含义和使用方法，就可以对自己的设计做出指导和支撑了。

格式塔理论明确地提出：眼脑作用是一个不断组织、简化、统一的过程，正是通过这一过程，才产生出易于理解、协调的整体。由此产生出了格式塔的一些基本原则(适用于布局和界面设计)：

格式塔原理——图形与背景、接近、相似、闭合、连续、简单、均衡。

图形与背景原理

知觉帮助我们把图形从背景中分离出来。图形与背景的对比越大，图形的轮廓越明显，则图形越容易被发觉。这个原理指出，我们在感知事物的时候，总是自动的将视觉区域分为主体和背景，我们可以利用这个原理拉伸整个设计的层次，做到突出我们想要用户看到的，比如，手机应用中常常使用的灯箱，通过将当前的内容变暗，将之转换成为背景，之后弹出灯箱，使用户的视觉焦点转移。

接近性原理

距离（位置）相近的各部分趋于组成整体。这是最简单、也是最常用的原理。

如上图所示，左图为同样大小、间距相同的一组圆，看到之后我们并没有列的倾向，感觉就是一组。第二幅图我们只是改变一下某些圆之间间距，当看到第二组圆之后，我们主观上很容易看成竖立的四列圆点，认知上自动有了分组的倾向。接近性原理多运用在界面文字、板块等的分组中。同一类型东西，往往在空间上有更近的距离，这就是用户在距离上的心理认知模型，把握好，合理利用，不违背，才能做出学习成本更低的用户界面。

上面两幅图都在距离上进行了合理的分组，都是为了方便用户操作，相反如果同一组的控件的摆放距离相隔太远或者横纵接近的方式不对或者没有使用任何的区域分割线的话，人们就很难感知到它们是你预期的那样的相关性，软件就会变得难以学习和使用。

相似性原理

如果其他因素相同，那么相似的物体看起来归属一组

上图是相同间距的两组圆，第一组认知上为4列圆；第二组圆只是更改了两排圆的颜色，马上我们的圆点在视觉上就会按横向去排列了，颜色上的相似会强烈的引导我们的视觉，促使我们改变这些圆点的排列方向。

简单举例：比如表单列表，由于横向间距较大，视觉认知很容易去纵向阅读，而我们又期望用户去横向阅读来获取信息，所以加了灰色条之后，我们的视觉认知就很容易去横向阅读了。

闭合原理

彼此相属、构成封闭实体的各部分趋于组成整体。

人们倾向于将缺损的轮廓加以补充使之成为一个完整的封闭整体

如上左图，没有三角形和圆，但是我们心理模型中习惯填充缺失的信息，创建我们熟知的形状和图形。设计中通过不完整的图形，让浏览者去闭合，可以吸引用户的兴趣和关注。最著名的应用便是苹果公司的logo，咬掉的缺口唤起人们的好奇、疑问，给人巨大想象空间。封闭性在交互上的的扩展，还可以理解为对完整状态的认知倾向，比如“操作的闭环”，运用到流程设计中去，比如：添加购物车后购物车的反馈，删除后的效果等等操作的闭环。

连续原理

在知觉过程中人们往往倾向于使知觉对象的直线继续成为直线，使曲线继续成为曲线。凡具有连续性或者共同运动方向的物体容易看做一个整体。

上图：整幅图相当混乱，但是知觉上会弱化这些分割所带来的“块”，而依然意识到“直线、圆、曲线”。

上图：箭头的方式、半遮挡的方式，模拟现实叠加的方式，都是通过视觉的连续性的运用，运动方向的指引不仅起到对内容的扩充，而且具有相同运动方向的物体还容易被看成一个模块，三种方式并没有好坏之分，只不过是根据当前用户的使用场景，或者产品的目的来选择适当的方式而已。

简单原理

我们的眼睛在观看时，眼脑并不是在一开始就区分一个形象的各个单一的组成部分，

而是将各个部分组合起来，使之成为一个更易于理解的统一体。先看到整体，再看到局部。

人眼总是先看到主体在看到背景，先看到轮廓再看到细节..眼脑一直是处于组织-调取之间，越简单的图形大脑越容易认知，简单原理还可以解释为“与过去学习到的规律一样的、相似的对象更容易认知”。认知难度大约是“圆≈方≤星＜多边形”，越是简单的图形认知难度越低。所以做设计尽量避免自嗨，简单有效的设计，更符合我们用户的心理认知模型。

均衡原理（对称性）

知觉倾向于寻求视觉组合中的秩序或平衡。

左图一个杠杆上两个球，同样质地的两个球，大球被小球翘了起来，是不是感觉怪怪的，因为我们会认为同样颜色质地的两个球，重量必然是大的球的质量会更大，但是重量大的反而被重量小的翘了起来，这必然不符合我们用户的认知模型，但是，如图二，我们将大球的颜色变淡，大球被小球翘了起来，整个都会变得更合理一些了，这是就是视觉重量或者视觉流，根据视觉元素重量的不同，来营造视觉平衡;也可以根据'不平衡‘依靠视觉重量，引导用户视觉流。

以上即是通过格式塔学习后的思考总结，虽然是分开举例，但是在现实世界的视觉场景中，各种格式塔原理并不是孤立的，而是共同起作用。在工作中用每一条原理来考量各个设计元素之间的关系，减少工作中的主观臆断，才能使设计方案更有依据，做出更加符合用户认知模型的有效设计。