一、提示過(guò)早

你有沒(méi)有遇到過(guò)這種“勸退級(jí)”的表單體驗(yàn)？頁(yè)面剛加載完，你還沒(méi)來(lái)得及輸入半個(gè)字，一串紅色錯(cuò)誤提示就像警報(bào)器一樣跳出來(lái)：此字段為必填！、請(qǐng)輸入有效內(nèi)容！、格式錯(cuò)誤！

這種設(shè)計(jì)讓用戶(hù)在還未開(kāi)始操作時(shí)就收到錯(cuò)誤提示，容易產(chǎn)生心理錯(cuò)覺(jué)，覺(jué)得被質(zhì)疑，進(jìn)而將問(wèn)題歸因于系統(tǒng)設(shè)計(jì)不合理，產(chǎn)生挫敗、焦慮甚至抗拒情緒。如某銀行開(kāi)戶(hù)表單，頁(yè)面剛加載就顯示所有必填項(xiàng)的紅色錯(cuò)誤提示，導(dǎo)致用戶(hù)首屏退出率高達(dá) 38%，平均停留時(shí)間不到 7 秒。

正確的做法是初始狀態(tài)不顯示任何錯(cuò)誤，只有用戶(hù)點(diǎn)擊字段或開(kāi)始輸入后，根據(jù)操作節(jié)奏觸發(fā)反饋，并采用溫和引導(dǎo)型的提示文案。

二、提示延遲滯后

用戶(hù)根據(jù)提示修改錯(cuò)誤后，系統(tǒng)若不及時(shí)取消錯(cuò)誤提示，會(huì)給用戶(hù)帶來(lái)焦慮和困惑，讓用戶(hù)懷疑自己是否理解錯(cuò)了規(guī)則或遺漏了其他問(wèn)題。如某 App 注冊(cè)流程中，用戶(hù)修正郵箱格式后，紅色提示仍不消失，導(dǎo)致用戶(hù)反復(fù)修改，操作時(shí)長(zhǎng)遠(yuǎn)超平均。

這時(shí)候的用戶(hù)內(nèi)心戲是這樣的：“我剛剛不是按你說(shuō)的改了嘛？怎么還錯(cuò)？又錯(cuò)哪兒了？你倒是說(shuō)句話??！”、“難道我理解錯(cuò)了？那我再刪掉重輸一次？”、“還是我漏了別的規(guī)則？”

系統(tǒng)什么都不說(shuō)，用戶(hù)腦內(nèi)的問(wèn)號(hào)卻一串接一串。這就是典型的——滯后反饋問(wèn)題。

你可以想象成這樣一個(gè)場(chǎng)景：你考試寫(xiě)完一道題，滿(mǎn)懷期待地看著老師，結(jié)果老師眉頭一皺，站你旁邊沉默半天。你問(wèn)她：“我寫(xiě)對(duì)了嗎？”老師不回答，只是繼續(xù)皺眉。你心里瞬間就慌了，開(kāi)始懷疑人生。系統(tǒng)如果不給用戶(hù)明確反饋，用戶(hù)就會(huì)陷入類(lèi)似的“反饋真空區(qū)”——不是不知道怎么做，而是不知道做得對(duì)不對(duì)，這時(shí)候的焦慮，比犯錯(cuò)還難受。而且，這不是技術(shù)問(wèn)題，這是信任問(wèn)題 + 心理負(fù)擔(dān)：你不給確認(rèn)，他們就不敢繼續(xù)；你不清除紅色提示，他們就以為失敗了。

