萬盛學電腦網

 萬盛學電腦網 >> 圖文處理 >> Photoshop教程 >> ps入門教程 >> PhotoShop圖層樣式的妙用網頁設計簡單實用教程

PhotoShop圖層樣式的妙用網頁設計簡單實用教程

  圖層樣式是每個設計師都常用的功能,合理巧妙的應用能大大的節省我們的工作時間,提高工作效率,

  今天我來分享一下平時工作中對圖層樣式應用的一點技巧,希望對新手有點幫助,我們的目標:簡單實用。

  一、按鈕篇

  在制作頁面的按鈕時,我們希望保證設計風格的情況下,能夠最大程度適應各類修改情況,比如:尺寸,色調,形狀的修改等等。

  下面來談談幾種風格按鈕的制作方法

PhotoShop圖層樣式的妙用網頁設計簡單實用教程 三聯教程

  網站上最常見的按鈕,用圖層樣式來做也最簡單:漸變疊加+投影,沒難度。

  下面再來一個比較常見,有兩明暗雙描邊的按鈕。

按此在新窗口浏覽圖片

  OK,我們再進階一下,之前做的第二個按鈕是四邊都有高光的,那只有頂部有高光按鈕用圖層樣式又應該怎麼做呢?

按此在新窗口浏覽圖片

  看到木!只需將內發光改為內陰影就可以自由的控制光源啦,上下高光都可以有!

  有同學問了:“如果要制作頂部底部雙高光的效果怎麼辦呢?” 哼哼,通過樣式一樣可以解決,瞅下面:

按此在新窗口浏覽圖片

  由此可見,陰影,描邊,內發光,內陰影,漸變疊加,顏色疊加,浮雕是制作按鈕的法寶,一些常規做法中要建2-3個圖層的效果,通過圖層樣式

  直接就可以實現了,這樣做的好處就是有利於後期修改,大大提高工作效率。

  OK,下面讓我們來看看圖層樣式在制作其他設計元素中的作用吧。

  二、其他應用

  1、明暗交界線

按此在新窗口浏覽圖片

  常規做法:明線、暗線、背景各建一個圖層,現在只要三個樣式就搞定了,而且長短大小都可以很方便的變化。同樣的方法也可以用來制作表格線條哦

  (當然,也只是相對方便一點,建議表格還是結合其他軟件一起制作吧。)

  2、圖標的內外描邊

按此在新窗口浏覽圖片

  具體的數值就不再一一列出了,大家自己研究下吧

  通過以上的一些舉例,我們可以發現,雖然每個樣式設置都很簡單,但通過不同的組合就可以滿足我們大多數的設計需要,合理的運用能大大提高

  我們的工作效率。希望以上的經驗能對新手朋友有一定的啟發和幫助,謝謝。

copyright © 萬盛學電腦網 all rights reserved