Xanga的注冊頁面只需要用戶填寫用戶名(登錄名)、密碼
電子郵件地址、驗證碼和生日。所有項目整齊排列在一個區(qū)塊中。
這個初始表格非常緊湊能夠一眼就可以把所有的信息瀏覽完畢。



2. 整合初始注冊
整合初始注冊頁面包含所有創(chuàng)建一個用戶檔案的所有重要信息。通常在完成后用戶會被跳轉(zhuǎn)到他們的首頁,在那里會有新手引導(dǎo)。
用于…
- 使用戶快速進(jìn)入網(wǎng)站(產(chǎn)品)的核心功能體驗。
- 幫助已經(jīng)決定要使用你的網(wǎng)站(產(chǎn)品)的用戶快速上手。
- 立刻為用戶提供定制信息
補(bǔ)充
- 沒有告知用戶教會得到什么回報的情況下索取過多的信息,會打擊用戶的信心與耐心,甚至?xí)衼碣|(zhì)疑
- 過長的初始表單增加了用戶的投入從而會給用戶最初進(jìn)入你的產(chǎn)品帶來障礙
設(shè)計原則…
- ?告知用戶為什么你要問索取用戶信息的原因(他們?yōu)榇耍ò褌€人信息告訴你)能得到什么?)。
- 如果某個問題在后期可以(或不可以)再次被修改,應(yīng)該給予暗示,從而減少選擇(例如,在填寫昵稱的旁邊標(biāo)注“您可以隨時修改此項”)。
- 明確的表示出哪些項目是必填的,那些是暫時可以跳過的。
- 內(nèi)容區(qū)塊劃分,可能的話將必填項和可選項分開。

Linked In 為了能很快的幫助用戶建立“聯(lián)系網(wǎng)”,在注冊頁設(shè)置了很多
項,但是設(shè)計整齊干凈。可選項被清晰地標(biāo)識出來。由于這些信息的
目的不言而喻,因此也沒有必要做過多的說明。

3.設(shè)置向?qū)?/h2>
向?qū)в脕碇敢脩敉瓿稍O(shè)置,通常是三步式,且每一步是一個任務(wù)。
用于…
- 避免用戶喪失信心、無從下手。
- 使用戶的注意力集中在一個任務(wù)上。
- 與用戶溝通每一步的目的和價值。
- 為每一步配備充分的資源。像上傳照片到帳戶的操作肯能需要更多的空間。
補(bǔ)充
- 保持設(shè)計的簡潔,因此用多個頁面問簡單、低效的問題,也許不如用一個步驟明確的表格來做會有效得多。
設(shè)計原則…
- 使用進(jìn)度條或任務(wù)清單來告知用戶當(dāng)下的狀態(tài):他們現(xiàn)在所處的步驟和他們將要做的。
- 告知用戶哪些步驟可跳過并給予入口。
- 如果整個設(shè)置過程或操作設(shè)置是可選的,用一個可取消的浮層呈現(xiàn)。
- 整個過程使用統(tǒng)一(固定)的視覺呈現(xiàn)形式,包括標(biāo)題、設(shè)置步驟、排版。每一步的滾動輪換形式也應(yīng)當(dāng)統(tǒng)一。

雖然ShareThis的設(shè)置頁面提供相當(dāng)豐富的的選項,但其視覺呈現(xiàn)十分
簡潔整體。進(jìn)入賬戶信息作為最后一步能夠一直抓住用戶的注意力。

(可忽略步驟舉例)




4.輸入項注釋與錯誤提示
當(dāng)每項輸入項得熱焦點的時,顯示該項的信息,并在失去焦點的時候進(jìn)行驗證(不要再用戶點擊完成按鈕的時候在做這些事)。
用于…
- 提供能夠被使用的內(nèi)容的幫助信息。
- 詳細(xì)的解釋可以說明每一個必要的信息的原因
- 提示進(jìn)程
- 避免用戶遭遇輸入不符規(guī)定的信息造成的錯誤而帶來的挫敗感,以及面對錯誤信息、重新輸入密碼、驗證碼和修改錯誤信息的沮喪。
補(bǔ)充
- 在用戶填寫完整個頁面之前,某些錯誤提示(例如,未填寫的空白、分段輸入的生日信息)也許沒有意義。
- 多數(shù)情況下,在完成最后一項的時候,用戶不會自覺地將焦點移開(從而激活驗證)
- 頁面錯誤驗證作為條目錯誤驗證的補(bǔ)充,而不能被替代。
設(shè)計原則…
- 當(dāng)一個輸入項得到焦點,立即在預(yù)留的區(qū)域顯示提示信息。當(dāng)失焦的時候,顯示確認(rèn)信息,提示這條信息的是正確或者是錯誤。
- 用極具區(qū)分度與辨識性的圖標(biāo)代表不同的信息類型:解釋、確認(rèn)正確、錯誤。
- 當(dāng)用戶完成整個頁面并點擊完成按鈕后,驗證整個頁面,并在表單的上部顯示信息,指引用戶到每一個仍存在錯誤的項目。

Digg的輸入項說明、正確提示和錯誤提示簡潔、一致、系統(tǒng)。錯誤提示和
解釋信息使用有好、清晰地語言說明。頁面驗證檢查各個區(qū)域的錯誤來補(bǔ)
充輸入項驗證(例如,出生日期的問題)。

(待續(xù)~)
來源:搜狗UED
內(nèi)容很不錯很實用,贊一個。不過,作者很匆忙么,打字手誤好多好多貫穿始終啊,連開頭引用的那句都打錯了呀。
說的很棒,學(xué)習(xí)很多!