當(dāng)我們評價一款app時，配色應(yīng)該是僅次于其功能性的另一主要因素』谡現(xiàn)如今人機交互主要通過GUI來實現(xiàn)景用，色彩在交互過程中扮演著重要的角色。良好的色彩搭配會幫助用戶發(fā)現(xiàn)頁面中的重點脂新，找到他們急于尋找的元素，更好的了解app的操作流程粗梭。每款app都會有一套其獨有的配色方案争便。建立一套app的配色方案是件很困難的事情，因為理論上說你有無數(shù)種的組合方式断医。App中的色彩應(yīng)用究竟有哪些重點呢滞乙？配色方案的建立又有著哪些套路呢？
色彩的數(shù)目
在app的界面中鉴嗤，盡量不要使用過多的顏色斩启。誠然，過少的顏色搭配很難第一眼就能吸引住用戶醉锅。但是你的app畢竟不是一錘子買賣兔簇，把用戶吸引來就完事了。特別現(xiàn)在很多app都是偏工具類的，用戶會經(jīng)常使用app男韧，那么頁面中過多的顏色會讓用戶抓不到重點朴摊，影響用戶體驗。
多倫多大學(xué)曾經(jīng)做過一項調(diào)查此虑，發(fā)現(xiàn)大部分用戶都傾向于一個app頁面中只有2—3款顏色甚纲。
配色原則
好吧，我們已經(jīng)知道了用戶只喜歡2到3款顏色朦前。那么我們怎么才能正確的挑出那2到3款顏色呢介杆？色輪可以幫助我們。
十二輻色輪對于我們建立一款app配色方案來說是一個重要的工具韭寸，特別是對于菜鳥級別設(shè)計師來說春哨。
單色搭配（ Monochromatic ）
單色搭配就是單一色系的搭配，在顏色的深淺恩伺、明暗或飽和程度上有所調(diào)整來形成明暗的層次關(guān)系赴背。
單色搭配在app UI設(shè)計中一直都是一個不錯的選擇，特別是藍(lán)色系和綠色系晶渠。
類比色搭配（ Analogous ）
類比色搭配是指選用一款顏色作為主色調(diào)凰荚，色輪中臨近的顏色作為輔色。因為在色輪中相互靠的很久褒脯，所以搭配起來不會有很突兀的感覺便瑟。
這種配色方案看起來很容易操作，但是實際上主色與輔色的挑選卻是很傷腦筋的番川。主色和輔色在色輪中的距離如果過遠(yuǎn)到涂，那么整個頁面就會顯得用力過猛。當(dāng)然挑選的好則另當(dāng)別論颁督。
Clear是一款管理行程的app践啄，在這里設(shè)計師通過從橘黃色到紅色的一個漸變來給用戶提供不同任務(wù)優(yōu)先級順序的視覺提示。
Clam是一款音樂播放軟件适篙。該軟件專門播放一些讓人放松的音樂能讓你平靜往核，冥想箫爷、睡眠嚷节、放松、改善情緒虎锚！當(dāng)你失眠時靜靜Calm能幫你很快的進(jìn)入夢鄉(xiāng)硫痰。設(shè)計師主要采用了藍(lán)色和綠色來幫助用戶放松身心。
補色搭配（ Complement ）
在色輪上直線相對的兩種顏色稱為互補色窜护⌒О撸互補色因為互相處于對方的對立面，所以搭配起來會形成強烈的對比效果柱徙，進(jìn)而吸引用戶的注意力缓屠。
比如奇昙，當(dāng)我們的眼睛看到一大塊綠色區(qū)域時，一小塊紅色就會顯得特別突出敌完。
自定義配色方案（Custom Color Scheme）
創(chuàng)建一套新的配色方案并不是想象之中那么難的储耐。最簡單的方法就是挑選一款明亮歡快的顏色(比如企業(yè)色)作為主色，然后挑選幾款中性色作為輔色滨溉。這樣一套配色方案就完成了什湘，而且效果也相當(dāng)不錯。
藍(lán)色晦攒、白色闽撤、深灰、淺灰和黑色就是Dropbox頁面里出現(xiàn)的所有顏色脯颜。就是這么簡單
配色神器——Adobe Color CC
Adobe Color CC是由Adobe公司開發(fā)的是一款動態(tài)的配色識別工具哟旗，通過攝像頭的實時拍攝，它會自動識別出當(dāng)前圖像中幾個主要的配色組合栋操。如果不想讓應(yīng)用隨機挑選热幔，便可以點擊屏幕鎖定，然后手動調(diào)節(jié)讼庇。
你也可以自己創(chuàng)建新的配色組合保存到library中绎巨。此外Adobe Color CC還提供了很多現(xiàn)成的配色方案。
對比度的應(yīng)用
通常蠕啄，頁面的元素都不是單獨出現(xiàn)的场勤。比如你不可能看到一個頁面中只有一個按鈕，沒有任何文字歼跟，圖標(biāo)和媳。頁面面中的任何一個元素都是整個系統(tǒng)的一個部分，不同的元素共同構(gòu)成了一個頁面哈街。頁面中的元素有優(yōu)先級之分留瞳，有的元素更加重要，我們希望用戶看到或者誘導(dǎo)用戶進(jìn)行操作骚秦。我們可以通過形狀她倘，顏色來產(chǎn)生視覺上的一個對比。我們這里主要討論顏色使用帶來的對比作箍。
設(shè)計師更傾向于采用低對比度的配色方案硬梁。因為高對比度的配色可能因為過于顯眼而破壞整個頁面的風(fēng)格。低對比度意味著低風(fēng)險胞得，低對比度配色會使頁面更加的好看與和諧荧止。但是好看與和諧并不意味著高可讀性。最典型的例子就是當(dāng)文本和背景色對比度較低的時候，文本就會很難閱讀跃巡。
特別是在手機端危号，用戶會經(jīng)常處于戶外或者光線較為充足的地方，這時用戶會因為炫光根本看不到屏幕內(nèi)容素邪。
為了確保界面對比度處于一個合理的范圍內(nèi)葱色，我們引入一個新的概念—對比率(Contrast ratios)。對比率指的是一幅圖像中明暗區(qū)域最亮的白和最暗的黑之間不同亮度層級的測量娘香，差異范圍越大代表對比越大苍狰，差異范圍越小代表對比越小。
一般來說較大文本(14pt 粗體／18pt 正常 以上)與背景的對比率最少要達(dá)到4.5:1烘绽。較小文本與背景的對比率要達(dá)到3:1以上淋昭。
至于對比率的計算，我有一個非常簡單的方法安接。只要進(jìn)入WebAIM’s Color Contrast Checker翔忽，輸入色值就可以計算對比率。
不只是文本盏檐，圖標(biāo)和其他一些重要的元素在配色的時候同樣可以采用上面的對比率作為參考歇式。
視力障礙用戶群體
當(dāng)你在設(shè)計一款app的時候，你有沒有考慮到視力障礙的用戶群體呢胡野？
當(dāng)我們談到色盲的時候材失，通常會想到紅綠色盲。其實色盲是指不能分辨自然光譜中的各種顏色或者某種顏色硫豆，紅綠色盲是最常見的一種龙巨。據(jù)統(tǒng)計，全世界范圍內(nèi)熊响，8%的男性和0.5%的女性都患有不同程度的色盲旨别。
因為色盲對顏色的感知具有不確定性，有紅綠色盲汗茄，藍(lán)黃色盲更有單色色盲秸弛。這意味在設(shè)計中，我們無法完全規(guī)避色盲用戶洪碳。所以為了更多的考慮色盲用戶群體递览，我們在設(shè)計中應(yīng)該降低顏色的依賴。我們可以使用圖案偶宫，文字非迹，形狀這些元素來構(gòu)建頁面。
Photoshop可以通過模擬色盲來幫助設(shè)計師看到在色盲用戶的眼中你的界面是什么樣子的纯趋。
總結(jié)
提升自己色彩的使用技巧是一個需要不斷努力和積累的過程。你需要了解基礎(chǔ)的色彩理論，更需要大量的實踐吵冒，創(chuàng)新與用戶測試纯命。
