反差巨大但效果驚人的夜配色,該如何運用自如?

2021-5-13    資深UI設(shè)計者

反差巨大但效果驚人的夜配色,該如何運用自如?

聽到<夜配色>這個詞,你腦海中會聯(lián)想到什么樣的色彩?或者什么樣的畫面?

反差巨大但效果驚人的夜配色,該如何運用自如?

可能最容易被人聯(lián)想到的就是黑色,因為夜晚給人的印象通常就是一片漆黑。如果繼續(xù)聯(lián)想,可能有的人也會想到藍色,因為真實的夜晚也并非純黑,但是這種藍一定是暗色的藍。

反差巨大但效果驚人的夜配色,該如何運用自如?

但是夜晚也并非什么都看不見,有時候也會有光亮,比如自然的星光或者人造的燈光,這種光可以是冷色的。

反差巨大但效果驚人的夜配色,該如何運用自如?

當(dāng)然也可以是暖色的。這些情況基本上就是人們通常會聯(lián)想到的關(guān)于<夜配色>的色彩形象。

反差巨大但效果驚人的夜配色,該如何運用自如?

而讓大家失望的是,這些通常會想到的色彩印象其實都不屬于<夜配色>的形式,那到底什么是“夜配色”呢?

電影《綠皮書》海報 

反差巨大但效果驚人的夜配色,該如何運用自如?

這個需要從第 91 屆奧斯卡金像獎最佳影片《綠皮書》說起,《綠皮書》的海報色彩很美:水藍色的汽車與天空色相呼應(yīng),司機也穿著藍色的上衣,整個畫面都散發(fā)著明凈的藍青色調(diào),奇妙的是,后座的“主人”卻穿著一件咖啡色系的套頭衫,但是露出的襯領(lǐng)同樣也藍色系的,其實這種色彩組合就屬于<夜配色>。不過大家先別急,我們接著往下看。

電影《綠皮書》劇照

反差巨大但效果驚人的夜配色,該如何運用自如?

不僅電影海報如此,整部劇中的色彩搭配也始終保持著<夜配色>的基調(diào)。比如女演員明亮的藍色針織外套與褐色的裙子就形成了夜配色,其他場景也是如此,這正是它迷人的地方。電影《綠皮書》講述的是一段跨越種族、階級的友誼故事,而<夜配色>恰恰具有民族的、世界的、神秘的、共通的色彩屬性。

反差巨大但效果驚人的夜配色,該如何運用自如?

具有以上這些屬性,很大程度上是因為這種色彩搭配的不常見性,不常見不代表就沒有規(guī)律可循,任何色彩搭配必定有它的內(nèi)在規(guī)律,我們不能只看表面,抓到本質(zhì)才能掌握它的內(nèi)核。我們把剛剛提取的這幾組顏色排列出來分析一下。

反差巨大但效果驚人的夜配色,該如何運用自如?

我們看這些色彩有什么共性:上方的顏色純度或明度都是在偏低的范圍,而下方顏色的純度或明度都普遍偏高。如果再結(jié)合冷暖色來看我們會發(fā)現(xiàn),上方都是暖色系,而下方都是冷色系。

反差巨大但效果驚人的夜配色,該如何運用自如?

因此我們可以總結(jié)出:低純度或低明度的暖色搭配高純度或高明度的冷色,這種配色形式就是<夜配色>,也叫<影印色>。

反差巨大但效果驚人的夜配色,該如何運用自如?

如果大家難以理解,我們可以再通俗一點,就是暗濁的暖色搭配鮮亮的冷色。嚴(yán)格來講<夜配色>并不算什么真正的配色技巧,無非屬于冷暖色搭配范疇,但是因為搭配在一起很特別,所以我們就把它單獨拿出來作為一種搭配原則來探討。

異域情調(diào)

反差巨大但效果驚人的夜配色,該如何運用自如?

最早引入<夜配色>這一概念的是服裝領(lǐng)域。很多咖啡色系的衣裙如果只是搭配黑色或米色等色系,整體上雖然和諧但也會顯得單調(diào)和乏味,所以就會加入藍色系,這時就會有不一樣的感覺。并且<夜配色>的搭配具有高級感,比如藍色的牛仔褲就可以試試搭配駝色上衣。

