2021-5-13 資深UI設(shè)計(jì)者
聽到<夜配色>這個(gè)詞,你腦海中會(huì)聯(lián)想到什么樣的色彩?或者什么樣的畫面?
可能最容易被人聯(lián)想到的就是黑色,因?yàn)橐雇斫o人的印象通常就是一片漆黑。如果繼續(xù)聯(lián)想,可能有的人也會(huì)想到藍(lán)色,因?yàn)檎鎸?shí)的夜晚也并非純黑,但是這種藍(lán)一定是暗色的藍(lán)。
但是夜晚也并非什么都看不見,有時(shí)候也會(huì)有光亮,比如自然的星光或者人造的燈光,這種光可以是冷色的。
當(dāng)然也可以是暖色的。這些情況基本上就是人們通常會(huì)聯(lián)想到的關(guān)于<夜配色>的色彩形象。
而讓大家失望的是,這些通常會(huì)想到的色彩印象其實(shí)都不屬于<夜配色>的形式,那到底什么是“夜配色”呢?
電影《綠皮書》海報(bào)
這個(gè)需要從第 91 屆奧斯卡金像獎(jiǎng)最佳影片《綠皮書》說起,《綠皮書》的海報(bào)色彩很美:水藍(lán)色的汽車與天空色相呼應(yīng),司機(jī)也穿著藍(lán)色的上衣,整個(gè)畫面都散發(fā)著明凈的藍(lán)青色調(diào),奇妙的是,后座的“主人”卻穿著一件咖啡色系的套頭衫,但是露出的襯領(lǐng)同樣也藍(lán)色系的,其實(shí)這種色彩組合就屬于<夜配色>。不過大家先別急,我們接著往下看。
電影《綠皮書》劇照
不僅電影海報(bào)如此,整部劇中的色彩搭配也始終保持著<夜配色>的基調(diào)。比如女演員明亮的藍(lán)色針織外套與褐色的裙子就形成了夜配色,其他場(chǎng)景也是如此,這正是它迷人的地方。電影《綠皮書》講述的是一段跨越種族、階級(jí)的友誼故事,而<夜配色>恰恰具有民族的、世界的、神秘的、共通的色彩屬性。
具有以上這些屬性,很大程度上是因?yàn)檫@種色彩搭配的不常見性,不常見不代表就沒有規(guī)律可循,任何色彩搭配必定有它的內(nèi)在規(guī)律,我們不能只看表面,抓到本質(zhì)才能掌握它的內(nèi)核。我們把剛剛提取的這幾組顏色排列出來分析一下。
我們看這些色彩有什么共性:上方的顏色純度或明度都是在偏低的范圍,而下方顏色的純度或明度都普遍偏高。如果再結(jié)合冷暖色來看我們會(huì)發(fā)現(xiàn),上方都是暖色系,而下方都是冷色系。
因此我們可以總結(jié)出:低純度或低明度的暖色搭配高純度或高明度的冷色,這種配色形式就是<夜配色>,也叫<影印色>。
如果大家難以理解,我們可以再通俗一點(diǎn),就是暗濁的暖色搭配鮮亮的冷色。嚴(yán)格來講<夜配色>并不算什么真正的配色技巧,無非屬于冷暖色搭配范疇,但是因?yàn)榇钆湓谝黄鸷芴貏e,所以我們就把它單獨(dú)拿出來作為一種搭配原則來探討。
異域情調(diào)
最早引入<夜配色>這一概念的是服裝領(lǐng)域。很多咖啡色系的衣裙如果只是搭配黑色或米色等色系,整體上雖然和諧但也會(huì)顯得單調(diào)和乏味,所以就會(huì)加入藍(lán)色系,這時(shí)就會(huì)有不一樣的感覺。并且<夜配色>的搭配具有高級(jí)感,比如藍(lán)色的牛仔褲就可以試試搭配駝色上衣。
復(fù)古紳士
而且<夜配色>的搭配男女通用,比如男士的話可以是水綠色的毛衣搭配棕色西裝外套,或是是領(lǐng)帶、胸花都可以。男士使用夜配色,很有時(shí)尚感,會(huì)顯得精致典雅,細(xì)節(jié)處彰顯低調(diào)華麗的質(zhì)感,整體具有復(fù)古紳士的浪漫氣息。
魅力碰撞
使用<夜配色>也可以考慮面積配比,想要冷暖碰撞的效果,通常情況下就是在上半身和下半身使用一對(duì)夜配色,比如葡萄酒色配天青藍(lán),充滿異域風(fēng)情。
點(diǎn)睛之筆
當(dāng)然也可以用點(diǎn)綴的方式來使用<夜配色>,比如用鮮亮的冷色搭配低明度的咖啡色,用鮮亮的冷色來點(diǎn)綴,展示高級(jí)感,對(duì)于服裝搭配而言,衣領(lǐng)、袖口、包、鞋這些都可以是點(diǎn)綴色的應(yīng)用載體。
對(duì)于這些<夜配色>在服裝領(lǐng)域的應(yīng)用,我們可以將它們提取出來,按照暖色和冷色重新擺放,然后旋轉(zhuǎn)角度,不知道大家發(fā)現(xiàn)什么沒有,其實(shí)<夜配色>的獨(dú)特美感,像極了天空色與大地色的碰撞。
雖然到這里大家對(duì)<夜配色>已經(jīng)有了一些基本的了解,但是想要良好的運(yùn)用到設(shè)計(jì)當(dāng)中,還需要繼續(xù)加深理解,畢竟我們之前所看到的都是電影或者服裝領(lǐng)域的<夜配色>,而我們切入的角度,就是先排除那些不屬于<夜配色>的形式。
回到之前我們總結(jié)的,首先<夜配色>包含一種冷色和一種暖色,然后色調(diào)上分為暗濁的和鮮亮的,所以它們兩兩組合就會(huì)出現(xiàn)四種形式:也就是暗濁的冷色搭配鮮亮的冷色、暗濁的冷色搭配鮮亮的暖色、暗濁的暖色搭配鮮亮的暖色、暗濁的暖色搭配鮮亮的冷色。
暗濁的<冷色>——鮮亮的<冷色>
首先第一種就是暗濁的冷色搭配鮮亮的冷色,這種配色形式很常用,比如通常我們確定一個(gè)背景色之后,上方的文字色或元素色就會(huì)在背景色的基礎(chǔ)上改變純度或明度。
暗濁的<冷色>——鮮亮的<暖色>
第二種就是暗濁的冷色搭配鮮亮的暖色,這種比第一種更常見,因?yàn)檫@種形式就是我們通常所講的冷暖搭配,一冷一暖,一亮一暗。
暗濁的<暖色>——鮮亮的<暖色>
第三種形式就是暗濁的暖色搭配鮮亮的暖色,這種搭配形式整體方向也是比較偏向統(tǒng)一協(xié)調(diào)的,不會(huì)有太大的問題,但也很難給人眼前一亮的視覺沖擊。
暗濁的<暖色>——鮮亮的<冷色>
最后一種就是暗濁的暖色搭配鮮亮的冷色,也就是我們這期教程中所講的<夜配色>,這種配色形式運(yùn)用到平面設(shè)計(jì)領(lǐng)域,整體上還是可以保留它的氣質(zhì)和風(fēng)格的:神秘、充滿異域風(fēng)情,當(dāng)然我認(rèn)為這些屬性并不是一成不變的,但是不變的是<夜配色>會(huì)給人不一樣的感覺,因?yàn)橥ǔH藗兌疾惶珪?huì)這么配色,所以我們什么情況下去使用<夜配色>,相信大家心理已經(jīng)有答案了吧。接下來我們來嘗試幾個(gè)案例。
這是一個(gè)人物插畫,首先我們先將人物皮膚的顏色填充進(jìn)來,然后是箱子。
接下來就是為人物的穿著填色,這時(shí)候我們就可以回想之前我們列舉的服裝搭配的例子了,我們可以將褲子的顏色填充一個(gè)大地色。
然后是上衣的顏色,如果是常規(guī)的人物插畫配色,通常情況下衣服都會(huì)選擇一個(gè)跟褲子顏色相統(tǒng)一和諧的顏色,但是如果我們想要一些不一樣的效果,這時(shí)就可以使用<夜配色>,將衣服的顏色填充一個(gè)天藍(lán)色,也是我們之前所講的碰撞色,因?yàn)槊娣e相當(dāng)。
當(dāng)然,我們也可以將褲子填充水藍(lán)色,有些類似牛仔褲的顏色,衣服填充一個(gè)咖色,這也是一種<夜配色>。
或者我們也可以使用點(diǎn)綴色的形式,比如整體顏色是咖色,但是我們可以在衣領(lǐng)、袖口、褲腳這些小面積區(qū)域填充亮冷色。
再或者是鞋子的顏色也可以,或者再大膽一些給頭發(fā)染個(gè)色。
我們也可以嘗試一個(gè)網(wǎng)頁首屏,比如畫面中這種色調(diào)的圖片現(xiàn)在很流行,本身就很適合我們這期內(nèi)容所講<夜配色>。
如果我們添加白色文字,雖然識(shí)別度很好,但是不會(huì)給人眼前一亮的感覺,會(huì)稍顯平庸。
這時(shí)我們就可以嘗試<夜配色>的搭配,當(dāng)然文字色可以有選擇,都可以嘗試一下,甚至是偏暖一些的文字也不是說就不可以,我們總結(jié)出的規(guī)律要為我們所用,而不要被規(guī)律所限制,希望大家能明白這個(gè)道理,千萬不要理解的太死板。
最后我又嘗試了一個(gè)海報(bào),海報(bào)的主題是“南非當(dāng)代攝影展”,這個(gè)名字就會(huì)讓我腦海中浮現(xiàn)出異域風(fēng)情,所以我認(rèn)為可以使用夜配色。
先將圖片置入到版面當(dāng)中,而這張圖片本身就是大地色調(diào),因此也是適合<夜配色>搭配的。
所以上方的背景色我們就可以填充一個(gè)天藍(lán)色,現(xiàn)在整體上下色調(diào)對(duì)比就是<夜配色>的形式。
文字這里我們也可以不使用黑色,替換成大地色,下方的小字使用上方的藍(lán)色。但是做到這里我感覺畫面還缺少點(diǎn)什么,也就是整個(gè)版面的構(gòu)圖和文字編排都很規(guī)矩和工整,這時(shí)候就需要有一些破壞這種工整的元素。
所以我就在右下方這里添加了一個(gè)手寫體的英文,為這個(gè)畫面增加一些靈動(dòng),當(dāng)然顏色上也是吸取上方的藍(lán)色,形成呼應(yīng)。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)掃碼藍(lán)小助,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系。
文章來源:優(yōu)設(shè) 作者:研習(xí)社
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.teruid.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.teruid.com