你是否曾經(jīng)觀察過天空，注意到一團不同尋常的云，像一個熟悉的動物或物體?你有沒有想過，為什么或者如何通過觀察一團蓬松的氣體來建立這種聯(lián)系?這都是因為你的大腦運作方式！ 你的大腦總是試圖通過比較以前的經(jīng)驗或視覺模式來理解這個世界，并把這些點連接起來。它有自己的“怪異”方式來感知形狀和形式，分組信息，填補空白，繪制大圖。 

了解你的大腦如何工作將有助于你成為一個更聰明的設(shè)計師，掌握視覺溝通的操縱者。它可以幫助你確定在任何特定情況下哪些視覺元素是最有效的，因此你可以利用它們來影響用戶的感知、引導(dǎo)他們的注意力，并最終引起行為的改變。這個方法對于以完成目標為導(dǎo)向、解決問題、無意識設(shè)計、用戶界面的設(shè)計上都格外有用。

“偉大的設(shè)計師理解心理學在視覺感知中的強大作用。當別人的目光與你的設(shè)計創(chuàng)作相遇時，會發(fā)生什么？他們對你所分享的信息有什么反應(yīng)？”

—Autodesk品牌內(nèi)容策劃師Laura Busche

‍‍現(xiàn)在很清楚，視覺設(shè)計和心理是相互聯(lián)系的，并且可以相互影響。格式塔原則可以幫助我們理解和控制這些聯(lián)系。

‍‍

什么是格式塔？

‍‍‍‍格式塔（德式造型）是20世紀20年代由德國心理學家提出的一組視覺知覺原理。它建立在“一個有組織的整體，被認為大于其各部分之和”的理論基礎(chǔ)上。

‍‍

‍‍

  “整體不是各部分之和�！�

   – 庫爾托夫卡

格式塔原則試圖描述當某些條件適用時，人們是如何看待視覺元素的。它們是建立在四個關(guān)鍵思想的基礎(chǔ)上的：

出現(xiàn)

人們傾向于通過物體的粗略輪廓來識別它們。相較于一個細節(jié)豐富的物體，我們的大腦能更快的識別一個簡明清晰的物體。

物化

人們可以識別物體，即使它們有部分缺失。我們的大腦將我們所看到的東西與記憶中的熟悉模式相匹配，并填補空白。

多穩(wěn)定性

人們常常會用不止一種方式來解釋模棱兩可的事物。我們的大腦會在尋找確定性的選擇之間來回穿梭。因此，一種視角將變得更加主導(dǎo)，而另一種視角將變得更難看到。

不變性

人們在識別簡單物體時，不會受到它被旋轉(zhuǎn)、縮放、變形的干擾。我們的大腦可以從不同的角度感知物體，盡管它們的外觀不同。

‍‍以下是格式塔原則，它可以為今天的UI設(shè)計提供參考。

鄰近

排列在彼此之間的鄰近元素被認為比那些放置得更遠的元素更相關(guān)。這樣，不同的元素主要被看作是一個組，而不是單個的元素。

鄰近原則如何適用于UI設(shè)計？

我們可以在UI設(shè)計中使用鄰近原則來分組相似的信息，組織內(nèi)容和整理布局。它的正確使用將對視覺交流和用戶體驗產(chǎn)生積極的影響。

如原則所述，相關(guān)的項目應(yīng)該保持緊密的聯(lián)系，而不相關(guān)的項目應(yīng)該保持更遠的距離。白色的空間在這里起著至關(guān)重要的作用，因為它創(chuàng)造了對比，引導(dǎo)用戶的眼睛朝著預(yù)期的方向看�？瞻卓梢栽鰪娨曈X層次結(jié)構(gòu)和信息流，便于閱讀和瀏覽布局。它將幫助用戶更快地實現(xiàn)他們的目標，并深入研究內(nèi)容。 

‍‍我們幾乎可以在任何地方應(yīng)用鄰近原則，從導(dǎo)航、卡片、圖庫和橫幅到列表、正文和分頁。

共同區(qū)域

與鄰近原則類似，將放置在同一區(qū)域內(nèi)的元素被視為分組。

共同區(qū)域原則如何適用于UI設(shè)計？

共同區(qū)域原則特別有用。它可以幫助信息分組和內(nèi)容組織，但它也可以實現(xiàn)內(nèi)容分離或充當焦點。它提升了層次結(jié)構(gòu)，可掃描性，并有助于信息的推廣。

共同區(qū)域的原則可以將許多不同的因素組合在一起，使它們在更大的群體中保持統(tǒng)一。我們可以通過使用線條，顏色，形狀和陰影來實現(xiàn)它。它經(jīng)常被用來使某個元素突出，表示交互作用或重要性。

‍‍一個絕佳的運用公共區(qū)域理論的例子就是用戶界面上的卡片；一個定義良好的矩形空間，包含不同的信息。橫幅廣告圖跟表格也是很好的例子。

‍‍

相似

與不具有相似視覺特征的元素相比，具有相似視覺特征的元素被認為更加相關(guān)。

相似性原則如何適用于UI設(shè)計？