復(fù)古紳士 

反差巨大但效果驚人的夜配色,該如何運用自如?

而且<夜配色>的搭配男女通用,比如男士的話可以是水綠色的毛衣搭配棕色西裝外套,或是是領(lǐng)帶、胸花都可以。男士使用夜配色,很有時尚感,會顯得精致典雅,細節(jié)處彰顯低調(diào)華麗的質(zhì)感,整體具有復(fù)古紳士的浪漫氣息。

魅力碰撞

反差巨大但效果驚人的夜配色,該如何運用自如?

使用<夜配色>也可以考慮面積配比,想要冷暖碰撞的效果,通常情況下就是在上半身和下半身使用一對夜配色,比如葡萄酒色配天青藍,充滿異域風(fēng)情。

點睛之筆

反差巨大但效果驚人的夜配色,該如何運用自如?

當(dāng)然也可以用點綴的方式來使用<夜配色>,比如用鮮亮的冷色搭配低明度的咖啡色,用鮮亮的冷色來點綴,展示高級感,對于服裝搭配而言,衣領(lǐng)、袖口、包、鞋這些都可以是點綴色的應(yīng)用載體。

反差巨大但效果驚人的夜配色,該如何運用自如?

對于這些<夜配色>在服裝領(lǐng)域的應(yīng)用,我們可以將它們提取出來,按照暖色和冷色重新擺放,然后旋轉(zhuǎn)角度,不知道大家發(fā)現(xiàn)什么沒有,其實<夜配色>的獨特美感,像極了天空色與大地色的碰撞。

反差巨大但效果驚人的夜配色,該如何運用自如?

雖然到這里大家對<夜配色>已經(jīng)有了一些基本的了解,但是想要良好的運用到設(shè)計當(dāng)中,還需要繼續(xù)加深理解,畢竟我們之前所看到的都是電影或者服裝領(lǐng)域的<夜配色>,而我們切入的角度,就是先排除那些不屬于<夜配色>的形式。

反差巨大但效果驚人的夜配色,該如何運用自如?

回到之前我們總結(jié)的,首先<夜配色>包含一種冷色和一種暖色,然后色調(diào)上分為暗濁的和鮮亮的,所以它們兩兩組合就會出現(xiàn)四種形式:也就是暗濁的冷色搭配鮮亮的冷色、暗濁的冷色搭配鮮亮的暖色、暗濁的暖色搭配鮮亮的暖色、暗濁的暖色搭配鮮亮的冷色。

暗濁的<冷色>——鮮亮的<冷色>

反差巨大但效果驚人的夜配色,該如何運用自如?

首先第一種就是暗濁的冷色搭配鮮亮的冷色,這種配色形式很常用,比如通常我們確定一個背景色之后,上方的文字色或元素色就會在背景色的基礎(chǔ)上改變純度或明度。

暗濁的<冷色>——鮮亮的<暖色> 

反差巨大但效果驚人的夜配色,該如何運用自如?

第二種就是暗濁的冷色搭配鮮亮的暖色,這種比第一種更常見,因為這種形式就是我們通常所講的冷暖搭配,一冷一暖,一亮一暗。

暗濁的<暖色>——鮮亮的<暖色>

反差巨大但效果驚人的夜配色,該如何運用自如?

第三種形式就是暗濁的暖色搭配鮮亮的暖色,這種搭配形式整體方向也是比較偏向統(tǒng)一協(xié)調(diào)的,不會有太大的問題,但也很難給人眼前一亮的視覺沖擊。

暗濁的<暖色>——鮮亮的<冷色> 

反差巨大但效果驚人的夜配色,該如何運用自如?

反差巨大但效果驚人的夜配色,該如何運用自如?

反差巨大但效果驚人的夜配色,該如何運用自如?

