注冊(cè)并不意味著直接轉(zhuǎn)換為客戶。讓這些用戶成為你真正的客戶還需要你做很多事情。但是設(shè)計(jì)一個(gè)有效的注冊(cè)流程是得到真正客戶的第一步。

盡管注冊(cè)是設(shè)計(jì)中很常見的一件事情，但也是設(shè)計(jì)中復(fù)雜的一部分。通過遵循下面的建議從而幫助你設(shè)計(jì)一個(gè)好的注冊(cè)流程，確保用戶能輕松注冊(cè)。

1.?不要同時(shí)使用登錄和注冊(cè)

你能多快的辨別下圖的“注冊(cè)”和“登錄”之間的區(qū)別?

不好的設(shè)計(jì)：“登錄”和“注冊(cè)”同時(shí)被使用

問題是“登錄”和“注冊(cè)”距離非常近。如果按鈕太相似或者都使用相同的動(dòng)詞文本標(biāo)簽（英語里面Sign in/Sign up 存在這個(gè)問題，漢語里面登錄和注冊(cè)就不存在使用相同的動(dòng)詞標(biāo)簽），會(huì)讓用戶為此而感到困惑。當(dāng)用戶嘗試登錄的時(shí)候可能會(huì)點(diǎn)擊錯(cuò)誤，經(jīng)常發(fā)生這種問題會(huì)讓用戶感到沮喪。發(fā)生這種情況原因是用戶在快速瀏覽界面時(shí)進(jìn)行的操作，假如用戶第一反應(yīng)就點(diǎn)擊了正確的按鈕，那還好。即使用戶沒有點(diǎn)擊錯(cuò)誤，他們也會(huì)花很多時(shí)間去區(qū)分這兩個(gè)按鈕的區(qū)別。

不該讓用戶停下來去思考哪一個(gè)按鈕該去點(diǎn)擊。假如你想提供一個(gè)良好的登錄體驗(yàn)，請(qǐng)避免同時(shí)使用“登錄”和“注冊(cè)”。相反，通過使用不同的動(dòng)詞標(biāo)簽從而讓他們不同：

好的設(shè)計(jì)：“登錄”和“注冊(cè)”對(duì)于用戶來說非常清晰

同時(shí)讓按鈕有不同的視覺表現(xiàn)（顏色和樣式），目的是為了讓他們的不同之處更加顯著：

圖片來源于：?ThinkWithGoogle

2.減少表格中的填寫框

在注冊(cè)時(shí)，向新用戶詢問最少的問題。注冊(cè)表格中的填寫框越少，注冊(cè)流程就越簡(jiǎn)短，用戶就不會(huì)在注冊(cè)的中途離開，從而導(dǎo)致用戶流失。思考填寫框里哪些信息是你需要收集的：

1. 消除重復(fù)填寫密碼和郵箱信息能讓你的注冊(cè)流程變得更好。這里還有其他解決方案（看第4點(diǎn)）
2. 從用戶體驗(yàn)角度來看，最好不要有可選項(xiàng)。假如不是必要的信息，就不必浪費(fèi)用戶的時(shí)間來填寫。如果這里仍然有一些選項(xiàng)需要用戶在你的注冊(cè)表單里面填寫，確保清楚的告訴用戶這些信息是可選的：

“你多大了”被標(biāo)注為可選項(xiàng)

3.區(qū)分登錄和注冊(cè)

許多網(wǎng)站和APP幾乎使用相同填寫框（郵箱、用戶名、密碼）去登錄或者注冊(cè)，并且這兩個(gè)都還是并排著展示給用戶：

不好的設(shè)計(jì)：兩個(gè)表格并列排放

然而，對(duì)于區(qū)分注冊(cè)和登錄是非常重要的，減少用戶試圖通過注冊(cè)表格而登錄的幾率。例如，Twitter的登錄和注冊(cè)不僅看起來不同，而且他們對(duì)于登錄和注冊(cè)的按鈕有不同的顏色，同時(shí)還有文字信息幫助用戶來理解（第一次來到Twitter?注冊(cè)）

好的設(shè)計(jì)：Twitter的登錄和注冊(cè)表格

4.讓用戶密碼可視化

在登錄和注冊(cè)的時(shí)候有個(gè)常見問題就是輸入了錯(cuò)誤密碼。這是很多人經(jīng)常犯的錯(cuò)誤，因?yàn)楫?dāng)你在輸入密碼的時(shí)候你是看不見你的密碼的（當(dāng)然這是因?yàn)楸Ｃ苄缘脑颍?。用戶不是完美的打字員，尤其在移動(dòng)端設(shè)備上，他們經(jīng)常在輸入密碼的時(shí)候輸入錯(cuò)誤信息。

