[网页界面设计]-之配色(原创技巧)

UI / UI设计教程 /      

uimaker
UI设计师 / 江苏 南京

来源:未知   作者:ui制造者

关键词

 前言

其实标题最开始取的是:商业设计之配色,但仔细一想,我也就对网页界面设计和平面设计稍有了解,取偌大一个标题必然会BUG百出!写这篇东西不是想讨论RGB与CMYK色彩模式之间的关系,也不是具体配色案例讲解。本文旨在改变一些人对配色方面的成见,以及提出一些配色方面个人思路。

 

配色能力可以提高吗?

要谈如何提高配色能力,我们还真得反问下一下,配色能力真的可以通过后天努力来提高吗?

有这么个现象,就是逛论坛时,大家伙经常看到这样的评论,诸如:"色感蛮好的"、"色彩感觉抓的很到位"、"用色很有感觉"等等,就色彩本身而言,我觉得这类评论在说这么俩事儿:其一是说,客观存在的色彩是人们的主观感受,也就有了频出的"感觉"、"色感"等字眼;另外一点就是说作者的配色能力确实不错。从惯用评论语当中,我们依稀可以解读出大家对配色的看法,仿佛配色能力很依赖作者的个人感觉、天赋云云。自己跟不少网友也有聊过配色,其结果也不断印证着配色能力是很依赖感觉、天赋。不难看出,"色感天赋论"、"色感宿命论"早已深入人心。

或许正是有了"色感天赋论"、"色感宿命论"这样的观念,才使得不少"色感"不好的朋友感到失落的同时,也为他们的不作努力以及努力未果提供了堂而皇之的说辞!当然,我们也必须承认色彩是很主观性、很感性的东西,因为色彩所带给我们的心理感受,与我们的国度、文化程度、地域、人生经历、心境、社会角色、等因素有着密不可分的关系,但这是在色彩作为自然界客观存在之事物层面来讲。当色彩在技能层面来讲,并非那么感性,那么依赖个人天赋,相反,理性分析才是我们需要去做的。我觉得之所以有那么多人愿意相信配色很主观、很依赖感觉,无非因为是色彩本身所具有的主观性。其实配色并不玄乎,玄乎的是看配色(设计)的人!也就是我上一篇提到的一个观点:你的设计最终还得回到人的因素上来。至于人是否可以被"研究",非此文的重点!

这里我更想做的一件事就是:改变一些朋友对配色能力(色感)固有的看法,推翻"色感天赋论"、"色感宿命论"。因为这类观点是很可怕的,它直接否定了配色能力的可塑性!相当于在跟现目前色彩感觉不好的朋友说:还是省省吧,努力下去也就那样!!!我知,要改变你们看法,我还真不能直接说:大伙信我吧,配色能力不是天生的,坚持多看多做练习,我们照样可以做的很棒的!类似的教导已经听得够多了,但实际情况呢?对于配色能力迟迟未能提高朋友来说,这不过是名不符实的安慰罢了!SO,足够多的废话在这里是必须的!

OKAY,在否定"色感天赋论"、"色感宿命论"之前,我们也得承认一个事实,那就是"色感宿命论"用在人的"硬件"层面不无道理,众所周知,色弱、色盲患者只是很小一部分,用此来否定色感的可塑性,无异于说大部分人对色彩感知都存在着问题。另外就是,配色就真的如此依赖感觉、天赋吗?其实之前我也或多或少的相信配色能力跟个人天赋有很大关系。但现在细想之,谓配色很依赖感觉、天赋这个说法,我觉得比说大部分人"硬件"有问题更荒唐,更不靠谱!!!为什么对吧?好,请大家先暂时放下你手头的工作,咱们从原点出发,去站酷(zcool.com.cn)、联盟(68design.net)的论坛翻翻老帖,关注那一批设计水平(特别是配色)变化比较大的朋友,把他们近期作品与早期作品对比一下,结果便不证自明!可以试想,如果配色真的"很感觉"、"很天赋",那他们配色方面一开始就应该很有天赋才对吧(也甭拿时代审美性说事,即便是20世纪的作品,当下看NB的多着去了)?但事实并非如此!通过对比,我们便明晰可见,这批人配色能力确实提高了,更有"色彩感觉"了。仅这种变化便足矣证明"色感"是可塑的,因为这绝非个别现象。说到这儿,大伙儿又要犯疑问了,那为什么直到现在,我的配色水平仍旧如此鸟样?这就问到点子上了,同时也是上文争论的意义之所在!

