編者按：什么樣的登錄過(guò)程不會(huì)讓人厭煩？今天@ME網(wǎng)易移動(dòng)設(shè)計(jì)?的同學(xué)從手機(jī)碼字這件小事上，聊聊他觀察到的那些優(yōu)雅的登錄體驗(yàn)，以及一些反人類的糟心過(guò)程，以此對(duì)照 。

如果說(shuō)互聯(lián)網(wǎng)改變了人類的生活，那么移動(dòng)互聯(lián)網(wǎng)則改變了人類的習(xí)慣，它讓用戶扔掉鍵盤和鼠標(biāo)，隨時(shí)隨地在一個(gè)巴掌大的屏幕上聊天、視頻、訂機(jī)票酒 店、購(gòu)物等。如今的移動(dòng)互聯(lián)網(wǎng)已經(jīng)把用戶慣壞了，隨著功能的增多和用戶體驗(yàn)的增強(qiáng)，想象著一個(gè)陽(yáng)光明媚的周日，拇指族們足不出戶的窩在床上和朋友聊天、看 電影、訂餐、購(gòu)物甚至收發(fā)郵件和工作，懶惰讓他們的脾氣越來(lái)越浮躁，會(huì)因?yàn)橐粋€(gè)細(xì)節(jié)的體驗(yàn)不好而分分鐘吐槽你的設(shè)計(jì)。他們懶得輸入太多內(nèi)容，因?yàn)槭謾C(jī)屏幕 實(shí)在是太小了，小到他們只愿意點(diǎn)擊和滑動(dòng)，好像這樣就能不消耗卡路里一樣，也許他們的未來(lái)和下一代已經(jīng)不會(huì)記得如何打字，那時(shí)候的高科技手機(jī)也許成為了一 個(gè)徹頭徹尾的秘書，動(dòng)動(dòng)嘴巴就能幫你做好你想要的一切，這并不是一個(gè)遙不可及的夢(mèng)想。

不可否認(rèn)的是，科技的發(fā)展和用戶體驗(yàn)的改善確實(shí)是讓用戶沉迷和依賴移動(dòng)互聯(lián)網(wǎng)的原因，也是設(shè)計(jì)師們工作的動(dòng)力。但移動(dòng)端因?yàn)槠聊怀叽缡芟抟约敖换シ?式的差別，使得其一些功能還遠(yuǎn)不如在PC端更方便，其中最大的一項(xiàng)就是輸入，今天我們通過(guò)分析一些在輸入上體驗(yàn)良好的設(shè)計(jì)來(lái)給我們今后的工作一些參考。

登錄的必要性

登錄就好比一個(gè)APP大門外的守衛(wèi)，如果你真的有公事要辦，那么進(jìn)門查崗和登記是有必要的；可你要是憋了一泡尿，只想進(jìn)去上個(gè)廁所，此時(shí)守衛(wèi)還要你 出示身份證，你恨不得直接撒在他身上然后再暴打他一頓。登錄的目的基本上有兩種：①需要帳號(hào)來(lái)獲取用戶數(shù)據(jù)并使用一些基本功能如跟貼、評(píng)論等（例如 Facebook、新浪微博、網(wǎng)易新聞）②需要將數(shù)據(jù)同步到不同設(shè)備和平臺(tái)（例如印象筆記）。說(shuō)到這兒，就不得不說(shuō)說(shuō)有些個(gè)產(chǎn)品經(jīng)理，為了那點(diǎn)可憐的 KPI和用戶數(shù)據(jù)，硬將自己的產(chǎn)品加上登錄的功能，殊不知因?yàn)榈卿泴⒍嗌儆脩糇钃踉谀愕漠a(chǎn)品之外。很多APP的開(kāi)機(jī)引導(dǎo)頁(yè)最后一幀，都是大大的一個(gè)登錄按 鈕，有些稍微有點(diǎn)良心的APP會(huì)把“直接進(jìn)入”顯示出來(lái)，不過(guò)是小到肉眼難見(jiàn)、手指難點(diǎn)擊，這種感覺(jué)就好像去政府辦事被官員們耍了一樣。

當(dāng)一個(gè)產(chǎn)品成熟了之后，登錄是必不可少的功能，此時(shí)登錄出現(xiàn)的時(shí)機(jī)就很重要，如果你的APP沒(méi)有牛到像Facebook和Twitter賬號(hào)人人都 熟知，也沒(méi)有像微信和QQ那種有著非登錄不可的功能，那就在用戶有需求的時(shí)候再登錄吧，少一個(gè)頁(yè)面的輸入就減少了一道門檻，也留住了更多的用戶。

被迫害妄想癥的發(fā)明 —— 輸入兩次密碼

