5.1静态BANNER的制作(2).docx

5.1静态BANNER的制作(2)
5.1静态BANNER的制作(2)

编辑整理：

尊敬的读者朋友们：
这里是精品文档编辑中心，本文档内容是由我和我的同事精心编辑整理后发布的，发布之前我们对文中内容进行仔细校对，但是难免会有疏漏的地方，但是任然希望（5.1静态BANNER的制作(2)）的内容能够给您的工作和学习带来便利。同时也真诚的希望收到您的建议和反馈，这将是我们进步的源泉，前进的动力。
本文可编辑可修改，如果觉得对您有帮助请收藏以便随时查阅，最后祝您生活愉快 业绩进步，以下为5.1静态BANNER的制作(2)的全部内容。

文 化 理 论 课 教 案（首页）
20 15 ～ 20 16 学年第 一 学期
课程名称: 网页美工 任课教师： 谭荣生
共 5 页
科目
网页美工
第五章一节
课题：静态BANNER按钮的制作（2)
授课 日期
11.15
课时
2
班级
高计1431
授课方式
讲授法、演示法、
作业题数
1
拟用时间
30`
教学目的
掌握商业网站静态BANNER的制作方法与技巧。
选用教具挂图
多媒体
重点
静态BANNER的制作的操作过程
难点
静态BANNER的制作的操作过程
教学回顾

说明

审阅签名：
教学过程
第 1 页
第五章一节 静态BANNER按钮的制作（2）
一、课堂导入
主要使用Photoshop CS5软件中的渐变、多边形、直线、文字工具,结合图层样式来制作某商业网站的广告，效果如图5—5所示。

二、新课讲授
（1）启动Photoshop CS5软件，新建宽度、高度为580像素x145像素的文件.
（2）新建图层，命名为“背景图像”，单击“渐变工具”飘按钮，在属性栏中选择“线性渐变"，
并单击渐变编辑条,设置紫红色(R:128；G:27;B:66)到浅紫红(R：201;G：137；B：150）的线性渐
变，从文档上部向下拖曳，为背景图像填充颜色。效果如图5-6所示。

（3)新建图层，重新命名为“柄”，单击“直线工具"ld按钮,在属性栏中选择“填充像素”模
式，并设置粗细为4像素，设置前景色为粉红色（R：248；G:206；B：220），绘制一根从左至右斜上的直线，效果如图5—7所示。

(4)新建图层，命名为“星形”，单击“多边形工具”；氅按钮，并在属性栏中单击自定义形状工
具旁的下拉按钮，勾选“星形”和“平滑边缘”选项，并设置边数为5。保持“填充像素"模式和前景色不变，绘制一个星形,按住Ctrl键的同时单击图层面板上的星星层,得到星星选区,单击“渐变工具"飘按钮，设置浅粉红（R:253；G：194；B：213）到深粉红（R:237；G：154;B:182）的线性渐变，并从星星左上角向右下角拖曳,效果如图5-8所示。

(5）新建图层，命名为“高光1”，将前景色设置为白色（快捷方法：按下D键，再按下X键即
可)，按住Ctrl键的同时单击图层面板上的星星层，得到星星选区,单击“画笔工具"碉鼍按钮，单击属性栏上画笔大小设置按钮,选择画笔形状和大小。再次单击画笔属性栏上的画笔设置按钮，
在打开的面板中设置画笔的形状动态为“渐隐”，在星星上涂抹出高光效果,最终效果如图5-9
所示．

（6)新建图层，命名为“高光2”，用同样的方法绘制高光,并将图层透明度调整为500/0，最终
效果如图5—10所示.

（7）选中高光2、高光1、星形层，按下组合键Ctrl+E,将这三层合并.合并后的图层重命名为
“星星”，按住Alt键的同时，拖动星星，复制多个星星,将复制的星星拖动到合适的位置，确认当前图层为需要修改大小的星星图层，按组合键Ctrl+T，此时星星图形周围将出现八个控制柄，拖动控制柄，修改星星大小，将所有星星层合并成一层,最终效果如图5—11所示。

（8)单击“文字工具”？王j按钮，并打开“字符”面板，设置字体为黑体、加粗，字符大小为30号，在相应的位置输入“开心好礼，填表就送！”的文字,效果如图5-12所示。
（9)再次单击“文字工具”按钮，设置文字字体为黑体、加粗,大小为14号,输入文字“现
在只要您填表申请任意一张华夏信用卡,即可获得‘开心填表礼’.开心好礼,轻松可得！”，调整文字位置，效果如图5—13所示。

(10）执行“文件”—-—“打开”菜单命令，在对话框中选择“素材1”文件，单击“魔棒工具”l蜀按钮，单击图像中白色背景部分，这时白色区域被选定，按组合键Ctrl+Shift+l反选，得到包选区,如图5-14所示。

按组合键Ctrl+C复制，回到源文件中，按组合键Ctrl+V粘贴,调整包的大小和位置，新图层命名为包。效果如图5-15所示.

（11)用同样的方法将素材2、素材3放入文件中，调整好合适的大小和位置,并分别命名为“手机”层和“腕表”层，将手机层放置到最上层,腕表层放置到包的下一层。效果如图5-16所示。

(12）双击包所在的层，弹出“图层样式"对话框，勾选“投影"选项，设置相应参数，勾选“外发光”选项，设置相应参数，如图5—17所示.

（13）在图层面板中，选择包所在的图层，右击,选择“复制图层样式”命令，分别右击“腕表”
层和“手机"层，选择“粘贴图层样式"命令。最终效果如图5-18所示。
侄务2 动态黪ANN飘鬏的制作
掌握动态BANNER的制作方法与技巧.
本例主要使用Flash CS5软件中的补间动画及遮罩技术来制作动感的动态广告条，该BAN—
NER效果如图5—19所示。

三、课堂小结
本次主要通过实操“商业网站静态BANNER的制作方法与技巧,进一步提高学生的动手操作能力。
四、作业
上机操作如下动态导航条：