通過使用二次確認(rèn)密碼方式來防止用戶在注冊(cè)表格上輸入錯(cuò)誤密碼：

錯(cuò)誤設(shè)計(jì)：二次確認(rèn)密碼

確認(rèn)密碼設(shè)計(jì)看起來是明智的，但是并沒有解決實(shí)際問題。由于用戶在填寫表格的時(shí)候看不到輸入的密碼信息導(dǎo)致犯更多的錯(cuò)誤。同時(shí)用戶會(huì)對(duì)自己失去信心，因?yàn)橥粋€(gè)錯(cuò)誤他們又犯了兩次。

別讓用戶在框里填寫兩次同樣的信息。使用“顯示密碼”復(fù)選框方式去預(yù)防用戶輸入錯(cuò)誤密碼。你可以把復(fù)選框放在接近密碼框附近。當(dāng)用戶點(diǎn)擊它的時(shí)候，密碼就會(huì)顯示給用戶，而不會(huì)被隱藏。

好的設(shè)計(jì)：“顯示密碼”作為一個(gè)復(fù)選框

同樣你也可以使用一個(gè)圖標(biāo)。當(dāng)用戶點(diǎn)擊這個(gè)圖標(biāo)的時(shí)候，會(huì)有一個(gè)斜杠在眼睛上，就是告訴用戶他們輸入的密碼被隱藏了。（下圖片好像展示反了，眼睛應(yīng)該代表可以看見密碼，斜線遮擋眼睛代表看不見密碼）

好的設(shè)計(jì)：“顯示密碼”作為一個(gè)icon

5.提供引導(dǎo)

向你的用戶清楚的解釋表格框哪里錯(cuò)誤了。假如表格框不完全的正確，不要告訴用戶他們犯錯(cuò)了。而是應(yīng)該向他們展示哪個(gè)表格框是錯(cuò)誤的，并解釋正確的填寫方式。

展示密碼錯(cuò)誤良好的用戶體驗(yàn)方式

“為了安全性，你的密碼必須要長(zhǎng)于6個(gè)且短于10個(gè)字符，至少包含一個(gè)大寫字母，一個(gè)數(shù)字和一個(gè)字符”這是一個(gè)典型的密碼需求，但如何向用戶解釋這些密碼需求了。參照Mailchimp，顯示用戶符合“密碼長(zhǎng)度”的視覺效果進(jìn)度。

當(dāng)前的密碼需求是“一個(gè)特殊的字符”，“一個(gè)數(shù)字”同時(shí)至少有8個(gè)字符。

實(shí)時(shí)數(shù)據(jù)驗(yàn)證

實(shí)時(shí)驗(yàn)證可以立刻通知用戶數(shù)據(jù)的正確性。這種方法允許用戶糾正錯(cuò)誤，而無需等待他們點(diǎn)擊提交按鈕才能看到錯(cuò)誤。盡管如此，表格驗(yàn)證不應(yīng)該只是告訴用戶他們犯了什么錯(cuò)，應(yīng)該告訴用戶他們應(yīng)該如何做才是正確的。用戶在注冊(cè)表格的時(shí)候更加有信心。

圖片來源于：form-ux-tips

實(shí)時(shí)驗(yàn)證工作尤其適合不太明顯的答案，例如選擇一個(gè)獨(dú)特的用戶名或一個(gè)強(qiáng)大的密碼。Twitter是個(gè)明顯的例子。在下圖，你可以看到圖表告訴我郵箱已經(jīng)被用了同時(shí)提供給我一些選項(xiàng)（登錄或找回我的密碼）。

6.寧愿使用郵箱地址或手機(jī)號(hào)碼也不使用用戶名登錄

假如你讓用戶在注冊(cè)的過程中創(chuàng)建一個(gè)用戶名，很可能你會(huì)遇見以下困難：

• 用戶名必須是未被使用的，用戶也許需要花費(fèi)幾分鐘去找到適合他們的名字，因?yàn)楹芏嘤脩粝矚g的名字都被其他用戶使用了。
• ?注冊(cè)完后用戶有了一個(gè)全新的用戶名，一段時(shí)間后他們也很難記得住。

你的網(wǎng)站或者APP應(yīng)該允許用戶使用他們的郵箱地址或手機(jī)號(hào)碼去登錄：

好的設(shè)計(jì)：手機(jī)號(hào)碼和郵箱地址可以用于用戶注冊(cè)

7.允許用戶通過Facebook、Twitter 或者Google+去登錄

為什么強(qiáng)迫用戶創(chuàng)建一個(gè)新賬戶來登錄而不是通過其他第三方的賬戶登錄，例如Facebook、Google或Twitter？通過這種第三方賬戶來登錄可以減輕用戶的登錄成本。

