超实用的可视化大屏配色方法
本文分享下可视化中颜色的思考，大家多沟通交流。
前言
今天来分享下可视化中颜色的运用思路和在设计中如何思考颜色的方法，并展示一些使用颜色来实现特定信息设计目标的方法。欢迎大家沟通交流。
颜色是构建信息仪表盘和数据可视化的重要工具。在自然和建筑环境中，颜色可能表示危险，警示，引诱和其他状态。作为数据可视化设计师运用颜色对比的形式来对信息设计中做出有用的区分，吸引用户的注意力以及传达或加强品牌标识等。但是同样色彩也带来了一些挑战，如果使用不当的话，可能分散用户注意力，从而失去视觉重心。在极端情况下，使用一些颜色会干扰用户的理解，导致页面被误解造成一些不必要的歧义。有效地使用颜色，可以提高可视化的信息价值、增强信息呈现方式的吸引力，从而使信息脱颖而出并被记住。
色彩情绪
如图所示，不同的颜色带给我们不同的色彩情绪。
颜色有冷暖之分。冷色比如一说到蓝、蓝紫、蓝绿、紫、淡蓝等色，则容易联想到太空、冰雪、海洋等物像，就会产生寒冷、理智、平静、稀薄的、淡的、远的、轻的、等感觉。暖色有大红、桔黄、玫红、黄橙、红紫等着色，就联想到太阳、火焰、热血等物像，产生温暖、热烈、危险等感觉，使人产生冲动情绪。
一提到蓝色就会想到科技、数据、智能等关键词，非常贴合可视化的调性。这也是为什么在可视化设计中大多数会采用蓝色作为主色的原因。对色彩情绪有了一定的了解这也为我们做设计起到事半功倍的效果。
颜色映射原理
色彩可分为有彩色系（赤橙黄绿青蓝紫，等等）和无彩色系（黑白灰）。色相取决于光的波长，三原色为红色R、绿色G、蓝色B。其他彩色可以通过三原色按一定比例混合得到。当三原色都没有的情况则为黑色，表示没有光线发出；当三原色等量混合则为白色。在数据可视化领域中，数据与颜色的映射是非常重要的一个环节。颜色有三个视觉通道，分别是色调（H）、饱和度（S）、明度（B），不同的视觉通道可以与不同的数据类型建议关联。
色调（H）：通常使用颜色中的不同色调来描述不同的分类数据，赤橙黄绿青蓝紫分别代表着7种不同的色调。
饱和度（S）：饱和度也称纯度，反应含色成分的比重。指色彩的鲜艳程度，饱和度越高，表现越鲜明，饱和度较低，表现则较黯淡。
明度（B）：明度指色彩的亮度。颜色有深浅、明暗的变化。比如深黄、中黄、淡黄、柠檬黄等黄色在明度上不一样，紫红、深红、玫瑰红、大红、朱红、桔红等红颜色在亮度上也不尽相同。这些颜色在明暗、深浅上的不同变化，也就是色彩的又一重要特征——明度变化。
色彩的明度变化有许多种情况：
一、不同色相之间的明度变化。如：白比黄亮、黄比橙亮、橙比红亮、红比紫亮、紫比黑亮；
二、在某种颜色中加白色，亮度就会逐渐提高，加黑色亮度就会变暗，但同时它们的纯度(颜色的饱和度)就会降低。
情绪版的运用
什么是情绪版？维基百科中对情绪板的解释是：情绪板是由拼贴元素组成的视觉展示，由图像、文本、对象小样等元素组成。可以是有目标主题的，也可以是随机选择的任何素材。
情绪板，简单来说就是由图像，视频和其他视觉元素组成、拼贴在一起的想法和过程，主要目的是讲述项目背后的故事，作为设计方向形式上的参考。同时情绪板也可以在配色方案、视觉风格、质量材质，作为设计指导，帮助设计师提供一些设计方案和指引。
（图片源自网络，如侵删）
以上是情绪版的一个实操流程方法，情绪版能帮助我们了解各种颜色或者色相的气质和情感属性，指导我们在设计中更准确的运用颜色，让我们的设计做到有理有据。也能有效的避免客户去质疑你设计准确性和专业度，提高设计的话语权。
下面以马卡龙色举例，在我们基于关键词找到参考图片后如何更快速的去提取颜色。
为了精准的提取颜色，把图片拖入ps里打开执行 滤镜-像素化-马赛克（马赛克值调整到最大）
基于转换后的颜色进行颜色提取，得到最终的主色的效果。上图中的颜色虽然多，但搭配起来却非常的舒服，不管提取几种颜色搭配，都不会显得花。
颜色千变万化，我们学色彩的目的不是为了展示色彩，而是表达色彩背后的含义。不同的颜色代表了不同的意义，而这需要在实践中不断的积累。
推荐一个色彩神器 Picular
Picular 是帮助使用者找色彩，不同于其他的配色工具，只要在 Picular 输入任何名词动词或想得到的词，它就会显示出一堆相关色彩。
网站链接：https://picular.co/
搜索结果非常干脆，直接给你一堆颜色色块，每个色块左下角是色号。色块右下角的小图标，将鼠标移动上去会显示该颜色是从哪张图片取色，虽然有模糊效果，但 Picular 告诉使用者确实是从搜索关键字去找出图片，总体Picular 是非常有趣的色彩搜索工具，大家可以有时间去试试。
大屏中的颜色
背景色
可视化设计中大屏设备普遍用深色作为背景色，以减少屏幕拖尾，观众在视觉上也不会觉得刺眼。另外深色背景更能聚焦视觉，利用色调与明度的变化，能够保证可视化图表的清晰辨识度，便于突出内容，最后也方便做出一些流光、粒子等酷炫的效果。
主色
可视化大屏是以数据展示为主，是将复杂的数据通过数据图表等设计的处理方法让数据更加的直观。所以在选择主色的时候就会把科技 数据 作为关键词，通过情绪版得出来的结果也是以蓝色为主，同样蓝色也可以在明度、饱和度等方面做区分。这里可以结合公司品牌色（品牌色是体现产品特性和传播理念最直观的视觉元素之一）和产品背景 调性等方面去做考虑颜色的运用配比。
图表颜色
图表的配色一般避免使用过多的颜色虽然不同颜色可以让用户轻松区分数据类别，但图表中用色过多，却会给用户造成困扰，不利于用户理解数据。原则上同一图表最多使用 7 种颜色。若需使用更多颜色，建议考虑其他图表形式或分组展示。
另外要保持颜色一致性，如果你的整份文件里包含很多图表，那么在不同的图表中，同一个类目最好用同一种颜色。
同样的数据，映射规则尽量保持为一种。例如当使用柱形的高度来映射数据时，如果想要通过颜色去区分，那么图表颜色就会有点多，会增加用户的认知负担，页面也会显得花、乱。
具体图表的使用思路可以参照下面这个图，这里就不一一展开讲了。
文字颜色
文字的配色方面因为是深色背景所以浅色文字更显得突出，通常在浅色背景下的深灰、中灰、浅灰三种文字颜色的层级关系到了大屏上正好相反 浅灰代表层级比较重要的，中灰次之， 深灰最弱。文字配色中应注意的点不建议文字用纯白可以稍微带一点颜色倾向（深色背景下纯白色文字会显得比较生硬，不建议使用）。
总结
以上讲了可视化大屏中颜色的一些运用方法和需要注意的点，其实配色的方法有很多，关键就是在于自己的一个吸收与运用的过程，首先你要学会一些配色的方法，知道什么样的色彩搭配可以很好的营造跟表达什么样的情绪，这里可以根据自己想要做的风格去找一些优秀的色彩搭配，分析他们色彩搭配的比例，然后合理的运营到自己的设计之中。欢迎大家沟通交流。
喜欢文章的朋友，感谢点赞支持 ❤️❤️❤️
