「登陆注册模块」设计

16 评论 54853 浏览 399 收藏 15 分钟

在互联网世界,用户是一切,如果用户都只是匆匆过客那么很难在产品中形成固定的用户群,在用户行为统计上也很难形成有价值的数据,如今就算是工具类的应用也都在建立用户系统,更不要说社区或社交类的产品。

用户系统建立的第一步就是登陆注册你的产品,这个模块可以非常简单,填下用户名密码就可以了,但是如今账户信息的重要性越来越大,安全性更是一个重要的因素,这其中隐藏着很多逻辑陷阱,所以在登陆注册系统的设计中也是一个便捷性与安全性的取舍平衡。

此文对登陆注册系统设计进行了总结,方便大家在产品设计时参考。

用户登陆注册系统分为两大类:

1.自建用户系统:邮箱、手机号、用户名

2.第三方账号授权用户系统:微信、微博、豆瓣

这其中,自建用户系统是自己控制和维护用户的一套登陆信息,对于日后找回密码或发送消息都有一定的方便性。第三方账号授权依托于第三方社交平台来登陆,属于一种绑定行为,忧点是用户注册方便,但缺乏控制性。

下面就几种注册方式的优缺点和注意事项进行总结:

自建用户系统

用户名

在自建用户系统中,单一用户名 + 密码的这种登陆方式已经很少见了,至多出现在一些内部系统中。对于云端的产品,一旦用户忘记用户名或密码,那么这个账户也就再也无法登陆了,除非找管理员证明身份来人工取回,这在如此大用户量的互联网产品中是不可行的。

所以用户名+密码的体系正在被淘汰,还比较常见的方式是用户名密码和邮箱或手机号码等一起使用,例如一些论坛都采用这种体系,注册是同时提供用户名密码和邮箱,在登陆时可以用用户名+密码快速登陆。

手机号注册

手机号注册多见于移动端产品中,注册时使用手机号当做用户名,此时需要手机接收验证码来确认配对,配对可以为了确认注册的手机号是用户本人的,可以防止输入手误或他人恶意注册带来的风险。手机配对之后再输入密码和一些产品需要的相关信息,如昵称、性别、兴趣等,这些就与主要注册流程无关了。以下为手机注册的流程图(此流程图只绘制了最核心的流程,如果在PRD用,还需要加工补全逻辑。)

80868-12fd35ef83d1dca4

手机号登录注册

手机注册的优势在于:

a.对于移动端产品,验证方便,在注册时可以比较方便地让用户完成验证操作,而且在一个连贯的流程中完成(很多时候阅读验证码不需要打开短息,只是在上弹提示中就可以获取)

b.手机号记忆方便,对用户名的记忆和密码找回都非常方便

c.手机号码是用户最稳定的一个身份id,掌握其手机号码可以展开更多的服务,例如通过访问通讯录构建关系

d.实时的消息推送

手机注册的问题在于:

a.手机号虽然是全球唯一的,但是是复用的,也就是当你不用一个手机号之后,运营商会把这个号重复利用卖给下一个人

b.手机作为现代人的一大器官,手机号码的泄露会引起非常多的麻烦,比如垃圾短信、骚扰电话之类的,所以用户多会比较谨慎地选择

邮箱注册

邮箱注册作为最常用的注册方式,最早从Web端开始盛行,在移动端也普遍保留。作为一个很通用的注册方式,邮箱注册的讲究其实最多,因为邮箱注册的验证流程需要在外围(产品外)进行,会打断注册的连贯性,但是如果省略验证过程,又会丧失许多安全性,所以在邮箱验证的时机上有许多不同的策略。

邮箱最大的特点就是,邮箱地址是私有的,访问是私密的,但是地址是公开的。这会带来两种风险,1.别人拿到你邮箱的可能性和成本都很低;2.生成邮箱来制造假账户的成本也相对低

我们先来看下以下三种注册流程:

80868-47767af241a5cad1

流程1

流程1是不经过任何验证的邮箱注册流程,这种流程会带来以下问题:

