• 内页banner
  • ui1
  • 内页3
技术专栏您当前所在位置: 首页 > 技术专栏

色彩就是这么简单粗暴

更新时间:2017-06-27 11:42:19点击次数:169次字号:T|T

1.先把学术问题丢掉

我不会跟你们讲什么是RGB,什么是CMYK等等色彩是怎么来的,什么是色相饱和度、亮度,学术理论问题留给专家,我们需要粗暴的色彩搭配方法。


学UI设计,选丰泽教育


2.只需要理解一种颜色模式HSB的“H”模式

为什么选用这个模式?很简单,因为HSB模式包含个颜色的色相、饱和度跟明度,我们可以按照我们的需求,快速调整颜色饱和度、色相明度来实时的控制我们想要的颜色。



3.颜色的选择区域

一般的颜色,我会选择如图中区域的范围。但是我这里说到一般还有比较特殊的颜色,比如柠檬黄、绿色、荧光蓝。这几种奇葩的颜色要注意,图为这几种颜色比较亮,选择该区域往往会比较扎眼。



一般情况下,这几种颜色会很少出现在我们的界面中,因为显示屏的亮度即使调到最低它也非常的亮,再加上那么扎眼的颜色会导致眼睛很不舒服,面对这几种颜色我建议一是荧光蓝往蓝色走,柠檬黄往暖黄色走,绿色降明度。二是:等一下再讲。



4.多种颜色搭配

很多时候我们用的颜色不止一个,那就说下多个颜色的搭配方法。多个颜色运用在一起的时候,最重要的是把控好颜色的统一性、和谐性。怎么才能让颜色统一呢?最简单的方法就是,我们先锁定他们共同的地方颜色。能有共同的地方就是它们的明度与饱和度。所以我们可以锁定个颜色的明度与饱和度之后,改变色相,这样选取出来的颜色就不会有比较大的突兀。所以就说明,为什么我们要用HSB这个模式了。当然,上面的那几个奇葩颜色转檬黄、黄光蓝、绿色还是要注意的。(慎用慎用慎用)。



所以如果我们在个页面上有多种颜色的情况下不用着急每个颜色都去调它的色值,我们可吼先确定个颜色色相、饱和度与亮度,然后复制多组出来,直接改变每个的色相就行了。这样我们选出来的颜色就会比较和谐,统一。



另外一种情况,我们还要注意背景色,一般情况下,多色搭配不会再用颜色作为背景,一般只会选用白色或者深灰色,但是白色跟深灰色背景下颜色的选择也会不一样,白色背景较亮,所以我们选用颜色的情况下,都会添加自色把饱和度降低,这样在自色的背景下颜色看起来就不舍太扎眼。



但是,在深灰色的背景下,我们会把颜色的饱和度提高,可以在深灰色的背景下比较显眼。所以刚才说第二种方法就是可以把背景色换成深灰色,这样饱和度高的颜色也不会很突兀。学UI设计,选丰泽教育