PS繪製按鈕ICON圖標教程?

Tags: 教程, 按鈕, 圖標,

在UID設計中,經常要繪製按鈕ICON圖標,做ICON一定要注意細節,哪怕很小的一點反光,從現實存的物體想象過來,作者朝夕相處58就帶你來繪製按鈕ICON圖標

PS繪製按鈕ICON圖標教程

第1階段

我們從底部開始做,畫一個圓角矩形,顏色自定,在屬性面板調好圓角

PS繪製按鈕ICON圖標教程

為該造型添加如圖所示的圖層樣式,鼠標右鍵選擇“圖層樣式”

PS繪製按鈕ICON圖標教程

如下圖所示,注意各屬性的設置

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

這就是做出來的效果,第一階段完成

PS繪製按鈕ICON圖標教程

第2階段

把第1階段做好圓角複製一份出來,在屬性面板裡設置減小相當像素,就實現等比效果了

PS繪製按鈕ICON圖標教程

依然是對其進行效果設置,如圖所示,注意數值

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

第3階段

複製一層藍色的如圖,寬度是原來的一半

PS繪製按鈕ICON圖標教程

依然是對其效果的設置,如圖所示,這裡要注意,在做反光的時候,哪怕光再微弱,也是一定要有的

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

如圖所示,為目前所做的效果

PS繪製按鈕ICON圖標教程

第4階段

畫一個圓,大下在這個矩形一半的樣子,上下居中對齊,為其設置效果

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

把小圓右鍵轉化為智能對象,為其加點高斯模糊,使其更加真實

PS繪製按鈕ICON圖標教程

再複製出一個小圓,移至左邊,進行效果的設置

PS繪製按鈕ICON圖標教程

PS繪製按鈕ICON圖標教程

同樣轉化為智能對象,進行高斯模糊,按鈕就基本完成了

PS繪製按鈕ICON圖標教程

相關問題答案