色彩吸取的实用方法

设计 INFO院院长 18℃ 0评论
色彩吸取的实用方法 图1
色彩对于平面设计的重要性不言而喻,正确美观的配色是优秀设计作品中不可或缺的因素,也可以说在所有视觉领域里,色彩都是基础。但是很多新手设计师都有类似的困惑,就是即使学习了色彩理论,仍然不能很好的运用到工作当中。
在本期文章正式讲解之前,建议大家可以去我们的站酷主页观看之前几篇有关色彩的文章,其中一些已经讲述过的基础知识点,在此就不做重复。如果说成功的配色是一座高山,那么每一种配色方法都是一条通往山顶的路,只不过有的人适合走大道,有的人适合穿小路,有的人适合坐缆车,有的人适合攀岩等等,仅此而已。
色彩吸取的实用方法 图2
在学习配色之前首先要做好版式,因为只有在版式好的前提下,正确美观的配色才会起到加分的作用。相信很多设计师都有过类似的经历,就是在最开始接触设计的时候,都用过一种配色方法,就是从图片上吸取颜色,然后运用到设计当中,但是照搬图片中的颜色并不能保证做出好的设计。
那么本期文章主要讲解如何运用图片中的色彩来进行正确美观的色彩搭配,希望对新手设计师或对配色感到迷茫的设计师们有所帮助。
色彩吸取的实用方法主要分为三步:

第一步、提取颜色

很多武侠小说中都有对武学“终极奥义”的描述,那么设计的“终极奥义”就是审美和经验,同时它们也是提高配色能力的重要因素。提取色彩可以作为设计师日常的练习,通过多看多分析优秀摄影作品或设计作品中的配色,来提高自己的色彩敏感度。

第二步、分析颜色

并不是任何图片中的颜色都适合你所设计的作品,设计之前要对设计作品所要传达的内容进行仔细的思考和分析,然后观察图片中的色相、色调、明度、气质、氛围等等是否适合自己的设计,色彩可以传达非常细腻的情感,所以一定要加入主动性创作。

第三步、运用颜色

将提取的颜色进行分析重新整理之后就要运用了,运用颜色也并非想象的那么简单。首先要观察自己的设计作品当中可填充颜色部分的色彩承载量,以及是否有图片、图案、标识等有色因素;其次确定主色和副色以及是否需要加入调和色;最后综合考量以上因素运用颜色。
色彩吸取的实用方法 图3
色彩吸取的实用方法 图4
首先做好案例的版式,颜色用黑白灰来代替,也就是俗称的黑白稿。
第一步、色彩提取
色彩吸取的实用方法 图5
在软件中吸取颜色相信大家应该都会,就是用软件中的吸管工具在图片上点击。之所以选择这张图片来提取是因为它的色彩组合比较简单和明显,色彩大致被划分成四个区域。

第二步、分析颜色

色彩吸取的实用方法 图6
这是对参考图片基本颜色较为完整的提取,基础色相为红蓝黄。
色彩吸取的实用方法 图7
由于我们设计的版式并不复杂,并且人物图片的颜色主要是以白色和黄色为主,对整体的配色影响不大,因此当我们进一步分析这组色彩时,去掉了一些色相相近的颜色,只保留色彩倾向较明确的颜色。
色彩吸取的实用方法 图8
我们的案例风格比较偏向年轻时尚与潮流,而在软件中直接吸取图片的颜色结果往往比较灰,如果运用现在所提取的颜色,在色调上会略微沉闷,缺少了一些明快感与活力。所以我们需要让色相变得更有倾向性,所谓色彩倾向性其实很简单,就是说红色就让他看起来更像红色,黄色就让他看起来更像黄色。所以最终我们进行了综合的调整,让颜色更鲜明并且只保留三种颜色。

第三步、运用颜色

