UI设计师3招提升色彩能力

admin 2018-05-16 阅读:117

前言

关于配色,其实有两个世界,也可以简称为两个阶段。只要我们承认色彩是我们认识外界的基础,那么我们就必定面临这两个世界。第一个世界是理性的世界,在这里色彩被分析、解构。白色光被三棱镜所分解成为不同的色光,每种色光对应着不同的波长。他们可以被波长所命名,站在科学实证分析的角度,我们可以有一种可以掌控甚至是管理好色彩的错觉。然而,在这个世界以外还有另一个世界,也就是感性的世界。

这也是我们重点要说的经验世界。在这个体验里,色彩是一种完全感性的体验性的认知。它能引发喜怒哀乐、甚至能产生流动的错觉,它和我们的情绪在一起,也和所有不确定性在一起。它有着深厚的物理学的理性基石,然而又和我们的情感关系最为密切。

色彩被看作是一种非常重要的视觉属性,我在平面设计领域这些年总结下来,无非也就是形与色的游戏而已。因此,配色成为一门课程,也有大量的可学习参考的配色书籍。无论如何,它的重要性不言而喻。它的神秘性却从未降低,光的本质的解释尽管显而易见,也丝毫没有折损这个视觉玩具所带来的乐趣。但是如何提升对于色彩的搭配能力,却是一直都在摸索中的课题。这是由于大家都感觉到,配色绝不是仅仅靠阅读配色相关的书籍,就能一招致胜,反而是在读太多关于理论的知识,有点茫然不知所措。应用时却无法使上力。

感官命名法——通过语言系统来深化对色彩的认识

如果要真正了解色彩,就需要一套非常完整的系统的训练方式。也许很多人包括我自己一开始都对这些方法不以为意,总认为十分简单,甚至觉得这就是小朋友的游戏。然而,我要说,其实我们每个人的色感基础正是儿童时期就形成的。而往往儿童时期由于认识更为纯粹,对于色彩的想象力受到的限制比成人少得多,因此能赋予色彩的深度和广度都比成年人要更为丰富。

这也是为什么当你看到小朋友们的画作,会由衷赞叹他们的“配色天赋”。

UILOOK-模板.jpg

UI设计

而除了要进一步斩除缠住我们想象的积习藤蔓,将自己暂时回归到某种“童年白日梦”状态,还需要在运用视觉的同时,再调用到我们的其他四种感官(听觉、嗅觉、味觉、触觉)。

这个方法是通过你的语言,也就是利用你对某一色彩的命名来扩大你对某一种色彩的感受和体验深度。设想一下,假如你看到一只苹果,也许你就只是看一眼然后狼吞虎咽地把它吃了,事后要你回忆你对“苹果”这个物体的印象,也许你能体会的并不深刻。如果你这一次改变条件,假设你从未见过苹果,这一次你不仅要吃掉苹果,还要给这个水果命名,根据它的外形、滋味等各种属性来对其进行认知。这时,你对苹果的体会将和前一次大大不同。

所以,这也就是我们要做这个色感训练所需要的事:打开你的颜料盒或者在你的绘图软件中,从你最喜欢的色彩开始一个一个进行重新整理和认识。这里所谓的命名可以天马行空的想象,对每一种色彩可以在名字以外再加上几个描述性的词汇。比如我在这里所做的。

UI设计师3招提升色彩能力

UI设计

我用了六个词来形容自己对这个颜色的感受。当然你也可以自由的描绘,不必限定在词语,也可以是一句话。在色感训练中,永远没有标准答案,只有真实的答案。只要你给出自己真实的感受,那么对于色感训练的目的就达到了。这意味着,你再也不用跟随外界对于色彩的定义去看待色彩,而是跟随自己的声音。这里我还用了几个意像去描述这个颜色带给我的联想。

建议你做完这个训练后,保存你的结果。也许等个一年半载,你对某些颜色的感受就会有所改变,通过对比,你会发现你对这些色彩的认识会变得越来越细腻。

这是一个需要经年累月的练习,但它却十分轻松愉快。每天就像一次娱乐游戏,而你的色感一定会随之提升。

色彩家族——透析色彩间关系的基础,任何色彩都不是独立存在

