設計師的心理課:為什麼沒人注意到你的設計?

你是否有這種經歷?你原本只是要在手機上查一下天氣預報,打開手機後,卻很自然地被一條推送的視頻吸引,看完這個視頻,又去看了另外一個視頻,3個小時過去了,當你關掉手機,才想起天氣預報還沒有查(大笑)。有這種經歷的同學,請舉個手~

我們的注意力受限於我們個人的感知力和環境的影響,很多設計師針對於目標用戶的感知能力,做了設計上的考量,比如:考慮到色弱的用戶,要講究文字與背景色的區分度,否則色弱用戶會看不到文字。

然而,我們較少考慮到用戶的實際環境,最常見的假設是:我們的用戶,打開電腦後,會進入我們設計的網站或應用程序,心無旁騖的流覽、使用、操作;我們的用戶,打開手機,就沉浸到了我們設計的APP當中;我們的用戶,穿戴好智能設備後,就不受外界干擾。

而實際情況可能是:以我自己為例,早上8點,我打開「印象筆記」這個軟體,寫這篇文章。同時,我的電腦上,還運行著公司的內部溝通工具:HI、微信、QQ音樂、OUTLOOk等。在我寫這篇文章的過程中,不斷有彈出的消息框來吸引我的注意力,如:Hi和微信不斷的彈出消息提醒;郵件提醒我該去簽到會議室了,我去簽到完後,郵箱又提示我,已簽到成功;Facebook提示我,有新朋友關注我了;QQ音樂的動態歌詞,提醒我已經唱到了「翻山越嶺幾回程」這一句了;電話聲響起,幼兒園的老師打來了電話......

以上,還只是發生在一個安靜的清晨,如果你的用戶正在上班(隨時可能有同事打斷)、正在地鐵里(信號時好時壞,前後左右都擠滿了人)、正在聚會的場合(大家玩得正High,嘈雜得根本聽不清說話聲)、家裡有個可愛的小調皮(隨時需要中斷當前工作,去照顧或收拾殘局)等場合,使用著你設計的產品,大家可以腦補一下這些豐富的畫面。面對這樣複雜的環境,我們該如何做設計?

同時,【環境也會影響到個人的感知力】,比如:在安靜的環境里,你能夠很快地聽到,洗衣機洗完衣服的報警聲;而在嘈雜的環境里,你可能根本聽不到。

學點心理學知識,可能會幫到我們:

一、我敢斷定,你每天打開微信的次數不會少於2次(笑)。【社交媒體帶來的深度影響是受眾碎片化生存,人們的注意力很難持久,而熟悉能增加吸引的程度。

如:淘寶的APP,「焦點圖」上的耳機是我之前看過的款式,「有好貨」、「必要清單」,「淘搶購」這些欄目展示的均是我之前挑過的款式(可能不同的品牌),所以,能快速吸引我的注意力,進而點擊,甚至購買,完成轉化。有相同感受的同學,可以舉個手~

圖示1

二、【人的大腦是按組塊來處理信息的,而設計師可以通過格式塔原則(簡單、接近、相似、閉合、連續)來組織信息,提升用戶處理信息的效率,在有限的空間內,增大吸引到用戶注意力的機率

比如:用戶在百度搜索「日本旅遊」,是帶著目標而來的,這裡有3條信息:

第1條信息:通過對內容的梳理,向用戶展示了做選擇時最重視3個變數:景色、地點、價格,幫助用戶快速過濾選擇。豐富的內容,通過格式塔原則:留白進行區塊分割(接近原則)、圖片+地點+價格組成的統一樣式(相似原則),讓用戶感知到的是4個組塊內容(根據Luck和Vogel的發現,工作記憶的容量為:4±1)(不費力),能夠吸引到用戶注意的機率會大一些。有相同感受的同學,可以舉個手~

第2、3條的信息:沒有進行有效的梳理,需要用戶去閱讀而不是跳讀(費力);且相同的尺寸下,展示的內容單一,與用戶的目標匹配機率會小一些。

圖片二

三、你可以嘗試這樣一個練習:算一算從1數到10要多久,再算算從10倒數到1要多久,大多數人的正數要比例數的時間要短,這個簡單的例子能說明:

【我們的大腦不喜歡迷失的感覺,我們偏愛熟悉的流程和便捷的導航路徑】

如:京東、天貓、亞馬遜等電商網站的導航路徑、購買流程基本一致,用戶可以快速注意到內容,而不是在導航在迷失,去思考要如何才能完成流程(等同於設定了要強迫用戶倒數的程序一樣)。

3.1、WEB端界面舉例,如圖:京東、天貓、亞馬遜的頁面結構分析:

圖片三·一

3.2、APP端界面舉例,如圖:京東、天貓、亞馬遜、網易考拉的結構分析:

圖片三·二

3.3、智能音箱使用流程舉例,如圖:小米音箱、ECHO音箱、小度音箱、天貓精靈,均由「喚醒詞」來「喚醒」:

圖片三·三

待寫:

設計師的心理課:為什麼沒人注意到你的設計?(二)

參考文獻:

1、書願.(2016).《大腦如何記憶與思考》.搜狐科普

2、觀瀾聽濤lvi5l3.(2017).《注意力、專註力與感知力、記憶力、思維力、行為力的關係是什麼》.個人圖書館

3、《注意》.百度百科

4、什洛莫·貝納茨.(2017).《屏幕上的聰明決策》.湛廬文化

5、大象公會.(2014).《文章吸引力的心理學原理》.海內網

6、黃曉芸.(2014).《社交媒體使用對年輕人閱讀行為及態度的影響研究》.上海外國語大學


推薦閱讀:

人機交互(HCI)和交互設計(InteractionDesign)的區別是什麼?
談談我對Ui設計師的一些觀點
對交互設計師能力模型的理解
什麼是交互設計師?
交互設計需要考慮哪些事情?

TAG:交互設計師 | 設計心理學 |