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

時鐘圖標,設計一枚時鐘主題圖標(6)

來源:pdadians 作者:P大點S 學習:21754人次

這枚時鐘主題圖標主要是運用了簡單的鼠繪技巧和圖層樣式來制作,十分簡單,一起來學習一下。

PSD文件鏈接:http://pan.baidu.com/ 密碼:7pr2

我們的最終效果:

tgudhdp.cn_034302B32-0.jpg

背景沒什么好說的,就是做個漸變,設置前景色為#f8efe0,用圓角矩形工具畫一個圓角矩形,這是我們的主體。

tgudhdp.cn_0343022611-1.jpg

為圓角矩形添加一個圖層樣式。友情提示,漸變疊加樣式中的圖層混合模式是疊加,為什么是疊加,自己想想。

tgudhdp.cn_0343022057-2.jpg

tgudhdp.cn_034302I27-3.jpg

tgudhdp.cn_0343023441-4.jpg

tgudhdp.cn_0343023B8-5.jpg

下面,我們強化一下投影效果,復制一層圓角矩形,置于我們主體圓角矩形的下層,更改顏色為黑色,執(zhí)行一個角度為90度,距離為50的動感模糊濾鏡,將圖層混合模式更改為正片疊底,圖層不透明度為23%,當然,你需要用蒙版擦除上半部分那些不和諧的部分。

tgudhdp.cn_034302L49-6.jpg

tgudhdp.cn_0343024T8-7.jpg

復制一層這個執(zhí)行了動感模糊的陰影層,置于底層(當然,是在背景層的上層,無可置疑),我將圖層的不透明度改為了21%,動感模糊的參數(shù)角度不變,距離改成了108,這樣,看起來,顯得更為真實一些。

tgudhdp.cn_034302GD-8.jpg

用橢圓工具,畫一個圓形,并添加一個圖層樣式。漸變的顏色,大家隨意,挑自己喜歡的就OK了。

tgudhdp.cn_0343024U1-9.jpg

tgudhdp.cn_03430224U-10.jpg

tgudhdp.cn_0343022641-11.jpg

tgudhdp.cn_0343022542-12.jpg

接下來,用橢圓工具來添加中間的圓,使剛才那個漸變的圓形成一個圓環(huán),設置一個圖層樣式。

tgudhdp.cn_0343026025-13.jpg

tgudhdp.cn_0343022J0-14.jpg

tgudhdp.cn_034302B43-15.jpg

tgudhdp.cn_034302A44-16.jpg

下面,我用來畫最中間最小的圓,同樣的使用橢圓工具,畫好后,添加一個圖層樣式。

tgudhdp.cn_03430219C-17.jpg

tgudhdp.cn_0343021104-18.jpg

tgudhdp.cn_0343022146-19.jpg

tgudhdp.cn_034302OE-20.jpg

設置前景色為#f2eee8,我們畫出固定時針的那個圓(主要是我不知道叫啥),添加圖層樣式。

tgudhdp.cn_0343025420-21.jpg

tgudhdp.cn_034302B29-22.jpg

tgudhdp.cn_0343021L3-23.jpg

再往下,我們畫最小的那個圓(好傷心,真心叫不出這東西叫啥),添加圖層樣式。

tgudhdp.cn_0343023C9-24.jpg

tgudhdp.cn_0343025b6-25.jpg

tgudhdp.cn_034302I25-26.jpg

tgudhdp.cn_03430220J-27.jpg

tgudhdp.cn_03430224P-28.jpg

畫一個圓角矩形,編輯——變形——扇形——1度,然后CTRL+T旋轉,放置到那個小圓與固定時針分針的圓的中間圖層位置。

tgudhdp.cn_0343024955-29.jpg

為秒針添加一個投影。

tgudhdp.cn_0343023435-30.jpg

在秒針上層畫一個白色矩形,旋轉,創(chuàng)建剪貼蒙版,圖層不透明度15%,營造高光效果。

tgudhdp.cn_0343024647-31.jpg

一樣的操作手法,做出分針,時針,以及各自的高光,高光的透明度靈活調整。

tgudhdp.cn_0343022a7-32.jpg

最后,我加了幾個文字。

tgudhdp.cn_0343021208-33.jpg

最終完成

tgudhdp.cn_034302B32-0.jpg

學習 · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學就能學:ps_bbs,或掃右側二維碼!
  • 關注我們學更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
受傷的心還可以愛誰2016-12-08 03:23
上班沒事做,試著做做,
12016-10-29 06:57
謝瑞雪2016-07-08 01:55
全茳2016-06-23 05:36
鄧鄧_Camille2016-04-26 05:48
平面時間小icon
叫U哦也2016-04-26 03:02
交作業(yè)啦

關注大神微博加入>>

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