基于Gestalt 原則的一些設計思考

1 評論 17244 瀏覽 213 收藏 9 分鐘

一、Gestalt是什么?

詞意為“形式”,但與我們說的形式的意義不完全相同,它揭示了人的感知,特別是占主要地位的視知覺,并不是直接的鏡像反應,它能對所看到的的“形”(視覺、聲音或觸覺信息)進行選擇、組織、加工,也就是阿恩海姆所說的“知覺本身具有一定的’思維’能力”,視知覺并不是對刺激物的被動重復,而是一種積極的理性活動。簡言之,格式塔就是由知覺活動組織過經驗中的整體

二、Gestalt Psychology 5大規律

Gestalt Psychology 在研究人知覺的“思維能力”的過程中,發現了大量的知覺(主要是視覺)規律,盡管還沒有哪種學說可以令人信服地解釋這些規律背后的心理機制,但是作為非常穩定的現象和規律,它們可以常常被運用與設計中,主要的知覺規律包括完型論(整體論)、選擇論、簡化論、連續性、相似性。

三、Gestalt Psychology 的規律應用

1.完型論(整體論)

完型論強調人們通過視知覺活動,將感知到的形態加以組織,形成經驗中的整體,而非客體本身。

nIx3Hejjfk6E1pp_看圖王

刺激物的形狀、大小、顏色、強度等物理屬性方面比較相似時,這些刺激物就容易被組織起來而構成一個整體。設計中通過相似性和秩序性的元素牽引用戶的視覺,使用戶意識到單獨模塊內容之間是關聯的。圖中的小米商城就運用色彩和形狀的相似性、順序標識引導,當用戶處在購買詳情頁時,就能馬上意識到這4塊內容是相關聯的,都是為了選擇機型所做的操作。

2

2.選擇論

積極的選擇是視覺的基本特征。然而當圖的輪廓出現不完整、未封閉、形狀不規則、面積較大等圖底關系不明確的情況下,就容易出現錯覺中的“兩難圖形”,整個界面很難Don’t make me think。中國的傳統國畫在這方面做的很棒,國畫中的白色為底,可以是湖水、可以是遠山、可以是天際,可以是云海。這些元素具備了“底”的特質:“不完整”、“未封閉”、“形狀不規則”、“面積較大”等。留白在被賦予各種各樣的意義同時,在不影響“底”的表達情況下,增加了畫面的意境。

3

Opera Coast在構圖上巧妙的遵循了“圖”與“底”法則,與國畫類似,開放式的“底”(冷峻磅礴的高樓)在被賦予“情懷”體驗的同時,保證了聚焦式“圖”(網站導航)的信息的準確傳遞,與此同時還彰顯了產品獨特的氣質(品質、典雅)。

5

3.簡化論

人們對一個復雜對象進行知覺時,只要沒有特定的要求,就會常常傾向于把對象看作是有組織的簡單的規則圖形。

6

在設計過程中,要注意外界線索的充分性,從而保證用戶圖式與產品圖式之間的正確映射。界面中信息傳遞元素、視覺元素該如何表示?哪些是可操作的?哪些是不可操作的?這些元素代分別代表什么意思?如果我們處理不好,很有可能會使用戶的簡化傾向與現實中的這些困惑產生沖撞。這方面,Twitter處理的很好,Icon 或Icon+文字組合(Icon視覺面積更大)表示可操作Button、藍色的文字或藍色的文字+Icon組合表明支持點擊的Button或導航鏈接、附在不可點擊的文字說明(灰色)的旁邊的Icon(文字面積更大)作為該文字的一種狀態補充,比如這位用戶真的是蓋茨,因為在他昵稱旁邊有認證標識、蓋茨住在西雅圖,因為在地名旁邊有地理位置標識。

7

4.連續性

如果一個圖形的某些部分可以被看作是連接在一起的,那么這些部分就相對容易被我們知覺為一個整體。

2012121514552494

界面設計中連續性主要體現為減少冗余的步驟和干擾項,避免用戶的注意力轉移。這方面蘋果原生天氣軟件做的很好,一個天氣界面需要承載很多信息元素,為了避免用戶看了這個忘了那個,保持信息傳遞的連續性,界面首先運用了“圖底關系”,以開放式的天氣狀態動畫作為底,烘托產品氛圍,現在是晴天,再往下瀏覽詳細信息時,界面又運用了“標題欄式浮層交互”保留上一模塊中的重要信息,保證了信息接收的連續性。

9

5.相似性

在整體論里已經提過:“刺激物的形狀、大小、顏色、強度等物理屬性方面比較相似時,這些刺激物就容易被組織起來而構成一個整體?!?/p>

今日頭條通過相似性原則將已讀的資訊進行灰度處理,幫助用戶明白哪些資訊已經瀏覽過了。

10

這樣的相似性手法還有很多,6.1.0版的QQ面板將5.9.1的藍色Navigation Bar改為與面板底色相同的白色,保持了面板的整體性,使用戶能夠更加聚焦于面板內容本身。

11

四、寫在最后

Gestalt 原則在具體的設計實施過程中扮演著人的視覺認知與界面設計之間的跨海大橋,一定程度上減少了可用性測試階段中的諸多問題,對于提升界面設計效率與產品氣質有著顯著的作用。這里作為拋磚引玉,希望能夠與各位同行一起交流,將Gestalt力量發揮的更具威力。

 

本文由人人都是產品經理專欄作家 @UE小牛犢(微信公眾號:UE小牛犢) 原創發布于人人都是產品經理?。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 再次理解,受教

    來自江蘇 回復