明确配色目标

1. 色彩规律≠配色规律
我们都学习过非常多的色彩知识，也看过很多的配色书籍或文章。然而当我们尝试在设计中运用这些理论时，就会发现：配色的理论往往在实际运用中并不好使，使用后的效果也不是特别明显。为什么会出现这种现象呢？

配色是否就是色彩某种的规律？当我们学习并掌握这种规律以后，就能掌控雷电，呼风唤雨，成为配色大魔王了呢？

答案并非如此。

配色并非单独存在，而是依附于不同的设计载体中。不同的设计载体，所要达到的目标不一样，就决定了配色理论也会存在差别。

我们会发现，虽然有很多书本、文章都在写配色的理论，每个人讲的配色理论有很多相同的地方，但是最核心的理论往往都不是相同的。

因为大家讲的相同部分，大多都是色彩的理论部分，这部分仅仅只是色彩本身的规律；而大家所讲的不同部分，则通常是作者在自己所在领域总结的一套配色规律。

因此，并非每一篇文章的配色理论都适合你，这也是当你学习并使用配色理论后，效果依然不好的原因了。

因此在学习配色时，仅仅学习配色理论是不够的。首先要思考配色的使用场景，以及整个设计所要达到的目标，然后再学习相应领域的配色知识，才能让配色理论发挥最大的作用。


2. 不同的行业，不同的配色目标

虽然设计是相通的，但是在不同的设计领域进行配色时，依然会存在巨大的区别。

比如广告设计的配色理论，放在室内设计上，往往是行不通的。因为广告设计的目标在于传递信息，需要吸引你，而室内设计的目标则是要营造舒适理想的生活氛围。同样的道理，推广设计的配色理论，往往在界面设计时也是行不通的。

不同行业间设计目标的差异，决定了配色目标和理论的差异。


3. 明确配色目标

对于大部分互联网行业的视觉设计师来说，平时的工作内容大体会分为产品界面设计和网站设计两个大的方向。很多设计师需要同时负责这两块内容，于是就可能会出现将同一个配色理论用在不同地方的情况，导致一些配色问题的出现。比如：推广设计的配色太素，无法吸引用户的注意；而产品页面的配色又过于杂乱刺眼，影响用户阅读和操作体验等。

所以，配色的第一步，首先要明确配色目标。


产品界面设计的配色目标：
信息传递：产品的首要目的是传递用户所需要的信息，这就需要界面有清晰的层级关系，明确、舒适的阅读体验。
引导操作：清晰合理的操作引导，让用户能够准确地根据引导进行下一步操作。
品牌价值：很多同学会忽略这一点，导致产品的界面与品牌关联性差，整体界面没有品牌感。

推广设计的配色目标：
吸引流量：强有力的吸引力，快速抓住眼球，留下深刻印象。
营造氛围：需要营造氛围，让用户通过氛围快速理解和融入到推广内容中，加深印象。
快速传递：在短时间内快速传递信息。这就需要设计时信息表达明确，使内容能够精准快速地传递给用户。

我们将这两种配色目标做一下关键词提炼，产品界面设计的配色关键词：清晰、舒适、引导、品牌感。而推广设计的配色关键词为：吸引力、氛围、快速传递。

我们可以将这些关键词作为衡量目标，以此来寻找正确的配色方向，或者用于检验设计作品的配色问题。

所以当我们接到项目需求后，可以先与需求方一同确定好设计的目标，以此来确定正确的配色方向，提升配色与设计方向的准确性。而这样做的另一个好处是，我们可以在项目之初就与需求方之间取得沟通和信任，达成共识，为后续沟通打好基础。

确定主色，精简层级
当我们确定好配色的目标以后，如何开始配色工作呢？通常情况下，我们首先来确定整个设计的主色，然后再开始进行后续的设计。


1. 主色与副色的定义

什么是主色和副色？

主色是整个色调的核心颜色，通常也是相对占比最多的颜色，它决定了整体的风格和基调。而副色则是画面中占比相对较少的颜色，它通常起到辅助主色、丰富画面的作用。

假如把一个画面看成一部电影，那么主色就是整个电影的主角，而副色则是除了主角以外的其他配角。


2. 确定主色，精简色彩层级

一部好的电影，通常情况下需要有一个明确的主角，它主导了整个电影的走向，对于设计作品来说，也是相同的道理。所以在配色过程中，首要的任务是确定配色的主色，并在整个作品中明确它的地位，让它来主导整个画面。

