起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識大廠求職秘籍，這些知識點必須要掌握
編輯導語：產品設計要如何對用戶心理做好把握，在提升用戶使用體驗的同時，也能達成設計上的美觀追求？也許，你可以結合格式塔心理學原則進行合理的UI設計。本篇文章里，作者就格式塔原則在產品設計中的應用做了解讀，一起來看一下。
今天給大家分享格式塔心理學設計原理，它是由麥克斯·沃特海默（Max Wertheimer）于1923年發表的論文，成為最有影響力的早期建議。
格式塔原則是任何設計師都可以學習的重要思想集合，它們的實現不僅可以極大地改善設計的美觀性，而且還可以極大地改善其設計美感，其功能和用戶友好性。
分享大綱：
- 臨近定律
- 相似原理
- 封閉原則
- 連續原則
- 對稱原理
- 共同命運原則
- 圖地原理
一、鄰近定律
彼此靠近的事物比彼此隔開的事物關聯性更強。我們的大腦將這些緊密放置的元素集合視為一組，臨近定律可以更清晰知道元素之間關系，在UI這種運用比較廣泛。
那么它在UI中如何應用？
左側卡片中，文字排版有點分散，導致信息理解會誤判。右側卡片中文字排版信息集中，便于表達同一個主題。
二、相似原理
具有相似視覺外觀的元素更容易被用戶認為是同類物體。在格式塔理論中，對相似元素進行視覺分組，可通過顏色、形狀、大小等將其安排在一起。
上圖中左側雖然間距大小一樣，但是色彩不一樣，我們視知覺會自動將兩種顏色分別視為兩組。
如何應用到UI設計中？
如上圖 ，在UI設計中，兩個按鈕大小形狀一樣，顏色不一樣，因此我們會將其視為兩種重要程度的功能。
由于相似原理，我們知道，有顏色字體是可以進行點擊操作的。相似性可以讓整個UI系統更加一致性，體驗更友好。
三、封閉原則
當對象不完整時，我們更喜歡完整的形狀，因此我們自動填充元素之間的間隙以感知完整的圖像，例如形狀、字母、圖片等。具體來說，當整個圖片的某些部分丟失時，我們的感知將填補視覺上的空白。
網上很出名的一張圖
如上動圖中，即使小狗元素用不規則小點組成，但是我們也能識別出來。
如何應用到UI設計中？
封閉原則在加載指示器中運用較多，這樣便于用戶理解。左側加載過于分散，無法讓用戶聯想到加載，因此右側思路與封閉原則有著一致思路。
封閉原則在圖形LOGO設計中也是屢見不鮮。
四、連續原則
連續定律一般由一條直線或者曲線的端點為起點，一直延續下去達到終點，我們感知傾向于對象是以直線或者曲線的形式排列起來更為相關性。
如何應用到UI設計中？
在標簽欄設計中，我們把橫向連接在一起的視為一組，表達一個功能含義。
上圖Apple和Medium的設計中，將標簽橫向排列一組，便于用戶橫向滑動找到對應功能。
五、對稱原理
我們的大腦將對稱對象視為同一組的一部分。他們給人以穩定和秩序的印象，對稱的UI元素有助于掃描內容和瀏覽信息。
如何應用到UI設計中？
在夸克和Naver產品設計中，底部圖標網格菜單，采用對稱平衡手法，將功能排布在宮格列表上。
六、共同命運原則
共同命運原則(law of common fate)是指在其他條件相同時，朝同一方運動和具有相同速度的元素會被組織在一起。
該原理是運動設計的基礎。每個有意義的動畫都會使用共同的命運來以正確的方式引導用戶的視線。這有助于將內容與觸發的動作聯系起來。
如何應用到UI設計中？
如上圖，向左滑動可以顯示更多的內容，因此在設計時候就需要保證在統一方向上，讓它們有著共同屬性。
七、圖地原理
人眼能夠根據不同的聚焦計劃分離對象。我們直觀地知道哪些元素放置在前景中，哪些元素放置在背景中。
在模態彈出窗口時，就可以見證“圖形地面原則”的實際使用。
如上在彈窗設計中，我們經常會將背景疊加黑色便于突出前景彈窗內容。
上圖中在版式上使用圖地原則，清晰區分信息層級，通過圓形和鞋子前后關系，營造視覺焦點。
八、總結一下
格式塔心理學知識在UI設計中的運用遠遠要比我今天說得要多，大家可以在項目實踐中去慢慢理解運用。這是個比較重要的設計理論學術，希望大家可以掌握后學以致用。
#專欄作家#
Tony，微信公眾號：功夫體驗設計，人人都是產品經理專欄作家。百度視覺體驗設計師，一直堅持原創文章，樂于幫助新人。擅長作品集指導、筆試題指導、UI視覺創意、設計趨勢風格等。
本文原創發布于人人都是產品經理。未經許可，禁止轉載。
題圖來自Unsplash，基于CC0協議
UI設計真的是要從用戶的角度去考慮設計，這樣做出來的產品才會使用戶滿意。
文章的舉例生動形象，通俗易懂，格式塔心理學真是博大精深，一下子又掌握了好多UI設計知識！