配色做出来显得脏、显得乱,其实不是一回事,成因不同,改法也不一样。混在一起治,两边都改不好。

乱,多数是颜色的数量失控。画面里同时立着四五个互不相干的色相,每个都在喊,眼睛找不到落点,看久了就觉得吵。脏,通常是明度没拉开。色相并不多,但几个颜色的深浅太接近,边缘糊在一起;还有一种脏是拿高饱和的颜色去叠灰、去调透明度,颜色本身被搅浑了。

这两种里,第二种更麻烦,因为它容易被误判成”审美问题”。经手的稿子里,发闷的那些,问题大多出在几个颜色的明暗几乎一样——色相其实挑得没毛病,但眼睛分不出前后主次,看过去就是一团。麻烦的是改的人往往先去换颜色,越换越乱,动的一直不是真正出问题的那一项。

先把主色的数量压下来

一套配色能立住,靠的往往不是颜色挑得多妙,而是数量足够少。

比较稳的结构是:一个主色,一个辅助色,剩下的全交给中性色。主色占面积最大的那一块,辅助色负责做区分和点缀,中性色——黑、白、灰,加上低饱和的米、驼、藏青这一类——承载信息和呼吸的空间。三个色相基本够用,第四第五个色相如果讲不出职责,一般可以直接删。

判断一个颜色该不该留,就问它一句:它在这个画面里负责区分什么?答不上来,那多半只是”觉得好看”加上去的,拿掉之后画面立刻就清爽。这个标准比背配色理论好用,因为它逼着人给出理由,而不是凭感觉拉扯。

这里有个反过来的经验:越是觉得画面”不够丰富”的时候,越要先数一数色相。我见过不少方案,丰富度不够的原因不是颜色太少,是层级没做出来——同一个色相只用一个明度,整块平平地铺过去,当然单薄。往这个色相上再拉两个明度出来,比加一个新色相管用得多。

明度差比色相重要得多

挑色的时候人习惯先看色相,红配绿、蓝配黄,在色相环上找关系。但决定画面清不清楚的,其实是明度。

有一个随时能用的动作:把方案转成灰度看一遍。如果转灰之后几个主要色块变成一片差不多的灰,说明明度没拉开——彩色状态下看着还行,一缩小、一放到手机上、一进印刷,立刻糊成一块。这个动作花不了十秒,能拦下相当一部分”脏”。

色相反而可以很接近。同一个色相从深到浅拉开三四个层次,画面既有整体感又有层级,比多塞两个色相有效。很多看起来挺高级的单色系设计,拆开看就是同一支颜色在不同明度上的分布,没有第二种色相参与。

具体拉开多少算够?没有绝对数值,但有个可操作的判断:把画面缩到原尺寸的三成左右,如果主要色块之间的边界还认得出来,明度差就基本够用;如果缩完只剩一团影子,就得回去调。

中性色要舍得占面积

新手的通病是舍不得用中性色,觉得空、觉得不够丰富,于是往里加颜色。实际上中性色是配色的地基,它承担了大部分信息承载和留白的功能,彩色才有地方跳出来。

常见的分配是让中性色占到整体面积的一半以上,主色三成上下,辅助色保留一到两成。辅助色那部分越少,出场的时候越有力量。反过来,如果主色和辅助色面积五五开,两个颜色互相抵消,谁也不突出。

同一份面积预算,怎么分配比选什么颜色更能决定结果。这也是为什么同一套色卡,有人用出来干净,有人用出来土——差异常常不在色卡,在谁占了多少面积。

品牌色不好用的时候怎么办

实际项目里更常遇到的情况是:品牌色早就定死了,而且那个颜色本身不太好用——很高饱和的正红、偏荧光的蓝、或者明度卡在中间不上不下的绿。

这种情况不必改色相,改明度和饱和度。保留色相不变,往深里压一档做背景,往浅里提一档做底纹,主色还是那支红,画面里就有层次了。品牌规范一般只规定色值,不会规定只能用这一个色值,同色相的深浅变化通常在允许范围内。拿不准的时候把方案给品牌方看一眼,比整版做完再返工省事。

如果品牌色确实必须在画面里大面积出现,还有一个办法是把它压到背景层,让中性色去做信息层。颜色还在,分量还在,但不跟文字抢注意力。

屏幕和印刷是两套东西

屏幕上看着正好的颜色,印出来常常发暗发闷,这是色域差异决定的,不是文件做错了。屏幕走 RGB,印刷走 CMYK,一些高饱和的蓝、绿、紫在 CMYK 里根本调不出来,只能靠近似值。

做印刷品的时候,配色阶段就要把这一点考虑进去:尽量避开 CMYK 里做不出来的颜色,重要的颜色在正式开印前打一张样。纯屏幕使用的物料不受这个限制,可以放开一些。同一套配色要用在两种介质上,中间就需要一次转换判断,这一步省不得。

几个反复出现的错误

多色的平均分配,是最常见的一个。几个颜色在画面里面积差不多,谁也不让谁,结果是没有重点。改法是明确一个主角,其余退成配角。

纯黑纯灰用得太死,是第二个。纯黑在屏幕上很硬,大面积铺开会显得板;纯灰容易显得脏。把黑往暖里偏一点、灰往蓝里偏一点,画面会透气很多。

还有一个是渐变用得太随意。渐变本身没问题,但两端颜色如果明度接近、色相又不一样,过渡带就会发浑。要用渐变,就让它在同一个色相的明度轴上走,或者两端都落在低饱和区。

最后一个是给每个元素都加上自己的一套颜色。图标一个色、标题一个色、按钮一个色、边框又一个色,看着热闹,实际是把画面拆成了好几块互不相干的东西。颜色要跟着层级走,同一层级的元素用同一套颜色,画面才有秩序。

一套可以固定下来的检查顺序

配色做完,不用凭感觉反复看,按顺序走一遍就行。

  1. 数色相:画面里有几个互不相干的色相,超过三个的话,逐个问它负责区分什么。
  2. 转灰度:主要色块之间的明度还分得开吗,分不开就调明度,不是调色相。
  3. 看面积:中性色有没有占到一半以上,主色是不是明显压过辅助色。
  4. 缩小看:缩到实际使用尺寸,重点还在不在,边界还认不认得出。
  5. 分介质:这份文件最终是上屏还是印刷,CMYK 里能不能还原。

这五步不需要什么审美天赋,是纯粹的逻辑检查。真正拉开差距的地方也在这里——配色做得稳的人,未必是眼睛更毒,多半是每次都比别人多走了这几步。