FLASH CS3实例通栏广告.docx
- 文档编号:27133842
- 上传时间:2023-06-27
- 格式:DOCX
- 页数:18
- 大小:1.65MB
FLASH CS3实例通栏广告.docx
《FLASH CS3实例通栏广告.docx》由会员分享,可在线阅读,更多相关《FLASH CS3实例通栏广告.docx(18页珍藏版)》请在冰豆网上搜索。
FLASHCS3实例通栏广告
FLASHCS3实例通栏广告
通栏广告是网站中最常见的广告类型之一,它以横贯页面的形式出现。
该类型广告尺寸较大,视觉冲击力强,能给网页浏览者留下深刻印象。
如图7-67示就是一个数码产品的Flash通栏广告,它以动画的形式将产品展示在浏览者面前,整个广告在色彩上采用较为绚丽的颜色,以突出产品的前卫、时尚等特点,同时,也起到吸引浏览者注意的作用。
图7-67通栏广告
制作广告开场动画
在切入到广告主题之前,可以首先为广告制作一个绚丽的开场动画,以达到吸引浏览者注意的目的,在视觉上给予强烈的冲击。
同时,也为广告的主题内容制作铺垫。
(1)在新建的空白文档中,在舞台中绘制一个彩色的圆形,如图7-68所示。
图7-68绘制图形
(2)将该圆形缩小,并在【属性】面板中设置其Alpha值为0%,如图7-69示。
图7-69设置Alpha值
(3)在第20帧处插入关键帧。
放大该圆形直至覆盖整个舞台,并设置其Alpha值为100%。
然后,创建补间动画,如图7-70所示。
图7-70创建补间动画
(4)新建“光环”图形元件,在舞台中绘制一个圆环,如图7-71所示。
图7-71绘制环形
(5)新建“环形动画”影片剪辑,将【库】面板中的“环形”图形元件拖入到舞台中,如图7-72所示。
图7-72拖入图形元件
(6)将环形缩小,设置其Alpha值为0%。
在第10帧处插入关键帧,将环形放大,设置其Alpha值为100%。
然后,创建补间动画,如图7-73所示。
图7-73创建补间动画
(7)返回场景。
新建“环形”图层,在第20帧处插入关键帧。
然后,将“环形动画”影片剪辑拖入到舞台中如图7-74所示位置。
图7-74拖入影片剪辑
(8)新建“人物”图形元件,在舞台中绘制一个弹吉它的人,并将其填充为黑色(#000000),如图7-75所示。
图7-75绘制人物
(9)返回场景。
新建“人物”图层,在第30帧处插入关键帧,将“人物”图形元件拖入到舞台中。
缩小该图形,并设置Alpha值为0%,如图7-76所示。
图7-76新建人物图层
(10)在第40帧处插入关键帧,将“人物”图形放大,移动到舞台左侧,并设置其Alpha值为100%。
然后,创建补间动画,并将第40帧后所有帧删除,如图7-77所示。
图7-77创建补间动画
(11)新建“钢琴”图形元件。
使用【线条工具】
绘制一个钢琴,并将其填充为黑色(#000000),如图7-78所示。
图7-78绘制钢琴
(12)返回场景。
新建“钢琴”图层,在第40帧处插入关键帧,将“钢琴”图形元件拖入到舞台中,缩小该图形,并设置Alpha值为0%,如图7-79所示。
图7-79新建钢琴图层
(13)在第50帧处插入关键帧,将“钢琴”图形放大,移动到舞台右侧,并设置其Alpha值为100%。
然后,创建补间动画,并将第50帧后所有帧删除,如图7-80所示。
图7-80创建补间动画
(14)新建“音符1”图形元件,绘制如图7-81所示音符形状,并将其填充为黑色(#000000)。
图7-81绘制音符1
(15)返回场景。
新建“音符1”图层,在第51帧处插入关键帧,将“音符1”图形元件拖入到舞台中,缩小该图形,并设置Alpha值为0%,如图7-82所示。
图7-82新建音符1图层
(16)在第61帧处插入关键帧,将“音符1”图形放大,移动到舞台左侧,并设置其Alpha值为100%。
然后,创建补间动画,并将第61帧后所有帧删除,如图7-83所示。
图7-83创建补间动画
(17)新建“音符2”图形元件,绘制如图7-84所示音符形状,并将其填充为黑色(#000000)。
图7-84绘制音符2
(18)返回场景。
新建“音符2”图层,在第62帧处插入关键帧,将“音符2”图形元件拖入到舞台中。
缩小该图形,并设置Alpha值为0%,如图7-85所示。
图7-85新建音符2图层
(19)在第72帧处插入关键帧,将“音符2”图形放大,移动到舞台右侧,并设置其Alpha值为100%。
然后,创建补间动画,并将第72帧后所有帧删除,如图7-86所示。
图7-86创建补间动画
(20)新建“音符3”图形元件,绘制如图7-87所示音符形状,并将其填充为黑色(#000000)。
图7-87绘制音符3
(21)返回场景。
新建“音符3”图层,在第73帧处插入关键帧,将“音符3”图形元件拖入到舞台中。
缩小该图形,并设置Alpha值为0%,如图7-88所示。
图7-88新建音符3图层
(22)在第82帧处插入关键帧,将“音符3”图形放大,移动到舞台右侧,并设置其Alpha值为100%。
然后,创建补间动画,并将第82帧后所有帧删除,如图7-89所示。
图7-89创建补间动画
(23)至此,广告的开场动画制作完成。
制作广告主题动画
广告开场动画制作完成后,接着就是要表现广告的主题内容—产品展示。
这里通过一种夸张的手法,将产品展示在浏览者面前,可以大大加深浏览者对产品的记忆。
(1)新建“背景2”图层,在第85帧处插入关键帧,绘制一个与舞台大小相同的矩形,并为其填充如图7-90所示线性渐变色。
图7-90填充线性渐变色
(2)新建“Logo”图层,在第85帧处插入关键帧,在舞台的左上角绘制一个蓝色的椭圆,并输入文字,如图7-91所示。
图7-91输入文字
(3)新建“遮罩层”图层,在第85帧处插入关键帧,在舞台中绘制一个矩形,并尽可能地缩小其宽度,如图7-92所示。
图7-92绘制矩形
(4)在第105帧处插入关键帧,将矩形放大至整个舞台。
然后,创建补间形状,并将第105帧后所有帧删除,如图7-93所示。
图7-93创建补间形状
(5)右击“遮罩层”图层,在弹出的菜单中执行【遮罩层】命令,将该图层转为遮罩层,如图7-94所示。
图7-94创建遮罩层
(6)右击“背景2”图层,在弹出的菜单中执行【属性】命令,然后启用【被遮罩】单选按钮,即将该图层转为被遮罩图层,如图7-95所示。
图7-95设置被遮罩图层
(7)新建“彩条”图形元件,在舞台绘制如图7-96所示图形。
图7-96绘制图形
(8)新建图层2,复制彩条图形至该图层的相同位置。
然后,从上到下填充透明渐变色,如图7-97所示。
图7-97填充透明渐变
(9)返回场景。
新建“彩条”图层,在第106帧处插入关键帧。
然后,将“彩条”图形元件拖入到舞台中如图7-98所示位置。
图7-98拖入图形元件
(10)新建“遮罩层”图层,在第105帧处插入关键帧。
在舞台上方绘制一个矩形,如图7-99所示。
图7-99绘制矩形
(11)在第115帧处插入关键帧,设置矩形高度,使其覆盖整个彩条。
然后,创建补间形状,如图7-100所示。
图7-100创建补间形状
(12)右击“遮罩层”图层,在弹出的菜单中执行【遮罩层】命令,将其转为遮罩层,如图7-101所示。
图7-101创建遮罩层
(13)新建“mp4”图形元件,将素材图像“mp4.psd”导入到舞台中。
返回场景,新建“mp4”图层,在第120帧处插入关键帧。
然后,将“mp4”图形元件拖入到舞台中如图7-102所示位置。
图7-102拖入图形元件
(14)缩小“mp4”图形元件,设置其Alpha值为0%。
在第130帧处插入关键帧,移动该元件至如图7-103所示位置,放大该元件,并设置其Alpha值为100%。
图7-103设置Alpha值
(15)创建补间动画。
然后,在【属性】面板中设置【旋转】为“顺时针2次”,如图7-104所示。
图7-104设置旋转
(16)新建“透明矩形”影片剪辑,在舞台中绘制一个Alpha值为20%的白色矩形,如图7-105所示。
图7-105绘制透明矩形
(17)新建“反光”影片剪辑,将“透明矩形”元件拖入到舞台中,并将其倾斜。
然后,为其添加模糊滤镜效果,如图7-106所示。
图7-106添加模糊效果
(18)在第15帧处插入关键帧,移动该矩形至如图7-107所示位置。
然后,创建补间动画。
图7-107创建补间动画
(19)返回场景。
新建“反光”图层,在第130帧处插入关键帧,将“反光”影片剪辑拖入到舞台如图7-108所示位置。
图7-108拖入影片剪辑
(20)右击“mp4”图层第130帧,执行【复制帧】命令。
新建“遮罩层”图层,右击该图层第130帧,执行【贴粘帧】命令。
然后,设置该图层为遮罩层,如图7-109所示。
图7-109复制帧
制作广告结尾动画
产品展示给浏览者后,同时需要一个结尾动画来突出该产品的特点,这里采用的是动感的音符和活泼的文字效果。
(1)新建“动感音符1”影片剪辑,绘制一个蓝色(#0099FF)的音符,然后在第3帧和第5帧处插入关键帧,并修改其位置及颜色,如图7-110所示。
图7-110创建动感音符1
(2)新建“动感音符2”影片剪辑,绘制一个绿色(#99CC33)的音符,然后在第3帧和第5帧处插入关键帧,并修改其位置及颜色,如图7-111所示。
图7-111创建动感音符2
(3)新建“动感音符3”影片剪辑,绘制一个橙色(#FF9900)的音符,然后在第3帧和第5帧处插入关键帧,并修改其位置及颜色,如图7-112所示。
图7-112创建动感音符3
(4)新建“动感音符”影片剪辑,将“动感音符1”影片剪辑拖入到舞台中。
然后,单击【添加运动引导层】按钮
创建引导层,如图7-113所示。
图7-113建引导层
(5)在引导层中绘制一条曲线。
选择图层1,移动动感音符1到曲线始点,在第22帧处插入关键帧,移动动感音符1到曲线终点,然后创建补间动画,如图7-114所示。
图7-114创建引导动画
(6)使用同样的方法,为动感音符2和动感音符3创建引导动画,如图7-115所示。
图7-115创建引导动画
(7)返回场景。
新建“音符”图层,在第135帧处插入关键帧,将“动感音符”影片剪辑拖入到舞台中如图7-116所示位置。
然后,在第155、160帧处插入关键帧。
图7-116创建音符图层
(8)新建“文字1”图层,在舞台右上方输入“我的音乐”文字,并将其倾斜。
在第150帧处插入关键帧,移动文字,创建补间动画,如图7-117所示。
图7-117创建补间动画
(9)在第153帧处插入关键帧,将文字旋转为水平方向,然后创建补间动画,如图7-118所示。
图7-118旋转文字方向
(10)新建“文字2”图层,在第154帧处插入关键帧,在舞台右侧输入文字。
在第160帧处插入关键帧,移动文字,并创建补间动画,如图7-119所示。
图7-119创建补间动画
(11)至此通栏广告制作完成,保存文档后预览动画,如图7-67所示。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- FLASH CS3 实例 通栏广告 通栏 广告