色彩原理在信息数据可视化图表设计中的应用

陈默 沈丽燕 柴惠芳

摘 要：科学技术的发展促进了人们生活的进步，同时也使人们面对更多的信息和数据，因此，信息设计变得更加重要，如信息图表和数据可视化。在信息数据可视化设计中，色彩是强大的辅助表现工具，其可以用来编码定性或定量参数和数据。而如何将色彩原理运用到信息数据可视化设计中，是设计者们较为感兴趣的话题。

关键词：信息数据可视化；色彩原理；色彩模型

中图分类号：TP391.41 文献标识码：A 文章编号：1003-5168（2018）23-0014-03

Application of Color Principle in Visualized Graphic

Design of Information Data

CHEN Mo SHEN Liyan CHAI Huifang

（Information Technology Center， Zhejiang University，Hangzhou Zhejiang 310028）

Absrtact： The development of science and technology promotes the progress of people's lives， but also makes people face more information and data. Therefore， information design becomes more important， such as information charts and data visualization. In the visualization design of information data， color is a powerful auxiliary expression tool， which can be used to encode qualitative or quantitative parameters and data. How to apply the color principle to the visualization design of information data is an interesting topic for designers.

Keywords： information data visualization；color principle；color model

色彩是信息数据可视化图表设计中的重要维度之一，其具有唤起认知和情感的能力。从这个意义上来说，为可视化图表设计选择合适的颜色可能会引发特定的情感，提高人机交互的效果。本文将探讨色彩与用户之间的关系，研究用户对可视化图表设计中色彩运用的促进作用，并总结色彩原理在信息数据可视化图表设计中的使用规律。

1 信息数据可视化图表设计和色彩认知

1.1 信息数据可视化概论

近年来，人们对信息数据可视化的兴趣激增。在某种程度上，由于廉价的、无处不在的数据的出现，因此，信息数据可视化已经成为探索和解释科学、医学、人文，甚至人们日常生活中产生的数据的常用媒介。随着为研究人员和学者创建的视觉分析工具的数量和类型的快速增长，数据可视化成为正确理解数据信息的最好方法。信息数据可视化使用静态的或者动态的可视化数据表示来讲述一个故事或传达一个想法，并且通过各种各样的途径（包括新闻媒体、博客和艺术）在公共空间中传播[1]。

1.2 色彩认知

在数据可视化设计中，颜色是吸引用户阅读最强大的武器之一，但图表配色常常让设计师很头疼。筆者在设计色板时，也遇到了类似的问题。这里的色彩指的是可视化图表设计中的分类色板。分类色板是通过不同的颜色区分数据对象，且不代表任何特定语意。

人们对色彩的认知不仅仅是低层次的感知。人类将颜色划分为多个逐步提升的抽象层次。对与颜色相关的语言和语义范畴的研究称为色彩认知。

2 色彩原理模型

2.1 RGB模型

混合红、绿、蓝三种颜色来表现各种颜色的方式称为RGB色彩模型。所有颜色混合在一起就变成白色，完全没有颜色的状态就变成黑色。RGB颜色模型最早是由托马斯·杨在1802年提出的理论，并在1850年由赫尔曼·冯·赫姆霍尔兹进一步发展成为杨格-赫姆霍尔兹三色色觉理论。RGB颜色空间通过RGB三个颜色通道的变化以及其相互之间的叠加来得到各式各样的颜色的。红绿蓝是最常用的色彩空间为加型色彩空间，相关设备基于三原色原理，通过红、绿、蓝3种颜色描述其他颜色[2]。

2.2 CMYK模型

由青、品红、黄三色的粒子互相混合表现色彩的方式称为减色组合，通常都会加入黑色油墨，并称为CMYK色彩，适用于印刷工业。在工厂中，用高分辨率的打印设备输出本地制作的文件，原理等同于减去油墨本身的颜色。1719年，Jacob Christoph Le Blon申请了第一个实用的三原色复制过程的专利，其实际上使用了一个类似于CMYK的RYBK颜色模型。

2.3 RYB模型

歌德（Johann Wolfgang von Goethe）于1810年发表的《色彩理论》（Theory of Colors）一书被认为是对RYB颜色理论的第一个基本总结。RYB：红、黄、蓝，构成了标准艺术家色轮中的原色三合一模型。Johannes Itten于1973年提出的RYB颜色模型在艺术教育中广泛使用，其中红色、黄色和蓝色被定义为减色法三原色。Gossett和Chen于2004年提出了一种基于三原色之间三线性插值的RGB颜色空间到RYB颜色空间的转换方法。然而，这些转换方法是不可逆的[3]。

2.4 CMYKOG模型

色彩學上除了以上三种色彩模型，有时还会开发其他颜色模型来支持特定的输出设备，如六色印刷工艺（CMYKOG模型）：青色、品红、黄色、黑、橙和绿。

3 色彩术语

3.1 色彩模型+色域=色彩空间

色域是指在特定环境中可以精确表示颜色的子集。sRGB色域设备（如移动电话）的色域是灰色的，外面的部分表示可用的全部颜色范围[4]。

例如：RGB模型+色域=色空间，与RGB颜色空间的色谱比较，此图像显示sRGB、Adobe RGB和ProPhoto RGB颜色空间。CMYK颜色空间被标记类似于特种纸。

3.2 曼塞尔颜色体系

阿尔伯特·曼塞尔色彩系统是指色相、明度和纯度之间的关系。19世纪90年代末和20世纪初，阿尔伯特·曼塞尔提出3D色彩空间。色相是指5种主色调：红色、黄色、绿色、蓝色和紫色。明度是指底部为黑色（值0），顶部为白色（值10），一般理解为颜色的明暗关系，类似素描中表现的形式，即黑白灰的关系。纯度是指从每个薄片的中心呈放射状测量。较低的色度值不那么纯净，更像柔和的粉彩。纯度可以理解为色彩的鲜艳程度。

3.3 潘通色卡的颜色体系

潘通色卡是当今交流色彩信息的国际统一标准语言，潘通配色系统是标准化颜色体系的代表。由分配号指定的1114色如“PMS 3527 CP”来定义一个具体的颜色。CMYK彩印过程有效地再现了潘通颜色的一个特殊子集。大多数潘通集无法用CMYK进行模拟，并且超出了CMYK的范围。2001年，潘通开始将其专有系统翻译成RGB值。潘通工作室应用程序为潘通颜色提供sRGB、CMYK和十六进制值。

潘通工作室APP成为应用色彩理论的标杆。如今，使用潘通工作室移动应用程序检查数字图像的配色方案，以影响印刷媒体。这款应用的基本版本在iOS平台上是免费的。

4 色彩原理在信息数据可视化图表设计中的应用

4.1 主色和辅助色色彩和谐原则

图1是浙江大学校园网建设的情况，数据展示了2012—2017年用户上网总流量。笔者在色轮上选取1个主色，在主色对面选取另外2个主色的对面色，称为辅助色。其中，主色为柠檬黄，辅助色为蓝色和紫色。由这3个颜色创作的数据图表，主色黄色在中间起到了凸显的作用，这得益于主色和辅助色之间的利用，整体色调也是很和谐的。

4.2 间隔色的色彩和谐原则

图2是浙江大学2012—2017邮箱容量和邮件数量情况。笔者在色轮中选择2个相隔的颜色，用于图表中的效果如图2所示，带黄色和红色的色调，视觉上属于暖色调，看起来很舒服。

4.3 互补色的色彩和谐原则

图3是浙江大学2012—2017年运维服务现场处理工单平均时长情况。在色轮中选取2个主色，这2个主色分别互补，位于色轮的对面，在色轮的第二圈选取这2个颜色的低明度的颜色。设计一个二维条形图，这个设计的互补在色调的运用中起到了关键作用。

4.4 三界色色彩和谐原则

三界色是指三位一体的颜色。这3种颜色在色轮上相距的位置正好相等。图4是浙江大学知源网2014—2017年统一搜索资源量。利用三界色（青色、品红、黄）的色调，这样的取色可以让代表的3个元素在色彩纯度上区分开来，能让人一眼很直观地看到分别代表的元素的变化和位置关系。

4.5 四角色色彩和谐原则

四角色是指选取的4种颜色在色轮上的距离相等。2011—2017年浙江大学校园卡建设中校园卡账户变动图的设计（见图5），利用了四角色的取色原则，选取了黄色、蓝色、绿色和洋红所组成的色调。仔细观察，四角色原则就是运用了两次互补色原则，在元素多的情况下使用同样能达到很和谐的色调效果。

5 结语

本文研究了色彩理论的基础和色彩模型，以及这些方法如何应用于建立有效的可视化数据图表。此外，还定义了颜色和谐，并演示了颜色和谐在案例研究中的应用，介绍了潘通配色系统和曼塞尔色相系统。

在大数据时代下，可视化设计越来越重要，色彩是可视化图表设计中的一个重要元素，如何运用色彩原理去指导可视化的设计不能被忽略。在具体设计过程中，希望设计师和可视化设计者及时总结用户的反馈，结合色彩原理不断改进设计，从而促进和提升可视化方案的设计，增加用户的体验感。

参考文献：

[1] Dur B [I] U. Data Visualization and Infographics In Visual Communication Design Education at The Age of Information[J]. Journal of Arts and Humanities，2014（5）：39-50.

[2]张康，Ammeraal L，王长波.计算机图形学原理[M].北京：机械工业出版社，2012.

[3]Sugita J， Takahashi T. Paint-like Compositing Based on RYB Color Model[J].Acm Siggraph ACM，2015（9）：1.

[4]Krauskopf J，Williams D R，Heeley D W. Cardinal Directions of Color Space[J]. Vision Research，1982（9）：1123.