隨著互聯(lián)網(wǎng)的飛速發(fā)展，越來(lái)越多產(chǎn)品尤其是2C類(lèi)產(chǎn)品更加注重用戶體驗(yàn)，其中錯(cuò)誤對(duì)用戶體驗(yàn)的影響是災(zāi)難性的，在此我總結(jié)出一些容錯(cuò)性設(shè)計(jì)原則供大家參考和探討。

一、容錯(cuò)性概念及重要性

對(duì)于容錯(cuò)性，大家可能不太清楚是什么概念，但當(dāng)提到可用性時(shí)，那么大部分設(shè)計(jì)師都會(huì)比較熟悉這個(gè)詞的含義?？捎眯允钱a(chǎn)品/系統(tǒng)重要的質(zhì)量指標(biāo)，是產(chǎn)品對(duì)用戶來(lái)說(shuō)有效、易學(xué)、高效、好記、少錯(cuò)和令人滿意的程度。容錯(cuò)性其實(shí)就是可用性之中細(xì)分的一個(gè)模塊，是專(zhuān)門(mén)針對(duì)出錯(cuò)的研究。具體內(nèi)容大家可以去看：唐納德諾曼《設(shè)計(jì)心理學(xué)》中關(guān)于錯(cuò)誤的分類(lèi)及錯(cuò)誤設(shè)計(jì)原則；李樂(lè)山《人機(jī)界面設(shè)計(jì)》中Reason認(rèn)為存在8種基本出錯(cuò)類(lèi)型 ；尼爾森《可用性工程》中錯(cuò)誤信息四原則以及《十大可用性原則》中第七條和第九條（分別是防錯(cuò)原則和容錯(cuò)原則）。容錯(cuò)性的定義為：

容錯(cuò)性是產(chǎn)品對(duì)錯(cuò)誤操作的承載性能，即一個(gè)產(chǎn)品操作時(shí)出現(xiàn)錯(cuò)誤的概率和錯(cuò)誤出現(xiàn)后得到解決的概率和效率。容錯(cuò)性最初應(yīng)用于計(jì)算機(jī)領(lǐng)域，它的存在能保證系統(tǒng)在故障存在的情況下不失效，仍然正常工作。產(chǎn)品容錯(cuò)性設(shè)計(jì)能使產(chǎn)品與人的交流或人與人借助產(chǎn)品的交流更加流暢。

由此可見(jiàn)，容錯(cuò)性設(shè)計(jì)原則是非常重要的，尤其是對(duì)于2C類(lèi)或即時(shí)服務(wù)類(lèi)（如鐵路購(gòu)票網(wǎng)站）產(chǎn)品/系統(tǒng)。

二、容錯(cuò)性設(shè)計(jì)原則

通過(guò)文獻(xiàn)整理，總結(jié)出5一級(jí)原則和18大二級(jí)原則，并提供對(duì)應(yīng)的案例用以加深理解。

1.引導(dǎo)和提示

引導(dǎo)和提示主要是針對(duì)新手用戶，因?yàn)槠胀ㄓ脩艉蛯?zhuān)家用戶可能已經(jīng)熟練使過(guò)產(chǎn)品很多次，對(duì)流程有一定的認(rèn)識(shí)。而對(duì)于新手用戶來(lái)說(shuō)，使用過(guò)程就是個(gè)學(xué)習(xí)的過(guò)程，這時(shí)候正確地引導(dǎo)和提示就比較重要。

（1）提供詳盡的說(shuō)明文字和指導(dǎo)方向

比如新浪微博中當(dāng)用戶搜索沒(méi)有結(jié)果的時(shí)候，給予用戶適當(dāng)?shù)闹敢徒ㄗh。

還有淘寶網(wǎng)中當(dāng)用戶搜索無(wú)結(jié)果時(shí)，智能猜測(cè)用戶的出錯(cuò)原因或者給予其他引導(dǎo)。

（2）引導(dǎo)和提示突出表現(xiàn)，且簡(jiǎn)單容易理解

首先，引導(dǎo)和提示要突出表現(xiàn)，從而引起用戶關(guān)注，確保用戶在操作前能注意到引導(dǎo)或提示信息。

比如在新浪網(wǎng)的注冊(cè)頁(yè)面中，右側(cè)的提示：紅色錯(cuò)誤提示和藍(lán)色引導(dǎo)說(shuō)明在頁(yè)面中很醒目，注冊(cè)用戶自然能注意到此處的提示。其次，引導(dǎo)要簡(jiǎn)單且容易理解，保證用戶在注意到引導(dǎo)或提示后能快速獲取信息，從而得到幫助，以降低發(fā)生錯(cuò)誤的概率。新浪網(wǎng)的注冊(cè)表單中設(shè)置密碼選取的提示文案非常精簡(jiǎn)，每句話表達(dá)了一個(gè)要點(diǎn)，并將最重要的信息即“字符數(shù)”放在了最前面，因此用戶能在第一眼獲得并理解這個(gè)重要的信息。

