动画设计实战训练课件

动画设计实战训练主讲：DONGHUASHEJISHIZHANXUNLIAN动画设计实战训练主讲：DONGHUASHEJISHI明确Flash动画制作的一般流程。明确Flash动画制作中各种设计方法的用途。掌握综合应用各种设计方法制作高质量Flash动画的基本要领。了解Flash在社会生活各个领域的应用。教学目标:项目十动画设计实战训练项目十：

动画设计实战训练任务一任务二小结任务三任务四明确Flash动画制作的一般流程。教学目标:项目十动画设任务一数字宠物设计──制作“鱼翔浅底”任务二交互式动画制作──制作“五光十色”项目十动画设计实战训练项目十：

动画设计实战训练任务三趣味游戏开发──制作“记忆游戏”任务四辅助教学应用──制作“教学课件”任务一任务二小结任务三任务四任务一数字宠物设计──制作“鱼翔浅底”任务二交互式动画任务一数字宠物设计──制作“鱼翔浅底”任务一项目十：

动画设计实战训练任务二小结任务三任务四任务一数字宠物设计──制作“鱼翔浅底”任务一项目十：任务1.绘制鱼头任务一项目十：

动画设计实战训练任务二小结任务三任务四1.绘制鱼头任务一项目十：任务二小结任务三任务四2.绘制鱼身任务一项目十：

动画设计实战训练任务二小结任务三任务四2.绘制鱼身任务一项目十：任务二小结任务三任务四3.绘制鱼鳍任务一项目十：

动画设计实战训练任务二小结任务三任务四3.绘制鱼鳍任务一项目十：任务二小结任务三任务四4.制作动画元件任务一项目十：

动画设计实战训练任务二小结任务三任务四新建一个名为“头”的影片剪辑元件，进入该元件编辑状态。打开【库】面板，将库中名为“鱼头”的图形元件拖曳至舞台中，并使其居中到舞台。分别在第15帧和第30帧插入关键帧。选择第15帧的“鱼头”元件，打开【变形】面板，取消【约束】复选框的勾选，将垂直缩放设置为“110%”。分别在第1帧～第15帧、第15帧～第30帧创建补间动画，形成鱼儿呼吸的效果，时间轴状态。4.制作动画元件任务一项目十：任务二小结任务三任务四5.制作控制元件任务一项目十：

动画设计实战训练任务二小结任务三任务四新建一个名为“控制”的影片剪辑元件，进入该元件编辑状态，选择第

1

