格式塔原理——圖形與背景、接近、相似、閉合、連續(xù)、簡(jiǎn)單、均衡

——格式塔心理學(xué)科是認(rèn)知心理學(xué)中的一個(gè)重要理論，在視覺(jué)設(shè)計(jì)中已經(jīng)有較大的影響。若去深究格式塔原理，可能需要相當(dāng)長(zhǎng)的時(shí)間來(lái)學(xué)習(xí)理解，作為交互設(shè)計(jì)師和界面設(shè)計(jì)師，其實(shí)只要理解這幾個(gè)原理的含義和使用方法，就可以對(duì)自己的設(shè)計(jì)做出指導(dǎo)和支撐了。
下面來(lái)談?wù)勎易约簩?duì)這些原理的理解：

圖形與背景原理
——知覺(jué)幫助我們把圖形從背景中分離出來(lái)。圖形與背景的對(duì)比越大，圖形的輪廓越明顯，則圖形越容易被發(fā)覺(jué)。

圖例：當(dāng)白色方塊越來(lái)越大，它就漸漸的退居為背景，而橙色方塊從背景漸漸的變?yōu)榱藞D形。通過(guò)面積、顏色、輪廓等等，我們可以較好的把握?qǐng)D形與背景的關(guān)系。

實(shí)例：將簽名檔文字灰化，降低與背景的對(duì)比，使得簽名檔文字比昵稱(chēng)和頭像更接近背景，起到了弱化的作用。

?

接近原理
——距離（位置）相近的各部分趨于組成整體。這是最簡(jiǎn)單、也是最常用的原理。

圖例，知覺(jué)上更傾向于意識(shí)到“3組圓”，而不是“6個(gè)圓”：

一個(gè)最簡(jiǎn)單的應(yīng)用實(shí)例：6個(gè)一排的按鈕看上去有點(diǎn)多，而且“過(guò)”也混在其中了，將6個(gè)按鈕的距離分開(kāi)一點(diǎn)點(diǎn)，就可以將按鈕分為兩組，從而解決了問(wèn)題。

另一個(gè)案例，產(chǎn)品想要在獎(jiǎng)狀面板上加一個(gè)分享按鈕，交互建議按鈕放在獎(jiǎng)狀外，因?yàn)楠?jiǎng)狀上加大按鈕容易破壞獎(jiǎng)狀原本的整體感（從而可能要修改獎(jiǎng)狀），而分享按鈕可能在除獎(jiǎng)狀外的多個(gè)圖形上用到，導(dǎo)致對(duì)按鈕的適應(yīng)度要求變高：
方案1——需求（請(qǐng)忽略按鈕顏色和質(zhì)感，這并不是視覺(jué)稿）

方案2——交互方案（策劃擔(dān)心此方案會(huì)導(dǎo)致在較花的游戲界面中，按鈕和獎(jiǎng)狀看上去不是一個(gè)整體）（請(qǐng)忽略按鈕顏色和質(zhì)感，這并不是視覺(jué)稿）

實(shí)際效果——還是覺(jué)得“分享給好友”是針對(duì)獎(jiǎng)狀的，對(duì)嗎？這正是“接近原理的力量”（如果再通過(guò)程序，給兩塊都加上一些陰影，就更整體了——相似原理）

相似原理
——在某一方面相似的各部分趨于組成整體。

圖例，知覺(jué)上更傾向于意識(shí)到“3組圓（接近）”或“2種圓（相似）”，而不是“6個(gè)圓”：

實(shí)例：想想看，如果第二排按鈕也是彩色…^_^

實(shí)例：利用相似的樣式，使知覺(jué)自己將其編組。這個(gè)原理其實(shí)已經(jīng)用的很多，就不多說(shuō)啦。

閉合原理
——彼此相屬、構(gòu)成封閉實(shí)體的各部分趨于組成整體。

圖例：知覺(jué)上更傾向于意識(shí)到“1個(gè)圈和1個(gè)點(diǎn)”，而不是“9個(gè)圓”：

實(shí)例：左右兩個(gè)方案哪個(gè)看上去更簡(jiǎn)潔生動(dòng)呢？

連續(xù)原理
——在知覺(jué)過(guò)程中人們往往傾向于使知覺(jué)對(duì)象的直線(xiàn)繼續(xù)成為直線(xiàn)，使曲線(xiàn)繼續(xù)成為曲線(xiàn)。

圖例：知覺(jué)上會(huì)弱化這些分割所帶來(lái)的“塊”，而依然意識(shí)到“直線(xiàn)、圓、曲線(xiàn)”。

實(shí)例：最常見(jiàn)的就是表格了：

有時(shí)候?yàn)榱撕?jiǎn)化界面，會(huì)去掉一些分隔線(xiàn)，導(dǎo)致“連續(xù)感”變?nèi)酰敖咏小弊儚?qiáng)，使得知覺(jué)上更傾向于意識(shí)到“列”，而用戶(hù)理智上當(dāng)然會(huì)想要去看成“行”，這種理智與情感背道而馳的時(shí)候，就會(huì)帶來(lái)不舒適的感受。此時(shí)我們通常會(huì)建立一個(gè)“連續(xù)感“，一個(gè)起“引導(dǎo)、學(xué)習(xí)、輔助閱讀”作用的條狀背景，建立了一個(gè)“連續(xù)的規(guī)律“，當(dāng)知覺(jué)意識(shí)到這個(gè)規(guī)律，不舒適的感受就會(huì)大大降低。

當(dāng)然“連續(xù)“我們也可以解讀為”當(dāng)知覺(jué)輕松的發(fā)現(xiàn)一個(gè)視覺(jué)規(guī)律后，傾向于主動(dòng)的將對(duì)象按照規(guī)律延續(xù)下去“，例如”一排點(diǎn)“

簡(jiǎn)單原理
——具有對(duì)稱(chēng)、規(guī)則、平滑的簡(jiǎn)單圖形特征的各部分趨于組成整體。

圖例1：知覺(jué)上更傾向于意識(shí)到“1個(gè)對(duì)稱(chēng)的圖案”，而不是“7個(gè)符號(hào)”：

圖例2：下面四個(gè)圖形的認(rèn)知難度大約是“圓≈方≤星＜多邊形”。

個(gè)人認(rèn)為，簡(jiǎn)單原理還可以解釋為“與過(guò)去學(xué)習(xí)到的規(guī)律一樣的、相似的對(duì)象更容易認(rèn)知”，當(dāng)然這其中也有“連續(xù)原理”的知覺(jué)連續(xù)性。
均衡原理
——知覺(jué)傾向于尋求視覺(jué)組合中的秩序或平衡。

圖例：有沒(méi)有覺(jué)得很不舒服呢？因?yàn)橹X(jué)會(huì)認(rèn)為大圓更重，而圖形給我們的理解與知覺(jué)正好相反。

如果改成這樣，似乎好了很多，因?yàn)椤翱招摹敖档土舜髨A的”重量“。

實(shí)例：圖1中，知覺(jué)給我們的感受是“一個(gè)整體的小人站在背景上（QQGAME中最多的就是這種Avatar）“，而圖2毫無(wú)征兆的”肢解“，打破了圖1帶給我們的整體感，知覺(jué)上就會(huì)覺(jué)得不舒適。圖三則做了一個(gè)窗戶(hù)，讓角色從窗戶(hù)中鉆出來(lái)，隱藏了一部分身體，巧妙地滿(mǎn)足了知覺(jué)要求的和諧感。

原文地址：http://gdc.qq.com/?p=3211