比較用郵箱地址登錄方式的優(yōu)缺點(diǎn)：

• 優(yōu)點(diǎn)：用戶不在需要填寫注冊(cè)表格，從而填寫用戶名、賬戶密碼，然后用郵箱來驗(yàn)證這些信息，因此注冊(cè)只需要花費(fèi)很短的時(shí)間。最重要的是用戶不需要去記住新的用戶名和賬戶密碼。
• 缺點(diǎn)：用戶的隱私信息也會(huì)自動(dòng)加載提供給第三方，并不是每個(gè)人都愿意分享他們的文件數(shù)據(jù)。這種情況下你應(yīng)該有傳統(tǒng)的登錄和第三方登錄方式讓用戶選擇。

好的設(shè)計(jì)：通過Facebook/Google+/Twitter登錄或者使用傳統(tǒng)的登錄方式

8.用戶注冊(cè)賬戶后，讓其保持登錄狀態(tài)

常見問題是用戶注冊(cè)賬戶后，又要求用戶立刻登錄。這個(gè)額外的步驟讓用戶感到很困惑。

壞的設(shè)計(jì)：激活賬戶后又要求用戶登錄

你應(yīng)該在設(shè)計(jì)APP的時(shí)候，讓用戶注冊(cè)后就立即登錄而不是又重新登錄一次（除非一些特殊的軟件擔(dān)心安全隱患，例如銀行相關(guān)軟件）。

9.輕松找回密碼

用戶重新設(shè)置密碼的時(shí)候是輕松愉快的，這對(duì)于用戶來說是非常重要的，因?yàn)樗麄兘?jīng)常忘記密碼。

讓用戶輕松創(chuàng)建密碼，防止在此階段的用戶流失。首先應(yīng)該在登錄表格那里有一個(gè)清晰的 “忘記密碼？”鏈接，同時(shí)這個(gè)鏈接應(yīng)該一直是可視化的（而不是在輸入不正確密碼后才顯示）。

好的設(shè)計(jì)：Mailchimp登錄界面有“忘記密碼”鏈接

10.采用 “先試后買”策略

要求用戶提供一些他們自己的個(gè)人信息的時(shí)候，用戶很有可能會(huì)放棄使用這個(gè)APP或者在線服務(wù)，除非讓他們看到直接的收益。尤其是，當(dāng)這個(gè)品牌認(rèn)知度又低但是又要求用戶在使用之初就注冊(cè)它，這會(huì)導(dǎo)致85%的用戶會(huì)放棄使用這個(gè)產(chǎn)品。

需要用戶在使用前提前注冊(cè)對(duì)于用戶來說是很難的。因?yàn)橛脩粼谧?cè)之前想知道這個(gè)產(chǎn)品是如何提供服務(wù)的或者說這個(gè)產(chǎn)品是如何工作的。圖片來源于：ThinkWithGoogle

最好是提供一組試用功能給用戶使用總比什么都沒有好。因此，采用 “先試后買”策略。這種策略給新用戶體驗(yàn)產(chǎn)品的機(jī)會(huì)，他們?nèi)羰菍?duì)此產(chǎn)品感興趣自然會(huì)去注冊(cè)。試用后用戶知道從產(chǎn)品這里能到他們想要的東西，他們自然樂于去注冊(cè)同時(shí)提供真實(shí)的個(gè)人信息。

“先試后買”這種策略并不意味著你不能要求用戶創(chuàng)建一個(gè)賬戶。而是在你要求用戶創(chuàng)建賬戶之前，讓用戶明白你的產(chǎn)品能帶給他們的價(jià)值。例如，YouTUbe允許新用戶瀏覽他們想要盡可能多的內(nèi)容，當(dāng)他們想試圖回答或者創(chuàng)建自己的視頻內(nèi)容的時(shí)候，它就會(huì)提示用戶去注冊(cè)。

總結(jié)

當(dāng)你按照以上建議來設(shè)計(jì)注冊(cè)流的時(shí)候，你將會(huì)得到大量的注冊(cè)用戶。但是這些注冊(cè)量并不意味著直接轉(zhuǎn)換為客戶。讓這些用戶成為你真正的客戶還需要你做很多事情。但是設(shè)計(jì)一個(gè)有效的注冊(cè)流程是得到真正客戶的第一步。

原創(chuàng)作者：Nick Babich

譯者：設(shè)計(jì)師Minz (微信公眾號(hào)：Designer_Minz)?一枚成長(zhǎng)中的設(shè)計(jì)師，點(diǎn)滴積累，人人都能成為設(shè)計(jì)師。

本文由 @設(shè)計(jì)師Minz 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。