教大家用Photoshop制作網(wǎng)站頂部導(dǎo)航(5)
來源:作者:佚名 來源:網(wǎng)頁教學(xué)網(wǎng)
作者:admin
學(xué)習(xí):797人次
我又來教大家用Photoshop了,今天的實(shí)例是用ps制作網(wǎng)站,上次教了做模板,今天我們就來學(xué)ps頂部導(dǎo)航,網(wǎng)站的頭部大多是最值得設(shè)計的地方,因 為頭部往往包含導(dǎo)航與LOGO,作為一個網(wǎng)站的門面,頭部也起到很關(guān)鍵的作用,可以說一個網(wǎng)站的頭部好壞往往覺得了這個網(wǎng)站設(shè)計的成功與否,本文使用PS 來設(shè)計一個比較簡潔的網(wǎng)站頭部效果。最終效果:
第一步建立新文件,設(shè)置如下圖
制作頂部區(qū)域,確保之前設(shè)置的顏色正確,然后使用“濾鏡>渲染>云彩”!
新建圖層,使用橢圓選區(qū)工具,羽化設(shè)置20px,這樣之后填充的黑色將會出現(xiàn)羽化的效果
現(xiàn)在進(jìn)行最后的修飾,使用單行選區(qū)工具
第一步建立新文件,設(shè)置如下圖
下一步設(shè)置前景色為#e6e0d5,背景色為#cec5af
制作頂部區(qū)域,確保之前設(shè)置的顏色正確,然后使用“濾鏡>渲染>云彩”!
開始設(shè)計導(dǎo)航按鈕,新建圖層,使用矩形工具,制作如下圖形
再次新建圖層,制作#ac2a2a顏色矩形
再用單行選區(qū)工具制作按鈕鼠標(biāo)移動上后的黃色滑桿
為滑桿添加漸變樣式
新建圖層,使用橢圓選區(qū)工具,羽化設(shè)置20px,這樣之后填充的黑色將會出現(xiàn)羽化的效果
為之前的橢圓選區(qū)填充黑色,然后設(shè)置圖層為"正片疊底",使用矩形選區(qū)工具刪除右邊區(qū)域,這樣看上去紅色的導(dǎo)航條上就出現(xiàn)了陰影分割效果
復(fù)制之前做的橢圓陰影
制作RSS破損紙張效果,制作2個圖層,用選區(qū)勾畫出紙張的輪廓,一個大的為白色,小的紅色,如果覺得效果過于平滑,可以使用濾鏡來讓其看上去更自然
為白色的輪廓添加內(nèi)陰影樣式
完成后的效果圖
現(xiàn)在進(jìn)行最后的修飾,使用單行選區(qū)工具
填充顏色#e6e0d5
復(fù)制圖層,并將它移動到如下箭頭位置,設(shè)置不透明度為20%
最后將LOGO標(biāo)志放入,一個完整的網(wǎng)站頭部導(dǎo)航設(shè)計就完成了
- 相關(guān)教程
- TA的教程
- 收藏
- 返回
- 教大家用Photoshop
- ps制作網(wǎng)站
- ps頂部導(dǎo)航
學(xué)習(xí) · 提示
相關(guān)教程
推薦教程
- Photoshop制作網(wǎng)頁搜索條
- Photoshop教程:像素化細(xì)節(jié)設(shè)計技巧
- banner教程,用ps制作960*90的廣告圖片
- Photoshop設(shè)計網(wǎng)站用的藍(lán)色導(dǎo)航圖框
- PS教程:設(shè)計導(dǎo)航鼠標(biāo)懸停狀態(tài)小效果
- Photoshop精細(xì)制作Vista風(fēng)格網(wǎng)站導(dǎo)航條
- 陰影效果,教你制作各類陰影教程
- 用ps制作豎列導(dǎo)航
- 界面設(shè)計,設(shè)計音樂播放器界面圖片
- Photoshop制作網(wǎng)站導(dǎo)航圖
關(guān)注大神微博加入>>
網(wǎng)友求助,請回答!