萬盛學電腦網

 萬盛學電腦網 >> 圖文處理 >> 平面設計理論 >> 設計中的防呆策略

設計中的防呆策略

   生活中總會有些狀況讓我們無所適從摸不著頭腦:面對一排電燈或空調的按鈕,哪個才是控制我想要的?開鎖時掏出一把鑰匙,哪個才是正確的?拿起U盤插入電腦,朝那個方向才是對的?……類似的猶豫充分說明,你呆住了。現在,是需要”防呆設計”來拯救你了。

  防呆定義

  防呆(日語:ポカヨケ;英語:Fool-proofing)是一種預防矯正的行為約束手段,運用避免產生錯誤的限制方法,讓操作者不需要花費注意力、也不需要經驗與專業知識即可准確無誤完成正確的操作。廣義來講,防呆就是如何設計一個東西,而使錯誤發生的機會減至最低的程度。避免工作錯誤的發生,進而達到”第一次就把工作做對”之境界。

  防呆與設計

  最常見的防呆設計在電腦中,為了讓普通用戶在組裝電腦時不會出錯,相關零組件大都有形狀相符的防呆設計。生活中也不乏防呆設計的應用,下面這款2013年iF獲獎作品微笑鑰匙(Smile Key)就通過防呆設計解決了關於鑰匙的4大難題。自然的弧度,更加貼合拇指和食指,用著更舒服;更容易分辨鑰匙的朝向—再不用去記憶哪面是正確的朝向,自然貼合拇指與食指的那面,便是正確的;鑰匙平放的時候,因為這弧度,更容易被拿起來;鑰匙上面有數目不等的凸起小顆粒,用於區分誰是誰,比如說,1個小顆粒是辦公室的,2個是自家大門的。這在晚上看不到的時候尤其方便,再不用一串鑰匙挨個嘗試了。

設計中的防呆策略 三聯

  防呆設計經常使用感官替換的方式來進行設計。如下面這款杯蓋,通過視覺替代觸覺進行防呆。可以感應杯中液體的溫度顯示不同的顏色。通過視覺的警示提醒人們此時的飲品很是燙口,避免一時糊塗拿起就喝了。

2

  再如下圖所示的路邊的壓痕,則剛好相反,通過觸覺代替視覺提醒對駕駛到路邊的車輛進行防呆提醒:你的車輛已經偏離主行車道了。通過行駛過程中車輛的顛簸感,比視覺引導更有效的指示駕駛員盡快調整方向。

3

  防呆設計的重要目標是避免錯誤。喝咖啡留到桌子上是不是很懊惱?那就別讓這個錯誤發生:來自設計師Kim Keun Ae的創意,防污漬咖啡杯在杯子的腰線上開了一條環狀凹槽,於是,順著杯子邊沿淌下的咖啡漬,流到這裡就會橫向發展,再不會繼續往下弄髒桌子~

4

  另外,防呆還會通過設計在適當的時候對用戶進行提醒,幫助用戶完成任務。來自設計師Risako Matsumoto(松本理紗子)的創意平衡花瓶也利用了防呆的理念:優雅的提醒你澆花。一根木頭支架,一頭嵌著花瓶,另外一頭則是可以移動的配重滑塊,整個結構通過掛鉤固定在牆上,形成一個類似天平的結構。當花瓶中的水減少,支架就會開始傾斜,水減少得越多,也就傾斜得越厲害,從而醒目地提醒你,它該加水了。

5

  夜間的提醒也很重要。停電了,卻怎麼都找不到蠟燭?澳大利亞工作室Den Studio帶來的熒光蠟燭(Blackout Candle),通過防呆設計試圖解決這個問題:它采用了特殊材質的石蠟和發光粉混合制作,白天發光粉吸收光的能量,晚上發出熒光;其次,造型方正,在底部有個小開口,剛好可以塞進去一盒火柴——於是,即便突然的停電讓你措手不及,但是找到了蠟燭,你就能找到火柴~

