網站顏色搭配

【網頁配色小學堂】選對顏色原來這麼重要!

 談到配色就得說到色彩學,色彩學是設計師最重要的基本知識!小天忽然想起背色彩學辛酸的日子...除了需要對顏色認識,對於心理學也需要略懂一二...色彩學與心理學兩個領域可是有說不清的關係呢!

 色彩設計的運用會帶給使用者觀感的影響,例如橙色給人溫暖感、藍色使人覺得理性...等。色彩學的細節真的非常多,三天三夜都說不完...所以此篇的重點著重在天矽網頁設計團隊如何進行網頁配色喔~

 

我們先談談配色的基本方向...

色彩搭配的方式有成千上萬種,小天就以最常用的配色方向與大家做分享~

網頁配色

  1. 單色配色:
    僅使用一種單色,做明度和彩度的變化,整體視覺較有一致性。
     
  2. 相似色搭配:
    選一主色,搭配該色在色環上相鄰的三種顏色,視覺上比單色配色更有豐富和層次的感覺。
     
  3. 互補色搭配:
    選一主色,搭配該配色180度的色向,視覺上會較活潑和強烈感。
     
  4. 三角色搭配:
    選好一種顏色之後,搭配該色在色環上呈現正三角形端點的顏色,可以讓視覺有豐富的感覺。
     

 

色彩計畫執行步驟...

➤ 步驟一、使用客戶的企業色當主色:
 執行一個專案時,通常會先拿到客戶的LOGO,而為了快速掌握設計整體方向,通常會採用企業色當作主色。另外,根據調查發現,前100大的品牌中,他們的品牌顏色前四大代表色依序是:藍、黑、紅、黃橘色、綠色和紫色被使用的比率則相對少了許多。

 

這個調查非常受用,真的非常多間公司是使用這四大色當作標準色~

 

➤ 步驟二、選擇網站的輔助色(大約1~2種):
 輔助色的規劃,有幾個方向可以發想...

  1. 客戶的產業別
  2. 客戶主攻的族群年齡和性別
  3. 客戶自主提出的需求

 

➤ 步驟三、細調選擇的顏色組合:

 影響配色除了色相還有其他兩個要素,明度和彩度。這可是色彩三要素呢!

 了解這三個元素,就可以變化出千千萬萬種色彩搭配!例如,選擇了藍色和黃色,但透過不一樣的明度(可能加多一點白)、彩度(調整鮮豔度等),變化出不一樣的氛圍。

網頁配色

案例:司迪康

 

 大約會有這三大方向,其中產業別是最好且最直覺性的選擇方向,例如旅遊產業可以選擇與企業色對比的顏色(對比配色法),展現活潑吸睛的形象風格。

 

小天想說的話:

 天矽網頁設計團隊大致上會以這樣的流程設定整體色彩,其中的細節只能意會不能言傳了。天矽裡的每個設計師想破頭腦就是為了忠實呈現出客戶的需求,製作出合乎客戶的產品和公司理念等。配色真的很難,不是版型隨便放一放就會出現想法的~

 

share FB LINE
看天矽作品集 回上一頁
ID:@323foylw