登錄模塊設(shè)計

事非經(jīng)過不知難

登錄注冊是一個相對復(fù)雜的體系——登錄前的注冊登錄方式考量;登錄過程中的條件和狀態(tài)變更呐伞;登錄后的賬號信息呈現(xiàn)和更新敌卓;異地、異設(shè)備伶氢、多設(shè)備登錄及賬號信息同步的考量趟径;登錄賬號的安全考量(token有效期);退出登錄的條件與限制(退出登錄/切換賬號)癣防;注銷賬號的條件與限制等蜗巧。

在真正做登錄功能之前,并不知道它會有這么多“坑”蕾盯,本篇就APP登錄的部分環(huán)節(jié)做一些總結(jié)幕屹,僅供參考(紙上得來終覺淺,絕知此事要躬行~)

文章重點如下:

本文重點

解讀:

本文從實踐的角度出發(fā)盹靴,介紹注冊登錄功能在實際設(shè)計中需要考慮的因素括改。功能設(shè)計方面尺铣,選取目前常見的登錄方式:手機快捷登錄和第三方賬號登錄(兩者均首次登錄即注冊概疆,因此不對注冊功能進行詳細闡述)盐捷。

我們要正確使用“登錄”而不是“登陸”

具體解釋可參考:登錄和登陸有什么區(qū)別?到底哪個正確?

為什么要有注冊登錄功能

就當前的互聯(lián)網(wǎng)產(chǎn)品锄贷,注冊登錄功能已經(jīng)成為了標配揽惹,然而秋忙,真的是每個產(chǎn)品都一定需要這個功能嗎盔沫?仔細思考锌雀,可以從用戶和產(chǎn)品兩個角度闡述登錄功能的必要性:

用戶:通過登錄

1.建立個人空間,形成身份唯一標識迅诬,記錄個人相關(guān)數(shù)據(jù)(例如閱讀或者收藏記錄)

2.進行賬號信息同步腋逆,擺脫設(shè)備的限制(例如百度云網(wǎng)盤、有道云筆記等)

3.使用產(chǎn)品的某些功能(例如淘寶發(fā)起購買)

4.進行個人隱私安全和保護(例如酒店預(yù)訂記錄等)

產(chǎn)品:通過登錄

1.獲取用戶數(shù)據(jù)侈贷,注冊登錄=賬戶信息=用戶數(shù)據(jù)=變現(xiàn)前提

? ? ? ? a.找到“二八定律”中高價值的用戶惩歉,建立有效的會員體系,養(yǎng)成策略俏蛮,提高用戶的粘度和退出門檻

? ? ? ? b.精準營銷撑蚌,通過用戶的來源數(shù)據(jù)選擇投放優(yōu)質(zhì)投放渠道,

? ? ? ? c.提升用戶體驗搏屑,對用戶的行為數(shù)據(jù)建模來優(yōu)化產(chǎn)品策略争涌,提供個性化服務(wù),eg:個性化推薦

? ? ? ? d.數(shù)據(jù)挖掘辣恋,發(fā)現(xiàn)用戶的需求/痛點亮垫,跨業(yè)務(wù)線給予用戶提供立體服務(wù)

2.保證賬戶唯一性,是賬號安全伟骨、信息存儲的前提饮潦,同時有助于數(shù)據(jù)的精準統(tǒng)計

(可以作為用戶在產(chǎn)品中的唯一標識,將一個賬戶認定成一張身份證)

功能設(shè)計——登錄功能前提

選取什么樣的登錄方式携狭,還是得按照產(chǎn)品定位與發(fā)展方向噠~

短信登錄:需要開啟運營商通道

第三方賬號登錄:申請第三方賬號继蜡、接入第三方sdk

