起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識基礎組件之一：登錄注冊組件，基礎但必不可少
不論客戶端是PC端還是移動端，不管系統業務涉及政務、電商還是教育，登錄注冊都是系統不可少的組件。當然，對外宣傳門戶、信息品牌網站除外（信息型產品，較少涉及個人業務需要登錄驗證）。本文筆者將為大家講述：To B產品的登陸注冊組件的內容形式、元素設計。
組件意義
登錄注冊組件，幾乎是每個系統的必備組件。而這組件有什么意義？將從用戶、平臺兩個角度來分析。
用戶：
- 授權給予信任，在用戶登錄到平臺的動作時，相當于將自己身份信息授權于平臺使用，是對平臺一種信任的體現。
- 產出工作內容，部分業務系統（如政務審批系統、電商管理平臺等）是將部分工作線上化，產出個人相關工作內容與結果（如審批意見、物品管理清單等），又或用戶產品UGC內容。
- 建立個人品牌，登錄即是對個人身份的映射，登錄后用戶的角色、身份、信息、創造的內容即可建立個人品牌。
- ……
平臺：
- 驗證用戶身份，平臺業務往往涉及用戶隱私、涉密等不便對外公開的內容，此時便需通過登錄對訪問用戶進行身份驗證。
- 獲取用戶信息，在用戶授權后，平臺可獲取用戶身份信息，運用在業務系統上。
- 個性化推薦，在用戶授權登錄后，可對用戶進行標簽化，針對用戶喜好、身份進行個性化推薦。
- …….
組件內容
登錄注冊組件的內容形式有好幾種，這里只列舉 toB 常見幾種方式：
1. 賬號+密碼
“賬號+密碼”方式是最常見的登錄方式，其中，賬號也包括好幾種形式：
- 用戶名：每個用戶都有自身唯一標識的用戶編碼與用戶名（一般由英文或英文+數字組成），這也是后臺系統常見的方式。
- 手機號碼：考慮方便消息通知、召回用戶等運營手段，很多系統使用手機號碼來進行注冊新用戶。
- 郵箱號：如上，考慮方便消息通知、召回用戶等運營手段，部分系統使用郵箱來進行注冊新用戶；又或企業內部可采用企業郵箱方式做通訊工作。
- 業務身份碼：部分系統的用戶擁有著自身唯一的業務碼，如企業用戶的社會統一信用代碼、公民的身份證號碼、執法人員的執法證件號碼。
2. CA?認證
部分系統對信息安全性、涉密性要求較高（如政務領域），則可采取 CA 電子認證服務，通過驗證數字證書信息來實現驗證用戶身份，從而進行登錄。
3. 人臉識別、指紋認真
部分系統有用戶人臉信息庫、指紋信息庫，采取人臉識別、指紋認證等智能登錄方式。
組件設計
登錄注冊組件的設計，可因業務不同、需求不同，而選取不同設計方式、內容。
這里列舉幾種常見的相關設計：（注：并非每個登錄注冊組件都要包含所有設計，看場景看需求）
1. 驗證碼
驗證碼是驗證當前操作是人為還是機器行為的方式。登錄注冊組件上，防止對密碼進行暴力破解。
表現形式：有幾種，“數字、字母、中文的組合”、圖片辨別、滑塊、手機短信、手機語音等形式。
2. 忘記密碼
忘記密碼是為丟失或忘記密碼的用戶提供找回密碼的方式。一般流程是 “驗證身份 – 設置新密碼” 。
驗證身份的方式有幾種，常見有：手機驗證碼、郵箱驗證、安全問題驗證、人工客服找回或重置。
不同場景需求，選擇的驗證身份方式會不同。需注意，研究表明近80%的用戶有忘記密碼的經理，故密碼重置是個常見需求，需多關注用戶體驗。
3. 密碼明暗文
密碼明暗文，是指登錄注冊組件中隱藏 / 顯示密碼。
為滿足高安全性，系統會在用戶注冊時，要求用戶設置的密碼強度較高，密碼組成要求的復雜度也高。
該場景下，密碼明文可方便用戶在設置密碼時輸入不符時，一眼定位問題。而在用戶登錄時，不論是手動輸入密碼，或自動記住密碼，密碼暗文都可從保密性、隱私性給用戶良好的體驗。
4. 結果反饋
登錄注冊組件的流程不復雜，但清晰的操作結果反饋，可以讓用戶體驗更好。
5. 賬號綁定設備
在安全性要求高的系統上，移動端的登錄注冊設計組件上，可設計賬號綁定設備的方式，限制用戶賬號在多臺設備上登錄。實現方式可通過用戶在第一次登錄時綁定設備號，往后登錄都校驗設備號是否符合。變更設備可申請管理平臺取消綁定。
6. 記住密碼
記住密碼是在用戶登錄后將用戶賬號密碼信息存儲，方便下次登錄時免輸入。部分系統設計是會將記住密碼與自動登錄并在一起，而下次登錄時直接實現自動登錄。但該設計在安全性要求高的系統上，需要再考慮。
7. 清空賬號信息
清空賬號信息是用戶抹去該設備記錄的賬號密碼信息。該設計需在有記住密碼設計的前提下。但在 toB 的產品系統上，考慮安全性設計上，也考慮業務用戶只持有一個賬號的設計上，該設計使用場景很少。
組件體驗細節
良好的細節，更好的體驗。在此記錄一些組件體驗細節注意點：
1. 要求提示清晰
登錄注冊組件中，尤其在注冊環節，用戶需按規定填寫個人信息。填寫信息越多，用戶耐心越低，信息填寫規則、格式要求更要清晰到位。
盡量避免用戶不知情況下，屢次出錯而被要求多次重錄，挑戰用戶耐心。如：標明信息必填項、提示密碼規則、顯示密碼強度、注冊流程提示（注冊環節復雜的設計）
而若有條件限制，也在相應位置需要標明清楚條件。如：錯誤密碼5次鎖住設備、限制一天只可輸錯5次密碼。
2. 要求操作結果及時反饋
部分輸入框可考慮實時數據校驗反饋，移動端可通過定制鍵盤類型來規避部分問題出現。如：賬號形式是手機號碼，PC端可實時校驗是否符合手機號碼格式，移動端可定制該輸入框的鍵盤為數字鍵盤。
操作結果反饋清晰，成功失敗的視覺效果區別明顯，文字描述要簡潔易懂。信息項多時，問題點鮮明標出，光標定位于問題處，方便迅速定位。
根據信息項類型，提供便捷操作。如：賬號為郵箱格式，可提供自動補全郵箱后綴。
3. 搭配清空輸入框按鈕
搭配清空按鈕，在輸入框有內容時顯示，方便一鍵清空輸入框。
4. 信息顯示格式
信息項可根據需要找到適合的顯示格式。如：賬號為手機號碼，則輸入框可采用用戶熟悉的 334 格式。密碼則根據場景定初始化為明暗文，附上切換按鈕。
5. 品牌宣傳
登錄注冊組件，業務清晰，內容元素簡單，可在背景圖上做品牌宣傳。
總結
登錄注冊組件，是個基礎組件。在 toB、toC的不同產品上，內容形式、元素設計上會有所不同。好比 toC 產品上會有第三方賬號注冊登錄的方式，而 toB 則有 ca 數字證書認證方式。本文是個人在 toB 上的總結，故暫未考慮 toC 方面。
toB 部分產品中，用戶賬號來源于用戶管理，由管理員在管理平臺上初始化賬號并分配角色、權限。部分業務復雜龐大的系統，還會涉及統一用戶、統一認證等。等晚些有時間一并梳理，故本文雖說登錄注冊組件，但涉及登錄的內容篇幅較大。
個人經驗輸出，若有建議或問題，歡迎提出，謝謝。
本文由 @Cherie 原創發布于人人都是產品經理。未經許可，禁止轉載
題圖來自 Unsplash，基于 CC0 協議
- 目前還沒評論，等你發揮！