比如這樣一個(gè)經(jīng)典 bug：一個(gè) App 的注冊(cè)流程中，用戶(hù)輸入郵箱地址，如果格式錯(cuò)誤，會(huì)提示“郵箱格式不正確”；用戶(hù)按規(guī)則補(bǔ)上“@”和域名，明明已經(jīng)對(duì)了，可紅色提示依然紋絲不動(dòng)。更奇怪的是，用戶(hù)再三確認(rèn)沒(méi)問(wèn)題，只好試探性地點(diǎn)擊“提交”按鈕——這個(gè)時(shí)候系統(tǒng)才突然放行：“注冊(cè)成功！”用戶(hù)那一刻的內(nèi)心是這樣的：“哈？早說(shuō)行了我早點(diǎn)提交了……我剛剛白焦慮半天？”

我們后臺(tái)數(shù)據(jù)也反映出異常：很多用戶(hù)在郵箱字段反復(fù)修改 2-3 次，且操作時(shí)長(zhǎng)遠(yuǎn)超平均，說(shuō)明他們不是在填表，是在猜謎！

好的做法是什么？

很簡(jiǎn)單，說(shuō)白了就三個(gè)字：及時(shí)說(shuō)！

1. 用戶(hù)一改正內(nèi)容，就立即取消錯(cuò)誤提示，給出確認(rèn)或安撫性提示，比如：“? 郵箱格式正確”。
2. 如果后臺(tái)要驗(yàn)證（如查重），也要加 loading 狀態(tài)告訴用戶(hù)“正在檢查…”。
3. 改完之后別讓紅字繼續(xù)嚇人，不要讓用戶(hù)以為“系統(tǒng)死機(jī)了”或“我還是錯(cuò)的”。

三、圖標(biāo)過(guò)于警示化：紅色驚嘆號(hào)泛濫

有些設(shè)計(jì)師在“重視用戶(hù)反饋”這件事上，實(shí)在是太用力了——生怕用戶(hù)沒(méi)看到提示，結(jié)果每一個(gè)小問(wèn)題都要配上一個(gè)紅色感嘆號(hào)，再加粗、放大、加閃爍、配震動(dòng)動(dòng)畫(huà)……好家伙，整得跟要啟動(dòng)警報(bào)似的，下一秒都感覺(jué)頁(yè)面會(huì)“嘟——嘟——”地拉響警笛。至于嗎？

不是每一個(gè)小問(wèn)題都值得用“驚悚語(yǔ)言”來(lái)表達(dá)。如果所有提示都長(zhǎng)一個(gè)樣：一律紅色大字、一律感嘆號(hào)警示、一律動(dòng)畫(huà)特效，用戶(hù)大腦會(huì)迅速進(jìn)入提示疲勞狀態(tài)。他們心里會(huì)想：“你到底是提醒我一下呢，還是覺(jué)得我要把表單炸了？”。這時(shí)候，用戶(hù)反而會(huì)開(kāi)始忽略這些提示，因?yàn)樗麄円呀?jīng)學(xué)會(huì)了：“反正頁(yè)面總是嚇唬我，真錯(cuò)也就那么回事。”

真問(wèn)題 VS 小提醒，要區(qū)別對(duì)待

這其實(shí)是信息層級(jí)設(shè)計(jì)的問(wèn)題。反饋系統(tǒng)就像信號(hào)燈：紅燈、黃燈、綠燈，必須各司其職，別讓路口全亮紅燈，誰(shuí)都不敢走。你得問(wèn)問(wèn)自己：這個(gè)提示到底是：

嚴(yán)重錯(cuò)誤（比如手機(jī)號(hào)格式錯(cuò)、密碼過(guò)于簡(jiǎn)單、身份證無(wú)效）

1. 用紅色提示 + 明確錯(cuò)誤描述
2. 必須阻止用戶(hù)繼續(xù)操作

輕微提醒（比如昵稱(chēng)建議用中英文、圖片大小略超限、上傳進(jìn)度慢）

1. 可用淺色提示、灰色文字、icon 輔助
2. 不一定要阻止，只是建議或預(yù)警

成功確認(rèn)（比如“用戶(hù)名可用”、“格式正確”）

1. 請(qǐng)用綠色文字、勾選 icon，鼓勵(lì)用戶(hù)繼續(xù)

