[经验方法] APP登录注册的设计技巧-经验/观点-UICN用户体验设计平台

恭喜你成为UI中国推荐设计师（详情）

快速搭建网站

查看全部热门榜单

全部

常用搜索：作品集 AE ui设计 aigc icon logo app

您的意见是我们 UI 中国进步的动力！

点击立即反馈按钮，发表您的意见！

立即反馈

QQ群反馈

您也可以加入UI中国官方反馈群进行反馈！

群号：302892100

备注：反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作，请填写需求表单，我们会在第一时间与您联系！

0/20

0/200

设计大赛

设计大赛
发布广告
发布招聘
其它需求

取消发送需求

提交完成
感谢您对UI中国的支持和信赖！

我知道了

[经验方法] APP登录注册的设计技巧

0.0°

2020-03-04 原创文章 经验/观点 举报 1584 12 5 1

UX设计笔记关注

移动互联网盛行下，基本所有APP都会有注册登录功能，它不仅能让用户扭头就走，也能让产品获得新用户的芳心。

一个合格的注册登录页面，应该是具有清晰的操作流程，良好的交互细节和美观的视觉设计。

PART1: APP的注册登录有三种情况

一、无登录注册

1、大部分免费使用

2、一般功能都比较单一，不会记录用户的历史行为，打开即用。

如：小工具较多、手电筒、指南针、计算器…

特征：工具类型产品盈利模式主要是靠广告盈利。

二、强制性登录注册

1、渴望用户的信息，对用户身份信息敏感

2、对用户账号安全有保护，注重用户的数据保护

如：社交类app、运动健身类、招聘类…

特征：这类产品的特质（功能、服务）强烈的吸引着用户，用户非常愿意使用此类用户。

三、触发登录/注册

1、靠内容与产品支撑，通过内容与产品的优势

2、吸引用户，促使用户转化

如：电商类、新闻类、知识类…
特征：

1、这类产品的特质（功能、服务）并未强烈的吸引着用户，需要用户体验

2、发展期、初创期的产品需要多的用户数量，所以不会在登录注册时强制执行，给用户带来困扰。

小结：根据产品属性选择合适的方式

PART2: 默认优先“登录页”还是“注册页”呢？

有思考过这个问题吗？

注册优先

1、可体验全部功能，直接进入产品核⼼区域。

2、可获取用户信息，个性化推荐

常用于社交或定制化较强的APP，例如：QQ，微信，抖音，keep，⼩红书.... 缺点：门槛较高，还没看到整个应用的全貌就要填写个人信息，考验⽤户耐心。

优点：

1 、所提供的内容和功能，需建立在⽤户基本信息之上

2、产品初期成⻓长阶段，需通过强化注册⼊口提高新增⽤户量

登录优先

适用场景：

1、前期在web端积累大量用户，转移到移动端时；

2、产品发展稳定期，已拥有大量的用户基础且新增用户增长较为缓慢时。

优点：

方便老用户，进入应用效率较高

缺点：

通常情况下，用户会选择下方的第三方一键登录，如果后期平台需要用户提交个人信息来享用更多功能时，需要谨慎引导否则引起用户反感

登录注册一体化

优点：方便快捷，转化率高

PART3: 登录/注册的页面设计元素有哪些？

1.1 背景设计-浅色背景

1、简化了背景的视觉，突显账号区域的内容

2、聚焦注册/登录的信息录入，提高转化

1.2 品牌色背景

突出品牌信息，加深用户对品牌的认知，树立品牌在用户心中的印象。

1.3 背景设计-图片视频背景

给用户营造一种产品分为，是情感化设计的一种，应景的图片提前让用户产生代入感，促使用户融入到产品中。

2.1 引导元素设计-品牌元素引导

目的是为了进一步强大用户对品牌的认知，让用户熟悉产品，了解产品、对产品产生足够的印象，扩大品牌效应。

当以品牌名或LOGO体现的时候，背景的设计一般会弱化。

2.2 文案引导

更有亲和力，与用户对话，同时更加聚焦每一步操作任务！

2.3 插画引导

1、使用与产品气质一致的插画，可以强化品牌感

2、同时更具有趣味性，也能让用户感受到产品设计的态度。

3.1 账号操作设计-第三方快捷登录

以增加用户量为主要目的时，可采用快捷登录方式，它给用户提供了一种更为便捷的选择方式，无形中减少了用户的选择负担。

3.2 账号操作设计-信息输入表单

以留存用户信息为目的时，让用户通过输入自己的账号、密码、手机号码、验证码等方式完成的登录注册操作。

PART4: 表单有几种状态？

有思考过这个问题吗？

1、默认状态（input&Btn）

2、激活状态（input）

3、输入状态（input&Btn）

4、校验报错（前/后端校验）

5、清除方式

6、密码可/不可见

7、验证码读秒/获取

PART5: 页面左上角是“返回”还是“关闭”？

设计方式：

1、明确注册/登录的功能定位

2、参照操作逻辑使用

Bilibili注册登录定位为一个独立模块，该模块高于其他模块。

如Bilibili：

以上是本文全部内容，下次分享缺省图设计方式哦，记得关注哦

感谢您耐心的读完，真心希望你能获得新知哦～

- END -

更新：2020-03-04

12人已收藏

UX设计笔记

专注于分享有价值的内容，涵盖了UX、UI、产品、方法论等精选内容

12

作品
79

粉丝
0

关注

猜你喜欢

2020-03-04 原创文章 经验/观点 举报 1584 12 5 1

[经验方法] APP登录注册的设计技巧

0.0°

添加收藏！

您还可以进行分类收藏

您确认要推荐？

该作品发布时间：2020年03月03日

评分

完整度

启发性

勤奋性

排版布局

提交需求

猜你喜欢

举报理由:

您确认要推荐？

评分

推荐心得