美文网首页炫酷的交互交互设计产品交互设计
二十四个以小见大的登陆注册案例分享

二十四个以小见大的登陆注册案例分享

作者: chenjiajian | 来源:发表于2015-12-15 20:08 被阅读281次

文章素材来自两个网站:littlebigdetails.com和uedtails.com
此公众号仅做部分翻译并整理成文。

第一类:登陆

1、Tumblr



当用户输入的没有任何信息就点击登陆时,会出现“ you do have to fill this stuff out,you know”这句幽默错误提示。

2、ReadMe(gif)


当用户点击密码框时,猫头鹰的双手就会捂住眼睛。非常赞!

3、LinkedIn


当用户在密码框输入密码后,点击闭上眼的图标,密码就会显示出来。同时打开眼睛的图标。

4、Quora



登陆页输入邮箱地址后,如果账号存在,右侧会出现该账号的头像和ID

5、Trello


如果使用第三方登陆,如果数据库没有这个账号记录,Trello会提示创建一个呢还是绑定已有的账号。

6、Reddit


用户输入错误的密码后,点击橙色的“recover password”会把错误的密码清空。

7、Pinterest



如果用户登陆不成功,系统会自动发这封邮件。

第二类:注册

1、Asos



当用户在注册时候输入出生日期时,会有时间提示用户还有多久过生日。

2、Gmail



如果用户用了太多“.”会出现“ a fan of punctuation!Alas,usernames cant have consecutive periods”这句错误提示。

3、Tumblr



登陆和注册都是统一入口、账号存在就直接登陆,否则就去到注册。

4、MailChimp



当输入的用户名重复时,会有这句俏皮的话“maybe its your evil twin.spooky”

5、Uber



uber的注册页会显示当前注册的进度

6、IFTTT(gif)



当用户输入完邮箱后,切换到注册或登陆。邮箱地址都保留住,免去再次输入的麻烦。

7、Apple



Apple 官网的注册页面会以 to-do 式的任务列表来引导用户填写表单时的正确性。

8、Delectable(gif)



用户选中表单并在输入内容后,表单名称没有消失而是变换颜色并上移位置显示当前位置。

9、Automatic(gif)



提示距离密码最小长度还剩多少字符。

10、Basecamp(gif)



公仔的手指指示当前位置,出现错误时,注意公仔的表情。哈哈

11、Tumblr



tumblr的注册页,密码框右侧会显示密码的强度。

12、Geeklist


与常见的进度条显示密码强度不同,Geeklist是用破解密码要多长时间来表达密码强度。

第三类:更改密码/忘记密码

1、Slack



改变密码之后,slack会让用户发一封邮件到仪的移动设备,这样可以自动登陆不用这移动设备上输入繁琐的密码。

2、Louisck


当用户忘记密码后,Louis CK将会出来拯(羞)救(辱)你,主要邮件的最下方还有幽默提示:给你登陆网址,以防你忘了登陆地址。

3、The Noun Project


当用户来到登陆注册页、会有一个选项:通过邮件方式检查我是否有账号(类似忘记密码)。

咦?好像还不够二十四个?另赠送两个案例:

1、Twitter:关于未登录账号


如果用户在没有登陆的情况下想要分享一个“Tweet”,就会出现直接登陆并分享的这个页面。

2、Quora:退出账号提示



当用户退出账号时,会得到该账号还在登陆的浏览器,分别列出时间、地点并有退出的按钮。

本文完。

相关文章

网友评论

    本文标题:二十四个以小见大的登陆注册案例分享

    本文链接:https://www.haomeiwen.com/subject/apiuhttx.html