當(dāng)前位置：首頁>ps實(shí)例教程>ps網(wǎng)頁設(shè)計(jì)>按鈕圖標(biāo)>教程內(nèi)容

photoshop制作精致的AMP調(diào)節(jié)器按鈕

來源：ps教程論壇作者：bbs.16xx8.com 學(xué)習(xí)：610人次

我很喜歡一些具有皮革界面的應(yīng)用程序，對于這方面的教程，我一直思考了很長的時(shí)間，所以今天我學(xué)到了這個(gè)方法，并教給你們我是如何做到的
      所以在本教程中，我會教你如何制作一個(gè)amp控制器，僅僅在photoshop中實(shí)現(xiàn)

      第1步
      打開photoshop，創(chuàng)建一個(gè)新文檔，我使用2560X1440px，然后填充背景層為灰色

第2步
打開濾鏡，紋理，龜裂紋，間距，深度，亮度分別設(shè)置為9,2,10

第3步
進(jìn)入圖層樣式，選擇顏色疊加，顏色選擇黑色，混合模式為正片疊底，不透明度70%

第4步
打開色階對話框，黑灰白滑塊分別調(diào)整為120,1.00,181

第5步
使用橢圓工具，在中心畫一個(gè)圓

第6步
選擇漸變工具，并把漸變的樣式設(shè)置成下圖這樣

第7步
添加一個(gè)新圖層，選擇角度漸變，在圖層中填充下圖一樣的漸變色。之后打開第5步畫好的圓的選區(qū)

第8步
點(diǎn)擊圖層>圖層蒙版>顯示選區(qū)

第9步
復(fù)制圓的這一層，并填充為白色，并使他在所有圖層之上，之后改變不透明度為0%（這里先不改為0%，否則看不到圖層樣式的效果，改完圖層樣式后再改為0%，除此之外，老外在這里說的不對，一下的圖層樣式在設(shè)置萬之后要提出來，成為獨(dú)立的圖層，也就是右鍵樣式，創(chuàng)建圖層，不這樣的話，圖層的樣式會隨著不透明度為0，而看不見）

第11步
打開圖層樣式，選擇內(nèi)陰影，白色，顏色減淡的混合模式，不透明度為70%，角度為90，其他設(shè)置如下，注意等高線的改變

第12步
選擇內(nèi)發(fā)光，混合模式為疊加，白色，不透明度為36%，該源為居中，其他設(shè)置如下，注意等高線的改變

第13步
選擇斜面和浮雕，樣式為浮雕效果，方法為平滑，陰影中的高光模式和陰影模式的混合效果設(shè)為顏色減淡和正片疊底，其他設(shè)置如下圖所示

第14步
再復(fù)制圓的圖層，并放在最上，確保他是白色的，點(diǎn)擊濾鏡>像素化>銅板雕刻，類型為精細(xì)點(diǎn)

第15步
將圓的選取選中，濾鏡>模糊>徑向模糊，數(shù)量為20，方法為旋轉(zhuǎn)，質(zhì)量最好

第16步
混合模式改為正片疊底

第17步
選擇所有制作按鈕/調(diào)諧器的層，并將他們歸組，之后復(fù)制這個(gè)組，并改變新組的大小，調(diào)成成如下圖所示

第18步
選擇組中有圖層樣式的圖層，選擇顏色疊加，顏色為黑色，正片疊底的混合模式，不透明度為45%

第19步
給大小兩個(gè)圓都坐上陰影

第20步
使用矩形工具，創(chuàng)建一個(gè)正方形，之后旋轉(zhuǎn)45度，像下圖

第21步
打開圖層樣式，選擇陰影，黑色，模式正常，不透明度100%，角度使用120度，其他設(shè)置如下

第22步
選擇內(nèi)發(fā)光，白色，混合模式為顏色減淡，不透明度70%，其他設(shè)置如下，注意我的等高線

第23步
選擇顏色疊加，從深紅到淺紅，混合模式正常，其他設(shè)置如下圖

第24步
之后的效果就是這樣，這的確很不錯(cuò)，但看上去太統(tǒng)一了，不夠真實(shí)

第25步
為了改變，給圖像增加一些金屬質(zhì)感

第26步
給我們的兩個(gè)圓添加金屬質(zhì)感吧！

第27步
接著我們來給圖像添加一些皮革質(zhì)感將他放在圖片的下部，像這樣：

第28步
用矩形工具創(chuàng)建一些小方塊，并且旋轉(zhuǎn)他們，知道你做的和下圖一樣。提示：從最上面的方塊開始，復(fù)制到底部，在將上面的和底下的一起復(fù)制，并旋轉(zhuǎn)90度，這樣就有四個(gè)了，用四個(gè)再復(fù)制，以此類推

第29步
合并所有的小方塊，打開圖層樣式，選擇內(nèi)發(fā)光，正片疊底的混合模式，黑色，不透明度100%，其他的設(shè)置如下所示

第30步
選擇斜面和浮雕，使用枕狀浮雕，方法選擇雕刻柔和，高光為顏色減淡，陰影為顏色加深，其他設(shè)置如圖所示

第31步
選擇漸變疊加，還是與先前同樣的漸變，用顏色減淡的混合模式，不透明度為40%

第32步
選擇圖案疊加，圖案是開始的金屬板，要做到這一點(diǎn)很簡單，打開金屬板的圖像，選擇自定義圖像即可

第33步
在頂部新建一個(gè)圖層，確保選中了小方塊的選取，然后給小方塊涂上紅色

第34步
用DymaxionScript字體，添加一些文字，我柵格化了文字，使底部的線延伸至屏幕兩端

第35步
打開圖層樣式，選擇陰影，選擇黑色，正片疊底的混合模式，不透明度100%，其他設(shè)置如下

第36步
選擇內(nèi)陰影，白色，混合模式為濾色，其他設(shè)置如下，注意我的等高線

第37步
選擇內(nèi)發(fā)光，黑色，混合模式為顏色加深，源設(shè)置為邊緣，注意等高線，其他設(shè)置如下

第38步
選擇漸變疊加，漸變效果如下，混合模式為正片疊底，他基本上是從白灰色到暗灰色到黑色到白色再到暗灰色

第39步
你可以使用金屬紋理，可以在頂部也添加一些文字，下面所示是完成這一切的結(jié)果

結(jié)論
在本教程中，我們創(chuàng)建了一個(gè)漂亮的復(fù)古的調(diào)節(jié)器，用到了基本的圖層樣式，和金屬紋理，正如你看到的，這僅僅是從現(xiàn)實(shí)中做實(shí)物參考，然后再photoshop中實(shí)現(xiàn)它。在下面的圖層中，我還增加了一線光線效果