小紐扣

馬克吐溫說過:當你手里只有錘子的時候,那么看待什么問題都像釘子。作為 UI設計師如果只是單純的提高自己的視覺能力,那么看待任何問題都只是視覺問題。如果是這樣的話在工作中很難去說服別人接受自己的設計提案,因為我們無法通過多維度的理論知識來佐證自己設計的合理性,所以作為設計師我們必須要懂心理學。

在我們日常設計中比較常用的5種心理學理論,分別是7±2效應、席克定律、萊斯托夫效應、本能反應、色彩心理學,通過心理學輔助大家為自己的設計建立邏輯嚴謹的理論依據。

 

目錄

7±2效應

席克定律

萊斯托夫效應

色彩心理學

本能反應

畫重點

 

1、7±2效應

A.7±2效應的定義

7±2效應這個規律最早是在19世紀中葉,由愛爾蘭哲學家威廉漢密爾頓觀察到的。直到1956年,美國心理學家米勒(George A. Miller)教授發表了一篇重要的論文《神奇的數字7加減2:我們加工信息能力的某些限制》,明確提出短時記憶的容量為7±2,即一般為7并在5~9之間波動。這就是神奇的7±2效應。

如果需要我們記憶的是熟悉的字詞或數字,這樣短時記憶還只能容納“7”個嗎?例如“c-o-o-p-e-r-a-t-i-o-n”,這個字母序列已經有11個字母,如果學過英語的人聽到這個序列很快就能明白這是個詞,意思是“合作”,并能很好地回憶出來,這不是違背了短時記憶的“7±2”效應了嗎?不是的,這恰恰是神奇“7±2”存在的另一個奇特的現象。

因為短時記憶中的信息單位“組塊”本身具有神奇的彈性,一個字母是一個組塊,一個由多個字母組成的字詞也是一個組塊,甚至可以通過一些方法把小一些的單位聯合成為熟悉的、較大的單位,而且對知識的熟悉程度還會對它產生影響。

7±2效應是指:人的短期記憶容量在7±2的數量之間浮動,也就是說用戶在同時處理信息的時候最多同時處理5~9個;同時我們也可以把一些小的單位聯合組成為熟悉的、較大的單位方便記憶。

 

B.7±2效應的作用

a.降低識別成本

通過將一些小的單位聯合組成熟悉的、較大的單位方便用戶記憶。最常見的例子就是數字號碼的模塊組合,通常情況下被割裂成“3-4-4”的組合方式,減少用戶的記憶方式。例如大眾點評的注冊頁面和電話呼叫彈窗,都遵循了7±2法則。

?

 

b.優化選項數量
大部分產品的導航欄的功能圖標的數量在一屏之內都不會超過7個,這正是借鑒了7±2效應。因為人的短期記憶容量在7±2的數量之間浮動,也就是說用戶在同時處理信息的時候最多處理5~9個任務。

 

c.優化界面布局
在界面布局的優化上同樣可以借鑒7±2效應,可以將首屏界面的功能模塊切分成5個左右,符合人們對于短時記憶的容量,通過對功能有效的組織,我們可以節省用戶的記憶成本,提高用戶的操作效率。例如支付寶的首頁設計將主要分成5個功能模塊,將小單位的功能組合成大單位的功能模塊,通過組合優化界面功能的分布,用戶可以先尋找大的功能模塊,再尋找小的功能模塊,雖然增加了交互路徑但是卻提高了用戶的選擇效率和減少了用戶的記憶成本。

 

2、席克定律

A.席克定律的定義

席克定律,又稱席克-海曼定律,是1952年席克和R · 海曼在選擇反應時研究中得到,研究表明人的信息傳遞時間與刺激的平均信息量之間呈線性關系的定律。簡單一點我們可以理解為:人在面臨選擇越多的時候,所要消耗的時間成本越高。用數學公式表達為:RT=a+blog2(n),其中,RT表示反應時間,a表示跟做決定無關的總時間,b表示根據對選項認知的處理時間實證衍生出的常數,n表示同樣可能的選項數字。

 

B.席克定律的作用

a.提高選擇效率
為了提高用戶的選擇效率,我們需要盡可能將多余的選項刪除,排除多余選項,只留下能夠滿足用戶需求的選項;否則用戶會因為選項過多而猶豫不決,造成時間成本直線上升而導致用戶放棄當前操作。例如我們平時的彈窗設計,只為用戶提供“同意”和“不同意”兩種類型的選項,這種情況下用戶可以根據自己的實際需求進瞬間選擇,而不需要在多個選項中進行思考消耗過多的時間和精力。

 

