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

AI設計唱機圖標(3)

來源:站酷 作者:mango_o 翻譯 學習:23795人次

步驟10

切換到到“網(wǎng)格線間隔為5px”(編輯>首選項>參考線和網(wǎng)格)。重新矩形,唱針路徑和“armbasefront”網(wǎng)格選擇并編組(Ctrl+G)。選中這個新組合添加三個陰影效果(效果>風格化>陰影)數(shù)值設置如下圖所示。

AI設計黑膠唱機Icon

步驟11

選擇唱針以及其他唱針的組成部分,使之編組(Ctrl+G)。移動到圖層面板,雙擊這個新組并將其命名為“arm”。

AI設計黑膠唱機Icon

5. 創(chuàng)建按鈕

步驟1

使用橢圓工具(L),創(chuàng)建一個20px的圓,設置填充顏色為R=15,G=10,B=10,其他設置如下圖所示。

AI設計黑膠唱機Icon

步驟2

切換到“網(wǎng)格線間隔為5px”(編輯>首選項>參考線和網(wǎng)格)。在圖層面板中,打開你的“arm”的編組,選擇“armbase”網(wǎng)格并創(chuàng)建副本(Ctrl+C > Ctrl+F)。選擇此副本,將它拖在圖層面板頂組,雙擊這個新的網(wǎng)格,并將其命名為“knob”;氐疆嫲迳希F(xiàn)在畫面為第三張圖像所示。選中新的網(wǎng)格,在變換面板上輸入18px的寬(或高)。現(xiàn)在于第四張圖像看起來很像。

AI設計黑膠唱機Icon

步驟3

選中“knob”網(wǎng)格并創(chuàng)建副本(Ctrl+C > Ctrl+F)。選中新的副本,在變換面板上輸入16px的寬(或高),然后去對象>變換>旋轉,設置為90度角,點擊確定。

AI設計黑膠唱機Icon

步驟4

重新選擇“knob”網(wǎng)格,添加三個陰影效果(效果>風格化>陰影),數(shù)值設置如下圖所示。

AI設計黑膠唱機Icon

步驟5

使用鋼筆工具(P),創(chuàng)建一個3px的垂直路徑,如第一張圖像所示。為此路徑添加1pt的描邊,設置它的顏色為R=255,G=222,B=223;復制這個垂直路徑,如第二張圖像所示;選擇兩條路徑,使它們編組(Ctrl+G)。選中這個新組,選則“效果>扭曲和變換>變換”。數(shù)值設置如下圖所示,點擊確定;選擇“對象>擴展外觀”,然后選擇“對象>路徑>輪廓化描邊”。

AI設計黑膠唱機Icon

步驟6

選中黃色形狀的組合,選擇“Shift+Ctrl+G”兩次;選擇17個黃色的形狀如第二幅圖所示,刪除它們;下一步,選中五個黃色形狀,如第三幅圖所示,按Ctrl+8(對象>復合路徑>建立)使之變?yōu)橐粋復合路徑;選中新的復合路徑,將顏色更換為 =152,G=98,B=55。

AI設計黑膠唱機Icon

步驟7

選擇最上面的黃色形狀,顏色設置為R=35,G=30,B=30,然后選擇最后的黃色形狀,顏色設置為R=180,G=20,B=35。選擇這一步中的所有復合路徑并編組(Ctrl+G)。選中編組,選擇“效果>風格化>投影”數(shù)值設置如下圖所示,點擊確定;選中新的組和其他形狀,將“knob”網(wǎng)格和新的組進行編組(Ctrl+G)。移動到圖層面板,將這個新組其命名這個新組“knob”。

AI設計黑膠唱機Icon

6. 添加陰影,層次和細致的紋理

步驟1

回到“網(wǎng)格線間隔為5px”(編輯>首選項>參考線和網(wǎng)格)。在圖層面板上解鎖“vinylshadow”。選中這個白色的圓圈。

首先,如圖所示,將白色更換為線性漸變。下一步,選中現(xiàn)有的漸變填充,“效果>路徑>偏移路徑”,偏移數(shù)值為15像素,點擊確定;“效果>模糊>高斯模糊”,模糊半徑為15,點擊確定。