最初PC端的帳號(hào)注冊(cè)都是需要輸入兩遍密碼的，因?yàn)槊艽a都是隱藏的，擔(dān)心因?yàn)椴恍⌒陌村e(cuò)鍵而導(dǎo)致輸入和心中記憶的不同，就輸入第二遍進(jìn)行確認(rèn)，這樣 確實(shí)能避免手誤，不過(guò)由此帶來(lái)的問(wèn)題是，沒(méi)有手誤的人要輸入兩遍相同的密碼，真正手誤的人不知道是第一遍不對(duì)還是第二遍不對(duì)，只能無(wú)比抓狂的刪掉密碼，重 新小心翼翼的輸入兩遍密碼。

我沒(méi)有翻看歷史，不知道這種兩遍密碼的功能是誰(shuí)因?yàn)槭裁丛虬l(fā)明的，我猜想是一個(gè)有被迫害妄想癥的人，擔(dān)心他輸入密碼的時(shí)候旁邊有人偷窺，于是把密 碼隱藏，然后因?yàn)榭床坏矫艽a怕自己輸入錯(cuò)誤，順手加了兩遍驗(yàn)證……這功能一定是電腦還沒(méi)有在家庭普及的時(shí)代發(fā)明的，人們?cè)诠矆?chǎng)所使用電腦，不可避免會(huì)擔(dān) 心陌生人的偷看?？扇缃耠娔X是一個(gè)多么隱私的物品，無(wú)論是家庭還是辦公室，大家都有自己隱私空間，已然不需要如此隱藏密碼，更何況是手機(jī)，手機(jī)本身隱私性 就更高，屏幕大小也有限，不想被人看到就用手擋一下或者躲開(kāi)他們，也就是被迫害妄想癥的人才會(huì)在手機(jī)端也要堅(jiān)持兩遍驗(yàn)證密碼的功能。每每看到這些APP的 注冊(cè)需要輸入兩遍密碼，我的狂躁癥簡(jiǎn)直要犯了！

一個(gè)好的設(shè)計(jì)并不是完全照搬PC端的功能和設(shè)計(jì)，而是要考慮適合移動(dòng)端應(yīng)用的場(chǎng)景，如上述所說(shuō)，在移動(dòng)端使用兩遍驗(yàn)證密碼是沒(méi)有必要的，無(wú)疑增加了 移動(dòng)端輸入的成本。蘋果iOS系統(tǒng)的輸入鍵盤會(huì)在點(diǎn)按下后變大，這本身就能讓用戶感知輸入的正確性，同時(shí)在輸入密碼的時(shí)候先顯示輸入的字母再快速轉(zhuǎn)換成隱 藏的黑點(diǎn)，也能幫助用戶檢查輸入的正確性；而一些體驗(yàn)更優(yōu)雅的APP則會(huì)為用戶提供顯示密碼的功能，默認(rèn)不顯示，當(dāng)用戶需要確認(rèn)密碼是否輸入正確的時(shí)候再 點(diǎn)擊顯示，這樣即避免了偷窺，又防止了輸錯(cuò)，也減少了兩次輸入的成本。一些APP甚至在此功能上做了很好玩的隱喻，例如tumblr用睜眼和閉眼的 icon來(lái)表示顯示和隱藏密碼，bingo！向一切美好的細(xì)節(jié)體驗(yàn)設(shè)計(jì)致敬。

誰(shuí)說(shuō)登錄非要輸入

當(dāng)你的APP需要登錄，但你恰好沒(méi)有公眾認(rèn)知的一套賬號(hào)體系時(shí)，拉下臉授權(quán)接入下那些熟知的第三方帳號(hào)不代表降低了你的登錄和注冊(cè)數(shù)，反而會(huì)讓用戶 更加快捷的完成登錄并開(kāi)始使用你APP的功能。不要覺(jué)得委屈，因?yàn)槟悴粔蚺１?，用戶從?lái)沒(méi)在你這兒注冊(cè)過(guò)，他們也不需要再多記一個(gè)帳號(hào)，有更好的選擇誰(shuí)不 愿意呢？！

第三方帳號(hào)登錄的好處是你的手機(jī)中已經(jīng)有一些現(xiàn)成的登錄信息，你只要獲取授權(quán)就可以，不用輸入任何用戶名和密碼，有些權(quán)限高的可以將你在其他APP中的昵稱頭像生日學(xué)校血型等一并拿過(guò)來(lái)，這些個(gè)人資料要是自己填可真令人討厭??！

