編者按:這段時間高飽和度的鮮艷色逐漸流行起來,不過這類色彩難度比較大,一不小心容易臟。@喪心病狂十六夜貓?特意帶來這個教程,教你在Web/App 界面中運用單色,雙色以及重疊效果。
說到色彩,優(yōu)設(shè)一直在跟上潮流,比如2017年的潘通流行色,剛發(fā)布不久,優(yōu)設(shè)就有了相關(guān)的介紹和運用方法,想不落潮流的同學(xué),記得多關(guān)注優(yōu)設(shè)官網(wǎng)喲:《玩轉(zhuǎn)草木綠!在這里了解2017的年度潘通流行色》
配色,對設(shè)計師來說是非常有幫助的工具之一。他不僅可以用來吸引注意、為作品添加氛圍,還可以影響用戶的感知與行為。
無論是Web還是APP,鮮艷的配色已開始逐漸具有人氣。為了將人們的注意力集中于要素之上,讓設(shè)計能給用戶帶來深刻的印象,就讓我們來使用鮮艷的配色吧。
這一次為大家介紹的是:使用鮮艷的配色來進(jìn)行設(shè)計的實用技術(shù)。
?使用單色
?在鮮艷配色的使用中,最常見的就是利用單色。單色色板是指:利用同一種顏色不同深淺的飽和度相互組合構(gòu)成,帶來視覺沖擊,提升作品的魅力。與具有很強吸引力的印刷風(fēng)格相組合,單色色板更容易給讀者帶來具有深刻印象的感官體驗。
?要點
使用黑白設(shè)計的效果與單色相互組合使用,也是一種將用戶的注意力集中在小畫面上不錯的方法。
?
?使用雙色
?雙色調(diào)指的是將一副單色原畫通過改變屏幕的角度,將它變成由兩枚負(fù)片組成的效果。這是突出中間色和再現(xiàn)重點的方法。在以前是印刷上常用的技術(shù),如今在網(wǎng)絡(luò)上煥發(fā)出了新的活力。雙色調(diào)看起來很有趣,也非常容易實現(xiàn)。通過使用Adobe Photoshop的雙色漸變,就能夠達(dá)到效果。
?雖然雙色調(diào)效果適用于大尺寸的屏幕,你也可以將他運用在手機屏幕上。
要點
利用雙色調(diào)效果,制作引人注意的效果吧。選擇具有高質(zhì)量的圖像,讓主題變得顯眼。就算是亂七八糟的照片,我們也可以通過模糊細(xì)節(jié)來使用它。
?選擇能反映出照片氛圍的配色。要時刻記得,你可以通過不同的色彩來表現(xiàn)出不同的情感氛圍。
在制作網(wǎng)頁的時候,進(jìn)行設(shè)計時不需要對現(xiàn)有的圖像進(jìn)行加工,也能夠?qū)崿F(xiàn)雙色調(diào)效果。通過Colorfilter.css,只用CSS代碼也能夠使用這效果。
重疊效果
使用配色來傳遞信息的另一種方式,就是在設(shè)計上利用重疊效果。讓我們在圖像或動畫上重疊半透明的效果吧。與材料設(shè)計的鮮艷配色相組合,表現(xiàn)出更加現(xiàn)代的氛圍。
?嘗試著在卡片式布局和視頻內(nèi)容上使用重疊效果,不斷的去調(diào)整讓內(nèi)容更加有吸引力吧。
?要點
在單色上使用疊加效果時,色彩與濾色透明度的調(diào)整是非常重要的。
使用灰暗的、透明度低的顏色作為濾色器,將用戶的注意力集中到顏色而不是背景圖像上。
與之相反利用明亮的、透明度高的顏色作為濾色器,可以將用戶的注意力集中在圖像上。
最后
不管是喜歡使用明亮鮮艷的顏色也好,還是喜歡簡單的黑白單色也好,請記住,顏色是不會有錯的。最重要的事,就是如何去使用那些顏色。
「色彩科普系列教程」
- 紅色篇:《設(shè)計師的讀書筆記!帶你重新全面認(rèn)識色彩系列之紅色篇》
- 橙色篇:《深入淺出學(xué)配色!帶你重新全面認(rèn)識色彩系列之橙色篇》
- 黃色篇:《深入淺出學(xué)配色!帶你重新全面認(rèn)識色彩系列之黃色篇》
- 綠色篇:《深入淺出學(xué)配色!帶你重新全面認(rèn)識色彩系列之綠色篇》
- 藍(lán)色篇:《深入淺出學(xué)配色!帶你重新全面認(rèn)識色彩系列之藍(lán)色篇》
- 紫色篇:《深入淺出學(xué)配色!帶你重新全面認(rèn)識色彩系列之紫色篇》
- 橙色進(jìn)階:《帶你重新全面認(rèn)識色彩系列之橙色進(jìn)階篇》
- 藍(lán)色+紅色進(jìn)階:《超多案例!零基礎(chǔ)學(xué)配色系列之紅色+藍(lán)色篇》
原文地址:photoshopvip
【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱:yuan@uisdc.com】
================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計師學(xué)習(xí)平臺,專注分享網(wǎng)頁設(shè)計、無線端設(shè)計以及PS教程。
【特色推薦】
設(shè)計師需要讀的100本書:史上最全的設(shè)計師圖書導(dǎo)航:http://hao.uisdc.com/book/。
設(shè)計微博:擁有粉絲量180萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計 ,歡迎關(guān)注獲取網(wǎng)頁設(shè)計資源、下載頂尖設(shè)計素材。
設(shè)計導(dǎo)航:全球頂尖設(shè)計網(wǎng)站推薦,設(shè)計師必備導(dǎo)航:http://hao.uisdc.com
復(fù)制本文鏈接 文章為作者獨立觀點不代表優(yōu)設(shè)網(wǎng)立場,未經(jīng)允許不得轉(zhuǎn)載。
發(fā)評論!每天贏獎品
點擊 登錄 后,在評論區(qū)留言,系統(tǒng)會隨機派送獎品
2012年成立至今,是國內(nèi)備受歡迎的設(shè)計師平臺,提供獎品贊助 聯(lián)系我們
AI輔助海報設(shè)計101例
已累計誕生 737 位幸運星
發(fā)表評論
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