好的,既然说配色能力可以提升,但为何很多人努力了,配色能力仍旧没能提高?此囧况吧,引用孙中山先生的一句话,足矣道尽天机!此乃:"先知先觉,后知后觉,不知不觉"!

所谓"先知先觉,后知后觉,不知不觉",其意想必不用我多做解释。就配色能力而言,先知先觉者,有吗?有,少矣!而所谓后知后觉者,也就是上文中配色能力有很大提升的那一拨,这种后觉(成长)是以后知(学习)为先觉条件的,而且后知之方式可能不尽相同。部分朋友可能是因为大量设计实践,其过程中,反复调色反复思考,自然而然的掌握了许多配色方面的技巧;部分朋友则可能是通过看大量优秀设计作品,通过仔细观察、分析人家的配色,探出了诸多配色方面的端倪;部分朋友亦或许是两者的综合,"白天吃白片,不感冒,晚上吃黑片,不瞌睡,双管齐下咯"!说了先知先觉者和后知后觉者,最后就是不知不觉者。我了解,说你们是不知不觉多少有些冤枉,或许用"后知不觉者"会贴切几多。我也多少有了解到,很多做设计的朋友,其实闲时也都会有意识的去看很多设计方面的东西,但凡轮到自己做设计,又开始晕菜了。为什么?因为他们脑子不够灵光、眼光不够敏锐?不,绝对不是!与后知后觉者比较,他们只不过是忽略了某些要点,或者说没找到适合自己的学习、分析方法,仅此而已!

要道清楚种种有效的学习方法,个人认为国内设计水平跨度较大的那拨人,最后发言权。这样讲或许有朋友会诟我,"FK你不想混饭吃了,Y的不想干这行了吧......"冷静,冷静!我们不妨站行业的角度思考一番,情况或许并非所想的那样糟糕。杨华哥前不久在联盟发的一篇文章给了我几多启发,另外"蛋糕理论"啥的大家也都明白。感觉我们这个行业想要良性循环,真别指望谁谁谁了,每一份子踏踏实实的努力提升自己才是王道,该来的迟早会来!

好的,咱说回配色!下面把大家经常遇到配色问题,以及自己的一些配色思路与技巧整理出来,希望对大家有能所帮助。

 

色彩的基本知识
色彩方面的基本知识以及名词术语我就不说了,不理解的朋友查阅下相关资料就OK!

 

色调
色调在商业设计中的重要性不言而喻。一个项目的设计开始之前,建议大家事先定好页面的色彩基调。多问问下自己,这个页面我是用冷色调子、暖色调子、蓝灰调子还是灰色调子更为贴切。我先说说自己定色调的思路,首先还是分析项目信息,即在充分了解客户(产品、服务、理念等)以及客户产品的终端消费人群的基础上,去确定适合色调。比如体育运动主题方面的项目,我会了解这个体育运动项目本身的信息,然后是了解终端浏览者的诸多因素,再者就是客户负责人对于配色的意见。通过综合分析,在几个因素中去找相似性,找平衡点。你的配色想要获得认同,首先你得搞清楚一点:是由哪些人来认同(或许是终端客户认同、或许是客户认同、或许是业内认同、亦或许是他们的综合)!接下来就是反思考哪种配色方案更适合产品的定位、适合产品终端客户以及客户的审美。具体比如说,一个服饰类设计项目,客户产品目标消费人群是30岁左右的白领女性,产品定位的关键词是成熟、典雅、内在气质,然后让你给出合适的网页界面配色方案,咋整?答案就是前面写的,你需要了解他们的产品风格,了解目标消费人群的审美倾向。我们之所以给不出合适的配色方案,是因为对某些因素了解不够透彻,考虑问题不够全面。所以会有人说,做好商业设计也需要丰厚的社会阅历,因为我们需要对不同人群有足够多的了解!OK,关于确定色调的思路就说这多,具体操作这里我就不啰嗦了。"授人以鱼不如授人以渔",有渔则何患无鱼!

 

