起點(diǎn)課堂會員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會特權(quán)
個人IP打造特權(quán)
30+門專項(xiàng)技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導(dǎo)直播
12場專業(yè)技能直播
會員專屬社群
榮耀標(biāo)識看似簡單的App登錄注冊功能，怎樣做到用戶體驗(yàn)最佳？
用戶登錄系統(tǒng)，可以細(xì)分為三項(xiàng)功能模塊，分別是：登錄、注冊和密碼找回。本文作者將結(jié)合自身經(jīng)歷，談?wù)勊谧鲞@塊的時候一些想法，主要是涉及業(yè)務(wù)流程。
登錄和注冊功能，不論是PC端還是移動端，大多數(shù)產(chǎn)品都會涉及到。而不同的產(chǎn)品邏輯和業(yè)務(wù)流程，會帶來不一樣的用戶體驗(yàn)。過去做的大多是后臺產(chǎn)品，面向的是內(nèi)部用戶，因此在做登錄和注冊功能時，前臺界面相對簡單，主要是后臺的權(quán)限管理較為復(fù)雜。而最近正在做一款A(yù)pp和一款PC端前臺產(chǎn)品，面向外部的普通用戶，因此在登錄與注冊的產(chǎn)品設(shè)計上，需要考慮更多的細(xì)節(jié)因素。下面把我做產(chǎn)品原型時的一些思考放在下面，供大家討論。
用戶登錄系統(tǒng)，可以細(xì)分為三項(xiàng)功能模塊，分別是：登錄、注冊和密碼找回。下面分別談?wù)勎以谧鲞@塊的時候一些想法，主要是涉及業(yè)務(wù)流程。
一、登錄功能
1、登錄方式：手機(jī)號/郵箱/用戶名+密碼
現(xiàn)在App常見的登錄賬號是手機(jī)號和郵箱，因?yàn)檫@兩類登錄方式便于記憶，且方便找回密碼。但有很多App產(chǎn)品，其實(shí)是從其PC端產(chǎn)品衍生而來，它們共用同一套后臺系統(tǒng)，因此需要考慮到一部分過去在PC端注冊的老用戶。所以，雖然由字母和數(shù)字組成的用戶名，已經(jīng)是PC時代的登錄方式，但是在移動端上，也應(yīng)當(dāng)提供這樣的選擇。
如下圖1：
2、等待提示：提供“正在驗(yàn)證”的提示，緩解用戶焦慮
一般來說，如果產(chǎn)品的后臺能做到快速響應(yīng)，及時反饋用戶操作的結(jié)果，自然是最理想的狀態(tài)。但我之前在做其他產(chǎn)品時，碰到過很多次后臺無法及時響應(yīng)前臺請求的情況，這個時候，用戶可能會面臨一種無所適從的吃瓜狀態(tài)。
比如：用戶點(diǎn)擊登錄按鈕后，后臺響應(yīng)不及時或是網(wǎng)絡(luò)中斷，這個時候，用戶行為可能有兩種：重復(fù)提交或者直接退出。永遠(yuǎn)不要挑戰(zhàn)用戶的耐心，我就是這樣，每次使用其他產(chǎn)品時，如果提交之后頁面無反應(yīng)，等待2秒之后我就沒有耐心了，對這個產(chǎn)品的印象也打了折扣。為了預(yù)防這種情況，建議增加等待提示如，“正在驗(yàn)證，請耐心等待……”，或更加明確的指令“正在驗(yàn)證，請不要重復(fù)提交”。如下圖2
3、錯誤提示：用戶名或密碼錯誤+可試錯次數(shù)
之前看過一篇文章，專門討論怎樣優(yōu)化登錄功能的用戶體驗(yàn)。文章里提到，最佳的提示方式是清楚地告訴用戶到底是用戶名錯了，還是密碼錯了，從而引導(dǎo)用戶去修改。這種提示方式固然是將用戶體驗(yàn)做的很好，但這其中卻隱藏了安全隱患：如果盜用賬號密碼，豈不是成功率更高了？
所以，我個人還是傾向于提供一個模糊的提示：“用戶名或密碼錯誤”。同時，可以加上一個試錯機(jī)會提示，比如“你還可以嘗試xx次”，幫助用戶做到心里有數(shù)。當(dāng)然，如果設(shè)置了登錄試錯機(jī)制，就需要補(bǔ)充相應(yīng)的業(yè)務(wù)流程：當(dāng)用戶試錯次數(shù)用完后，引導(dǎo)用戶“找回密碼”。如下圖3：
登錄環(huán)節(jié)通常涉及到的細(xì)節(jié)主要是以上這些內(nèi)容，所以整個登錄的業(yè)務(wù)流程可以歸納為：①用戶輸入賬號+密碼，點(diǎn)擊提交→②界面提示“正在驗(yàn)證，請等待”→③界面提示信息錯誤→④用戶再度嘗試，或成功，或重復(fù)先前提示。
二、注冊功能
1、注冊方式：手機(jī)號 +密碼+驗(yàn)證碼
App產(chǎn)品在做新用戶注冊的時候，通用方式是用“手機(jī)號+驗(yàn)證碼”，好處顯而易見，快捷便利。我個人也是比較推崇這種注冊方式。但是， 還有很多用戶對用手機(jī)號注冊這種方式有所顧慮，擔(dān)心自己的信息外泄。考慮到這部分用戶群體的擔(dān)憂，我們可以在注冊界面多提供一種用郵箱注冊的方式，但這種方式不作為主要功能突顯，可以放在手機(jī)注冊的下方。如下圖4：
2、成功提示：激勵用戶
當(dāng)用戶提交信息后，一般最省事兒的做法就是直接跳轉(zhuǎn)到用戶的“個人中心”。這種方式固然沒有什么錯，但是總覺得缺點(diǎn)什么激勵性的東西。我之前在網(wǎng)上預(yù)訂了一本限購+預(yù)售的新書，真的要搶購才能買到，然后等了好多天終于收到書的時候，里面有一個黑色的信封，信紙上寫著“你是本書的第XXX名讀者”，這樣用戶體驗(yàn)做的還不錯，至少給我一種安慰和鼓勵的感覺。
在做App注冊的時候也可以這樣，當(dāng)用戶注冊成功之后，可以先不著急跳轉(zhuǎn)到個人中心，而是給用戶呈現(xiàn)一個激勵信息，比如“終于等到你！你是我們第 888 名用戶”這樣的反饋信息，還可以加上簡單的引導(dǎo)按鈕，讓用戶去完善信息，但一定不要給用戶施加壓力，要讓用戶有自由選擇的機(jī)會。如下圖5：
三、密碼找回
1、通過手機(jī)號重置密碼
在App上找回密碼，最快捷方便的方式是通過手機(jī)號來找回。這個功能分為兩個步驟：第一步是填寫手機(jī)號，獲取驗(yàn)證碼；第二步是在手機(jī)上重置密碼。當(dāng)然，在重置密碼的時候，可以讓用戶通過可見模式來設(shè)置，或者增加“確認(rèn)新密碼”的字段來確保用戶修改正確。如下圖6、7：
2、通過郵箱找回密碼
除了用手機(jī)號找回密碼之外，針對部分沒有綁定手機(jī)號的用戶，還可以提供用郵箱找回密碼的方式。這種方式需要后臺向用戶郵箱發(fā)送郵件，將新密碼告知用戶。如圖8：
上面這些內(nèi)容只是包含了登錄、注冊和找回密碼這幾塊核心的功能，但其實(shí)在設(shè)計登錄管理系統(tǒng)時，還有諸如第三方登錄、引導(dǎo)用戶綁定手機(jī)等其他需求。
本文由 @jokefuture 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。
作者寫的登錄方式還是比較早的，現(xiàn)在的大多app登錄注冊都是在一個流程中，輸入手機(jī)號碼-點(diǎn)擊下一步，選擇短信驗(yàn)證碼登錄或者是輸入密碼登錄，是在輸入手機(jī)號時就可以加校驗(yàn)，但是不會對用戶進(jìn)行提醒，兩種登錄方式，當(dāng)然新用戶只能選擇短信驗(yàn)證碼登錄，進(jìn)入后自行設(shè)置新密碼。之后我會寫一篇文章說明的
還有一種比較有意思的情況，登錄跟注冊放在一起，第一步先輸入手機(jī)號碼，點(diǎn)擊確定驗(yàn)證手機(jī)號碼是否已經(jīng)注冊，已注冊，第二步輸入登錄密碼，相反進(jìn)入注冊流程（設(shè)置密碼和驗(yàn)證手機(jī)號碼）。
目前未注冊的手機(jī)號碼都是用驗(yàn)證碼快捷注冊了，密碼這個環(huán)節(jié)都沒有
看到前面覺得寫得很好，結(jié)尾的時候看到通過郵箱找回密碼，覺得有點(diǎn)瑕疵，用戶應(yīng)該通過后臺發(fā)送的郵件自己設(shè)置密碼，而不是后臺直接發(fā)個密碼給用戶，這會使用戶記住密碼的成本提高，下次登陸忘掉密碼的可能性很大。
現(xiàn)在比較流行的應(yīng)該是給郵箱發(fā)驗(yàn)證碼，確認(rèn)后，在手機(jī)端進(jìn)行密碼修改吧，這樣子對于那些手機(jī)可以收到郵件的用戶來說，就不用在重新輸入賬號密碼來登錄電腦端的郵箱了，減少了用戶操作時間。
更需要考慮的應(yīng)該是安全性
請問為什么后臺發(fā)送密碼給用戶會更安全？
你理解錯了，我的意思是，后臺發(fā)送密碼給用戶是不安全的做法。
1：可以提示用戶注冊手機(jī)號和郵箱的部分內(nèi)容。
2：第三方登陸的流程沒有寫明
并沒有講到手機(jī)號收回之后二次投放帶來的注冊、登錄問題
這個問題你有沒有比較好的解決思路呢？畢竟這是以短信驗(yàn)證碼為最終憑據(jù)的時代
筆者通過3個場景，逐一描述，考慮的比較全面，側(cè)重在了提示用戶的一些語言上，贊！對于APP企業(yè)希望可以直接得到用戶的信息，比如手機(jī)號碼，目前任信了點(diǎn)驗(yàn)可以用戶在注冊/登錄時輸入手機(jī)號碼，免輸驗(yàn)證碼即可完成驗(yàn)證，對于用戶也簡單快捷
細(xì)節(jié)還是寫得挺好，考慮的東西比叫全面。很多產(chǎn)品設(shè)計在小細(xì)節(jié)的確有缺陷，都是依靠功能性的優(yōu)勢來彌補(bǔ)，為什么就不可以把細(xì)節(jié)和功能都做好呢？比如我看到有人做第三方登錄接入，就只接入了一個微信登錄。別人不用微信的怎么辦？你這個第三方不就相當(dāng)于擺設(shè)了嗎？起碼把QQ、微博也放上吧，如果想讓客戶體驗(yàn)一下獨(dú)出心裁獨(dú)特的登錄體驗(yàn)，把天翼接進(jìn)來也沒毛病啊，唉…
只接入一個微信登錄，會有戰(zhàn)略上面的考量。就比如支付方式，很多都只能用一種支付方式（微信/支付寶），這個用戶體驗(yàn)極差，但是也是戰(zhàn)略考量。在某些時候，用戶體驗(yàn)就只能讓步于公司戰(zhàn)略
這個戰(zhàn)略上的考量，比如這個產(chǎn)品和微信有合作，能夠拿到用戶在微信上的一些數(shù)據(jù)，而這些數(shù)據(jù)構(gòu)成了這個產(chǎn)品的很重要的一個要素，那么產(chǎn)品肯定會引導(dǎo)用戶使用微信登錄。而且現(xiàn)在不使用微信的用戶可以說是忽略不計，也沒必要為了這百分之一的人的用戶體驗(yàn)，去損害公司的戰(zhàn)略目標(biāo)
一看 就是小白，接入什么第三方登錄是有業(yè)務(wù)上的考慮的，并不是你想怎么樣就怎么樣的
我覺得作者并沒有優(yōu)化用戶體驗(yàn)，還是保持了傳統(tǒng)PC端注冊登錄老樣子，比較繁瑣
很多細(xì)節(jié)啊，現(xiàn)在很多app更新了以后都習(xí)慣于在注冊的時候把手機(jī)號碼和驗(yàn)證碼放到一個頁面上，填了驗(yàn)證碼以后在跳到下一個頁面設(shè)置密碼，這樣你覺得如何呢？
應(yīng)該加上防刷機(jī)制！不然如果有人刷短信驗(yàn)證碼，那就也是錢啊！
感覺注冊成功后告知用戶的歡迎頁想法很贊~作者大大厲害了~
沒意義 功能要分清主次 用戶注冊的目的是為了使用 app 內(nèi)的功能。與其讓用戶在這里停留 不如想象著陸頁怎么設(shè)計
+1，給用戶一個過渡頁，再給用戶兩個選擇，大部分用戶都會在這個頁面懵逼半天，懵逼以后可能還會點(diǎn)錯選項(xiàng)，我個人是傾向盡量少給用戶選擇，只要讓用戶一路點(diǎn)點(diǎn)點(diǎn)輸入輸入輸入~
關(guān)于密碼是否可見輸入，對用戶體驗(yàn)影響很大，一般我的經(jīng)驗(yàn)是以密碼的復(fù)雜度來區(qū)分，普通的4-6位數(shù)字密碼，選擇不可見輸入方式，如果你的密碼要求很多，例如必須字母數(shù)字組合，必須7位以上，使用App的密碼鍵盤等，滿足這類1種或一種以上情況的，比如可由用戶選擇可見或不可見輸入方式。
在目前的體驗(yàn)上，驗(yàn)證碼有一種體驗(yàn)，我覺得很棒。就是用戶點(diǎn)擊獲取驗(yàn)證碼時，自動彈出輸入驗(yàn)證碼框，用戶輸入正確后，無需點(diǎn)擊提交，自動判斷正確并跳轉(zhuǎn)。我覺得可以考慮這種方式～
如果以這種方式，用戶名或密碼有其中一個錯誤的話，即使驗(yàn)證碼輸入正確，也不可能登陸到系統(tǒng)。而且要及時判斷到底屬于哪種錯誤（是用戶名還是密碼還是驗(yàn)證碼錯了），然后在界面上顯示出來。
你都用手機(jī)接收到驗(yàn)證碼，也是正確的，就表示用戶名是正確的的，哪里還需要判斷？
說的應(yīng)該是直接用手機(jī)號和驗(yàn)證碼登陸的那種方式，不是注冊的時候
注冊頁面，驗(yàn)證碼放在密碼后面好還是前面好呢？
個人認(rèn)為放在后面，點(diǎn)擊輸入驗(yàn)證碼彈出，是否正確直接在驗(yàn)證碼邊上給出提示，即不必刷新頁面就能看出。這樣快捷又不妨礙用戶自己判斷要不要繼續(xù)（可能會想修改其他信息之類的）
我覺得應(yīng)該放在密碼前面，現(xiàn)在的驗(yàn)證碼肉眼可識別度有很多太低，很容易輸入錯誤
原來大家都有一樣的疑問吶~~
最好放在密碼前面，主要原因是因?yàn)轵?yàn)證碼的目的有時候是為了驗(yàn)證手機(jī)號是否被注冊或者有效，如果放在密碼后面，用戶都設(shè)置完密碼了，再告訴別人手機(jī)號已注冊，那感覺太尷尬了“為啥不早告訴我！”
這塊大家對驗(yàn)證碼是否是有一個誤區(qū)，驗(yàn)證碼的一個重要屬性是對身份的一個驗(yàn)證。再移動端的注冊環(huán)節(jié)，只有在點(diǎn)擊確定或注冊按鈕時才會對賬號是否注冊有一個判斷。所以這里的驗(yàn)證碼并不是對手機(jī)號是否被注冊進(jìn)行一個驗(yàn)證，而是看注冊者是否是本人。這種情況下，輸入完賬號和密碼之后，再要求對賬號驗(yàn)證，輸入驗(yàn)證碼是較合理的。驗(yàn)證通過之后直接注冊成功，如當(dāng)前賬號已經(jīng)注冊過，注冊按鈕在驗(yàn)證之后，提示當(dāng)前賬號已經(jīng)注冊，去登錄。這樣是否體驗(yàn)會好一些。注冊和登錄這塊的流程和邏輯，印象筆記移動端的交互做的特別好~大家可以參考下~
個人覺得是分情況：一個是正如文中，手機(jī)號、驗(yàn)證碼和密碼全部在同一個頁面，順序上并沒有太大講究，當(dāng)然最好是驗(yàn)證碼在前，可以較快定位到手機(jī)號輸入錯誤，而不用輸入完手機(jī)號和密碼之后才發(fā)現(xiàn)手機(jī)號輸入錯誤；另外一個是手機(jī)號、驗(yàn)證碼和密碼在三個不同頁面，頁面之前按順序跳轉(zhuǎn)，從用戶行為連貫性來說手機(jī)號后面進(jìn)行短信驗(yàn)證是比較符合邏輯的，在手機(jī)號跟短信驗(yàn)證之間加入了輸入密碼環(huán)節(jié)會讓人覺得行為中斷。
我認(rèn)為如果是注冊的話，驗(yàn)證碼還是放在最后比較好，用戶設(shè)置完密碼，輸好驗(yàn)證碼基本就有一種大功告成的感覺了，而把輸完驗(yàn)證碼還需要設(shè)置密碼才能注冊，感覺很繁瑣；另外，如果擔(dān)心用戶輸完手機(jī)號和密碼之后，獲取驗(yàn)證碼階段發(fā)現(xiàn)手機(jī)號已經(jīng)注冊這樣尷尬的情況，可以在輸入手機(jī)號階段就驗(yàn)證手機(jī)號啊，看是否注冊，已注冊就及時給出提示，就不會發(fā)生設(shè)置完密碼獲取驗(yàn)證碼才出現(xiàn)手機(jī)號已經(jīng)注冊這樣的尷尬情況了
我認(rèn)為放在密碼前面好，手機(jī)接收到驗(yàn)證碼之后立即輸入驗(yàn)證碼，這是一個很流暢的過程，如果我接收到了驗(yàn)證碼，你反而先讓我填寫密碼，感覺會有些別扭
最好放在密碼前面，輸入手機(jī)號后對手機(jī)號進(jìn)行驗(yàn)證保證流暢度，其次最后輸入密碼會加深用戶對密碼的印象，因?yàn)橛洸坏妹艽a這個太常見了
我覺得放在后邊比較好，一般接收驗(yàn)證碼的時間為60秒，比如我信號不好還剩5秒鐘的時候才收到，那我輸入密碼的時間肯定不夠了，就要再次獲取驗(yàn)證碼，而先設(shè)置密碼就不會出現(xiàn)這種情況
我想說，你們都是產(chǎn)品經(jīng)理嗎？思維太局限了！驗(yàn)證手機(jī)號是否被注冊或格式是否正確根本不需要驗(yàn)證碼來驗(yàn)證，讓程序猿在代碼里邊加個JS就能搞定，當(dāng)你輸入完手機(jī)號，焦點(diǎn)離開手機(jī)號輸入框的時候，觸發(fā)JS校驗(yàn)，先校驗(yàn)?zāi)爿斎氲倪@個手機(jī)號格式是否正確，然后再校驗(yàn)是否已經(jīng)注冊，根本不需要獲取驗(yàn)證碼！而且跟驗(yàn)證碼放在密碼前或后沒一點(diǎn)關(guān)系，真不知道都是怎么想的。
當(dāng)然了，你要是說那個更美觀和實(shí)用的話，肯定是放在密碼后邊好一些。
+1;輸入手機(jī)號就可以判定是否已經(jīng)注冊，是的話就變?yōu)榈卿?，不是的話就還是注冊，調(diào)用不同的接口
大家怎么看