移動(dòng)端用戶(hù)體驗(yàn)設(shè)計(jì)中錯(cuò)誤狀態(tài)設(shè)計(jì)分析和實(shí)踐

金無(wú)足赤，人無(wú)完人，在我們的日常生活中，在我們使用APP的過(guò)程中都難免會(huì)發(fā)生錯(cuò)誤。錯(cuò)誤有些時(shí)候是人為原因造成的，有些時(shí)候是系統(tǒng)原因造成的。不管是什么原因造成的，我們?nèi)绾握J(rèn)識(shí)這些錯(cuò)誤以及怎么處理這些錯(cuò)誤，都對(duì)APP的用戶(hù)體驗(yàn)有很大的影響。

我們常常忽視了錯(cuò)誤狀態(tài)的設(shè)計(jì)，一個(gè)不用心的錯(cuò)誤處理或者糟糕的錯(cuò)誤信息提示會(huì)讓用戶(hù)感到無(wú)比挫敗，致使他們不再使用你的APP。而相反，一個(gè)處理妥當(dāng)?shù)腻e(cuò)誤狀態(tài)設(shè)計(jì)能讓情況轉(zhuǎn)危為安。在這篇文章中，我們會(huì)探討如何設(shè)計(jì)才能盡可能地避免用戶(hù)遇到不必要的錯(cuò)誤，以及如何設(shè)計(jì)一個(gè)好的錯(cuò)誤提示信息。

什么是錯(cuò)誤

錯(cuò)誤（或者說(shuō)錯(cuò)誤狀態(tài)）發(fā)生在A(yíng)PP無(wú)法完成預(yù)想的功能的時(shí)候，例如：

• APP沒(méi)有理解用戶(hù)的輸入
• APP崩潰了
• 用戶(hù)進(jìn)行了兩個(gè)不能同時(shí)進(jìn)行的操作

錯(cuò)誤已經(jīng)成為了用戶(hù)使用APP過(guò)程中的一個(gè)重要阻力點(diǎn)。幸運(yùn)的是，我們可以通過(guò)精心的設(shè)計(jì)來(lái)減少這個(gè)阻力。

避免用戶(hù)錯(cuò)誤

如果你在設(shè)計(jì)一款A(yù)PP，你應(yīng)該熟悉設(shè)計(jì)的邊界條件。舉個(gè)例子，如果手機(jī)的網(wǎng)絡(luò)環(huán)境很差，用戶(hù)將很難完成提交一個(gè)表單或者同步一個(gè)數(shù)據(jù)。所以，在設(shè)計(jì)一款對(duì)用戶(hù)好用的APP時(shí)，你必須考慮這些邊界條件，從而減少錯(cuò)誤的不良影響。換句話(huà)說(shuō)，作為設(shè)計(jì)師你最好能通過(guò)向用戶(hù)提供建議，利用邊界條件和彈性機(jī)制來(lái)把錯(cuò)誤扼殺在搖籃里。

推特對(duì)推文有嚴(yán)格的字?jǐn)?shù)限制，當(dāng)輸入字?jǐn)?shù)超過(guò)字?jǐn)?shù)限制時(shí)，系統(tǒng)用紅字提醒超出的字?jǐn)?shù)

讓錯(cuò)誤提示信息具有引導(dǎo)性和一致性

尼爾森的十大可用性原則中有一條建議，優(yōu)雅而清晰地告知用戶(hù)發(fā)生錯(cuò)誤的情況。一個(gè)有效的錯(cuò)誤提示信息包括以下信息：

• 清晰地告知用戶(hù)發(fā)生了什么
• 解釋用戶(hù)如何解決問(wèn)題
• 盡可能保存用戶(hù)已輸入的信息

用戶(hù)表單輸入錯(cuò)誤

用戶(hù)確認(rèn)提交表單信息后，意味著APP與用戶(hù)建立了對(duì)話(huà)關(guān)系，系統(tǒng)有義務(wù)在用戶(hù)遇到錯(cuò)誤和不確定狀況的時(shí)候能幫助他們渡過(guò)難關(guān)。這個(gè)過(guò)程應(yīng)該更加情感化，而不是充滿(mǎn)冷冰冰的技術(shù)術(shù)語(yǔ)。

