「黑色」在電商設計中的運用

「黑色」在熱鬧促銷型電商設計中可能是最忌諱的顏色，那麼黑色應該如何運用才能是正確而又實在呢？請看看今天分享的文章，本文你能獲得答案。

圖：設計達人網

為了讓大家更好理解，可以先看看文章提綱：

• 黑色的釋義。
• 黑色佔比多少與活動定位之間的關係。
• 黑色頁面的常用色彩搭配技巧
• 與黑色有關的節日有哪些？

接下來我們一條一條來看吧，let』s go！～1/黑色的釋義先來自百度百科的解釋：黑色可以定義為沒有任何可見光進入視覺範圍，和白色正相反，白色是所有可見光光譜內的光都同時進入視覺範圍內。顏料如果吸收光譜內的所有可見光，不反射任何顏色的光，人眼的感覺就是黑色的。如果將三原色的顏料以恰當的比例混合，使其反射的色光降到最低，人眼也會感覺為黑色。所以黑色既可以是缺少光造成的（漆黑的夜晚），也可以是所有的色光被吸收造成的（黑色的瞳孔）。 而我自己的理解是：黑色它不僅是一種百搭色，它很特殊的一點就在於，你會發現幾乎所有的書本報紙雜誌正文部分以及你平時的書寫基本都是黑色的而不是其他顏色，的水墨畫毛筆字也基本都是黑色的，所以黑色會給人一種有文化底蘊的感覺； 同時它在氣質上他還給人一種堅硬／神秘／端莊／靜寂的感覺，但在文一些化習俗上黑色配色又常常意味著不吉利，在功能上比如在服裝設計里黑色又往往能起到一種視覺上顯瘦的效果。 我將以上這些都統稱為黑色的屬性。（左圖顯端莊優雅又顯瘦，右圖水墨畫顯文化古韻）2/黑色佔比多少與活動定位之間的關係。只要一提到電商頁面設計，我相信大多數人在腦海里的閃現的應該是彩色的頁面而不是黑色的，除非品類需要或產品本身就是黑色，大部分老闆也不會同意你把一個電商頁面設計成黑色（一些開明的老闆除外），但黑色真的這麼招人忌諱嗎？黑色就真的不太適合應用於電商設計里嗎？其實主要是你沒有弄懂黑色佔比與活動定位之間的關係罷了。 我們用2張海灘照片做舉例:（左邊是炎炎烈日的大白天／右邊是夜深人靜的夜晚：） 大家看完后是什麼感覺呢？左邊的沙灘是不是感覺很熱辣陽光看著就很熱？而右邊的黑夜感覺很寧靜神秘遙不可及？ 我們都知道晴朗的白天和靜謐的夜晚是對立的，彩色跟黑色是對立的，他們給人傳遞的感受也是對立的，類比下來，就好比下面這2種頁面，他們所傳遞的定位也是截然對立的：前者活潑熱鬧促銷，後者冷酷高端。這種定位規律在一些產品包裝上也適用，比如下圖：（左邊是幾百元的相宜本草套裝，右邊是上萬一套的日本頂級護膚品牌POLA套裝） 再取幾個折中的案例，多彩色VS黑色與多彩顏色相結合的時候：（雖然同樣很時尚，但是左圖更年輕清爽活力，右圖因為加入了黑色的緣故顯得更炫酷大牌）（雖然同樣很時尚，但是左圖更年輕清爽活力，右圖因為加入了黑色的緣故顯得更加嫵媚大牌） 所以我們不妨可以這麼理解：一個頁面活潑與否，定位如何，其實關鍵就在於黑色或暗色在這個頁面里的佔比有多少。 黑色佔比越多，那麼這個頁面的黑色屬性也就越多，所以會體現出諸如神秘／剛強／高端／高冷甚至是恐怖等氣質，讓人產生距離感，常用於一些想要體現高端產品定位印象的頁面或產品設計里，任何類目都適用：而彩色佔比越多，整個畫面就越活潑熱鬧沸騰，彷彿是有什麼活動表演或者派對，給人一種有親和力人人都買得起的感覺，常用於一些要體現活潑年輕定位的產品或頁面設計里，同樣適用於任何類目：而白色佔比越多，整個頁面就越乾淨／聖神／明亮，給人的感覺就會越空曠／寧靜／透氣（下圖案例有點長，請耐心往下滑。。）： 但為了方便大家理解，所以實際上以上我舉的例子都是比較極端的，畢竟非常高端的產品是少數，大多數以及大眾目前能接受的都是下面這些色彩佔比不那麼極端的，適用於大眾的的：同時我們也要注意到一點，一個頁面會體現出何種定位調性，除了色彩佔比有很大的影響外，元素的形狀／密度／紋理／創意風格等也會產生一些影響。 比如這三個頁面，同樣是黃黑搭配，但因為色彩佔比不同／形式不同／風格不同，他們的調性明顯是不一樣的：左一簡約時尚，左二搞怪活力，左三酷炫大牌。3/黑色電商頁面的常用色彩搭配技巧前面我們已經說了，雖然元素的形狀／密度／紋理／創意風格等會對活動定位產生影響，但是決定頁面是熱鬧促銷還是高冷大牌起決定作用的其實還是黑色或暗色的佔比是多少：暗色或黑色越多頁面月冷酷高端，彩色越多頁面就越熱鬧促銷，而白色的佔比多少則決定了你的頁面透氣程度，頁面里白色越多越明亮，人就會感覺越空曠透氣。 再一個既然是電商頁面，它存在的主要目的就是賣貨和展示商品用的，而這個貨是要賣給不同的人群的，所以我們針對不同的人群要給他們傳遞的感受就會不一樣，或熱血沸騰，或性冷淡，或舒心，或故意讓你難受，但不管怎麼樣，最終出來的頁面情緒肯定是要傳遞到位的，那麼一般就有下面幾個規則可以注意下：（1）黑色常作為主色或背景色一些想走高端時尚路線以及科技大牌的頁面往往比較喜歡用大面積的黑色來塑造一種距離感，也就是很多人嘴裡說的「有逼格」，但這裡要注意的就是，這種頁面往往就會對產品的品質或光影細節有非常高的要求，因為對比太強烈的緣故，視覺太聚焦了，就像全世界的眼睛都在暗中盯著你看，你稍微有一點瑕疵都會暴露無遺；（2）黑色常跟這些顏色走在一起而黑色作為一種百搭色，在電商設計里最常搭配的除了白色／金色／大紅色以外，還有各種熒光色，比如亮黃／亮綠／亮粉／騷紫以及五顏六色，這些顏色跟黑色搭配會形成強烈的色彩對比效果，從而突出想要表達的信息。 舉例：黑白配（來自站酷推薦設計師：清穗） 舉例：黑金搭配舉例：紅黑配舉例：黃黑配舉例：黑色可以包容任意的亮色（3）有黑色的地方就該有亮色一張有感染力的照片往往少不了光的運用，而有光的地方就會有陰影，一張打動人心的頁面設計也有一樣的規律在那裡：頁面里有暗就會有明，這樣子才不會顯得過於壓抑，畫面才更佳耐看。 舉例：幾乎所有的美國大片或者科技大片的海報都喜歡用這個套路 還有一些打鬥類的遊戲頁面尤其喜歡用黑色或暗色系頁面，有一些數碼科技類產品的電商頁面也可以試試，總之要想體現出很man的感覺，黑色或暗色是必不可少的4/與黑色有關的節日或事件有哪些？提到電商設計，當然就少不了各種電商節，其他的電商節我就不說啦，那麼與「黑色」有關的能作為噱頭活動去玩的節日或事件有哪些呢？ 目前我所知道的，比如著名的黑色星期五／萬聖節／4月14日黑色情人節／暗黑電商等。 黑色星期五，關鍵詞：國際大牌／促銷／折扣／黑色等。它是從美國漂洋過海來到的一種電商促銷活動，幾乎每個大一點的電商平台都會摻合一腳，尤其是跨進電商尤為重視（具體黑色星期五是啥大家自己去百度吧）：還有很多活動頁大家也可以去看看：萬聖節，關鍵詞：南瓜／糖果／黑橙搭配／蝙蝠／幽靈／骷髏頭等。它也是很多人喜愛的一種節日，商家們運營們當然也不會錯過咯～4月14日黑色情人節，關鍵詞：男生／單身狗／促銷／情人節等。發現一年貌似各種顏色的情人節一大推，無非就是找噱頭做活動讓你們買買買咯（我猜商家運營們的邏輯大概就是，反正你是單身狗你的錢也沒處花，不如花在我這裡買點安慰好了，哈哈哈～～）。暗黑電商，其實就是指網路上的一些很隱秘的非法地下交易市場，我以前好像專門挖過這個，但是我這次就不細說了。。。被和諧了不就完蛋了 寫在最後當別人提到「黑色」的時候，你會想到什麼呢？也許你會想到黑夜／黑頭髮／烏鴉／神秘／陰深／距離／嚴肅／沉寂等等，總之他跟陽光／活力這些比較明朗的字眼時幾乎掛不上鉤的，這也就解釋了為什麼我們極少看到設計師在喜慶節日／雙十一／618等頁面設計里幾乎看不到黑色的運用的原因。 但隨著我們的購物選擇越來越多樣化以及人們越來越有自己的主見了的緣故，我們開始想要尋求自己的個性和高要求，我們也越來越厭倦了千篇一律，這也直接導致商家們之間的競爭開始變得越來越激烈了，也許以前你隨便推出什麼產品，即便是頁面設計做的很醜都可以賣的很好，但現在卻可能無人問津，所以商家以及設計師們都迫切的需要找到新的突破點來滿足和挖掘不同客戶的喜好，而對黑色的合理運用其實就是突破方式之一。 這讓我想起了電影《香奈兒》的一個情節，在那個所有人都追求蕾絲／花里胡哨／雍容複雜的服裝設計的年代，可可香奈爾卻偏要穿簡潔裁剪的男裝黑色禮服等等帶給人一次又一次驚喜，而她在悲痛欲絕的情況下為紀念他的情人鮑勃而設計的一條小黑裙子也成了香奈爾史上最大的成功。 有了這個文章，希望你對黑色有更好的理解，日後使用黑色方案時，可以參照本文的思路來進行配色。