(參考:第三方賬號登錄功能接入全流程

功能設(shè)計——登錄方式的選擇

已知當前市面上常見的登錄方式有3種,賬號密碼(多為手機號+密碼)逛腿、手機快捷登錄稀并、第三方聯(lián)合登錄,三種方式的優(yōu)勢劣勢如下:

三種常見登錄方式優(yōu)劣

PS:根據(jù)18年網(wǎng)民注冊習(xí)慣单默,倘若已有社交賬號的便捷登錄可選碘举,88.1%的受訪者會優(yōu)先社交賬號登錄(2018中國網(wǎng)民個人隱私狀況調(diào)查報告

本文主要就手機驗證碼快捷登錄和第三方賬號登錄在設(shè)計過程中需要注意的點進行闡述

功能設(shè)計-手機驗證碼快捷登錄

手機快捷登錄主要包含以下三個部分:

1.手機號碼的輸入、展示雕凹、驗證

2.驗證碼的獲取殴俱、輸入政冻、驗證

3.防盜刷機制的建立


手機號

手機快捷登錄之手機號輸入

手機快捷登錄,輸入手機號前后线欲,均有諸多細節(jié)需要考慮:

輸入前:

默認展示項:

1.默認提示文字:請輸入手機號碼(示例)

2.光標置于手機號碼輸入框

3.回顯上次登錄使用的手機號碼(如果有)

4.區(qū)號的展示與選擇(根據(jù)產(chǎn)品定位抉擇是否需要支持非大陸地區(qū)手機號碼明场,如支持,考慮結(jié)合位置信息展示默認區(qū)號李丰,本文基于僅支持中國大陸11位手機號碼的登錄進行闡述)

交互細節(jié):

點擊輸入框苦锨,彈出數(shù)字鍵盤(包含控制鍵盤狀態(tài):回車、清除項的交互)

輸入中:

輸入鍵盤:針對手機號碼登錄趴泌,展示數(shù)字鍵盤

輸入展示:針對11位手機號碼舟舒,考慮344樣式展示

輸入限制:

? ? 1.限制輸入的手機號碼長度(考慮復(fù)制粘貼時的長度限制、超出限制時的反饋提示)

? ? 2.限制輸入的字符(僅支持數(shù)字嗜憔,不支持其他文字符號)

輸入操作:支持對輸入框中的輸入項進行一鍵刪除

輸入后:

針對輸入的手機號碼進行驗證(自動校驗/手動校驗)秃励,可能存在的情況如下:

1.手機號碼正常

2.手機號碼長度不夠(輸入不足11位,提示:請輸入11位手機號碼)

3.手機號碼不存在(輸入滿足手機號碼的條件吉捶,但是號碼未使用)

4.手機號碼不正確(輸入項非手機號碼夺鲜,例如中國大陸地區(qū)非1開通頭)

------針對上述不同情況,進行不同的提示及引導(dǎo)(常用toast提示)

中國大陸11位手機號碼的規(guī)則及正則匹配公式(來源網(wǎng)絡(luò))

驗證碼

手機快捷登錄之驗證碼

手機快捷登錄呐舔,驗證碼的獲取币励、輸入、驗證各環(huán)節(jié)關(guān)鍵點如下:

獲取驗證碼

獲取前提:

手機號碼通過驗證后珊拼,可獲取驗證碼

交互與展示:

1.獲取驗證碼btn可做狀態(tài)限制(默認置灰食呻,當輸入11位手機號碼時,變?yōu)榭牲c擊狀態(tài))

2.點擊獲取驗證碼澎现,首先對手機號碼進行校驗仅胞,校驗通過后,可發(fā)送短信

3.手機號碼校驗通過后昔头,客戶端進行驗證碼發(fā)送提示(驗證碼已發(fā)送饼问,請注意查收短信)

4.獲取驗證碼過程中,客戶端增加倒計時限制(一般60S)揭斧,一定程度上防止盜刷并能夠給用戶正確的操作反饋和等待時間,倒計時結(jié)束后峻堰,可重新獲取驗證碼

5.獲取驗證碼倒計時過程中讹开,用戶選擇退出,交互提示的考量(a:直接退出捐名,清除倒計時狀態(tài)旦万,不做任何提示;b:彈窗提示正在獲取驗證碼是否等待)

6.獲取驗證碼過程中镶蹋,焦點需要定位到驗證碼輸入框(默認提示文字:輸入驗證碼)

獲取限制:

限制驗證碼的獲取頻率成艘,常見幾種方案:

1.60S內(nèi)不能重復(fù)獲取

2.限制單人3或者5分鐘內(nèi)的操作次數(shù)

3.限制單人單天的操作次數(shù)

獲取異常:

1.斷網(wǎng):進行斷網(wǎng)提示(常見toast)

2.未收到短信:常見用語音驗證替代(本文未做詳細闡述)或者1分鐘后重新獲取

3.驗證碼發(fā)送失斏桶搿(未知異常,提示重新獲取淆两,并返回錯誤碼進行上報)

輸入驗證碼

輸入鍵盤:

展示數(shù)字鍵盤

輸入限制:

1.限制輸入的驗證碼長度(常見4-6位断箫,考慮粘貼時的長度限制、超出限制時的反饋提示)

2.限制輸入的字符(僅支持數(shù)字秋冰,不支持其他文字符號)

輸入交互:

1.自動填充(iOS12)

2.手動輸入(輸入限制)

驗證碼校驗

輸入手機號和驗證碼后仲义,即可登錄,此時需要對手機號碼和驗證碼進行校驗:

手機號校驗及提示見上文剑勾,驗證碼校驗及提示如下:

1.驗證碼失效/過期(常見驗證碼5分鐘內(nèi)有效)(toast:驗證碼過期埃撵,請重新獲取)

2.驗證碼錯誤(toast:請輸入正確的驗證碼)

其他登錄可能異常:

1.斷網(wǎng)

2.其他未知登錄異常(需要返回錯誤碼進行上報)


防盜刷短信

由于短信驗證消耗成本虽另,因此需要考慮短信登錄時的防盜刷機制

(可考慮方案:手機號暂刘、ip、圖形驗證捂刺、限制發(fā)送間隔谣拣、30分鐘內(nèi)同一個驗證碼等)

具體如下:

1.間隔發(fā)送:

? ? a.上文已經(jīng)提到,60-120S間隔發(fā)送叠萍,保障用戶體驗芝发,避免部分惡意驗證

? ? b.頻繁操作限制,例如5分鐘內(nèi)僅支持最多3次發(fā)送

2.手機號碼限制:例如一個手機號碼一天最多可以發(fā)送20次

3.緩存同一手機號碼的驗證碼苛谷,30分鐘內(nèi)使用同一驗證碼(考慮技術(shù)方案及緩存實現(xiàn))

4.IP限制:根據(jù)自己的業(yè)務(wù)特點辅鲸,設(shè)置每個IP每天的最大發(fā)送量

5.圖形驗證碼限制:驗證次數(shù)達到限制后,出現(xiàn)圖形驗證碼腹殿,驗證通過之后才會發(fā)送短信驗證碼(例如以天為單位独悴,從第5次發(fā)送開始,出現(xiàn)圖片驗證锣尉,之前不展示圖片驗證)

其中刻炒,1-4均有方法可破解,圖形驗證碼相對有效防止惡意攻擊


功能設(shè)計-第三方賬號登錄

使用第三方賬號登錄前自沧,產(chǎn)品側(cè)需要申請第三方賬號坟奥,接入第三方SDK。常見的快捷登錄方式主要是:微信拇厢、QQ爱谁、微博

第三方賬號登錄的難點在與綁定手機號碼的流程以及登錄成功后的第三方賬號用戶提取規(guī)則(頭像、昵稱等)

第三方賬號登錄

第三方賬號登錄

登錄前:默認登錄頁標記上冊登錄的方式

登錄中:點擊授權(quán)登錄后孝偎,先返回默認登錄頁(此時需要有加載狀態(tài))访敌,然后跳轉(zhuǎn)至登錄完成頁面(針對不需要綁定手機號碼的場景)

登錄后:應(yīng)盡量提取所有可獲得的第三方用戶信息(頭像、昵稱衣盾、性別寺旺、年齡爷抓、地區(qū)等)

第三方賬戶登錄——綁定手機號碼

使用第三方賬戶登錄,如果不綁定手機阻塑,則可能無法獲得用戶的有效信息且無法保證賬戶的唯一性蓝撇,然而強制綁定手機號勢必會提高注冊門檻,損失用戶(而且用戶會有上當?shù)母杏X叮姑,還不如直接手機號碼登錄)唉地,因此常見的有三種方案:

