色彩的世界多采多姿,不同的色彩計(jì)畫常常左右了產(chǎn)品最終給人的感覺(jué),而色彩并不會(huì)單獨(dú)存在,良好的色彩搭配常??梢宰屇愕纳视?jì)畫更加吸引人的目光。在《淺談色彩學(xué):對(duì)比色配色》中我們?cè)岬缴时壤峙涞脑瓌t,透過(guò)一些公式化的配色技巧讓大家在搭配色彩的時(shí)候有所依據(jù)而發(fā)展、不致于手足無(wú)措不知該從何開(kāi)始。
以70%底色、25%主色與5%強(qiáng)調(diào)色的配色原則為例,由于底色與主色都是屬于同一個(gè)色相的色彩(黃色系),因此以這個(gè)例子而言,其實(shí)是使用了兩個(gè)色彩的配色方案:
在一般情況下,一個(gè)版面中使用的色彩建議不要超過(guò)三個(gè)色彩。這邊所指的三種色彩通常是指「色相」上的不同。米黃色與銘黃色在人類的視覺(jué)感受上,都認(rèn)為是溫暖的黃色色調(diào),因此并不會(huì)主觀的認(rèn)為他們是不同的色彩,而是同一個(gè)色系的色彩集。而紫色就很明顯不屬于黃色色系的一份子,因此在這個(gè)配色方案中可以算是一個(gè)獨(dú)立的色彩
然而不管是兩個(gè)顏色還是三個(gè)顏色,很明顯都不夠用。
設(shè)計(jì)師在為版面制作細(xì)節(jié)的時(shí)候,常常會(huì)需要使用許多同色系的色彩,例如需要利用明暗變化來(lái)營(yíng)造元件立體感的時(shí)候:
抑或是同一個(gè)按鈕在不同的狀態(tài)下想利用透過(guò)些微的色彩變化來(lái)給予使用者回饋,例如這邊利用加亮以及加暗來(lái)模擬「發(fā)光」以及「凹陷」的效果,這時(shí)候都會(huì)需要更多同色系的色彩來(lái)輔助:
想要取得這些色彩有許多方式:
幾乎所有的繪圖軟體都提供了HSB 的選色工具,在大部分的情況下設(shè)計(jì)師可以輕易的使用HSB 快速取得各種同色系的色彩。HSB 使用三種數(shù)值來(lái)描述色彩:分別為色相(Hue)、飽和度(Saturation)以及明度,或稱亮度(Brightness):
在大部分的情況下,我們僅需調(diào)整明度的數(shù)值即可得到需要的色彩:
然而色彩有分高明度以及低明度的色彩,像是黃色就是高明度的色彩,因此色彩的明度數(shù)值就高達(dá)90%,當(dāng)我們需要比黃色還更亮的色彩時(shí)怎么辦呢?這時(shí)候可以去調(diào)整飽和度的數(shù)值,讓色彩往白色接近一些,以取得更高明度的色彩。當(dāng)然啦,在顯示螢?zāi)簧鲜遣淮嬖诒劝咨€要亮的色彩的。
關(guān)于HSB的更多細(xì)節(jié)可參考《淺談色彩學(xué):人性化的HSB色彩空間》一文
比起HSB,這個(gè)方法似乎又更科學(xué)化了一些,適合設(shè)計(jì)的一開(kāi)始就利用這個(gè)方法來(lái)定好一套色彩規(guī)范、方便后續(xù)作業(yè)、團(tuán)體分工作業(yè)等等。
我們可以利用黑色與白色,透過(guò)不同透明度的疊加在原始色彩中,以取得同色系的色彩:
這個(gè)效果很接近直接調(diào)整飽和度以及明度數(shù)值所得到的色彩結(jié)果,很快速但是不一定可以取得吸引人的色彩。
繪圖軟體中提供了色彩混合的疊加模式,我們這邊利用「柔光」(soft light)的疊加模式,以相同的方式疊加在原始色彩中,可以得到完全不同的色彩組合,比起透明度的疊加,取得的色彩更舒服、更調(diào)合:
當(dāng)柔光的效果不夠強(qiáng)烈的時(shí)候,我們另外可以嘗試其他不同的疊加方式,例如以下就是使用「重疊」(overlay)的混合模式得到的色彩組合:
當(dāng)然不同明度的色彩使用各種混合模式亦會(huì)得到不同的結(jié)果,高明度與低明度的色彩適用的混合方式并不同,建議可以依據(jù)自己的原始色彩多方嘗試、快速取得最符合自己需要的色彩組合。
方法是死的,這些配色方法都只是透過(guò)科學(xué)化的方式、幫助我們更快的取得需要的色彩組合來(lái)應(yīng)用,當(dāng)然設(shè)計(jì)師們應(yīng)該按照自己的需求來(lái)對(duì)色彩做調(diào)整。例如黃色系的高明度色彩,其實(shí)如果將「色相」做細(xì)微幅度的往紅色(低明度)偏移,也可以得到降低明度的結(jié)果
、卻也讓人感受到是同一色系的延伸。
這里將會(huì)介紹一些好用的配色工具,簡(jiǎn)單容易使用哦!