關(guān)于輸入錯(cuò)誤最重要的原則是：“主動(dòng)跟用戶(hù)交流！當(dāng)錯(cuò)誤發(fā)生時(shí)告知他們！”一般來(lái)說(shuō)，一個(gè)好的表單包括三個(gè)要點(diǎn)：

• 在恰當(dāng)?shù)臅r(shí)間和地點(diǎn)告知錯(cuò)誤
• 恰當(dāng)?shù)奶崾疚谋绢伾?/li>
• 簡(jiǎn)潔的提示信息語(yǔ)言

這三個(gè)要點(diǎn)都有一個(gè)共同的目標(biāo)——避免困惑。

在恰當(dāng)?shù)臅r(shí)間和地點(diǎn)告知錯(cuò)誤 （內(nèi)聯(lián)檢驗(yàn)）

用戶(hù)不喜歡他們填完所有表單，然后提交后系統(tǒng)才告知他們填寫(xiě)錯(cuò)誤。最好的時(shí)機(jī)是用戶(hù)剛填完信息就告知他們是否填寫(xiě)正確，實(shí)時(shí)表單驗(yàn)證能幫助我們實(shí)現(xiàn)這個(gè)功能。

實(shí)時(shí)內(nèi)聯(lián)檢驗(yàn)系統(tǒng)，能立即告知用戶(hù)剛輸入的數(shù)據(jù)是否正確。實(shí)時(shí)檢驗(yàn)后，如果填寫(xiě)區(qū)域有明顯的錯(cuò)誤提示，提交按鈕將無(wú)法點(diǎn)擊直到錯(cuò)誤被改正。實(shí)時(shí)檢驗(yàn)?zāi)軒椭脩?hù)更快地糾正錯(cuò)誤，而不是讓他們點(diǎn)完提交按鈕后才知道錯(cuò)誤的發(fā)生。

下面是幾個(gè)內(nèi)聯(lián)檢驗(yàn)的例子：

• 用戶(hù)名已注冊(cè)

圖片來(lái)源：Material Design

• 超過(guò)字?jǐn)?shù)限制

恰當(dāng)?shù)念伾ǚ现庇X(jué)的設(shè)計(jì)）

在設(shè)計(jì)驗(yàn)證效果時(shí)顏色是最好的工具。因?yàn)樗苡|發(fā)人的本能反應(yīng)，紅色的信息表示錯(cuò)誤，黃色的信息表示警告，這種暗示效果是非常顯著的。錯(cuò)誤提示信息的顏色要與背景色作好對(duì)比使它更易讀，但要保證你的產(chǎn)品的界面顏色對(duì)所有用戶(hù)的可及性（accessible），這是一個(gè)好的視覺(jué)設(shè)計(jì)中的重要組成部分。

讓所有用戶(hù)都能注意到提示信息。

清晰易懂的提示內(nèi)容（告知用戶(hù)發(fā)生了什么）

你要讓錯(cuò)誤提示信息，像是一個(gè)有血有肉的人寫(xiě)出來(lái)的。為了達(dá)到這個(gè)目標(biāo)，你應(yīng)該使用和用戶(hù)同樣的語(yǔ)言，避免一些技術(shù)術(shù)語(yǔ)，提示信息應(yīng)該清晰地描述：

• 發(fā)生了什么錯(cuò)誤以及可能的原因。
• 用戶(hù)應(yīng)該如何修正錯(cuò)誤。

第一個(gè)錯(cuò)誤案例中只告知用戶(hù)數(shù)據(jù)驗(yàn)證錯(cuò)誤而沒(méi)有告知用戶(hù)為什么發(fā)生錯(cuò)誤（是拼寫(xiě)錯(cuò)誤？還是已占用？）。圖片來(lái)源：Material Design

APP自身的錯(cuò)誤

這種錯(cuò)誤跟用戶(hù)輸入無(wú)關(guān)，是系統(tǒng)因某種原因無(wú)法呈現(xiàn)給用戶(hù)他們想要看到的結(jié)果。這種情況就應(yīng)該向用戶(hù)解釋?zhuān)瑸槭裁礇](méi)有結(jié)果以及相應(yīng)的解決方法。

數(shù)據(jù)同步錯(cuò)誤/無(wú)法加載

