从这几个案例入手,学会设计APP注册流程
发布时间:20-12-04
场景
PC:室内的+相对沉溺的+长时间的
Mobile:随时随地的+碎片化的+随时转身离开的
用户
产品定位的受众人群,可以是学生、孕妇、求职、买卖……,比如招聘类的目标受众就是需要找工作的群体;房租中介类就是需要租赁、买卖房屋的群体等等。
任务
帮助这些受众完成他们想要得到事务的一种逻辑流程。
比如我们可以在某宝上:搜索想要的商品-锁定-下单-收货-评价,这就是一套购买流程,提供了用户网络购买流程的解决方案。
这里我们就用户注册这一场景,浅谈设计任务及其背后对思维逻辑,然后去提升细节设计。
到达注册页面的途径
用户到达一个app的注册页面一般有4种渠道:
信息构架及任务流程
信息构架
就是包涵哪些信息,这些信息是怎样穿插在一起的。
注册模块概括来说由2部分组成:用户信息+验证。用户信息包括但不限于:
手机号码
邮箱
账号
姓名
性别
兴趣
……
然后再由不同产品的定位决定类别的从筛选到简化。
验证码:是一种区分用户是计算机还是人的公共全自动程序,防刷、防黑、防灌水之类的程序行为。
被广泛采用的有:短信验证码、动态验证码组成。
任务流程
可以分为逻辑流和页面流,逻辑流就是数据逻辑针对开发编写,页面流可理解为页面的跳转关系针对用户。
简单以去哪儿的注册流程中的输入手机号和验证码为例:
下面是我们呈现给用户操作的页面流
注册场景下涉及的控件一般是:输入框、按钮、验证码。
输入框
供用户输入信息,一般包含:提醒文案、正文、示措提醒
按钮
引发即时操作,即当用户点击后,触发即时操作。作为基础控件之一,按钮广泛应用于不同平台的所有产品中。通常位于一个或一系列操作的底部或右方。
按钮的一般状态:
PC:normal、hover、down(pressed)、disabled
Mobile:normal、onclick、disabled
产品中的辩证法与相对论
学会用辩证法,去分析问题。在产品道路上同样适用,有时候得到就意味着失去,用辩证法的方法看问题,利于分析事情的二面性,衡量其利弊,进而找到真正适合自己产品的合适的方案。
拿动效举个例子,动效本身并没有错,但是一个庞大的产品就不宜使用过多的动效,原因:
因为动效会加重系统负担;
为了不断延长其生命力需要不断的版本迭代,很可能一些辛苦设计开发出来的动效随着产品的发展方向而被很快淹没;
最为重要的一点,对于用户而言动态的更易于吸引注视,动效的增加会使原本复杂的页面更加复杂化,更难于找到页面的重点内容而失去操作方向,事实上这个时候动效已经转变为一种打扰。
很遗憾,这个观点没有找到合适的案例进行分析,淘宝、京东、美团等在动效方面都表现得比较安静。
下面是一个天气app的页面,因为app本身很简单,就是展示天气而已,动效的增加不仅动态的解释了天气的状况也让原本单调的页面多了一丝趣味,而用户也并不会因为动效的加入而迷失。这就是相对论,简单的事务可以做些复杂的处理。
随着时间流逝,科技发展,人们对事物认知不断提高,注册场景下的设计也不断进步。揣摩变化,思考逻辑,提升细节设计。
PC互联期
(请忽略内容,仅观察表现形式)
首先明确的是,注册页面被设计出来的目的是希望用户能够填写信息并成为我们的用户。但是,当用户看到这样的一张信息较多的页面,视觉压力和逃避心理就来了。
除了视觉和心理压力,我们还可能会被每一行的必输提醒而吸引,不过行行必输,行行提醒有点过,视觉干扰也就来了。
从人随网走到网随人动,用户体验收到前所未有的重视,涌现出大量的专业设计和体验设计师。对于产品注册信息的提炼由多样逐渐走向结构简单、信息简洁,以用户为中心的设计越来越被更多人接受。
下面来看下别人家的注册页面及设计思路。
淘宝的注册流程相对来说是比较长的。必填项:手机号、验证码、会员名、密码*2,有防错机制,有号码&用户名2次确认。但是第一次支付密码输入页面没有自动弹出键盘。不过整个跑下来还是挺轻松,复杂的事情简单做,困难的事情分解做。
还有一点,激活输入页面时,键盘都没有弹出,需要点击input框调出键盘。
但是提示文案相比下引导性较强。
当时的第一版就是左侧的,也是比较保守的,不出错的。视觉线:填写手机号-看一眼验证码输入框-点击验证码按钮-回来输入验证码-点击注册。在这个过程中,验证码输入框被2次阅读,当时觉得这是一种浪费,所以出了右边的方案。视觉线是直了:输入手机号-点击验证码-输入验证码-点击注册,但是从手机号到验证码跳了一行,思路会突然断一下,再着一按钮直接冲在最前吗有点突兀。
看了这么多案例,那么我们在设计注册页面的时候怎么去思考呢?
了解设计场景,设计目的。也许我们投入了很多资源做引流,当用户到达这个页面时,想尽办法留住他们。
学会站在不同产品的立场分析别人的设计思路,而不仅仅是视觉表现。
视觉简单,逻辑通畅。
目前大部分的注册流程为分解的形式及一站式,结合产品实际场景选择适合自己产品的,尽可能的简化信息、缩短流程,提升注册达成率。
对于交互对象的多层次视觉呈现,比如文案提醒、示错、验证提醒,按钮的响应反馈,都是提升用户体验的小细节。
在对象对齐及排列方式,学会依靠一些定律,法则,可以是我们在迷茫不定的时候,看轻方向。
不断学习、思考、对比,提升自己对事务的认知。
只有理解设计背后的思绪才能提升细节设计,也只有明确了设计场景和设计目的才能在不同的设计方案中找到最合适的那个。
就像买一件衣服,我们总会盯着线头、走线、针眼、纽扣、锁边这些点以此来评价一件衣服的品质,界面已是如此。经得起推敲的设计才是好设计。
本文仅笔者观点,不到之处欢迎大家沟通指正。
最后分享一下笔者在设计过程中的思考三步法则:
为什么要做这个事情?
怎么去做?
还有没有更好的解决方法?
“小是最伟大的关怀”2016和大家共勉。
作者:湖湖 途牛 设计者
「互联网的一些事」聚焦互联网前沿资讯,行业爆料、小道消息、内幕挖掘,关注互联网热点事件!干货分享,提供各种产品文档、行业报告、设计素材免费下载。官方微信:imyixieshi
本文链接: http://www.yixieshi.com/25864.html (转载请保留)