注册登录一贯是运用中必不可少的一环,用户打开运用可能第一步便是登录页面,这相称于一款运用的脸面,也是用户利用产品的源头。
当然也是由于不常被用到以是更最随意马虎被忽略,它作为一项根本功能,利用场景一样平常是用户初次利用运用或者退出登录,又或是大版本更新和登录过期才会利用到。

注册登录的意义就在于给用户独占的个人中央,包括数据的同步,或是用户注册后会通过用户已完善的资料进行干系的内容推举。

登录相对而言属于高频次的操作,注册、修正密码等属于相对低频次的操作,但是他们都会关联到产品内的个人资料和设置模块。
险些所有的社走运用都是须要注册登录的,用户拥有了个人账号才能连续利用产品。

app登录html模板APP UI 构造注册u0026登录 AJAX

当然也有一些系统的运用是不须要注册登录就可以利用的,比如:系统自带的打算器、日历、景象等或是一些第三方的轻运用,这里就不多赘述了,下面紧张还是说说须要用到注册登录功能的情形。

还是先来看一下整体构造:

(以下图片来源于运用截图,仅作为学习互换利用)

一、注册登录的办法1. 只利用第三方账号注册登录

这种办法比较少但是无疑是最快捷的办法,相信大家平时该当用这种办法也比较多,由于可以避免利用手机注册带来的繁琐步骤,可以节约很多韶光。

你在第三方运用中进行授权后产品会直接调用接口,天生ID登录后,你的头像、昵称等个人信息乃至可能同时会获取你的好友列表,让你知道还有哪些好友也在利用产品,可以有效地减少对产品的陌生感,同时也便于运用在第三方中进行分享。

当然这种办法对产品也很有利,由于相信很多用户在不理解产品的情形下,用户可能只是想初步理解一下产品,但是又不想进行手机注册那么麻烦,以是就直策应用第三方进行注册吧,待进入运用初步利用理解后,再通过产品的用户勾引(比如:红点标记或是局部勾引等)功能再进行手机号/邮箱/微信/微博等账号的绑定,这样做对新用户的产生有积极浸染。

我碰着过当已经利用了第三方运用注册登录了之后,会立即涌现让用户绑定手机号的页面,这样做是想快速产生新用户,出发点是好的,但是我以为用户在不理解产品的情形下,绑定手机号的可能性很低。

以是最好可以在绑定手机号页面有“跳过”功能,给用户选择的余地,不要逼迫用户,待初步理解产品后再通过勾引进行绑定,这样做最佳。

2. 只利用手机号注册登录

利用手机号获取验证码是目前最常用的注册登录办法,这种办法的上风不必多说,相信大家都很熟习流程,通过发送短信获取验证码在60-90秒内进行注册登录,这么做是为了确认用户拥有该手机号的利用权。
手机号+密码是用户常用的办法,而手机号+验证码是比较简便的办法。

这里把稳一点的是在输入手机号后,为了让用户查看是否输入精确,建议手机号显示样式为3-4-4模式(比如:156 5555 5555),这些都是细微之处,虽然无关大雅,但是可以看出一个产品的存心之处,比如:下图可以比拟一下,明显图二更优。

手机号也是商家进行用户掩护的有效手段,毕竟手机都是随身携带,可以在节假日发送祝福或是匆匆销短信,也可以在你长期未利用产品,进行短信提示,避免你将产品遗忘,但是过度的短信轰炸则会让用户感到反感。

其余利用手机号注册登录,须要做一个判断,是否是第一次登录,是的话就跳转勾引页,不是的话就跳转至首页。

这里插一句题外话,你们有没有碰着过在已经注册成功后,但是还须要重新输入账号密码登录的情形,实在这种做法个人以为是比较多余的,可能2次输入账号密码可以加强用户的影象。
但是可能很多人用手机号注册都是用的一个同密码,由于现在的运用可选择的余地实在是太多了,如果每个运用都利用不同的密码可能很难记得住。

3. 利用手机号/第三方账号注册登录

这种样式是最常见的,也是上面两种样式的结合,这种样式给用户留有选择的余地,志愿利用手机号或是第三方。
但是一样平常这样的组合办法多数是希望用户利用手机号注册,以是手机注册登录比较突出,第三方注册会置于页面底部,相对弱化。

但是还有一类是希望用户利用第三方登录,弱化手机号注册登录的情形。
BAT旗下的浩瀚运用,会利用一个账号或是进行账号关联,比如:阿里旗下的运用闲鱼、菜鸟裹裹等,登录时为了用户数据之间连接,会推举用户利用淘宝账号进行登录,从而弱化了手机号注册登录,这是出于产品属性或是计策需求考虑,无可厚非。

4. 利用邮箱注册登录

利用邮箱进行注册登录也是比较常用的办法,多数用于pc端,邮箱随意马虎影象,便于频繁利用的产品,注册后邮箱会收到验证链接,验证成功后会自动跳转进入该网页首页。
由于web端屏幕较大,还是和移动端有点差别,须要填写的表单可能也会比较多,关于表单的设计可以参照我早期的文章:《进行表单设计须要把稳这十点》

当然移动端也有利用邮箱注册的,可能是国外的运用居多,比如:facebook、twitter、dribbble…或是海内的运用同时拥有网页和移动端,可以将用户数据进行同步。

5. 先体验后注册登录

