為什么用戶總是忽略設(shè)計師所作出的改變?

人們常常會忽視加入到現(xiàn)有圖像中的新元素,這種現(xiàn)象叫做變化盲視現(xiàn)象(change blindness)。它會影響到網(wǎng)頁上的[信息錯誤(的提示)]以及[導(dǎo)航菜單],而導(dǎo)致用戶的困惑和增加任務(wù)失敗的可能性。但是,如果通過正確的視覺呈現(xiàn)方式,變化盲視發(fā)生的概率將被大大減小。
我們的大腦會迅速而準(zhǔn)確地捕捉到一些信息,但是往往也習(xí)慣性地會疏忽掉一部分。如果能很好地理解其中的誘因,這將會是創(chuàng)建高效用戶界面的關(guān)鍵。
“變化盲視”是人們忽視圖像變更的一個現(xiàn)象趨勢,特別是當(dāng)變化隨即發(fā)生在一個視覺干擾之后,如屏幕閃爍的干擾。
有兩種不同的因素會導(dǎo)致增加變化盲視發(fā)生的可能性
對我們視覺感知的干擾,這種干擾可能會發(fā)生于頁面的重新加載、我們的眨眼、我們的眼睛對于一個固定點的迅速游離以及適屏設(shè)備中的橫縱向轉(zhuǎn)換。
速度,信息的迅速變化會因受擾而被忽視,即便是很小的干擾。我們的眼睛閃爍一次的時間大概是300-400毫秒,當(dāng)一個圖像僅僅被中斷67毫秒,變化盲視就會發(fā)生。
這兩種因素在數(shù)字體驗中都是很常見的,其他因素如注意力和視覺雜亂也會對變化盲視產(chǎn)生影響。
本質(zhì)上來說,任何時候當(dāng)一個新的視覺元素被引入到現(xiàn)有畫面中,這個新元素都存在被忽視的可能。
例如,在Vans.com的移動網(wǎng)站上,如果訪問者選擇了一個不存在的鞋碼,[添加到購物籃]的圖標(biāo)會變換到[無現(xiàn)貨]。但是,這樣細(xì)微的變幻在其他部分都不發(fā)生改變的情況下是無法引人注意的。(如圖)
Vans.com:[無現(xiàn)貨]由于和[添加到購物籃]的圖標(biāo)很相近而不夠明顯。并且離用戶的注意力集中區(qū)(鞋碼和數(shù)量)太遠。
即便用戶最終發(fā)現(xiàn)了這一改變,這其中的延滯所帶來的損失將會加算到整個交互成本中。因此,設(shè)計師應(yīng)該在設(shè)計時考慮到這些容易導(dǎo)致變化盲視的設(shè)計元素。
[信息錯誤的示意]和[狀態(tài)的提示]
當(dāng)用戶因輸入錯誤的信息時,系統(tǒng)會示意[信息錯誤],而這個[信息錯誤的示意]往往會受到變化盲視作用的影響。
具體而言,如用戶填好了一份網(wǎng)頁上的注冊信息表,然后點擊提交,當(dāng)網(wǎng)頁重載后,99%的內(nèi)容都和之前是一樣的,唯有一處因用戶輸入的錯誤信息而使系統(tǒng)顯示該錯誤信息的提示,如下圖中Goodsourcing.com頁面上用來示意用戶[工作名稱]一欄填寫空白的[數(shù)據(jù)傳輸錯誤(Data Transfer Error)],這一信息提示往往很容易被忽視,因為網(wǎng)頁上可視的信息都被混雜在一起。(圖)
當(dāng)頁面重新加載后,Goodsourcing.com注冊表上[數(shù)據(jù)傳輸錯誤(Data Transfer Error)](位于[用戶注冊]標(biāo)題欄的上方)的提示被加入到了原來的網(wǎng)頁中,這一細(xì)微的變化因變化盲視而容易被人們忽略。
進度指示,亦或是其他一些有助于用戶理解正在發(fā)生什么的[狀態(tài)的提示]是另一很容易受變化盲視影響的地方。因為他們屬于加入到現(xiàn)有網(wǎng)頁上的小細(xì)節(jié),即便是一個動態(tài)的進度提示,例如在Southwest Airlines app中間的白色小圓圈,因為對于其他信息來說不容易被分辨,會常常被用戶忽視。(圖)
左圖中的白色動態(tài)進度提示的小圓圈幾乎無法分辨,即便被放置在頁面的正中。相比而言,右圖中Kayak.com頁面中的動態(tài)小圓圈就很明顯,因為它有一個對比度很大的背景襯托。
[導(dǎo)航菜單]和[目錄]
導(dǎo)航欄也是變化盲視的高頻受害者,這些導(dǎo)航鏈接很重要,但為了使用戶專注于頁面上的內(nèi)容往往被設(shè)計在網(wǎng)頁的邊緣處,這使得位于網(wǎng)頁邊緣處的導(dǎo)航鏈接當(dāng)期發(fā)生改變時更容易被用戶忽視。
下面的例子展示了一個本地導(dǎo)航的視覺效果處理,它在頁面的不同模塊中使用了不同風(fēng)格的鏈接標(biāo)簽。通常情況下,不同模塊的各鏈接使用同樣的導(dǎo)航風(fēng)格是一個常規(guī)的,易于理解的設(shè)計模式。但是在這里,本地導(dǎo)航在右列中反常的位置擺放,以及整體視覺上的混雜感會阻礙瀏覽者注意到導(dǎo)航欄,更不可能注意到網(wǎng)頁切換時鏈接標(biāo)簽的改變。(圖)
網(wǎng)站中每一張網(wǎng)頁右欄中的本地導(dǎo)航上的鏈接標(biāo)簽很容易被忽視。
[過濾信息提示]
當(dāng)用戶需要過濾一些搜索結(jié)果,過濾提示的使用是相當(dāng)重要的,而且使用起來也十分的微妙。一方面用戶希望系統(tǒng)的反應(yīng)很快,盡可能減少等待的時間。另一方面,如果網(wǎng)頁跳轉(zhuǎn)太快,用戶又有可能根本無法意識到信息已被系統(tǒng)經(jīng)過篩選的過程。
Healthcare.gov的網(wǎng)站就很好的解決了這一對矛盾的需求:當(dāng)用戶完成選擇時,系統(tǒng)就會開始進行過濾,而不需要特意再去點擊[申請過濾]的按鈕。但是為了確保用戶注意到信息正在經(jīng)歷被系統(tǒng)篩選的過程,一個明顯的視覺提示[請等待]會在以灰色背景襯托中閃現(xiàn)。(圖)
Healthcare.gov的網(wǎng)站上,通過在信息正被篩選的過程中顯示一個[請等待]的提示,而使用戶意識到信息正在被篩選。
對抗變化盲視
導(dǎo)致變化盲視的情況太普遍,因此,所有設(shè)計師都應(yīng)該熟知如何減小其發(fā)生概率的方法,而不同的技術(shù)方法應(yīng)該被應(yīng)用于不同的情境中,例如:
- 通過盡可能避免頁面的重新加載來減小視覺干擾。
- 為重要的新加入的元素加以合理的視覺強調(diào)而使得他們更加明顯。(如對比、大小、填充)(可以考慮一下“斜視測試”,當(dāng)你往后看或側(cè)視的時候新元素是否會很明顯?)
- 有策略地將重要的新的視覺元素設(shè)計放在用戶關(guān)注點的附近區(qū)域。
- 考慮動態(tài)轉(zhuǎn)換以避免瞬間改變的干擾,界面中的動態(tài)效果對于解釋改變是很有效的。
變化盲視僅僅是會影響用戶體驗的眾多心理現(xiàn)象之一,如果想了解更多認(rèn)知和感知是如何影響用戶體驗的,可以往“用戶行為”和“人機交互”方面研究。
翻譯:用戶體驗咨詢機構(gòu)-BESD設(shè)計實驗室 凱莉大帝
本文為作者@BESD設(shè)計實驗室 投稿發(fā)布,轉(zhuǎn)載請注明來源于人人都是產(chǎn)品經(jīng)理并附帶本文鏈接
- 目前還沒評論,等你發(fā)揮!