北京火星人教育

7x24小時(shí)咨詢熱線

400-660-3310

當(dāng)前位置 : 好學(xué)校 北京火星人教育 學(xué)習(xí)資訊 資訊詳情

北京UI設(shè)計(jì)培訓(xùn)_UI設(shè)計(jì)技巧之明亮的色彩應(yīng)用

2019-09-15

如今移動端的發(fā)展,帶動了UI設(shè)計(jì)的迅速發(fā)展。良好視覺的移動應(yīng)用會更受青睞,這就對設(shè)計(jì)師合理的設(shè)計(jì)有一定的要求,而色彩正是營造美感的關(guān)鍵所在。色彩能吸引注意力,烘托氛圍,影響用戶的情緒、認(rèn)知和行為。

設(shè)計(jì)師們用亮系色彩讓用戶著眼于界面中的重要元素,并為之印象深刻。

下面是在設(shè)計(jì)中巧用亮系色彩的一些實(shí)用技巧:

單調(diào)

單調(diào)板能夠形成視覺刺激,能夠創(chuàng)造令人過目不忘的效果。

在使用亮系色彩時(shí),單一調(diào)色板法則是目前流行的方式之一。單一調(diào)色板包括單一色調(diào)和色彩混合方式

單調(diào)

(采用大膽的色彩來創(chuàng)建一個(gè)簡單卻讓人印象深刻的外觀)

小技巧:使用黑白這樣的單一顏色,是在小屏幕上創(chuàng)造視覺驚喜的好方法。

單調(diào)

(圖標(biāo)和簡單的樣式創(chuàng)造了一個(gè)易于閱讀和互動的組合)

雙色調(diào)

雙色調(diào)是圖像的半色調(diào)的復(fù)制,它帶來圖像的中間調(diào)和高光。

雙色調(diào)不僅能吸引人的注意力,而且它非常容易被創(chuàng)建。你可以在 Photoshop 中使用雙色梯度輕松做出這種效果。

這種曾經(jīng)應(yīng)用于印刷裝訂中的技術(shù),在互聯(lián)網(wǎng)時(shí)代找到了新的生命。

雙色調(diào)

(上圖:簡約雙色調(diào)營造了一種商務(wù)范。)

雙色調(diào)效果不僅可以在大型桌面圖像中應(yīng)用,它們同樣可以在移動設(shè)備上使用。

雙色調(diào)

小技巧:使用雙色調(diào)創(chuàng)作主圖。選擇一張主題明確的高質(zhì)量圖片,而不是有著太多元素的圖片,因?yàn)楹笳邥泻芏嗉?xì)節(jié)被忽略。

(上圖:一張極簡圖像勝過千言萬語。)

當(dāng)你設(shè)計(jì)網(wǎng)站并想在你的圖像上創(chuàng)建雙色調(diào)的效果時(shí),你可以不在現(xiàn)有圖像上做任何修改,只要在 Colofilter.css 上應(yīng)用 CSS 代碼即可。

選擇一種能反映照片情緒的色彩。你要知道,不同的顏色能喚起不一樣的情緒。

疊加

顏色疊加的設(shè)計(jì)是用色彩進(jìn)行聲明的一種方法。

通過使用與材料設(shè)計(jì)相關(guān)的一種明亮而飽和的色彩,你可以在半透明的框架上簡單地應(yīng)用圖像或者視頻,從而營造現(xiàn)代感。

雙色調(diào)

(上圖:顏色疊加增強(qiáng)了圖像的作用,并允許設(shè)計(jì)師校準(zhǔn)基調(diào)色彩。)

請考慮在卡片樣式元素中使用圖層疊加,以用于視頻內(nèi)容或者重點(diǎn)的強(qiáng)調(diào)。

懸停動畫卡應(yīng)用

(上圖:懸停動畫卡應(yīng)用。)

小技巧:當(dāng)使用單一顏色進(jìn)行疊加時(shí),需要考慮顏色的飽和度和透明度。較深的顏色組合(低透明高飽和)能讓人將注意力集中在色彩上;較淺的顏色組合能讓人將注意力集中在圖像上。

結(jié)語

沒什么設(shè)計(jì)技術(shù)能比與色彩打交道更有趣的了。色彩能營造戲劇感、深沉感甚至安詳感。

作為一名設(shè)計(jì)師,當(dāng)你使用色彩時(shí),真應(yīng)該去試驗(yàn)一下不同的搭配組合。不論你鐘情于明亮、大膽的色彩,抑或黑白簡約感,你都要記住

沒有不好看的色彩,只有不恰當(dāng)?shù)氖褂谩?/p>

收藏
分享到:

相關(guān)課程

相關(guān)資訊

北京火星人教育

北京火星人教育

認(rèn)證等級

信譽(yù)良好,可安心報(bào)讀

北京火星人教育

已獲好學(xué)校V2信譽(yù)等級認(rèn)證

信譽(yù)值

  • (60-80)基礎(chǔ)信譽(yù)積累,可放心報(bào)讀
  • (81-90)良好信譽(yù)積累,可持續(xù)信賴
  • (91-100)充分信譽(yù)積累,推薦報(bào)讀

與好學(xué)校簽訂讀書保障協(xié)議:

  • 100%
  • 3007
  • 43063
在線咨詢
;