提交需求
赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!
在做华润直销银行APP优化设计时候的考虑和思路,做下了一些笔记。
旧版页面如下
首页+详情页
产品列表页+登录页
问题分析
问题分析分两个层面,一个是产品层面,另一个是设计层面
产品层面问题
一、首页和产品框架问题:
1、作为一个投资平台首页只放一个推荐产品简直严重浪费展示空间,违背了手机端的设计原则——分寸必争
2、首页的通知栏有阻挡,影响产品的全部可见性,且没有起到应有的作用。
3、产品的信息构成优先顺序:年化收益、产品名字/编号、投资期限、剩余额度、其他信息
目前信息全部都提取出来,反而没有侧重点;
剩余额度最大的作用是跟收益率共同诱导用户点击购买;
4、优惠活动内容较少,可以直接放到主页里面。
5、考虑到银行产品业务特性,贷款可以单独拿出来作为一个独立业务(不可行)。
6、优化调整首页个人账户信息和“我的”Tab信息的架构。(遗漏)
7、首页右上角“+”信息多余。
8、每次重入首页,都会刷新一下首页的进度条。
总结结构:应用logo标识+推广banner+常用入口+产品列表+底栏tab
二、产品详情页
信息层面太过混乱,主次不当:
1、nav栏的title叫做“润银优选”,没有起到指示的作用。浪费展示位置;
2、全页面最突出是产品的名字和编号,浪费展示位置,参考前面提过的信息优先顺序
3、剩余额度、收益率、投资期限、日期进度信息需要重新合理排列
4、和交易密码不应该在这一步就出现。这不符合当前购买类app的支付流程。
5、余额的作用不大,既然绑定了银行卡,可以直接用银行卡操作。跟支付宝的方式一样。既可以用支付宝余额,也可以用银行卡。所以可以在上一点,支付的时候才出现。
6、参考“钱端”的有个做法是很人性化的。就是输入购买份额,直接显示预期收益。但是同时“钱端”有一个不好的地方是项目的更多详情并没有完美兼容手机的显示就把入口展示出来了。出发点是好的,但是功能没有做好,影响用户体验。
7、“钱端”有两点做得比较好,第一点是输入的金额有限制,必须是100整数,这种限制在投资理财类的项目是十分常见的;第二点是在末端还加上了项目的更多详情入口。但是这两点都做得不够好。
第一点做得不够好就是有了购买100整数的限制。却只是在提醒层面,而没有在功能层面做得方便使用;第二点更多详情入口,点进去内容显示是不兼容的。这倒不如不显示这个人性化的功能。
总结结构:产品title+收益属性+剩余日期、购买余额+收益日、计息日、投资期限等说明+购买功能(购买数量、总价价 格、预期收益、优惠券、购买按钮)+其他功能(分享)
三、登录注册界面
1、输入验证码有误,会刷新页面,并清空本已填好的密码。
总结结构:登陆(用户名、密码、验证码)+注册(准备素材提醒、手机、验证码、协议)+找回密码(手机信息、动态码验证、新登录密码、确认密码、密码提示)
设计层面问题
一、整体框架
1、 颜色不好,浓重的橙色容易让人觉得脏;(见颜色分析)
2、整体设计样式比较倾向于参考pc做法,比较low。
3、点击按钮样式和颜色多样,规范不完善;
同类有参考意义的App:钱端、微钱进、蚂蚁聚宝
优点分析:
钱端-整体APP的内容框架安排得好,页面简洁
微钱进-颜色和页面的侧重点排版好,容易让人有点击的欲望,页面信息同样简洁
蚂蚁聚宝-简洁
根据上面的问题分析,要做的优化点:
1、改变首页框架;2、优化颜色;3、统一样式
页面设计思路
首页
1、产品条目的设计首先是要有数据分层:吸引用户购买的数据(年化利率),催促用户购买的因素(倒计时、剩余购买量),产品的其他特性(产品属性、名称、),这里的剩余购买量做了弱化处理的原因是分析了购买场景。当用户在浏览产品列表的时候,第一眼会对比年化利率,其次是还可不可购买(倒计时、剩余购买量)。但是如果不可以购买,应该是变成失效状态,甚至应该隐藏起来。保证有足够的空间去展示可购买的产品。如果是这样理解,这里的倒计时和剩余购买量的对比参考作用其实不大。所以我弱化了他们,而倒计时单独拿出来做了处理,是跟大部分的购物APP一样,用时间跳动来产生购买的紧张感。
2、整体的色调是偏向年轻橙色,延续了违反华润直销银行原有的色系。
3、但是如果是单一的橙色,始终都会让人很容易就视产生视觉负担,所以在入口图标的底板设计加进去了一些深的橙色做对比,将优化过的橙色更加衬托出年轻化。丰富了整个页面的视觉层次。而在这个基础之上,适当地加上金币、金钱的元素概念,贴近整个app的定位。例如“安全保障”图标的设计。
4、Tab底栏图标设计思路:
由于比较早之前的设计优化,当时记录到这里,就只发到这里吧。做一个笔记,方便自己也方便别人。
下面是优化过后的页面,详情页没有最后做调整,只是做了大概的基调。
谢谢观看
大牛,别默默的看了,快登录帮我点评一下吧!:)
登录 立即注册