@飛屋睿UIdesign?:IOS 7毛玻璃質(zhì)感的UI設(shè)計(jì)大行其道,別處找來的背景圖總是不能符合自己心中理想的配色,在此,我將教大家利用PS制作出這類超級簡單又能與自己的界面風(fēng)格完全搭配的背景圖。制作此類背景圖的前提是需要懂得一定的色彩理論,更需要一雙對色彩搭配敏感的眼睛。
最后做出的背景圖如下:
OK,讓我們開始吧。
一、選擇色彩方案
大家可以參考這篇教程:《配色弱有救了!教你利用圖片創(chuàng)建獨(dú)有的色彩方案!》我在這里選擇了下面這張圖片作為配色方案的靈感來源。因背景色彩對比明顯才能更好襯托出透明感,因此傾向于選擇色調(diào)變化較大、分布較廣的圖片。
配色方案吸取的顏色為:柿子椒的正紅、青檬皮的深綠、葡萄的淺綠和檸檬黃,另外選擇圖片中的暗色木桌面作為底色,底色發(fā)揮襯托其他色彩的作用,如果你的其他色塊面積大基本上也看不到底色,但能感覺到它。(嘻嘻,是否能理解這種“看不見但能感覺到”的神秘感呢?)
有人也建議直接選用黑或白的底色,但是我認(rèn)為圖片本身對黑白的表現(xiàn)要豐富得多,純黑或純白則過于規(guī)則和保守。
二、制作背景圖
1、新建文件
在這里,我將要制作一個(gè)適應(yīng)手機(jī)屏幕展示的背景圖,因此我的PS文件大小設(shè)定為W:640px、H:1136px,填充背景色為配色方案中的深色——底色。
2、在背景層之上新建一個(gè)圖層,采用大而柔軟的畫筆筆刷涂上第一種顏色。
這里需要注意的是:
1)涂抹的畫筆后最好一步到位,不要猶豫。因?yàn)檐浶援嫻P上色后,在超出畫板的部分將會有一條很突兀的邊界,這將不利于你對畫筆著色后的圖層的移動(dòng)等操作。換句話說,大而軟的畫筆使用法則就是一步定位,修改的幾率太小。
2)畫筆大小我在這里選擇的900px,實(shí)際大小根據(jù)你的文件畫板大小和實(shí)際需要而確定。
3)畫筆的透明度降低為70%,這會使不同的顏色間實(shí)現(xiàn)真正的“融合”。
3、再繼續(xù)創(chuàng)建新的圖層,涂抹上另外幾種顏色。色彩的分布隨自己的喜好。但注意每一種顏色最好新建一個(gè)圖層,重命名不同的圖層,可以方便今后修改和調(diào)整。
4、將紅黃綠的色彩圖層合并為一個(gè)圖層,將這整個(gè)圖層做一次變形。
(ctrl+T>鼠標(biāo)右鍵單擊>變形)變形的目的是為了讓你的色彩融合得更自然,不再是一個(gè)個(gè)圓形拼湊起來的樣子,而能呈現(xiàn)出一種流動(dòng)感。這時(shí),你將運(yùn)用圖形中的操作桿任意變化出你喜歡的圖案。
5、這時(shí),也許對你而言這張圖片比較暗,那么你可以通過調(diào)整色階來實(shí)現(xiàn)提亮和加強(qiáng)圖片色彩的對比。
6、進(jìn)一步修飾,這類修飾是隨性的。根據(jù)你自己的期望,可以使用諸如橡皮擦、調(diào)整圖層進(jìn)一步將圖片變?yōu)槟阆胍慕Y(jié)果。
7、最后,為使你的圖片顏色顯得更為豐富,你可以復(fù)制色彩圖層,將復(fù)制后的圖層混合模式改為“柔光”或“疊加”。并適當(dāng)調(diào)整它的透明度。
三、將背景圖投入使用
有很多方式可以做出這樣的圖片,但對我來說這是最簡單的一種方式。請記得,這其中最重要是獲得創(chuàng)作的樂趣。
這是投入項(xiàng)目實(shí)際使用后的效果,在背景圖上使用的色塊和線條都需要降低一點(diǎn)透明度。相信大家按照這個(gè)方法可以做出更出色的作品。
作者微信號,頗多干貨,歡迎關(guān)注呦:
當(dāng)然,你還可以玩玩Lowpoly風(fēng)格的背景:
《簡易教程出來啦!教你幾步創(chuàng)建超火的多邊形背景》沒事,如果你懶得自己做的話,還有大把素材可以下載,向下看~
《大福利!350M高分辨率低多邊形背景圖打包下載!》現(xiàn)在背景有了,那么Lowpoly風(fēng)格的網(wǎng)站要怎么做才有范兒呢?看!
《再不學(xué)就落伍了!15個(gè)設(shè)計(jì)感極強(qiáng)的LOW-POLY網(wǎng)站欣賞》
原文地址:jianshu
作者:@飛屋睿UIdesign
【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱:2650232288@qq.com】
=================== 曬照贈(zèng)書!設(shè)計(jì)師男神女神在哪兒? ===================
炎炎夏日!送書解暑!現(xiàn)在優(yōu)設(shè)微信社區(qū)也有送書福利活動(dòng)啦!
【活動(dòng)日期】本周一(7月28日)至周日(8月3日),發(fā)話題時(shí)附上自己的真實(shí)照片即可。
【活動(dòng)規(guī)則】根據(jù)大家的【點(diǎn)贊量】選取男/女神各一名
【活動(dòng)獎(jiǎng)品】我們會送出圖靈出版社《網(wǎng)頁設(shè)計(jì)創(chuàng)意書(卷2)》哦!
P.S.照片不能作假哦,必須是本人的真實(shí)照片,帶臉照??! 工作照、生活照、都可以,當(dāng)然一起上更好了(*^__^*)
早發(fā)皂片早收贊,微信的小伙伴們趕快行動(dòng)起來吧~\(≧▽≦)/~
進(jìn)入優(yōu)設(shè)微信,看到底部 點(diǎn)擊“聊天交友”進(jìn)入【優(yōu)設(shè)聊吧】? 在點(diǎn)擊一次“發(fā)話題”就可以爆照啦~快快行動(dòng)起來吧~
========================== 參 與 方 式 ==========================
①首先,你要關(guān)注一下優(yōu)設(shè)哥的微信啦~【youshege】或者直接掃描二維碼:
②然后,進(jìn)入優(yōu)設(shè)哥的微信,看到底部,點(diǎn)擊“聊天交友”進(jìn)入【優(yōu)設(shè)聊吧】;
③在點(diǎn)擊一次“發(fā)話題”就可以爆照啦~ 快快行動(dòng)起來吧~
P.S.群內(nèi)如果有親想要參與微社區(qū)活動(dòng),但是手機(jī)不支持傳圖發(fā)帖的可以聯(lián)系@【江蘇】花花
復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場,未經(jīng)允許不得轉(zhuǎn)載。
發(fā)評論!每天贏獎(jiǎng)品
點(diǎn)擊 登錄 后,在評論區(qū)留言,系統(tǒng)會隨機(jī)派送獎(jiǎng)品
2012年成立至今,是國內(nèi)備受歡迎的設(shè)計(jì)師平臺,提供獎(jiǎng)品贊助 聯(lián)系我們
AI輔助海報(bào)設(shè)計(jì)101例
已累計(jì)誕生 753 位幸運(yùn)星
發(fā)表評論
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