要做好可视化数据大屏就缺少不了排版布局的设计,优秀的可视化数据大屏都需要进行精心设计的,排版布局要合理,重点突出,用户在观看时才容易抓住关键数据,清晰地获取到数据信息,从而容易理解数据,而且排版布局合理可以让数据大屏更加炫酷美观,更有吸引力。
一个优秀的可视化数据大屏需要全面考虑排版布局、图表组件组合以及样式美观技巧等多个方面。
本文通过迪赛智慧数可视化互动平台制作的数据大屏案例进行演示如何进行排版布局,先看下图。
(公司销售情况-PC端)
(公司销售情况-移动端)
从以上2张图片可以看到,数据大屏数据量比较多,因此,为了避免观看者感到混乱,数据信息呈现要有焦点、有主次,可以通过对比,把核心数据安排在中间位置;占较大面积,次要和辅助的次要指标放在两边或者周围,通常会把有关联的指标让其相邻或靠近,把图表类型相近的指标放一起,这样可以减少观看者理解数据上的负担并提高信息识别效率。
通过排版布局可以创建出数据大屏的基本结构和框架。一般排版布局遵循以下的原则。
当然也可以按实际需求进行调整,有的数据大屏有双核心数据的,如下图。
需要注意的是,核心数据最多只能两个,不能超过三个,超过三个大屏数据看起来会冗长混乱,层次不分。过多的核心数据不利于观看者获取信息。
总的来说,排版布局最重要的是核心数据要放大一些,这样可以使观看者迅速定位到关键信息。其余的次要指标按优先级依次在核心指标周围展开,通过周边的指标来进一步分析数据。
移动端方面排版布局比较简单,一般来说,核心数据是放在前面,次要指标都在下面。比较常见的方式有以下两种。
这种是很常见的手机版排版布局。
这种布局跟上一种不同的是,一行可以放两个次要指标。
如果说还有比较多的细节数据,可暂时隐藏,通过按钮点击进入下一页进行展示。用户需要时可通过鼠标点击等交互方式进入相应的数据详情页查看详尽的数据。
转自:https://zhuanlan.zhihu.com/p/572197499