大家好，我是游戲交互設(shè)計(jì)師懶螞蟻GM，今天跟大家科普一下每個(gè)設(shè)計(jì)師的基礎(chǔ)必備技能——格式塔心理學(xué)。

格式塔心理學(xué)

起源：20世紀(jì)初，德國成為歐洲乃至世界經(jīng)濟(jì)強(qiáng)國，欲統(tǒng)一世界的野心使整個(gè)國內(nèi)形成了強(qiáng)調(diào)統(tǒng)一、積極主觀能動(dòng)的整體社會意識形態(tài)。受此意識形態(tài)的影響，心理學(xué)領(lǐng)域也展開了對整體性的研究。20世紀(jì)20年代,德國著名心理學(xué)家馬科斯·韋特墨（Max Wertheimer，1880-1943）、沃爾夫?qū)た晾眨╓olfgang K?hler，1887-1967）和科特·考夫卡（Kurt Koffka，1886-1941）在研究似動(dòng)現(xiàn)象的基礎(chǔ)上創(chuàng)立了格式塔學(xué)派，其發(fā)表的觀點(diǎn)被稱為格式塔心理學(xué)，又叫完形心理學(xué)。格式塔是德文Gestalt的譯音，意即“模式、形狀、形式”等，意思是指“動(dòng)態(tài)的整體（Dynamic Wholes）”。

內(nèi)容：格式塔心理學(xué)強(qiáng)調(diào)經(jīng)驗(yàn)和行為的整體性，建立在由Max Wertheimer于1923年提出“整體大于部分之和”的理論基礎(chǔ)上，認(rèn)為人們的審美觀對整體與和諧具有一種基本的要求。簡單地說，我們的視覺更傾向于將對象看作一個(gè)整體來認(rèn)知，然后再分析組成這個(gè)整體的各個(gè)部分。由于專業(yè)領(lǐng)域及研究角度的不同，業(yè)界內(nèi)外學(xué)者對格式塔心理學(xué)的提煉也具有差異。目前以較為典型的接近性、相似性、閉合性、連續(xù)性和簡單性組成了較為常用的一組視知覺原理，成為交互設(shè)計(jì)師以及視覺設(shè)計(jì)師手中必不可少的工具，也是去驗(yàn)證設(shè)計(jì)方案是否達(dá)到預(yù)期和評價(jià)設(shè)計(jì)優(yōu)劣的重要手段。

接近性

我們傾向于將位置上相互靠近的元素感知為一個(gè)整體。元素之間的相對距離會影響我們感知它們是否或者以何種規(guī)則組織在一起?；ハ嗫拷脑乇灰暈橐唤M，而那些距離較遠(yuǎn)的則自動(dòng)被劃分到組外。如下圖，左圖中的小圓被視為左、右兩個(gè)分組，右圖中的小圓被視為上、下兩個(gè)分組。

格式塔接近性示意圖

接近性原則廣泛應(yīng)用于頁面內(nèi)容的整理和分類中，通過將具有一定相關(guān)性的內(nèi)容放置在一起，并保持與不相關(guān)內(nèi)容間的距離，從而保證整個(gè)界面內(nèi)容布局的合理性，給玩家的視覺與秩序和合理的休憩，提高易讀性。例如《王者榮耀》進(jìn)入對局的加載界面，通過運(yùn)用格式塔接近性原則，將10名玩家分為上方和下方兩個(gè)不同的陣營。

《王者榮耀》對局加載界面

相似性

我們傾向于將內(nèi)容上彼此相似的元素感知為一個(gè)整體。相似性可以幫助我們組織和分類頁面元素，并將它們與特定的含義或功能相關(guān)聯(lián)。這也意味著如果元素具有相同的功能、含義或?qū)蛹壗Y(jié)構(gòu)，則應(yīng)在視覺上保持一定的相似性，主要是指形狀、大小和顏色的相似性。如下圖，我們傾向于將圖1分為“圓形”和“星形”兩組，將圖2分為“大圓”和“小圓”兩組，將圖3分為“藍(lán)圓”和“橙圓”兩組。