在产品界面的设计中，主色是传达品牌感的重要元素。明确的主色能够让整个界面产生强烈的品牌感。反之，整体的配色会显的十分混乱，影响品牌感的传达。


3. 精简色彩层级的意义

色彩层级越精简，就越容易达到整体色彩平衡，从而提升设计的整体品质感。当我们去看很多大厂的页面设计时，可以感受到很多的相同点：整体而强烈的品牌感，简约而高级的配色，丰富细腻的细节等。

用户在阅读页面时，配色是我们大脑最先接收到的画面信息。所以精简配色对于产品界面的设计来说至关重要。以品牌色为主色，精简色彩层级，可以让整个页面富有品牌感。


4. 品牌升级时的色彩简化趋势

在品牌Logo 的升级中，简化色彩层级同样是一个大的趋势。简化层级，可以让品牌更加简约和高级，提升品牌的品质感和包容性，使品牌拥有更大延展性和更多的可能性。

选择正确的色系
明确配色目标，确定主色以及色彩层级后，如何进行下一步的配色？

这时候我们可以根据不同的配色目标来选择合适的色系，丰富整个画面的配色。需要注意的是，在丰富配色的同时，仍然要严格控制色彩层级，以保证整体色彩层级的精简。


1. 巧用同色系，统一不单调

同色系是指在色环上相距不超过45°的两种颜色，我们可以选择主色的同色系范围内的颜色来丰富整体配色。那么如何选择同色系的颜色呢？

首先在色环中确定颜色的位置，通过色环两边45°延展出我们所需要的同色系。


2. 不同场景的对比色用法

对比色是指在色环上相距120°~180°之间的两种颜色（180°时则互为互补色）。处于对比色关系的两种颜色，通常色相差异较大，能够相互产生强烈的对比效果，我们可以利用这种原理来增强画面的吸引力。


推广活动页面中的对比色应用

在推广页面的设计中，通常需要用营造强烈的视觉冲击，以达到快速吸引用户并传递信息的目标。这就需要大面积的对比色，来达到强烈的对比效果。而在较大面积使用对比色时，整体色彩的主次和整体平衡至关重要。

可以看到，整个页面主要由橙色和深蓝紫色两个主要对比色构成。大面积的对比色产生了强烈的视觉冲击，让整个页面充满了吸引力。整个画面用最强烈的对比色重点突出了两个主要的人物角色，从而吸引用户注意并进行阅读，最终将用户引导至购买入口。至此，整个页面的任务也算是完成了。

在推广页面中，我们需要注意的是，重点信息并非只能是文字内容，也可以是最吸引用户的画面核心元素。


3. 尝试更多的创新配色
除了掌握以上的几种基本色系的配色方法外，大家可以在此基础上尝试更多的配色风格。比如在同色系、对比色系的基础上，有目的地加入色彩元素丰富色调，在保持整体色彩层级的同时，加入更丰富的变化，从而达到配色目标。

提升品质感
我们按照之前的方法，正确的确定了配色的目标，选择了合适的配色方向，并逐步完成了整体的设计排版。很多同学到这一步之后，就觉得作品已经完成，便停止不继续深入了，而这也是初级设计师经常容易出现的问题。这个时候的作品，从整体上看并没有太多问题。但是当用户被页面吸引，开始仔细欣赏作品时，往往会发现作品没什么看点。

出现这种问题的原因，就是作品缺乏足够的细节和品质，导致作品不够耐看。就像一本书有着精美的封面，但是打开以后却平淡无奇，最终对整本书都非常失望。

想要让作品更优秀，除了基本的版式和配色之外，往往还需要更深入地去雕刻作品，让作品带有一种更高级的「气质」，而这种「气质」就是我们所说的品质感。


1. 什么是品质感？

品质感对于设计作品来说，是一个综合性的评价。我们可以将这个词分为「品」和「质」，「品」代表物体本身的品相和细节，而「质」则代表质感。

2. 获得品质感的关键要素

渐变只是获得品质感的关键因素之一，苹果官网将渐变这种原理加入到页面和元素中，配合精美的产品图片，让页面保持了非常高的品质感。


总结
看完前面的内容，大家会发现，其实配色并没有想象中那么复杂。

只要掌握正确的配色策略，并逐渐适应这种方法，就可以应付各种不同的设计类型。最后，我们将前面讲的配色法则做一个简要的总结：明确目标 – 确定主色 – 精简层级 – 选择色系丰富配色 – 提升品质感。