一个年产值超60亿元的上市公司是如何做数据可视化规范的

发布时间：2021-02-23      游览量：3509

• 数字化转型银行数字化转型

这几年很多公司都展开了数字化转型，也在公司内部普及了“数据可视化”，但在实际工作中，可视化常常是在多人协作中完成的，我们该如何制定一份可视化标准来确保跨人员、跨平台设计呢？

这里Smartbi给大家送上一个年产值超60亿元的上市公司的经典案例

 

 

 

我们常听到视觉识别系统（VIS），可视化有没有专门的设计系统呢？ 本周，我们尝试翻译了一篇3次凯度信息之美获奖者——Amy Cesal 的文章《What are Data Visualization Style Guidelines》，一起看看她是如何看待数据可视化设计系统的吧！ 

 

一、什么是数据可视化设计系统？

2019年谷歌（Google）和伦敦城市智能（London City Intelligence）相继将数据可视化指南纳入设计规范系统中。数据可视化在企业决策和品牌价值弘扬中起到了越来越重要的作用。

↑ 伦敦城市智能（London City Intelligence）设计指南

 2014年，Amy Cesal为阳光基金会（Sunlight Foundation）设计了第一份数据可视化设计指南，2017年消费者金融保护局（CFPB）也提出了类似的设计需求。我很高兴看到越来越多的组织投入资源规范数据可视化工作。

↑ 美国消费者金融保护局（CFPB）可视化设计指南

什么是数据可视化设计指南？它们有什么共性和特性？如何从中启发来构建自己的数据可视化设计指南？

 企业或组织进行数据可视化时，需要用数据可视化设计指南来规范信息表示形式。通常包括是什么（图表的类型有哪些？）、为什么（如为什么使用这个颜色？）和怎么做（如用什么工具设计？）。如果涉及到一些设计工具，如Excel、R、D3.js或Tableau，可视化指南还会提供一个模板来演示如何应用。

 

↑ 伦敦城市智能（London City Intelligence）设计指南 

 

通常，数据可视化指南是设计规范系统的一部分，不同类型的组织有不同的信息、受众和需求。我将收集到的案例按类型进行了整合，并尽可能突出每个案例的特性。 

二、盈利机构可视化指南

 

1. 谷歌材料设计语言（Google Material Design）

谷歌也提供了一系列数据可视化中的“好（do）”和“坏（don't）”例子，并作出了相应解释。例如，同类别变量应避免使用不同颜色：

 ↑ 谷歌材料设计语言（Google Material Design）

 

 指南中还有一小节专门研究仪表盘（Dashboards）排版。介绍了各类独特的排版布局，以帮助企业对仪表盘进行标准化设计。

 

↑ 谷歌材料设计语言（Google Material Design） 

 

2. IBM

IBM有专门的篇章指导设计师去思考数据可视化的目的及可能受众。可视化的出发点是什么？是出于读者的需求还是基于某个数据库？类似的问题有助于设计师进行深度思考，而不是仅仅停留在视觉层面。

 

↑ IBM设计语言规范

 

 IBM还以通俗易懂的方式归纳了常见的图表类型及其适用范围。例如下图中的堆叠柱状图，IBM以设计师的口吻对图表适用范围进行描述——“我想使用该模型是因为我想：展示时间变化/对比/体现相关性/展示细分数据”。

 ↑ IBM设计语言规范 

 

三、政府机构可视化指南

 

1. 美国金融消费者保护局（CFPB）

CFPB的设计指南指出了如何根据具体的法律规定和政府要求制作图表，尤其是《美国508无障碍法案》，美国的所有政府机构都需要遵循这条法案。

 例如，由于CFPB常常需要根据历史数据进行预测，因此该指南指出预测数据必须强调出来，否则会让人误解它们是真实数据。比如如果是柱状图，可以用浅一点的颜色或用虚线框出预测数据；如果是折线图，可以用虚线表示预测数据，并在图例中指出哪些是真实的，哪些是预测的。

 ↑ 美国金融消费者保护局（CFPB）设计规范手册

 

2. 伦敦城市智能（London City Intelligence）

数据可视化中哪些颜色可以一起使用而哪些不能？为什么？该指南深入研究了可视化色彩选择方面的考量，按优先顺序提供了一系列配色，并指出了每个颜色由深到浅的使用规范。除此之外还给出了该系列配色在浅色和深色两种背景下的使用规范。

 ↑ 伦敦城市智能（London City Intelligence）设计指南