Zi 字媒體

Photoshop製作清爽綠色風格網頁模板 這一次的教學是屬於PS教程領域中的設計教程的相關教學。 文章出處是來自PSDTemplate的PS教程類文章，寫教學的作者是站碼翻譯，感謝站碼翻譯提供設計教程的實作教學。 教學大綱: 本教程主要用Photoshop來設計一張綠色調風格網頁模板,網頁美工設計的朋友可以一起來觀賞學習,模板的製作的重點在於網站的板式搭配和顏色的搭配. 設計教程教學開始 本教程主要用Photoshop來設計一張綠色調風格網頁模板,網頁美工設計的朋友可以一起來觀賞學習,模板的製作的重點在於網站的板式搭配和顏色的搭配.下面讓我們一起來學習吧. PS：翻譯作者要求，如需轉載，請勿打各站水印，希望尊重原創 先看看完整的網頁布局效果： 現在我們開始教程。 01。創建一個1020px X 1060px的文件。 02。下一步，我們將改變背景顏色。用油漆桶工具，填補背景層顏色：＃e3dec1 03。選擇矩形工具，繪製出以下尺寸形狀：1022X173和填充黑色（＃343434） 04。接下來，我選擇選擇一個如下的矢量圖片素材，類似的都行，並將透明度設置為23％。 05。現在，選擇矩形工具（U）和添加形狀（244 × 119），使用下面的顏色＃a3cb31。  06。下一步使用矩形工具，創建另一個形狀，尺寸：239X130，然後處理成下列圖層樣式：（投影和漸變效果，如下圖） 處理效果如下： 07。下一步將是增加該網站的logo。 看看下面的效果吧： 08。完成logo后，在右邊添加一些標語文字。 09。下面開始製作導航目錄，選擇矩形工具來創建一個形狀（1022X46），並添加下面層的樣式效果。 如下圖，將導航條和上方的頭部保持1~2px的間距（將導航條像下移動）。預覽： 10。下添加一個鼠標選中和當前頁面的效果。用橢圓工具（背景設置為白色），並制訂一個小的形狀。如下： 11。應用高斯模糊（濾鏡>模糊>高斯模糊）與15px半徑。 12。在這一步驟中將添加一些導航文本。 13。因為我們的導航欄看上去有點空，我們在右側再添加個搜索框。選擇矩形工具，添加一個尺寸：255 × 26的框，設置層樣式：(內投影) 看看下面的效果： 現在來裝飾導航。 14。選擇矩形工具，繪製出形狀（在導航欄）在下方：1022X32。顏色填充：＃c0de7a 15。現在添加一些其他素材。 16。如下圖中的圖型。 向上移動，如下圖，主要圖層擺放關係。 17。接下來，我會重複複製素材（層>複製層）。 下面效果： 18。步驟重複5-7次以上，下面全部覆蓋就可以了，然後把每個層的透明度設置為16％就差不多了~~ 下面開始製作中間的宣傳部分 19。選擇矩形工具，並創建一個具有以下尺寸形狀：1022 x 178。使用這種顏色：＃80ad0a 20。在形狀中創建一個循環使用橢圓工具 21。選擇矩形工具，選擇如綠色背景高度。 22。按Ctrl + Alt +I（反向選擇），然後按下刪除。刪除多餘部分： 23。現在修飾一下這個部分吧，你需要在中間放一個向日葵，在兩邊添加一些矢量裝飾圖和一些文本 效果看看吧： 其他部分都好了~ 在做下面的主要內容部分。 24。選擇矩形工具，繪製出形狀。尺寸: 969×563 25。然後應用投影樣式： 26。下面添加一些文章，並添加一些裝飾。如下： 27。現在製作右邊的部分，選擇矩形工具，並創建一個矩形，尺寸：275×508，並應用圖層樣式： 所有需要做的是添加一些圖片和一些文字。現在主要領域就完成了。 28。下面製作底部，在頁腳需要添加一些版權信息，您可以添加一些矢量圖片裝飾。 看看下圖： 這樣本教程已經結束了。教程寫的有點簡單，希望大家喜歡。 –本文轉載自 http://www.missyuan.net 教學網 — 文章永久連結為: Photoshop製作清爽綠色風格網頁模板 免費PPT模板下載  免費PPT模板下載  免費向量素材下載  免費矢量圖片下載  免費去背圖片下載  免費圖庫下載  免費音效下載  版权所有，保留一切权利！ © 2019 PS筆刷工廠