色彩吸取的实用方法 图9
首先分析一下我们案例中可填入色彩的元素,然后确定画面的主色,这里我们就顺势而为,按照原图中色彩的比重来搭配,将蓝色作为主色填充到画面背景层。
色彩吸取的实用方法 图10
接下来将副色红色填充到人物下方的色块中。
色彩吸取的实用方法 图11
然后再将黄色填入到主标题下方的色块中。
色彩吸取的实用方法 图12
虽然黑白灰都可以作为调和色,但这个案例中文字用黑色会让整个版面显得不够通透,所以最后我们将文字的黑色换成了白色,整个配色过程到此就完成了。
色彩吸取的实用方法 图13
同样是这个版式,我们换一张图片提取颜色试试。
色彩吸取的实用方法 图14
色彩吸取的实用方法 图15
这张图片的色彩组合也相对比较简单,色彩的层次也很清晰,只需要在亮部与暗部分别提取颜色即可。
色彩吸取的实用方法 图16
色彩吸取的实用方法 图17
这是对参考图片较为完整的颜色提取,整体偏向黄绿相邻两色的搭配。
色彩吸取的实用方法 图18
同样需要筛选色彩倾向性较明确的颜色,去掉相似的颜色,而这里我们保留了基调相近的淡色调。
色彩吸取的实用方法 图19
最后再对颜色进行细微的调整,让原本偏灰的色调再纯一些,灰色作为调和色可以忽略不计。
色彩吸取的实用方法 图20
色彩吸取的实用方法 图21
这组颜色的运用同样没有做重新组合,依然按照原图的色彩比例来确定主色和副色,首先将主色填充到画面背景层。
色彩吸取的实用方法 图22
其次将副色黄色填充到人物下方的色块中。
色彩吸取的实用方法 图23
再次将绿色填充到主标题下方的色块中。
色彩吸取的实用方法 图24
同样的原理,这个版面中的文字也不适合用黑色来调和,所以换成白色。在此需要强调一点就是配色也是反复调整的过程,并不是某个颜色只能用在某个地方,一切都是以最终呈现的视觉效果为准。
色彩吸取的实用方法 图25
色彩吸取的实用方法 图26
案例二几乎是纯文字的版式,开始也是先用黑白来代替。
色彩吸取的实用方法 图27
色彩吸取的实用方法 图28
这张图片中的色彩并不多,提取也是比较方便的。
色彩吸取的实用方法 图29
色彩吸取的实用方法 图30
这是对参考图片基本颜色较为完整的提取,整体的色调比较偏暗。
色彩吸取的实用方法 图31
然后进行分析和筛选,这里去掉了调和色黑色和色调较暗的蓝色。
色彩吸取的实用方法 图32
最后做综合调整,让整体的色调更亮更纯一些即可。
色彩吸取的实用方法 图33
色彩吸取的实用方法 图34
提取颜色的图片中色彩的比例分配对我们的应用参考意义不大,所以这里我们可以加入主动性创作,将蓝色作为主色填充到背景层当中。
色彩吸取的实用方法 图35
接下来要思考紫红色与青绿色的运用,针对这个设计而言,需要突出的是文字部分,而促销的英文线框作为底纹装饰性元素要弱于文字,而紫红色与背景层的蓝色对比更加强烈,因此用紫红色填充文字部分。
色彩吸取的实用方法 图36
最后将青绿色填充到底层文字线框中完成配色。
色彩吸取的实用方法 图37
同样这个版式我们换一张图片提取颜色来填充。
色彩吸取的实用方法 图38
色彩吸取的实用方法 图39
这张图片虽然看上去元素比较杂乱,其实颜色还是比较清晰的。
色彩吸取的实用方法 图40
色彩吸取的实用方法 图41
这是对参考图片基本颜色较为完整的提取,色彩比较丰富。
色彩吸取的实用方法 图42
接下来要做的是对颜色进行整理和筛选,这组颜色的近似色比较多,而根据案例的风格这里提取色调偏轻、色彩倾向较明确的颜色。
色彩吸取的实用方法 图43
最后进行细微的调整,使整体色调符合年轻时尚的气质。
色彩吸取的实用方法 图44
色彩吸取的实用方法 图45
同样先确定画面的主色和副色,这里我们参考原图后将青色作为画面主色填充到背景当中。
色彩吸取的实用方法 图46
其次就是黄色与绿色的运用,对于这个版面,如果文字部分用黄色的话,会造成文字的识别度不是很好,因此将绿作为文字填充色,而黄色可以作为点缀色填充文字线框。
色彩吸取的实用方法 图47
最后将黄色填充到底层文字线框中,配色结束。
色彩吸取的实用方法 图48
色彩吸取的实用方法 图49
案例三虽然几乎也是纯文字的版式,但是相对于之前的案例,这个案例中多了颜色重叠的部分。
色彩吸取的实用方法 图50
色彩吸取的实用方法 图51
这张图片的色彩组合也比较简单,基本就是红绿对比色的搭配。
色彩吸取的实用方法 图52
色彩吸取的实用方法 图53
这是对参考图片基本颜色较为完整的提取,分别在图片中的亮部和暗部进行提取。
色彩吸取的实用方法 图54
接下来要做的就是对颜色进行整理和筛选,这里同样去掉了相似颜色中的淡色调,只保留相对更具有倾向性的颜色。
色彩吸取的实用方法 图55
最后调整色彩纯度,让整体的色调更纯一些。
色彩吸取的实用方法 图56
色彩吸取的实用方法 图57
首先确定主色,这个案例是关于双十二促销的内容,如果想营造喜庆热闹的风格,那么红色作为主色再适合不过了。
色彩吸取的实用方法 图58
为了形成对比,接下来将副色绿色填充到数字中。
色彩吸取的实用方法 图59
由于红色和橙色是相邻色,既不会产生突兀的对比又能起到很好的点缀效果,因此将橙色填充到背景的雪花上。
色彩吸取的实用方法 图60
提取的有彩色已经全部用到了画面当中,但是很明显文字的调和色黑色在这个画面中同样不适合,会造成压抑的氛围,所以最终将文字填充为白色,整个配色过程完成。
色彩吸取的实用方法 图61
按照之前的方法,同样这个版式我们换一组颜色尝试。
色彩吸取的实用方法 图62
色彩吸取的实用方法 图63
这张图片的色彩也比较明确,方便提取。
色彩吸取的实用方法 图64
色彩吸取的实用方法 图65
这组颜色是对参考图片基本颜色较为完整的提取,整体色调偏暗。
色彩吸取的实用方法 图66
先对颜色进行整理和筛选,去掉了一些相似的颜色,只保留具有明显倾向性的颜色。
色彩吸取的实用方法 图67
由于原图中绿色的部分比较少,因此这里把青色与绿色做一个结合,然后调整整体的色调。
色彩吸取的实用方法 图68
色彩吸取的实用方法 图69
这个配色的方向也是按照原图中的色彩比例,首先将较纯的黄色作为主色填充到画面的背景当中。
色彩吸取的实用方法 图70
同样为了形成对比,接下来将副色青绿色填充到数字中。
色彩吸取的实用方法 图71
然后用深黄色填充背景层上的雪花。
色彩吸取的实用方法 图72
与上一组颜色的道理相同,虽然理论上文字使用黑色也是可以的,但是白色会让画面显得干净明快。配色一定要加入主动性的创作,这个主动性创作不但是指对提取出的色彩进行筛选调整,也可以指个人的喜好,当然前提是个人的喜好要建立在一定的审美和经验的基础上。
以上就是本期文章的全部内容,通过提取颜色——分析颜色——运用颜色三步走的方式来讲述如何运用图片中的色彩来进行配色,旨在将配色化繁为简,为自己所用。
当然这种配色方法和思路只是众多配色方法中的沧海一粟,如果想成为优秀的设计师还需要进一步深入的去学习色彩,虽然理论知识枯燥乏味,但是对设计师的内在提升是不可估量的。最后再次强调文章中的一个观点,就是分析和练习是非常重要的,多看优秀的配色提升审美才能提高配色能力,学无止境,希望本期文章能为大家带来一点点帮助。

转载请注明:INFO院 » 色彩吸取的实用方法

喜欢 (0)or分享 (0)
发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址