UI界面設(shè)計中的6條配色規(guī)則，幫您更好駕馭色彩

UI界面中的配色方案是我們作為設(shè)計師最關(guān)鍵的能力之一，每個人對顏色的感知不同，但是掌握大多數(shù)人的色彩感知或者基于人類瞳孔對于大自然色彩的認(rèn)知，我們可以創(chuàng)造出符合品牌調(diào)性和非常漂亮的配色方案。

先來看看是哪6條配色規(guī)則：
1、選擇更和諧、易接受、有規(guī)律的顏色。
2、將調(diào)色板限制為三種顏色。
3、遵循您品牌的顏色指南。
4、使用 60–30–10 配色規(guī)則。
5、應(yīng)用中迭代你的顏色。
6、在UI界面中保持色系一致性。

1、選擇更和諧、易接受、有規(guī)律的顏色。


您可以將顏色和諧視為構(gòu)建塊或調(diào)色板的基礎(chǔ)模板。一些常見的顏色和諧是：
相鄰色：在色輪上彼此相鄰的顏色（這種顏色和諧會產(chǎn)生低顏色對比度。
互補(bǔ)色：色輪上相反的顏色，產(chǎn)生高色彩對比度。
分裂互補(bǔ)色：一種顏色從其互補(bǔ)色的任一側(cè)與其他顏色相結(jié)合。
三色：色輪上三種等距的顏色（相隔 120 度）。
單色：單一色調(diào)的色調(diào)和陰影。

2、將調(diào)色板限制為三種顏色。
減少顏色數(shù)量，增強(qiáng)了色彩的視覺層次和對比度，以此讓您的用戶不會通過色彩而分散注意力。

3、遵循您品牌的顏色指南。
遵循您品牌的顏色指南。創(chuàng)建調(diào)色板時，請始終遵循既定的顏色準(zhǔn)則。您的工作不僅會更輕松，因為您會考慮更少的顏色替代品，而且還會創(chuàng)造強(qiáng)大、一致的品牌體驗。我如果您沒有品牌顏色指南，請查看現(xiàn)有設(shè)計和產(chǎn)品中使用的顏色，并嘗試將它們合并到您的調(diào)色板中。

4、使用 60–30–10 配色規(guī)則。
此規(guī)則意味著顏色應(yīng)以 60%、30% 和 10% 使用。所以換句話說，使用 60% 的主色，30% 的輔助色和 10% 的強(qiáng)調(diào)色。我喜歡將 60% 的顏色視為基色，它占據(jù)了您設(shè)計中的大部分空間。將其視為背景顏色。您的 30% 顏色是第二層，例如導(dǎo)航或輔助設(shè)計元素。而這 10% 就像在你的設(shè)計中脫穎而出的小珠寶，就像一個主要的行動號召。

5、應(yīng)用中迭代你的顏色。
一旦你使用了 60-30-10 規(guī)則，你需要退后一步，看看什么有效，什么無效，然后調(diào)整你的顏色。問問自己這樣的問題，你的顏色選擇是否有助于創(chuàng)建正確的視覺層次？ 那么，換句話說，你的眼睛是否被那些你想要強(qiáng)調(diào)的設(shè)計元素所吸引？您的顏色選擇是否在您的設(shè)計中創(chuàng)造了平衡和對比？

6、在UI界面中保持色系一致性。
如果您在一個屏幕上使用亮粉色作為號召性用語，那么在任何地方都應(yīng)該使用相同的顏色來號召性用語，除非您有非常好的理由偏離該顏色。一致性是幫助用戶理解顏色使用的關(guān)鍵。

最后，配色規(guī)則非常重要，這是前人從無數(shù)次設(shè)計中總結(jié)出來的經(jīng)驗，我們要重點(diǎn)參考，合理使用，在此基礎(chǔ)結(jié)合不同項目的屬性和特殊可以做新的嘗試和探索。