b.提高信息獲取效率
如果我們面對大量雜亂的信息,我們需要花大量的時間精力去做分辨,信息獲取效率極低。面對這種情況我們同樣可以借助席克定律去處理信息,我們可以將同類型或相關聯的信息進行組織歸納,將較多的信息轉變成較少的信息組,面對較少的信息組用戶可以快速的瀏覽其中的 信息。例如一些頁面中的簡介,將同類或者相關聯的信息進行編組處理,將原本較多的信息轉變成較少的信息組進行識別處理,減少了用戶原本需要對全部信息進行篩選處理的工作,進而轉變成快速閱讀信息組即可。
例如淘票票的詳情頁通過的同類型信息的組合,幫助用戶減少了對信息進行檢索再組合認知的過程,減少了用戶的成本輸出,提高了用戶的閱讀效率。

 

c.提高用戶體驗
當用戶在處理應用操作的時候,所消耗的成本越少,心情自然會更加愉悅。假如我們在進行一系列復雜的操作的時候,如果將所有選項都聚集在一起,面對諸多復雜的選項會給用戶造成極大成本消耗,最終導致給用戶造成極差的用戶體驗,反之我們將所有選項拆解、歸類讓用戶按照一定的步驟在每一個界面盡量做少的選擇,這樣雖然增加了交互路徑但卻減免了,則會營造一種較為舒適的用戶體驗。例如 same :
same 創建頻道的過程分成“4步”,每一步用戶只需要面對少量的選項,直接將用戶的認知時間成本降到了最低,無意為用戶創造了一次愉快的用戶體驗。

 

3、萊斯托夫效應

A.萊斯托夫效的定義

馮· 萊斯托夫效應指的是相對于普通事物,記住獨特或特殊事物的可能性更大。我們可以簡單理解為:特殊事物才易被人牢記。例如下圖:
馮· 萊斯托夫效應的主要成因,來自人們會格外注意一些東西里的某個特殊目標,具有相對性,例如圖片中我們第一眼看到的就是紅色的蘋果,因為相對于當前的環境單個物體具有特殊性才使得我們對紅色的西紅柿印象深刻。

 

B.萊斯托夫效應的作用

a.發生萊斯托夫效應的必要條件
萊斯托夫效應發生的必要條件就是要與當前“背景不同”或“經驗不同”,產生相對的比較。接下來我們會以背景不同和經驗不同為前提條件歸納分析一下萊斯托夫效應的作用。?

 

b.背景不同
在當前環境下,與周圍元素具有明顯的不同,就發生了與“背景不同”的情況,即通過將周圍元素作為背景來突出主體元素。在界面設計當中我們通過區別設計樣式來突出某個功能,例如在底部導航欄中,我們為了突出其中的核心功能,會將它做加強處理,比如放大 icon 、填充背景色等方式來區別其它功能的圖標設計樣式。如下圖:
我們可以明顯的看到 nice 的“發布”和轉轉的“賣二手 ”區別于其它的 icon 設計,突出核心功能,吸引用戶點擊其核心功能。

 

c.經驗不同
當現在所發生的事情與過去經驗有顯著不同時,就會觸發“經驗不同”的情況發生。通過營造與過去經驗不同的場景,觸發萊斯托夫效應,加強用戶的記憶點或者增強對用戶的吸引力。例如現在每年的電商購物節,設計和消費場景明顯區別于日常的電商界面,通過對設計風格和消費場景的定制化設計,加深對用戶的印象,同時擴大了活動弄對用戶的影響力。如下圖:

 

4、本能反應

A.本能反應定義

本能反應實際上是情感設計的一種,在特定的情境下一起人們心理上和情感上的反應,而不是單純的美學設計。

 

B.本能反應的誤解

對于本能設計的時常會存在一個誤解,認為“漂亮美觀”的設計即是本能反應,這種想法是錯誤的。人本能的喜愛美好且美觀的事物,但這并不能單一的定義本能反應。

更加有趣的是人會認為漂亮具有吸引力的界面會更加好用,用戶會對這個觀念持續很久,直至付出巨大的成本,積累了足夠的經驗之后才會放棄并推翻之前的理論。

 

C.本能反應的應用

a.營造美觀的界面

營造出干凈漂亮、具有美學設計的界面更容易受到用戶青睞。人喜歡視覺美觀的物品是本能反應之一,所以設計中我們要盡可能的保持界面的美觀。例如在設計中我們要選用視覺精美的圖片,避免出現低品質圖片帶來的不適感,因為優質的圖片在在構圖上更加考究、色調更加統一,給人的感覺更加舒適。而低品質的圖片在構圖和色調上會顯得雜亂無章,一眼看上去則是滿滿的劣質感。

 

b.滿足情感設計
本能反應作為情感化設計的一種,我們需要處處為用戶著想,在細節上滿足用戶對于情感設計的需求。例如淘票票中的電影詳情頁,將電影的預告片提到頂部,用戶可以直接產看預告片,從而引起用戶的情感共鳴,而不是再去下拉尋找才能觀看。

 

5、色彩心理學

A.色彩心理學的定義

色彩心理透過視覺開始,從知覺、感情而到記憶、思想、意志、象征等,其反應與變化是極為復雜的。色彩的應用,很重視這種因果關系,即由對色彩的經驗積累而變成對色彩的心理規范,當受到什么刺激后能產生什么反應,都是色彩心理所要探討的內容。

 