現(xiàn)在移動(dòng)端app在新手用戶第一次打開(kāi)進(jìn)入界面時(shí)一般都會(huì)有清晰、準(zhǔn)確的功能指引和提示。比如zaker的新功能引導(dǎo)頁(yè)面，在操作區(qū)用淺灰色蒙板覆蓋，減少頁(yè)面其它內(nèi)容的干擾，再使用與蒙板對(duì)比較大的白色文字結(jié)合手勢(shì)圖形提示新功能用法，突出手勢(shì)及重點(diǎn)。

（3）當(dāng)重要或操作結(jié)果不可逆的時(shí)候，詢問(wèn)用戶讓其知道操作的后果

在用戶操作前即給出正確且有效地引導(dǎo)和提示，有助于減少錯(cuò)誤發(fā)生的可能性。如 QQ郵箱網(wǎng)站為了防止用戶錯(cuò)誤，在用戶點(diǎn)擊發(fā)送后提示沒(méi)有輸入主題信息，從而避免用戶直接發(fā)送無(wú)主題郵件。

2.限制操作

如何從設(shè)計(jì)上避免用戶出錯(cuò)，限制是一種非常必要的方式。從古至今，人們?yōu)榱吮苊忮e(cuò)誤的發(fā)生都會(huì)設(shè)置一些障礙或提出一些限制性要求。從上帝給亞當(dāng)夏娃的警告，到我國(guó)歷史上用來(lái)抵御北方游牧民族入侵的萬(wàn)里長(zhǎng)城，再到今日道路交通中限速的減速帶的設(shè)計(jì)，無(wú)不說(shuō)明了有障礙設(shè)計(jì)的意義。

（1）增加那些不能逆轉(zhuǎn)操作的難度

在產(chǎn)品設(shè)計(jì)中這種方法主要是通過(guò)對(duì)一些可能造成錯(cuò)誤的操作入口設(shè)置障礙或直接禁止操作，以避免錯(cuò)誤的發(fā)生。比如windows系統(tǒng)提供隱藏文件的功能，用戶可以把重要的系統(tǒng)文件隱藏起來(lái)以免誤刪。

（2）適當(dāng)限制用戶的某些交互操作

置灰是界面上限制某些操作的好方式。有的網(wǎng)站直接把不能操作的部分灰置，比如攜程網(wǎng)的時(shí)間選擇控件的設(shè)計(jì)，將已經(jīng)過(guò)去的日期灰置，以免用戶誤選。

再看淘寶網(wǎng)的注冊(cè)頁(yè)，根據(jù)操作的步驟，將未開(kāi)始的操作如下一步按鈕置灰，一方面告訴用戶當(dāng)前可以進(jìn)行當(dāng)前操作，讓用戶只關(guān)注于當(dāng)下的任務(wù)步驟，防止用戶出錯(cuò)；另一方面預(yù)示后面還有哪樣的操作。

3.反饋和幫助

（1）當(dāng)用戶有些錯(cuò)誤發(fā)生時(shí)，及時(shí)反饋錯(cuò)誤并提供糾錯(cuò)幫助

反饋錯(cuò)誤及時(shí)就能保證用戶每個(gè)階段的操作都能得到回饋，避免因?yàn)橐粋€(gè)小的錯(cuò)誤就要修改相關(guān)聯(lián)的一系列內(nèi)容的情況，提高成功完成任務(wù)的效率；反饋不僅要指出有錯(cuò)，還要指出錯(cuò)在哪里。

優(yōu)酷網(wǎng)的登錄表單，在輸入錯(cuò)誤的用戶名后，系統(tǒng)就會(huì)馬上給出反饋“用戶名不存在”，避免用戶在輸完密碼點(diǎn)擊登錄后才能發(fā)現(xiàn)錯(cuò)誤，這樣用戶就能馬上停止后續(xù)操作來(lái)解決當(dāng)下的問(wèn)題。

