大連網站設計|大連網站優化|大連網絡營銷
所在位置:大連網站建設 > 中酷觀點 > 網站設計 > 正文
網站建設 / 網站策劃 / 網站優化 / 網絡營銷 / 網站設計 / 常見問題

Photoshop制作金屬質感網頁界面

時間:2013年05月11日 來源:互聯網

1. 首先給大家看下整體效果。

Photoshop制作金屬質感網頁界面

2. 啟動本教程你將需要創建一個新文件。使用任何你想要的值,但是我建議你創建一個文件的最小寬度為1100*1163像素。背景填充# 252118。

Photoshop制作金屬質感網頁界面

3. 原教材玩神秘沒有寫怎么做,我用我的方法做了一下,你可以復制一個剛剛做的圖層,選擇畫筆工具,大小設成1100px,硬度0%。柔光,把這個圖層透明度調到60%就ok了.

Photoshop制作金屬質感網頁界面

4. 在中間用圓角矩形畫個995*295的圓角矩形。填充#52442b.

Photoshop制作金屬質感網頁界面

5. 復制一個上面圖形,把顏色改成#e9e9e9。

Photoshop制作金屬質感網頁界面

6. 在頁腳創建一個新的形狀。在這里,用來添加一些文本,填充#15120d. 寬度54.

Photoshop制作金屬質感網頁界面

7. 對第一個矩形做濾鏡--雜色--添加雜色,數量為3—10.

Photoshop制作金屬質感網頁界面

8. 這一步元教材說的很模糊,我是對這個矩形做的效果,新建了一個白色矩形,做的不透明度13%,用橡皮擦去掉不要的部分。

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

9. 在頁腳上邊的位置在創建一個新的矩形。在這里,用來添加一些文本,填充#15120d. 寬度252.

Photoshop制作金屬質感網頁界面

10. 現在我將創建筆記本螺旋。這相當容易。你所要做的是創造兩個很色矩形和一個長方形矩形對你做漸變疊加。組合在一起復制多個就可以了。

Photoshop制作金屬質感網頁界面

11. 輸入文本,你可以給上面的大字加下效果,下面的小字加下投影效果就好了。如圖

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

12. 用圓角工具繪制兩個按鈕,添加文本。126*34.做以下效果。

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

13. 用圓角矩形工具畫一個209*223的矩形,做內陰影和描邊效果。

Photoshop制作金屬質感網頁界面

14. 用鋼筆工具繪制下面圖形,添加文本。

Photoshop制作金屬質感網頁界面

15. 在頂部的布局我將創建一個簡單的矩形。415*281.

Photoshop制作金屬質感網頁界面

16.做以圖層樣式

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

17. 然后,我將創建一個較小的形狀381*258,圖層樣式如下圖:

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

Photoshop制作金屬質感網頁界面

18. 我的最后一個步驟是創建導航組合布局.

Photoshop制作金屬質感網頁界面

19.最后完成的效果

Photoshop制作金屬質感網頁界面

上一篇:網頁設計中的6個小技巧 下一篇:Ps設計移動APP應用類型網頁黑色風格網站

提交網站建設需求
17147期胜负彩投注率 加拿大快乐8开奖同步 p3试机号开机号试机号 大乐透走势图1000期 广西11选5开奖直播 北京幸运飞艇开奖直播 吉祥彩彩票官方网站-点击登陆 江西多乐彩任选五 排列三走势图近200期 排列五走势图彩经 彩票大赢家官方网站-点击登陆 澳洲幸运8彩票 排列5和值尾走势图30 多乐彩直播开奖 湖南幸运赛车追号计划 四川快乐12如何预测 排列五走势图开奖号码