論WEB網站注冊表單的人性化設計策略

　　【摘要】WEB網站注冊過程中，繁瑣的注冊步驟往往令很多用戶望而卻步。在崇尚快節奏的網絡時代，注冊系統是WEB產品給用戶的第一印象，如何在這一環節贏得更多的用戶顯得尤為重要。本文以音悅臺和新浪微博為例，從減少表單項目、簡化注冊步驟、人性化提示語言、注重可視性、及時友好的反饋等五個方面論述如何設計一款優秀的注冊系統，以期對網站設計工作有所助益。
　　【關鍵詞】注冊系統 人性化設計 新浪微博
　　
　　網站和論壇的注冊環節往往令用戶頭疼，當網站彈出注冊頁面并指出只有登錄才能獲取信息時，許多人寧可放棄獲取該資源信息也不愿去花時間填寫繁瑣的注冊表單，由此可知注冊這一要求對用戶的負面影響不可小視。
　　而以高清MV為主打的“音悅臺”網站巧妙地化解了這一困擾，它的注冊環節充滿人情味，親和且口語化的提示語輕松愉悅地帶領用戶完成了一系列注冊流程。整個過程十分舒服，像與好友聊天，還沒聊夠的時候他已經告訴你：注冊成功了。注冊系統是WEB產品給用戶的第一印象，滿意度的高低直接決定了產品的競爭力。在音悅臺較為愉悅的注冊體驗啟發筆者進一步思考，除了友好的提示語言，是否還有更多的優化手段可使令人頭疼的注冊環節更人性化呢？
　　人性化設計是指產品在設計過程當中，根據人的行為習慣、生理結構、心理情況、思維方式等等，在原有設計基本功能和性能的基礎上，對設計進行優化，使用戶使用起來方便、舒適。本文將以音悅臺和新浪微博為例，論述如何設計一款優秀的注冊系統。
　　
　　一、減少表單項目，簡化任務結構
　　
　　過多的表單項目或過多無用信息會給用戶帶來更多的思考與厭惡，從用戶的角度來講，不管網站方面多么在乎用戶的資料，事實上用戶只想盡快得到身份，這之前的一切工作都在不同程度地消磨用戶的耐心和意志，所以這個過程越短越好。
　　 有些網站甚至只需要填寫一個密碼即可注冊，在第一次登陸之后才需要填寫一個用戶名。這樣做的好處是避免過多的非必要填寫信息嚇退怕麻煩的新用戶，不要讓用戶覺得注冊這樣一個網站是困難的，因此一屏范圍內保持3-6個控件即可。以音悅臺為例，每一步需要填寫的表單嚴格控制在3個以內，并以清晰的紅藍綠三色區分，一目了然。
　　然而同清晰明確的第一步基本信息填寫相比，音悅臺的第二步注冊信息填寫項目就顯得有些多余了，這一步專門用來填寫用戶的性別及出生日期。拋開一個以MV為主打的音樂網站是否確實需要此類信息不談，即使網站的確需要這兩類數據了解用戶的構成，此類非必須的項目大可放在注冊完成后。可以考慮進一步簡化步驟，只需要注冊名、密碼即可完成注冊。之后的一些個人信息完善可以通過做任務的方式完成，任務完成獲得積分，而積分是用戶下一步完成某項期望的必備條件——如此，一步一步被引領著完成開發方的期待行為。
　　
　　二、簡化注冊步驟，引導用戶快速完成目標
　　
　　一頁式的注冊表單令用戶一次性接受大量信息，難免無從下手，按照don’t make me think的原則，針對這一情況可將注冊信息分為2-3步，讓用戶一次只做一件事，并在頁面最上方顯示進度條，這樣做的好處一是體現流程的概念，給用戶按照流程操作的心理暗示；二是通過清楚的進度條給予用戶完成行為的信心，對最后一步的完成產生期待。
　　然而如何設計流程呢？諾曼在《設計心理學》中將行動結構劃分為目標、執行與評估三階段，同時將執行與評估細分，最后確定為以下七個階段：確定目標、確定意圖、明確行動內容、執行、感知外部世界狀況、解釋外部世界狀況和評估行動結果。我們在設計注冊表單的步驟時，這一理論值得參考。首先，在執行步驟之前明確目標；其次，設計明確的步驟和流程進度條，在進度條上方標注行動內容；最后，在每一步完成后提供反饋以及最終反饋。音悅臺的注冊系統分為三步，其中第三步又分為三小項，并在第三步伊始提供了本步驟的進度條。
　　
　　三、人性化的提示語言
　　
　　做網站如同開飯館，攬客的第一步總是要以熱情洋溢的笑臉和引人眼球的店面將客戶攬進門，再由引導員快速準確地將客人引領到自己的座位。所以通常來講，一個用戶到了某個網站的門口，剛想要踏進門就遭遇一張令人不耐煩的表單，這顯然是不友好的。
　　在第一時間博取用戶好感方面，音悅臺的做法巧妙且到位，它懂得運用親和的提示語言安撫用戶的焦躁情緒，注冊伊始就以一句話制勝——我們也覺得注冊麻煩透了。
　　在填寫基本注冊信息時，網站一上來就用大號字表了態：“我們也覺得注冊麻煩透了！”簡單的一句話讓用戶覺得一下子找到了知音，對立和抵觸的情緒立馬消失大半，覺得開發方與我站在了一邊。當然提示語并未就此結束，后半部分用小字解釋了注冊的好處“但經過注冊，我們會更了解您的喜好，為您推薦更酷的MV，同時，好音樂帶來的喜悅，才能夠與朋友分享。”——清晰地告訴用戶你能獲得的利益。此時已經放松警惕的用戶轉念一想，有理，再看下面的注冊表單，似乎也十分簡潔，只有紅藍綠三個明確簡潔的填寫框，看起來并不麻煩，括號里的填寫要求也表述的很口語化，易于接受。
　　同時在第四步—選擇喜愛的藝人—中，適當的提示語再次出現“麻煩告訴我們，下面是否有你鐘愛的藝人，不然就太難向你推薦你中意的精彩音樂了”，通過左右滑屏平鋪展示可選擇的藝人，同時提供了搜索框，與一般網站的“search”提示不同，音悅臺再次使用了口語化的提示：“下面沒有？直接找找看”。
　　在注冊表單設計中，提示文案要在準確易懂的前提下不失親和力，避免出現語氣強硬的祈使詞匯，如：必須、決不能、請勿……，多采輕松的、帶有鼓勵性的文案，引導用戶完成流程。
　　但值得注意的是，提示語言不應濫用。“適當使用限制因素——即限制用戶的選擇范圍——是使物品易用并不易造成人為失誤的良好途徑，否則應附加警告和提示信息，但無疑這只適用于糟糕的設計，也就是說，提示語言是最后的辦法，是沒有辦法的辦法。”①同理注冊表單的每一項后面跟加提示語言也是不明智的，因為這樣做的結果是無形中增加了用戶的信息處理負擔，所以音悅臺注冊的步驟中隨處可見的提示語言雖然友好，但未免啰嗦有余。更好的做法是從根本上減少限制因素，如取消大小寫限制和密碼位數限制。
　　
　　四、注重可視性
　　
　　可視性即“正確的操作部位必須顯而易見，并且向用戶傳達出正確的信息”。②優秀的表單設計應通過突出的可視性向用戶傳達正確的、一目了然的可行操作信息，從而減少用戶因誤操作產生的悲觀情緒。
　　在可視性方面，WEB注冊表單的應用由來已久，這就意味著大部分用戶在執行注冊操作時，心中已經存在一個既定模式，所以設計時應充分尊重用戶心中的既定期望，不應有過大顛覆，而是通過調整細節提高整體的可視性。例如，作為注冊表單中的重要組成部分，文本框的視覺設計和交互設計不可忽視。是否需要輔助輸入？采用滑塊還是下拉列表？獲得焦點時是全選顯示還是插入光標？新浪微博在注冊文本框的設計上有可取之處，用戶輸入第一個字母的時候，系統已經將可能的郵箱直接推薦過來，非常方便，省去了輸入@時shift+2的操作成本，同時大大降低因錯誤輸入導致的無效反饋，對系統的底層后臺無疑也是件幸事。
　　五、及時友好的反饋
　　“在web上，單擊鏈接、提交表單或者按下按鈕時，你并不知道會發生什么。要有設計者為每一個動作設定相應的期望，并清楚顯示這些動作的結果。”③精致的產品可通過及時的操作成功與否反饋和親切的welcome頁面極大提升用戶體驗。
　　用戶在填寫表單的過程中，系統應在每一步驟進行及時反饋，新浪微博在每一步的注冊項目后添加了及時反饋，信息填寫正確后會顯示一個綠色對勾，而填寫錯誤時則用紅色字體進行相關操作提示。
　　同時，反饋還應做到提醒用戶正處在過程的哪個階段，“有時用戶必須等待一個過程的完成，而這可能耗費一些時間。為了讓用戶知道并不是由于他們的計算機運行太慢才造成這種等待，你可以顯示一條信息，告訴他們目前的狀況。”④這方面新浪微博的設計做得不到位，在注冊體驗中，當用戶點擊“立即注冊”時，整個系統在很長一段時間內沒有反應，同時未提供任何反饋。在這里可以考慮使用加載動畫和顯示一些友好的狀態消息來緩解用戶因等待而造成的焦慮。
　　除以上五個方面的設計原則外，一些細節問題的處理得當可輕松提升用戶體驗，如允許用戶用注冊名、郵箱、手機等多種方式進行注冊；取消密碼的重復確認輸入，因為大部分用戶是在反復使用自己熟知并熟練輸入的密碼串；避免向用戶發送確認電子郵件，激活注冊很大程度上消耗操作成本和用戶的耐心，至少可以先讓用戶玩玩你的Web應用程序或瀏覽一下你的網站，當用戶感興趣瀏覽更多信息時，再來讓他們確認郵件；驗證碼的的識別性無法保證，是否可以采取其他方式比如算術題、問答，音悅臺的注冊則干脆取消了這一項；當用戶填寫發生錯誤時，系統要求用戶返回重填時連填寫正確的信息都清空了，為了避免此類情況給用戶造成的悲觀情緒，需要考慮保護性措施，將上一步填寫自動保存，并避免在點擊確定后跳轉至某一頁面后再顯示錯誤提示，應在發生錯誤時在當前項目后即時反饋。
　　網站注冊這樣的小問題聽起來微不足道，但卻足以影響用戶的心情和產品的友好度，要做到真正“以用戶為中心的設計”，注冊環節需要得到改進以進一步優化用戶體驗，以在“小”中體現更偉大的關懷。
　　
　　參考文獻
　　①②唐納德.A.諾曼：《設計心理學》，中信出版社
　　③④[美]Christina Wodtke：《錦繡藍圖》，人民郵電出版社
　　（作者：首都師范大學美術學院新媒體藝術設計系本科生）
　　責編：周蕾