如果錯(cuò)誤不可避免的發(fā)生了，合理恰當(dāng)?shù)奶崾究梢詼p少用戶的挫敗感。谷歌瀏覽器打不開(kāi)頁(yè)面時(shí)提供的提示說(shuō)明信息，簡(jiǎn)潔直觀說(shuō)明問(wèn)題的情況及原因，并且還在更多信息里提供了一些相應(yīng)的解決方法，這樣也就提高了提示信息的有效性。同時(shí)，不知道大家是否知道這個(gè)頁(yè)面其實(shí)還是一個(gè)小游戲，只要敲擊空格鍵就可控制上面的恐龍來(lái)避免前方出現(xiàn)的障礙物，可以算是谷歌設(shè)計(jì)師對(duì)瀏覽器發(fā)生錯(cuò)誤時(shí)做的彌補(bǔ)，對(duì)用戶小小的歉意。

（2）出錯(cuò)信息應(yīng)當(dāng)用清晰的語(yǔ)言來(lái)表達(dá)，而不要使用難懂的術(shù)語(yǔ)

錯(cuò)誤反饋文案要清晰、準(zhǔn)確，這樣便于用戶了解錯(cuò)誤的原因，方便下一步的修改。新浪網(wǎng)注冊(cè)頁(yè)設(shè)置密碼中，當(dāng)用戶輸入的密碼不符合要求時(shí)，會(huì)用紅色文字反饋錯(cuò)誤及其原因是字符數(shù)不符合要求，用戶就知道怎么修改了。

（3）出錯(cuò)信息使用的語(yǔ)言應(yīng)當(dāng)精煉準(zhǔn)確，而不是空泛而模糊的

最好能夠告訴用戶，具體錯(cuò)誤的原因在哪里，是哪句話和哪個(gè)字出現(xiàn)的問(wèn)題。舉一個(gè)反例：QQ空間的說(shuō)說(shuō)編輯輸入框，當(dāng)輸入的語(yǔ)言包含敏感詞匯時(shí)，反饋提示中沒(méi)有具體指出是那個(gè)詞有問(wèn)題。

還有remember the milk的注冊(cè)表單，同樣是用戶名稱(chēng)，當(dāng)輸入名稱(chēng)后，反饋提示是“無(wú)效”，這個(gè)提示并沒(méi)準(zhǔn)確指出用戶怎么做是正確的，是“字符數(shù)不夠還是超過(guò)”還是“所選用戶名被占用”還是其它原因？用戶只能一個(gè)一個(gè)地試，這時(shí)排查錯(cuò)誤的效率自然下降，產(chǎn)品的容錯(cuò)性能也就存在問(wèn)題了。

（4）出錯(cuò)信息應(yīng)當(dāng)對(duì)用戶解決問(wèn)題提供建設(shè)性幫助

在用戶操作的過(guò)程中，出現(xiàn)錯(cuò)誤要及時(shí)反饋，使用戶能盡早發(fā)現(xiàn)錯(cuò)誤。同時(shí)要及時(shí)提供糾錯(cuò)幫助，系統(tǒng)先自動(dòng)糾錯(cuò)，不能自動(dòng)糾錯(cuò)時(shí)，就提供糾錯(cuò)幫助。這樣即使用戶操作錯(cuò)誤了，但成功完成操作的效率也能大大提高。

當(dāng)用戶知道錯(cuò)誤后要及時(shí)提供糾錯(cuò)幫助，如關(guān)聯(lián)推薦等，以幫助用戶快速找到糾錯(cuò)的辦法。Google搜索中，當(dāng)有單詞或詞語(yǔ)輸入錯(cuò)誤時(shí)，Google搜索就會(huì)根據(jù)匹配度給用戶可能正確的單詞或詞語(yǔ)供用戶選擇，避免二次輸入，很人性化的做好了糾錯(cuò)。

（5）出錯(cuò)信息應(yīng)當(dāng)友好，不要威脅或者責(zé)備用戶

按照可用性的理論，用戶沒(méi)有出錯(cuò)，出錯(cuò)的是你的產(chǎn)品，因?yàn)樗荒苷_的解讀用戶的操作行為。不要在錯(cuò)誤信息中責(zé)備用戶，我們應(yīng)該因?yàn)閱?wèn)題向用戶道歉，為用戶提供“情感支持”，主動(dòng)識(shí)別并處理用戶的情感狀況，能緩解挫敗帶來(lái)的強(qiáng)烈的負(fù)面情緒和刺激。

4.錯(cuò)誤恢復(fù)

（1）允許用戶犯錯(cuò)，并使操作者能夠撤銷(xiāo)以前的指令

最常見(jiàn)的如Microsoft office軟件，用戶編輯文檔后如果發(fā)現(xiàn)錯(cuò)誤，需要修改時(shí)可以按ctrl+z來(lái)撤銷(xiāo)上一次的編輯，恢復(fù)錯(cuò)誤。

（2）能幫助用戶在發(fā)生錯(cuò)誤后迅速回到正確狀態(tài)

