很(hěn)多(duō)人(rén)都(dōu)♠≠>β在網銀(yín)或者直銷銀(yín)行(xíng)中買過理(lǐ•✔€★)财産品，各家(jiā)銀(yín)行(xíng)的(de)理(lǐΩ↑γ↕)财産品購(gòu)買流程是(shì)大(dà)同小(xiǎo)異的★₹±(de)：選擇合适的(de)理(lǐ)财§←§€産品——輸入購(gòu)買金(jīn)額——确認項✔'↔≥目信息——返回操作(zuò)結果。我們假設一(yī)個(gèγ♣)情況，當用(yòng)戶輸入的(de)購(gòu)買金≥ε♠(jīn)額超過賬戶餘額時(shí)，我們應該怎麽給用(y★¶òng)戶一(yī)個(gè)錯(cuò)誤提示？
以甯波銀(yín)行(xíng)直銷銀(yín)行(↔&"✔xíng)為(wèi)例，當你(nǐ)想購(gòu)買 4→★™×000 元的(de)直投項目的(de)時(shí)候，點擊♦×σ"「立即購(gòu)買」按鈕，進入「确認支付頁面&&β」，點擊「去(qù)支付」按鈕，這(zhè)時(shí)£Ω候彈出一(yī)個(gè)對(duì)話(huà)框，告訴你(nǐ₹®)賬戶餘額不(bù)足。具體(tǐ)多(duō)少(shǎo)餘額✔♣♠ 也(yě)沒有(yǒu)說(shuō)清楚↔<β，你(nǐ)立馬去(qù)「我的(de)賬戶§♠」裡(lǐ)看(kàn)了(le)餘額再返ε≠↔回購(gòu)買，這(zhè)時(shí)發現(xiàn)項目都(dōu)被人σ÷$ (rén)搶光(guāng)了(le)，瞬間(jα<σπiān)奔潰。
從(cóng)這(zhè)個(gè)虛拟案例中，我們可(kě)以看(k÷←♠àn)出錯(cuò)誤提示對(duì)于産δ×品用(yòng)戶體(tǐ)驗來(lái)說(shuō)是(✘shì)極其重要(yào)的(de)，那(nà)麽如(rú)何才能§(néng)給用(yòng)戶提供合适友(yǒu←α¶♥)好(hǎo)的(de)錯(cuò)誤提示呢(↓β♦ne)？
什(shén)麽是(shì)錯(cuò)誤提示用(yòng)戶在填寫信息的(de)時(shí)候難免會(huì★✔)出錯(cuò)，例如(rú)，表單太長(chán≠≠↕βg)他(tā)們可(kě)能(néng)會(hu≤ ≈•ì)忘記填寫其中的(de)一(yī)項，或者輸入了(le☆ε±) 14 位的(de)手機(jī)号碼，又(yòu)或者輸入的(de)密 ≥↑×碼中隻有(yǒu)數(shù)字沒有(yǒu)字母€過于簡單等等。這(zhè)個(gè)時(shí)候∞✔®我們應該給用(yòng)戶一(yī)個(gè)提示，讓₽∏他(tā)們了(le)解當前的(de)錯(cuò)誤狀态。這(zh≤•£πè)就(jiù)是(shì)我們常說(shuō)的(de)錯(c↕ uò)誤提示。
一(yī)個(gè)合格的(de)錯(cuò)誤提示應σβ該有(yǒu)以下(xià)兩個(gè)基本功能(n éng)：
1、向用(yòng)戶報(bào)告錯(cuò)誤狀态♣¥₹；
2、解釋錯(cuò)誤發生(shēng)原因以及如(rú¥®)何更正。
錯(cuò)誤提示的(de)種類
1.彈出框
目前來(lái)說(shuō)，彈出框可(kě)以說(shuō)是(sh♦α←♣ì)常見(jiàn)的(de)錯(cuò) 誤提示形式。因為(wèi)彈出框的(de)σ↓空(kōng)間(jiān)比較大(dà)，可(kě)以很(hěn$÷≠§)完整的(de)向用(yòng)戶告知(zhī)當前的(de)錯(cu≈↔₩ò)誤狀态并且闡明(míng)錯(cuò)誤原因以及λ"β如(rú)何更正。但(dàn)是(shì)彈出框這≥∑✘→(zhè)種形式也(yě)有(yǒu)自(zì)身(shēn)的←€(de)缺陷，那(nà)就(jiù)是(shì)用'✘∞(yòng)戶如(rú)果想更正錯(cuò)¥>↓•誤就(jiù)必須關閉這(zhè)個(gè)彈× $出框，這(zhè)樣那(nà)些(xiē)錯(cu'≠ò)誤信息就(jiù)看(kàn)不(bù)到(dào)了(le)。在一(yī≤)些(xiē)特殊情況下(xià)錯(cuò)誤信息比較冗長(chán¶γg)，你(nǐ)沒有(yǒu)辦法短(duǎn)時(shí)間(jiān)φ≥內(nèi)記住，那(nà)麽就(jiù)無法完成修改了(leλ®δ)。
2.頁面
此外(wài)，錯(cuò)誤提示還(hái)可(kě)以通(tōn←↑₹→g)過載入一(yī)個(gè)新的(de)頁面來(lái)報(bào)告給用(yòng)戶。比如(rú)在你(nǐ)點擊提交按鈕•$以後進入下(xià)一(yī)個(gè)頁ε£面才知(zhī)道(dào)自(zì)己剛才的(de)輸入發生(shλēng)了(le)錯(cuò)誤。用(y₽Ωòng)戶可(kě)以通(tōng)過閱讀(dú)提示知(zhī)道(d•∞ ào)如(rú)何更正問(wèn)題，但(dàn)π₹→是(shì)如(rú)果想更正這(zhè)個€↓Ω(gè)問(wèn)題就(jiù)要(yào)點擊後退按鈕¥φ¥，這(zhè)樣錯(cuò)誤提示又(yòu)不(§€÷bù)存在了(le)，這(zhè)點和(hé)彈出框很(hěn)像。下(xi≥₹à)面這(zhè)個(gè)例子(zǐ)比較典型，用(yòng)戶隻知(" ∏zhī)道(dào)沒有(yǒu)綁定成功，但(dàn)是(s©δ∑γhì)不(bù)知(zhī)道(dào)具體(tǐ)的(de)失敗原因，α<↑重新綁定也(yě)無法避免再次失敗。
3.标簽提示
現(xiàn)在還(hái)有(yǒu)很φ (hěn)多(duō)設計(jì)師(shī)開(kāi)始将錯("∑÷cuò)誤提示做(zuò)成文(wén)字标簽形式，将其'$♣φ和(hé)控件(jiàn)放(fàng)在一(yī)起。&'±這(zhè)樣子(zǐ)用(yòng)戶就(jiù)可(kě)以很(©₹hěn)容易的(de)讀(dú)取錯(cuò)誤信息，一(yī)眼就(j®∞λ→iù)能(néng)看(kàn)出來(láiφ✘ )哪裡(lǐ)出錯(cuò)了(le)，不(bù)用(yòn★∏§g)根據提示的(de)控件(jiàn)名£ 稱去(qù)尋找出錯(cuò)的(de)位置，因為(wèi)錯(cε♥uò)誤提示就(jiù)在發生(shēng<∞)錯(cuò)誤控件(jiàn)的(de)旁邊♦ 。此外(wài)還(hái)很(hěn)容易改正，因為(w☆£≤èi)用(yòng)戶不(bù)用(yòng)再跳(tiào)轉頁面或§ ₽去(qù)記那(nà)些(xiē)冗長(cháng)的(de)錯(c✘&©uò)誤信息。
錯(cuò)誤提示設計(jì)原則1.合理(lǐ)的(de)使用(yòng)配色和(hé)圖标
就(jiù)像我在上(shàng)面說(shuō)的(de)，錯(cuò)誤提™™≤€示的(de)個(gè)功能(néng)就(jiù)是(shì)≈©§↑向用(yòng)戶報(bào)告當前的(de)錯(cuò)誤狀态♥'。但(dàn)是(shì)我們沒有(yǒu)必 ↑ 要(yào)真正的(de)給用(yòng)×φ戶顯示：“尊敬的(de)用(yòng)戶•®☆，你(nǐ)剛才的(de)個(gè)人(r∑&≈€én)信息填寫錯(cuò)誤balabala…”。>♠'錯(cuò)誤狀态我們可(kě)以直接通(tōng)&←過顔色和(hé)圖标來(lái)完成。因為(wèi)在潛意識中，人(ré↓σΩn)們習(xí)慣性把紅(hóng)色和(↔≠hé)錯(cuò)誤聯系在一(yī)起。當然考慮到(dào)現(xi>↕↔àn)實生(shēng)活中還(hái)有(yǒu≤₹)相(xiàng)當多(duō)的(de)用(γ>yòng)戶是(shì)紅(hóng)綠(lǜ)δΩ∏色盲患者，因此我們知(zhī)名是(shì)紅¶★✘'(hóng)色和(hé)圖标搭配使用(yòng)。
2.文(wén)字簡潔易懂(dǒng)
提示文(wén)字應該盡可(kě)能(néng)的(de)簡短£σπ(duǎn)，用(yòng)戶看(kàn)到(dφào)一(yī)大(dà)段文(wén)字，就(jγδαiù)很(hěn)可(kě)能(néng)會(huì)失去(q&♠Ωδù)了(le)去(qù)閱讀(dú)的(de)耐"♦心。此外(wài)我們應該避免使用(yòng)術(shù)語♥$，讓用(yòng)戶可(kě)以更好(hǎo)的(de)理(lǐ)解。♥σ↑β例如(rú)你(nǐ)填寫身(shēn)份證号，多(duō)™¥填了(le)一(yī)個(gè)數(shù)字，那♣♠↓(nà)麽我們就(jiù)應該提示用(yòng)戶「身(sΩ±hēn)份證号位數(shù)出現(xiàn)錯(cuò)誤」而不(bù)是(s♣✔§hì)簡單的(de)「身(shēn)份證号驗證錯(cuò)誤」。因為(wèi)$≤驗證錯(cuò)誤的(de)種類有(yǒu)很(h$αěn)多(duō)種，這(zhè)樣籠統的(de)≈'$λ錯(cuò)誤提示會(huì)增加用(yò¶₩ng)戶的(de)操作(zuò)負擔。
避免用(yòng)戶犯錯(cuò)
對(duì)于這(zhè)個(gè)信息錄入這(zhè)個(gè)λ$≤操作(zuò)來(lái)說(shuō)，知(zhī)名的(d↔↓&αe)用(yòng)戶體(tǐ)驗就(jiù)是(shì)避免用(yòngσσ¥₽)戶犯錯(cuò)，而不(bù)是(shΩ>∑ ì)等到(dào)用(yòng)戶犯錯(cuò∏¶÷)了(le)以後才思考怎麽樣“亡羊補牢”。設計(jì)師(shī)應該σ ®防患于未然。
1.輸入提醒
我們可(kě)以用(yòng)一(yī)句話(huà)或者一(y&♦αī)個(gè)例子(zǐ)來(lái)向用(yòng)戶介紹"'要(yào)輸入什(shén)麽樣的(de)信息，這(zhè)個(≠♣gè)就(jiù)是(shì)輸入提醒。我們要(yào)保持提醒字體™∞♥(tǐ)比較小(xiǎo)或者配色要(yào)比标簽字體(tǐ)™→更淺，因為(wèi)輸入提醒隻是(shì)起到(dào)一(yī)個(gè×★ )輔助輸入的(de)作(zuò)用(yòng)γα¥，過于顯眼反而會(huì)分(fēn)散用(y₩>¶¥òng)戶注意力。
2.良好(hǎo)的(de)默認值
如(rú)果你(nǐ)确定對(duì)用(yòng)戶足夠的(de)了(le)ε₽解，在用(yòng)戶進行(xíng)信息錄入的(de)時(shí&π↕)候我們可(kě)以提供合理(lǐ)的(de)默認值。因為(wèi∑₹)對(duì)于用(yòng)戶來(lái)說(shuō)，™" 填寫信息永遠(yuǎn)都(dōu)不(bù)是(shì)一(yī)'←☆÷件(jiàn)有(yǒu)趣的(de)事(s✔ ©₹hì)情，合理(lǐ)的(de)默認值可(kě)以節省用(yòn∏¶g)戶的(de)操作(zuò)時(shí)間(jiān)。
3.自(zì)動完成
當用(yòng)戶在文(wén)本框裡(lǐ)輸入時(shíε✘×≈)，系統猜測可(kě)能(néng)的(de)答(dá)案，顯示可(kě™♣↕)選列表。自(zì)動完成可(kě)以為(wèi)用(yòng)戶節省時(sh♥★í)間(jiān)、精力和(hé)記憶成本α★≈，避免犯錯(cuò)。
總結
合理(lǐ)的(de)錯(cuò)誤提示設計(jì)可(kě§∏∏)以很(hěn)好(hǎo)的(de)提升産品的(de)用(π¥yòng)戶體(tǐ)驗，建立用(yòng)戶與産品之≤≠間(jiān)的(de)紐帶。以上(shàng)是(shì£∑ε€)網站(zhàn)建設三好(hǎo)網絡對(duì)'✘錯(cuò)誤提示設計(jì)的(de)一(yī)些(xiē)總結，希望各位≠∞看(kàn)了(le)以後能(néng)夠有(yǒu)所收獲。
咨詢