我們傾向于把相似的元素看作是分組或模式。我們也可能認為，它們的目的是相同的。相似性可以幫助我們組織和分類一個組內(nèi)的對象，并將它們與特定的意義或功能聯(lián)系起來。

有很多不同的方法可以讓元素們看起來相似，從而被用戶認為是彼此關(guān)聯(lián)的。這些特征包括顏色、大小、形狀、紋理、尺寸和方向的相似性;其中一些比其他的更具交際力(例如顏色>大小>形狀)。當相似發(fā)生時，一個物體可以通過與其他物體不同而得到強調(diào)，這被稱為“異�！�，可以用來創(chuàng)造對比或視覺重量。通過增加可瀏覽性、可發(fā)現(xiàn)性和整體信息流，將用戶的注意力吸引到某個焦點內(nèi)容上。 

‍‍我們可以在導(dǎo)航，鏈接，按鈕，標題，呼叫動作等等中使用相似性原則。

‍‍

閉合

一組元素通常被認為是單個可識別的形式或圖形。閉合也發(fā)生在對象不完整或部分不封閉的時候。

閉合原則如何適用于UI設(shè)計？

正如閉合原則所指出的，當我們面對適當?shù)男畔⒘繒r，我們的大腦會通過填補空白并創(chuàng)建一個統(tǒng)一的整體來得出結(jié)論。通過這種方式，我們可以減少信息交流所需的元素數(shù)量，減少復(fù)雜性，使設(shè)計更加吸引人。閉合可以幫助我們最小化視覺噪音并傳達信息，在一個很小的空間內(nèi)強化一個概念。

‍‍我們可以在圖像學中使用閉合原則，在這種情況下，簡單有助于迅速而清晰地傳達意義。

‍‍

對稱

對稱的元素往往被認為是歸屬在一起的，而不管它們之間的距離，都給我們一種牢固和有序的感覺。

對稱原則在UI設(shè)計中如何應(yīng)用？

對稱的元素簡單、和諧、美觀。我們的眼睛尋求這些屬性，以及秩序和穩(wěn)定，以了解世界。因此，對稱是快速有效地交流信息的有用工具。對稱讓人感覺舒服，有助于我們專注于重要的東西。

對稱的構(gòu)圖是令人滿意的，但它們也會變得有點沉悶和靜態(tài)。視覺對稱往往更具動態(tài)性和趣味性。在任意一種對稱設(shè)計中加入不對稱的元素都能讓用戶對這個元素印象深刻從而吸引到用戶的注意力，這種方法非常好用，比如當你希望吸引用戶興趣、或者像促進用戶做出操作的時候。 

‍‍對于作品集、圖庫、產(chǎn)品展示、列表、導(dǎo)航、橫幅和任何內(nèi)容豐富的頁面，使用對稱性都是很好的。

‍‍

延續(xù)

‍‍排列在一條線或一條細曲線中的元素被認為比那些隨機排列或排列在一條粗線中的元素更相關(guān)。

‍‍

連續(xù)性原則在UI設(shè)計中如何應(yīng)用？

連續(xù)線之后的元素被認為是分組的。線段越光滑，我們就越把它們視為統(tǒng)一的形狀;我們的頭腦更喜歡阻力最小的道路。

連續(xù)性幫助我們通過構(gòu)圖來解釋方向和運動。它是在對齊元素時進行的，它可以幫助我們的眼睛平滑地在頁面上移動，幫助我們閱讀信息。連續(xù)性原則加強了對分組信息的感知，創(chuàng)造了秩序，并通過不同的內(nèi)容片段引導(dǎo)用戶。中斷連續(xù)性可以標志著一段內(nèi)容的結(jié)束，讓人注意到新的內(nèi)容。

行和列的線性排列是連續(xù)性的好例子。我們可以在菜單和子菜單，列表，產(chǎn)品排布展示，輪播，服務(wù)或過程/進度顯示中使用它們。

共同的命運

向同一方向移動的元素被認為比向不同方向移動或根本不移動的元素更相關(guān)。

共同命運原則在UI設(shè)計中如何應(yīng)用？

無論元素有多遠或者它們可能出現(xiàn)的差異多少，如果它們一起移動或變化，它們都被認為是相關(guān)的。即使隱藏元素本身的真實運動，它的移動效果也可以通過其它視覺元素來反襯出來。

當元素移動同步時，共同命運原則更有效; 在同一個方向，同一時間和速度。它可以幫助將相關(guān)信息分組并將結(jié)果與行為聯(lián)系起來。同步運動的中斷可以吸引用戶的注意力并將其引導(dǎo)至特定的元素或特征。它還可以建立不同分組或狀態(tài)之間的關(guān)系。

‍‍我們可以把命運共同原則用在可擴展菜單、折疊條目、小提示、滑塊、滾動條和手勢操作提示等。

‍‍

結(jié)論

用戶界面設(shè)計不僅僅是漂亮的像素和閃亮的圖形。主要是關(guān)于溝通，性能和便利性。格式塔原則總是能夠幫助我們實現(xiàn)這些目標; 為用戶創(chuàng)造愉快的體驗，并為企業(yè)取得巨大成功。