如果你认识了色环,对色彩有一定的了解,你一定不会否认:任何一种色彩都是由其他色彩所组成。我们认识一个色彩,绝对不只是针对这一个色彩,你还需要对它的邻近色、对比色、互补色都要有所了解,也就是说,与其说我们是在认识色彩,不如说我们是在认识色彩之间的关系。

既然色彩间的关系如此重要,我们看待色彩就应该再多增加一些角度。通过对一个色彩无限次分解,一点点摸索色彩间的关系。就像一个家族里,你继承了父母的某些特性,而你的父母又继承了上一代的某些特性……这样代代相传的关系在色彩中也能找到同样的模型。

具体的做法很简单,从你的颜料盒里或者打开绘图软件选取一个颜色。比如选取绿色,这时我们眼里出现的是绿色,这时你要将绿色分解成两个颜色,这两个颜色相混合刚好是你看到的绿色。从色环上看,这两个颜色也刚好就是这个绿色的邻近色。也许邻近的距离并不成为考虑的重心,做这个练习的过程是要了解色彩中的“成分”,看清它们之间的继承脉络。

下面这是我做的具有三代家族结构的色彩家族练习。其中位于三角虚线内的关系为分解的关系,而字母ABC,分别表示不同的层级。

UI设计师3招提升色彩能力

UI设计

你当然也可以继续分解下去,相信这将是非常有趣的探索过程。通过这一练习,也能在你的配色陷入僵局时,给你带来新的灵感。

过度色彩——从动态的角度去看待色彩间的变化过度关系

这几年,大家对渐变这种色彩表现形式一定不陌生,渐变配色的其中一种形式就是由一个色彩走向另一个色彩。在这个过程中,我们可以看到两个颜色间微妙的变化关系,它是一个动态的过程。

如果你能深入体察任意两个不同色彩之间的过度变化关系,如此看待色彩,就又拔高了一个维度,那么对于色感的体会也会抵达更深的层次。

从你的颜料盒或者直接用绘图软件里挑选两个不同的色彩,这两个色彩在色环上的距离远近可以不必限制。将这两个色彩看作置于并排一系列色彩的头尾两端,你要做的就是填充头尾两端的色彩中间的过度色彩。

如下图示中,我采用了粉色到黄色的过度。这里所过度的色彩不仅要在色相上进行改变,还需要在饱和度和明度上也相应进行变化。过度的色彩填充的数量为7个过度色彩,当然你也可以适当增减,这里的色彩数量多一些会在过度上变化得更为细腻,太少的数量当然不利于观察,而数量太多也不方便我们这里交流的直观。

UI设计师3招提升色彩能力

UI设计

对于色彩中色相过度变化的节奏控制,只要保持视觉上基本的均衡状态即可。无需从数值上严格限制。

还有另一种叫做组合三角的过度色彩练习方式,同样是采用过度的方式,只是这里在色彩的组合方式上并非仅仅是一个色彩到另一个色彩。过度色彩只有一个。这个练习的重点并非是体会两个色彩之间变化的过程,而是让大家将三个色彩的关系看得更清楚。

选择三个色彩置于三角形的三个角,让它们的外形也保持三角。第二步是在两个角之间的色彩之间设置它们的过度色,这个过渡色可以是位于这两个色彩之间距离的中点。也可以反过来说,这个色彩是由两个角上的色彩所混合而成。依据这个规则,剩下最后三个三角的色彩,也同样就是它左右的色彩的过度色。希望下面的图示能帮助你理解这个过程。

UI设计师3招提升色彩能力

UI设计

三个色彩可以稍微在色环上拉开距离,否则位于中间的色彩就会比较难以区分。

这两个过度的色彩练习都有帮助你更能从动态的角度把握色彩间的关系演变。

后记:

以上三个方法,绝对需要大量的持续的练习,才能达到效果。但是请大家不要把这一过程想象得非常艰难,也别脑补需要咬牙坚持这一的景象。毕竟对于色彩的喜爱,会让你带着乐趣越玩越精彩。色彩看似简单,实则有它自己的秘密,也许我们不需要知道什么,只需要多和它接触互动,就能慢慢了解一二。

这些方法是我在阅读了一系列色彩的书以后的总结和借鉴,也有热心的小伙伴们自愿参与一起亲验过的好方法。今后我们还会继续开发类似提高色感的方法,请你和我们一起玩下去~


发表评论:

二维码