09.18 「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲

人從出生在這個世界上開始,每天都在享受大自然呈現出來的視覺盛宴,而色彩就是其表現手法。

一、為什麼要配色?

淘寶網上,不同的色彩搭配可以改變商品給人的印象,這就造就了電商設計師的誕生,色彩也因此在電商界中有了極為重要的地位。

然而,輪到自身來運用顏色時,很多人又覺得束手無策,不知所措…比如我們在淘寶購物的時候經常會看到類似下面的圖片:雖然足夠顯眼,但是用色多、雜、亂甚至刺眼…其實店家完全可以把圖片處理的既顯眼又美觀!

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


那麼,有什麼方法可以提高配色能力,避免手中的圖片的配色讓人無法直視呢?這裡給各位看官介紹基礎的配色理論和一些實用的配色工具,希望對你會有一些幫助。

二、怎麼配?

配色,一般發生在需求製作之前的思考,或者是作品完成之後的檢查。色彩可以根據三屬性【色相、明度(亮度)、純度(飽和度)】進行體系化歸類,為了能夠掌握色彩並運用自如,必須充分理解這三個屬性。

1、色相:說通俗點就是指顏色本身,主要的色相就是生活中我們常見的彩虹七色。將色相按照波譜上順序進行排列,首尾相連形成的環狀圖形,即:色相環。

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


色相環上相鄰的顏色即同色,區間在90°角以內的顏色是鄰近色,對角的顏色是互補色,介於鄰近色和互補色之間的是對比色。

2、明度(亮度):指色彩的明亮程度,在任何顏色中添加白色,明度上升,添加黑色,明度下降。因此,色彩中明度最高的是白色,明度最低的黑色。

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


3、純度(飽和度):指色彩的鮮豔程度——純度越低,顏色越渾濁,純度最低的是灰色(無彩色)。一般來講,純度越高,越有活力,充滿朝氣,純度越低,則給人成熟穩重的印象。

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


這裡告訴配色小白1個簡單的訣竅(不管給什麼圖片配什麼顏色:明度和純度不宜同時在80-100的區間範圍內,記住要“此消彼長”)

三、同色配色法異色配色法

基本配色法,分為同色調配色和異色調配色。

1、同色調配色體現了畫面整體的統一性,這種配色雖然單調,但呈現出了自然與和諧的景象。

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


2、常見的異色調配色就是對比色配色,由於色彩之間的互相襯托,運用高明度、高純度的色彩,可以營造強烈的視覺衝擊效果。

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


四、推薦幾個常用的配色網站

介紹幾個常用的配色網站給大家

1、Adobe color,也就是以前的Kuler ,它是一個由設計師分享配色方案的平臺,已經保存了成千上萬的預製配色方案。

網址:https://color.adobe.com/zh/create/color-wheel/

2、ColorHexa,在確定了一個主色的情況下,這個工具能幫助擴展主色色彩,搭配出數種方案。

網址:https://www.colorhexa.com/

3、Color Scheme Designer,一個在線的配色工具,相比於Adobe color它擁有詳細的色彩修改方法,和簡單的顏色演示工具。國內有個舊版本的漢化版,不過還是建議去官網使用最新的。

網址:https://colorschemedesigner.com/csd-3.5/

五、配色套路

附加一個絕對好用的配色套路

或許有部分朋友即使吸收了上面所有的理論,也依然配不好顏色,那麼或許你可以藉助一下這個巧妙的辦法了:

平時生活中,大家通過電腦或者手機都會看到一些非常美麗的圖片,那麼何不從中吸取一些顏色用到你的設計中去呢?那麼就把它保存起來吧!

「設計乾貨」打造配色裡的“視覺盛宴”,店鋪訪問深度漲漲漲


平日養成收集習慣,其實可以讓你快速的找到你想要的色彩,提高你的配色效率。

其實,我自己也並非配色高手,只不過比一些人多掌握了一些輔助技巧,使得自己在設計稿件配色的時候不那麼六神無主罷了。如果上述內容對你有所幫助,那我便滿足了。

-------------------------

圖文|手淘設計 十一


分享到:


相關文章: