注冊(cè)Redesign實(shí)例：手機(jī)QQ注冊(cè)模塊交互設(shè)計(jì)思考

文章分享了手機(jī)QQ注冊(cè)模塊交互設(shè)計(jì)的思考過(guò)程，給大家一些參考，希望對(duì)大家的產(chǎn)品工作帶來(lái)幫手。

QQ作為一個(gè)連接人、內(nèi)容與生活的社交平臺(tái)，其注冊(cè)帳號(hào)將是我們產(chǎn)品中非常重要的一環(huán)?；贛obile端與PC端的區(qū)別，我們?cè)谑謾C(jī)版QQ的設(shè)計(jì)上要求更輕、更快、更便捷的給用戶(hù)下發(fā)QQ號(hào)。目

前手機(jī)版QQ的用戶(hù)量覆蓋率已達(dá)8億以上，所以現(xiàn)有新QQ號(hào)的注冊(cè)情況多為已有號(hào)碼登錄情況下的小號(hào)注冊(cè)。所以如何幫手用戶(hù)快速注冊(cè)新QQ號(hào)，而且使用戶(hù)在流程中獲得良好的用戶(hù)體驗(yàn)就是我們思考的問(wèn)題。

分步注冊(cè)是什么？它指的是在注冊(cè)頁(yè)面上，一個(gè)頁(yè)面只專(zhuān)注于一個(gè)信息的提交，分步驟地去讓用戶(hù)完成整個(gè)流程。相反，非分步注冊(cè)則指的是在一個(gè)長(zhǎng)頁(yè)面上完成多個(gè)信息的填寫(xiě)，最終提交注冊(cè)一個(gè)帳號(hào)。

依據(jù)桌面調(diào)研，多數(shù)分步注冊(cè)APP平均為5步擺布，多數(shù)非分步注冊(cè)APP平均為8步擺布。而且Facebook曾針對(duì)分步注冊(cè)與非分步注冊(cè)做過(guò)A/B Test，其結(jié)論指出分步注冊(cè)的轉(zhuǎn)化率遠(yuǎn)高于非分步注冊(cè)。由此可見(jiàn)，非分步注冊(cè)強(qiáng)行減少注冊(cè)頁(yè)面，不如適當(dāng)拉長(zhǎng)戰(zhàn)線，給用戶(hù)輕負(fù)荷的操作，讓用戶(hù)在不知不覺(jué)中完成注冊(cè)流程。

除此之外，還有一種例如in和same的簡(jiǎn)單型APP，這類(lèi)非社交類(lèi)產(chǎn)品可通過(guò)其它社交平臺(tái)的授權(quán)登錄等簡(jiǎn)單的2步操作，來(lái)使用其產(chǎn)品的主要功能。

選擇分步注冊(cè)的原因是：

a、分步注冊(cè)適合移動(dòng)端設(shè)計(jì)。

移動(dòng)端屏幕小，加上彈出鍵盤(pán)，假設(shè)將多個(gè)輸入項(xiàng)放在一個(gè)頁(yè)面，會(huì)給用戶(hù)造成擁擠感，然而分步注冊(cè)則可較好的解決該問(wèn)題。

b、分步注冊(cè)可減少用戶(hù)點(diǎn)擊輸入框的次數(shù)。

幾乎所有的注冊(cè)關(guān)鍵步驟中都有：輸入手機(jī)號(hào)、獲取驗(yàn)證碼、設(shè)定密碼這3個(gè)步驟。在一個(gè)頁(yè)面中時(shí)，需要手動(dòng)逐項(xiàng)呼出鍵盤(pán)來(lái)填寫(xiě)。若遵安分步注冊(cè)，分成3個(gè)頁(yè)面的話(huà)，進(jìn)入每個(gè)頁(yè)面都會(huì)自動(dòng)置入焦點(diǎn)并彈出鍵盤(pán)，將減少用戶(hù)手動(dòng)點(diǎn)擊輸入框的次數(shù)。

c、分步注冊(cè)在必然程度上可提高轉(zhuǎn)化率。

