相信設(shè)計(jì)師對(duì)格式塔原理都無比熟悉，提起格式塔我們總會(huì)記得幾個(gè)原理：相近、相似、對(duì)稱……，但它的全貌應(yīng)該比較模糊了。溫故知新，希望這篇文章能帶給你新的認(rèn)識(shí)。Enjoy~
當(dāng)我們看見一本書時(shí)，我們會(huì)認(rèn)為是一本書，而不是一個(gè)有著紅色封面、長寬高比例為多少、帶有紋理裝飾的長方體。我們都會(huì)通過整體去認(rèn)知事物，而不是將其割裂成每一元素。“整體不等于部分之和”正是格式塔心理學(xué)的核心思想。
四個(gè)關(guān)鍵特性
格式塔心理學(xué)在設(shè)計(jì)中被運(yùn)用最多的莫過于它所提出的格式塔原理，而且隨著歷史發(fā)展格式塔原理也在不斷演化，據(jù)所集資料顯示，格式塔原理共有13條。但在此之前，為了更好地理解格式塔，我們先介紹一下它的四個(gè)關(guān)鍵特性：涌現(xiàn)(Emergence)、 具體化(Reification)、多重穩(wěn)定性(Multistability)和不變性( Invariance)。
1、涌現(xiàn)
當(dāng)一個(gè)實(shí)體被觀察到有其自身各部分都不具備的特性時(shí)，稱之為涌現(xiàn)。這些特性或行為只有當(dāng)部分在更廣泛的整體中相互作用時(shí)才會(huì)出現(xiàn)。一個(gè)典型的例子如上圖，你能看到簡單的斑點(diǎn)，但慢慢地會(huì)發(fā)現(xiàn)圖中描繪著“一只斑點(diǎn)狗在樹下嗅來嗅去”。我們的大腦會(huì)自動(dòng)解析斑點(diǎn)的布局邏輯，與我們所已知的模式一一配對(duì)，直到讓我們看到比原來更相關(guān)聯(lián)的一組事物。
簡單理解：面對(duì)未知，我們善于尋找已知與其匹配。
2、具體化
具體化是指大腦在視覺信息缺失時(shí)填補(bǔ)空白的能力。這個(gè)過程也賦予了不實(shí)際存在的抽象或視覺圖像的意義。如上圖，釘子似乎是從一個(gè)白色球里伸出來的。然而，如果你再看一次，它只是一系列的尖峰圍繞著一個(gè)空白區(qū)域。由于黑色箭頭的特殊排列及形狀，我們的大腦會(huì)用一個(gè)不存在的白球填充空白。具體化是一種感知建構(gòu)方式，被感知的物體包含著比實(shí)際存在物體更多的空間信息。
簡單理解：我們善于填補(bǔ)空白。
3、多重穩(wěn)定性
多重穩(wěn)定性是指模糊的知覺經(jīng)驗(yàn)在兩種或多種不同的解釋之間，不穩(wěn)定地來回切換的傾向。因此，有些物體可以通過多種方式被感知。上面是一個(gè)熟悉的例子，圖像可以被看作兩個(gè)白色的側(cè)臉或一個(gè)黑色的花瓶。但我們不能同時(shí)看到兩者。相反，會(huì)在兩個(gè)穩(wěn)定的選擇之間快速地來回跳轉(zhuǎn)。一旦其中一種成為主導(dǎo)感知，就越難看到另一種感知。
簡單理解：面對(duì)模棱兩可，我們善于尋找確定的東西。
4、不變性
簡單物體的識(shí)別與它們的旋轉(zhuǎn)、平移和縮放無關(guān)，如上圖。因?yàn)槲覀兘?jīng)常從不同的角度遇到物體，所以我們已經(jīng)發(fā)展出一種能力來識(shí)別它們，盡管它們的外觀不同。
簡單理解：我們善于識(shí)別同一物體，即使它發(fā)生了變化。
格式塔原理
格式塔的四個(gè)特性解釋了大腦對(duì)事物認(rèn)知的“加工”過程，而我們的大腦會(huì)通過一些“手段”去提高“加工”的效率，這些“手段”即格式塔原理。
1、簡單
“人們會(huì)把模棱兩可或復(fù)雜的圖像理解為最簡單的形式，因?yàn)槲覀冎粫?huì)用最小的力氣去認(rèn)知?！?/p>
這是最核心的原理，也是以下所有原理的大前提。說白了就是人們是懶惰的，不會(huì)花太多力氣去認(rèn)知事物。而最省力氣的方式就是以整體去認(rèn)知事物。那么人們是怎樣劃分整體的？
這就需要了解以下的格式塔原理：接近、相似、連續(xù)、閉合、對(duì)稱、主題/背景、焦點(diǎn)、一致連貫性、公共區(qū)域、共同命運(yùn)、平行和過往經(jīng)驗(yàn)。
2、接近
“相鄰或相接近的對(duì)象，往往會(huì)被視為一組。”同樣，相隔較遠(yuǎn)的對(duì)象會(huì)被視為兩組。距離的變化會(huì)調(diào)節(jié)我們對(duì)事物的認(rèn)知。在界面設(shè)計(jì)中，這幾乎是被運(yùn)用得最多的原理。
3、相似
“具有相似特征的元素比不具有相似特征的元素更為相關(guān)?！边@在帶有“對(duì)抗”屬性的場(chǎng)景中更加明顯。比如MOBA游戲、體育賽事、熱血漫畫等，通過顏色、材質(zhì)、紋理等元素加強(qiáng)同一陣營的相似度和敵對(duì)陣營的區(qū)別度，更能體現(xiàn)“對(duì)抗”的意味。
4、連續(xù)
“排列在直線或曲線上的元素比不在直線或曲線上的元素更為相關(guān)。”另外，還可以解釋為，連續(xù)的物體更容易被感知，我們的大腦會(huì)優(yōu)先理解連續(xù)的東西。如上圖，我們會(huì)理解為直線排布的圓點(diǎn)和曲線排布的圓點(diǎn)相交，而不是理解為“V”型排布和“八”字排布的圓點(diǎn)相接。
5、閉合
“人們傾向于認(rèn)為物體是完整的，而不是關(guān)注物體可能包含的間隙?！?/p>
6、對(duì)稱
“人們傾向于感知對(duì)稱的物體?！睋Q句話來說，人們更容易將對(duì)稱的物體理解為一個(gè)整體。
另外，對(duì)稱還有其他優(yōu)點(diǎn)。在蘋果WWDC2017設(shè)計(jì)分會(huì)上也提及過對(duì)稱，他們認(rèn)為：“對(duì)稱是一種有效的形式，我們通常會(huì)將其與“健康”、“穩(wěn)定”、“平衡”、“有序”等概念關(guān)聯(lián)在一起。同時(shí)，對(duì)稱還極具視覺美觀性。”
7、主體/背景
“人們總是試圖區(qū)分物體與其周圍的區(qū)域。”人們不可能理解到所有信息，只會(huì)挑他們認(rèn)為的“主體”去理解。而在界面設(shè)計(jì)中，我們會(huì)經(jīng)常評(píng)價(jià)“沒有重點(diǎn)”，也是因?yàn)檫@個(gè)原理。
8、焦點(diǎn)
“具有強(qiáng)烈差異點(diǎn)的元素會(huì)抓住觀眾的注意力?！边@是相似原理和主體/背景原理的延伸。也是在界面設(shè)計(jì)中常見的突出重點(diǎn)內(nèi)容的方式。
9、一致連通性
“視覺上相連接的元素比沒有連接的元素更為相關(guān)?！?/p>
10、公共區(qū)域
“如果元素共享一個(gè)具有明確邊界的區(qū)域，則它們往往被視為一組?！迸c接近原則類似，這也是在界面設(shè)計(jì)上運(yùn)用最多的原理之一。而流行至今的卡片式設(shè)計(jì)是這一原理的最好體現(xiàn)。
11、共同命運(yùn)
“在同一方向上移動(dòng)的元素比靜止或在不同方向上移動(dòng)的元素更為相關(guān)。”這一原理在動(dòng)效設(shè)計(jì)上更為適用。
12、平行
“相互平行的元素比彼此不平行的元素更為相關(guān)。”在界面設(shè)計(jì)中，我們也可通過傾斜的界面劃分，來強(qiáng)調(diào)不同的區(qū)域。
13、過往經(jīng)驗(yàn)
“元素往往是根據(jù)觀察者過去的經(jīng)驗(yàn)來感知的?！本腿缟蠄D，我們會(huì)不自覺地認(rèn)為圖中是一個(gè)紅綠燈。
關(guān)于格式塔的新進(jìn)展
利用格式塔原理可以讓我們更簡單地理解事物，而在近幾年的研究表明，格式塔原理對(duì)視覺工作記憶（Visual Working Memory,VWM）也有一定幫助。
視覺工作記憶是指我們能夠在臨時(shí)性中斷的任務(wù)中，臨時(shí)存儲(chǔ)和處理來自視覺世界的相關(guān)信息。例如，我們?cè)趻咭曇粋€(gè)頁面的時(shí)候，我們會(huì)臨時(shí)性地記得某些關(guān)鍵字、圖片或其他視覺信息。但是視覺工作記憶的容量非常有限，大多只能記得4個(gè)項(xiàng)目。但當(dāng)引入具有格式塔屬性的信息時(shí)會(huì)讓視覺工作記憶受益。一些學(xué)者已經(jīng)驗(yàn)證了相近、相似、公共區(qū)域和一致連貫性都可以提升視覺工作記憶的性能。其他的原理有待驗(yàn)證。
換句話說，格式塔不僅僅可以讓我們更好地理解信息，同時(shí)也能讓我們更容易地記憶信息。這使得格式塔在某些場(chǎng)景更應(yīng)受關(guān)注，例如車載系統(tǒng)、醫(yī)療等對(duì)效率和安全性要求更高的場(chǎng)景。
最后
認(rèn)知和學(xué)習(xí)一個(gè)原理是非常簡單的，只有運(yùn)用到實(shí)際工作中才有更多的體會(huì)。本文只是拋磚引玉，期待大家在工作中能有更深層的理解。Thanks~
參考文獻(xiàn)
Emergence - Wikipedia
Gestalt psychology - Wikipedia
《Design Principles: Visual Perception And The Principles Of Gestalt》
《The Gestalt principle of similarity benefits visual working memory》
《Allocating Visual Working Memory Resources》
《The Glossary of Human Computer Interaction》
lawsofux.com
http://changingminds.org/explanations/perception/gestalt/emergence.htm