格式塔相似性示意圖

相似性原則主要應(yīng)用于界面設(shè)計(jì)中的視覺設(shè)計(jì)，通過調(diào)整顏色、大小、形狀等特征使一些元素具有視覺上的統(tǒng)一性，從而向玩家表明這些元素具有相同的層級結(jié)構(gòu)或相似的功能語義。同時(shí)，也可以反過來運(yùn)用相似性原則來突出元素在具體功能上不同，一般會運(yùn)用一種或結(jié)合使用兩種差異性來使元素達(dá)到更加突出醒目的目的。

形狀：《鎮(zhèn)魔曲》創(chuàng)建角色界面中，左側(cè)的圖標(biāo)在未選中狀態(tài)下均具有灰色半透明底色和亮色描邊，表明這些圖標(biāo)具有相同的功能，即全都是用來表示可供玩家選擇的人物角色。同時(shí)，圖標(biāo)中圖樣形狀的差異性表明它們所代表著不同的門派角色，又通過不透明白色底板加金色描邊來突出選中圖標(biāo)的差異性。

《鎮(zhèn)魔曲》創(chuàng)建角色界面

大?。?/strong>《貓和老鼠》鍵位設(shè)置界面中，通過增加控件的尺寸來提醒玩家所選擇的鍵位組合，同時(shí)結(jié)合顏色的差異性來使玩家選中的鍵位更加突出和醒目。

《貓和老鼠》鍵位設(shè)置界面

顏色：《神都夜行錄》的妖靈召喚概率界面中，表頭文字為綠色，SSR妖靈為橘色、SR妖靈為紫色、R妖靈為藍(lán)色、表示概率的數(shù)值為黃色，通過使用不同的顏色使內(nèi)容合理歸類，有助于玩家快速獲取信息。

《神都夜行錄》妖靈召喚概率界面

閉合性

我們傾向于將不完整的局部形象感知為一個(gè)整體形象。視覺會自動(dòng)嘗試將殘缺的圖形閉合起來，從而將其感知為一個(gè)整體而不是整體的許多部分。需要注意的是，只有當(dāng)視覺形象為我們所熟悉時(shí)，才可以產(chǎn)生整體閉合聯(lián)想。如下圖，左圖是世界自然基金會（簡稱WWF）的徽標(biāo)，雖然熊貓的頭部和背部的輪廓有缺失，但是我們依舊會產(chǎn)生整體閉合聯(lián)想，結(jié)合自己的經(jīng)驗(yàn)判斷出這是一只熊貓，正如右側(cè)蘋果公司的Logo一樣，即使圖形沒有完全封閉，我們也可以判定出這是一個(gè)蘋果。

格式塔閉合性示意圖

閉合性原則的直觀表現(xiàn)是用更少的元素表達(dá)出更多的信息，使界面內(nèi)容簡約不冗雜，同時(shí)使玩家能夠做到“窺一斑而知其全貌”。在界面設(shè)計(jì)中，當(dāng)同類型元素?cái)?shù)量過多或所占空間較大，界面無法將其全部顯示時(shí)，這些元素一般采用上下、左右或其他特殊形式進(jìn)行排布，并采用截?cái)嗍皆O(shè)計(jì)讓玩家通過殘留的部分內(nèi)容，自行腦補(bǔ)判斷出界面之外還有其他內(nèi)容。

縱向：《QQ飛車》賽車列表界面中，最底部一行賽車卡片采用的便是截?cái)嗍皆O(shè)計(jì)的表現(xiàn)手法。當(dāng)我們的視覺注意到賽車卡片不完整的時(shí)候，大腦就會立刻告訴我們“向下滑吧，下面還有賽車卡片”。

《QQ飛車》賽車列表界面

橫向：《亂斗西游2》章節(jié)列表界面中，最右側(cè)的章節(jié)卡片采用截?cái)嗍皆O(shè)計(jì)，意欲告訴玩家繼續(xù)向右滑可查看其他關(guān)卡。

《亂斗西游2》章節(jié)列表界面