iPhone手機(jī)的還原功能，可以在用戶出錯(cuò)時(shí)將多種功能設(shè)置快速還原到原始狀態(tài)。

（3）盡可能注意保留操作信息，提供安全恢復(fù)到離錯(cuò)誤點(diǎn)最近一步的方式

用戶每次執(zhí)行操作后，尤其是完成操作步驟比較多的任務(wù)，要盡可能注意保留操作信息，以便能夠及時(shí)恢復(fù)；如果是一個(gè)任務(wù)結(jié)束后的操作錯(cuò)誤，最好是能提供安全恢復(fù)到離錯(cuò)誤點(diǎn)最近的一步的方式，使用戶可以快速地從糾正錯(cuò)誤的步驟中轉(zhuǎn)移到正確的流程上，從而挽回?fù)p失或錯(cuò)誤。

Photoshop中的歷史動(dòng)作就是一個(gè)很好的例子，可以默認(rèn)保存最新的20個(gè)操作，也可以自己設(shè)置保存數(shù)量；用戶在設(shè)置數(shù)量范圍內(nèi)的每一步操作都可以恢復(fù)。

Gmail郵箱幾乎給所有的操作都提供了撤銷(xiāo)功能，用戶如果誤刪了郵件都可以撤銷(xiāo)操作，甚至點(diǎn)擊發(fā)送郵件按鈕后都可以在一定的時(shí)間內(nèi)撤銷(xiāo)操作。

5.減少負(fù)擔(dān)

（1）盡可能減少用戶的記憶負(fù)擔(dān)

記憶是人類(lèi)一個(gè)非常重要的心理活動(dòng)，它是人類(lèi)很多其他思維活動(dòng)和行為的基礎(chǔ)。在所有的認(rèn)知心理活動(dòng)中，記憶是和用戶界面設(shè)計(jì)關(guān)系最為密切的一個(gè)，很多軟件可用性方面的問(wèn)題都?xì)w結(jié)為記憶問(wèn)題。12306鐵路購(gòu)票網(wǎng)站，購(gòu)票信息頁(yè)面的溫馨提示內(nèi)容非常冗長(zhǎng)，用戶很難關(guān)注到重點(diǎn)信息。

（2）減少用戶認(rèn)知混淆

根據(jù)已訂閱和未訂閱的不同，訂閱button和退訂進(jìn)行視覺(jué)上明顯的區(qū)分，避免錯(cuò)誤操作。

（3）讓用戶單次只需執(zhí)行唯一操作

普通用戶在一些流程復(fù)雜的交互操作前總會(huì)或多或少的迷茫。解決方法就是讓用戶單次只需執(zhí)行唯一操作，不要把復(fù)雜的選擇題拋給用戶，讓用戶出錯(cuò)。例如在電腦殺毒這個(gè)相對(duì)復(fù)雜的任務(wù)中，一次只提供給用戶唯一明顯按鈕，避免用戶在選擇時(shí)左右為難，只給用戶唯一的推薦，別讓用戶思考。

（4）減少不必要的操作步驟

攜程網(wǎng)的注冊(cè)頁(yè)面，輸入郵箱時(shí)下方會(huì)相應(yīng)出現(xiàn)各種郵箱后綴供用戶快速選擇，減少用戶的輸入操作次數(shù)。

三、總結(jié)

修修補(bǔ)補(bǔ)外加引用寫(xiě)了這么多文字和圖片，希望對(duì)大家有用，如有哪些分類(lèi)不合理或解釋案例不夠有代表性的地方請(qǐng)大家能夠指出，若能提供相應(yīng)的建議就更加好啦。最后，將所有提到的一二級(jí)原則統(tǒng)一整理成架構(gòu)圖方便大家查看。

參考文獻(xiàn)：

1.Jakob Nielsen.Useability Engineering[M].NewYork:Academic Press,1993.

2.李樂(lè)山.人機(jī)界面設(shè)計(jì)[M].北京:科學(xué)出版社,2004.

3.唐納德·A·諾曼.設(shè)計(jì)心理學(xué)[M].中信出版社,2010-03.

4.張雅秋.容錯(cuò)性設(shè)計(jì)[EB/OL].(2011-11-21)[2012-02-13].

5.黃群.交互設(shè)計(jì)中產(chǎn)品的容錯(cuò)性設(shè)計(jì)應(yīng)用研究[J].設(shè)計(jì)藝術(shù)研究,2012,1:47-51.

6.閆霞.產(chǎn)品設(shè)計(jì)中的容錯(cuò)性思考[J].東華大學(xué)學(xué)報(bào),2012,38(5):636-642.

作者：半木zxy

來(lái)源：https://zhuanlan.zhihu.com/p/20911174

本文由 @半木zxy授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。