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

0 評論 12833 瀏覽 1 收藏 9 分鐘

人們常常會忽視加入到現(xiàn)有圖像中的新元素,這種現(xiàn)象叫做變化盲視現(xiàn)象(change blindness)。它會影響到網(wǎng)頁上的[信息錯誤(的提示)]以及[導航菜單],而導致用戶的困惑和增加任務失敗的可能性。但是,如果通過正確的視覺呈現(xiàn)方式,變化盲視發(fā)生的概率將被大大減小。

我們的大腦會迅速而準確地捕捉到一些信息,但是往往也習慣性地會疏忽掉一部分。如果能很好地理解其中的誘因,這將會是創(chuàng)建高效用戶界面的關鍵。

“變化盲視”是人們忽視圖像變更的一個現(xiàn)象趨勢,特別是當變化隨即發(fā)生在一個視覺干擾之后,如屏幕閃爍的干擾。

有兩種不同的因素會導致增加變化盲視發(fā)生的可能性

對我們視覺感知的干擾,這種干擾可能會發(fā)生于頁面的重新加載、我們的眨眼、我們的眼睛對于一個固定點的迅速游離以及適屏設備中的橫縱向轉換。

速度,信息的迅速變化會因受擾而被忽視,即便是很小的干擾。我們的眼睛閃爍一次的時間大概是300-400毫秒,當一個圖像僅僅被中斷67毫秒,變化盲視就會發(fā)生。

這兩種因素在數(shù)字體驗中都是很常見的,其他因素如注意力和視覺雜亂也會對變化盲視產(chǎn)生影響。

本質上來說,任何時候當一個新的視覺元素被引入到現(xiàn)有畫面中,這個新元素都存在被忽視的可能。

例如,在Vans.com的移動網(wǎng)站上,如果訪問者選擇了一個不存在的鞋碼,[添加到購物籃]的圖標會變換到[無現(xiàn)貨]。但是,這樣細微的變幻在其他部分都不發(fā)生改變的情況下是無法引人注意的。(如圖)

Vans.com:[無現(xiàn)貨]由于和[添加到購物籃]的圖標很相近而不夠明顯。并且離用戶的注意力集中區(qū)(鞋碼和數(shù)量)太遠。

即便用戶最終發(fā)現(xiàn)了這一改變,這其中的延滯所帶來的損失將會加算到整個交互成本中。因此,設計師應該在設計時考慮到這些容易導致變化盲視的設計元素。

[信息錯誤的示意]和[狀態(tài)的提示]

當用戶因輸入錯誤的信息時,系統(tǒng)會示意[信息錯誤],而這個[信息錯誤的示意]往往會受到變化盲視作用的影響。

具體而言,如用戶填好了一份網(wǎng)頁上的注冊信息表,然后點擊提交,當網(wǎng)頁重載后,99%的內(nèi)容都和之前是一樣的,唯有一處因用戶輸入的錯誤信息而使系統(tǒng)顯示該錯誤信息的提示,如下圖中Goodsourcing.com頁面上用來示意用戶[工作名稱]一欄填寫空白的[數(shù)據(jù)傳輸錯誤(Data Transfer Error)],這一信息提示往往很容易被忽視,因為網(wǎng)頁上可視的信息都被混雜在一起。(圖)

當頁面重新加載后,Goodsourcing.com注冊表上[數(shù)據(jù)傳輸錯誤(Data Transfer Error)](位于[用戶注冊]標題欄的上方)的提示被加入到了原來的網(wǎng)頁中,這一細微的變化因變化盲視而容易被人們忽略。

進度指示,亦或是其他一些有助于用戶理解正在發(fā)生什么的[狀態(tài)的提示]是另一很容易受變化盲視影響的地方。因為他們屬于加入到現(xiàn)有網(wǎng)頁上的小細節(jié),即便是一個動態(tài)的進度提示,例如在Southwest Airlines app中間的白色小圓圈,因為對于其他信息來說不容易被分辨,會常常被用戶忽視。(圖)

左圖中的白色動態(tài)進度提示的小圓圈幾乎無法分辨,即便被放置在頁面的正中。相比而言,右圖中Kayak.com頁面中的動態(tài)小圓圈就很明顯,因為它有一個對比度很大的背景襯托。

[導航菜單]和[目錄]

導航欄也是變化盲視的高頻受害者,這些導航鏈接很重要,但為了使用戶專注于頁面上的內(nèi)容往往被設計在網(wǎng)頁的邊緣處,這使得位于網(wǎng)頁邊緣處的導航鏈接當期發(fā)生改變時更容易被用戶忽視。

下面的例子展示了一個本地導航的視覺效果處理,它在頁面的不同模塊中使用了不同風格的鏈接標簽。通常情況下,不同模塊的各鏈接使用同樣的導航風格是一個常規(guī)的,易于理解的設計模式。但是在這里,本地導航在右列中反常的位置擺放,以及整體視覺上的混雜感會阻礙瀏覽者注意到導航欄,更不可能注意到網(wǎng)頁切換時鏈接標簽的改變。(圖)

網(wǎng)站中每一張網(wǎng)頁右欄中的本地導航上的鏈接標簽很容易被忽視。

[過濾信息提示]

當用戶需要過濾一些搜索結果,過濾提示的使用是相當重要的,而且使用起來也十分的微妙。一方面用戶希望系統(tǒng)的反應很快,盡可能減少等待的時間。另一方面,如果網(wǎng)頁跳轉太快,用戶又有可能根本無法意識到信息已被系統(tǒng)經(jīng)過篩選的過程。

Healthcare.gov的網(wǎng)站就很好的解決了這一對矛盾的需求:當用戶完成選擇時,系統(tǒng)就會開始進行過濾,而不需要特意再去點擊[申請過濾]的按鈕。但是為了確保用戶注意到信息正在經(jīng)歷被系統(tǒng)篩選的過程,一個明顯的視覺提示[請等待]會在以灰色背景襯托中閃現(xiàn)。(圖)

Healthcare.gov的網(wǎng)站上,通過在信息正被篩選的過程中顯示一個[請等待]的提示,而使用戶意識到信息正在被篩選。

對抗變化盲視

導致變化盲視的情況太普遍,因此,所有設計師都應該熟知如何減小其發(fā)生概率的方法,而不同的技術方法應該被應用于不同的情境中,例如:

  • 通過盡可能避免頁面的重新加載來減小視覺干擾。
  • 為重要的新加入的元素加以合理的視覺強調(diào)而使得他們更加明顯。(如對比、大小、填充)(可以考慮一下“斜視測試”,當你往后看或側視的時候新元素是否會很明顯?)
  • 有策略地將重要的新的視覺元素設計放在用戶關注點的附近區(qū)域。
  • 考慮動態(tài)轉換以避免瞬間改變的干擾,界面中的動態(tài)效果對于解釋改變是很有效的。

變化盲視僅僅是會影響用戶體驗的眾多心理現(xiàn)象之一,如果想了解更多認知和感知是如何影響用戶體驗的,可以往“用戶行為”和“人機交互”方面研究。

 

原文:Kathryn Whitenton

翻譯:用戶體驗咨詢機構-BESD設計實驗室 凱莉大帝

本文為作者@BESD設計實驗室 投稿發(fā)布,轉載請注明來源于人人都是產(chǎn)品經(jīng)理并附帶本文鏈接

更多精彩內(nèi)容,請關注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!