这种办法大概多见,一样平常多为阅读类、游戏类或是电商类产品,用户多为游客状态,可能只是进来走走,可能暂时还没有利用到添加、收藏、关注、评论、购买等功能,如果利用这些功能就必须要进行注册登录了,把稳在完成注册登录后记得页面要回到之前浏览的页面,而不是回到首页。

6. 短信注册

比较少见的一种办法,通过编辑短信发送至XXX后,可获取账号和密码。
这种办法属于早期的一种办法,现在基本用不到了,就不多说了。

二、注册登录页面要点1. 简洁风 VS logo+输入框

iOS 11更新带动了新的设计趋势,大标题+留白被广泛利用,注册登录也不例外,现在很多产品都利用相对简洁的设计(下面左图),仅利用大标题和必要的线框和提示语,让用户只聚焦注册登录本身,去除多余的滋扰元素,可以节省用户的韶光。

相对早期的设计手腕是在页面中加入logo(下面右图),好处是可以进一步强化用户对产品品牌的影象点。
两种办法各有优点,没有对错,产品可以酌情利用。

2. 分步骤注册登录

现在有很多运用是采取分步骤进行注册的,比如先输入手机号,点击“下一步”的同时,系统查询该手机号是否可以注册,通过的话则进入输入验证码页面,这样做的好处是可以及时反馈给用户,避免了用户在输完手机号和验证码之后涌现缺点toast的情形。

须要把稳的是步骤不宜过多,建议3步以内,如果你的产品对用户来说不是非用不可,可能会有很多用户会放弃注册。

3. 注册登录合二为一

这种办法和分步骤注册类似,将注册和登录合到一起,不管你是否有注册,只要输入手机号再填写验证码,成功后即可利用产品,比如:小黄车便是利用这一办法。

4. 输入框提示语

输入框提示语是必不可少的,措词须要简洁,大部分的做法是点击输入框后提示语自动消逝,这样做也是可以,毕竟须要填写的选项不是很多,用户不易忘却。
当然更好的做法是保留提示语,比如:星巴克的登录页面,在点击输入框后,提示语会上移,依旧保留,只是这样的开拓本钱可能会稍大一点。

5. 忘却密码

忘却密码的功能一样平常都是放在登录页面,由于两者有较强的关联性。
利用忘却密码功能一样平常是通过手机号发送验证码,验证通过后再进行新密码的设置。
如果起初是用邮箱注册登录的话,就要到邮箱中进行验证,验证通过后再进行新密码的设置。

6. toast提示

这里的toast提示一样平常用于有缺点发生的情形下,比如:账号不存在、账号已被占用、密码缺点、验证码缺点等,及时的反馈给用户注册登录不堪利的地方在哪里,以免用户摸不着头脑,愤而离开运用。

三、其他要点1. 安全码

出于安全考虑,有些运用会让用户输入图形验证码、字符验证码、旋转图片、滑动验证等办法,目的是确认是人为注册而非软件恶意注册。

2. 用户协议

用户协议看似非常的不起眼,用户也很少会去点击查看,涌如今注书页面的情形居多。
早期一样平常是默认当选中状态或是点击注册即视为赞许协议条款(图一),用户填完账户密码之后点击注册就完成了。

但是前去年支付宝默认用户协议当选中导致的一系列新闻提醒我们,用户协议最好须要用户自己去点击确认,现在很多运用也开始这么做,在没有勾选用户协议之前,“注册”button是无法点击的(图二)。

3. 密码眼睛开合

出于利用场景考虑,比如:在户外或是注册登录时身边有人,为了有效保护用户的密码隐私,可在输入密码时关闭眼睛icon,只显示密码点。
开启眼睛icon时是为了让用户清楚的瞥见自己的密码,避免密码输入缺点。

4. 一键删除账户名/密码

这个功能是给用户在注册登录页面输入有误或是切换账户时利用,可以有效减少用户的点击次数,提升用户体验。

5. 保留账户名数据

在用户曾登录过的情形下,该当保留用户的账户名数据,这样用户重新登录时只需填写密码或验证码即可。
当然,用户如果想重新输入账户名,一键删除数据的功能也显得很有必要。

还有一点是多账户之间的登录切换,在登录时可以选择多个账号,这个功能在to C类运用比较少,一样平常是to B类运用可能会用到,由于企业可能会拥有多个账号,这个功能就会显得很有必要。

6. 账号后缀关联

这种针对利用邮箱注册,比如说在用户填写账户名输入@的同时,关联出@qq.com、@163.com等,可以减少用户的输入,体验也会更好。

7. 去除鸡肋操作

在注册登录时也会有一些比较多余的操作,比如:二次确认密码、完善个人资料等,这些操作最好是放置在个人中央或是设置里让用户自行填写,在注册登录页面只保留必须填写的内容。

总结

综上所述,注册登录看似是很大略的页面布局,并且随意马虎忽略,但是它的地位是不可忽略的,个中的交互办法和细微之处还须要我们多多考虑,不同的产品须要根据自己的属性来选择符合自己的办法。

如有遗漏,欢迎大家留言补充,一起互换~

作者:EasonZhang,公众号:Eason张UED(ID:EasonZhangUED)

本文由 @EasonZhang 原创发布于大家都是产品经理。
未经容许,禁止转载

题图来自Unsplash,基于CC0协议