导航在网站设计中占有举足轻重的地位,导航是整个站点中(特别是门户站)视觉的焦点和中心,其影响力仅次于Ba
er导航的成败直接影响了整个站点的表现,不管是企业站,还是Flash站点,都不应该轻视导航的设计!在这里我就大概讲一下质感类导航的制作方式!
我们可以把导航的质感分为几层,例如高光,泛光,点光,投影等,也就是基本一个实物应该具备的一些效果,把他们综合到界面上,就可以比较好的展现出界面的质感,详细请看下图!
当然这种效果的制作的方法很多,那么我就按着我的个人经验和制作习惯为大家讲解一下制作的步骤
第一步:绘制背景
f1、选择圆角矩形工具绘制背景
2、双击背景层弹出图层样式,给背景增加投影来体现一下质感
第二步:增加高光效果
1、按住CTRL键点击点击背景层小窗口把背景层的形状提取出来,绘制高光
f2、出现选区
3、新建图层,命名高光
4、选择渐变工具,绘制高光
f5、快捷键ctrlD去掉选区点击矩形选择工具删除多余的部分
f显示最终效果
6、增加高光线步骤同上把中间多余的部分删掉
第三步增加泛光
1、选择椭圆选框工具绘制一个选区
f2、选择渐变,这个步骤之前已经介绍,我们通过变形工具来进行压缩实现我们需要的泛光效果
f3、给泛光增加滤镜,高斯模糊
f放到上面显示最终效果
第四步增加内透光
1、制作步骤和增加泛光步骤基本一致,不用加滤镜,把下面的部分删除
显示最终效果
第五步增加投影
1、把泛光层从新复制一层来做投影(命名投影层)
f2、修改投影层样式,将颜色叠加颜色调成黑色
显示最终效果
第六步:增加logo投影及文字
1、导入logo图片调整大小
f2、选择logo层增加图层蒙版
3、选择渐变工具,将渐变调成黑白
f4、把背景选区的形状点出,前面有介绍
f5、ctrlshiftI进行反选删除多余的部分
6、选择横排文字工具输入文字,我用的文字是微软雅黑,字号14点
现在就大功告成了
fr