最近，研究了一下web表單的設(shè)計，收獲頗多。從接觸互聯(lián)網(wǎng)以來，我們就一直在和各種表單打交道，它們無處不在，同時也為我們增添了很多不必要的煩 惱。但隨著時間的推移，大多數(shù)網(wǎng)絡(luò)用戶對很難用卻又千篇一律的表單已經(jīng)產(chǎn)生了一種習(xí)慣，似乎即使體驗過程并不美好，也不會發(fā)出反對聲音，繼續(xù)鉆研。

但是，隨著電子商務(wù)的興起，表單設(shè)計的重要性又上了一個層次，因為很多電商網(wǎng)站已經(jīng)意識到：表單的體驗不好，就可能丟掉已經(jīng)準(zhǔn)備付賬的顧客。

今天體驗了一下qq郵箱的注冊表單，雖然表單本身優(yōu)點甚多，而且界面干凈，但還是從雞蛋里挑出很多骨頭來。

在說問題之前，還是說一下優(yōu)點，雖然這并不那么重要。

• 界面清晰且干凈，基本沒有干擾因素
• 標(biāo)簽采用右對齊，提升完成率
• 擁有答案填寫提示、即時反饋、即時幫助、部分輸入框的即時檢查
• 提供錯誤規(guī)避機制

Ps：其實還有很多優(yōu)點，但是下文更加重要，下圖是整體界面截圖

1. 友好性

雖然這是一個嚴(yán)肅的注冊過程，但是如果能稍微添加一些友好元素會更好。

比如：

控件外觀稍加潤色，不至于從頭到尾的矩形；

增添較淡的冷靜背景色；

提問的方式更換為更加善意且值得信任的語言；

2. 輸入框的長度

輸入框的長度應(yīng)該與答案的長度具有一致性，從而避免疑惑。

用戶疑問：這么長的輸入框，我會不會因為昵稱長度不夠而無法成功注冊？

3. 所問的問題都是必須馬上得到答案嗎？如果不是，delete！

這是很重要的一項檢查標(biāo)準(zhǔn)，用戶來到這個界面，唯一的目的就是快速的成功注冊，那么問題越多，讓用戶產(chǎn)生的疑慮越多，用戶quit的可能性就越大。

用戶疑問：生日？性別？所在地？我到底是不是在注冊郵箱？難道是人口普查頁面？

存在問題：

• 這些問題并非需要馬上得到答案；
• 浪費了用戶的時間；
• 讓用戶產(chǎn)生了疑慮和信任危機；

解決方法

• 把這些問題轉(zhuǎn)移到注冊成功后發(fā)問，且采取更加友好和值得信任的方式；
• 在注冊頁面說明，問這些問題的用意，讓用戶放心；
• 告知用戶此項不是必填的選項

4. 不合理的提示會誤導(dǎo)用戶

用戶疑問：example是什么意思？一定要是2009嗎？（甚至）要這么長嗎？

存在問題：

• 有相當(dāng)部分用戶英文不怎么樣
• 沒有按照用戶的習(xí)慣輸入舉例子，用戶更喜歡用姓名拼音等注冊
• 用戶并不知道字符限制是什么

解決方法：

• 說明輸入的字符種類限制
• 根據(jù)用戶的習(xí)慣提供舉例，如wangwei1987

5. 并不完善的檢查機制

在檢查機制中非常重要的兩點：

1. 及時提醒用戶系統(tǒng)無法接納當(dāng)前輸入（注意要等待用戶完成該項之后）
2. 提供建議的解決方法

用戶疑問：被注冊了？那其他名字我可能記不住��？怎么辦？

解決方法：提供建議“您可以試一下wolfwang1234，還沒人注冊哦！”

同樣問題：告訴用戶什么才算密碼強度高。

6. 默認選項很有必要，你確定是用戶想要的嗎？

優(yōu)秀的默認選項可以極大地提高填表效率，但是注意：

1. 確認默認的選項滿足大多數(shù)用戶的選擇
2. 確保你的默認是準(zhǔn)確的選項
3. 相當(dāng)比例的用戶會接受默認選項，即使有時候它是錯的

存在問題：

• 大概一般的用戶需要更正這個默認選項
• 提供錯誤信息，用戶會以為大多數(shù)男性來此注冊
• 可能造成性別歧視
• 產(chǎn)生信任危機

解決方法：

• 不做默認選擇
• 提醒用戶無須顧慮安全

存在問題：

• 系統(tǒng)默認選擇了第一個選項，這并非準(zhǔn)確
• 用戶不去修改，則誤導(dǎo)了系統(tǒng)統(tǒng)計信息

解決方法：

• 使用更強大的技術(shù)，確認用戶具體所在區(qū)
• 不做默認選擇

7. 選用合適的輸入框

存在問題：年和日的選項，選擇過程更加費事

解決方法：參照google表單設(shè)計

8. 采用更加直接的語言

用戶疑問：��？難道后面還有其他注冊步驟嗎？

• 提供用詞的一致性
• 告知用戶所處位置：我確實在注冊

解決方法：

• 將“確定”改為“注冊”

9. 不要把“注冊”按鈕默認選中，除非我已經(jīng)注冊完了

存在問題：輸入過程中，回車鍵會處罰“提交按鈕”

• 用戶每填寫完成一項，經(jīng)常會按回車
• 填寫完成之前，系統(tǒng)并不希望用戶點擊“提交”

解決方法：去掉這一關(guān)聯(lián)，“回車”不等于“提交”

10. 一次性檢驗出所有錯誤

存在問題：如果有三個錯誤，用戶點擊提交，只會顯示第一個錯誤，用戶修改完成之后，再次提交才會檢查出第二個錯誤。

解決方法：一次性檢查出所有錯誤。

ok，很有成就感，更重要的是，我的交互設(shè)計之路更上一層樓了，希望與同行交流，得大家的指正！

作者：書生wilson

文章來源：flyalone.net

標(biāo)簽： 表單設(shè)計 注冊流程 交互設(shè)計 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。