产品如何进行大屏数据可视化.md - 好文

最近接到一个需求,需要给公司的竞赛平台面对省/校/竞赛进行大屏的可视化话数据展示,闲暇之余对自己最近的工作进行一些总结;

一.数据可视化的定义

数据可视化主要是关于数据_视觉表现形式的科学技术研究 --百度百科

用通俗的解释进行描述就是通过图表,图像,视频等可视化的手段将原有存在于数据库中的进行属性归类,数据变化规律在某一载体上进行展示的过程称之为数据可视化;
例如:

二.实现数据可视化的几个关键步骤

1.明确需求,和需求方明确业务场景

在进行第一次接收到数据可视化需求时,我们一定需要明确是将什么进行可视化,以及我们展示的对象是谁;举个实际的例子,我们之前的高校MOOC平台数据可视化,到底是展示教学进度可视化还是课程汇总的可视化,我们展示对象是教育厅?教务处?还是只是我们平台内部的数据监控?展示对象的不同往往也决定了我们在大屏设计时重点展现的信息不同;

2.进行数据可视化的维度确认,开发需加入

在明确了业务场景后,我们接下来需要进行开始考虑可视化展示的维度,这里我建议用xmind进行维度梳理,梳理后我们一定要和开发进行交流确认,因为我们所有维度的数据源是来自于开发的数据库查询,如果某类维度的统计和增长变化根本无法在现阶段进行技术实现,则我们需要在设计时进行一定程度的调整;

3.确定载体和载体的具体尺寸

确认完基础维度之后,需要进行确定大屏的载体,其实主要是确定大屏展示时的分辨率和长宽比,因为一般需要进行大屏展示时都有一个特定显示器,如果是定制显示器,我们就需要在规划阶段避免掉因分辨率,长宽比图像显示不全.甚至在特殊情况下我们需要进行多套分辨率的UI的设计,去适配不同的显示器;

4.根据维度进行产品原型图设计,选定可视化控件

在进行可视化控件的时候比较依赖个人审美和技术能力;可视化控件有很多,现在很多前端比较懒,只知道用轮子,连改造轮子都不愿意,不知道是懒还是不会.所以产品在设计时,如果为了更高效率的出图,使用技术人员常用的EChart进行控件描绘;或者使用成熟的商业模板进行,这里推荐百度数据可视化
Suga,方便又实用,基本上满足百分之九十以上的需求;

在进行原型图设计时,我们要遵从一些设计原则,就是最重要的模块一定要放在最显眼的位置,并且通过页面模块之间的关联让整个屏幕层次分明;如果你不太擅长这些,可以用文字标记出哪些是最要,哪些是次要,排版就交给设计师吧,让专业的人做专业的事;

5.进行UI配色动效确认-设计师

接下来就是针对大屏进行模块配色和区域调整,达到视觉最佳,重点突出,层次分明,在某些展示模块,如果公司技术人员有实力的话,可以进行动效展示,没实力当我没说;

6.开发后进行实际展示微调

任何产品开发后一定需要进行调试,有条件的话最好实用实际的载体进行调试,因为不到最后一步,开发在自己的电脑上模拟永远会有小瑕疵

7.交付确认

三.注意事项

1.以用户为中心设计
我们千万不能想当然的进行业务场景的模拟,一定要让终端用户参与进来,在原型图出来后,一定要和需求提出方进行交流确认;做好交互和展示设计;
2.选择正确数据进行展示;
同一套系统中,我们衡量某一指标的变化和统计一定要明确,不要出现可视化一套数据,后台系统一套数据;

设计师方面我这里推荐一个好文链接他讲的更多是细节确认,比如设计图要切几倍率,设计师如何排版;文章链接如下:[
http://www.woshipm.com/pd/1782868.html <http://www.woshipm.com/pd/1782868.html>]

热门工具换一换