2017年的第23篇文章侈离。
朋友說某個APP不錯，下載后正準(zhǔn)備好好體驗(yàn)一番筝蚕，卻被糟糕的注冊登錄頁面弄的精疲力竭卦碾，無奈最終只能放棄。注冊登錄流程能讓用戶扭頭就走起宽，也能讓產(chǎn)品獲得新用戶的芳心洲胖。
一個合格的注冊登錄頁面，應(yīng)該是具有清晰的操作流程坯沪，良好的交互細(xì)節(jié)和美觀的視覺設(shè)計(jì)绿映。
1.清晰的操作流程
APP的注冊登錄有三種流程:
①無需注冊登錄
常見于系統(tǒng)自帶的工具類APP，像經(jīng)常使用的鬧鐘、日歷叉弦、計(jì)算器等等丐一；一些簡單的第三方APP：樂流，榫卯等淹冰。
這些APP的特點(diǎn)都是功能相對單一库车，比較“輕”，不需要記錄用戶信息或行為歷史樱拴。
②非強(qiáng)制登錄
有注冊登錄的流程柠衍，但是用戶不需要注冊登錄也能使用產(chǎn)品的部分功能，也就是所謂的支持游客模式疹鳄。
內(nèi)容類拧略、購物類芦岂、娛樂類等都會使用這種形式瘪弓。
非強(qiáng)制登錄又有兩種設(shè)計(jì)流程，一種是先展現(xiàn)出注冊登錄頁禽最，但是允許用戶跳過腺怯。
另一種是直接展示產(chǎn)品功能，當(dāng)用戶想深入使用某些功能時用戶得選擇注冊登錄川无。
③強(qiáng)制登錄
用戶必須先進(jìn)行注冊登錄呛占，才能正常使用產(chǎn)品功能。社交類懦趋、2B類晾虑、工作類的產(chǎn)品會使用這種流程。
強(qiáng)制注冊登錄的流程會影響用戶的轉(zhuǎn)化率仅叫，所以產(chǎn)品不是嚴(yán)重依賴于賬號系統(tǒng)的話帜篇，盡量采用非強(qiáng)制登錄的方式。
2.不同的注冊登錄方式
①郵箱
最開始的時候注冊登錄是基于PC的诫咱，也就是基于網(wǎng)頁笙隙，PC時代的互聯(lián)網(wǎng)產(chǎn)品多使用郵箱作為唯一ID。所以郵箱注冊成為主流坎缭，而且注冊過程中需要驗(yàn)證郵箱也很方便竟痰，用戶直接在PC端就可以完成所有操作。
現(xiàn)在很多APP依然保持著郵箱注冊的方式掏呼。
②.手機(jī)號
隨著移動互聯(lián)網(wǎng)的到來坏快，人們觸網(wǎng)的主要設(shè)備已經(jīng)從PC逐漸轉(zhuǎn)移到智能手機(jī)。
加上手機(jī)號碼的實(shí)名制憎夷、全球通業(yè)務(wù)的普及假消，使得手機(jī)號碼也具有了唯一標(biāo)示性壳影。而且在移動互聯(lián)網(wǎng)時代，用手機(jī)號碼作為登錄ID姆另，并用短信驗(yàn)證碼的形式來驗(yàn)證ID撩轰，這些操作流程都基于手機(jī)端，特別方便快捷啃沪。所以手機(jī)號碼逐漸取代郵箱成為APP注冊登錄的主流方式粘拾。
③.用戶名
早期用戶名注冊登錄還很常見，但是隨著第三方登錄的普及创千，以及用戶名登錄自身的缺陷：“只能區(qū)別用戶的ID缰雇，并不能獲取到用戶的聯(lián)系信息”，用戶名注冊登錄的方式已經(jīng)退出主流追驴。目前很多產(chǎn)品會將用戶名作為昵稱來用械哟，而不是作為注冊登錄的ID來使用。
④.第三方賬號
郵箱殿雪、手機(jī)號暇咆、用戶名，都屬于自建賬號體系的方式丙曙，除此之外還有一種方式：第三方賬號登錄爸业。用戶不需要輸入注冊登錄信息，直接選擇第三方賬號就能完成登錄亏镰。國內(nèi)常見的第三方賬號有微博扯旷、微信、QQ索抓、豆瓣钧忽、人人等，國外常見的第三方賬號有Facebook逼肯，Twitter耸黑，Google等。
現(xiàn)在國內(nèi)除了超級APP之外的APP基本都支持第三方賬號登錄汉矿，這樣能簡化用戶注冊登錄的流程崎坊，提高APP的用戶轉(zhuǎn)化率。
這四種方式各有優(yōu)劣洲拇，但總的來講奈揍，通過手機(jī)號注冊登錄會更方便，通過獲取驗(yàn)證碼輸入四位或六位數(shù)字就能完成注冊登錄赋续。
3.注重交互細(xì)節(jié)
APP的優(yōu)秀與否男翰，由很多因素決定，而良好的交互細(xì)節(jié)是每一個優(yōu)秀APP的共同品質(zhì)纽乱。只有從用戶場景出發(fā)蛾绎，并從用戶的視角來思考產(chǎn)品，才能設(shè)計(jì)出打動人心的APP。
①用顯示/隱藏icon代替輸入兩遍密碼
為了確保密碼輸入正確租冠，很多APP需要用戶輸入兩遍密碼來確定密碼輸入無誤鹏倘，但這無疑增加了用戶的工作量。替代方案是在密碼輸入框右側(cè)增加一個“顯示/隱藏icon”顽爹，讓用戶在輸入完一遍密碼后可以選擇點(diǎn)開“顯示/隱藏icon”來確保密碼輸入無誤纤泵，減少用戶的工作量。
②彈出相對應(yīng)的輸入鍵盤
點(diǎn)開郵箱輸入框镜粤，彈出帶有@的英文輸入鍵盤捏题。
點(diǎn)開手機(jī)號輸入框，彈出九宮格數(shù)字輸入鍵盤肉渴。
點(diǎn)開密碼輸入框公荧，彈出英文輸入鍵盤。
這是很小的細(xì)節(jié)同规，雖然用戶可能不知道哪里不對循狰，但是他能體會到好不好用。一個APP注意了這點(diǎn)捻浦，那用戶就會覺得這個APP好用晤揣。而另一個APP沒有做到這點(diǎn)桥爽，無論點(diǎn)擊哪個輸入框彈出的都是九宮格中文輸入鍵盤朱灿，用戶就會覺得這個APP不太好用。
作為設(shè)計(jì)師钠四，要知道用戶覺得不好用的原因是什么盗扒，這樣才能對癥下藥，改善用戶體驗(yàn)缀去。
③對手機(jī)號碼進(jìn)行3 4 4的分布侣灶。
這個規(guī)則不僅適用于手機(jī)號碼，包括銀行賬號缕碎、轉(zhuǎn)賬金額等等褥影。
這是因?yàn)槿说亩唐谟洃浭怯邢薜模匆淮沃荒苡涀∮邢薜臇|西咏雌，如果強(qiáng)制記住很長的東西凡怎，短期記憶就很容易出錯。
所以將數(shù)字以4或者3為單位分組赊抖，有利于用戶閱讀统倒、編輯、校對手機(jī)號碼氛雪。
④登錄時增加一鍵清空icon房匆。
在登錄的時候偶爾會出現(xiàn)輸入錯誤，如果沒有這個清除的icon，用戶只能按鍵盤中的清除按鈕浴鸿，需要一直按住直到輸入框?yàn)榭铡?/p>
一個是只需要點(diǎn)一次就能清空井氢，一個需要長按一段時間或者連續(xù)按多次才能清空，孰優(yōu)孰劣可想而知岳链。
⑤清晰的錯誤反饋毙沾。
當(dāng)用戶輸入錯誤信息時，最好利用臨時框的形式提示用戶宠页。而不是不做反應(yīng)讓用戶自己去猜到底是怎么回事左胞。
臨時框也有兩種形式，一種是下圖左側(cè)的對話框形式举户，這需要用戶點(diǎn)擊確認(rèn)才能進(jìn)行下一步操作烤宙。一種是toast的形式，彈出一兩秒后自動消失俭嘁。個人更傾向于第二種形式躺枕，因?yàn)榈谝环N形式相當(dāng)于強(qiáng)制中斷了用戶的操作，用戶需要點(diǎn)擊確認(rèn)才能回到原來的操作流程供填。而toast則起到了提示的效果拐云，并且沒有打擾到用戶。下圖右側(cè)的airbnb近她，在用戶輸錯密碼時叉瘩，不光有底部的臨時框提示，還將整個登錄頁面的背景色油綠色變?yōu)樾涯康某壬成樱@種設(shè)計(jì)在提示用戶的前提下薇缅，還做到了賞心悅目，是個不錯的設(shè)計(jì)思路攒磨。
四泳桦、美觀的視覺設(shè)計(jì)
緊密：通過元素的遠(yuǎn)近將相似元素分為一組。
對齊：通過對齊娩缰，規(guī)范元素的排版 灸撰。
簡約：注冊登錄頁面的背景盡量簡約，從而讓主體信息更加突出拼坎。
對比：將重要的內(nèi)容放大浮毯，增加色塊背景；將相對次要的內(nèi)容縮小演痒，降低明度等從而使得信息層級清晰亲轨。
均衡：注冊登錄頁面幾乎都是沿著中心線左右對稱的，信息是左右均衡擺放的鸟顺。否者會導(dǎo)致頁面不平衡惦蚊。
品牌調(diào)性和產(chǎn)品定位：視覺風(fēng)格要能體現(xiàn)出品牌調(diào)性器虾，也要做到符合產(chǎn)品的定位。
平時收藏的一些視覺不錯的注冊登錄頁面：
總結(jié)：早期互聯(lián)網(wǎng)產(chǎn)品多使用郵箱或用戶名登錄蹦锋，這是PC時代人圍繞設(shè)備走的特性決定的兆沙，而現(xiàn)在是移動互聯(lián)網(wǎng)時代，是設(shè)備圍繞人走莉掂，手機(jī)號自然成了主流的注冊登錄方式葛圃。而現(xiàn)在，如果你的產(chǎn)品沒有自建賬號系統(tǒng)的需求憎妙，請直接使用第三方登錄的方式库正，其快捷簡單的操作，無疑是成本最小的注冊登錄方式厘唾。
如果之前是郵箱注冊登錄的產(chǎn)品褥符，建議后期加入綁定手機(jī)號碼功能，在允許用戶使用郵箱登錄的前提下抚垃，也提供手機(jī)號快捷注冊登錄的方式喷楣，還可以增加第三方登錄的方式。畢竟注冊登錄屬于產(chǎn)品需求鹤树，并不是用戶需求铣焊，盡可能降低用戶在注冊登錄時的成本，能提高新用戶的轉(zhuǎn)化率罕伯，幫助產(chǎn)品成功曲伊。
在滿足產(chǎn)品需求的前提下，讓注冊登錄有一個清晰的操作流程捣炬；良好的交互細(xì)節(jié)熊昌；美觀的視覺設(shè)計(jì)绽榛，是做好注冊登錄頁的葵花寶典湿酸。
