首發于做設計的面條（TTTink-D, 一個不裝逼的電商號）
原標題：［干貨］這篇文章真是太黃了，想報警！??！～
數英用戶原創文章，轉載請聯系本人
寫在前面
我最近在寫一系列關于色彩的文章，之前已經寫過紅色和黑色在電商設計里的運用，而我今天想要給大家分享的是你們最喜歡的顏色——黃色在設計當中的運用~
而說到黃色，你會想到哪些品牌呢？比如我會想到站酷、ofo小黃車、麥當勞、法拉利等，雖然他們是完全不同的4個品牌，但他們的主要用戶群體無不都是心理上比較追求年輕活力的一類人，他們樂于接受新鮮好玩的事物。
而反觀各類傳統企業或國企卻基本不會使用黃色，而是以藍色、紅色為品牌主色，這類企業給人的感覺也多是嚴謹嚴肅沉穩的，比如大家可以留意一下各大銀行的logo和品牌形象。
而電商的玩法則是傳統思想＋新興互聯網思想的結合體，這里面存在著無限種可能，所以也基本沒有不適合運用于電商設計里的顏色，而黃色也是除紅色以外得到了非常廣泛運用的一種顏色，接下來，我們一起看看，黃色在電商設計里都有哪些奧秘和玩法吧！
按照慣例，我先給大家列一個提綱：
1、黃色的釋義。
2、黃色在電商設計里的運用。
3、與黃色有關的常用色彩搭配有哪些？
4、黃色的使用禁忌或注意事項有哪些？
接下來我們一條一條來解說吧，let’s go！！！~
一、黃色的釋義
從性格色彩的層面來說，好的方面：黃色代表年輕／活潑／希望／輝煌／開朗／智慧／忠誠；不好的方面：黃色代表懦弱／怒氣／欺騙／幼稚；
從顏色的層面來說，根據色相／明度／飽和度的不同紅色也分很多種紅啊，比如檸檬黃／橙色／橘色／芥末黃／嫩黃／金黃／土黃／屎黃／米黃色等等（與黃色有關的顏色我都統稱為黃色系）；
從作用的層面來說，不同的黃色可以代表預警提示／突出強調／輝煌榮耀／暴力傾向／勾起食欲／增加快樂氛圍等等；
二、黃色在電商設計里的運用
正是因為黃色能給人這些不同感官刺激作用，所以它常運用于一些要體現食欲／青春活力／時尚潮流等類型的電商或海報設計里。同時黃色也常用來作為點綴色出現，以強調某個重要信息，使用頻率極高。
比如常運用于以下類型的頁面設計里：
1、傳統喜慶節日
像春節／國慶節這樣的傳統喜慶節日，經常都會紅色和黃色同時出現，這跟中國傳統文化習俗有關，比如我們會聯想到大紅燈籠／煙花爆竹／敲鑼打鼓等等事物，所以頁面設計里使用相似的色彩搭配容易讓人感覺到相似的節日氛圍。
通常是以紅色為主色，黃色多以輔助色或點綴色出現：
2、頒獎盛典
很多比較重量級的頒獎典禮或音樂慶典都喜歡用金色，一來顯得活動隆重含金量高，二來可以體現嘉賓和觀眾的尊貴（當然了，這些都是美好愿景，實際是不是也要看實際情況了，而這種類型的設計在這時候起到的作用就是拔高活動形象和活動意義）：
3、兒童節
之前我就寫過兒童節的方向是很多的，不止是面對小兒童，還有的是面對大兒童的，雖然他們的定位方向不一樣，但頁面設計里采用鮮艷明亮的顏色搭配Q彈的充滿活力的萌物形象確實更容易激發女性的母愛／長輩的保護欲／還有成年人的童心，所以愿意為孩童或為自己內心的那個孩童買買買啊~
4、美食節／吃貨節
不知道大家發現沒有，很多誘人的水果、零食、美食、都是黃色系的，比如橙子、柚子、面包、金黃金黃的蛋炒飯、蜂蜜、蛋糕、爆米花、蟹黃、芝麻油等等，想起來都口水直流是不是？除了實物本身就是黃色以外，還因為黃色橙色是可以激發人的食欲和內心躁動不安的情緒的，所以你會看到在很多零食包裝、快餐店、美食活動頁的設計上基本都會黃色系的運用~目的就是為了讓你快速產生購買決策：
5、夏季活動
夏天我們會想到什么？一方面是現實的炎炎烈日，炙熱的太陽，所以會想到橙色的太陽，但是另一方面是期待的酷爽、冰鎮的感覺，我們會想到海灘和冰塊、檸檬茶等等，所以當然也有一部分人喜歡用藍色去提現清爽，最后也有人將兩者結合起來，打造冰火對決的感覺~
6、賣場促銷
商場做促銷活動／電商平臺或店鋪做大促的時候，比如雙十一／雙12／618等，幾乎都缺不了黃色，無論是作為主色還是作為輔助色點綴色出現（主色為占面積最大的顏色，其他占比相對較小的顏色則為輔助色或點綴色）。
7、體現潮流時尚
黃色作為一種非常醒目的顏色，給人一種尖銳個性張揚的感覺，所以也深得潮流時尚類型設計的偏愛~
8、突出強調某個重要信息
黃色也常用來作為輔助色或點綴色，用來突出強調某個重要信息的，比如突出強調利益點／購買按鈕等信息：
如果產品本身就是黃色時常常會與黃色相關的物品或背景聯系起來，充滿趣味和創意：
三、與黃色有關的常用色彩搭配有哪些？
黃色是很張揚、活力、刺激的顏色，是中性色（也有人說它是暖色），也是一種百搭色，基本與任何顏色都有一腿~那么今天我就給大家例舉一些常用的優秀的黃色系色彩與其它顏色的搭配好了。
舉幾個例子：
運用在大量留白的簡潔無彩色背景上，整體畫面都會顯得非常干凈通透。
高明度低飽和度的顏色搭配嫩黃色，少女心滿滿的，特別適合針對少女心定位的頁面設計~
在藍色系大背景里，只需一點黃就能成為焦點，因為藍黃是對比色（120度角），所以在頁面里常作為重點信息突出展示~
雖然同樣是藍黃搭配，但是在不同的藍色系里，整體呈現出的感覺是不一樣的，藍色越暗，黃色越突出，整體越刺激眼球。
同上~
黃色系作為大背景的時候，整體畫面相較于上面的藍色紫色背景更加溫暖有食欲~這種顏色搭配適合用在食品類或者熱鬧促銷或兒童玩具等需要體現活潑熱鬧的頁面上~
在低明度高飽和度的多彩色彩環境里，黃色也很容易脫穎而出~不過這種顯色搭配相較于前面提到的幾種都略顯沉悶，用不好的話會顯臟，用得好也不會感覺很高級，適合中低端定位的產品或頁面設計。
依然是黃色做大背景，暖色為主，點綴少量冷色~這種色彩比例搭配比上圖看起來更加愉悅~
大面積黃色或同色系做背景，僅點綴少量對比色或互補色，來突出想重點展示的信息，整體看起來干凈舒服～
下圖雖然都是不同明度純度黃色系和藍色系的色彩搭配，但是前者明度高純度高，所以顯得有精神氣兒，后者明度低純度低則顯得更佳復古懷舊~
下圖的顏色搭配也都是比較有年代感的~但前者感覺更有親和力~因為暖色系占比比較大。
下圖的暗調子的番茄炒雞蛋的紅黃搭配容易給人一種復古溫暖的感覺，但為了畫面不至于太膩歪，最好是像右圖一樣搭配一點冷色或暗色比較耐看，把控好色彩比例既可以做出高端的感覺，也可以做出低價促銷的感覺。
有幾張黃色的日本海報設計也挺不錯～
還有一點要說明的是，黃色跟紅色一樣，或者說任何顏色，它運用于不同的形式載體／紋理材質／周圍情境時，所傳遞的感受是不一樣的，這個我在之前的一篇講解紅色運用的文章里已經舉例說明過。
那么它們具體運用在電商設計里是什么樣一個情況呢？我在花瓣找了一些還不錯的運用了黃色的頁面給大家看看下（我以自己的語言給大家分析一下，感謝所有設計者，分析的不對的地方還望指正）：
左邊是借鑒了蒙德里安的紅黃藍印象派風格的不走尋常路的時尚類型頁面，右邊是典型的為了激發消費者食欲和提醒熱鬧氛圍的促銷型頁面設計：
左邊是明亮活力的色彩搭配加上手繪點綴，營造出的是比較活潑搞怪風格的頁面設計，右邊雖然是以紅黃搭配為主，但是因為其扁平化的設計風格加上趣味圖形點綴所以讓頁面看起來也比較年輕化，不會太老氣，所以紅黃色搭配好也是個技術活啊~
雖然左右兩個頁面色彩比例大不一樣，但都是可愛手繪趣味路線的，只是黃色或暖色的面積越大，畫面就越活潑越有親和力~
下面2個頁面的色彩搭配和質感紋理都帶有一點復古的味道，不過右邊色彩純度更高，更顯少女一些，符合產品類別需要~
左邊頁面玫紅／黃橙／天藍色的豐富色彩搭配配合趣味手繪，整體好玩有活力，適合孩童相關產品的活動頁面設計，右邊扁平簡潔，配色干凈，非常日系。
左邊也是兒童相關物品的活動頁設計，色彩比較豐富，黃色在這里顯得非常亮眼，提升了整體的活躍氛圍，右邊的色彩搭配和風格形式走的是復古路線，體現年代感，不過這里的色彩和質感不如前面幾個頁面的復古味逼真~
左邊的簡潔時尚頁面，黃色只是做點綴色氛圍需要出現一下～右邊香檳金搭配暗紅色背景雖然很搶眼，但是卻不突兀~大概是因為絲帶這類物品本來裝飾性就很強~
發現紅黃藍是最常出現的顏色搭配，只是簡單改一下明度或純度就可以打造不同的感覺了，如左邊專題所示，右邊米黃色大背景和整體低純度低飽和度的配色則顯得有年代感，充滿回憶~
金色常與盛典聯系起來，如左圖所示，右圖我好像放重復了，哈哈哈先這樣吧
左圖又是明亮的黃藍搭配，一看就是與兒童相關的活動頁面設計，右圖黃白黑搭配色彩非常簡潔，但是搭配小巧玲瓏的手繪，卻顯得畫面非常生動不單調，有一種萌萌噠的感覺~
黃黑搭配，高冷又不單調，頁面風格比較男性化～
好了，我先整理這么多吧，你們可以根據自己的理解需要來學習別人的長處。
四、黃色的使用禁忌或注意事項有哪些？
1、黃色跟紅色一樣，作為暖色運用在頁面里的時候，畫面里切勿全都是暖色系搭配，適當加入一些冷色點綴或無彩色（黑白灰）調和可以緩解視覺疲勞；
藍色系＋金色＋黑白灰的組合也非常漂亮~
2、無論何種顏色，它在整個畫面里的占比都是根據設計需要而決定的，而不是瞎搞，比如，無論你是要弱化某一個信息還是突出某一個信息，都可以根據選擇顏色和控制它的比例大小來實現，講直白點就是要懂得運用對比和烘托的手法；
對比：
烘托氛圍：
對比和烘托：
3、在黃色背景上做陰影圖層時，切勿直接用無彩色灰色或黑色進行正片疊底混合模式（如圖1），這樣做出來的陰影看起來會很臟，而應該用添加了灰色或黑色的黃色進行正片疊底混合模式（如圖2），這樣做出來的陰影干凈又通透：
（圖1）
（圖2）
不信大家可以對比看下陰影1VS陰影2的效果，你們自己也可以試試，很多人平時做的圖看起來很臟，往往就是這些細節原因導致的。
4、不要在淺色背景上用高明度或高純度的檸檬黃做重點文字信息的顏色（如果是裝飾或點綴用就無所謂了），因為根本就看不清（如下圖所示），我前幾天還看到有一個比較知名的平臺的某個界面設計里居然就犯了這種錯誤，著實不應該啊。
5、如果面對的客戶是思想比較傳統保守或信風水的老版，則切勿使用黃色作為主色，一方面顯得太過張揚不嚴肅，另一方面寓意不太吉利，因為我們日常中常有“這事兒可別黃了”這么個說話，比如你看哪個國企單位或者政府機構的網站設計用黃色了？最多也就用金色或偏點紅的暗色系。
說到這個，我想起剛畢業那會兒，給朋友的朋友做了一個汽車logo，當時我根據自己的想法做出來后，個人還比較滿意，特地用rhino渲染出來的，一款比較man比較硬朗的汽車logo，但是客戶看了之后回復說，這logo看起來像一個“X”，叉叉這個形狀感覺不吉利。。。然后就沒有然后了，可是你看馬斯克的space－X不是很酷嘛？所以適不適合還是要因人而異了（當然，最后他也沒給我支付一分錢報酬，過去的坑誰還沒踩過幾個呢）。
今天就分享到這里吧，這里是《做設計的面條》，一個懂生活的電商號，我們下期再見！~
做設計的面條 微信號：TTTink-D
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
本文禁止轉載，侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
評論
評論
推薦評論
全部評論（3條）