就像導(dǎo)航語(yǔ)音不能一直在你耳邊喊“前方注意、減速慢行、右側(cè)有車(chē)”，該說(shuō)的時(shí)候說(shuō)，說(shuō)多了你就直接關(guān)靜音了。

反饋不是越大聲越好，而是要講場(chǎng)合、分層級(jí)、重分寸。

在設(shè)計(jì)驗(yàn)證提示時(shí)，請(qǐng)記?。翰皇敲總€(gè)問(wèn)題都要敲鑼打鼓，別讓用戶(hù)在填個(gè)表時(shí)，有種“系統(tǒng)在對(duì)我喊話”的感覺(jué)。

表單驗(yàn)證不是審訊室，而是向?qū)А嬲暮迷O(shè)計(jì)，是在你快錯(cuò)時(shí)輕輕拉你一把，在你做對(duì)時(shí)默默給你一個(gè)鼓勵(lì)的眼神，不多不少，剛剛好。

四、不允許提交：“把用戶(hù)困住”的設(shè)計(jì)

最后一種常見(jiàn)的表單驗(yàn)證“坑”，叫做 “強(qiáng)制禁止提交”機(jī)制。就是系統(tǒng)一旦發(fā)現(xiàn)某個(gè)字段沒(méi)填對(duì)，立馬把“提交”按鈕整得灰撲撲的，直接熄火，不許點(diǎn)，不許動(dòng)，整頁(yè)像被凍結(jié)了一樣。最糟糕的是——你也不知道錯(cuò)哪了！沒(méi)有提示、沒(méi)有引導(dǎo)、沒(méi)有標(biāo)注，就一個(gè)灰掉的按鈕擺在那里，像在無(wú)聲地告訴你：“你不配繼續(xù)操作?！?/p>

某知名購(gòu)票平臺(tái)曾有過(guò)一次嚴(yán)重的驗(yàn)證體驗(yàn)翻車(chē)。用戶(hù)填寫(xiě)身份證號(hào)碼，只要少一個(gè)數(shù)字，系統(tǒng)就完全不給下一步的機(jī)會(huì)——“下一步”按鈕直接變灰。問(wèn)題是，頁(yè)面上沒(méi)有任何錯(cuò)誤提示，也沒(méi)有高亮錯(cuò)誤字段，用戶(hù)只能原地懵。

于是，很多人開(kāi)始猜：

1.  “是不是身份證格式錯(cuò)了？”
2. “是不是我輸?shù)锰欤俊?/li>
3.  “是不是這個(gè)網(wǎng)站又出 bug 了？”

糾結(jié)兩分鐘、沒(méi)有任何幫助指引、點(diǎn)不了提交，用戶(hù)的最終選擇通常是：關(guān)掉頁(yè)面，放棄購(gòu)買(mǎi)。這個(gè)“灰掉按鈕 + 沉默頁(yè)面”的組合拳，直接把用戶(hù)“困”死在了驗(yàn)證邏輯里，結(jié)果就是——棄購(gòu)率飆升，用戶(hù)反饋差到爆。

人都是有控制欲和期待反饋的怎么改。如果你什么都不說(shuō)，就直接封路，我只能懷疑自己走進(jìn)了一個(gè)死胡同。這時(shí)候，系統(tǒng)給人的感受，不是“幫助我避免錯(cuò)誤”，而是像在說(shuō)：“你不夠格通過(guò)我的測(cè)試?！睋Q句話說(shuō)，是羞辱感，而不是指導(dǎo)感。

更理想的做法：正確的做法是允許提交但通過(guò)彈窗二次確認(rèn)，或者高亮具體錯(cuò)誤字段并配合簡(jiǎn)潔明確的提示語(yǔ)，或者在按鈕區(qū)域上方直接顯示錯(cuò)誤概況，讓用戶(hù)知道問(wèn)題所在并有途徑修正。

作者：Designlink