帧，按F9键打开【动作－帧】面板，在“脚本”窗格中输入控制代码在第2帧插入空白关键帧，并为第2帧添加控制代码。for(i=1;i<n;i++){if(i<20){

setProperty("yy"+i,_xscale,100+i-0.25*i*i);

setProperty("yy"+i,_yscale,100+i-0.25*i*i);

setProperty("yy"+i,_alpha,100-i*3);}else{…………5.制作控制元件任务一项目十：任务二小结任务三任务四6.完成动画任务一项目十：

动画设计实战训练任务二小结任务三任务四将“图层1”图层重命名为“背景”，导入“素材\项目十\制作“鱼翔浅底”\海洋.jpg”背景图片，并使其居中到舞台。打开【库】面板，在影片剪辑元件“头”上单击鼠标右键，在弹出的快捷菜单中选择【链接】命令，在弹出的【链接属性】对话框中勾选【为ActionScript导出】复选框，并在【标识符】文本框中输入“yut”，如图10-18所示。分别将影片剪辑元件“身”和“鳍”的【链接属性】对话框中的【标识符】选项命名为“yus”和“yuq”。6.完成动画任务一项目十：任务二小结任务三任务四任务二交互式动画制作──制作“五光十色”任务一项目十：

动画设计实战训练任务二小结任务三任务四打开制作模板设置“绘画笔”实例名称设置“调色笔”实例名称游戏运行效果输入控制代码设置“填充图形”实例名称①④③②⑤⑥任务二交互式动画制作──制作“五光十色”任务一项目十：1.设置“绘画笔”实例名称任务一项目十：

动画设计实战训练任务二小结任务三任务四1.设置“绘画笔”实例名称任务一项目十：任务二小结任务任务一项目十：

动画设计实战训练任务二小结任务三任务四2.设置“调色笔”实例名称选中任务一项目十：任务二小结任务三任务四2.设置“调色笔任务一项目十：

动画设计实战训练任务二小结任务三任务四3.设置“填充图形”实例名称选中选中任务一项目十：任务二小结任务三任务四3.设置“填充图形”任务一项目十：

动画设计实战训练任务二小结任务三任务四4.输入控制代码stop();//隐藏鼠标Mouse.hide();//定义并初始化颜色序号varcolorNum:uint=1;//定义颜色变量varyanse:ColorTransform=newColorTransform();//设置颜色值yanse.color=0xFF9999;//为场景添加事件，使“绘画笔”跟随鼠标移动root.addEventListener(Event.ENTER_FRAME,genshui);functiongenshui(e:Event){…………任务一项目十：任务二小结任务三任务四4.输入控制代码st任务一项目十：

动画设计实战训练任务二小结任务三任务四任务三趣味游戏开发──制作“记忆游戏”任务一项目十：任务二小结任务三任务四任务三趣味游戏开任务一项目十：

动画设计实战训练任务二小结任务三任务四1.创建图层新建一个Flash文档，设置【帧频】为“60fps”，其他文档属性保持默认设置。新建3个图层，从上到下依次重命名为“AS3.0”、“元素”和“背景”。任务一项目十：任务二小结任务三任务四1.创建图层任务一项目十：

动画设计实战训练任务二小结任务三任务四2.制作背景任务一项目十：任务二小结任务三任务四2.制作背景任务一项目十：

动画设计实战训练任务二小结任务三任务四3.添加界面元素任务一项目十：任务二小结任务三任务四3.添加界面元素任务一项目十：

动画设计实战训练任务二小结任务三任务四4.添加帧标签在“AS3.0”图层的第2帧插入关键帧，选中该帧，在【属性】面板中设置其帧标签为“playgame”。同样在该图层第3帧插入关键帧，设置帧标签为“result”任务一项目十：任务二小结任务三任务四4.添加帧标签在“任务一项目十：

动画设计实战训练任务二小结任务三任务四5.添加帧上的控制代码vargameScore:String=""; //定义用于储存游戏结果的变量play_btn.buttonMode=true;//设置为真，鼠标指针放在“开始”元件上时显示为手形play_btn.addEventListener(MouseEvent.CLICK,startGame);//添加事件//事件响应函数functionstartGame(event:MouseEvent){gotoAndStop("playgame");//跳转到“playgame”帧，即第2帧}stop(); //在该帧停止，以便接收用户的单击事件……………任务一项目十：任务二小结任务三任务四5.添加帧上的控制代任务一项目十：

动画设计实战训练任务二小结任务三任务四6.添加“卡片”元件动画代码package//声明包{importflash.display.*;//导入显示包中所有类importflash.events.*;//导入事件包中所有类

publicdynamicclassCardextendsMovieClip//定义Card类

{privatevarflipStep:uint;//用于储存翻转步数

privatevarisFlipping:Boolean=false;//用于储存翻转状态

privatevarflipToFrame:uint;//用于储存卡片翻转完成后显示的帧

//方法“开始翻转”，需要传入翻转完成后显示帧的数值

publicfunctionstartFlip(flipToWhichFrame:uint) { isFlipping=true;//设置翻转状态

flipStep=10;//设置翻转步数……………任务一项目十：任务二小结任务三任务四6.添加“卡片”元任务一项目十：

动画设计实战训练任务二小结任务三任务四7.添加“卡片”元件动画代码package//声明包{importflash.display.*;//导入显示包中所有类importflash.events.*;//导入事件包中所有类

publicdynamicclassCardextendsMovieClip//定义Card类

{privatevarflipStep:uint;//用于储存翻转步数

privatevarisFlipping:Boolean=false;//用于储存翻转状态

privatevarflipToFrame:uint;//用于储存卡片翻转完成后显示的帧

//方法“开始翻转”，需要传入翻转完成后显示帧的数值

publicfunctionstartFlip(flipToWhichFrame:uint) { isFlipping=true;//设置翻转状态

flipStep=10;//设置翻转步数……………任务一项目十：任务二小结任务三任务四7.添加“卡片”元任务一项目十：

动画设计实战训练任务二小结任务三任务四6.添加游戏主体控制代码package//声明包{ //导入将要用到的系统包和类

importflash.display.*; importflash.events.*; importflash.text.*; importflash.utils.getTimer; importflash.utils.Timer; importflash.media.Sound; importflash.media.SoundChannel;……………任务一项目十：任务二小结任务三任务四6.添加游戏主体控制任务一项目十：

动画设计实战训练任务二小结任务三任务四任务四辅助教学应用──制作“教学课件”制作L1支路的动画制作L2支路的动画制作测灯泡L1电压的动画制作测灯泡L2电压的动画制作测电源电压的动画制作知识总结的动画①②③④⑤⑥任务一项目十：任务二小结任务三任务四任务四辅助教学应任务一项目十：

动画设计实战训练任务二小结任务三任务四1.打开制作模板任务一项目十：任务二小结任务三任务四1.打开制作模板任务一项目十：

动画设计实战训练任务二小结任务三任务四2.新建图层任务一项目十：任务二小结任务三任务四2.新建图层任务一项目十：

动画设计实战训练任务二小结任务三任务四3.制作“电路动画”元件内的动画任务一项目十：任务二小结任务三任务四3.制作“电路动画”任务一项目十：

动画设计实战训练任务二小结任务三任务四5.制作用电压表测灯泡L1电压的动画效果任务一项目十：任务二小结任务三任务四5.制作用电压表测灯任务一项目十：

动画设计实战训练任务二小结任务三任务四6.制作用电压表测灯泡L2电压的动画效果任务一项目十：任务二小结任务三任务四6.制作用电压表测灯任务一项目十：

动画设计实战训练任务二小结任务三任务四7.制作用电压表测电源电压的动画效果任务一项目十：任务二小结任务三任务四7.制作用电压表测电任务一项目十：

动画设计实战训练任务二小结任务三任务四8.制作用电压表测电源电压的动画效果任务一项目十：任务二小结任务三任务四8.制作用电压表测电任务一项目十：

动画设计实战训练任务二小结任务三任务四8.制作知识总结的动画效果任务一项目十：任务二小结任务三任务四8.制作知识总结的动任务一项目十：

动画设计实战训练任务二小结任务三任务四小结作为本书最后的综合训练环节，本项目中安排了4个典型的案例。通过对这些案例的学习，读者不但可以深入掌握Flash的基本设计工具的用途和用法，还能够全面领略Flash的设计风采，真切感受到这款小巧的设计工具开创出的绚丽、动感的大场景。Flash动画的核心在于“动”和“变”，但是“动”要动出节奏，“变”要变出惊喜。这些技巧和感觉的掌握不是一朝一夕就能练就的，本书只是带领读者步入Flash动画制作的殿堂，希望读者在今后加强实践训练，博采众长，逐步积累设计经验，早日设计出优秀的作品。

任务一项目十：任务二小结任务三任务四小结动画设计实战训练主讲：DONGHUASHEJISHIZHANXUNLIAN动画设计实战训练主讲：DONGHUASHEJISHI明确Flash动画制作的一般流程。明确Flash动画制作中各种设计方法的用途。掌握综合应用各种设计方法制作高质量Flash动画的基本要领。了解Flash在社会生活各个领域的应用。教学目标:项目十动画设计实战训练项目十：

动画设计实战训练任务一任务二小结任务三任务四明确Flash动画制作的一般流程。教学目标:项目十动画设任务一数字宠物设计──制作“鱼翔浅底”任务二交互式动画制作──制作“五光十色”项目十动画设计实战训练项目十：

动画设计实战训练任务三趣味游戏开发──制作“记忆游戏”任务四辅助教学应用──制作“教学课件”任务一任务二小结任务三任务四任务一数字宠物设计──制作“鱼翔浅底”任务二交互式动画任务一数字宠物设计──制作“鱼翔浅底”任务一项目十：

动画设计实战训练任务二小结任务三任务四任务一数字宠物设计──制作“鱼翔浅底”任务一项目十：任务1.绘制鱼头任务一项目十：

动画设计实战训练任务二小结任务三任务四1.绘制鱼头任务一项目十：任务二小结任务三任务四2.绘制鱼身任务一项目十：

动画设计实战训练任务二小结任务三任务四2.绘制鱼身任务一项目十：任务二小结任务三任务四3.绘制鱼鳍任务一项目十：

动画设计实战训练任务二小结任务三任务四3.绘制鱼鳍任务一项目十：任务二小结任务三任务四4.制作动画元件任务一项目十：

动画设计实战训练任务二小结任务三任务四新建一个名为“头”的影片剪辑元件，进入该元件编辑状态。打开【库】面板，将库中名为“鱼头”的图形元件拖曳至舞台中，并使其居中到舞台。分别在第15帧和第30帧插入关键帧。选择第15帧的“鱼头”元件，打开【变形】面板，取消【约束】复选框的勾选，将垂直缩放设置为“110%”。分别在第1帧～第15帧、第15帧～第30帧创建补间动画，形成鱼儿呼吸的效果，时间轴状态。4.制作动画元件任务一项目十：任务二小结任务三任务四5.制作控制元件任务一项目十：

动画设计实战训练任务二小结任务三任务四新建一个名为“控制”的影片剪辑元件，进入该元件编辑状态，选择第

1

帧，按F9键打开【动作－帧】面板，在“脚本”窗格中输入控制代码在第2帧插入空白关键帧，并为第2帧添加控制代码。for(i=1;i<n;i++){if(i<20){

setProperty("yy"+i,_xscale,100+i-0.25*i*i);

setProperty("yy"+i,_yscale,100+i-0.25*i*i);

setProperty("yy"+i,_alpha,100-i*3);}else{…………5.制作控制元件任务一项目十：任务二小结任务三任务四6.完成动画任务一项目十：

动画设计实战训练任务二小结任务三任务四将“图层1”图层重命名为“背景”，导入“素材\项目十\制作“鱼翔浅底”\海洋.jpg”背景图片，并使其居中到舞台。打开【库】面板，在影片剪辑元件“头”上单击鼠标右键，在弹出的快捷菜单中选择【链接】命令，在弹出的【链接属性】对话框中勾选【为ActionScript导出】复选框，并在【标识符】文本框中输入“yut”，如图10-18所示。分别将影片剪辑元件“身”和“鳍”的【链接属性】对话框中的【标识符】选项命名为“yus”和“yuq”。6.完成动画任务一项目十：任务二小结任务三任务四任务二交互式动画制作──制作“五光十色”任务一项目十：

动画设计实战训练任务二小结任务三任务四打开制作模板设置“绘画笔”实例名称设置“调色笔”实例名称游戏运行效果输入控制代码设置“填充图形”实例名称①④③②⑤⑥任务二交互式动画制作──制作“五光十色”任务一项目十：1.设置“绘画笔”实例名称任务一项目十：

动画设计实战训练任务二小结任务三任务四1.设置“绘画笔”实例名称任务一项目十：任务二小结任务任务一项目十：

动画设计实战训练任务二小结任务三任务四2.设置“调色笔”实例名称选中任务一项目十：任务二小结任务三任务四2.设置“调色笔任务一项目十：

动画设计实战训练任务二小结任务三任务四3.设置“填充图形”实例名称选中选中任务一项目十：任务二小结任务三任务四3.设置“填充图形”任务一项目十：

动画设计实战训练任务二小结任务三任务四4.输入控制代码stop();//隐藏鼠标Mouse.hide();//定义并初始化颜色序号varcolorNum:uint=1;//定义颜色变量varyanse:ColorTransform=newColorTransform();//设置颜色值yanse.color=0xFF9999;//为场景添加事件，使“绘画笔”跟随鼠标移动root.addEventListener(Event.ENTER_FRAME,genshui);functiongenshui(e:Event){…………任务一项目十：任务二小结任务三任务四4.输入控制代码st任务一项目十：

动画设计实战训练任务二小结任务三任务四任务三趣味游戏开发──制作“记忆游戏”任务一项目十：任务二小结任务三任务四任务三趣味游戏开任务一项目十：

动画设计实战训练任务二小结任务三任务四1.创建图层新建一个Flash文档，设置【帧频】为“60fps”，其他文档属性保持默认设置。新建3个图层，从上到下依次重命名为“AS3.0”、“元素”和“背景”。任务一项目十：任务二小结任务三任务四1.创建图层任务一项目十：

动画设计实战训练任务二小结任务三任务四2.制作背景任务一项目十：任务二小结任务三任务四2.制作背景任务一项目十：

动画设计实战训练任务二小结任务三任务四3.添加界面元素任务一项目十：任务二小结任务三任务四3.添加界面元素任务一项目十：

动画设计实战训练任务二小结任务三任务四4.添加帧标签在“AS3.0”图层的第2帧插入关键帧，选中该帧，在【属性】面板中设置其帧标签为“playgame”。同样在该图层第3帧插入关键帧，设置帧标签为“result”任务一项目十：任务二小结任务三任务四4.添加帧标签在“任务一项目十：

动画设计实战训练任务二小结任务三任务四5.添加帧上的控制代码vargameScore:String=""; //定义用于储存游戏结果的变量play_btn.buttonMode=true;//设置为真，鼠标指针放在“开始”元件上时显示为手形play_btn.addEventListener(MouseEvent.CLICK,startGame);//添加事件//事件响应函数functionstartGame(event:MouseEvent){gotoAndStop("playgame");//跳转到“playgame”帧，即第2帧}stop(); //在该帧停止，以便接收用户的单击事件……………任务一项目十：任务二小结任务三任务四5.添加帧上的控制代任务一项目十：

动画设计实战训练任务二小结任务三任务四6.添加“卡片”元件动画代码package//声明包{importflash.display.*;//导入显示包中所有类importflash.events.*;//导入事件包中所有类

publicdynamicclassCardextendsMovieClip//定义Card类

{privatevarflipStep:uint;//用于储存翻转步数

privatevarisFlipping:Boolean=false;//用于储存翻转状态

privatevarflipToFrame:uint;//用于储存卡片翻转完成后显示的帧

//方法“开始翻转”，需要传入翻转完成后显示帧的数值

publicfunctionstartFlip(flipToWhichFrame:uint) { isFlipping=true;//设置翻转状态

flipStep=10;//设置翻转步数……………任务一项目十：任务二小结任务三任务四6.添加“卡片”元任务一项目十：

动画设计实战训练任务二小结任务三任务四7.添加“卡片”元件动画代码package//声明包{importflash.display.*;//导入显示包中所有类importflash.events.*;//导入事件包中所有类

publicdynamicclassCardextendsMovieClip//定义Card类

{privatevarflipStep:uint;//用于储存翻转步数

privatevarisFlipping:Boolean=false;//用于储存翻转状态

privatevarflipToFrame:uint;//用于储存卡片翻转完成后显示的帧

//方法“开始翻转”，需要传入翻转完成后显示帧的数值

publicfunctionstartFlip(flipToWhichFrame:uint) { isFlipping=true;//设置翻转状态

flipStep=10;//设置翻转步数……………任务一项目十：任务二小结任务三任务四7.添加“卡片”元任务一项目十：

动画设计实战训练任务二小结任务三任务四6.添加游戏主体控制代码package//声明包{ //导入将要用到的系统包和类

importflash.display.*; importflash.events.*; importflash.text.*; importflash.utils.getTimer; importflash.utils.Timer; importflash.media.Sound; importflash.me