专栏首页理论坞一个APP的交互优化方案

一个APP的交互优化方案

这是之前为一个健身app【减约】做的交互优化建议方案,贴出来为大家分享下,有不同的建议大家也可以在留言区提出

一、【方案】与【记录】模块分析

1、【方案】模块中有五大方案,可以说是五大入口,可见方案比较重要,占了一个模块;但是五个模块以banner的形式且竖形排列,占领了整个页面,卡片式的设计略大,过于拥挤且单一;

2、【记录】模块占主要区域的是每天摄入卡路里的量,其次是每天的饮食搭配; 可以看出【记录】模块功能和形式都很简约

优先级

从第一次登陆首屏为【方案】,可以知道【方案】的优先级大于【记录】,应该是做为最重要的一个模块;在用户没有制定方案的前提下,从用户价值考虑,冷启动之后会的首屏应该为【记录】模块,因为用户更关心自身状态,“今天还可以摄入多少热量?”

在选择了定制方案后,首屏为【方案】,因为用户也更关心自身状态,既然制定了方案,也希望能快速去了解自己的训练状况!

二、整合优化建议

【方案】与【记录】模块整合

分两种情况

1、当用户制定训练方案时的显示状态

2、当用户没有制定训练方案时的显示状态

因为这两个模块整合在一起,暂且就称呼他为【训练】

二、1 当用户制定训练方案的时候,显示方案里边的内容

  1. 保留中间消耗卡路里的数据显示
  2. 将方案中的五大方案,整合在一起放置在记录分析的下方
  3. 将制定过的计划的【饮食】、【训练】、【我的计划与报告】整合在一起,集中在展示。如:饮食计划自动列出方案中给出的早、午餐计划,不用用户再去一一制定,而用户想要自定义时则可以自己去修改;
    1. 【饮食计划】【训练计划】【我的计划】等模块可自由调整优先级顺序(或删除)
    2. 当全部删除时,会出现(二、优化建议中第2中方案)(饮食记录(如现在版本中【记录】页面)
    3. 为何这样修改? 用户可自由添加和删除,以及排序,这样体验上是不是更好一些呢?这样使用户有一种掌控感,另外用户可以根据自己需求,比如小明想第一眼看到【我的计划】,而作为女生的小红想看到【饮食计划】;用户需求不一样,让他自己去做选择,如果不做也可以用默认状态,这样在体验上会不会更好一些?
    4. 在卡路里消耗的旁边添加【用户报告和计划】和【添加训练】的快捷入

具体请看下图

二、2当用户没有制定训练方案的时候,显示为饮食计划和运动

当用户没有制定计划时,显示现在版本的【记录】页面。如下图

三、其他方面建议

1、【方案】模块

1.1 五个方案以竖形banner排列,整体色彩没有统一,过于“花”;

建议:1、可采用插画的风格,来统一视觉上的感受,现在的渐变灰过度到人物显得很“脏”

2、可采用调性相似、内容适合的照片,加以黑色蒙版来作为背景,使整体风格在视觉上统一

1.2 五个方案的排列形式 过于传统

建议:以方形卡片加以icon的形式来展现,icon要尽量展示这个方案的特征,用标题来说明,也可以加上少量文字来解释

2、【记录】模块

首先一点,现在的【记录】模块又一个bug,如图

在进行上下滑动的时候,右边出现了滚动条,按理说是不应该出现的,在其他的大模块,都没有出现这种情况!

下面是优化建议,如图:

3、【社区】模块

1、 社区模块中有一个【碎片运动】的小方案,我总觉得应该放在方案中,因为这属于运动模块;

2、【谣言粉碎】【碎片运动】【减约知道】【减脂干货】【方案小组】这几个模块当作头部,固定在标题栏下方

而banner可选择在任一区域下展示,或者每个子模块下展示一个(不建议这样做)如图

第一个为社区为主页原型展示

第二个为食谱页面展示

交互形式:可点击上方导航进行切换,也可以手指左右滑动进行切换

4、【我】模块

1、我用qq登陆的,头像也是qq头像,同步过来之后,头像变得模糊了,不知道是什么原因,原头像并不模糊

2、依然看上图

2.1、我太不清楚ID是否占了很重要的位置,以及在其他页面是否很有用途,为何显示级别这么高?

2.2、城市和地区性别这些应该是给其他用户,用来展示信息的,自己不需要一直观看,可以省略

建议只显示关注和粉丝就可以!

2.3、昵称放在标题栏的上方不是很妥当,头像旁边本应该放昵称

本文分享自微信公众号 - 设计谜(UXMystery),作者:霜

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2017-10-06

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 1分钟教你画好看的分形光效图

    宇相
  • 精选6大界面交互网站,个个好用到爆!

    UI movement此站更新比较快,主要展示移动APP的动效界面为主。是一个致力于手机和分享最好的UI设计灵感,帮助设计师获得最优秀的UI设计作品,通过邮箱可...

    宇相
  • 官方最完整版:张小龙微信公开课超时演讲,总结微信8年

    刚刚我们在下面看了一下这些吐槽,非常好,因为我每天都在听到这样的声音,都已经习惯了。我觉得在中国来说,每天都有5亿人说我们做得不好,每天还有1亿人想教我怎么样做...

    宇相
  • Python工具开发实践-csv文件分割

    今天工作中需要处理一个700多W行的csv文件,要求将csv文件按照100W行进行分割,以便可以用excel打开,找了几个脚本,处理小文件都差不多,但是当我尝试...

    披头
  • 数据工作本质:从业务中来,到业务中去

    经过取数工作后,就形成了由业务运行产生的原始数据。原始数据是极其丰富的,有很多种分类方法,而从用户的观点来看可以大致分为两种。一种是用户意识到的主动提供的,如注...

    博文视点Broadview
  • 【程序源代码】Spring Cloud的企业级微服务框架

    Spring Cloud的企业级微服务框架?基于layui+springcloud的企业级微服务框架(用户权限管理,配置中心管理,应用管理,....),其核心的...

    程序源代码
  • 如何优雅的完成iOS国际化

    上网随便翻翻,关于iOS国际化的文章层出不穷,我看到过很多很好的方法,有很多也是我以前用过的方法。从我的iOS开发生涯到现在已经有五个年头了,虽然去到企业里的项...

    Leacode
  • PlantUML实践 | GUI原型

    Qt君
  • 一个简单的图片浏览器

    Qt君
  • ORACLE 11gR2 DG(Physical Standby)日常维护

    1.3.2 备库切换到open状态,启用Real-time query A physical standby database instance cannot...

    Alfred Zhao

扫码关注云+社区

领取腾讯云代金券