交互设计思路:积分模块改版总结

作者根据工作经验对积分模块改版进行了一些总结,与大家分享,希望可以从中收获点滴。


作者根据工作经验对积分模块改版进行了一些总结,与大家分享,希望可以从中收获点滴。

交互设计思路:积分模块改版总结

积分已经成为每个互联网平台黏住用户,增加平台留存率的重要手段之一,金融平台也不例外,虽然积分的商业模式很重要,但是如何展现给用户,用户的使用体验是否流畅也同样重要。下面就我最近的手边项目积分模块的改版做详细阐述。

首先,先说明一下该APP的积分模块组成,包含每日签到、积分奖励(外星人奖励、投资奖励)、积分记录及积分的相关活动等。

1.每日签到页面

每日签到原页面:交互设计思路:积分模块改版总结

问题分析:页面布局零散,相关内容布局不合理,页面样式呆板不新颖。

改版页面(交互稿):

交互设计思路:积分模块改版总结

交互设计思路:积分模块改版总结

改版说明:

  1. 关联相近原则,将“立即兑换”和我的积分移到相近的位置,看到积分数字,立即想到可以兑换什么。
  2. 增加签到进度条和日历,更直观的让用户了解到连续签到可以获得不一样的奖励。
  3. 最底部增加积分的相关活动,为以后扩展奠定基础。

总结:要充分理解和分析需求,做更贴近用户需求的设计。

2.外星人奖励页面

外星人奖励原页面:

交互设计思路:积分模块改版总结

问题分析:没有空状态引导,表格样式的展现形式看起来很乱,信息展示的优先级也叫混乱。

改版页面(交互稿):

交互设计思路:积分模块改版总结

改版说明:

  1. 将导航移至标题栏内,减少页面的分割,看起来更有整体性。
  2. 增加空状态引导,以使操作流程形成闭环。
  3. 头部样式采用弧形样式,更加活泼大气一点。
  4. 增加了邀请人数的字段,这样用户更加直观的了解到自己邀请了多少人。
  5. 将原来的表格样式改为list的样式,将信息进行重构,突出奖励。

总结:空状态引导很重要,关乎整个APP的体验闭环。页面样式也是交互设计的一大亮点,不一样的样式也会给用户耳目一新的感觉。

3.投资奖励页面

投资奖励原页面:

交互设计思路:积分模块改版总结

问题分析:和外星人奖励页面一样没有空页面引导,信息展示优先级不对,需求理解不透彻。

改版页面(交互稿):

交互设计思路:积分模块改版总结

改版说明:

  1.  增加空状态引导,页面头部样式和外星人奖励页面统一。
  2. 将list的信息进行重构和整理,根据页面的信息显示的优先级进行调整,突出奖励,将状态字段单独作为一列,将无奖励的金额直接显示为0,比原来的的无奖励但有奖励金额的状态更清晰。
  3. 增加页面交互:当用户开始选择筛选条件(交易时间、产品类型、状态)时,筛选条件和列表将置于页面顶部,减少干扰信息,让用户更专注于查看列表本身。

总结:信息整理很重要,根据用户的关注度、页面信息的重要程度进行产品设计。

4.外星人页面

外星人原页面:

交互设计思路:积分模块改版总结问题分析:缺少活动事件的引导,用户进到该活动页面以为每个人都符合邀请条件,但实际上需要满足一定的条件,而相关说明隐藏的太深,用户极有可能根本关注不到。

改版后页面(交互稿):

交互设计思路:积分模块改版总结

改版说明:将原来的活动规则里面的内容进行提取,增加成为外星人事件的引导,更加可视化,图形化。

总结:可视化是交互设计的重要手段,所以将文字可视化图形化已经成为设计趋势。

积分记原页面

积分记录原页面:

交互设计思路:积分模块改版总结

改版后页面(交互稿):

交互设计思路:积分模块改版总结

改版说明:

  1. 突出积分的增加或减少,并且以时间流的形式展示,更加直观。
  2. 筛选条件其实是一个低频的需求,所以将筛选条件移到右上角,点击后再出现。

总结:时刻关注用户需求,做以用户为中心的设计。

项目总结

  1. 理解需求、分析需求是设计页面的关键。
  2. 影响信息展示样式的关键点:用户的关注度、使用频次、使用习惯。
  3. 关注页面的空状态引导。

 

作者:柴维英,从事交互设计5年多,不断钻研,不断进步,拥有丰富的交互实践经验。

本文由 @柴维英 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/23324/

(0)
CatherineCatherine
上一篇 2017-05-04 21:28
下一篇 2017-05-04 23:39

