什么是設計心理學？—— “設計心理學分為設計與心理學兩大要素”
什么是設計？—— “設計是設想、運籌、計劃與預算，它是人類為實現某種特定目的而進創造性活動。”
根據設計目的可以劃分為視覺傳達設計、產品設計與環境設計三大類。
其中與我們息息相關的視覺傳達設計正是體現了人和社會的關系，視覺傳達涉及很多領域如包裝設計、版式設計、廣告設計、 展示設計、影視設計等等，在視覺傳達設計領域自然就必須將社會中的人的心理考慮進去。
設計心理學就是建立在心理學基礎上，把人們心理狀態，尤其是人們對于需求的心理，通過意識作用于設計的一門學問。它同時研究人們在設計創造過程中的心態以及設計對社會、對社會個體所產生的心理反應，反過來再作用于設計，起到使設計更能夠反映和滿足人們心理的作用。
設計心理學作為設計學最重要的理論學科，它對設計學的發展、設計活動的指導和設計的創新活動都有著重要的指導意義，通過對設計心理學概念和研究方法的了解，使設計師能意識到在當代多元的情感消費社會里，設計心理學所具有的重要作用，使設計師能更好地學習和掌握設計心理學，完善設計知識結構，創造出更多符合人類需要的優秀設計。
一個不懂人類心理學的設計師，不會比一個不懂物理學的建筑。—Joe Leech
為了理解用戶的心理行為和反應，我們首先需要觀察。幸運的是，自 19 世紀初以來，心理學家們一直在各種控制良好的環境中進行大量的實驗。許多常見的心理現象已經得到了廣泛的認證，我們只需要理解它們并找出如何將它們應用到設計的思想中。
視覺是一切感覺之首。人的大腦有一半的資源都用于接受和解析眼睛所見。但眼睛所見并非全部，因為視覺信息還要經過大腦轉換和解析。真正用來“觀察”的其實是大腦。我們所看到的并不是真相，我們的大腦在影響我們的感知；很大程度上是我們“期望”感知到的。
感知至少受到以下 3 個因素影響，與現實存在偏差：
人常根據以往的經驗來對事物進行理解和判斷；先入為主的經驗會給用戶不一樣的感知和理解；你看到什么取決于經驗/別人告訴你什么？
心理學上有個概念叫熟悉度偏見（Familiarity bias），就是說大家傾向于更相信自己熟悉的東西。比如，面對一道不會的選擇題，人們更傾向于選擇自己熟悉的那個答案，而不是正確答案。人們自然而然會偏向他們熟悉的東西，人們喜歡信任他們所知道的，害怕變化而產生的不舒服，這就是為什么最好的新產品都是用最熟悉的模式。久而久之這些熟悉的環境會在我們心智中建立框架。專家管這個叫“感知模式/感知框架”。
不同場合的感知框架影響我們在不同場合下對期待見到的事物感知；使用電腦、手機的人對桌面和文件、網站和各種類型的 APP 都會有相對應的感知框架；用戶經常不認真看屏幕就點擊按鈕或鏈接，他們更多是靠以往經驗來引導他們對界面的感知，所以知道這個原理我可以更好的了解那些設計原則
① 和用戶預期保持一致性
熟悉的瞬間能夠建立信任，而不熟悉的模式則可能產生混亂（至少在最初）。 如果不符合人熟悉的心智模型及框架，就很容易讓人覺得煩躁；經常炒股的朋友，會對紅色綠色很敏感，綠色代表下跌紅色代表漲；很多用慣安卓的用戶，突然用 iOS 會很不習慣。
小案例
舉例：vivo 電子書、vivo 錢包
要點：熟悉度偏見是很有效的，所以要用用戶所熟悉的東西來幫助他們更快地使用你的產品。
② 和平臺規范保持一致性
產品的設計要和平臺的規范保持一致；也需要與競品保持一致，比如同類型的 app 基本是大同小異的。
③ 產品內部規范一致性
其中包括迭代版本保持一致性，同一層級圖標顏色字體保持一致性，品牌一致性，交互行為一致性；不同的品牌有自己的調性，可以直接通過設計語言傳達給用戶，而且能夠達到一個良好的品牌辨識度，成熟的產品有自己的設計標準。
舉例：vivo 錢包-首頁、貸款、卡包、我的
④ 遵循用戶的操作習慣
在找某件東西的時候，如果它不在老地方或者看起來和以前不一樣，就算在我們眼前，我們也找半天，這也是因為我們受以往的經驗影響感知；因此相同或相似產品的用戶習慣保持一致，即意味著用戶需要更少的時間去學習甚至不需要學習。
舉例：Figma、sketch
我們常用的設計軟件 figma 和 sketch，他們在界面結構、功能位置、操作方式包括快捷鍵，基本都是一致的。
周圍環境對感知的影響也同樣存在于不同感官之間。五個感官任何之一的感知都可能同時影響其他感官的感知。
例如：我們聽到的能影響我們看到的，反之亦然；我們聽到、看到或者聞到的能影響我們的觸覺。
對于識別一個字母、一個單詞、一張臉或者任何物體的神經活動，都包含了環境刺激產生的神經信號的輸入。這個環境包括感知到的其他臨近對象和事件，甚至由環境激活的對以往感知到的對象和事件的記憶。
人們經常根據周圍的情景去理解事物，視覺感知也是一樣的，上下文會影響我們對某一個詞的理解；環境有時候會產生歧義。同樣的一段話放在不同的語句當中，會有不同的理解。視覺上也是如此：
分別是繆勒-萊爾錯覺、咖啡墻錯覺、蓬佐錯覺、賈斯特羅錯覺
小貼士
我們需要留意所看到的圖形與實際之間的偏差，從而對設計進行調整。環境影響我們的感知，所以需要確認好避免歧義，并通過測試確認所有用戶對產品信息的理解是一致的。
除了視覺，目標會過濾其他感官的感知。
例如：曾經在一趟課上，老師請學生看一段幾分鐘的錄像，并請他們注意錄像中一共有幾個白衣人出現。學生們聚精會神看完錄像，所有人都能準確無誤的告訴老師錢后共有幾個白衣人出現。
這時老師微笑著問大家：有沒有人看見黑猩猩？什么？除了黑衣人、白衣人、還有一只黑猩猩？全班竟然沒有一個人發現。
當用戶使用某款 app 時通常都是帶有目的性的去操作，這個過程中會過濾與其達成目標操作無關的東西，當用戶在軟件尋找信息或某個功能時，他們并不會認真的閱讀，只是快速而粗略的掃描屏幕上與目標相關的東西。
目標會影響我們注意什么--感知是主動的，我們動用感官去找到和目標相關的東西。目標使我們的感知系統對某些特性敏感--例如在下圖找紅色的圓點，大腦對紅色就會特別敏感，而其它顏色就幾乎不會被注意到，即使我們的確“看到”了它們。
當用戶充分的調動感知來尋找目標的時候，由于用戶的注意力處于一種高度的緊張狀態，這是一種不好的用戶體驗，我們要做的是讓用戶能夠輕松的完成目標任務，而不需要有高度的緊張和尋找。
舉例：vivo 錢包-貸款信息驗證部分流程
vivo 錢包-貸款在用戶信息驗證時候，清晰告知用戶整體流程狀態，提高用戶對整體流程的把控感，安全感。
在設計中應怎么做
先給大家舉一個栗子，大家平時逛街的時候能記住哪些廣告呢？ 我們雖然每天看到那么多的信息，但是真正記住的卻不多。還有當我們看到復雜的事物的時候，心里會涌現不舒服的奇怪感受，有時候這種感受沒有辦法用語言來描述。那么為什么會有這些感受呢？
其實道理很簡單，我們做的東西是給人用的。人的認知和記憶能力是有限的。視覺設計和心理是相互聯系，并且相互影響的。格式塔原則可以幫助我們理解和控制這些聯系。
1. 什么是格式塔
1910 年，德國飛馳的一列火車上，韋德海默眺望窗外的風景。電線桿、房舍和山頂盡管是靜止不動的，可看起來卻好像在與火車一起飛奔，這是為什么呢？韋德海默對這個錯覺的疑問，開啟了一門新的心理學派--格式塔心理學。可以說是視錯覺導致了格式塔的崛起。
格式塔由創始人德國心理學家馬科斯·韋德海默提出，是德文 Gestalt 的音譯，也稱「完形心理學」。
他的視覺研究受到當時新發現的物理學定律影響，他認為和物理世界的「電場、磁場、重力場」一樣，在人類的知覺世界里應該也有一個極為類似的“場”存在。人類視覺世界稱為「視覺場」；和人類生活、學習等情景相關的是「知覺場」。人們知覺到此場，并加以利用在把握這個整體，而至完形。因此「完形」心理學被稱為“場論”（fieid theory）。（“完形”就是格式塔，格式塔是完形的中文音譯）
格式塔在「視覺場」中的定義是：在“視覺場”中的各種力量組合成一個自我完滿而平衡的整體。在格式塔中，任何元素的改變都將影響整體以及各部分之本來特性。
格式塔將心理現象視為有機整體，任務整體雖有各個部分組成，但并不等于部分之和而是大于部分之和。并且認為，整體先于部分并且決定部分的性質。格式塔理論的關注焦點是“族群”
格式塔反對構造主義元素學說（把人的復雜知覺簡單看成是各種零碎感覺元素，以及通過聯想把這些感覺元素合起來而構成的）。如同看一棵樹，元素主義認為人對樹的知覺只是各種感覺和顏色、形狀、亮度等元素復合構成的。即所謂“統覺”。格式塔心理學則認為人的第一眼就將這棵樹感知為一個完整的整體，而不是單個感覺元素集合加總構成的。
主要包括以下三方面的實驗研究:
① 似動現象
似動現象是形成格式塔心理學的基礎。是指兩個相距不遠、相繼出現的視覺刺激物，呈現的時間間隔如果在 1/10 秒到 1/30 秒之間，那么我們看到的不是兩個物體，而是一個物體在移動。
例如，我們看到燈光從一處向另一處移動，事實上是這只燈熄了，那只燈同時亮了。這種現象正是不能把整體分解成部分的證據。這種現象的組成部分是一些獨立的燈在一開一關，但組成一個整體后，給人造成這些燈在動的假象。
后來，格式塔心理學把重點放在整體系統上，在這個系統中，各個部分是以一種能動的方式相互聯系在一起的，也就是說，僅根據各分離的部分，無法推斷出這個整體。所以人們把它稱為“格式塔或完形心理學”。
② 整體與部分
看起來格式塔心理學是把重點放在整體上，但這并不意味著他們不承認分離性。事實上，格式塔也可以是指一個分離的整體。
研究認為，一個人的知覺場始終被分成圖形與背景兩部分。“圖形”是一個格式塔，是突出的實體，是我們知覺到的事物；“背景”則是尚未分化的、襯托圖形的東西。知覺幫助我們把圖形從背景中分離出來。圖形與背景的對比越大，圖形的輪廓越明顯，則圖形越容易被發覺。
③ 頓悟實驗
苛勒在一次實驗中用繩子把一只香蕉懸掛在籠子的頂棚上。籠子里只有惟一的一只木箱可以使用。6 只黑猩猩看到香蕉時跳躍起來竭力想抓住香蕉，但是徒勞。有一只名叫蘇爾坦的黑猩猩馬上停止了這些白費力氣的努力，開始從各個方向打量箱子。忽然它停在箱子前面，抓起它并徑直朝目標走去。它把木箱迅速放到地上，爬上箱子，從木箱上面使勁跳起，終于抓住了香蕉。
苛勒還對這組黑猩猩使用其他工具進行了觀察，如利用木棍去獲取放在籠子外面的水果。這些黑猩猩甚至能夠將兩根短棍連接起來做成一根長棍。同樣，它們還能把兩三個箱子疊放在一起，再爬到放在最上面的箱子頂上，借助一根木棍去獲取香蕉。
苛勒通過對黑猩猩進行的許多實驗，提出了頓悟理論。他認為問題的解決不是由于嘗試錯誤，而是由于頓悟。所謂頓悟，就是內在地把握情境的關系性，并依此改變整個情境。
或許正如一些批評家所指出的那樣，頓悟不是一種獨立的學習過程或學習形式，而是學習達到一定程度的表現或者結果。一定的經驗積累，是產生頓悟的前提。
小總結
他們認為思維是整體的、有意義的知覺，而不是聯結起來的表象的簡單集合；主張學習是在于構成一種完形，是改變一個完形為另一完形。我們的視覺系統自動對視覺輸入構建結構，并在神經系統層面上感知形狀、圖形和物體，而不是只看到互不相連的邊、線和區域。他們認為學習的過程不是試嘗錯誤的過程，而是頓悟的過程，即結合當前整個情境對問題的突然解決。再通俗一點就是人是怎樣認知和記憶所看到的事物。
考夫卡在其書中認為，我們自然而然地觀察到的經驗，都帶有格式塔的特點。他以心物場和同型論（心理功能完整性原則和心理無力學同型性原則）為格式塔總綱，從而派生出若干亞原則稱作組織率。 我們常稱為“格式塔組織率”或“格式塔原則”。
① 接近性原則 law of proximity
物體之間相對距離會影響我們感知它們是否以及如何組織在一起。相互靠近的物體看起來屬于一組，而那些距離較遠的就不是。 利用這個原則，調整距離或者用分割線等來分開不同設計模式的構建。會使設計界面層次有序，視覺清晰，減少視覺噪音。
相互關聯的控件和內容之間距離越近，用戶越能感知它們的相關性。反之，如果距離太遠，用戶很難感知到它們是相關的，那么產品在體驗上就更加難用。
小貼士
屬性相同、場景相似的信息應該放在一起，降低閱讀成本，提高用戶感知效率；不相關的信息盡量區分開，不要放在一起模糊不清引起不必要的誤解。
② 相似性原則 law of similarity
有共同視覺元素的物體看起來更有關聯性。我們傾向于將看起來相似的對象視為一組或者一個模式，并且將它們與特定含義或者功能聯系在一起。
相似性表達的是元素形式和內容上的接近，包括形狀、顏色、大小、運動狀態等等。如果在一堆元素中有一些具有某種相同的特征，那么在我們的認知中這些元素具有更強的相關性。在 UI 設計中，我們經常用到這個原則，主要有以下 3 個方面：
小貼士
看起來和接近性非常類似，但是他們卻是不同的兩個概念。接近性強調額位置，相似性則強調內容。通常把有明顯特征的事物（形狀、顏色、大小）組合在一起。多用于表單與導航。
③ 連續性原則 law of continuity
我們的視覺傾向于感知連續的形式，而不是離散的碎片。并且能感知到整個物體的傾向，連續性通過構圖來幫助我們感知事物的形狀和運動方向。界面中的設計元素，會引導眼睛在平面中的移動，提高界面的可閱讀性。創建順序并且指導用戶瀏覽不同的內容分組。
vivo 錢包-貸款中會使用連續的線段、進度條，使視覺上會跟隨線條方向由左向右去了解目前的進度。
小貼士
視覺傾向于感知連續的形式而不是分散的碎片，通過找到非常微小的共性，將多個不同的信息連接成一個整體，是界面設計和 logo 設計常用的原則之一。
③ 閉合性原則 law of closure
人們在觀察熟悉的視覺形象時，會把不完整的局部形象當作一個整體的形象來感知，這種知覺上的結束，稱之為閉合。如果局部形象過于陌生或者簡略，則不會產生整體閉合聯想。
閉合是一種完成某種圖形(完形)的行動。就算沒有外形的約束，我們也會自動把圖形腦補完全。比如半個形狀或者有缺口的形狀我們不會認為是一條線或各種零碎的圖形，而是一個完整的形狀。閉合是指一種完形的認知規律。
這個原則也非常適用于界面設計中，運用省略或者減法處理圖形，不僅可以節省空間，同時也讓用戶產生聯想，產生趣味性。比如 UI 界面中的導航欄，卡片模式等。
我們常見的頁面橫滑組件（卡片的部分隱藏）就運用了閉合律原則，通常在界面右側露出一半（或少部分）內容，來提示用戶右邊還隱藏著更多內容
⑤ 主體/背景原理 Figure-Ground
大腦將視覺區域分為主體和背景，主體包括一個場景中占據我們注意力的所有元素，其余則是背景；這個特征有利于我們對重要信息和次要信息的感知。主體和背景的區別可以從以下兩個方面來控制：
場景大小—— 我們傾向于將處于大場景中的中間小區域部分視為主體，而大場景視為背景；
層級關系—— 如果在同一個平面中，我們傾向于將處于視覺第一層級的物體視為主體。
原則可以幫助設計師在設計界面的過程中抓住用戶注意力，并且讓用戶優先看到我們想讓他們看到的事物。
比如重要信息的彈窗提示，作為用戶注意力焦點的內容臨時成為了彈窗的背景，彈窗則會短暫成為新的主體；以及弱化背景從而突出內容等界面中都有運用到此原則。很多工具類型的 app 就會利用這個原則，比如滴滴的首頁和高德地圖視覺都以大半屏地圖為主體，操作放在下方。
⑥ 簡單對稱性原理 Simple principle
在觀察事物過程中，我們第一印象更傾向于簡單而且對稱的圖形，這就是格式塔的對稱性原則。
具有對稱、規則、平滑的簡單圖形特征的各部分趨于組成整體。對稱的元素往往被認為是歸屬在一起的，而不管它們之間的距離，都給我們一種牢固和有序的感覺。
人的眼睛喜歡在復雜的形狀中找到簡單而有序的對象，當我們在一個設計中看到復雜的物體時，眼睛更愿意將它們轉換為單一統一形狀，并嘗試從這些形狀中移除無關的細節來簡化這些物體。
對稱的構圖是令人滿意的，但它們也會變得有點沉悶。在對稱的設計中加入不對稱的元素可以在給人留下印象的同時吸引注意力。
vivo 游戲中心：左右布局的瀑布流就是格式塔的簡化對稱性的體現，用戶在瀏覽的的過程中有效減輕了閱讀壓力。特別適合這種以圖片流為主的產品，能大大提高瀏覽效率。
⑦ 共同命運原理 Common destiny
無論元素之間的距離有多遠，或者它們看起來有多不同，如果它們一起運動或變化，它們都被認為是相關的。這里的共同命運針對的是運動的物體。與接近性原理和相似性原理相似，都與我們的視覺系統會有著給對象進行分組來感知事物的傾向相關，但是一起運動的物體會被感知為屬于同一組或是彼此相關這樣的一種視覺現象，這就是格式塔中的共同命運原則。
向同一方向移動的元素，我們在處理的過程當中，會默認把它們歸為一類
vivo 錢包首頁中，“圖標”滑動時是一起滑動的，以及 iPhone 刪除應用時候，所有圖標都一起晃動起來，要么刪除，要么保留，這就是共同命運原則。
韋德海默與同事和學生發現了很多原則，最終定名的有 100 多條（如“平行性 Parallelism、異質同形 isomorphism、視覺偽裝 visual camouflage、成員特性等）。
小貼士
成員特性原則：
一個整體中的個別部分并不具有固定的特性，個別部分的特性是從它與其他部分的關系中顯現出來的。
如果我們有很多同樣的按鈕，如何讓某個更重要的按鈕突出但是仍然讓用戶感知還是按鈕呢？那就要用到成員特性律了。成員特性律賦予了集體中某一個元素特殊的一些刺激元素從而突出它。
獨特的外形暗示了它與別的元素有不同的功能
我們把原理歸類、總結的目的有兩個：
一是自我檢查，我們在構思設計的過程中往往會多于專注視覺效果的創作而忽略最基本的原理，比如在設計之前進行完整的設計構思；設計過程中檢查自己的設計作品，避免低級錯誤導致反復改稿，比如信息不對齊，布局雜亂等；再就是設計完成之后對需求方有理有據的陳述。
二是在深入理解的前提下做設計時能夠舉一反三。
用戶界面設計并不全是關于漂亮的像素和完美的圖形。它主要是關于溝通、性能和便利性。格式塔原則總是幫助我們實現這些目標，為用戶創造愉快的體驗，為企業創造巨大的成功。
這 7 項法則并不是獨立存在的，它們之間具有高度的關聯性，是相輔相成的關系，我們需要跟進不同的需求類型和用戶場景，運用這些基本法則打出組合拳，使你的設計方案更有依據。
在做產品或者設計的時候一定要考慮人的認知與記憶的因素，這是與生俱來的天性，人們的審美對簡單與和諧具有基本的要求。我們只有更好的利用視覺空間設計作品，減少設計的復雜性，盡量保持格式塔原則的完整，用戶才能更好更容易地理解使用我們的產品。
用戶界面設計并不全是關于漂亮的像素和完美的圖形。它主要是關于溝通、性能和便利性。其中格式塔原則總是幫助我們實現這些目標，為用戶創造愉快的體驗，為企業創造巨大的成功。
學習研究人們的心理并在設計中加以運用，給產品帶來更直觀的優化設計，不僅能提升設計師的設計技能，更能使大家在產品設計中加入自己的一些思考，使得設計內容更有深度。同時，設計心理學的靈活運用能大幅提升用戶的設計體驗，起到引導用戶的作用，并實現產品效益最大化。
轉載自：https://www.uisdc.com/gestalt-ui-principles
