當前位置:首頁>ps實例教程>ps網(wǎng)頁設計>UI設計教程>教程內(nèi)容

天氣圖標,設計天氣主題APP應用圖標

來源:站酷 作者:Royavs 學習:8747人次
效果圖制作非常簡單,前期先分析構成;然后從背景開始制作,用形狀配合路徑做出云朵,閃電,雨滴等;再用圖層樣式加上浮雕和漸變,局部渲染一些顏色即可。

  最終效果

www.theoat.com.cn_2154164202-0.jpg

  1、背景填充漸變?nèi)鐖D,再花正圓矩形大小,適當就行。

www.theoat.com.cn_21541623b-1.jpg 

  2、圖層樣式為徑向漸變,漸變色如圖(自己看著調)。

www.theoat.com.cn_21541A250-2.jpg 

  3、繪制陰影,用橢圓工具在圖標下層繪制一個形狀如圖的橢圓,在屬性面板里進行羽化,效果如圖。然后建立圖層蒙版擦出多余部分。

www.theoat.com.cn_21541B211-3.jpg 

  4、橢圓工具如上圖畫上第一層云朵的陰影黑色,不透明度為12%。

www.theoat.com.cn_21541A233-4.jpg 

  5、Ctrl + J 復制一層云朵上移動,圖層樣式:斜面和浮雕,漸變疊加上淺下深都是灰度的。下面顏色要深一些是為了讓上層云有立體感。

www.theoat.com.cn_21541C0L-5.jpg 

  6、再復制一層云,Ctrl + J 不要圖層樣式,顏色填充如圖。然后等比例縮小,就把下層的立體邊露出來即可。

www.theoat.com.cn_2154163947-6.jpg 

  7、同樣的方法再做一層小云朵,顏色填充,圖層樣式如圖。然后復制一層放大一點,放在下面做陰影。

www.theoat.com.cn_21541B931-7.jpg 

  8、使用多邊形畫出閃電,兩個變形的三角形組成的,當然也可以鋼筆工具自己畫。底層閃電顏色純度稍微低一點。再復制一層填充較高飽和度的檸檬色,利用圖層蒙版擦除上層部分閃電。

www.theoat.com.cn_2154162Z5-8.jpg 

  9、填充色如圖,在閃電層上小云層下畫橢圓,利用屬性面板對橢圓進行羽化,模式為疊加,效果如圖。

www.theoat.com.cn_2154164a6-9.jpg 
10、復制一層填充顏色如圖,Ctrl + T 后,同時按住Shift + Alt 鍵拖拽等比例縮小。圖層模式設為“疊加”。

www.theoat.com.cn_21541635X-10.jpg 
 

  11、橢圓工具變形畫出雨點,圖層樣式如下做出投影效果。

www.theoat.com.cn_21541A300-11.jpg

www.theoat.com.cn_2154164302-12.jpg

  12、復制一層橢圓光放在雨點圖層上方,按住Alt鍵點擊兩圖層之間建立剪切蒙版。

www.theoat.com.cn_2154161114-13.jpg 

  13、畫筆工具用云層筆刷畫出云霧效果,對云層圖層進行高斯模糊效果,預覽如圖即可。

www.theoat.com.cn_21541A144-14.jpg
www.theoat.com.cn_21541A1M-15.jpg

  最終效果:

www.theoat.com.cn_2154164202-0.jpg

學習 · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學就能學:ps_bbs,或掃右側二維碼!
  • 關注我們學更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
青梔2017-06-20 10:07
繁花落如雨2017-04-23 09:19
繁花落如雨2017-04-23 09:04
相信你的靈魂2016-07-25 11:41
相信你的靈魂2016-07-25 11:07
1233333902016-04-19 03:01
002
1233333902016-04-19 03:04
002
丸子2016-04-07 08:40
丸子2016-04-07 08:04
今晚不同往日2016-03-22 10:44
學習學習學習學習
mayday2016-03-22 10:44
學習學習學習學習
每人都是雙面蝶2016-03-22 12:14
學習學習
古族語言2016-03-22 12:14
學習學習
沒分寸小姐2016-03-22 12:14
學習學習
卡拉不OK2016-03-22 12:14
學習學習

關注大神微博加入>>

網(wǎng)友求助,請回答!