配色優(yōu)化，讓設(shè)計(jì)更加高端！

人類在回憶所看到過的場景和事物時(shí)，對色彩的記憶度要高于形態(tài)。也就是說，從視覺角度來看，一款產(chǎn)品給用戶留下深的印象往往是界面的配色。由此我們也能夠看出配色可以說是設(shè)計(jì)師重要的武器，很可能沒有之一，但是這個(gè)武器有使用的。

UI設(shè)計(jì)的一個(gè)基本原則就是避免頁面中出現(xiàn)過多的顏色，這個(gè)道理大家都懂，但是在真正自己設(shè)計(jì)的時(shí)候總是會下意識的引入過多的顏色，導(dǎo)致整個(gè)界面看起來非常的雜亂。所以對于設(shè)計(jì)師來說，學(xué)會給界面的配色做減法是很重要的一項(xiàng)技能。

配色體系的目的

給一款產(chǎn)品建立配色體系之前，設(shè)計(jì)師先要弄明白的是：我為什么要建立配色體系？這個(gè)問題聽起來十分多余而且稍顯無厘頭。但是在我看來，每次做東西之前常問自己為什么可以更好的提高工作效率。只有真正理解了配色的意義，我們才可以做到有的放矢，進(jìn)行有選擇性的刪減。

通常來說，配色體系的建立主要有以下三個(gè)目標(biāo)：

視覺區(qū)分

調(diào)整界面風(fēng)格

吸引用戶注意力

視覺區(qū)分

一個(gè)App或網(wǎng)站可能會有好幾個(gè)主要且同級別的功能和分區(qū)。這時(shí)，設(shè)計(jì)師需要對產(chǎn)品的信息內(nèi)容和功能模塊進(jìn)行整體規(guī)劃，建立界面的基本格局來幫助用戶在視覺上進(jìn)行更好的區(qū)分。配色可以很好的幫助設(shè)計(jì)師實(shí)現(xiàn)這一目標(biāo)。

配色可以完成視覺區(qū)分，但是視覺區(qū)分不是只能通過配色來實(shí)現(xiàn)。文字、圖像（圖標(biāo)）、布局都可以完成視覺區(qū)分。

例如，一款理財(cái)類應(yīng)用中有不同種類的理財(cái)產(chǎn)品（普通型，隨借隨還型和可轉(zhuǎn)讓型）和不同的狀態(tài)（投資確認(rèn)中，投資成功已起息，清算中等合計(jì)11種狀態(tài)）。

在這種情況下（3種產(chǎn)品類型，11種產(chǎn)品狀態(tài)），配色就要很小心了。先我們要對狀態(tài)進(jìn)行整合，相似的狀態(tài)整合成一種，這樣可以減少顏色的數(shù)量。當(dāng)然會有人感覺六種顏色還是多，因?yàn)闀旧细嬖V我們同一頁面中配色不要超過三種。但是我們得仏法，讓設(shè)計(jì)更加高端-大連網(wǎng)站設(shè)計(jì)" />

吸引用戶注意力

我們經(jīng)常喜歡使用配色來吸引用戶注意力，以下圖中行為召喚按鈕(call to action)為例，配以與背景色差距較大的顏色使其可以從背景中凸顯出來。

其實(shí)我們即使不使用配色也可以很好的吸引用戶注意力。

谷歌搜索的主頁出現(xiàn)了大面積的留白，用戶的目光自然就會被吸引到搜索框。這和谷歌的初衷相契合，他們希望用戶在這個(gè)頁面完成搜索操作，所以不用展示過多其他的信息來分散用戶的注意力。

陰影效果也可以用來吸引用戶注意力，陰影效果可以提升目標(biāo)元素的“海拔”，進(jìn)而使其從背景中凸顯出來。

當(dāng)然我們還可以使用模糊效果來吸引用戶注意力。用戶總是會不由自主的被那些對焦準(zhǔn)確的部分吸引而忽視掉被虛化的部分。眼球的對焦機(jī)制好像一個(gè)調(diào)節(jié)器一樣捕捉那些離你忽遠(yuǎn)忽近的物體，這樣才能讓你感受到周圍一切事物的深度和距離。這就是我們?nèi)搜鄣墓ぷ鳈C(jī)制。設(shè)計(jì)師可以根據(jù)這個(gè)理論將界面中一些不重要的內(nèi)容進(jìn)行模糊處理來凸顯那些重要的內(nèi)容。

好的設(shè)計(jì)應(yīng)該讓用戶短時(shí)間內(nèi)就可以找到他們感興趣的內(nèi)容，過多的給予對用戶來說其實(shí)是一種負(fù)擔(dān)。少即是多，這是當(dāng)前互聯(lián)網(wǎng)時(shí)代的信條也是設(shè)計(jì)師需要恪守的準(zhǔn)則。