photoshop設(shè)計(jì)網(wǎng)站導(dǎo)航圖片(4)

網(wǎng)站的頭部大多是最值得設(shè)計(jì)的地方，因?yàn)轭^部往往包含導(dǎo)航與LOGO，而且作為一個(gè)網(wǎng)站的門面，頭部也起到很關(guān)鍵的作用，可以說一個(gè)網(wǎng)站的頭部好壞往往覺得了這個(gè)網(wǎng)站設(shè)計(jì)的成功與否，本文使用PS來設(shè)計(jì)一個(gè)比較簡(jiǎn)潔的網(wǎng)站頭部效果
作者:TutorialsHot 來源:websbook.com翻譯

設(shè)計(jì)背景

先看看最終效果圖

 

第一步建立新文件，設(shè)置如下圖

 

下一步設(shè)置前景色為#e6e0d5，背景色為#cec5af

 

制作頂部區(qū)域，確保之前設(shè)置的顏色正確，然后使用“濾鏡>渲染>云彩”!

 

開始設(shè)計(jì)導(dǎo)航按鈕，新建圖層，使用矩形工具，制作如下圖形

 

再次新建圖層，制作#ac2a2a顏色矩形

 

再用單行選區(qū)工具制作按鈕鼠標(biāo)移動(dòng)上后的黃色滑桿

 

為滑桿添加漸變樣式

 

新建圖層，使用橢圓選區(qū)工具，羽化設(shè)置20px，這樣之后填充的黑色將會(huì)出現(xiàn)羽化的效果

 

為之前的橢圓選區(qū)填充黑色，然后設(shè)置圖層為"正片疊底"，使用矩形選區(qū)工具刪除右邊區(qū)域，這樣看上去紅色的導(dǎo)航條上就出現(xiàn)了陰影分割效果

 

復(fù)制之前做的橢圓陰影

 

制作RSS破損紙張效果，制作2個(gè)圖層，用選區(qū)勾畫出紙張的輪廓，一個(gè)大的為白色，小的紅色，如果覺得效果過于平滑，可以使用濾鏡來讓其看上去更自然

 

為白色的輪廓添加內(nèi)陰影樣式

 

完成后的效果圖

 

現(xiàn)在進(jìn)行最后的修飾，使用單行選區(qū)工具

 

填充顏色#e6e0d5

 

復(fù)制圖層，并將它移動(dòng)到如下箭頭位置，設(shè)置不透明度為20%

 

最后將LOGO標(biāo)志放入，一個(gè)完整的網(wǎng)站頭部導(dǎo)航設(shè)計(jì)就完成了