Photoshop设计制作网站头部导航条

来源:岁月联盟 编辑:zhuzhu 时间:2009-10-13
Photoshop设计制作网站头部导航条内容简介:设计背景 先看一下看完成效果图 步骤1新建新文件,设定见下图 下一步设定前景色为#e6e0d5,背景色为#cec5af 打造顶部区域,确保前面设定的色彩准确,之后运用滤镜渲染云彩! 开始设计导航按钮,创建图层,运用矩形工

设计背景

先看一下看完成效果图

Photoshop设计制作网站头部导航条

步骤1新建新文件,设定见下图

Photoshop设计制作网站头部导航条

下一步设定前景色为#e6e0d5,背景色为#cec5af

Photoshop设计制作网站头部导航条

Photoshop设计制作网站头部导航条

打造顶部区域,确保前面设定的色彩准确,之后运用“滤镜>渲染>云彩”!

Photoshop设计制作网站头部导航条

开始设计导航按钮,创建图层,运用矩形工具,打造见下图形

Photoshop设计制作网站头部导航条

Photoshop设计制作网站头部导航条

再次创建图层,打造#ac2a2a色彩矩形

Photoshop设计制作网站头部导航条

再用单行选区工具打造按钮鼠标拖动上后的黄色滑杆

Photoshop设计制作网站头部导航条

为滑杆加上渐变样式

Photoshop设计制作网站头部导航条

Photoshop设计制作网站头部导航条

创建图层,运用椭圆选区工具,羽化设定20px,如此然后填充的黑色把会出现羽化的效果

Photoshop设计制作网站头部导航条

Photoshop设计制作网站头部导航条

Photoshop设计制作网站头部导航条

为前面的椭圆选区填充黑色,之后设定图层为"正片叠底",运用矩形选区工具删除右半区域,如此看起来红色的导航条上就出现了阴影分割效果

Photoshop设计制作网站头部导航条

拷贝前面做的椭圆阴影

Photoshop设计制作网站头部导航条

打造RSS破损纸张效果,打造2个图层,用选区勾勾出纸张的框架,一大的为白色,小的红色,假如感觉效果过于平滑,可运用滤镜来让其看起来更自然

Photoshop设计制作网站头部导航条

为白色的框架加上内阴影样式

Photoshop设计制作网站头部导航条

做完后的完成图

Photoshop设计制作网站头部导航条

此时执行最终的装饰,运用单行选区工具

Photoshop设计制作网站头部导航条

填充色彩#e6e0d5

Photoshop设计制作网站头部导航条

拷贝图层,并把它拖动到如下箭头地方,设定不透明度为20%

Photoshop设计制作网站头部导航条

最终把LOGO标志放入,一完好的网站头部导航设计就做完了

Photoshop设计制作网站头部导航条