“NCP疫情分析管控”数据可视化大屏设计总结

常见的图表类型：

• 柱状图（堆积柱状图、百分比堆积柱状图）
• 条形图（堆积条形图、百分比堆积条形图）
• 折线图
• 各种数据地图
• 饼图（环图）
• 雷达图
• 漏斗图
• 词云
• 散点图（气泡图）
• 面积图（堆积面积图、百分比堆积面积图）
• 指标卡
• 计量图
• 瀑布图
• 桑基图
• 旭日图
• 双轴图（柱状+折线、柱状+柱状、折线+折线）

图片来源：RAWGraphs

图片来源：Viser

确定数据指标分析维度，从需要展示的信息出发，分别从“联系、比较、分布和构成”四个方面考虑。

例如“构成”需要考虑数据是随时间动态变化还是静态数据，动态数据通常涉及到时间的变化，可以用折线图展示从而对数据变化趋势一目了然。

本次大屏设计需要展示的数据中例如疫情的变化，进京人数变化等都可以采用折线图。

图片：数据指标分析维度

六、可视化设计

根据之前确定的大屏的数据骨架，此次大屏可视化主要纯可视化图表及和位置密切相关地理信息类数据。在此推荐一些值得学习的可视化工具：AntV(antv.alipay.com)、Viser RawGraphs、Infogram、Power BI 、ChartBlocks、ECharts（echarts.baidu.com）、Highcharts(www.hcharts.cn)、Visualize Free、iCharts、FusionCharts、ZingChart、Flot。

此次大屏设计涉及大量地理信息数据的展示，地理信息类一般可视化效果酷炫，空间感、三维立体效果强，有丰富的粒子、流光等动效、高精度的模型和材质等特点。

地图数据可视化工具：Mapbox、Echarts（echarts.baidu.com）、AntV (antv.alipay.com) 、HighCharts (www.hcharts.cn)

接下来确定视觉风格，需要综合当前的设计趋势、目标用户的特征和审美情趣。考虑主要背景、配色、点缀和动效等的应用。

色彩学涉及生理学、心理学、美学与艺术理论的综合学科，不展开赘述。

但需要注意保持色彩的一致性，最好使用深色调，避免过分的视觉刺激。通过适当给元素、标题、数字等添加一些诸如边框、图画等在内的点缀效果，能帮助提升整体美观度。适当的添加动效可以吸引用户的注意力同时提升感官体验。

然后就是沟通确认迭代设计，接下来的每版设计会在与业务、开发和用户的沟通下逐步完善和精致起来，避免一下子走到终点，然后返回进行大的修改。

题外话，这个过程中注意不可一味取悦所有用户，同时也应考虑时间、资金和团队管理等。

在测试修改环节由于大屏比较特殊，有自己的特点、属性、分辨率、色彩显示、运行和展示环境，往往只有投入真实的测试环境才可以找到问题。

图片：NCP疫情分析管控大屏

七、总结

1. 数据可视化大屏设计，首先依然是要了解用户和需求，这是出色的设计的基石。
2. 提前对涉及到的所有数据进行分析，可以为后面的开发工作避开很多坑。
3. 确立数据指标分析维度和清楚不同类型图表使用场景及优劣很关键。
4. 使用高效的工具能够事半功倍，除了常用的Sketch、Axure、Photoshop、Princilple,也可以借助Power BI、DataV、Ant V、Mapbox等工具生成图表再插入设计中即可。
5. 大屏终究是要服务于业务，数据和可视化手段都是为业务服务。
6. 平时多思考总结，注重提升自己的眼界和经验，给业务带来价值的同时也能给自己带来价值的提升。

本文素材来自互联网

（编辑：PHP编程网 - 黄冈站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!