B.色彩心理學的應用

不同的色彩在不同的地區與國家存在著不同的含義,在這里我們不會展開的進行詳細的論述,我們核心關注的是色彩給用戶帶來什么樣子的感受和作用。

 

a.信息指示

經過社會長期的發展與培養,人們對色彩已經有相對成熟的認知,色彩能夠幫助產品來傳遞信息,例如綠色是“同意”的意思、紅色是“反對”的意思、橙黃色是“警告”的意思,最典型的案例就是紅綠燈。

 

在界面設計中我們需要在圖形化的基礎上結合色彩更好的準確的傳遞信息,引導用戶。例如我們通常用紅色的按鈕表示“反對或刪除”的意思,而灰色表達的信息則更加隱晦。如下圖:

 

b.建立印象
色彩往往能給人建立第一印象的重要因素,例如我們經常聽到這個界面的“配色”很高級,或者這個界面看起來很干凈等等,都是色彩為用戶的建立的第一印象。例如莫蘭迪的畫作:
?
在色彩的使用上,我們要學會克制,避免使用大量使用高飽和度的顏色,首先是因為人眼睛對于低飽和度色彩的忍耐度更高,其次是相對于高飽和度的色彩而言低飽和度的色彩在色調上更加統一、穩重,具有品質感。在界面設計當中,我們可以看到優秀的設計在色彩的控制上把握的十分精準,整體頁面中避免了出現大量高飽和色彩的出現,盡量選用同色相的色彩進行設計,這樣能有效的保證了頁面色調統一,給予用戶良好的印象。例如 Fancy 的界面中統一使用冷色調,搭配冷灰色使頁面顯示的主次分明且能保證頁面整體色調的統一。

 

6、畫重點

本文著重分享了我們日常設計中常用的五大交互心理學,這里我們再回顧一下他們的核心定義,以便大家記憶和運用:
  • 7±2效應是指:人的短期記憶容量在7±2的數量之間浮動,也就是說用戶在同時處理信息的時候最多同時處理5~9個;同時我們也可以把一些小的單位聯合組成為熟悉的、較大的單位方便記憶。
  • 席克定律的核心意義:人在面臨選擇越多的時候,所要消耗的時間成本越高。
  • 馮· 萊斯托夫效應指的是相對于普通事物,記住獨特或特殊事物的可能性更大。我們可以簡單理解為:特殊事物才易被人牢記。我們需要注意的是引發萊斯托夫效的兩個必要條件是:“背景不同”和“經驗不同”。
  • 本能反應實際上是情感設計的一種,在特定的情境下一起人們心理上和情感上的反應,而不是單純的美學設計。
  • 色彩心理學是一種注重因果關系的心理學說,側重于觀看色彩之后產生的感受,屬于情感設計中的一種。

 

參考鏈接:
常用的幾個設計心理學
https://dwz.cn/C0DmajlP

 

設計心理學:幫助設計師更好地了解用戶
https://dwz.cn/VDX6QC79

 

設計心理學概述
https://dwz.cn/7tBXY0Ci

 

百度百科:7±2法則
https://dwz.cn/3IqrCFN8

 

萊斯托夫效應
https://dwz.cn/pUlrCZr4

 

設計心理學之梵雷斯托夫效應
https://dwz.cn/bqBaOvRF

 

設計法則:7±2法則
https://dwz.cn/ZpdjMIan

 

原文地址:海鹽社(公眾號)

作者:姜正

轉載請注明:學UI網 » 設計師必須要知道的五大交互心理學

登錄收藏
 
你可能喜歡的:
帶你重新認識十大設計心理學原則帶你重新認識十大設計心理學原則
設計,只有基于用戶的使用場景才會產生價值設計,只有基于用戶的使用場景才會產生價值
語音用戶界面設計 - 對話式體驗設計原則語音用戶界面設計 – 對話式體驗設計原則
所有設計師都應該懂的動效設計所有設計師都應該懂的動效設計
如何正確地使用色塊排版?如何正確地使用色塊排版?
中臺設計組件-按鈕中臺設計組件-按鈕
一篇文章搞定全局組件在交互文檔的使用一篇文章搞定全局組件在交互文檔的使用
0-1系列:目標推導與策略制定0-1系列:目標推導與策略制定
【新系列】十萬個為什么設計-為什么你設計的信息用戶總是看不見【新系列】十萬個為什么設計-為什么你設計的信息用戶總是看不見
UI/UX設計中的7±2法則,可能不是你想的那樣!UI/UX設計中的7±2法則,可能不是你想的那樣!
?
网球比分雷速 排列5怎么中奖 七星彩精彩计划 北京快3助手安卓下载 甘肃体彩11选5一定牛 我要今天3d开机号 福彩快乐十分开奖结果 江苏七位数开奖结果 湖北十一选五赢钱 30选5开奖结果今天 内蒙古11选五中奖规律