APP登录注册的设计技巧

157天前发布

原创文章 / UI / 观点
UX设计笔记 原创,如需商业用途或转载请与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  -



31
- 位站酷推荐设计师推荐 -

声明:站酷(ZCOOL)内网友所发表的所有内容及言论仅代表其本人,并不反映任何站酷(ZCOOL)之意见及观点。

    文章信息

    • 文章标签

    没有新消息