15篇干货快速掌握产品注册/登录设计所有技巧(附PDF)!丨壹佰干货铺
Hi,PMer~
女排终于又拿金牌了, 里约大冒险顺利结束了。
东京8分钟震惊世界了, 《北京折叠》拿雨果奖了 。
天气渐渐不那么热了,金九银十就要到来了 。
——你是不是也该打打鸡血,提升自己的产品能力了?
欢迎光临壹佰干货铺VOL.3,我是掌柜的Yosa。这一周我卖的干货是—— 产品的 注册/登录设计技巧!
注册/登录是影响用户体验的重要环节之一,对于一个App或者一个网站的重要性毋庸置疑。它们 大概是所有线上平台都拥有的功能模块,也是用户最早能够接触到的平台功能,不仅业务流程简约,而且模块功能单一,甚至设计的页面也不会超过5个。
对于一个优秀的产品经理来说,能够设计好注册/登录功能是他的基本功;对于产品新人来说,注册/登录功能又是公认的在设计中坑最多的功能。
作为PMer的你,在设计注册/登录功能过程中,有没有纠结过下面这些问题呢?
为什么要做登录和注册?
手机号、邮箱、第三方登录注册,选择哪种方式最好?
如何把握登录界面易用和安全的平衡?
如何提高登录/注册和注册的用户体验?
流程图设计中,登录成功/失败、注册成功/失败后,要去哪里?
还有一些纠结的细节问题:如何设计登录页错误提示、如何设计密码强度的提示、要不要加图片验证码、要不要手动勾选用户协议、如何快速切换注册页的各个字段输入框、要不要自动给用户设置头像?
......
本期壹佰干货铺, 掌柜的 特意准备了15篇精品干货,帮助你彻底解决在注册/登录功能设计上的一切疑惑! 拳拳出击,招招必胜~
一、过来人经验篇
注册/登录设计看似简单,也需要严谨逻辑科学的思路。下面三篇干货都是资深PM的注册/登录设计经验,赶紧吞了它们!
《作为产品经理,我是这样设计登录和注册的》
掌柜推荐: 简单的登录和注册,有的网站做的行云流水和如丝般顺滑,有的网站做的沟沟坎坎和雷坑遍布。
为什么会有这么大的差异?作者认为在于思路的混乱和不一致。只有掌握了严谨和逻辑的设计思路,不仅简单的登录和注册会给用户留下良好的第一印象,也会让你在其他业务模块的产品设计中行云流水。
下面就跟随作者磊叔来一次登录和注册的产品设计之旅。磊叔他拿工资向你保证,这将是你人生中最精彩的旅行之一。
《总结丨一个产品经理关于登录注册的思考》
掌柜推荐: PMers在谈论一个功能点的时候,大多按着现象→提炼需求→分析/评审需求→功能策划→界面设计→功能说明(PRD)→....这个流程来。
但是在登录/注册这件事上,想必大多数PMer想得很少,甚至没想就加上了!!!
一个产品必须得有登录注册功能吗?这不是作者要讲的内容。接下来,看看作者是怎么啰嗦的吧。
《前网易PM总监:移动APP登录、注册、新手引导、布局的设计经验》
掌柜推荐: 蝉游记的PM纯银大大大家都知道吧?掌柜的经常会去他的微博和简书上阅读一些文章。这篇文章,就来自纯银大大~
蝉游记收到的一千多条反馈里,抱怨怎么没有独立注册的,印象里只有3条。而去年大热的唱吧,啪啪,都没有独立注册功能。
很多人以为逼着用户用社交账户登录,定是产品经理自私又邪恶,想提高分享数。
这当然是原因之一啦,但纯银大大更在意的是让产品更简洁,流程更顺滑。简洁顺滑难道不是产品经理的追求吗?
《盘点[注册/登录]产品设计路上爬过的坑》
掌柜推荐: 作为最基础的常备功能,注册/登录往往是产品第一个版本中最容易被忽视的环节,越是看似容易,陷阱越多;介绍相关产品思路的文章很多,讲交互的多,结合运营的少。
本篇文章更多的是记录那些坑坑洼洼,希望对大家有帮助。
二、典型案例篇
案例看多了,你也不会太差。下面带来4篇干货,100多个经典案例,案例有好的,也有不好的,或许能给你一些灵感。
《十大打动人的注册与登录页面细节设计》
掌柜推荐: 相信很多人都知道在 Tumblr 有一个叫做 Littlebigdetails 的网站,专门记录一些很多人可能不易觉察的界面交互细节。这篇文章就摘选了部分注册与登录表单例子。
对一个 Web 网站或移动应用来说,注册和登录是用户接触该产品的第一步,如果这一步的界面以及交互设计在一些细节上有新意的话,能够让用户感到眼前一亮的话,可以大大提高产品的用户转化率。
《干货!99个漂亮的注册和登录页设计(附PSD)》
掌柜推荐: 关于注册/登录最齐全的设计案例!之前有介绍过一些很漂亮的网站登录界面,登录和注册是获取用户的第一步,是最能体现网站用户体验的地方。这里又收集了更多的登录和注册界面设计,它们来自于国外优秀的设计师们,基本都附带PSD,欢迎同学们打包!
《3种不友好的注册登录设计》
掌柜推荐: 国内有很多的产品特别是创业公司的产品注册登录流程体验非常不好,这样无疑会影响产品的注册率。这篇文章作者讨论了一下国内的应用关于登录注册3种不友好的设计方式,在创业期的公司产品中非常普遍:
1,权重相同的俩个注册登录按钮放到一起
2,保存用户在输入框的输入数据
3,关于第三方登录
《聊一聊常见的登录交互方式》
掌柜推荐: 作者提到了八种常见的登录交互方式:帐号密码输入型、二维码登录型、共享账号登录、授权登录、短信验证码登录、手势滑动登录、指纹登录、更高级生物识别技术。且看作者如何对这八大方式进行解析!
三、设计流程篇
不会写App注册登录策划方案?不会设计注册登录流程?不会用Axure制作网站注册登录原型? 一步一步跟着大神的步伐,Go!
《App注册登录系统策划方案》
掌柜推荐: 一般来说注册登录包括邮箱、手机、第三方合作网站3种,其中邮箱注册如果是社区应用不建议引进,对于你后面社区运营会有重大的隐患,因为邮箱太容易被机器批量生产...来看看作者画的注册/登录 策划流程图吧!
《APP注册登录流程设计与浅析》
掌柜推荐: 随着移动端设计越来越重视用户体验,往往用户只需要很短的时间就决定了还要不要再使用你的产品,所以缩短注册登陆的流程十分必要。相信谁都不喜欢一打开软件,就要强迫你登陆,不登录就啥也或看不到。
用一句话来说就是在保证用户体验的同时,能不要登陆就不要登陆,即使登陆也要保证流程尽量简化。
《归纳APP登陆/注册流程及其错误反馈处理》
掌柜推荐: 以前,我们在注册时,只需要输入用户名或邮箱地址,然后输入密码,再次确定密码,就能完成注册。而现在,移动端流行起来,注册的流程需要权衡其便捷性和安全性,且软件对资料的需求加大,进而增强其良好的体验效果,但是如何把控好产品注册时的初体验呢?
这篇文章分析了现在登录/注册的各种情况(只针对于手机号注册,不谈及邮箱注册,只是通过邮箱进行接收信息,但也能保证你不被短信干扰)。
《用Axure制作网站注册表单原型图文教程》
掌柜推荐:
一般注册过程包括以下步骤:
1.用户按照提示填写表单。
2.用户在填写表单的时候提示是正确否输入了内容,如果没有,提示用户。
3.用户提交表单,所有项是否都正确,如果出错,提示哪项有错误。
4.用户成功提交表单或者取消表单。
这篇干货用Axure7.0来完成通用注册的设计,包括最基本的输入框变化和提示文字变化。很详细的教程!
四、细节篇
"魔鬼存在于细节中",这句格言在设计中更是如此。 细节可影响体验,可决定成败, 所以下面三篇干货,你不得不看~
《细节决定成败!提高用户登录体验的5个细节》
掌柜推荐: 提高用户体验最好的方向,就是尽力让用户切实地体会到整个操作流程的简单顺畅。要提高登录流程的用户体验,有很多方面的因素是需要设计师考虑的。这篇文章中,作者主要讨论了登录界面流程优化的5个细节。作者从两种不同的登录类型着手,一直说到标识的重要性。
《做登录/注册页面需考虑哪些问题?》
掌柜推荐: 怎么选择注册/登录方式? 如何确定登录/注册界面元素? 如何设计报错提示? 登录注册做成页面还是弹窗?作者都会给你答案。
《交互设计中如何把握登录界面易用与安全的平衡》
掌柜推荐: 这篇文章文章来自GoSquared团队,他们在登录界面的设计上细致入微,值得学习。
对于GoSquared 的每一个设计细节,他们都非常之上心。最近登录界面改版,新加入的双重认证机制使得用户账户更加安全,与此同时,他们也借此机会逐步提升用户登录的体验。
提升登录界面的用户体验并没有看起来那么简单。当你让登录界面越发漂亮、直观、快速且好用的同时,你还需要让这个过程不那么简单,不会被黑客或者其他心怀不轨者轻易入侵。
-完
特别赠送——93页本期干货PDF!
预览如下:
干货PDF戳我下载!
密码: 2uru
-本期专题互动-
1,你用过哪些注册/登录体验很差的APP?
欢迎向掌柜的吐槽=。=
2,你希望壹佰干货铺继续增添哪些干货呢?
欢迎向掌柜的要货=。=
「壹佰干货铺」——互联网产品、运营、设计、职场精品干货,应有尽有!咱们下期再见~
【产品壹佰往期独家专题推荐】
10个问题,22篇干货,吃透用户体验设计精髓!丨壹佰干货铺
产品人终极“脱坑”指南——入门篇丨壹佰干货铺
大神把三年涨薪10倍的秘笈都供出来了!丨壹佰小酒馆
Blab挂了,直播不是刚需所以做不成吗?丨壹佰放大镜
中元节那天,编辑部开了一次灵异故事会丨壹佰小酒馆