作为一个刚入行的新人,你是否会常常被以下问题所困扰呢?
我参照了模板,为什么最终效果很别扭。
为什么我的页面总是很花哨?
客户:产品不突出,标题不醒目。
领导:色彩单调,不够活泼
因为元素间的色相,明度,饱和度,调和不合理所致。
下面是我对色彩的一些看法,让高手见笑了。
一、色彩原理
色相
色相即毎种色彩的相貌、名称,如红、桔红、翠绿、湖蓝,群青等。色相是区分色彩的主要依据,是色彩的最大特征
明度
明度即色彩的明暗差别,也即深浅差别。色彩的明度差别包括两个方面:一是旨某一色相的深浅变化,如粉红、大红、深红,都是红,但一种比一种深。二是指不同色相间存在的明度差别,如六标准色中黄最浅,紫最深,橙和绿、红和蓝处于相近的明度之间。
纯度
纯度即各色彩中包含的单种标准色成分的多少。纯的色色感强,即色度强,所以纯度亦是色彩感觉强弱的标志。不同色相所能达到的纯度是不同的,其中红色纯度最高,绿色纯度相对低些,其余色相居中,同时明度也不相同
色相对比的类型
两种以上色彩组合后,由于色相差别而形成的色彩对比效果称为色相对比。
色彩对比强弱程度取决于色相之间在色相环上的距离(角度),距离(角度)越小对比越弱,反之则对比越强。
二、是什么在影响我们的视觉?
明度对比推移效果
色相对比推移效果
饱和度对比推移效果
清晰度对比推移效果
结论:人眼容易区别:明暗对比强,色相反差大,饱和度高,细节丰富的图片。
三、看同行中的高手是如何设计的?
通过上面几组作品我们发现它们的设计都有一些共性。
共性:
①产品:色相对比强烈明暗反差大②标题:色相对比较弱或无明暗反差大③内容:明暗反差较强无色相区别
四、寻找色彩的过程
我要的是什么颜色
当自己不清楚想要什么感受的色彩时,找找能承载你情感寄托的媒介物吧!
照片,圄片,服装,任何可能的东西,只要能表达出你想要的感受的,都是模仿的对象
他们代替你说出了你想要的感觉,通过对这些媒介物的分析和提取,能找到响应的色彩
用什么颜色来搭配
同色相对比
一种色相的不同明度或不同纯度变化的对比,俗称同类色组合。如蓝与浅蓝(蓝 白)色对比,绿与粉绿(绿 白)与墨绿(绿 黑)色等对比。对比效果统一、文静、雅致、含蘼、稳重,但也易产生单调、呆板的弊病
相近色相对比
色相环上相邻的二至三色对比,色相距离大约30度左右,为弱对比类型。如红橙与橙与黄橙色对比等。效果感觉柔和、和谐、雅致、文静,但也感觉单调、模糊、乏味、无力,必须调节明度差来加强效果。
类似色相对比
色相对比距离约60度左右,为较弱对比类型,如红与黄橙色对比等。效果较丰富、活泼,但又不失统一、雅致、和谐的感觉
中度色相对比
色相对比距离约90度左右,为中对比类型,如黄与绿色对比等,效果明快、活泼、饱满、使人兴奋,感觉有兴趣,对比既有相当力度,但又不失调和之感
对比色相对比
色相对比距离约120度左右,为强对比类型,如黄绿与红紫色对比等。效果强烈、醒目、有力、活泼、丰富,但也不易统一而感杂乱、刺激、造成视觉疲劳。一般需要采用多种调和手段来改善对比效果。
颜色有了如何搭配
例:一个活动页面中通常由以下元素组成(五角星代表重要性)
对第1重要的:用强烈色相对比(互补色或对比色) 强烈明暗的对比
对第2重要的:用稍弱的色相对比(相近色) 强烈明暗对比
对第3重要的:可以只用明暗对比且无色相差异的颜色。
依次类推,大家自己去理解哈~
我的配色口诀:近实远虚
最早接触这个词,是在高中接受专业培训时,色彩老师每天唠叨的一个词
老师:“同学暗部太亮”
后面景物要简化,勾勒一个大概的轮廓就可以了~
眼睛要深
网页设计和绘画一样,它也必须遵守近实远虚的原则(走梵高路线的同学请绕行),近处的渔船艳丽的人物就是你的产品,后面灰蒙蒙的山水就是你的网页背景
我是小勇,为回馈粉丝的支持,特赠送一套PS抠图视频教程
点赞 评论本文后私信我领取教程
,