1.保障用戶體驗為主:不顯示綁定手機號碼提示

2.產(chǎn)品數(shù)據(jù)為主:強制綁定手機號碼

3.兼容兩者,提示綁定手機號碼传透,但是可跳過

PS:無論以上哪種方式耘沼,均需要考慮在登錄后提供賬號綁定功能


綁定手機號碼為第三方賬號授權(quán)成功之后,流程與手機號碼登錄時相似朱盐,需要考慮手機號碼的輸入群嗤、展示與驗證;考慮驗證碼的獲取兵琳、輸入狂秘、驗證;考慮綁定過程中的異常提示

第三方登錄綁定手機號碼流程如下(取方案3躯肌,綁定可跳過):

第三方登錄綁定手機號碼

注意點:

1.驗證手機號碼時者春,新增手機號碼是否已經(jīng)存在的驗證(即該手機號碼是否已經(jīng)使用于此應(yīng)用)

2.如果手機號碼存在,則需要驗證手機號碼是否已經(jīng)綁定同一平臺的賬戶(例如用QQ1登錄的時候清女,判斷該的手機號碼是否已經(jīng)關(guān)聯(lián)QQ2)钱烟,如果未綁定,則正常進行下一步操作嫡丙;如果已綁定拴袭,則需要切換手機號碼、使用已有賬號登錄或者直接跳過不再綁定手機號碼

