颠覆性的改版设计,peopeo给华安一个互联网+的用户体验

颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第1张图片

颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第2张图片

项目背景
华安保险作为一家传统的保险企业,随着互联网+保险的热潮,转型不可避免。鉴于peopeo在UI设计行业的优秀表现,华安保险委托peopeo提供解决方案。
解决方案
peopeo凭借多年保险产品的设计经验,结合华安保险微商城自身的特点,从功能、视觉、交互和性能四个方面对华安微商城进行迭代更新。
功能
对微商城进行归纳和划分;
提高活动的频率带动流量;
新增积分商城提高留存率;
视觉
尽量减少用户的交互步骤;
提高产品的功能可视性;
优化产品信息使其简单易懂;
交互
符合品牌的视觉规范;
使用大众喜欢接受的设计语言;
干净精炼不影响用户获取信息;
性能
优化图像的占比
使用SVG格式压缩体积并提升图像的清晰度。
更新后页面


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第3张图片

华安原有首页
颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第4张图片

peopeo针对华安微商城首页问题分析:
首页作为华安微商城的门户,需要提供各功能的入口,但不能以功能入口为主体。
首页我们建议增加活动的频率和比例,吸引用户参加从而增加流量;
建议增加主推和热销产品,根据消费场景规划保险产品,尽量贴近用户需求才能转化购买;
建议增加底部的菜单,为用户提供各功能的入口,建议增加积分商城板块,提高用户的留存率。
首页的仿Win Phone的磁贴模式已经不能满足消费者的审美,并且磁贴的颜色居然有6种,从蓝绿色到玫红的跨度在色环上已超过90度,根据色彩心理学理论这种颜色跨度及数量会对用户认知产生严重干扰,无法将注意力集中在内容。
整体视觉中也没有凸显出华安的品牌形象,建议加强华安的视觉识别系统规范
同时对比了国内其他几家大型的保险公司,让华安微商城首页更加合理,首屏的内容多以产品分类、热门推荐、主推产品、消费场景为主。


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第5张图片
颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第6张图片
颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第7张图片
颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第8张图片

华安原有列表页


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第9张图片

peopeo针对华安微商城列表页问题分析:
交互上,用户不会还没看到详细信息就点击购买。
栏目分类上建议将“全部”改成“热卖推荐”可以给用户良好的心理暗示。
将主推的产品打上“专项产品”“限时促销”等标签,增加营销卖点;
产品标题不突出,用户无法一眼获取产品信息。
视觉上这种形式的列表老气,图片和标题不贴切。
价格还不够突出,无法吸引用户
通过常见保险产品列表页的对比,大都采用醒目的标题和价格,这样更有助于使用户快速获取产品信息。


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第10张图片

华安原有产品页


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第11张图片

peopeo针对华安微商城产品页问题分析:
用户第一眼最想看到的应该是保障内容,应该将保障内容提上来。
交互上不要讲过多的操作放在此页面,将只有一个选项或对价格无影响的操作固定,最多只让用户对1-2个影响价格的选项进行操作。最好是无选项。
如果有不同档位的则需要便捷的切换,方便用户比较保障内容。
增加产品优势及宣导,增加用户购买信心。
将投保按钮及价格悬浮吸底,提高投保便捷性。
头图没有体现出产品性质。
页面色彩发灰,给人陈旧的感觉。页面整体字号过小,不利于用户阅读。
通过常见保险产品产品页的对比,产品详情页多数选择优先显示保证计划内容及计划切换,这样方便第一时间查看。显示套餐的价格及吸底的投保按钮,方便用户购买。


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第12张图片

设计方案
华安微商城首页
首页一改过去色块化的老套布局方式,精简内容,主要布局险种类别、华安活动和热推产品三块内容,清晰简单,不给用户过多的元素干扰。
否定了华安过去五彩斑斓的色彩系统,规范了华安的整体视觉形象,以明快的暖红色系为主,给用户传达一个稳定统一的形象。
在细节上,我们也尽量让华安有自己的独特性,icon的设计也是从华安的首字母“S”中提炼出出来,并贯穿始终。


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第13张图片
颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第14张图片

华安微商城列表页
列表页采用读图的模式,方便用户浏览。各个模块可以自由匹配,可操作性更高。把险种名称、价格清晰明白地告诉用户。


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第15张图片

华安微商城产品页
放大产品卖点,逻辑清晰明确,投保按钮吸底引导用户投保,统一规范了视觉语言,让所有产品在对用户传达上更统一。


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第16张图片

华安微商城积分页


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第17张图片

华安微商城投保流页


颠覆性的改版设计,peopeo给华安一个互联网+的用户体验_第18张图片

关注peopeo官方微信公众号,获取更多UI行业新鲜资讯

你可能感兴趣的:(颠覆性的改版设计,peopeo给华安一个互联网+的用户体验)