之前25學(xué)堂跟大家講過了很多關(guān)于移動(dòng)app界面設(shè)計(jì)規(guī)范的文檔和信息圖。

比如：2015最新移動(dòng)App設(shè)計(jì)尺寸視覺規(guī)范【圖文版】、移動(dòng)APP界面設(shè)計(jì)分享：文字閱讀體驗(yàn)設(shè)計(jì)篇和iphone6/6+的適配原理和適配心得分享相關(guān)APP設(shè)計(jì)規(guī)范精華文章。

今天25學(xué)堂跟大家聊聊手機(jī)APP界面設(shè)計(jì)規(guī)范之標(biāo)準(zhǔn)色彩規(guī)范。如何教大家使用色彩這個(gè)很神圣的工具。

我們先來回顧下。什么是手機(jī)APP界面設(shè)計(jì)規(guī)范？

APP設(shè)計(jì)規(guī)范指對(duì)APP界面進(jìn)行風(fēng)格統(tǒng)一，對(duì)界面元素的樣式、顏色和大小設(shè)定統(tǒng)一的規(guī)范和使用原則。與設(shè)計(jì)、前端約定好統(tǒng)一的設(shè)計(jì)規(guī)范很重要，約定設(shè)計(jì)規(guī)范可以減少產(chǎn)品、設(shè)計(jì)、前端的溝通成本；可以使界面設(shè)計(jì)整潔、統(tǒng)一，減少界面元素的重復(fù)設(shè)計(jì)；可以減少設(shè)計(jì)素材，控制安裝包的大小。

這一節(jié)主要講解：APP設(shè)計(jì)的用色規(guī)范。我們先看下色輪圖。

然后我們?cè)賮砭唧w的看下APP設(shè)計(jì)的色彩規(guī)范實(shí)例。

這是一個(gè)非常詳細(xì)的手機(jī)APP色彩使用規(guī)范實(shí)例。值得大家好好的看看?！墩臆嘇PP》

標(biāo)準(zhǔn)色規(guī)范： ? ?

X軸：重要、一般、弱。

?Y軸：色彩代碼 、色塊、使用場(chǎng)景

標(biāo)準(zhǔn)色重要：重要顏色中一般不超過3種，這里的例子重要顏色之一紅色需要小面積使用,用于特別需要強(qiáng)調(diào)和突出的文字、按鈕和icon；而黑色用于重要級(jí)文字信息比如標(biāo)題、正文等。

標(biāo)準(zhǔn)色一般：都是相近的顏色，而且要比重要顏色弱，普遍用于普通級(jí)信息、引導(dǎo)詞比如提示性文案或者次要的文字信息。

標(biāo)準(zhǔn)色較弱：普遍用于背景色和不需要顯眼的邊角信息。

再次舉例說明如何來定制屬于自己手機(jī)APP的色彩規(guī)范。這是一種表示方式。 有這個(gè)規(guī)范，我們?cè)O(shè)計(jì)APP和重構(gòu)APP會(huì)清晰明了很多。

這是25學(xué)堂的老譚同學(xué)給大家精心整理的2種APP標(biāo)準(zhǔn)色的表現(xiàn)形式。

APP界面要給人簡潔整齊，條理清晰感，依靠的就是界面元素的排版和間距設(shè)計(jì)，還有色彩的合理、舒適度搭配。15個(gè)讓人舒服的色彩搭配和色彩提取方案|設(shè)計(jì)配色教程

其他的色彩運(yùn)用原理以及需要遵循對(duì)比原則：

1：統(tǒng)一色調(diào)，針對(duì)軟件類型以及用戶工作環(huán)境選擇恰當(dāng)色調(diào)：

如：安全軟件，根據(jù)工業(yè)標(biāo)準(zhǔn)，可以選取黃色，綠色體現(xiàn)環(huán)保，藍(lán)色表現(xiàn)時(shí)尚、紫色表現(xiàn)浪漫等等，淡色可以使人舒適，暗色做背景使人不覺得累等

2：如果沒有自己的系列界面，采用標(biāo)準(zhǔn)界面則可以少考慮此方面，做到與操作系統(tǒng)統(tǒng)一，讀取系統(tǒng)標(biāo)準(zhǔn)色表

3：色盲、色弱用戶，即使使用了特殊顏色表示重點(diǎn)或者特別的東西，也應(yīng)該使用特殊指示符，著重號(hào)，以及圖標(biāo)等

4：顏色方案也需要測(cè)試，常常由于顯示器、顯卡的問題，色彩表現(xiàn)每臺(tái)機(jī)器都不一樣，應(yīng)該經(jīng)過嚴(yán)格測(cè)試，不同機(jī)器進(jìn)行顏色測(cè)試

5：遵循對(duì)比原則：在淺色背景上使用深色文字，深色背景上使用淺色文字，藍(lán)色文字以白色背景容易識(shí)別，而在紅色背景則不易分辨，原因是紅色和藍(lán)色沒有足夠反差，而藍(lán)色和白色反差很大。除非特殊場(chǎng)合，杜絕使用對(duì)比強(qiáng)烈，讓人產(chǎn)生憎惡感的顏色。

6：整個(gè)界面色彩盡量少的使用類別不同的顏色。