前言:最近在从新梳理学习过设计原理,无意中翻看到这个经典基本设计原理。可能平时都已经有意无意在实际工作中都已经用到了,但就是没有一个可靠理论支撑或是叫说法,所以现有重新整理并且发布这个格式塔原理。
什么是格式塔原理 (Gestalt)
格式塔心理学诞生于1912年,是由德国心理学家组成的研究小组试图解释人类视觉的工作原理。他们观察了许多重要的视觉现象并对它们编订了目录。其中最基础的发现是人类视觉是整体的:我们的视觉系统自动对视觉输入构建结构,并在神经系统层面上感知形状、图形和物体,而不是只看到互不相连的边、线和区域。“形状”和“图形”在德语中是Gestalt,因此这些理论也称做视觉感知的格式塔原理。
格式塔研究结论:
创始人提出的5项基本原则:
格式塔5大原理
「接近原则」
接近原则就是指距离相近的各部分趋于组成整体,强调位置。
接近原则 如上图所示,从第一感觉而言,用户在脑海中无疑会形成这样的认识:左图中的圆是横向排列的,右图中的圆是纵向排列的。因为在左图中,圆的相互之间在水平方向比在垂直方向距离近。
在设计中,应用接近法则可以达到减少用户界面上视觉凌乱感。
足球网站 又如下面的界面设计中:
应用中心 在设计中,利用接近原则,信息组之间用不同间距大小留白空间区分,页面元素会更简洁,阅读信息时干扰也少,相互关联的信息也更为紧密。
「相似原则」
相似原则指的是在某一方面相似的各部分趋于组成整体,强调内容。而接近强调位置。
人们通常把那些明显具有共同特性(如形状、运动、方向、颜色等)的事物组合在一起。
其实,相近性原则,我们在一些手机app上也比较常见。比如,手机QQ上的底部导航icon就是形状和大小相似性栗子;同样,在一些用户注册页面,利用纯色引导给当前执行区域特殊标注,人们的视觉会自动把相同填充色的归类,而那个特殊的区块会从中剥离出来。
QQ导航
一些表单注册页面流程
「封闭原则」
封闭原则指的是彼此相属、构成封闭实体的各部分趋于组成整体。
封闭原则 如上图,我们可能第一是视觉感受是,左边的图案是一个圆,右边的图案是一个四边形。这是为什么呢?因为我们的视觉系统强烈倾向于看到物体,以至于它能将一个空白区解析成一个物体,所以我们看到上图所呈现的是一个圆而非多条线段。
当然,还有一个典型的案例:
案例1 最著名的应用便是苹果公司的logo,咬掉的缺口唤起人们的好奇、疑问,给人巨大想象空间。但从整理上看,却又是一个苹果的剪影。
苹果官方logo 又如著名国际设计大奖,德国红点奖-Reddot design award的官方logo也是运用了封闭原则。用更少的视觉元素表达,减轻人在图形识别上的精力消耗。
「连续原则」
连续原则指的是凡具有连续性或共同运动方向的部分容易被看成一个整体。
连续原则 视觉倾向于感知连续的形式,以便把元素联接在一起而不是离散的碎片。如上图,我们看到的左图是蓝橙两条相交线而非四条线段与一个圆点;右图,我们看到的是一排有方向圆而不是9个圆的单一体。
连续与闭合并存的情况很多,为了更好区分,下面放一个闭合的例子做比较。
连续与闭合的差异 在日常设计中,我们常常会根据素材的特点进行版面排版,比如下面的这个网页:利用了人物的视线焦点来吸引了用户,就算用户第一视觉落脚点是在人物身上,但随着视线的转移,用户会自然而然地根据人物的视线方向看去,然后左侧的文字就成为了有力的第二视觉落脚点。从而,整个页面中,很巧妙地将人物与文字结合在一起而不会觉得右侧的人物是一个元素,左侧的文字又是另外的一个元素。
「简单原则」
简单原则就是具有对称、规则、平滑的简单图形特征的各部分趋于组成整体。
我们的眼睛在观看时,眼脑并不是在一开始就区分一个形象的各个单一的组成部分,而是将各个部分组合起来,使之成为一个更易于理解的统一体。
简单原则 简单原理包含着一定的构图法则,例如最常见的三角形构图,均衡构图,对阵构图,向心式构图(圆形)、对角线,X型,构图等,其目的都是为了在复杂的信息环境中,构建更易懂的整体。
三角形构图的网页设计 均衡、垂直、对角线构图的设计 向心、X形构图的设计
总结
在日常设计中,各种格式塔原理运用并不是孤立的,而是共同起作用的。在工作中用每一条原理来考量各个设计元素之间的关系是否符合设计初衷。设计师是自己稿子的第一道QA人员,我们不能做到让它人人称赞但可以在常识问题上不犯错误。通过这些理论知识的学习减少主工作中的主观臆断,并使设计方案更有依据。觉得本文章对自己有用户那就收藏吧!