環(huán)形：《亂斗西游2》游戲菜單界面中，通過將“奇遇”、“闖關(guān)”、“對戰(zhàn)”、“幫派”、“排行榜”這五大模塊前后環(huán)繞、層層折疊進(jìn)行排布，不僅使玩家對游戲玩法模塊有個(gè)宏觀的把控，而且有效減少了內(nèi)容所占空間，視覺上更顯張力，同時(shí)具有一定的趣味性。

《亂斗西游2》游戲菜單界面

連續(xù)性

我們傾向于將具有一定相關(guān)性的分散的碎片感知為一個(gè)連續(xù)的整體。連續(xù)性使我們能夠通過元素的構(gòu)圖來歸納出具有規(guī)律性的方向和運(yùn)動(dòng)，從而提高了視覺內(nèi)容的易讀性。連續(xù)性原則加強(qiáng)了用戶對分組信息的感知，創(chuàng)建了秩序并引導(dǎo)用戶對不同的內(nèi)容進(jìn)行細(xì)分。如下圖，國際商業(yè)機(jī)器公司（簡稱IBM）的Logo是由一些不連續(xù)的線條組成的條紋狀的圖形。我們的視覺在處理這些分散的條紋時(shí)，會自動(dòng)的將其感知為連續(xù)的圖形，從而可以輕易識別出這是“IBM”3個(gè)英文字母。

格式塔連續(xù)性示意圖

連續(xù)性原則的運(yùn)用，一般都是將元素呈曲線排布，來使界面顯得更加活潑。如《流星群俠傳》武學(xué)界面中，“槍”、“劍”、“刀”等武學(xué)圖標(biāo)呈環(huán)形排布。玩家的視覺會自動(dòng)將其看成一條連續(xù)的曲線，從而依次獲取信息，形成有序的、不中斷的視覺流。再如《龍族幻想》中當(dāng)玩家與場景進(jìn)行交互時(shí)，玩家處于視覺中心，選項(xiàng)呈曲線分布于玩家兩側(cè)。

《流星群俠傳》武學(xué)界面

《龍族幻想》界面

簡單性

我們傾向于將復(fù)雜的信息元素感知為易于理解的簡單而有序的對象。當(dāng)我們在一個(gè)設(shè)計(jì)中看到復(fù)雜的物體時(shí)，視覺便嘗試將它們轉(zhuǎn)換為簡單的形狀，并從這些形狀中移除無關(guān)的細(xì)節(jié)來簡化這些物體。如下圖，我們的視覺會在第一時(shí)間判定為這是由兩個(gè)圓形組成的圖形，而不是兩個(gè)或三個(gè)其他復(fù)雜的圖形所組成的，這就是簡單性原則。我們的視覺更傾向于在復(fù)雜的形狀中尋找簡單而有序的對象。

格式塔簡單性示意圖

《龍族幻想》登錄時(shí)的選擇角色界面，背景為一片漆黑的星空，“返回”和“開始”等按鈕都是常見的、簡單的幾何圖形，沒有任何元素進(jìn)行裝飾，界面整體和角色立繪呈現(xiàn)強(qiáng)烈的反差。這樣簡單的設(shè)計(jì)，不僅使界面看起來干凈整潔，而且角色立繪突出，盡顯角色精美的造型和炫酷的動(dòng)作。

《龍族幻想》選擇角色界面

除此之外，格式塔原則中還經(jīng)常被運(yùn)用的還有主體與背景原則以及共同命運(yùn)原則。其中，主體與背景原則指的是，我們的視覺會將界面中占據(jù)我們主要注意力的元素視為主體，其余元素視為背景。當(dāng)主體與背景重疊時(shí)，視覺更加傾向于將小的元素視為主體，大的元素視為背景。共同命運(yùn)原則一般針對具有運(yùn)動(dòng)性質(zhì)的元素而言。我們的視覺會將運(yùn)動(dòng)的元素歸為一組，靜止的元素歸為另一組。同時(shí)，在運(yùn)動(dòng)的元素中，我們的視覺會將運(yùn)動(dòng)狀態(tài)相同的元素歸為一組，其余元素歸為另一組。