1.4 举一反三——餐饮网站广告动画
最终的效果如图1-180所示
图1-180 最终效果
STEP 01 执行“文件→新建”命令，新建一个Flash文档。单击“属性”面板上的“大小”尺寸按钮
，设置打开的“文档属性”面板上“尺寸”为400px×300px，“帧频”设置为“12”，其他设置如图1-181所示。
图1-181 设置“文档属性”面板
STEP 02 执行“插入→新建元件”命令，新建元件，设置“类型”为“图形”，名称为“遮照1”，单击“工具”面板上的“钢笔工具”按钮，在场景中绘制如图1-182所示图形。
图1-182 图形效果
STEP 03 执行“插入→新建元件”命令，新建元件，设置“类型”为“图形”，名称为“遮照1动画”将“遮照1”拖入场景中。单击“时间轴”面板上的“图层1”第80帧位置，按“F6”键插入关键帧。单击“工具”面板上的“选择工具”按钮，调整场景中元件的位置，如图1-183所示。
图1-183 图形效果
STEP 04 单击“图层1”第1帧位置，设置“属性”面板上的“补间”类型为“动画”。单击“时间轴”面板上的“插入图层”按钮，新建“图层2”，单击“图层2”第80帧位置，按“F6”键插入关键帧，执行“窗口→动作”命令，打开“动作-帧”面板，输入“stop();”语句。
STEP 05 执行“插入→新建元件”命令，新建元件，设置“类型”为“图形”，名称为“遮照2”，单击“工具”面板上的“椭圆形工具”按钮，在场景中绘制一个66px×66px的正圆，如图1-184所示。
图1-184 图形效果
STEP 06 执行“插入→新建元件”命令，新建元件，设置“类型”为“图形”，名称为“遮照2动画”将“遮照2”拖入场景中，如图1-185所示。
图1-185 新建元件
STEP 07 单击“时间轴”面板上的“图层1”第14帧位置，按“F6”键插入关键帧，单击“工具”面板上的“选择工具”按钮，调整场景中元件的位置如图1-186所示。
图1-186 图形效果
STEP 08 单击“时间轴”面板上的“图层1”第23帧位置，按“F6”键插入关键帧，单击“工具”面板上的“选择工具”按钮，调整场景中元件的位置如图1-187所示。
图1-187 图形效果
STEP 09 单击“时间轴”面板上的“图层1”第30帧，单击“工具”面板上的“任意变形工具”按钮，调整场景中元件的大小。
STEP 10 分别单击“图层1”第1帧、第14帧和第23帧位置，设置“属性”面板上的“补间”类型为“动画”。
STEP 11 执行“插入→新建元件”命令，新建元件，设置“类型”为“影片剪辑”，名称为“遮照2组”，依次新建图层，将“遮照2”元件拖入场景中，如图1-188所示，时间轴效果如图1-189所示。
图1-188 图形效果
图1-189 时间轴效果
STEP 12 执行“插入→新建元件”命令，新建元件，设置“类型”为“影片剪辑”，名称为“遮照2组动画”，依次新建图层，将“遮照2组”元件拖入场景中，如图1-190所示，时间轴效果如图1-191所示。
图1-190 图形效果
图1-191 时间轴效果
STEP 13 单击“时间轴”面板上的“场景1”标签，返回场景，单击“图层1”第1帧位置，执行“文件→导入→导入到舞台”命令，将图片“CD/第1章/image1.jpg”导入场景中，如图1-192所示。单击第520帧位置，按“F5”键插入关键帧。
图1-192 导入图片
STEP 14 单击“时间轴”面板上的“插入图层”按钮，新建“图层2”，单击“图层2”第110帧位置，按“F6”键插入关键帧，将“图形1”元件拖入场景中。
STEP 15 分别单击第219帧和第242帧位置，按“F6”键插入关键帧，单击第242帧位置，选中帧上的元件，设置“属性”面板上的“Alpha”值为“0%”。
STEP 16 分别单击“图层2”第110帧和第219帧位置，设置“属性”面板上“补间”类型为“动画”。
STEP 17 单击“时间轴”面板上的“插入图层”按钮，新建“图层3”，单击“图层3”第1帧位置，将“图形1”元件拖入场景中，设置“属性”面板上的“Alpha”值为“30%”，如图1-193所示。
图1-193 图形效果
STEP 18 单击“图层3”第110帧位置，按“F7”键插入空白关键帧。
STEP 19 单击“时间轴”面板上的“插入图层”按钮，新建“图层4”，单击“图层4”第1帧位置，将“遮照1动画”元件拖入场景中，如图1-194所示。
图1-194 图形效果
STEP 20 用鼠标右键单击“图层4”的“图层名称”，在弹出的快捷菜单中选择“遮照层”选项，如图1-195所示，时间轴效果如图1-196所示。
图1-195 选择“遮照层”选项
图1-196 时间轴效果
STEP 21 用同样的方法制作其他图层的动画，时间轴效果如图1-197所示。
图1-197 时间轴效果
STEP 22 单击“时间轴”面板上的“插入图层”按钮，新建“图层14”，单击“图层14”第110帧位置，按“F6”键插入关健帧，将“文字2”元件拖入场景中，如图1-198所示。
图1-198 图形效果
STEP 23 单击第241帧位置，按“F6”键插入关键帧，单击第126帧位置，按“F6”键插入关键帧，调整元件的位置，单击第217帧位置，按“F6”键插入关键帧，如图1-199所示。
图1-199 图形效果
STEP 24 用同样的方法制作其他层的动画。
STEP 25 执行“文件→保存”命令，按“Enter+Ctrl”组合键测试动画，如图1-200所示。
图1-200 测试动画
设计师秘笈——
如何制作精典广告
近几年，Flash越来越受广大网友的喜爱。因此，不同的商家也在自己的网站中加入了Flash动画元素，以达到增加网站的美感、动感、宣传信息的作用。下面来谈谈用Flash制作广告应注意的几个问题。
1. 以用户为出发点
浏览者在浏览某一个网站时，往往是希望该网站能够提供自己需要的信息。Flash的制作也同样要以目标用户为出发点，明确目标用户需要什么内容，如何在Flash动画中体现这样的内容，这是设计者在制作时需要考虑的问题。所以设计者在设计制作Flash动画时，需要以目标用户为出发点，明确用户需求，在制作Flash动画时重点突出，避免不必要的动画场景。
2. 明确Flash动画的目的
很多设计者在制作Flash动画时，力求将动画效果做得与众不同，很炫目。但是没有考虑到用户需要什么样的Flash动画，在Flash动画中没有明确地发映出客户的需求。在制作Flash动画时应该尊重客户的需求，以达到客户所需要的效果和所需要传达的内容为前题进行设计制作。很多浏览者在浏览Flash动画时以欣赏的角度来观看，并没有什么需求。所以在制作Flash动画时，不仅要考虑到如何有效地传达客户所要传达到信息内容，又要考虑到Flash动画的美观性。
3. 设计的连贯性
Flash动画中通常会有多个场景，在制作过程中还应该注意场景与场景之间交互应该具有一定的连贯性。场景色调的差别过大，对场景过渡的连贯性会有一定的影响，可以使用同色系的色调进行配色，使不同场景之间的色调相差不是很大，这样就得到很好的效果，即达到了不同场景之间切换的连贯性，也丰富了动画的场景。
4. 避免没有必要的介绍
有些设计者在制作Flash动画时，会加入许多没有必要的介绍性文字，影片的时间也会过长。这样就使浏览者在看Flash动画时浪费了很多时间，最后还不清楚Flash动画要表达的主题内容是什么。所以在制作Flash动画时还应该注意尽量避免加入许多不必要的介绍，突出主题内容，使浏览者一看就知道该Flash动画的主题内容是什么，表现的是什么样的中心思想。这样Flash动画也突出了主题内容，起到了宣传的作用，也节省了浏览者的时间。
5. 慎重使用声音
声音的应用在Flash动画中也比较多，可以给浏览者带来一种全新的视听感受。但是不是任何Flash动画都适合使用声音的，设计者需要根据浏览者的需求思考是否应该加入声音。但是设计者在设计Flash动画时还需要考虑到，在Flash动画中加入声音，肯定会增加最终动画文件的容量，如果添加的声音文件过大，肯定会影响到Flash动画在网络上的浏览速度。所以设计者在设计Flash动画时需要注意合适地添加声音并且能够在网络上顺畅浏览。
6. 慎重使用视频
在Flash动画中还可以导入视频文件，制作视频动画，增强宣传效果和视听感觉。但是同在Flash中导入声音一样，导入视频文件会大大增加Flash动画的容量，浏览者在网络上浏览Flash动画时，视频的下载会花去很多时间。所以设计者在制作Flash动画时，如果需要在Flash动画中加入视频，必须要考虑到浏览者在网络上浏览该Flash动画的速度问题。
7. 将绘图建立成元件
在制作Flash动画时，会在Flash中绘制很多图形，应该尽量把所绘制的图形转换为图形元件再使用，这样在制作动画时，可以很方便地使用这些图形元件，还可以使用脚本语言来调用这些图形元件，并且便于修改，从而减少了动画主时间轴的长度，简化了制作的步骤。
8. 设计的易用性
在设计制作Flash动画时，应该充分考虑到如何方便浏览者浏览动画，在Flash动画中加入一些新的功能，可以使Flash动画与众不同，但是也要考虑到浏览者在浏览该动画时是否会正常显示，否则需要安装其他的插件才能够浏览，以免使浏览者无法浏览到该Flash动画。
9. 图像格式
在制作Flash动画时，有时需要导入一些位图图像，但是导入位图会导致Flash动画文件容量增大。所在制作Flash动画过程中，如果能不使用位图，尽量不要使用位图图像，如果确实需要使用位图，也应该将导入的位图图像打散转换为矢量图形，这样可以减小所导入的位图图像的大小。