如果Mr.X用你的邮箱注册了一个网站,并且进行了很多活动,当你来到这个网站的时候,你会发现自己的邮箱已经注册,于是用密码找回功能进入了网站,这时候你可能会发现自己的账户已经发布了许多广告或黄色图片,要不就是订阅了一堆不知名的账户。

那么我们就加上邮箱验证:

80868-03c92d701ed82a9e

流程2

流程2加入了邮箱验证,不验证的情况下无法登陆,这就解决了自己的邮箱被别人注册的问题。但是还有一种情况需要考虑,当你翻看邮箱时,可能会顺手就点击了确认邮件而忘了是否是自己注册的。所以流程2还可能有这个风险:

如果Mr.X用你的邮箱注册了一个网站,并发送了确认邮件,你顺手就点击了邮件里的确认邮件。这时候Mr.X就掌握了你邮箱验证后的账号,并从事了很多活动。后面的故事一样,当你来到这个网站的时候,你会发现自己的邮箱已经注册,于是…

那么我们就在验证的时候判断用户的登陆状态:

80868-6653c652448dcdec

流程3

流程3在验证邮箱的同时验证登录状态,若没有登录则必须登录后才能验证邮箱,这样就避免了上面提到的被钓鱼的问题。

此处的另一种做法是,首次只能输入邮箱,待邮箱验证后再输入密码,这样也就不需要在验证邮箱时判断登录状态了。

经过如上的几部验证,安全性是保证了,但是用户很有可能因为繁琐的流程而在注册过程中流失。在市场营销中,有一种策略叫差异定价,即对不同类型的用户实行不同的定价方式。对于用户注册的成本,也可以采用这个策略,请见如下流程:

80868-9f3db962f297cd3e

流程4

流程4的一切的主要流程还是不变的,但是在用户完成邮箱密码的输入后即可登录,但是是以待条件的状态登录,例如不可以发布,不可以评论等等,当用户需要使用这些功能的时候再提示用户去验证。这样可以提升一些用户的使用体验。

邮箱账户的优势在于:

1.唯一id,除手机号外最容易记忆的id

2.富媒体推送,可向用户推送具有丰富内容的邮件,引导用户回到主站

3.相对于手机,邮箱的私密性相对低,风险敏感性低

邮箱的劣势在于:

验证需要跳出,所以邮箱注册会存在体验与安全性的矛盾。

三方账号系统

三方账号注册是用大用户量的社交网络的账户系统来注册自己的系统,像微信、微博、QQ这些产品拥有超大的用户量,一般用户都会有这些产品的账号,利用他们开放出的api来进行注册验证具有如下几个优势:

1.省去了用户管理账户的麻烦

2.省去了验证步骤。不论是手机还是邮箱注册都需要验证的步骤,由于三方账号本身在注册的时候已经进行过相关的验证,所以导入三方账号时省去了验证的麻烦。

3.通过三方账户可以导入用户的一些相关的信息,如邮箱地址,昵称,头像等,降低用户注册的成本,还有就是在三方账号的用户关系,如微博的好友关系等。

4.快捷登录,无需输入用户名密码,只要手机上安装有三方应用或浏览器cookie中有三方登录的信息,就可以快速一键登录。

三方账户的优点多多,但毕竟是别人的账户,一旦形成竞争或链接有任何问题,会导致用户登录不了,所以独立使用三方账户需要谨慎。

ID系统

上面说了两类若干种登录注册方式,但是万变不离其宗,这些用户对应到系统中都会有一个最唯一的标识,那就是“ID”,所以所有的注册方式,包括邮箱、手机、三方都是与这个ID绑定。那么如何绑定,绑定的程度是什么样,会根据不同的产品和场景来制定策略。这里可以从不同的维度来考虑。

再设计时需要考虑3个问题:

1.是否需要有自建系统,采用哪种方式

2.是否需要三方系统,采用哪种三方

3.是否强制绑定某一方式作为主键

对于这三个问题,我还没有特别好的总结,下面结合具体案例来分析下淘宝的登录注册系统:

