众所周知,人的左脑负责处理文字和逻辑相关的事务,人的右脑负责处理图像和艺术相关的事务。
其特点是,左脑处理速度慢,右脑处理速度极快;并且人脑在处理信息时,是通过视觉和文本两个通道。这也就是为什么人们爱追求可视化,因为人脑处理图像的速度远超过处理文字,即常说的一图胜千言。
但大多数人面临这样一个挑战,即我们认识到了数据可视化的必要性,但缺乏数据可视化方面的专业技能,部分原因可以归结于,数据可视化只是数据分析过程中的一个环节,数据分析师可能将精力花在获取数据、清洗整理数据、分析数据、建立模型,但在最终的展示沟通上力不从心。
与此同时,对于可视化类型的选择,既不是纯粹美学,也不是完全个人化。一个不合适的方案,受众可能会觉得乏味或者费解,甚至可能造成和受众之间的信任壁垒。
今天小亿就来为大家说说什么是数据可视化,以及可视化有统一的规范吗?大公司都是如何做数据可视化的?
一、什么数据可视化?
数据可视化是把相对复杂、抽象的数据通过可视化的方法以人们更容易理解的形式展示出来的一系列手段。数据可视化是为了更形象地表达数据内在信息和规律 ,促进数据信息的传播和应用。
在当前新技术支持下,数据可视化除了“可视”,还有可交流、可互动的特点,其本质是传递信息,即如何将信息准确、可靠、易于理解传达给对方。
而大屏数据可视化是以大屏为主要展示载体的数据可视化设计,也是当前可视化领域的一项热门应用,通常可以分为信息展示类、数据分析类及监控预警类。数据可视化大屏,有两个要点:一是展示效果的酷炫,二是展示数据之间的层次关系。好的数据可视化大屏是布局、色彩、图表、动效的综合运用。
二、数据可视化的原则
数据可视化是一种信息交流形式,它以图形形式描绘密集和复杂的信息,最终的视觉效果旨在简化数据,并使用数据帮助用户决策。与此同时,数据可视化可以表示不同类型和大小的数据,从几个数据点到大型多元数据集,在总体上遵循以下原则:
1.准确性
数据可视化需考虑数据的准确性,清晰度和完整性。以不失真的方式呈现信息,减少用户的思考成本。
2.实用性
强调数据需要实用,可以帮助用户使用强调探索和比较的上下文和启示来导航数据,比如探索比较数据,预警数据,浏览数据。
3.适应性
能适应多设备、多场景。可根据不同设备大小调整可视化,同时预测用户对数据深度、复杂性和模态的需求。
三、数据可视化的分类
数据可视化可以以不同的形式表示。图表是表达数据的常用方法,因为它们描述了不同的数据类型,并可以进行数据比较、探索等。决定使用图表类型主要取决于两件事:要传达的数据以及要传达的数据的内容。下面我们分别来介绍图表的各种类型。
1.比较类
可视化的方法显示值与值之间的不同和相似之处。使用图形的长度、宽度、位置、面积和颜色来比较数值的大小,通常用于展示不同步分类间的数值对比,不同时间点的数据对比。
2.占比类
可视化的方法显示同一维度上占比关系
3.区间类
可视化的方法显示同一维度上值的上限和下限之间的差异。使用图形的大小和位置表示数值的上限和下限,通常用于表示数据在某一个分类(时间点)上 的最大值和最小值。
4.关联类
可视化的方法显示数据之间相互关系,使用图形的嵌套和位置表示数据之间的关系,通常用于表示数据之间的前后顺序。
5.趋势类
可视化的方法分析数据的变化趋势。使用图形的位置表现出数据在连续区域上的分布,通常展示数据在连续区域上的大小变化的规律。
6.时间类
可视化的方法分析数据的变化趋势,使用图形的位置表现出数据在连续区域上的分布,通常展示数据在连续区域上的大小变化的规律。
7.地图类
可视化的方法显示地理区域上的数据,使用地图作为背景,通过图形的位置来表现数据的地理位置,通常来展示数据在不同地理区域上的分布情况。
四、数据可视化大屏的设计流程
1.梳理业务需求
大屏设计要避免为了展示而展示,排版布局、图表选用等应服务于业务,所以大屏设计是在充分了解业务需求的基础上进行的。那什么是业务需求呢?业务需求就是要解决的问题或达成的目标。设计师通过设计的手段帮助相关人员达成这个目标,是大屏数据可视化的价值所在。
2.根据业务场景抽取关键指标
关键指标是一些概括性词语,是对一组或者一系列数据的统称。一般情况下,一个指标在大屏上独占一块区域,所以通过关键指标定义,我们就知道大屏上大概会显示哪些内容以及大屏会被分为几块,如图所示,确定关键指标后,根据业务需求拟定各个指标展示的优先级(主、次、辅)。
(1)主:主要指标位于屏幕中央,多为动效丰富的地图或翻牌器
(2)次:次要指标位于屏幕两侧多为各类图表
(3)辅:主要指标的补充信息可不显示或显示于副屏或鼠标经过显示
3.确立指标分析维度
同一个指标的数据,从不同维度分析就有不同结果。很多小伙伴做完可视化设计,发现可视化图形并没有准确表达自己的意图,也没能向观者传达出应有的信息,可视化图形让人困惑或看不懂。出现这种情况很大程度就是因为分析的维度没有找准或定义的比较混乱。
4.选定可视化图表类型
当确定好分析维度后,事实上我们所能选用的图表类型也就基本确定了。接下来我们只需要从少数几个图表里筛选出最能体现我们设计意图的那个就好了。选定图表注意事项:易理解、可实现;
(1)易理解
可视化设计要考虑大屏最终用户,可视化结果应该是一看就懂,不需要思考和过度理解,因而选定图表时要理性,避免为了视觉上的效果而选择一些对用户不太友好的图形。
(2)可实现
我们需要了解现有数据的信息、规模、特征、联系等,然后评估数据是否能够支撑相应的可视化表现;
5.了解物理大屏,确定设计稿尺寸
多数情况下设计稿分辨率即被投大屏的信号源电脑屏幕的分辨率。有多个信号源时,就会有多个设计稿,此时每个设计稿的尺寸即对应信号源电脑屏幕的分辨率。
一般情况下设计稿的分辨率就是电脑的分辨率,当有多个信号源时,有时会通过显卡自定义电脑屏幕分辨率,从而使电脑显示分辨率不等于其物理分辨率,此时,对应设计稿的分辨率也就变成了设置后的分辨率;此外,当被投电脑分辨率长宽比与大屏物理长宽比不一致时(单信号源),也会对被投电脑屏幕分辨率做自定义调整,这种情况设计稿分辨率也会发生变化。
6.页面布局、划分
尺寸确立后,接下来要对设计稿进行布局和页面的划分。这里的划分,主要根据我们之前定好的业务指标进行,核心业务指标安排在中间位置、占较大面积;其余的指标按优先级依次在核心指标周围展开。一般把有关联的指标让其相邻或靠近,把图表类型相近的指标放一起,这样能减少观者认知上的负担并提高信息传递的效率。
7.可视化设计
根据定义好的设计风格与选定的图表类型进行合理的可视化设计。
目前来讲大屏可视化主要有指标类信息点和地理类信息点两大可视化数据。指标类信息点可视化效果相对简单易实现,而地理类信息点一般可视化效果酷炫,但是开发相对困难,需要设计师跟开发多沟通的。
地理类信息一般具有很强的空间感、丰富的粒子、流光等动效、高精度的模型和材质以及可交互实时演算等特点,所以对于被投电脑、大屏拼接器等硬件设备的性能会有要求,硬件配置不够的情况下可能出现卡顿甚至崩溃的情况,所以这点也是需要提前沟通评估的。
8.页面定稿、开发
实际上页面开发阶段并不是到了这一步才进行,这里说的页面开发仅指前端样式的实现,实际上后台数据准备工作在定义好分析指标后就已经开始进行了,而我们当前的工作是把数据接入到前端,然后用设计的样式呈现出来。
9.整体细节调优与测试
这部分是指页面开发完成后,将真实页面投放到大屏进行的测试与优化。这里主要有两部分工作:
(1)视觉方面的测试:关键视觉元素、字体字号、页面动效、图形图表等是否按预期显示、有无变形、错位等情况。
(2)性能与数据方面的测试:图形图表动画是否流畅、数据加载、刷新有无异常;页面长时间展示是否存在奔溃、卡死等情况;后台控制系统能否正常切换前端页面显示。
五、7种大屏设计与布局介绍
1.标准大屏
(1)常规布局
①布局要点:左中右。中间为主要指标,占据页面较大面积;左右两边为次要指标,面积较小,较集中,展现指标数量较多
②应用场景:多数适用。如教育、房地产、政务等行业的数据分析展示,需要展示多项指标,并突出某些关键指标时适用
③优势:清晰展现较多的指标,主次分明
(2)左右布局
①布局要点:重点区域扩大,左或右放置少量指标,不易展示大量指标
②应用场景:常用于地图展示、三维模型展示,将重点区域扩大。如智慧园区、智慧工厂、智慧城市等
能够展现更多的图像区域,三维模型的立体感更强
2.超大屏
(1)均等布局
①布局要点:按照1:1:1平均分配每一块的展示区域
②应用场景:常用于展示平级指标
③优势:无明显主次区分的指标需要展现时,划分区域,在视觉上不会过多干扰,平级展现时适用
(2)故事布局
①布局要点:没有明显的分割区域
②应用场景:常用于讲述一个完成的故事线
③优势:数据连贯性强,当指标间有关联关系时,可以有逻辑地递进去展现
(3)君臣布局
①布局要点:中间大,两边小。中间为主要指标,占据页面较大面积,通常放置三维大图;左右两边为次要指标,面积较小,较集中,展现指标较多
②应用场景:需要展示多项指标,并突出某些关键指标或三维图像时适用
③优势:图像更大更清晰立体,指标主次分明
3.异性屏
(1)纵向布局
①布局要点:由于屏幕的原因,将页面分割为上中下部分,中间区域较大,上下较小,重点突出中间区域
②应用场景:在一些特殊的展会上使用
③优势:很好的适配特殊场景下的屏幕,主次分明,突出重点
(2)繁星布局
①布局要点:布局较为随意,满屏都是各种各样的指标,尽可能多地展现
②应用场景:常用于日常运维、监管人员使用
③优势:展现指标多而全面
六、小结
大屏因为大,承载数据多,为了避免观者迷失,大屏信息呈现要有焦点、有主次。可以通过对比,先把核心数据抛给用户,待用户理解大屏主要内容与展示逻辑后,再逐级浏览二三级内容。
另外想必一定有人好奇上面介绍的这些布局中炫酷的大屏是怎样制作的呢。这里,小亿就向大家推荐这个好用的数据可视化平台——酷屏。
酷屏是亿信华辰自主研发的新一代数据可视化产品,可灵活、快捷地制作各类交互式常规屏和大屏可视化,内置百余种炫酷组件和3D特效,让数据“跃然屏上”,得到更形象、更直观的可视化呈现。
对于设计和布局方面,酷屏的一个重要优势就在于:能够真正达到设计走多远,展现就能到多远的境界。方便开发和实施人员快捷的完成页面需求并最终得到好的展现。任何类型的用户想要达到的页面效果及布局都可以使用酷屏分析快捷地制作实现。