那么問(wèn)題來(lái)了，登錄頁(yè)面到底要怎么布局？如何在突出自己帳號(hào)系統(tǒng)的同時(shí)展示第三方登錄按鈕？答案是，將用戶最想要的信息呈現(xiàn)在最重要的位置。有些 APP扭扭捏捏，用第三方登錄還要弱化顯示，恨不得讓自己的帳號(hào)登錄亮瞎用戶的眼，快選我快選我(⊙o⊙)，事實(shí)上你是否做過(guò)用戶調(diào)研，是否能理直氣壯的 證明這樣第三方登錄的點(diǎn)擊率就降低了？相比之下我更喜歡直接凸顯第三方登錄的設(shè)計(jì)方案。

既然有登錄，就會(huì)有退出登錄的需求。大部分APP退出登錄后再次登錄的頁(yè)面和最初登錄一樣，沒(méi)有幫助用戶記錄用戶名，這著實(shí)是一個(gè)不能稱作好的設(shè) 計(jì)，不管你是什么原因，減少用戶信息的輸入會(huì)讓用戶覺(jué)得再次登錄好像沒(méi)有那么困難，尤其是中國(guó)的用戶，他們的用戶名可能是不好打出來(lái)但自己覺(jué)得酷酷的中 文，也可能是國(guó)際范兒的中英文結(jié)合，更有可能是一些90后流行的顏文字等，沒(méi)有人想再重新輸入一遍。而且對(duì)于大部分非社交APP來(lái)說(shuō)，賬號(hào)并沒(méi)有非常重要 的隱私性，登錄主要是為了方便使用其中某些功能，這時(shí)候哪怕記住用戶名和密碼都不為過(guò)。例如雅虎新聞APP，退出登錄后，會(huì)記住所有在該設(shè)備上登錄過(guò)的用 戶名和密碼，再次登錄只要選擇想要登錄的帳號(hào)就行，十足方便。

目前很多主流的國(guó)外APP都已經(jīng)接入了1password登錄，1password是一個(gè)幫助你管理所有賬號(hào)密碼的APP，它的好處是在你重裝APP或者多設(shè)備登錄的時(shí)候幫你一鍵登錄，前提是你將該網(wǎng)站的帳號(hào)密碼存入1password。

注冊(cè)是在考驗(yàn)用戶的耐心

如果你真的不接入授權(quán)第三方帳號(hào)，或者你的用戶是個(gè)死忠，他非要注冊(cè)你的產(chǎn)品，那么首先得恭喜你！但是不要覺(jué)得用戶走到了這一步就能妥妥的注冊(cè)成 功，也許下一步他就會(huì)發(fā)怒卸載掉你的APP，簡(jiǎn)單且體驗(yàn)良好的注冊(cè)頁(yè)面非常重要。試問(wèn)看到如下behance的注冊(cè)頁(yè)面，不管他的APP里面內(nèi)容有多么 好，我都進(jìn)行不下去，而且會(huì)抓狂。暫不說(shuō)Adobe的帳號(hào)有多么小眾，這么多的表單是在查我的戶口嗎？！

注冊(cè)的目的是建立一個(gè)帳號(hào)，這個(gè)帳號(hào)是以后你使用網(wǎng)站或者APP的憑證，簡(jiǎn)單來(lái)說(shuō)，用戶名（郵箱）和密碼就夠了，先讓用戶成功的注冊(cè)，能夠正常使用 功能，至于什么昵稱頭像生日，用戶想完善他自己就去找了，用不著你來(lái)操心，如果你不是社交類型APP，這些完善功能你甚至都不需要。下圖中Booking 的注冊(cè)界面非常干凈簡(jiǎn)潔。

當(dāng)然如果是社交網(wǎng)站，是需要填寫一個(gè)用戶名或者昵稱的，這時(shí)候?qū)τ陉欠Q重復(fù)性的檢測(cè)也是必不可少的，大部分產(chǎn)品只會(huì)提示“昵稱被使用”，用戶能做的 是換一個(gè)昵稱，非常不幸的是可能昵稱仍舊被使用，因?yàn)閷?duì)一個(gè)有成千上百萬(wàn)用戶的產(chǎn)品來(lái)說(shuō)，你所想到的昵稱別人也早想到了，與其這樣不停的試，倒不如給用戶 一個(gè)參考，因?yàn)橛行┯脩魧?duì)名字無(wú)所謂，他們想要的是快速注冊(cè)完成。

Flickr的注冊(cè)頁(yè)面在我填完姓名之后自動(dòng)匹配給我用戶名（暫不說(shuō)為毛要填這么多表單），如果不喜歡，可以點(diǎn)擊左右按鈕去更換；輸入密碼的時(shí)候會(huì)實(shí)時(shí)提示我密碼的強(qiáng)度，這樣的好處是及時(shí)反饋及時(shí)修改，不會(huì)等到所有都填寫完成點(diǎn)擊注冊(cè)時(shí)再告訴我一堆錯(cuò)誤。

作者：方圓的形狀

原文來(lái)自：ME網(wǎng)易移動(dòng)設(shè)計(jì)