收藏 分销(赏)

传智播客网页平面设计学院-网页设计-网页导航制作 2.doc

上传人:s4****5z 文档编号:8048209 上传时间:2025-02-01 格式:DOC 页数:12 大小:739.05KB
下载 相关 举报
传智播客网页平面设计学院-网页设计-网页导航制作 2.doc_第1页
第1页 / 共12页
传智播客网页平面设计学院-网页设计-网页导航制作 2.doc_第2页
第2页 / 共12页
传智播客网页平面设计学院-网页设计-网页导航制作 2.doc_第3页
第3页 / 共12页
传智播客网页平面设计学院-网页设计-网页导航制作 2.doc_第4页
第4页 / 共12页
传智播客网页平面设计学院-网页设计-网页导航制作 2.doc_第5页
第5页 / 共12页
点击查看更多>>
资源描述

1、导航在网站设计中占有举足轻重的地位,导航是整个站点中(特别是门户站)视觉的焦点和中心,其影响力仅次于Banner!导航的成败直接影响了整个站点的表现,不管是企业站,还是Flash站点,都不应该轻视导航的设计!在这里我就大概讲一下质感类导航的制作方式!我们可以把导航的质感分为几层,例如高光,泛光,点光,投影等,也就是基本一个实物应该具备的一些效果,把他们综合到界面上,就可以比较好的展现出界面的质感,详细请看下图!当然这种效果的制作的方法很多,那么我就按着我的个人经验和制作习惯为大家讲解一下制作的步骤第一步:绘制背景1、选择圆角矩形工具绘制背景2、双击背景层弹出图层样式,给背景增加投影来体现一下质

2、感第二步:增加高光效果1、按住CTRL键点击点击背景层小窗口把背景层的形状提取出来,绘制高光2、出现选区3、新建图层,命名高光 4、选择渐变工具,绘制高光5、快捷键ctrl+D去掉选区 点击矩形选择工具删除多余的部分显示最终效果6、 增加高光线步骤同上把中间多余的部分删掉第三步:增加泛光1、 选择椭圆选框工具绘制一个选区2、 选择渐变,这个步骤之前已经介绍,我们通过变形工具来进行压缩实现我们需要的泛光效果3、 给泛光增加滤镜,高斯模糊放到上面显示最终效果第四步:增加内透光1、制作步骤和增加泛光步骤基本一致,不用加滤镜,把下面的部分删除显示最终效果第五步:增加投影1、 把泛光层从新复制一层来做投影(命名投影层)2、 修改投影层样式,将颜色叠加颜色调成黑色显示最终效果第六步:增加logo投影及文字1、 导入logo图片调整大小2、选择logo层增加图层蒙版3、 选择渐变工具,将渐变调成黑白4、 把背景选区的形状点出,前面有介绍5、 ctrl+shift+I进行反选删除多余的部分6、 选择横排文字工具输入文字,我用的文字是微软雅黑,字号14点现在就大功告成了

展开阅读全文
部分上传会员的收益排行 01、路***(¥15400+),02、曲****(¥15300+),
03、wei****016(¥13200+),04、大***流(¥12600+),
05、Fis****915(¥4200+),06、h****i(¥4100+),
07、Q**(¥3400+),08、自******点(¥2400+),
09、h*****x(¥1400+),10、c****e(¥1100+),
11、be*****ha(¥800+),12、13********8(¥800+)。
相似文档                                   自信AI助手自信AI助手
搜索标签

当前位置:首页 > 百科休闲 > 其他

移动网页_全站_页脚广告1

关于我们      便捷服务       自信AI       AI导航        获赠5币

©2010-2025 宁波自信网络信息技术有限公司  版权所有

客服电话:4008-655-100  投诉/维权电话:4009-655-100

gongan.png浙公网安备33021202000488号   

icp.png浙ICP备2021020529号-1  |  浙B2-20240490  

关注我们 :gzh.png    weibo.png    LOFTER.png 

客服