- Photoshop淘寶天貓網店設計裝修從入門到精通
- 蔣珍珍
- 3112字
- 2020-11-28 17:16:16
2.3 配色方案:解密網店配色技巧
從視覺的角度而言,顧客最先感知的便是網店裝修畫面中的色彩。任何色彩都具備色相、明度和純度3個基本要素。如何正確地運用常見的配色方案,是網店裝修設計必備的技能。
2.3.1 對比配色在裝修中的應用
在我們生活的世界中,時時處處都充滿著各種不同的色彩。人們在接觸這些色彩的時候,常常都會以為色彩是獨立的:天空是藍色的,植物是綠色的,而花朵是紅色的。其實,色彩就像音符一樣,唯有一個個的音符才能共同譜出美妙的樂章。色彩亦是,實際上沒有一個色彩是獨立存在的,也沒有哪一種顏色本身是好看的顏色或是不好看的顏色;相反,只有當色彩成為一組顏色組成中的其中一個的時候,我們才會說這個顏色在這里是協調或不協調、適合或不適合。
前面介紹過色彩是由色相、明度及純度3種屬性所組成,而其中的色相是人在最早認識色彩的時候所理解到的屬性,也就是所謂色彩的名稱,如紅色、黃色、藍色等。如圖2-24所示,為最常見的12色相環。

圖2-24 12色相環
因為互補色有強烈的分離性,所以使用互補色的配色設計,可以有效加強整體配色的對比度、拉開距離感,而且能表現出特殊的視覺對比與平衡效果,使用得好能讓作品給人以活潑、充滿生命力的感受。如圖2-25所示,為色相差異較大的對比配色的網店首頁效果。

圖2-25 色相差異較大的對比配色的網店首頁效果
色相的對比,往往是由于差別所產生的。色彩的對比其實也就是色相之間的矛盾關系。各種色彩在色相上產生細微的差別,都能夠對畫面產生一定的影響。色相的對比搭配可以使畫面充滿生機,并且具有豐富的層次感。
當然如果將色彩的條件稍微放寬一點,比如,180度互補色的臨近色系也搭入配色考慮的話,可以形成的色彩配色就更寬廣、更豐富了。
由于互補色彩之間的對比相當強烈,因此想要適當地運用互補色,必須特別慎重考慮色彩彼此間的比例問題。因此,當使用對比色配色時,必須利用大面積的一種顏色與另一個面積較小的互補色來達到平衡。如果兩種色彩所占的比例相同,那么對比會顯得過于強烈。如圖2-26所示,網店裝修中使用大面積的黑色與小面積的灰白色形成對比。

圖2-26網店裝修中的對比配色效果
專家指點
某日本設計師曾經針對色彩的配色提出比例原則75%、25%與5%的配色比例方式,其中的底色為大面積使用的底色,而主色與強調色則是可以利用互補色的特性,來將主色以及強調色都襯托出來,如圖2-27所示。

圖2-27 配色比例方式
例如,紅與綠如果在畫面上占有同樣面積的時候,就容易讓人頭暈目眩。可以選擇其中之一的顏色為大面積,構成主色,而另一顏色為小面積作為對比色。通常情況下,會以3∶7甚至2∶8的比例來作為分配原則。
2.3.2 調和配色在裝修中的應用
“調”具有調整、調理、調停、調配、安頓、安排、搭配、組合等意思;“和”可理解為和一、和順、和諧、和平、融洽、相安、適宜、有秩序、有規矩、有條理、恰當,沒有尖銳的沖突,相互依存,相得益彰等解釋。配色的目的就是制造美的色彩組合,而和諧是色彩美的首要前提,它使色調讓人感覺到愉悅,同時調配后的顏色還能滿足人們視覺上的需求以及心理上的平衡。
我們知道,和諧來自對比,和諧就是美。沒有對比就沒有刺激神經興奮的因素,但只有興奮而沒有舒適的休息會造成過分的疲勞,會造成精神的緊張,這樣調和也就成了一句空話。如此看來,既要有對比來產生和諧的刺激——美的享受,又要有適當的調和來抑制過分的對比——刺激,從而產生一種恰到好處的對比——和諧——美的享受。總體來說,色彩的對比是絕對的,而調和是相對的,調和是實現色彩美的重要手段。
1.以色相為基礎的調和配色
在保證色相大致不變的前提下,通過改變色彩的明度和純度來達到配色的效果。這類配色方式保持了色相上的一致性,所以色彩在整體效果上很容易達到調和。以色相為基礎的配色方案主要有以下幾種。
● 同一色相配色:指相同的顏色在一起的搭配,比如,藍色的上衣配上藍色的褲子或者裙子。這樣的配色方法就是同一色相配色法,如圖2-28所示。

