萬盛學電腦網

 萬盛學電腦網 >> 圖文處理 >> Photoshop教程 >> ps入門教程 >> PhotoShop簡單制作斜紋質感網頁導航按鈕教程

PhotoShop簡單制作斜紋質感網頁導航按鈕教程

  用PhotoShop制作一種斜紋質感的網頁導航按鈕效果,簡單易學。

  效果圖:

PhotoShop簡單制作斜紋質感網頁導航按鈕教程三聯教程

  大家好,下面由我來開始教如何做上圖效果的簡單按鈕:

  1.首先打開photoshop軟件,Ctrl+N新建一個10 x 10px的72dpi(分辨率)的文件:

  ①.我們先在圖層面板新建一個新的圖層,然後把背景圖層刪除(可按del鍵快捷鍵)

按此在新窗口浏覽圖片

  ②.接著在“導航器”把界面放到最大 可按ctrl+"+" 快捷鍵,然後選擇矩形選框工具,再選擇上面的“添加到選區”,然後按照下圖選出那樣的選區

  並填充(alt+delete)為白色:

按此在新窗口浏覽圖片

  ③接著按快捷鍵alt+A全選圖層,再選擇“編輯”菜單,往下看,找到“定義圖案”,確定!

按此在新窗口浏覽圖片

  2.接著再新建一個新的文件,500 x 300 px,300dpi(分辨率),確定,背景層填充為深灰色(#494949)!下面我們將開始制作按鍵!

  ①我們首先新建一個圖層,再用選框工具選出自己需要的大小按鈕,填充為黑色。

按此在新窗口浏覽圖片

相關photoshop教程:

PS制作質水晶質感網頁按鈕教程

PS制作Logo圖標按鈕教程 環形金屬質感效果

Photoshop制作精致的透明玻璃按鈕

PS制作精致的帶金屬邊框的水晶按鈕

Photoshop制作圓形金屬邊框按鈕

 

  ②.我們開始給它美化,雙擊該圖層,設置它的圖層樣式:分別設置以下的參數:

  (設置它的高光,大家可以邊設置邊留意按鈕的變化!參數可以自己來控制)

按此在新窗口浏覽圖片

  (為按鈕添加色彩、修改不透明度,可自己選擇覺得好看的顏色 :) )

按此在新窗口浏覽圖片
按此在新窗口浏覽圖片

  (圖案選擇一開始你所定義的圖案,修改參數,你也可以自制diy圖案)

按此在新窗口浏覽圖片

  (最後得出這樣的按鈕!)

按此在新窗口浏覽圖片

  ③.我們可以多制作幾個出來,用不同的顏色來表達:

按此在新窗口浏覽圖片

  ④.我們再用色塊,大的畫筆修改其不透明度,來優化一下:

  (40%不透明的黑色 的色塊)

按此在新窗口浏覽圖片

  (畫筆ctrl+T 變形的 背面襯托)

按此在新窗口浏覽圖片

  (最後加上字體)

按此在新窗口浏覽圖片

  恭喜你,完成了!一個簡單的按鈕就是這樣做出來,整體效果可能有點偏暗,大家可以通過修改參數來改變其中效果,大家不妨試一下。

相關教程:

PS制作質水晶質感網頁按鈕教程

PS制作Logo圖標按鈕教程 環形金屬質感效果

Photoshop制作精致的透明玻璃按鈕

PS制作精致的帶金屬邊框的水晶按鈕

Photoshop制作圓形金屬邊框按鈕

copyright © 萬盛學電腦網 all rights reserved