AI設計黑膠唱機Icon

步驟2

選中“vinylshadow”,在外觀面板上添加第二填充,選擇它,添加下圖所示的線性漸變,然后選擇“效果>模糊>高斯模糊”,模糊半徑為15,點擊確定。

AI設計黑膠唱機Icon

步驟3

選中“vinylshadow”,選擇頂部的填充,復制這個填充(下圖中藍色箭頭)。刪除新添加的填充現(xiàn)有的高斯模糊效果,并降低其不透明度為30%。

AI設計黑膠唱機Icon

步驟4

選中“vinylshadow”形狀,在外觀面板上添加黑色的描邊1px,內(nèi)側對齊,改變混合模式為柔光,并降低其不透明度為15%,“效果>路徑>偏移路徑”,偏移數(shù)值為1px,點擊確定。

AI設計黑膠唱機Icon

步驟5

在圖層面板上解鎖“armshadow”形狀。然后,將“vinylshadow”的性質復制到這個“armshadow”上。在圖層面板的右邊,你會注意到每一個形狀后都有一個小小的灰色圓圈,它被稱為“目標圖標”。按住Alt點擊目標圖標,“vinylshadow”形狀的外觀拖到“armshadow”的目標圖標上。選中“armshadow”,打開底部的第一個填充中高斯模糊效果,設置半徑在5px,然后打開路徑偏移效應設置的偏移量為3px。移動到下一個填充,打開現(xiàn)有的高斯模糊效果,設置半徑3px。最后,打開用于描邊的路徑偏移,設置偏移量為-1px。

AI設計黑膠唱機Icon

學習 · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學就能學:ps_bbs,或掃右側二維碼!
  • 關注我們學更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
南方V2016-06-29 02:04
顏色有一塊不對,求指教
陳大了個大2016-02-02 05:32
卡在第4部,有人做出來嗎?求指導
逆風前行2015-12-28 03:38
我正好也做在這個地方了,你的問題我也碰到了,你用小白在畫板外面單擊一下 再回到黃色區(qū)域單擊一下,接著按快捷u,添加網(wǎng)格,然后再用小白調整 ,循環(huán)往復,你就可以做的和樓主一樣樣的了
馥曉玟2015-11-24 04:22
我也遇到一樣的問題,大神請解答。跪謝
我DE天吶2015-10-24 07:28
能不能幫幫我,我做到第4步不會做了。漸變網(wǎng)格的線是彎的,而且有的點,點不上,會提示無法從單一線段創(chuàng)建漸變網(wǎng)格。<可憐>
我DE天吶2015-10-24 07:26
表示做到第4步就不會了,有沒有大神幫我看看我得漸變網(wǎng)格點出來為啥是曲線,而且點到有的點的時候會提示無法從單一線段創(chuàng)建漸變網(wǎng)格。點全部點好之后。填充顏色有時候也會只能填充一條線的一邊。而不是兩邊
dengping092014-11-07 12:09
好詳細!學習了!
大冠2014-04-12 10:13
拜一下!
一絲不掛2014-04-02 04:52
第一次來,希望能學到好東西啊哈哈
查查2014-01-19 04:28
<給力>
TeresaTT2014-01-19 04:28
7. 添加一個簡單的背景步驟1使用矩形工具(M),創(chuàng)建一個610px的矩形,設置填充顏色為R=65,G=60,B=60,在對齊面板上選擇水平居中對齊,垂直居中對齊按鈕。選中這個新的形狀,下移圖層(Ctrl+Shift+ <),在外觀面板上添加第二個填充,設置顏色為黑色,降低其不透明度為10%,改變混合模式為疊加,”效果>藝術效果>膠片顆!皵(shù)值設置如下圖所示,然后單擊“確定”就行了。Congratulations! You're Done!這就是做完最后的樣子,我希望你喜歡這個教程,可以將這些技巧應用在你未來的項目中去。

關注大神微博加入>>

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