圖2-28 同一色相配色
● 類似色相配色:指色相環中類似或相鄰的兩個或兩個以上的色彩搭配。例如:黃色、橙黃色、橙色的組合;紫色、紫紅色、紫藍色的組合等都是類似色相配色。類似色相配色的配色在大自然中出現得特別多,有嫩綠、鮮綠、黃綠、墨綠等。
● 對比色相配色:指在色環中,位于色環圓心直徑兩端的色彩或較遠位置的色彩搭配。它包含了中差色相配色、對照色相配色、輔助色相配色。在24色相環中,兩色相相差4~7個色,稱為基色的中差色。在色相環上有90°左右的角度差的配色就是中差配色;它的色彩對比效果明快,是深受人們喜愛的顏色。在色相環上,色相差為8~10的色相組合,被稱為對照色。從角度上說,相差135°左右的色彩配色就是對照色。色相差11~12,角度為165°~180°左右的色相組合,稱為輔助色配色。
● 色相調和中的多色配色:在色相對比中,除了兩色對比,還有三色、四色、五色、六色、八色甚至多色的對比。在色環中成等邊三角形或等腰三角形的3個色相搭配在一起時,稱為三角配色。四角配色常見的有紅、黃、藍、綠及紅、橙、黃、綠、藍、紫等色。
2.以明度為基礎的調和配色
明度是人類分辨物體色最敏銳的色彩反應,它的變化可以表現事物的立體感和遠近感。例如,希臘的雕刻藝術就是通過光影的作用產生了許多黑白灰的相互關系,形成了成就感;中國的國畫也經常使用無彩色的明度搭配。有彩色的物體也會受到光影的影響而產生明暗效果,如紫色和黃色就有著明顯的明度差。
明度可以分為高明度、中明度和低明度3類,這樣明度就有了高明度配高明度、高明度配中明度、高明度配低明度、中明度配中明度、中明度配低明度、低明度配低明度6種搭配方式。其中,高明度配高明度、中明度配中明度、低明度配低明度,屬于相同明度配色。在網店裝修中,一般使用明度相同、色相和純度變化的配色方式,如圖2-29所示。

圖2-29 以明度為基礎的調和配色
3.以純度為基礎的調和配色
純度的強弱代表著色彩的鮮灰程度。在一組色彩中當純度的水平相對一致時,色彩的搭配也就很容易達到調和的效果。隨著純度高低的不同,色彩的搭配也會有不一樣的視覺感受。如圖2-30所示,為以純度為基礎的網店調和配色方案。

圖2-30 以純度為基礎的調和配色
專家指點
PCCS(Practical Color Coordinate System)色彩體系提出了色調這個觀點。色調經過命名分類后,分布于不同的區域,更加方便配色使用。凡色調配色,要領有三,即同一色調配色、類似色調配色、對比色調配色。
· 同一色調配色:指將相同色調的不同顏色搭配在一起形成的一種配色關系。同一色調的顏色,色彩的純度和明度具有共同性,明度按照色相略有變化。不同色調會產生不同的色彩印象,將純色調全部放在一起,會產生活潑感;而嬰兒服飾和玩具都以淡色調為主。在對比色相和中差色相的配色中,一般采用同一色調的配色手法,更容易進行色彩調和。
· 類似色調配色:即以色調配圖中相鄰或接近的兩個或兩個以上色調搭配在一起的配色。類似色調的特征在于色調和色調之間微小的差異,較統一色調有變化,不易產生呆滯感。
· 對比色調配色:對比色調配色是指相隔較遠的兩個或兩個以上的色調搭配在一起的配色。對比色調配色在配色選擇時,會因縱向或橫向對比有明度及彩度上的差異,比如:淺色調和深色調配色,即為深與淺的明暗對比。
4.無彩色的調和配色
無彩色的色彩個性并不明顯,將無彩色與任何色彩搭配都可以取得調和的色彩效果。通過無彩色與無彩色搭配,可以傳達出一種經典的永恒美感;將無彩色與有彩色搭配,可以用其作為主要的色彩來調和色彩間的關系。
專家指點
無彩色的彩色調和配色,在設計單品文案的時候,能夠達到突出主體物的作用。
因此,在網店的裝修設計中,有時為了達到某種特殊的效果,或者凸顯出某個特殊的對象,可以通過無彩色調和配色來對設計的畫面進行創作,如圖2-31所示。

圖2-31 無彩色的調和配色
- iPad+Procreate數字插畫設計案例教程(全彩微課版)
- Photoshop CC超級學習手冊
- SPSS進階分析與實務
- AI繪畫:Stable Diffusion從入門到精通
- Photoshop CS6實戰從入門到精通(超值版)
- MATLAB 2022a從入門到精通
- MATLAB在日常計算中的應用
- 中文版Photoshop平面設計入門教程
- 企業微信公眾平臺開發實戰:再小的個體也有自己的品牌
- MooTools 1.2 Beginner's Guide
- 會聲會影X8 DV影片制作/編輯/刻盤實戰從入門到精通
- Photoshop新媒體美工設計(視頻指導版)
- Building Enterprise Ready Telephony Systems with sipXecs 4.0
- Photoshop CC 2018基礎與實戰教程(全彩版)
- 同花順軟件操作技巧與實戰指南