注冊(cè)登錄一直是應(yīng)用中必不可少的一環(huán),用戶(hù)打開(kāi)應(yīng)用可能第一步就是登錄頁(yè)面,這相當(dāng)于一款應(yīng)用的臉面,也是用戶(hù)使用產(chǎn)品的源頭。當(dāng)然也是因?yàn)椴怀1挥玫剿愿钊菀妆缓鲆?,它作為一?xiàng)基礎(chǔ)功能,使用場(chǎng)景一般是用戶(hù)初次使用應(yīng)用或者退出登錄,又或是大版本更新和登錄過(guò)期才會(huì)使用到。注冊(cè)登錄的意義就在于給用戶(hù)獨(dú)有的個(gè)人中心,包括數(shù)據(jù)的同步,或是用戶(hù)注冊(cè)后會(huì)通過(guò)用戶(hù)已完善的資料進(jìn)行相關(guān)的內(nèi)容推薦。
登錄相對(duì)而言屬于高頻次的操作,注冊(cè)、修改密碼等屬于相對(duì)低頻次的操作,但是他們都會(huì)關(guān)聯(lián)到產(chǎn)品內(nèi)的個(gè)人資料和設(shè)置模塊。幾乎所有的社交應(yīng)用都是需要注冊(cè)登錄的,用戶(hù)擁有了個(gè)人賬號(hào)才能繼續(xù)使用產(chǎn)品。
當(dāng)然也有一些系統(tǒng)的應(yīng)用是不需要注冊(cè)登錄就可以使用的,比如系統(tǒng)自帶的計(jì)算器、日歷、天氣等或是一些第三方的輕應(yīng)用,這里就不多贅述了,下面主要還是說(shuō)說(shuō)需要用到注冊(cè)登錄功能的情況。
還是先來(lái)看一下整體結(jié)構(gòu):
(以下圖片來(lái)源于應(yīng)用截圖,僅作為學(xué)習(xí)交流使用)
一、注冊(cè)登錄的方式
1.只使用第三方賬號(hào)注冊(cè)登錄
這種方式比較少但是無(wú)疑是最快捷的方式,相信大家平時(shí)應(yīng)該用這種方式也比較多,因?yàn)榭梢员苊馐褂檬謾C(jī)注冊(cè)帶來(lái)的繁瑣步驟,可以節(jié)約很多時(shí)間,你在第三方應(yīng)用中進(jìn)行授權(quán)后產(chǎn)品會(huì)直接調(diào)用接口,生成ID登錄后,你的頭像、昵稱(chēng)等個(gè)人信息甚至可能同時(shí)會(huì)獲取你的好友列表,讓你知道還有哪些好友也在使用產(chǎn)品,可以有效地減少對(duì)產(chǎn)品的陌生感,同時(shí)也便于應(yīng)用在第三方中進(jìn)行分享。
當(dāng)然這種方式對(duì)產(chǎn)品也很有利,因?yàn)橄嘈藕芏嘤脩?hù)在不了解產(chǎn)品的情況下,用戶(hù)可能只是想初步了解一下產(chǎn)品,但是又不想進(jìn)行手機(jī)注冊(cè)那么麻煩,所以就直接使用第三方進(jìn)行注冊(cè)吧,待進(jìn)入應(yīng)用初步使用了解后,再通過(guò)產(chǎn)品的用戶(hù)引導(dǎo)(比如紅點(diǎn)標(biāo)記或是局部引導(dǎo)等)功能再進(jìn)行手機(jī)號(hào)/郵箱/微信/微博等賬號(hào)的綁定,這樣做對(duì)新用戶(hù)的產(chǎn)生有積極作用。
我遇到過(guò)當(dāng)已經(jīng)使用了第三方應(yīng)用注冊(cè)登錄了之后,會(huì)立即出現(xiàn)讓用戶(hù)綁定手機(jī)號(hào)的頁(yè)面,這樣做是想快速產(chǎn)生新用戶(hù),出發(fā)點(diǎn)是好的,但是我覺(jué)得用戶(hù)在不了解產(chǎn)品的情況下,綁定手機(jī)號(hào)的可能性很低,所以最好可以在綁定手機(jī)號(hào)頁(yè)面有“跳過(guò)”功能,給用戶(hù)選擇的余地,不要強(qiáng)制用戶(hù),待初步了解產(chǎn)品后再通過(guò)引導(dǎo)進(jìn)行綁定,這樣做最佳。
2.只使用手機(jī)號(hào)注冊(cè)登錄
使用手機(jī)號(hào)獲取驗(yàn)證碼是目前最常用的注冊(cè)登錄方式,這種方式的優(yōu)勢(shì)不必多說(shuō),相信大家都很熟悉流程,通過(guò)發(fā)送短信獲取驗(yàn)證碼在60-90秒內(nèi)進(jìn)行注冊(cè)登錄,這么做是為了確認(rèn)用戶(hù)擁有該手機(jī)號(hào)的使用權(quán)。手機(jī)號(hào)+密碼是用戶(hù)常用的方式,而手機(jī)號(hào)+驗(yàn)證碼是比較簡(jiǎn)便的方式。這里注意一點(diǎn)的是在輸入手機(jī)號(hào)后,為了讓用戶(hù)查看是否輸入正確,建議手機(jī)號(hào)顯示樣式為3-4-4模式(比如156 1815 5555),這些都是細(xì)微之處,雖然無(wú)關(guān)大雅,但是可以看出一個(gè)產(chǎn)品的用心之處,比如下圖可以對(duì)比一下,明顯圖二更優(yōu)。
手機(jī)號(hào)也是商家進(jìn)行用戶(hù)維護(hù)的有效手段,畢竟手機(jī)都是隨身攜帶,可以在節(jié)假日發(fā)送祝福或是促銷(xiāo)短信,也可以在你長(zhǎng)期未使用產(chǎn)品,進(jìn)行短信提示,避免你將產(chǎn)品遺忘,但是過(guò)度的短信轟炸則會(huì)讓用戶(hù)感到反感。另外使用手機(jī)號(hào)注冊(cè)登錄,需要做一個(gè)判斷,是否是第一次登錄,是的話(huà)就跳轉(zhuǎn)引導(dǎo)頁(yè),不是的話(huà)就跳轉(zhuǎn)至首頁(yè)。
這里插一句題外話(huà),你們有沒(méi)有遇到過(guò)在已經(jīng)注冊(cè)成功后但是還需要重新輸入賬號(hào)密碼登錄的情況,其實(shí)這種做法個(gè)人覺(jué)得是比較多余的,可能2次輸入賬號(hào)密碼可以加強(qiáng)用戶(hù)的記憶,但是可能很多人用手機(jī)號(hào)注冊(cè)都是用的一個(gè)同密碼,因?yàn)楝F(xiàn)在的應(yīng)用可選擇的余地實(shí)在是太多了,如果每個(gè)應(yīng)用都使用不同的密碼可能很難記得住。
3.使用手機(jī)號(hào)/第三方賬號(hào)注冊(cè)登錄
這種樣式是最常見(jiàn)的,也是上面兩種樣式的結(jié)合,這種樣式給用戶(hù)留有選擇的余地,自愿使用手機(jī)號(hào)或是第三方。但是一般這樣的組合方式多數(shù)是希望用戶(hù)使用手機(jī)號(hào)注冊(cè),所以手機(jī)注冊(cè)登錄比較突出,第三方注冊(cè)會(huì)置于頁(yè)面底部,相對(duì)弱化。
但是還有一類(lèi)是希望用戶(hù)使用第三方登錄,弱化手機(jī)號(hào)注冊(cè)登錄的情況:BAT旗下的眾多應(yīng)用,會(huì)使用一個(gè)賬號(hào)或是進(jìn)行賬號(hào)關(guān)聯(lián),比如阿里旗下的應(yīng)用閑魚(yú)、菜鳥(niǎo)裹裹等,登錄時(shí)為了用戶(hù)數(shù)據(jù)之間連接,會(huì)推薦用戶(hù)使用淘寶賬號(hào)進(jìn)行登錄,從而弱化了手機(jī)號(hào)注冊(cè)登錄,這是出于產(chǎn)品屬性或是戰(zhàn)略需求考慮,無(wú)可厚非。
4.使用郵箱注冊(cè)登錄
使用郵箱進(jìn)行注冊(cè)登錄也是比較常用的方式,多數(shù)用于pc端,郵箱容易記憶,便于頻繁使用的產(chǎn)品,注冊(cè)后郵箱會(huì)收到驗(yàn)證鏈接,驗(yàn)證成功后會(huì)自動(dòng)跳轉(zhuǎn)進(jìn)入該網(wǎng)頁(yè)首頁(yè)。因?yàn)閣eb端屏幕較大,還是和移動(dòng)端有點(diǎn)差別,需要填寫(xiě)的表單可能也會(huì)比較多。
當(dāng)然移動(dòng)端也有使用郵箱注冊(cè)的,可能是國(guó)外的應(yīng)用居多,比如facebook、twitter、dribbble…或是國(guó)內(nèi)的應(yīng)用同時(shí)擁有網(wǎng)頁(yè)和移動(dòng)端,可以將用戶(hù)數(shù)據(jù)進(jìn)行同步。
5.先體驗(yàn)后注冊(cè)登錄
這種方式也很多見(jiàn),一般多為閱讀類(lèi)、游戲類(lèi)或是電商類(lèi)產(chǎn)品,用戶(hù)多為游客狀態(tài),可能只是進(jìn)來(lái)逛逛,可能暫時(shí)還沒(méi)有使用到添加、收藏、關(guān)注、評(píng)論、購(gòu)買(mǎi)等功能,如果使用這些功能就必須要進(jìn)行注冊(cè)登錄了,注意在完成注冊(cè)登錄后記得頁(yè)面要回到之前瀏覽的頁(yè)面,而不是回到首頁(yè)。
6.短信注冊(cè)
比較少見(jiàn)的一種方式,通過(guò)編輯短信發(fā)送至XXX后,可獲取賬號(hào)和密碼。這種方式屬于早期的一種方式,現(xiàn)在基本用不到了,就不多說(shuō)了。
二、注冊(cè)登錄頁(yè)面要點(diǎn)
1.簡(jiǎn)潔風(fēng) VS logo+輸入框
iOS 11更新帶動(dòng)了新的設(shè)計(jì)趨勢(shì),大標(biāo)題+留白被廣泛使用,注冊(cè)登錄也不例外,現(xiàn)在很多產(chǎn)品都使用相對(duì)簡(jiǎn)潔的設(shè)計(jì)(下面左圖),僅使用大標(biāo)題和必要的線(xiàn)框和提示語(yǔ),讓用戶(hù)只聚焦注冊(cè)登錄本身,去除多余的干擾元素,可以節(jié)省用戶(hù)的時(shí)間。相對(duì)早期的設(shè)計(jì)手法是在頁(yè)面中加入logo(下面右圖),好處是可以進(jìn)一步強(qiáng)化用戶(hù)對(duì)產(chǎn)品品牌的記憶點(diǎn)。兩種方式各有優(yōu)點(diǎn),沒(méi)有對(duì)錯(cuò),產(chǎn)品可以酌情使用。
2.分步驟注冊(cè)登錄
現(xiàn)在有很多應(yīng)用是采用分步驟進(jìn)行注冊(cè)的,比如先輸入手機(jī)號(hào),點(diǎn)擊“下一步”的同時(shí),系統(tǒng)查詢(xún)?cè)撌謾C(jī)號(hào)是否可以注冊(cè),通過(guò)的話(huà)則進(jìn)入輸入驗(yàn)證碼頁(yè)面,這樣做的好處是可以及時(shí)反饋給用戶(hù),避免了用戶(hù)在輸完手機(jī)號(hào)和驗(yàn)證碼之后出現(xiàn)錯(cuò)誤toast的情況。需要注意的是步驟不宜過(guò)多,建議3步以?xún)?nèi),如果你的產(chǎn)品對(duì)用戶(hù)來(lái)說(shuō)不是非用不可,可能會(huì)有很多用戶(hù)會(huì)放棄注冊(cè)。
3.注冊(cè)登錄合二為一
這種方式和分步驟注冊(cè)類(lèi)似,將注冊(cè)和登錄合到一起,不管你是否有注冊(cè),只要輸入手機(jī)號(hào)再填寫(xiě)驗(yàn)證碼,成功后即可使用產(chǎn)品,比如小黃車(chē)就是使用這一方式。
4.輸入框提示語(yǔ)
輸入框提示語(yǔ)是必不可少的,措詞需要簡(jiǎn)潔,大部分的做法是點(diǎn)擊輸入框后提示語(yǔ)自動(dòng)消失,這樣做也是可以,畢竟需要填寫(xiě)的選項(xiàng)不是很多,用戶(hù)不易忘記;當(dāng)然更好的做法是保留提示語(yǔ),比如星巴克的登錄頁(yè)面,在點(diǎn)擊輸入框后,提示語(yǔ)會(huì)上移,依舊保留,只是這樣的開(kāi)發(fā)成本可能會(huì)稍大一點(diǎn)。
5.忘記密碼
忘記密碼的功能一般都是放在登錄頁(yè)面,因?yàn)閮烧哂休^強(qiáng)的關(guān)聯(lián)性。使用忘記密碼功能一般是通過(guò)手機(jī)號(hào)發(fā)送驗(yàn)證碼,驗(yàn)證通過(guò)后再進(jìn)行新密碼的設(shè)置;如果起初是用郵箱注冊(cè)登錄的話(huà)就要到郵箱中進(jìn)行驗(yàn)證,驗(yàn)證通過(guò)后再進(jìn)行新密碼的設(shè)置。
6.toast提示
這里的toast提示一般用于有錯(cuò)誤發(fā)生的情況下,比如賬號(hào)不存在、賬號(hào)已被占用、密碼錯(cuò)誤、驗(yàn)證碼錯(cuò)誤等,及時(shí)的反饋給用戶(hù)注冊(cè)登錄不成功的地方在哪里,以免用戶(hù)摸不著頭腦,憤而離開(kāi)應(yīng)用。
三、其他要點(diǎn)
1.安全碼
出于安全考慮,有些應(yīng)用會(huì)讓用戶(hù)輸入圖形驗(yàn)證碼、字符驗(yàn)證碼、旋轉(zhuǎn)圖片、滑動(dòng)驗(yàn)證等方式,目的是確認(rèn)是人為注冊(cè)而非軟件惡意注冊(cè)。
2.用戶(hù)協(xié)議
用戶(hù)協(xié)議看似非常的不起眼,用戶(hù)也很少會(huì)去點(diǎn)擊查看,出現(xiàn)在注冊(cè)頁(yè)面的情況居多。早期一般是默認(rèn)被選中狀態(tài)或是點(diǎn)擊注冊(cè)即視為同意協(xié)議條款(圖一),用戶(hù)填完賬戶(hù)密碼之后點(diǎn)擊注冊(cè)就完成了。但是前去年支付寶默認(rèn)用戶(hù)協(xié)議被選中導(dǎo)致的一系列新聞提醒我們,用戶(hù)協(xié)議最好需要用戶(hù)自己去點(diǎn)擊確認(rèn),現(xiàn)在很多應(yīng)用也開(kāi)始這么做,在沒(méi)有勾選用戶(hù)協(xié)議之前,“注冊(cè)”button是無(wú)法點(diǎn)擊的(圖二)。
3.密碼眼睛開(kāi)合
出于使用場(chǎng)景考慮,比如在戶(hù)外或是注冊(cè)登錄時(shí)身邊有人,為了有效保護(hù)用戶(hù)的密碼隱私,可在輸入密碼時(shí)關(guān)閉眼睛icon,只顯示密碼點(diǎn);開(kāi)啟眼睛icon時(shí)是為了讓用戶(hù)清楚的看見(jiàn)自己的密碼,避免密碼輸入錯(cuò)誤。
4.一鍵刪除賬戶(hù)名/密碼
這個(gè)功能是給用戶(hù)在注冊(cè)登錄頁(yè)面輸入有誤或是切換賬戶(hù)時(shí)使用,可以有效減少用戶(hù)的點(diǎn)擊次數(shù),提升用戶(hù)體驗(yàn)。
5.保留賬戶(hù)名數(shù)據(jù)
在用戶(hù)曾登錄過(guò)的情況下,應(yīng)該保留用戶(hù)的賬戶(hù)名數(shù)據(jù),這樣用戶(hù)重新登錄時(shí)只需填寫(xiě)密碼或驗(yàn)證碼即可。當(dāng)然,用戶(hù)如果想重新輸入賬戶(hù)名,一鍵刪除數(shù)據(jù)的功能也顯得很有必要。
還有一點(diǎn)是多賬戶(hù)之間的登錄切換,在登錄時(shí)可以選擇多個(gè)賬號(hào),這個(gè)功能在to C類(lèi)應(yīng)用比較少,一般是to B類(lèi)應(yīng)用可能會(huì)用到,因?yàn)槠髽I(yè)可能會(huì)擁有多個(gè)賬號(hào),這個(gè)功能就會(huì)顯得很有必要。
6.賬號(hào)后綴關(guān)聯(lián)
這種針對(duì)使用郵箱注冊(cè),比如說(shuō)在用戶(hù)填寫(xiě)賬戶(hù)名輸入@的同時(shí),關(guān)聯(lián)出@qq.com、@163.com等,可以減少用戶(hù)的輸入,體驗(yàn)也會(huì)更好。
7.去除雞肋操作
在注冊(cè)登錄時(shí)也會(huì)有一些比較多余的操作,比如二次確認(rèn)密碼、完善個(gè)人資料等,這些操作最好是放置在個(gè)人中心或是設(shè)置里讓用戶(hù)自行填寫(xiě),在注冊(cè)登錄頁(yè)面只保留必須填寫(xiě)的內(nèi)容。
總結(jié)
綜上所述,注冊(cè)登錄看似是很簡(jiǎn)單的頁(yè)面布局,并且容易忽視,但是它的地位是不可忽視的,其中的交互方式和細(xì)微之處還需要我們多多考慮,不同的產(chǎn)品需要根據(jù)自己的屬性來(lái)選擇符合自己的方式。
如有遺漏,歡迎大家留言提出,一起交流~ ?Thanks for reading! To be continued…
全站高品質(zhì)素材免費(fèi)下載!