非分步注冊(cè)在一個(gè)頁(yè)面中擁有較多輸入項(xiàng)，會(huì)加大用戶(hù)流失率。但是在某些情況下，分步注冊(cè)也并非是最抱負(fù)的選擇。當(dāng)分步注冊(cè)的步數(shù)增多到必然的數(shù)量，即使一個(gè)頁(yè)面上只完成一件事，其步驟繁雜的用戶(hù)體驗(yàn)，一樣是會(huì)造成較低的轉(zhuǎn)化率。

在上述分步注冊(cè)的思考和分析后，我們?cè)谑謾C(jī)QQ 7.0版本中針對(duì)注冊(cè)流程進(jìn)行Redesign。

設(shè)計(jì)前，不雅觀察數(shù)據(jù)中獲知手機(jī)QQ里有18.87%的用戶(hù)進(jìn)入注冊(cè)流程后，無(wú)法完成整個(gè)流程。為了解決這個(gè)問(wèn)題，我們通過(guò)縮短用戶(hù)注冊(cè)步驟，來(lái)讓用戶(hù)更容易的獲取QQ號(hào)，從而制止用戶(hù)在注冊(cè)QQ號(hào)中受挫。所以從改版前后的對(duì)比中可以看到我們?cè)谧?cè)小號(hào)時(shí)直接放號(hào)，不要手機(jī)驗(yàn)證，縮短步驟（從9步到6步）。

手機(jī)QQ在7.0版本的注冊(cè)Redesign中，首先分析頁(yè)面信息優(yōu)先級(jí)，將頁(yè)面信息按權(quán)重排序，依次為核心步驟層、內(nèi)容輸入層、輔助信息層，還有包羅可點(diǎn)擊交互操作的操作引導(dǎo)層。然后通過(guò)字號(hào)、字色與字重拉開(kāi)信息層級(jí)間的差距，最終將用戶(hù)聚焦到核心信息上來(lái)。

a、核心步驟層，是指用戶(hù)在短暫時(shí)間內(nèi)瀏覽頁(yè)面時(shí)，能讓其一目了然的獲知當(dāng)下應(yīng)該操作的某個(gè)步驟。

例如“輸入手機(jī)號(hào)碼”是這個(gè)頁(yè)面的重點(diǎn)核心內(nèi)容，其設(shè)計(jì)需要重點(diǎn)突出，且精煉文字。

b、內(nèi)容輸入層，是指用戶(hù)被核心步驟層吸引后，需要進(jìn)行相關(guān)內(nèi)容的輸入，例如昵稱(chēng)和密碼的輸入等等。

其設(shè)計(jì)需要引導(dǎo)用戶(hù)進(jìn)行輸入操作，而且在輸入中給用戶(hù)帶來(lái)便捷性。例如包孕密碼明文／暗文的切換，以及輸入驗(yàn)證碼到最后一位后直接進(jìn)入下一步，來(lái)確保便捷性。

c、輔助信息層，是指用戶(hù)理解了以上兩個(gè)信息層后，輔助信息層會(huì)有更多信息讓感興趣的用戶(hù)去了解。

這里往往提供更多說(shuō)明或者跳轉(zhuǎn)鏈接，例如使用條款和隱私政策等。

在Redesign中，我們也嘗試在視覺(jué)上使用了“黑、大、粗”的Complexion Reduction設(shè)計(jì)語(yǔ)言。Complexion Reduction設(shè)計(jì)語(yǔ)言是指使用更加簡(jiǎn)化的界面顏色，更大更突出的標(biāo)題字體，以及簡(jiǎn)潔的圖標(biāo)，來(lái)拉開(kāi)頁(yè)面信息層級(jí)，突出頁(yè)面主要功能。我們作為用戶(hù)體驗(yàn)設(shè)計(jì)師應(yīng)該進(jìn)行“最小化設(shè)計(jì)”和“逐步簡(jiǎn)化”的設(shè)計(jì)模式，毫不留情的砍掉“沒(méi)有重要功能的元素”，使用戶(hù)快速關(guān)注到信息的素質(zhì)。

標(biāo)簽：九江 林芝 東營(yíng) 鹽城 烏魯木齊