6

  從上面幾個案例中可以總結出防呆設計的原則:”避免錯誤,無需思考”,細化如下:

  1.即使有人為疏忽也不會發生錯誤──不需要注意力。

  2.外行人來做也不會錯──不需要經驗

  3.不管是誰、無論何時都不會出差錯──不需要專門知識與高度的技能。

  從用戶層面分析,防呆設計就是以非專業、無經驗的用戶角度出發,通過設計引導這類用戶正確的操作。工業設計如此,交互設計也不例外,下面就是筆者對交互中的防呆策略的一些思考。

  交互中的防呆

  簡單地說,防呆設計就是如何去防止錯誤發生的方法。人們總是在怪罪一件錯誤的發生,而較少去動腦筋想想如何去設計一些方法來避免錯誤的發生。所以我們需要正視錯誤,面對錯誤,想方設法的避免錯誤或緩解錯誤。在交互設計中,用戶可能的錯誤正是我們應該預防的方向,我們可以參考防呆設計的思路,通過設計,引導用戶正確的操作。

  1.限制操作

  想象一下:點擊某個功能按鈕,然後提示不能使用,應該怎麼怎麼樣先……此時你是否會呆住:既然不能用,為啥要放出來做煙霧彈?所以,當用戶當前狀態不能進行一些操作時,把這些操作隱藏起來吧。給予用戶適當的行為約束——為用戶封閉掉不正確的道路。下圖所示,如果浏覽器中已安裝Evernote Web Clipper,該頁面對應按鈕顯示為灰色不可用狀態,避免用戶重復安裝。

7

  根據用戶的使用狀態,對應進行功能項的展示和隱藏,是有效避免用戶誤操作的常用手段。由狀態所限制操作的設計在很大程度上預防了用戶可能發生的操作失誤。

  另外,通過有趣的形式提醒用戶達到限制也是一個友善的防呆做法。Feathers是一個第三方Twitter 客戶端,點擊那個可愛的 Twitter 鳥發推。隨著用戶逐漸輸入內容 Twitter 鳥會逐漸變綠,防止用戶輸入超過140 個字符限制。

8

  2.預見錯誤

  給予用戶必要的預判性錯誤提示——在用戶出錯發呆之前,告訴用戶,這樣走可能會出錯。

  當用戶在午夜提到”明天”時,siri會詢問用戶具體的時間,以防用戶錯誤的做出對明天的定義。

9

  當電量不足時,Dropbox會自動停止正在進行中的照片上傳動作。這個貼心的設計讓用戶避免了因上傳而耗盡電量手機關機的囧態。

10

  當用戶的一個行為很可能會引發預見性的錯誤,越早提示用戶,並給出可行性的建議,錯誤越容易被接受和改正,用戶的損失也就越小。

  3.跳出空白

  空白頁面一定是空白的嗎?NO。單純的空白頁面會讓用戶焦躁不安:發生什麼了?我現在該怎麼辦?……無路可走的焦慮肯定是很難受的,為避免這種心理,我們需要給到用戶適當的出口,讓用戶在空白頁面也有路可走。

  例如在空白頁面,提供用戶解決辦法,或提供給用戶其他出口,引導用戶接下來的操作,讓用戶不在空白頁發呆,幫助讓用戶快速離開空白。

11

  又或者,給用戶以與眾不同的空白頁,讓用戶可以在空白中思考。Clear中,當用戶刪除所有list或新建一個空白項時,頁面展示出一些有意思的語句,讓用戶不再空白。

12

  4.步驟狀態

  在一些復雜的操作時,用戶會產生一定的心理疑問:什麼時候才是個頭呢?此時,為了避免用戶發呆,需要告訴用戶操作所處的狀態和接下來的操作步驟。

  對用戶在這個頁面需要做什麼、已經做了什麼有清晰的劃分,對現在需要進行的、當前所處的操作階段予以高亮顯示,吸引人進行操作;對於還未進行到的操作階段也預先做了一個介紹,很清晰的介紹了完整的任務流程。

13
14

  另外,對狀態的巧妙標識也是防止用戶發呆的一個有效途徑。操作過多,用戶可能已經遺忘了一些狀態,比如浏覽網頁時哪些看過哪些未看過。Opera 在新開網頁標簽上設計了折角處理,提醒用戶這個頁面還未浏覽。

15
copyright © 萬盛學電腦網 all rights reserved