最后一種就是暗濁的暖色搭配鮮亮的冷色,也就是我們這期教程中所講的<夜配色>,這種配色形式運用到平面設(shè)計領(lǐng)域,整體上還是可以保留它的氣質(zhì)和風(fēng)格的:神秘、充滿異域風(fēng)情,當(dāng)然我認為這些屬性并不是一成不變的,但是不變的是<夜配色>會給人不一樣的感覺,因為通常人們都不太會這么配色,所以我們什么情況下去使用<夜配色>,相信大家心理已經(jīng)有答案了吧。接下來我們來嘗試幾個案例。

反差巨大但效果驚人的夜配色,該如何運用自如?

這是一個人物插畫,首先我們先將人物皮膚的顏色填充進來,然后是箱子。

反差巨大但效果驚人的夜配色,該如何運用自如?

接下來就是為人物的穿著填色,這時候我們就可以回想之前我們列舉的服裝搭配的例子了,我們可以將褲子的顏色填充一個大地色。

反差巨大但效果驚人的夜配色,該如何運用自如?

然后是上衣的顏色,如果是常規(guī)的人物插畫配色,通常情況下衣服都會選擇一個跟褲子顏色相統(tǒng)一和諧的顏色,但是如果我們想要一些不一樣的效果,這時就可以使用<夜配色>,將衣服的顏色填充一個天藍色,也是我們之前所講的碰撞色,因為面積相當(dāng)。

反差巨大但效果驚人的夜配色,該如何運用自如?

當(dāng)然,我們也可以將褲子填充水藍色,有些類似牛仔褲的顏色,衣服填充一個咖色,這也是一種<夜配色>。

反差巨大但效果驚人的夜配色,該如何運用自如?

或者我們也可以使用點綴色的形式,比如整體顏色是咖色,但是我們可以在衣領(lǐng)、袖口、褲腳這些小面積區(qū)域填充亮冷色。

反差巨大但效果驚人的夜配色,該如何運用自如?

再或者是鞋子的顏色也可以,或者再大膽一些給頭發(fā)染個色。

反差巨大但效果驚人的夜配色,該如何運用自如?

我們也可以嘗試一個網(wǎng)頁首屏,比如畫面中這種色調(diào)的圖片現(xiàn)在很流行,本身就很適合我們這期內(nèi)容所講<夜配色>。

反差巨大但效果驚人的夜配色,該如何運用自如?

如果我們添加白色文字,雖然識別度很好,但是不會給人眼前一亮的感覺,會稍顯平庸。

反差巨大但效果驚人的夜配色,該如何運用自如?

這時我們就可以嘗試<夜配色>的搭配,當(dāng)然文字色可以有選擇,都可以嘗試一下,甚至是偏暖一些的文字也不是說就不可以,我們總結(jié)出的規(guī)律要為我們所用,而不要被規(guī)律所限制,希望大家能明白這個道理,千萬不要理解的太死板。

反差巨大但效果驚人的夜配色,該如何運用自如?

最后我又嘗試了一個海報,海報的主題是“南非當(dāng)代攝影展”,這個名字就會讓我腦海中浮現(xiàn)出異域風(fēng)情,所以我認為可以使用夜配色。

反差巨大但效果驚人的夜配色,該如何運用自如?

先將圖片置入到版面當(dāng)中,而這張圖片本身就是大地色調(diào),因此也是適合<夜配色>搭配的。

反差巨大但效果驚人的夜配色,該如何運用自如?

所以上方的背景色我們就可以填充一個天藍色,現(xiàn)在整體上下色調(diào)對比就是<夜配色>的形式。

反差巨大但效果驚人的夜配色,該如何運用自如?

文字這里我們也可以不使用黑色,替換成大地色,下方的小字使用上方的藍色。但是做到這里我感覺畫面還缺少點什么,也就是整個版面的構(gòu)圖和文字編排都很規(guī)矩和工整,這時候就需要有一些破壞這種工整的元素。

反差巨大但效果驚人的夜配色,該如何運用自如?

所以我就在右下方這里添加了一個手寫體的英文,為這個畫面增加一些靈動,當(dāng)然顏色上也是吸取上方的藍色,形成呼應(yīng)。



 藍藍設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進入一起成長學(xué)習(xí),請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png



文章來源:優(yōu)設(shè)   作者:研習(xí)社

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍藍設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍藍設(shè)計www.bouu.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)


分享本文至:

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://www.bouu.cn

存檔