格式塔心理学在游戏交互设计中的运用

大家好,我是游戏交互设计师懒蚂蚁GM,今天跟大家科普一下每个设计师的基础必备技能——格式塔心理学。

格式塔心理学

起源:20世纪初,德国成为欧洲乃至世界经济强国,欲统一世界的野心使整个国内形成了强调统一、积极主观能动的整体社会意识形态。受此意识形态的影响,心理学领域也展开了对整体性的研究。20世纪20年代,德国著名心理学家马科斯·韦特墨(Max Wertheimer,1880-1943)、沃尔夫冈·苛勒(Wolfgang Köhler,1887-1967)和科特·考夫卡(Kurt Koffka,1886-1941)在研究似动现象的基础上创立了格式塔学派,其发表的观点被称为格式塔心理学,又叫完形心理学。格式塔是德文Gestalt的译音,意即“模式、形状、形式”等,意思是指“动态的整体(Dynamic Wholes)”。

内容:格式塔心理学强调经验和行为的整体性,建立在由Max Wertheimer于1923年提出“整体大于部分之和”的理论基础上,认为人们的审美观对整体与和谐具有一种基本的要求。简单地说,我们的视觉更倾向于将对象看作一个整体来认知,然后再分析组成这个整体的各个部分。由于专业领域及研究角度的不同,业界内外学者对格式塔心理学的提炼也具有差异。目前以较为典型的接近性

相似性闭合性连续性简单性组成了较为常用的一组视知觉原理,成为交互设计师以及视觉设计师手中必不可少的工具,也是去验证设计方案是否达到预期和评价设计优劣的重要手段。

接近性

我们倾向于将位置上相互靠近的元素感知为一个整体。元素之间的相对距离会影响我们感知它们是否或者以何种规则组织在一起。互相靠近的元素被视为一组,而那些距离较远的则自动被划分到组外。如下图,左图中的小圆被视为左、右两个分组,右图中的小圆被视为上、下两个分组。

格式塔心理学在游戏交互设计中的运用

格式塔接近性示意图

接近性原则广泛应用于页面内容的整理和分类中,通过将具有一定相关性的内容放置在一起,并保持与不相关内容间的距离,从而保证整个界面内容布局的合理性,给玩家的视觉与秩序和合理的休憩,提高易读性。例如《王者荣耀》进入对局的加载界面,通过运用格式塔接近性原则,将10名玩家分为上方和下方两个不同的阵营。

格式塔心理学在游戏交互设计中的运用

《王者荣耀》对局加载界面

相似性

我们倾向于将内容上彼此相似的元素感知为一个整体。相似性可以帮助我们组织和分类页面元素,并将它们与特定的含义或功能相关联。这也意味着如果元素具有相同的功能、含义或层级结构,则应在视觉上保持一定的相似性,主要是指形状、大小和颜色的相似性。如下图,我们倾向于将图1分为“圆形”和“星形”两组,将图2分为“大圆”和“小圆”两组,将图3分为“蓝圆”和“橙圆”两组。

格式塔心理学在游戏交互设计中的运用

格式塔相似性示意图

相似性原则主要应用于界面设计中的视觉设计,通过调整颜色、大小、形状等特征使一些元素具有视觉上的统一性,从而向玩家表明这些元素具有相同的层级结构或相似的功能语义。同时,也可以反过来运用相似性原则来突出元素在具体功能上不同,一般会运用一种或结合使用两种差异性来使元素达到更加突出醒目的目的。

形状:《镇魔曲》创建角色界面中,左侧的图标在未选中状态下均具有灰色半透明底色和亮色描边,表明这些图标具有相同的功能,即全都是用来表示可供玩家选择的人物角色。同时,图标中图样形状的差异性表明它们所代表着不同的门派角色,又通过不透明白色底板加金色描边来突出选中图标的差异性。

格式塔心理学在游戏交互设计中的运用

《镇魔曲》创建角色界面

大小:《猫和老鼠》键位设置界面中,通过增加控件的尺寸来提醒玩家所选择的键位组合,同时结合颜色的差异性来使玩家选中的键位更加突出和醒目。

格式塔心理学在游戏交互设计中的运用

《猫和老鼠》键位设置界面

颜色:

《神都夜行录》的妖灵召唤概率界面中,表头文字为绿色,SSR妖灵为橘色、SR妖灵为紫色、R妖灵为蓝色、表示概率的数值为黄色,通过使用不同的颜色使内容合理归类,有助于玩家快速获取信息。

格式塔心理学在游戏交互设计中的运用

《神都夜行录》妖灵召唤概率界面

闭合性

