Photoshop制作一個漂亮的網(wǎng)頁按鈕(3)

來源:未知 作者:bbs.16xx8.com 學(xué)習:321人次


作者:佚名   出處:設(shè)計聚合網(wǎng)

本教程主要使用Photoshop設(shè)計一個漂亮的網(wǎng)頁按鈕,分層的設(shè)計和質(zhì)感的表現(xiàn),整體都非常的漂亮,下面讓我們一起來學(xué)習.

讓我們一起來看看這個教程吧

Step 1

我們將首先在Photoshop創(chuàng)建一個新文檔。 讓我們有1024 × 768px

Step 2

為了填補你的背景,選擇漸變工具(G)的漸變編輯器打開了,并輸入您的顏色值按下面的圖像

Step 3

讓我們創(chuàng)造了我們的按鈕的機構(gòu)。 使用圓角矩形工具(U),現(xiàn)在只是創(chuàng)造了約320 × 95px,對5px半徑和填充任何顏色(它的矩形,因為我們將添加一個漸變疊加)。

 

我們將加強它如何給予它一些圖層樣式外觀。 首先,套用陰影。

內(nèi)發(fā)光效果…

斜面和浮雕…

最后,一個漸變疊加

Step 4

現(xiàn)在,讓我們繼續(xù)創(chuàng)造箭頭機構(gòu)。 我們將首先創(chuàng)建一個約60 × 55px的矩形使用矩形工具(U)。

繼續(xù)下去,并給它一些圖層樣式。 下面的圖片以供參考使用

為了確保它的垂直和對齊,選擇這兩個層次,其中包含按鈕和箭頭機構(gòu)(概括地講,我們只有兩個層迄今)和對齊單擊控制條垂直中心

創(chuàng)建一個小的矩形,如在下面的圖片1()。然后轉(zhuǎn)到“編輯>變換>斜交>V:30

給它同樣的圖層樣式

  
 

Step 5

使用自定義形狀工具(U)創(chuàng)建一個約30 ×箭頭。

給它一些圖層樣式根據(jù)下面的圖像

Step 6

讓我們創(chuàng)造我們的分離。 使用橢圓選框工具(M),創(chuàng)建一個類似下面的選擇。 設(shè)置你的前景色黑色(#000000),然后單擊轉(zhuǎn)移+ Backspace鍵得到填補

為了使它看起來有點模糊。 濾器“>模糊”高斯模糊 – 半徑:3.0px

請在它的左邊部分的選擇(見下面的參考)圖像,然后按下刪除

減少這層不透明度為:50%。

打開你的漸變編輯器并設(shè)置顏色值按下面的圖像。

 

在選擇分離器的層上添加單擊圖層蒙板。 然后拖動與梯度(我們剛剛成立的頂部)上下。

Step 7

創(chuàng)建另一個在左側(cè)的三維形狀,使用上面我們已經(jīng)解釋過相同的技術(shù)

Step 8

輸入字體

應(yīng)用一些圖層樣式給它。 Use the image below for reference.下面的圖片以供參考使用。

得到最終效果



學(xué)習 · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關(guān)注大神微博加入>>

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