3.此處綁定手機號碼仍然涉及短信的防盜刷機制(與手機快捷登錄時一致)

4.個人中心需要建立多賬號的綁定與解綁機制(以手機號碼對應(yīng)的用戶id為主id)

用戶信息提取

使用第三方賬戶登錄時曙博,可以獲得一些用戶的已有信息拥刻,例如頭像、昵稱父泳、性別般哼、年齡等,如何提取惠窄、存儲逝她、展示這些信息,需要進行考量(下文)

登錄后睬捶,用戶信息的獲取與展示規(guī)則

無論是使用手機快捷登錄還是使用第三方賬號登錄,我們總能獲得一些信息近刘,來填充用戶的個人信息(頭像擒贸、昵稱等)臀晃,以下列舉常用的一些用戶信息的獲取與展示規(guī)則:

個人信息的展示優(yōu)先級:人為修改>第三方獲取>默認

頭像:

手機號碼登錄:使用默認頭像

第三方登錄:使用三方賬戶頭像

用戶手動修改:支持拍照或者從相冊中選取

PS:需要考慮:圖片尺寸限制、格式限制(例如不支持動圖)介劫、圖片合法性限制(可接入第三方頭像審核服務(wù))

昵稱:

昵稱限制:字符數(shù)限制徽惋、輸入格式限制(例如是否支持特殊字符和表情等)、重復(fù)性限制(昵稱平臺唯一性)

手機號登錄:使用默認昵稱(一般為XX用戶+手機號碼后四位座韵;手機號碼中間4為加密等)

第三方登錄:直接使用第三方昵稱险绘,考慮重復(fù)性、字符數(shù)量和格式限制

PS:昵稱需進行審核誉碴,比較簡單的方式可直接進行敏感詞過濾

性別:

未選擇時宦棺,考慮是否進行默認定義

手機號碼登錄:默認未選擇,部分產(chǎn)品在登錄后直接提供性別選擇頁

第三方登錄:則直接展示第三方性別信息

年齡/生日:

考慮開始時間(最早時間):例如1900年1月1日

最晚時間:今年or今天

默認展示時間:取當前用戶畫像數(shù)據(jù)黔帕,例如用戶大多為95后剛畢業(yè)大學(xué)生代咸,則默認展示19960101等