當(dāng)數(shù)據(jù)連接中斷，信息無(wú)法加載的時(shí)候，我們應(yīng)該直接告訴他們具體情況。由于我們無(wú)法呈現(xiàn)信息，我們可以設(shè)計(jì)一個(gè)空白狀態(tài)頁(yè)來(lái)填補(bǔ)這個(gè)空白?？上Т蠖鄶?shù)空白狀態(tài)頁(yè)都看起來(lái)太……空白了。就像下面這個(gè)案例，錯(cuò)誤信息只說(shuō)明了“系統(tǒng)發(fā)生了一個(gè)錯(cuò)誤”，并沒(méi)有提供任何有幫助的信息。

將你設(shè)計(jì)的錯(cuò)誤信息想象成一次跟用戶(hù)的交談，在用戶(hù)遇到挫折時(shí)，你用友好、具有幫助的話(huà)語(yǔ)來(lái)幫助用戶(hù)了解基本情況并鼓勵(lì)他們解決這個(gè)問(wèn)題。

遇到錯(cuò)誤時(shí)就像置身于孤島一般感到迷惑和不安？沒(méi)關(guān)系！請(qǐng)遵循系統(tǒng)的建議，保持冷靜，點(diǎn)上火把，然后下拉刷新。

如果合適的話(huà)，你也可以在空白狀態(tài)頁(yè)放上按鈕或鏈接來(lái)幫助用戶(hù)完成任務(wù)。但要注意的是，你提供的選項(xiàng)要確保是奏效的。舉個(gè)例子，你知道用戶(hù)點(diǎn)擊“再試一次”的按鈕后仍無(wú)法解決錯(cuò)誤，這時(shí)就應(yīng)該去掉這個(gè)選項(xiàng)。

永遠(yuǎn)不要使用生硬的技術(shù)語(yǔ)言來(lái)描述錯(cuò)誤。

這個(gè)錯(cuò)誤提示是程序員寫(xiě)給程序員看的

不要自以為是地認(rèn)為用戶(hù)了解錯(cuò)誤發(fā)生的原因或認(rèn)為他們懂技術(shù)，你要用通俗易懂的語(yǔ)言來(lái)描述錯(cuò)誤。

不相容狀態(tài)錯(cuò)誤

不相容狀態(tài)錯(cuò)誤發(fā)生在當(dāng)用戶(hù)嘗試運(yùn)行兩個(gè)互相沖突的操作時(shí)，例如在飛行模式打電話(huà)或是在沒(méi)有網(wǎng)絡(luò)的情況下看在線(xiàn)視頻。你應(yīng)該清楚地告知用戶(hù)他們正在選擇的狀態(tài)是怎樣的，以防止發(fā)生不相容狀態(tài)的錯(cuò)誤。簡(jiǎn)單來(lái)說(shuō)，就是不要讓他們開(kāi)始他們不能完成的操作。

闡明問(wèn)題發(fā)生的原因和來(lái)源。

結(jié)論

關(guān)于錯(cuò)誤狀態(tài)的設(shè)計(jì)，最好的解決方案就是不讓錯(cuò)誤發(fā)生，我們要盡可能地在用戶(hù)犯錯(cuò)之前引導(dǎo)用戶(hù)通往正確的道路。如果錯(cuò)誤無(wú)法避免要發(fā)生，一個(gè)設(shè)計(jì)良好的錯(cuò)誤狀態(tài)設(shè)計(jì)，不僅能教導(dǎo)用戶(hù)如何使用app，還不會(huì)讓用戶(hù)認(rèn)為自己很愚蠢。

本文來(lái)自成都品牌網(wǎng)站建設(shè)網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián) 

標(biāo)簽：創(chuàng)新互聯(lián),手機(jī)建站,響應(yīng)式網(wǎng)站

文章標(biāo)題：移動(dòng)端用戶(hù)體驗(yàn)設(shè)計(jì)中錯(cuò)誤狀態(tài)設(shè)計(jì)分析和實(shí)踐
網(wǎng)頁(yè)地址：http://www.jbt999.com/news5/164455.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專(zhuān)注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷(xiāo)seo公司；服務(wù)項(xiàng)目有用戶(hù)體驗(yàn)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：[email protected]。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)