|以前的报表都白做了!app上做可视化数据分析,这个方法太强了( 二 )
侧边导航
当流式布局页面比较长时 , 可以有一个快速定位的悬浮窗 , 点击后可以导航到本页面的指定位置 , 提高交互体验
本文插图
图表切换
当用户需要很方便的在模板局部切换查看不同的组件时 , 可以利用图表切换功能 , 可以很好地提高空间利用率和报表的美观度 。
按钮切换:
本文插图
自动轮播:
本文插图
2、联动钻取
因为手机屏幕的限制 , 移动端一般不会直接展示“PC大宽表” , 一般会用决策报表将所有的关键指标汇总展示 , 再通过钻取的方式查看具体某一指标的明细数据 。
展示多层级数据的同时 , 一定要考虑到交互动作 , 保证用户在浏览数据的同时 , 具有极佳的体验感 。
移动端弹窗
弹窗形式-模板:
本文插图
弹窗形式-文本:
本文插图
普通钻取
当我们需要钻取的子报表内容过多时 , 弹窗就不适用了 , 这时候我们需要在主报表里做一些下划线、高亮的效果能够提醒用户 , 这里是可以钻取的 , 就已经达到目的了 。 主子报表的UI风格保持一致 , 实现方式同PC一致 , 这里就不赘述了 。
3、参数应用
无论是决策报表还是普通报表 , 参数在移动端应用都较为频繁 , 如何在移动端更好的应用参数查询?分享以下几个技巧 。
参数面板
本文插图
四、细节优化
如何在展示数据的同时 , 提升移动端模板效果呢?对于开发者来说 , 是一个较为困难的事情 , 这里提供了一些小技巧 , 希望能帮助大家 。
1、横幅
为了提升移动端模板的美观性 , 横幅的应用比较常见 。 一般来说横幅会放置在最上方 , 主要结构分为几种:
- 报表主标题+公司logo , 提升整张报表较高的美观程度
- 用户名称+公司logo , 增强用户体验
- 报表主标题+核心指标 , 突出移动报表的核心指标
本文插图
2、指标卡
移动端因屏幕大小限制 , 需要我们合理利用移动端的每一寸空间 , 同时移动端对于视觉和交互的要求会更高 , 如何合理展示数据呢?一句话总结:尽量避免‘大宽表’的直接展示 , 合理利用指标卡展示汇总数据
本文插图
本文插图
3、数据点缀
一般我们会选用图表组件将数据可视化 , 当然 , 我们还可以利用报表块的强大功能 , 将数据本身与颜色、进度条、增长趋势组合起来 , 让数据更具凸显的效果 。
本文插图
4、配色
选取颜色的时候注意颜色的连贯性 , 整理了移动端模板的常用配色表分享给大家 。
推荐阅读
- 科学|太空探索:银河系的风使研究人员,以前所未有的规模探测星系?
- 科学|太空探索:整齐锁定的系外行星可能比以前想象的更常见!
- 群众网|以前的手机品牌为什么消失了?
- 余承东|余承东也比以前沧桑了许多,面目憔悴
- sanrenxing2016|答疑支招篇:如何从企业财务报表中分析企业竞争优势?
- 行业互联网|鼎龙股份2020年上半年净利1.99亿增长41.52% 合并报表范围增加北海绩迅收入
- 华为手机|以前的性价比,现在的过时机,华为这三款不建议入手
- 中年|中华五千年历史, 为什么现在才2018年, 两千年以前世界在干吗
- 阿里巴巴|被人民日报表扬,阿里砸36亿入股,千方科技凭的是什么?
- Array|你可曾想过太阳在哪个星座中?