第三方登錄時,獲取到的年齡未在定義內(nèi)成黄,則不做取用

登錄后-賬號注銷

工信部規(guī)定要求移動端應(yīng)用必須支持賬號的主動注銷功能呐芥,完整的注冊登錄流程應(yīng)包含賬戶注銷功能,具體注銷要求各應(yīng)用自定奋岁,一般要求無未用資產(chǎn)思瘟、賬戶無與其他產(chǎn)品、網(wǎng)站的授權(quán)登錄或綁定關(guān)系闻伶、賬戶30天內(nèi)無修改綁定或手機號碼等行為

具體可參考:為了響應(yīng)工信部要求滨攻,我們整理了這些網(wǎng)絡(luò)賬戶注銷指南

數(shù)據(jù)統(tǒng)計-登錄

最后簡要說明一下登錄相關(guān)的數(shù)據(jù)統(tǒng)計:

1.短信消耗數(shù)(核算成本)

2.用戶數(shù)據(jù)(不同登錄方式的登錄人數(shù)——整體數(shù)據(jù),功能or入口改進)

3.登錄漏斗(不同登錄方式虾攻、不同第三方的登錄成功率铡买、各環(huán)節(jié)漏斗——技術(shù)優(yōu)化)

------------------------------

本文僅從需求設(shè)計角度簡單的闡述登錄體系的部分環(huán)節(jié),后續(xù)會不定期更新完善噠~

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末霎箍,一起剝皮案震驚了整個濱河市奇钞,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌漂坏,老刑警劉巖景埃,帶你破解...
    沈念sama閱讀 218,858評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異顶别,居然都是意外死亡谷徙,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評論 3 395
  • 文/潘曉璐 我一進店門驯绎,熙熙樓的掌柜王于貴愁眉苦臉地迎上來完慧,“玉大人,你說我怎么就攤上這事剩失∏幔” “怎么了册着?”我有些...
    開封第一講書人閱讀 165,282評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長脾歧。 經(jīng)常有香客問我甲捏,道長,這世上最難降的妖魔是什么鞭执? 我笑而不...
    開封第一講書人閱讀 58,842評論 1 295
  • 正文 為了忘掉前任司顿,我火速辦了婚禮,結(jié)果婚禮上兄纺,老公的妹妹穿的比我還像新娘大溜。我一直安慰自己,他們只是感情好囤热,可當我...
    茶點故事閱讀 67,857評論 6 392
  • 文/花漫 我一把揭開白布猎提。 她就那樣靜靜地躺著,像睡著了一般旁蔼。 火紅的嫁衣襯著肌膚如雪锨苏。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,679評論 1 305
  • 那天棺聊,我揣著相機與錄音伞租,去河邊找鬼。 笑死限佩,一個胖子當著我的面吹牛葵诈,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播祟同,決...
    沈念sama閱讀 40,406評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼作喘,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了晕城?” 一聲冷哼從身側(cè)響起泞坦,我...
    開封第一講書人閱讀 39,311評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎砖顷,沒想到半個月后贰锁,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,767評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡滤蝠,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年豌熄,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片物咳。...
    茶點故事閱讀 40,090評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡锣险,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情囱持,我是刑警寧澤夯接,帶...
    沈念sama閱讀 35,785評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站纷妆,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏晴弃。R本人自食惡果不足惜掩幢,卻給世界環(huán)境...
    茶點故事閱讀 41,420評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望上鞠。 院中可真熱鬧际邻,春花似錦、人聲如沸芍阎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,988評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽谴咸。三九已至轮听,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間岭佳,已是汗流浹背血巍。 一陣腳步聲響...
    開封第一講書人閱讀 33,101評論 1 271
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留珊随,地道東北人述寡。 一個月前我還...
    沈念sama閱讀 48,298評論 3 372
  • 正文 我出身青樓,卻偏偏與公主長得像叶洞,于是被迫代替她去往敵國和親鲫凶。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,033評論 2 355

推薦閱讀更多精彩內(nèi)容