相关推荐

  • 交互实战|Design sprint methods 在To B产品中的应用

    在湾区很火的设计冲刺,真的能有效快速解决项目中棘手问题吗?我们在实际工作中开始了首次尝试与应用。让我们一起来体验一下Design sprint methods的设计过程吧~

    2017-04-30
  • Axure官方教程中文版第4课:构建交互动作-木卫艾欧网原译

    https://www.iamue.com/wp-content/uploads/video/Axure.com-learn(4).MP4 新建文件 1、添加一个按钮和两个文本框 2、禁用第二个文本框 3、设置第一个文本框不可点击 4、设置第二文本可用 5、将第二个文本框设置获…

    2015-01-26
  • Axure制作酷我音乐安卓端高保真原型案例下载

    本案例为原型库网站原创制作,转载请保留出处。这个原型文件,忘记是什么时候练习axure 时做的,做的不好,有bug,部件的层级关系不够明确,仅供参考。拿出来给有兴趣的朋友下载研究吧,关于这个原型的问题就不要找我提问咯,早已忘记了。
    前段时间又重新做了一下安卓端的酷我高保真原型,进步了很多,层级关系十分明确,这个最新的原型等过段时间再给大家分享吧。

    2015-01-04
  • 【交互大讲堂】当交互设计遇到装置艺术

    之前我们讲到的交互设计都是偏重于传统交互,与艺术的互动性没有这么强,通过现在媒体和交互设计,交互装置的互动性也会越来越强。上图这个工作室是日本的一个叫Teamlab工作室,他们致力于新媒体的装置艺术的设计的第一个作品。当用户进入这个身边周围都是球的环境的时候,触碰那个球,球会发出不同的声音。小孩子对绘画都是十分感兴趣的,当孩子进入这个工作室,画上一副自己喜爱的画,用打印投影仪把这些画全部扫描,扫描之后,会形成3D影响投放到媒体上面,这就...

    2018-05-03
  • 高手课堂!「按钮系列」之按钮位置与用户体验的关系

    @Daidai丶呆  :本文主要给大家讲解:「确认」、「下一步」等这类存在于页面中的按钮在摆放时,对页面 or 产品造成的影响有哪些。

    2017-09-29
  • 移动端设计模式的误用

    如果你是一名经验丰富的设计师,你一定会认同一点,受他人启发并不是在抄袭UI设计。这是一种最佳的研究实践。它也要运用各种设计模式,也要遵循设计规范,也需要确保选择用户熟悉的模式来建立可用的界面。

    2017-06-01
  • 交互设计完全学习指南

    交互设计起源于网站和平面设计,但已成长为单独的一个领域。工作内容不仅仅有文本和图片,交互设计现在负责创造屏幕上用户可能会划动、点击、按压或输入的每一个元素,简而言之,就是体验的互动。这篇文章为对交互设计感兴趣的人提供了几个好的点可以开始行动。为了这个目的,我们简要的介绍了交互设计的历史、指导原则、值得注意的贡献者和与这个极具吸引力的学科相关的工具。即使你已经是一个交互设计师,阅读下这篇文章然后在下方评论区分享你的想法吧!目录什么是交互设...

    微信热点 2018-05-06
  • 一个产品设计师必须会讲的故事——用户体验设计中的故事板

    作为一名设计师,情绪板的运用想必你已轻车熟路了,然而情绪板其实还有个小姐妹不常被人们提及,她就是故事板。【情绪板】常用于品牌与形象设计领域,用来发掘用户对视觉体验的需求,而【故事板】则常用在用户研究和交互设计领域,通过还原用户使用场景来深度挖掘用户对产品整体体验的需求,是提升用户使用体验的有效研究方法。很多希望从视觉设计师过渡到体验设计师的新手设计师,心里很清楚要关注和挖掘用户除视觉以外的其他体验,但是却不知如何下手。各种用户研究方法虽...

    2018-05-08
  • 7个设计技巧,让内容和用户体验无缝地配合起来

    好的设计往往需要好的内容作为基础支撑。无论是内容还是设计,想要让两者最大化的搭配,往往是需要进行调整和优化才行。“不要总是玩弄算法,创造用户想看的内容才是正途。”

    2017-08-04
  • 澳洲科学家完成时间旅行模拟

    2009 年 6 月 28 号,世界闻名的物理学家史蒂芬霍金在剑桥举办了一场趴体,香槟美酒应有尽有。霍金邀请了每一个人却无人出席。对此,霍金并不意外,因为他在趴体结束后才寄出邀请函。他说,那是 " 对未来时间旅行者…

    2014-09-05