首先,从登录界面可以看出,淘宝采用了自建系统 + 三方登录的模式,其中自建系统中手机号、用户名(会员名)、邮箱都可以登录。三方方面只采用了微博,原因不用多说了。此外还有支付宝账户登录,属于同门的三方账户关联。

淘宝作为中国最大的电商平台,当然会采用自建系统,并且由于用户和场景的多样,采用了多种自建系统平行登录的方式。

80868-f77682ccd1365774

淘宝登录注册系统

在注册方面,淘宝采用手机号、邮箱、用户名同时注册的方式,注册时这三个自建系统的方式都为必填,在注册完成后会有很强的引导绑定微博账号。同时还会强制同步创建支付宝账户。

80868-fca79c28c452fd7f

淘宝注册

80868-0ec3d48b58bd1062

淘宝注册

所以总结起来,淘宝采用了自建系统 + 三方的方式,且将自建系统作为核心主键,三种方式并行且都必填,一次性建立一个非常全面的账号,但如此的流程不免有些繁琐。但是如此强势的淘宝,注册成本稍高一些也正常的,总结起来有如下原因:

1.品牌和产品强势,所以一定是自建系统为主导。

2.由于不同的场景需要,所以三种方式平行作为主键:邮箱作为最通用的注册方式必不可少;用户名作为淘宝、旺旺中的显示名称方便记忆;手机号对于移动端的布局起到关键作用。

3.由于安全性的考虑,所以同时绑定手机号和邮箱,方便找回和身份确认。

4.由于战略问题,只采用微博作为三方的入口,且只能注册后绑定,作为登录的补充,在注册时无法从三方作为入口。

结束

登录注册系统看似简单,但是里面的各种策略和逻辑非常的灵活和多变,并且隐藏着各种安全方面的陷阱,同时还要考虑用户体验的便捷性。登录注册系统的设计其实没有一个千篇一律的模板,都需要根据自己产品系统的特点来灵活处置,并且做好每一步的引导,处处都是细节。

此文只作为抛砖引玉,呈现出一个登录注册系统的概貌,欢迎大家交流~

 

作者:wuziwen

来源:http://www.jianshu.com/p/9c92aa5b262b#

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 请假一句,邮箱注册的时候,再一次判断登陆状态是指的什么???

    来自四川 回复
  2. >alert(123);</

    来自四川 回复
  3. 邮箱注册验证有两种方式:
    第一、链接方式,直接点击自动跳转比较方便;为避免“如果Mr.X用你的邮箱注册了一个网站,并发送了确认邮件,你顺手就点击了邮件里的确认邮件。”需要再一次判断登录状态(如作者所说)
    第二、验证码方式。需要复制和粘贴,但方便使用独立客户端的用户,不需要跳转~直接复制验证码而后直接注册并登录即可。

    来自北京 回复
    1. 请教一句~不是很清楚,需要再一次判断登陆状态,指的是什么意思呢?是不是在一定时间段内,点击链接才有效果,还是指必须保持注册界面不关闭?

      来自四川 回复
    2. 在判断一次登陆状态指的什么意思?谢谢回答

      来自四川 回复
  4. 新改版的网页设计不错,但是收藏的UI太像QQ空间,❤表示收藏可能更符合常规认知。

    来自广东 回复
  5. 此文很有意义,就是还有一个小小的问题。 🙂

    来自湖北 回复
    1. 流程四 应该是先验证邮箱 无论用户是否选择去验证邮箱 都可以进行登录,只不过是没有验证的用户功能受限罢了,但是按照小编的画法,未验证的用户根本没办法进行登录 始终是在验证的环节进行循环 。

      流程图中判断是 问 是否登录 但最后闭环是 注册成功……这个让新手 理解起来有点歧义

      来自北京 回复
  6. 有意思

    来自湖北 回复
  7. 挺不错的。关于“避免使用他人账号注册”的内容 很有启发性。

    来自广东 回复
  8. 挺不错的,常见的功能得到比较详细的分析。

    来自北京 回复