色彩联想
色彩会让人产生联想,这个事实不用我说,我们可以大肆运用色彩的这一特性为我们的商业设计服务!
然而想要运用好色彩的这一特性,我们就得明白,同一种颜色对不同的人所产生的联想,在特定层面可能相同,也可能大相径庭。比如说同样是红色,从国度层面来讲,一个中国人看到红色很可能会联想到自己的祖国,但巴西人联想到自己国家的可能性很小;同样是红色,从审美层面来讲,有人认为红色很喜庆,很适合做周年庆典的主色调,有人却觉得红色做主色调太刺眼、太俗。不管咋地,我只想说我们必须正视这种差异性,学会分析导致这种差异的内因。

另外我们还得多运用形状、质感、肌理等与色彩相结合,这样可以让视觉化之后的信息更准确的被传递。亦比如说同样是乳白色,当我们将其形状塑造圆润水滴时,我们很容易联想到牛奶,但当我们将其形塑造成由单点喷射出的运动弧线时,鬼知道还会有谁觉得这是牛奶,当然,如果人家客户奶产品定位很Sexy,或许这样干又是对的。这也解释了为什么很多朋友刚接触设计时,热衷于把画面搞的很个性,将人家的乳白色牛奶搞成绿色、蓝色之流大有人在,其结果并非你颠覆了传统,而是传统颠覆了你!毕竟商业设计不是你自己觉得个性就OK,你还得斟酌我的设计能否被客户、终端消费者理解并认同!这点真的很重要,切记我们做的是商业设计,如果你对商业设计的概念还不够了解,请百度一下!

 

光源色、环境色、固有色
色彩的这三个概念对我们做处理好整体画面关系、物体与物体之间的关系尤为重要。玄的就不多说,就拿大家经常遇到的问题,怎么样让我们的素材更和谐的融入的画面,从而不让别人觉得我们的画面很奇怪。说怎么样才能之前,我先说一下很多人为什么没能?之所以大家觉得你素材处理的怪怪的,大概有几种可能性:透视有问题、大小比例有问题、常识性错误、色彩关系没处理到位等等。前面几点我们不说,这里只说色彩关系(光源色、环境色、固有色)层面的问题。还是举个例子比较容易说明问题,比如说要将一辆红色宾利跑车处理到一张为蓝天白云绿草地的图片上去,而且要让人觉得这车确实就停在绿色草地之上。很久很久以前,我们会把宾利直接扣出来,调整好车的大小,找几棵草放在种车旁边,直接扔在草地上...跟浮游生物似的,即便是走超现实路线,我们为什么不让这个跑车更有Magic Feeling,更有趣味一点呢!时光荏苒,我们也渐渐聪明了起来,慢慢的,跑车的投影出现在了草地上,后来,我们得知天之蓝、草之绿、车之红并非孤立存在于画面,学会去找它们之间的联系。我们知道了红跑车会影响绿草地,绿草地放过来也会影响红跑车,大面积的天蓝色同样会影响车跟草地。再后来,我们画面的色调也更加统一,虚实、前后关系也更加明确,蓝天的色彩变得更加丰富、更有层次感,鸟儿重返蓝天,草香飘荡在天地之间,草地上车辙历历在目,甚至看见了谁的微笑......OK,我说完了。至于光源色、环境色、固有色为何物?它们之间的关系,以及它们如何作用于物体?一个是要清楚它们的概念,另外就是要养成仔细观察事物的习惯。

 

色相、纯度、明度
待续!

 

色彩的对比(色相(补色、冷暖)、明度、纯度、面积)
待续!

 

调色心得
待续!

 

结语
我并不期望你们在读完本文后就可以豁然开朗,配色能力就能立马提升!我更希望大家明白这样一个事实:很多理所当然的事情,我们只知其然是不够得,还得知其所以然!虽未能"先知先觉",但"后知后觉"是迟早之事!!!

 

本文的几个生造词解释:
①色感天赋论:认为色彩感觉、配色能力是一种天赋,即便通过后天学习也不会又会提升;
②色感宿命论:认为色彩感觉、配色能力是生来注定的,即便通过后天学习也不会又会提升;
③色感:色彩感觉,即对色彩的感悟能力;

 

PS:后面有3个小点因为时间问题,没能写出来。见谅!
欢迎交流!

 

WOSER'.pu
2010.4.29

 

本文由 woser 原创,转载请保留此信息,多谢合作。

 收藏