我们倾向于将不完整的局部形象感知为一个整体形象。视觉会自动尝试将残缺的图形闭合起来,从而将其感知为一个整体而不是整体的许多部分。需要注意的是,只有当视觉形象为我们所熟悉时,才可以产生整体闭合联想。如下图,左图是世界自然基金会(简称WWF)的徽标,虽然熊猫的头部和背部的轮廓有缺失,但是我们依旧会产生整体闭合联想,结合自己的经验判断出这是一只熊猫,正如右侧苹果公司的Logo一样,即使图形没有完全封闭,我们也可以判定出这是一个苹果。

格式塔心理学在游戏交互设计中的运用

格式塔闭合性示意图

闭合性原则的直观表现是用更少的元素表达出更多的信息,使界面内容简约不冗杂,同时使玩家能够做到“窥一斑而知其全貌”。在界面设计中,当同类型元素数量过多或所占空间较大,界面无法将其全部显示时,这些元素一般采用上下、左右或其他特殊形式进行排布,并采用截断式设计让玩家通过残留的部分内容,自行脑补判断出界面之外还有其他内容。

纵向:《QQ飞车》赛车列表界面中,最底部一行赛车卡片采用的便是截断式设计的表现手法。当我们的视觉注意到赛车卡片不完整的时候,大脑就会立刻告诉我们“向下滑吧,下面还有赛车卡片”。

格式塔心理学在游戏交互设计中的运用

《QQ飞车》赛车列表界面

横向:《乱斗西游2》章节列表界面中,最右侧的章节卡片采用截断式设计,意欲告诉玩家继续向右滑可查看其他关卡。

格式塔心理学在游戏交互设计中的运用

《乱斗西游2》章节列表界面

环形:《乱斗西游2》游戏菜单界面中,通过将“奇遇”、“闯关”、“对战”、“帮派”、“排行榜”这五大模块前后环绕、层层折叠进行排布,不仅使玩家对游戏玩法模块有个宏观的把控,而且有效减少了内容所占空间,视觉上更显张力,同时具有一定的趣味性。

格式塔心理学在游戏交互设计中的运用

《乱斗西游2》游戏菜单界面

连续性

我们倾向于将具有一定相关性的分散的碎片感知为一个连续的整体。连续性使我们能够通过元素的构图来归纳出具有规律性的方向和运动,从而提高了视觉内容的易读性。连续性原则加强了用户对分组信息的感知,创建了秩序并引导用户对不同的内容进行细分。如下图,国际商业机器公司(简称IBM)的Logo是由一些不连续的线条组成的条纹状的图形。我们的视觉在处理这些分散的条纹时,会自动的将其感知为连续的图形,从而可以轻易识别出这是“IBM”3个英文字母。

格式塔心理学在游戏交互设计中的运用

格式塔连续性示意图

连续性原则的运用,一般都是将元素呈曲线排布,来使界面显得更加活泼。如《流星群侠传》武学界面中,“枪”、“剑”、“刀”等武学图标呈环形排布。玩家的视觉会自动将其看成一条连续的曲线,从而依次获取信息,形成有序的、不中断的视觉流。再如《龙族幻想》中当玩家与场景进行交互时,玩家处于视觉中心,选项呈曲线分布于玩家两侧。

格式塔心理学在游戏交互设计中的运用

《流星群侠传》武学界面

格式塔心理学在游戏交互设计中的运用

《龙族幻想》界面

简单性

我们倾向于将复杂的信息元素感知为易于理解的简单而有序的对象。当我们在一个设计中看到复杂的物体时,视觉便尝试将它们转换为简单的形状,并从这些形状中移除无关的细节来简化这些物体。如下图,我们的视觉会在第一时间判定为这是由两个圆形组成的图形,而不是两个或三个其他复杂的图形所组成的,这就是简单性原则。我们的视觉更倾向于在复杂的形状中寻找简单而有序的对象。

格式塔心理学在游戏交互设计中的运用

格式塔简单性示意图

《龙族幻想》登录时的选择角色界面,背景为一片漆黑的星空,“返回”和“开始”等按钮都是常见的、简单的几何图形,没有任何元素进行装饰,界面整体和角色立绘呈现强烈的反差。这样简单的设计,不仅使界面看起来干净整洁,而且角色立绘突出,尽显角色精美的造型和炫酷的动作。

格式塔心理学在游戏交互设计中的运用

《龙族幻想》选择角色界面

除此之外,格式塔原则中还经常被运用的还有主体与背景原则以及共同命运原则。其中,主体与背景原则指的是,我们的视觉会将界面中占据我们主要注意力的元素视为主体,其余元素视为背景。当主体与背景重叠时,视觉更加倾向于将小的元素视为主体,大的元素视为背景。共同命运原则一般针对具有运动性质的元素而言。我们的视觉会将运动的元素归为一组,静止的元素归为另一组。同时,在运动的元素中,我们的视觉会将运动状态相同的元素归为一组,其余元素归为另一组。


分享到:


相關文章: