最基本的登入-註冊模型
應用的登入註冊是很多使用者接觸應用最先碰到的流程,如果登入註冊體驗沒做好,就給使用者留下了很不好的影響,甚至流失潛在使用者。
整理了現在市面上最常用的登入-註冊的流程,也結合自己的設計習慣希望給大家做一個參考。
除了註冊、登入的主流程,還會涉及到提示資訊的展示、按鈕的互動等。
註冊
一般現在的應用註冊有手機號碼+驗證碼、手機號碼+密碼、郵箱+密碼、使用者名稱+密碼這幾種。
整理了手機號碼+驗證碼、手機號碼+密碼、郵箱+密碼註冊三種方式的流程

image
圖一
註冊流程,儘量簡單,快速比較好。越來越多的應用開始使用手機號+驗證碼的方式一步完成註冊和登入過程。
在校驗資訊的過程中有本地校驗和伺服器校驗兩種判斷資訊是否正確的方式,本地校驗一般是校驗資訊的格式是否正確,伺服器校驗一般校驗輸入資訊和資料庫的對比結果。
我的設計習慣是,本地校驗的提示是這樣做的。

image
圖二
不需要使用者做互動,當輸入資訊的格式正確,提示就消失。
在本地檢驗沒完成時,完成(註冊、登入等)按鈕就呈不可點選態,當本地校驗完成,則呈可點選態。

image
圖三
再點選按鈕,進行伺服器資訊校驗,如果資訊錯誤,則用toast提示(可以自己設計,也可以用系統自帶的)自己設計使用者體驗會好一點

image
圖四
登入
登入現在一般用手機號碼+驗證碼、手機號碼+密碼、郵箱+密碼、使用者名稱+密碼、第三方登入、二維碼掃描登入、活體驗證這幾種。
整理了手機號碼+驗證碼、手機號碼+密碼、郵箱+密碼的流程

image
圖五
很多移動端應用將登入和註冊的過程直接合並,一步完成(慢慢的放輕註冊的概念),在使用者首次使用應用時,直接就用登入流程來完成註冊。
也有應用提供的註冊方式只有手機號+密碼註冊,在註冊完成後,在應用內去設定使用者名稱和郵箱,之後可以用手機號、郵箱、使用者名稱三種中的一種+密碼的方式進行登入。
- 第三方登入

image
圖六
第三方登入是登入註冊的必備選項了,能讓應用快速獲得使用者的基本資訊,藉助第三方登入來簡化登入的流程,也便於使用者進行多平臺的賬號管理。
- 二維碼登入

image
二維碼登入一般是PC端使用。
這些都是基礎的模型,到底用哪一種,還是要看自己本身的業務需求的。
歡迎關注微信公眾號:你叫我陳先森。