三、選擇正確的色系
      明確配色目標，確定主色以及色彩層級后，如何進行下一步的配色？
      這時候我們可以根據不同的配色目標來選擇合適的色系，豐富整個畫面的配色。需要注意的是，在豐富配色的同時，仍然要嚴格控制色彩層級，以保證整體色彩層級的精簡。
      1.巧用同色系，統一不單調
      同色系是指在色環上相距不超過45°的兩種顏色，我們可以選擇主色的同色系范圍內的顏色來豐富整體配色。那么如何選擇同色系的顏色呢？
      首先在色環中確定顏色的位置，通過色環兩邊45°延展出我們所需要的同色系。

      在主色的同色系范圍內，我們可以選出同色系顏色作為延展色，單獨使用或者組合成漸變色進行使用。

      下面的案例頁面就是運用同色系原理來進行配色的。可以看到，整個頁面在保持色彩的統一的前提下，增強了畫面的層次和豐富性，從而提升了整個頁面的層次感和品質感。

      同色系的配色特點是整體頁面統一而富有層次，從而傳遞出一種穩定、專業的形象，適合絕大多數的場景使用，是最為簡單和有效的配色方式。
      我們可以總結一下同色系的配色方法。首先確定主色，主色兩邊45°以內的同色系色彩范圍，在范圍中選取合適的單色作為輔助色，或者選取一段漸變色單獨使用。
      2. 不同場景的對比色用法
      對比色是指在色環上相距120°-180°之間的兩種顏色（180°時則互為互補色）。處于對比色關系的兩種顏色，通常色相差異較大，能夠相互產生強烈的對比效果，我們可以利用這種原理來增強畫面的吸引力。
      在不同的場景中，對比色同樣有著不一樣的使用方式。在產品設計中，通過小面的顏色對比，可以加強主色的活力與整體豐富性；而在推廣設計中，通常會使用大面的的對比色在增強頁面的吸引力。
      （1）產品界面中的對比色應用
      產品界面的配色對于產品來說至關重要，好的配色不僅能夠準確地反映產品的調性，還能正確地引導用戶閱讀并理解產品。
      我們可以結合網易七魚的官網改版案例，來了解如何通過配色來提升官網的設計品質。
      下圖是七魚的舊版官網頁面人民日報評論權健陷風波：別拿生命開玩笑，在配色上，產品方認為原來的配色過于單調和沉悶，希望可以讓整體更活潑一些。且網站的整體跳出率過高，希望我們能夠找到原因并通過改版解決這個問題。

      首先第一步，需要找出舊版官網存在的問題。這時候，我們就需要再次運用前面所講的目標分析法。通過不同維度的目標分析，尋找頁面中存在的問題。
      我們還是通過三個維度去分析問題：
      信息傳遞維度：整體的配色過于單調，使頁面和信息缺少吸引力，導致用戶不想閱讀；其次插圖和ICON在配色和表現形式上都過于單調，表現力弱。
      引導操作維度：核心功能模塊邏輯展示混亂且繁雜，導致用戶無法正確理解內容。
      品牌價值維度：品牌主色沉悶，整體品牌的品質感弱；而且漸變色與品牌色差異過大，不夠統一。
      如何解決以上問題？從何處下手？
      由于七魚首頁的修改涉及到整體官網的配色修改，單純從每個頁面入手并不能從根本解決問題，容易造成整體官網配色不統一的情況。這個時候，我們就要從品牌配色入手，通過修改配色并制定新的設計規范，在整體上解決問題。
      首先從品牌主色入手。經過嚴格的討論，我們重新制定了七魚的品牌主色。為了解決顏色沉悶的問題，我們選擇了接近原有主色，但更鮮亮且富有活力的藍色色作為主色。而輔助色上，為了讓七魚品牌更有溫度，我們選擇主色的對比色——橙色。
      藍色與橙色在小面積上的互相對比上海緣震網絡科技，可以互相襯托，讓兩種顏色更顯活力。

      我們以新的配色規范為基礎，重新制定了全新的七魚設計規范。規范中包含了配色的使用比例、不同的icon樣式與配色的結合方式等一系列的頁面細節，以保證規范可以完整、統一地落實到每個頁面和元素中。

      運用新的配色規范進行頁面設計時，要靈活地將配色與產品內容相結合，讓配色更好的融于頁面中，而不是生搬硬套地將配色裝到頁面里（很多初級設計師在執行規范時會出現類似問題）。
      比如我們在優化首頁的主要功能模塊時，首先做的便是重新梳理產品功能的展示構架，然后再結合新的設計形式和配色規范蘋果增長軌道，讓新的規范發揮最大的作用。

      在不同頁面的功能icon上，我們豐富了icon的表現形式，同時將新的對比色配色加入到每個icon元素中，增強了icon的活力和吸引力，讓每個icon看起來更精致。
      而在功能插圖中上，我們采用了與icon統一的配色和表現形式，讓頁面中的所有元素具有統一的品牌感。
      最終，我們將新的配色規范逐步落實到網易七魚所有的Web端和Mob端頁面中，使七魚的整體官網設計煥然一新。在新的官網頁面中，不僅提升了整體的設計品質，同時也解決了前面分析的問題，整體提升了15%的客戶留存率。
      通過這個案例我們可以發現，整體配色的改變，可以極大的提升官網對于用戶的第一印象。用戶往往在進來的一瞬間就決定了對官網的印象，并最終影響用戶是否進一步閱讀，而配色則是其中非常重要的一部分，正確的配色能夠讓用戶更愿意停留并閱讀內容。
      （2）推廣活動頁面中的對比色應用
      在推廣頁面的設計中，通常需要用營造強烈的視覺沖擊，以達到快速吸引用戶并傳遞信息的目標。這就需要大面積的對比色，來達到強烈的對比效果。而在較大面積使用對比色時，整體色彩的主次和整體平衡至關重要。
      我們可以來看一個案例：
      可以看到，整個頁面主由橙色和深藍紫色兩個主要對比色構成。大面積的對比色產生了強烈的視覺沖擊，讓整個頁面充滿了吸引力。整個畫面用最強烈的對比色重點突出了兩個主要的人物角色，從而吸引用戶注意并進行閱讀，最終將用戶引導至購買入口。至此，整個頁面的任務也算是完成了。
      在推廣頁面中，我們需要注意的是，重點信息并非只能是文字內容，也可以是最吸引用戶的畫面核心元素。
      3. 嘗試更多的創新配色
      除了掌握以上的幾種基本色系的配色方法外，大家可以在此基礎上嘗試更多的配色風格。比如在同色系、對比色系的基礎上，有目的地加入色彩元素豐富色調，在保持整體色彩層級的同時，加入更豐富的變化，從而達到配色目標。

更豐富的“同色系”配色

更多彩的“對比色”配色

復古的平面風配色

      而對于很多初學者來說，我建議大家能夠首先明確配色的目標，在配色時保持色彩層級的精簡明確。在此基礎上，循序漸進，逐步去嘗試更多地配色風格。只有這樣，才能養成良好的配色習慣。
（鄭重聲明：本文版權歸原作者徐劍杰所有，轉載文章僅為傳播更多信息之目的，如有侵權，請聯系我們刪除；如作者信息標記有誤，請聯系我們修改。）
，