9條建議帶你深入了解防錯原則
編輯導(dǎo)語:用戶體驗是衡量產(chǎn)品成功與否的一大標(biāo)準(zhǔn)之一,作者總結(jié)了十大防錯原則,用于評價用戶體驗的好壞,對于我們做產(chǎn)品設(shè)計有一定的自查作用。
Jakob Nielsen對人機交互有很多研究,他提出十大可用性原則,用來評價用戶體驗的好壞,每個產(chǎn)品設(shè)計者都可以根據(jù)這十大原則進(jìn)行自查。本文中主要介紹了防錯原則的具體應(yīng)用示例,接下來讓我們一起看看吧。
一、錯誤預(yù)防
錯誤預(yù)防是用戶界面設(shè)計的10 條啟發(fā)式評估可用性的原則之一( 尼爾森啟發(fā)式評估可用性的 10 條原則 )。
據(jù)統(tǒng)計,犯錯誤的頻率和嚴(yán)重性與系統(tǒng)的整體可用性呈負(fù)相關(guān)。
( [1]尼爾森啟發(fā)式評估可用性的 10 條原則 https://www.nngroup.com/articles/ten-usability-heuristics/)
盡管無法確保用戶始終按照我們希望的方式使用我們的設(shè)計,但仍有一些方法可以防止( 或減少 )用戶誤操作,而且當(dāng)涉及到破壞性操作時( 例如,從系統(tǒng)中刪除文件)尤為重要。
對話框是系統(tǒng)和用戶之間的“ 對話 ”。模態(tài)對話框會打斷用戶本身的任務(wù)流程,并要求他們采取行動或向他們提供有關(guān)當(dāng)前工作流程的緊急信息。在執(zhí)行破壞性操作之前,用戶通常會看到一個確認(rèn)對話框。
(破壞性操作的確認(rèn)對話框示例)
一個確認(rèn)對話框,詢問用戶進(jìn)行確認(rèn),他們想詢問用戶對剛剛操作進(jìn)一步確認(rèn)( 以防止用戶誤操作 )。— 牛頓/克
這些行為被稱為肯定性破壞性行為;由用戶發(fā)起的破壞性操作,其中出現(xiàn)模態(tài)對話框以確認(rèn)操作,并確保用戶完全理解操作所帶來的后果。在某些情況下,用戶或系統(tǒng)可能會意外啟動破壞性操作。例如,在填寫尚未提交的表單時離開頁面可能會導(dǎo)致數(shù)據(jù)丟失。
當(dāng)用戶在沒有保存數(shù)據(jù)的情況下意外離開頁面時觸發(fā)錯誤預(yù)防模態(tài)對話。
二、如何改進(jìn)破壞性操作的模態(tài)對話框?
1. 在執(zhí)行操作之前提示
在執(zhí)行具有嚴(yán)重后果的操作之前( 例如破壞用戶的工作 —— 刪除文件 / 帳戶等 ),應(yīng)使用確認(rèn)對話框,這在無法撤消的行動之前尤為重要。
2. 重申用戶的請求
確認(rèn)對話框必須重申用戶的請求,并說明如果請求得到確認(rèn),系統(tǒng)將執(zhí)行什么操作,這使用戶能夠更加清楚地了解其操作的結(jié)果。將用戶的行為描述成一個問題,是一種吸引用戶注意力,并讓他們停下來考慮自身的上一步操作的方式。下面的示例證明了這一點。
(重申用戶請求的破壞性操作確認(rèn)對話框示例)
3. 幫助用戶理解操作
為了實現(xiàn)這一點,微內(nèi)容 [2]很重要。
應(yīng)該避免是 / 否以及那種含糊的選項( 參見下面的一個反面案例 )并且按鈕的文本應(yīng)該著重強調(diào)即將做出的選擇( 例如,刪除帳戶 )。此外,在對話框中添加一些輔助解釋會很有用,但主要消息應(yīng)該在按鈕文本中,因為急躁的用戶更有可能忽略那些輔助的解釋只關(guān)注按鈕的文本。
( [2] 微內(nèi)容是一種用戶體驗文案,以短文片段或短語的形式出現(xiàn),通常沒有額外的背景支持。)
糟糕的微文案會讓用戶感到困惑,并可能導(dǎo)致用戶犯錯并非常沮喪。
4. 將按鈕差異化
例如,在一個按鈕上使用了紅色,可幫助用戶識別出來這是一個破壞性操作。在這里顏色與主按鈕的文案相匹配,并明確了按鈕的用途,但是,由于可訪問性和文化差異,僅依靠顏色是不夠的。尤其是世界上大約 4.5 % 的人口患有某種形式的色盲,僅使用顏色來傳達(dá)意義可能會讓我們的很大一部分用戶被拒之門外。
因此,按鈕標(biāo)簽需要具有足夠的描述性,以便在沒有顏色的情況下獨立表達(dá)含義。為了使警告信號更引人注意且更易于理解,還可以在屏幕上顯示一個代表破壞性操作的圖標(biāo)。
5. 不要過度使用
對常規(guī)動作使用確認(rèn)性對話框會影響用戶對破壞性動作對話框的認(rèn)知。如果用戶看到了太多確認(rèn)性對話框的模態(tài)窗口,他們可能會習(xí)慣它們,并且不再注意他們。結(jié)果就會導(dǎo)致確認(rèn)性對話框失去了錯誤預(yù)防的能力。
6. 保證簡潔
確認(rèn)性對話應(yīng)該簡短,以便于瀏覽,但是,在某些情況下,用戶可能希望在提交之前了解有關(guān)其行為后果的更多信息。在這些情況下,可以使用漸進(jìn)式披露 [3]的交互方式。
( [3] 漸進(jìn)式披露 :漸進(jìn)式披露不直接用戶提供大量的信息和選擇,而是將這個過程分解成幾部分,讓用戶集中注意力在當(dāng)前的事件上,從易到難地引導(dǎo)用戶,這樣不僅可以確保用戶不會被新信息淹沒,還可以分解用戶不想做的任務(wù)。)
(漸進(jìn)式披露能使用戶自主決定是否要了解更多當(dāng)前行為的后果)
7. 避免默認(rèn)選擇
我們要避免給確認(rèn)性對話框提供默認(rèn)的選擇,因為本來我們的目的就是通過這種模式讓用戶仔細(xì)檢查他們的操作,從而預(yù)防用戶犯錯。
8. 撤銷破壞性操作
理想情況下,我們應(yīng)該允許用戶撤消破壞性操作,很多時候在一瞬間你就意識到自己犯下了一個可怕的錯誤。許多 APP 允許用戶撤消此類操作,或者使用撤消空間,或者讓用戶在最終完成操作之前編輯這些操作。
這與啟發(fā)式評估可用性的10條原則中另一條的核心觀點相吻合,即用戶的控制性和自由度。這可以減少用戶的焦慮,并能幫助他們挽回重大錯誤操作造成的損失。
當(dāng)用戶知道他們可以撤消操作并從錯誤中恢復(fù)時,他們會感覺對產(chǎn)品有更多的控制權(quán)。Google 的 Gmail 有一個可選的“撤消發(fā)送”功能已經(jīng)有一段時間了,它為用戶提供了 20 秒的緩沖時間來撤消他們的操作。
9. 通過輸入確認(rèn)操作
如果無法實現(xiàn)撤消按鈕,我們可以提示用戶在文本字段中輸入文字確認(rèn)執(zhí)行破壞性操作( 例如需要用戶手動鍵入刪除 / 確認(rèn) / 等 )。提示他們輸入以確認(rèn),強迫他們停下來并閱讀模態(tài)文本,從而做出有意識的決定。雖然有可能意外地按錯按鈕,但不可能意外地輸入動作,因為這需要深思熟慮,下面給出一個例子。
提示:在非常關(guān)鍵的刪除操作中也應(yīng)謹(jǐn)慎使用這種方式,因為如果經(jīng)常使用,可能會惹惱用戶。
(“鍵入以確認(rèn)”模式可確保用戶做出有意識的決定)
以上便是針對破壞性操作預(yù)防模態(tài)對話框設(shè)計的9點建議,可能不能做到萬無一失,但關(guān)注每一個細(xì)節(jié),一定會讓你的設(shè)計得到提升,進(jìn)而提升產(chǎn)品的用戶體驗。
作者:MariaPanagiotidi;譯者:劉昱茜;審校:吳鵬飛、李澤慧、張聿彤;編輯:李莉好
原文鏈接:https://uxpsychology.substack.com/p/how-to-design-better-destructive?r=3lu2i&utm_campaign=post&utm_medium=web&utm_source=
本文由@TCC翻譯情報局 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自 Unsplash,基于CC0協(xié)議。
防錯真的很需要,但是頁面還要設(shè)計的簡潔有效
防錯設(shè)計在購物app上也經(jīng)常能看到了,比如它試圖挽留你不要離開此頁面的一些反設(shè)計
還是要醒目又簡潔才好,這樣就會很實用,不過也不必一直一直提醒
我感覺在二次提醒哪里都添加一個可以不彈出的選項,如果要頻繁使用也不會覺得費事
醒目的顏色真的會讓人再思考幾秒,還是很有些區(qū)間