photoshop 網(wǎng)頁常用按鈕制作教程之二
發(fā)布時間:2008-12-02 21:56:41 作者:佚名
我要評論

最終效果
1.新建一個500*250象素的窗口,填充綠色(R:52,G:175,B:125),再新建一層命名為"按鈕--底",選擇“圓角矩形工具”如<圖1>,半徑數(shù)值為“25”如<圖2>,繪制如<圖3>所示的圓角矩形。
<圖1>
&
最終效果
1.新建一個500*250象素的窗口,填充綠色(R:52,G:175,B:125),再新建一層命名為"按鈕--底",選擇“圓角矩形工具”如<圖1>,半徑數(shù)值為“25”如<圖2>,繪制如<圖3>所示的圓角矩形。
2.如下圖所示鎖定透明象素
4.在“按鈕-底”上新建一層命名為“按鈕--高光”,調(diào)出“按鈕--底”的選區(qū)如<圖7>,選擇菜單:選擇 > 修改 > 收縮,數(shù)值為3,再填充白色,按Ctrl + D取消選區(qū)。
5.如<圖10>在“按鈕--高光”這層添加蒙版,再用黑白漸變工具如<圖11>由上往下繪制漸變,效果如<圖12>
7.在"按鈕--底"這層上面新建一層命名為“按鈕--測光”,調(diào)出“按鈕--底”的選區(qū)如<圖16>,選擇菜單:選擇 > 修改 > 收縮,數(shù)值為1,再填充白色,用矩形選取工具適當?shù)陌堰x區(qū)向右移幾個象素如<圖19>然后按"Delete"鍵刪除選區(qū)部分如<圖20>
9.按Ctrl + J 把"按鈕--側(cè)光"復制一層,選擇:編輯> 變形 > 垂直翻轉(zhuǎn),再選擇:編輯> 變形 > 水平翻轉(zhuǎn),把翻轉(zhuǎn)后的圖片移到右側(cè)適當?shù)奈恢萌?lt;圖22>
10.在"按鈕--底"上面新建一層命名為“按鈕--邊”調(diào)出"按鈕--底"的選區(qū)如<圖23>,再選擇菜單:編輯 > 描邊 設置如<圖24>再按Ctrl + D 取消選區(qū)。效果如<圖25>
12.按Ctrl + J 把文字復制一層,把下面的文字隱藏,為上面文字加投影效果,設置如<圖27>,再回到下面的文字層,刪格化圖層,選擇菜單 編輯> 變形 > 垂直翻轉(zhuǎn) 把文字拖到合適的位置如<圖28>
13.如下圖添加蒙版用黑白漸變從上至下繪制漸變,制作文字的倒影。
可以根據(jù)需要制作有底紋的效果 PSD文件下載
1.新建一個500*250象素的窗口,填充綠色(R:52,G:175,B:125),再新建一層命名為"按鈕--底",選擇“圓角矩形工具”如<圖1>,半徑數(shù)值為“25”如<圖2>,繪制如<圖3>所示的圓角矩形。
<圖1>
<圖2>
<圖3>
2.如下圖所示鎖定透明象素
<圖4>
<圖5>
<圖6>
4.在“按鈕-底”上新建一層命名為“按鈕--高光”,調(diào)出“按鈕--底”的選區(qū)如<圖7>,選擇菜單:選擇 > 修改 > 收縮,數(shù)值為3,再填充白色,按Ctrl + D取消選區(qū)。
<圖7>
<圖8>
<圖9>
5.如<圖10>在“按鈕--高光”這層添加蒙版,再用黑白漸變工具如<圖11>由上往下繪制漸變,效果如<圖12>
<圖10>
<圖11>
<圖12>
<圖13>
<圖14>
<圖15>
7.在"按鈕--底"這層上面新建一層命名為“按鈕--測光”,調(diào)出“按鈕--底”的選區(qū)如<圖16>,選擇菜單:選擇 > 修改 > 收縮,數(shù)值為1,再填充白色,用矩形選取工具適當?shù)陌堰x區(qū)向右移幾個象素如<圖19>然后按"Delete"鍵刪除選區(qū)部分如<圖20>
<圖16>
<圖19>
<圖20>
<圖21>
9.按Ctrl + J 把"按鈕--側(cè)光"復制一層,選擇:編輯> 變形 > 垂直翻轉(zhuǎn),再選擇:編輯> 變形 > 水平翻轉(zhuǎn),把翻轉(zhuǎn)后的圖片移到右側(cè)適當?shù)奈恢萌?lt;圖22>
<圖22>
10.在"按鈕--底"上面新建一層命名為“按鈕--邊”調(diào)出"按鈕--底"的選區(qū)如<圖23>,再選擇菜單:編輯 > 描邊 設置如<圖24>再按Ctrl + D 取消選區(qū)。效果如<圖25>
<圖23>
<圖24>
<圖25>
<圖26>
12.按Ctrl + J 把文字復制一層,把下面的文字隱藏,為上面文字加投影效果,設置如<圖27>,再回到下面的文字層,刪格化圖層,選擇菜單 編輯> 變形 > 垂直翻轉(zhuǎn) 把文字拖到合適的位置如<圖28>
<圖28>
13.如下圖添加蒙版用黑白漸變從上至下繪制漸變,制作文字的倒影。
<圖29>
可以根據(jù)需要制作有底紋的效果 PSD文件下載
相關文章
- 今天的教程是教給大家做一個非常有圣誕氛圍的圣誕快樂按鈕,充滿濃濃的圣誕節(jié)日氣息,小伙伴們還不快快打開PS一起來學習2021-06-16
- ps2021怎么做漂亮的漸變按鈕?ps中想要設計一款領券的按鈕,如果添加漸變色會更加顯眼,該怎么設計漸變色按鈕呢?下面我們就來看看ps按鈕樣式的設計方法,詳細請看下文介紹2021-05-27
如何設計藍色金屬按鈕?用PS設計藍色科技金屬質(zhì)感按鈕教程
很多人人物游戲按鈕只能用AI才能設計,其實不然,一些按鈕不只可以用AI設計,PS照樣可以,今天我們就教大家制作一個藍色科技金屬質(zhì)感的“play”按鈕,一起來學習吧2021-05-18- ps怎么設計配色干凈扁平化按鈕?很多時候我們會看到各種按鈕,想要設計一款顏色干凈清爽的扁平化按鈕,該怎么操作呢?下面我們就來看看ps按鈕矢量圖的設計方法,需要的朋友2021-04-08
- 怎么用PS制作按鈕形狀效果?下面這邊文章主要為大家講述了用PS制作按鈕形狀效果的教程,感興趣的小伙伴來學習吧2020-12-15
- ps怎么設計圓形的不銹鋼金屬按鈕圖標?ps中想要設計一款圓形的按鈕,該怎么設計這個按鈕矢量圖呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2019-06-30
- PS怎么設計可愛的按鈕?ps中想要設計一款可愛的按鈕,該怎么設計呢?下面我們就來看看ps設計按鈕的教程,需要的朋友可以參考下2018-10-30
- ps怎么設計逼真的玻璃質(zhì)感按鈕?ps中想要設計一款漂亮的玻璃按鈕,該怎么設計逼真透明的玻璃按鈕呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2018-09-23
- ps怎么設計創(chuàng)意的圓形按鈕?ps中想要設計按鈕,該怎么設計創(chuàng)意的按鈕圖標呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2018-08-09
- PS怎么設計左右輪播圖的按鈕?網(wǎng)頁中經(jīng)常能見到多張圖片輪播的效果,會有左右按鈕,該怎么設計這個按鈕呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2018-08-09