1、Flash项目案例教程项目项目1:制作电子贺卡:制作电子贺卡 教学目标教学目标 绘图工具的使用 文字工具的使用 基本动画的设计与制作 电子贺卡制作 培养设计与审美能力教学重点教学重点 作品的整体构思与设计 基本工具的使用 基本动画的设计与制作教学目标教学目标 1.Flash CS3基础 2.绘图工具的使用 3.文字工具的使用教学重点教学重点 1.flash动画制作过程 2.基本工具的使用1、Flash CS3的功能、特点的功能、特点功能:功能:绘图功能绘图功能:Flash CS3可以完成图形绘制、特殊字形处理等方面的工作。动画功能动画功能:Flash CS3提供的动画工具可以制作出漂亮的动画。
2、编程功能编程功能:制作Flash交互式动画。Flash CS3提供了几百个关键词,可完成复杂的行为制作。知识讲授 特点:特点:使用矢量图形 支持导入音频、视频 采用流式播放技术,拥有强大的网络传播能力 交互性强,能更好地满足用户的需要2、Flash CS3动画制作的基本步骤动画制作的基本步骤1)动画策划2)收集素材3)制作动画4)调试动画5)测试动画6)发布动画 3、Flash CS3工作界面工作界面 4、Flash CS3文件操作 文件的新建保存打开关闭5、基本绘图工具的使用 在Flash动画制作过程中,会大量地运用到矢量图形。Flash提供了各种绘图工具,可以绘制出自由形状或准确的线条、形
3、状和路径一些简单的矢量图,并可用来对对象进行上色。Flash的工具箱如下图所示:选择工具部分选取工具套索工具钢笔工具文本工具线条工具矩形工具铅笔工具刷子工具任意变形工具颜料桶工具橡皮擦工具缩放工具墨水瓶工具滴管工具手形工具笔触颜色填充颜色吸附工具颜色设置与转换1.选择工具选择工具:选择工作区中的图像或文字等对象。2.部分选取工具部分选取工具:选择锚点和贝塞尔曲线并变形。3.任意变形工具任意变形工具:可以对对象进行旋转、倾斜、和扭曲操作;里面包括的渐变变形工具可以对对象的颜色渐变填充进行变形操作。4.套索工具套索工具:允许用户自定义范围来完成对对象的选择。5.钢笔工具钢笔工具:用来绘制精确的直线
4、或曲线。6.文本工具:文本工具:用来建立和编辑文本。7.线条工具:线条工具:用于绘制直线。8.矩形工具:矩形工具:绘制椭圆形、正圆形、矩形、多角星形等。9.铅笔工具:铅笔工具:徒手绘图工具,绘制自由的线条。10.刷子工具:刷子工具:表现笔刷描绘的图像效果。11.墨水瓶工具墨水瓶工具:修改边线的颜色。12.颜料桶工具颜料桶工具:修改填充的颜色。13.滴管工具:滴管工具:吸取颜色。14.橡皮擦工具橡皮擦工具:擦除图像的填充色和外轮廓。15.手形工具:手形工具:对工作区整体做移动。16.缩放工具:缩放工具:放大或缩小画面。17.笔触颜色:笔触颜色:设定边线的颜色。18.填充颜色:填充颜色:设定填充的
5、颜色。19.颜色设置与转换:颜色设置与转换:设置默认的笔触和填充颜色、笔触和填充颜色的转换等。20.吸附工具:吸附工具:贴紧至对象。【选择工具】用来选择并移动目标,修改目标形状的轮廓,按住“Ctrl”键可在轮廓上添加节点并改变线条的形状。选择对象是最基本的操作,只有在选择了目标对象后,才能够对其进行所需的编辑操作。1.选择单一目标对象(1)单击工具箱中的选择工具。(2)移动鼠标指针至目标对象上单击,选中目标。注:当指向的目标对象为元件、图像和组合后的图形时,选择的是一个完整的目标;当指向目标为矢量图形时,Flash只选择最近两个交点(或端点)间的线段;当指向为填充色彩时,自动以色彩封闭的边缘为
6、限选择色彩范围,如图1-12所示:a.对象为元件、图像或组合图形 b.对象为矢量图形 c.选择边缘封闭线 2.选择多个对象(1)框选法:在目标位置的左上角按住左键拖动鼠标至目标对象的右下角,将目标对象的所有内容框选在矩形区域内。释放鼠标左键,当前图层矩形范围内的所有对象都会被选中。(2)首先选中一个对象,然后按住Shift键单击其他对象即可。3.移动顶点移动顶点当目标为矢量图形时,单击选择工具,当鼠标指针移动到对象的顶点时,鼠标指标会发生变化,这时按住鼠标左键并拖动鼠标,即可改变顶点的位置,如下图所示:4.将直线变为曲线将直线变为曲线 单击选择工具,将鼠标放到对象的边缘,鼠标指针会发生变化,这
7、时按住鼠标左键并拖动鼠标,如下图所示:5.增加顶点增加顶点 单击选择工具,当鼠标指针下方出现一个弧线的标志时,按住Ctrl键和鼠标左键进行拖动,到适当位置释放鼠标,就可增加一个顶点,如下图所示:其他工具使用具体见教材其他工具使用具体见教材 技能拓展技能拓展 自己选定一个主题使用flash的绘图工具绘出一幅静态图 项目项目1:制作电子贺卡:制作电子贺卡教学目标教学目标 1.元件、库的使用 2.绘图工具的使用 3.文字工具的使用教学重点教学重点 1.逐帧动画制作方法 2.补间动画制作方法知识讲授知识讲授 一、元件库的基本使用一、元件库的基本使用 元件是存放在库中可被重复使用的图形、按钮或者动画,【
8、库】面板是放置和组织元件的地方。要使用元件时,直接把元件从库中拖入到舞台上,此时舞台上的这个对象称为该元件的一个实例。实例是指在舞台上或者嵌套在另一个元件内部的元件副本,用户可以修改它的颜色、大小和功能而不会影响元件本身。1.元件类型元件类型1)影片剪辑2)按钮3)图形2.创建元件创建元件1)直接创建2)将已有对象转换为元件3)将已有动画转换为元件3.库库 库中除了可以放置与管理元件外,还可以把其他素材直接导入到库中进行重复使用。调用其他动画的库调用其他动画的库公用库公用库Flash CS3在公用库中还放了很多元件,分别存放于“学习交互”、“类”和“按钮”三个不同的库中,用户可以直接使用。二、
9、简单动画制作二、简单动画制作1、基本概念、基本概念1)动画原理2)时间轴 3)图层 图层,分普通层、引导层等。普通图层就像没有厚度的透明纸,上图层的图形可以覆盖下图层的图形。4)帧 帧是组成Flash动画最基本的单位,一帧即一副画面。帧,分普通帧、关键帧和空白关键帧。5)场景 6)舞台2、洋葱皮工具、洋葱皮工具 在时间轴控制区域下方的 就是洋葱皮工具,该工具在动画的制作和编辑过程中非常有用,利用它可同时看到多个帧的动画状态:“绘图纸外观绘图纸外观”按钮按钮 :按下该按钮可显示游标内各帧 的原始图形“绘图纸边框绘图纸边框”按钮按钮 :按下该按钮后可同时显示游标 内除当前帧外的所有帧的轮廓图“编辑
10、多帧编辑多帧”按钮按钮 :按下该按钮后可同时编辑游标 范围内的所有关键帧的画面“修改标记修改标记”按钮按钮 :单击该按钮将打开一个下拉菜 单,在该菜单中可设置洋葱皮工具的显示范围、显示标记和固定绘图纸等。3、简单动画制作、简单动画制作 简单动画主要包括逐帧动画逐帧动画与补间动画补间动画。1)逐帧动画)逐帧动画 逐帧动画又称为“帧帧动画”,它是一种简单而常见的动画形式,其原理是通过“连续的关键帧”分解动画动作,也就是说连续播放含有不同内容的帧来形成动画。创建逐帧动画的几种方法创建逐帧动画的几种方法(1)用导入的静态图片建立逐帧动画(2)绘制矢量逐帧动画(3)文字逐帧动画(4)导入序列图像 逐帧动
11、画实例逐帧动画实例-马走马走 2)补间动画)补间动画 补间动画是我们在Flash动画中应用最多的一种动画制作模式,只需要绘制出关键帧,就能自动生成中间的补间过程,插入补间动画后两个关键帧之间的插补帧是由计算机自动运算而得到的。Flash CS3提供了运动补间和形状补间两种补间动画。a、运动补间动画运动补间动画 运动补间动画是实例属性变化过渡的一种动画,是根据两个关键帧中大小、位置、旋转、倾斜和透明度等属性的差别由Flash计算并自动生成的一种动画类型,通常用于表现同一图形对象的移动、放大、缩小以及旋转等变化。运动补间动画首尾两帧上的对象,必须是元件实例,且必须是同一个元件的实例。除了元件,组合
12、体或文本也可作为制作动作补间动画的对象。实例:心跳动动画实例:心跳动动画b、形状补间动画、形状补间动画 形状动画也称形变动画,通常用于表现不同图形对象之间的自然过渡。在一个时间点(关键帧)绘制一个形状,然后在另一个时间点(关键帧)更改该形状或绘制另一个形状,Flash 根据二者之间的帧的值或形状来创建中间帧。在制作形状补间动画时,需要注意其与动作补间动画正好相反,制作形变的起止对象要求一定都是形状,不能是元件、成组对象、文字对象和位图对象,所以对于在各关键中创建的对象,除了直接在舞台中绘制的图形外,其他的如果是使用别的元件在舞台中创建形变动画,一定要先将其打散。实例:桃心实例:桃心-“爱爱”字
13、转变字转变 技能拓展技能拓展 1、使用逐帧动画制作一个人物表情变化过程 2、使用运动补间制作一个跳动的小球 3、使用形状补间制作一个写有自己姓名的文本变形动画项目项目1:制作电子贺卡:制作电子贺卡 1.工具的综合应用 2.培养需求分析能力 3.动画的设计与制作 4.声音合成 5.培养设计与审美能力1.作品的整体构思与设计2.基本动画的设计与制作3.合成输出知识讲授知识讲授 一、一、需求分析需求分析 体现出新春喜气的主题意境 画面图案及颜色搭配合理、具有美感及喜庆感 有一定的动画效果 配置合适的音乐 二、贺卡主体设计二、贺卡主体设计 新年是喜庆的,为了体现表示出喜庆的氛围,贺卡主体色设计为以红黄
14、为主。贺卡由两部分组成,开场画面和贺卡主画面,当运行电子贺卡时,首先进入开场画面,点击开场画面上的一个按钮进入贺卡主画面,并给贺卡配上了喜庆的音乐,让人看了听了能感受到新年到来的喜悦之情。1、开场、开场 1)导入一副处理好的喜庆的图片素材作为背景 2)做一个“Happy New Year”的文字动画。3)导入一副处理好的小女孩放鞭炮的画面放在背景上的合适位置 4)下方放置一个按钮,放上文字“go”,当点击这个go按钮则进入贺卡主体画面。在点击go按钮前“Happy New Year”的文字动画循环播放。2、贺卡主体、贺卡主体 1)导入一副处理好的喜庆的图片素材作为背景。2)在顶部放置四个灯笼,
15、制作四个灯笼到“新年快乐”四个字的变形动画,反复播放。3)导入处理好的一串鞭炮图片放置在左边,制作从左边画外进入的动画效果。4)导入处理好的中国结图片放置在正中,并制作从下边画外进入的动画效果。5)使用文字工具在中国结上输入一个“福”字,并制作渐入的动画效果。6)使用文字工具在另边输入一副竖放的对联“虎啸青山千里锦、风拂绿柳万家春”,使用了阴影滤镜效果,如图9所示,并制作从右边画外进入的动画效果。7)导入处理好的老虎图片放置在右下边,并制作从右边画外进入的动画效果。8)导入处理好的小老虎图片放置在左下边,并制作从左边画外进入的动画效果。在进入贺卡主体时,四个灯笼到“新年快乐”四个字的变形动画,
16、反复播放。从3)到8)的动画依次进播放,并且只播放一次。3、音乐合成、音乐合成 为了获得更好的效果,给贺卡配置喜庆的音乐。把音乐放到贺卡中进行合成,并设置为循环播放。三、三、动画设计动画设计1、“Happy New Year”的文字动画设计的文字动画设计 “New Year”中的每个字母都由缩放做成由到大小,由透明到不透明的淡入动画效果,然后按顺序一个一个的显示出来,最后“Hpaay”作为一个整体做成相同的动画效果显示出来,当动画播完后,整个文字都停留一会再重复播放。文字动画做好后作为影片剪辑元件放在背景图片上。2、灯笼与文字互变动画、灯笼与文字互变动画 四个灯笼在一定时间内同时变化为“新年快
17、乐”四个字,停留一会,又由“新年快乐”四个字变化为四个灯笼,再停留一会,继续变成四个字,就这样反复播放。3、贺卡主体中的其他动画、贺卡主体中的其他动画 贺卡中的其他动画都是运动动画,主要由改变素材的位置而形成的。几副素材图片按顺序由不同的方向进入主体画面。鞭炮由左边进入,中国结由下边进入,福字渐入,对联从右边进入,大老虎从右边进入,小老虎从左边进入。四、素材准备四、素材准备-绘制灯笼绘制灯笼 1、收集图片与音乐 2、绘制灯笼 五、动画制作五、动画制作1、“Happy New Year”的文字动画制作使用运动补间制作2、灯笼与文字互变动画、灯笼与文字互变动画使用形状补间制作使用形状补间制作3、贺
18、卡总体制作、贺卡总体制作开场画面制作开场画面制作主体贺卡画面制作主体贺卡画面制作六、合成导出六、合成导出1、声音合成、声音合成 1)插入新图层,命名为“声音一”。从库中把鞭炮声音音乐拖入舞台,在属性面板中的“同步”设为“循环”。2)用同样的方法把“声音二”添加到贺卡中,如下图所示。2、测试输出、测试输出贺卡做好后,按Ctrl+Enter进行测试效果。1)执行【文件】|【导出】|【导出影片】命令,打开“导出影片”对话框。2)在“保存在”下拉列表框中选择文件保存的位置,在“文件名”下拉列表中输入文件保存的名称“电子贺卡”,在“保存类型”下拉列表框中选择保存类型,默认情况下为swf格式。技能拓展技能
19、拓展-生日贺卡制作生日贺卡制作 为了巩固在本项目中学到的知识,下面将进行技能拓展练习,本次拓展练习为制作一个如下图所示的生日贺卡。1、开场,在开场画面中,有背景、彩带、植物、一个小女孩、一个桌子、一个插着蜡烛的蛋糕。小女孩睁着眼,手分开,笑着看着蛋糕上燃着的蜡烛。2、然后进行许愿。用逐帧动画制作小女孩双手并拢,闭上眼睛进行许愿。3、许完愿,小女孩睁开眼睛,吹灭蜡烛,小女孩的此动作和蜡烛的熄灭都由逐帧动画完成。4、小女孩的父母相继出场,祝福小女孩,跟着唱起生日歌。5、最后彩条飘下来,大家拍掌开心的笑着。6、合成音乐,包括背景音乐、吹蜡烛的声音、生日歌、拍掌声。部分图片如下图所示。项目二:制作广告
20、(一)项目二:制作广告(一)教学目标分类管理元件和图层补间动画的设计与制作广告设计思路教学重点元件和图层的管理掌握广告设计的思路准备知识基本绘图工具的使用 图层和元件的基本用法教学方法 1、讲授法 利用多媒体计算机教室,教师和学生示范演练同步操作,及时解决制作难题;在课堂上注意教学做结合,教师与学生互动,充分调动学生的积极性,培养学生的动手能力与职业技能,提高学生学习的积极性和团队合作意识与沟通能力。2、案例教学法 对于典型项目中的核心技能用生动、直观的案例进行导入。比如在本案例中,利用小鸟的各种动画效果来达到歌曲的意境;3、启发式教学法 学生掌握案例的制作方法后,对案例涉及的知识技能进行拓展
21、提问,启发学生去思考,使学生能够举一反三,拓宽动画设计思路;教学过程 1、任务布置 (1)明确客户需求教学过程 1、任务布置(2)收集素材资料 根据客户要求,收集和整理素材是制作整个动画的第一步也是最关键的一步,但是这也是最容易被人忽视的一个步骤。素材的收集方法包括以下几种方式:客户提供、网上收集、自行设计。教学过程 2、知识讲授 广告设计思路:网络广告是随着近年来互联网的兴起而逐渐产生的一种宣传方式,网络广告是指通过Internet,利用WWW在网页上所发布,或者是指通过电子邮件等电子文档形式所发出的网络信息,这些网络信息通常包括文字、图形图像、动画、视频和声音,又被称为Web AD。广告设
22、计方案 根据本次案例中的客户需求,我们可以确定本次所需制作的广告类型为品牌广告类的片头广告,在设计的过程中,采用说服感化式,并使用感知效应的创意方法来设计本次的广告。教学过程 2、知识讲授元件与图层的规范使用 所谓元件和图层的规范使用,简单来说就是要针对不同的元件和不同的图层进行命名。这个地方所说到的命名并不是说随便给个名字就可以,是要依据当前的元件或者图层所涉及到的内容进行有意义的命名。动画类型 在FLASH中,有两种基本类型的动画,一种是补间动画,另一种称为逐帧动画。在本项目中主要采用的是动画补间用于图形及元件的动画和逐帧动画。教学过程 3、遮罩动画设计与制作 遮罩动画:是flash中很实
23、用且最具潜力的功能,利用不透明的区域和这个区域以外的部分来显示和隐藏元素,从而增加了运动的复杂性,一个遮罩层可以链接多个被遮罩层。在本项目中主要使用了遮罩动画以切换不同的背景。案例效果如下所示:教学过程 4、学生操作 略 5、技能拓展 学生可以根据课堂学习知识,设计不同题材的网络广告的设计方案。6、总结考核 通过本次课,主要让学生巩固了基本动画的设计与制作,强调对元件和图层的规范化管理,并对网络广告的相关知识做了详细的讲解。在教学过程中,除了考核记录学生的课堂完成情况,还考评学生的课外作业完成能力。项目二:制作广告(二)项目二:制作广告(二)教学目标引导动画的设计与制作简单脚本控制语句的使用教
24、学重点引导动画的设计与制作简单脚本控制语句的使用准备知识基本绘图工具的使用 图层和元件的基本用法教学方法 1、讲授法 利用多媒体计算机教室,教师和学生示范演练同步操作,及时解决制作难题;在课堂上注意教学做结合,教师与学生互动,充分调动学生的积极性,培养学生的动手能力与职业技能,提高学生学习的积极性和团队合作意识与沟通能力。2、案例教学法 对于典型项目中的核心技能用生动、直观的案例进行导入。比如在本案例中,利用小鸟的各种动画效果来达到歌曲的意境;3、启发式教学法 学生掌握案例的制作方法后,对案例涉及的知识技能进行拓展提问,启发学生去思考,使学生能够举一反三,拓宽动画设计思路;教学过程 1、知识讲
25、授 引导动画 单纯依靠设置关键帧,有时仍然无法实现一些复杂的动画效果,有很多运动是弧线或不规则的,如月亮围绕地球旋转、鱼儿在大海里翱翔等,在Flash中能不能做出这种效果呢?答案是肯定的,这就是“引导路径动画”。引导动画:可以自定义对象运动路径,可以通过在对象上方添加一个运动路径的层,在该层中绘制运动路线,而让对象沿路线运动,而且可以将多个层链接到一个引导层,使多个对象沿同一个路线运动。这种动画可以使一个或多个元件完成曲线或不规则运动。教学过程 创建引导路径动画的用法 创建引导层和被引导层 一个最基本“引导路径动画”由二个图层组成,上面一层是“引导层”,它的图层图标为,下面一层是“被引导层”,
26、图标同普通图层一样。在普通图层上点击时间轴面板的“添加引导层”按钮,该层的上面就会添加一个引导层,同时该普通层缩进成为“被引导层”,如图所示。教学过程 引导层和被引导层中的对象广告设计思路:引导层是用来指示元件运行路径的,所以“引导层”中的内容可以是用钢笔、铅笔、线条、椭圆工具、矩形工具或画笔工具等绘制出的线段。而“被引导层”中的对象是随着引导线走的,可以使用影片剪辑、图形元件、按钮、文字等,但不能应用外形。由于引导线是一种运动轨迹,“被引导”层中最常用的动画形式是动作补间动画,当播放动画时,一个或数个元件将沿着运动路径移动。教学过程 应用引导路径动画的技巧 “被引导层”中的对象在被引导运动时
27、,还可作更细致的设置,比如运动方向,把【属性】面板上的【路径调整】前打上勾,对象的基线就会调整到运动路径。而假如在【对齐】前打勾,元件的注册点就会与运动路径对齐。引导层中的内容在播放时是看不见的,利用这一特点,可以单独定义一个不含“被引导层”的“引导层”,该引导层中可以放置一些文字说明、元件位置参考等,此时,引导层的图标为。在做引导路径动画时,按下工具栏上的【对齐对象】功能按钮,可以使“对象附着于引导线”的操纵更轻易成功。过于陡峭的引导线可能使引导动画失败,而平滑圆润的线段有利于引导动画成功制作。被引导对象的中心对齐场景中的十字星,也有助于引导动画的成功。教学过程 应用引导路径动画的技巧 向被
28、引导层中放入元件时,在动画开始和结束的关键帧上,一定要让元件的注册点对准线段的开始和结束的端点,否则无法引导,假如元件为不规则形,可以按下工具栏上的任意变形工具,调整注册点。假如想解除引导,可以把被引导层拖离“引导层”,或在图层区的引导层上单击右键,在弹出的菜单上选择【属性】,在对话框中选择“正常”作为图层类型。假如想让对象作圆周运动,可以在“引导层”画个圆形线条,再用橡皮擦去一小段,使圆形线段出现2个端点,再把对象的起始、终点分别对准端点即可。引导线答应重叠,比如螺旋状引导线,但在重叠处的线段必须保持圆润,让Flash能辨认出线段走向,否则会使引导失败。教学过程 动画声音合成 导入到FLAS
29、H里的声音文件,一般都用FLASH支持的MP3和WAV。导入方法:执行“文件/导入”命令。在打开的导入对话框中,选择你要导入的声音文件,按“打开”按钮。导入的声音最初并不出现在时间轴上。同组件一样,导入的声音在库中,需要时我们可以随时使用这个声音。教学过程 简单脚本控制语句的使用-Go to 跳转到指定的帧 -Play 播放 -Stop 停止 -Toggle High Quality 在高画质和低画质间切换 -Stop All Sounds 停止所有声音的播放 -Get URL 跳转至某个超链接-FSCommand 发送FSCommand命令 -Load Movie 装载影片 -Unload
30、Movie 卸载影片 -Tell Target 告知目标 -If Frame Is Loaded.判断帧是否被完全载入 -On Mouse Event 鼠标事件 教学过程 2、学生操作 略 3、技能拓展 学生可以根据课堂学习知识,熟悉遮罩动画和引导动画的设计与制作技巧。4、总结考核 通过本次课,主要让学生巩固了基本动画的设计与制作,详细讲解了引导动画的设计与制作,并介绍了声音合成和简单控制语句的使用。在教学过程中,除了考核记录学生的课堂完成情况,还考评学生的课外作业完成能力。项目二:制作广告(三)项目二:制作广告(三)教学目标故事情节设计镜头切换设计教学重点故事情节设计镜头切换设计准备知识基本
31、绘图工具的使用 图层和元件的基本用法 遮罩动画的制作与应用 简单控制语句的使用教学方法1、讲授法 利用多媒体计算机教室,教师和学生示范演练同步操作,及时解决制作难题;在课堂上注意教学做结合,教师与学生互动,充分调动学生的积极性,培养学生的动手能力与职业技能,提高学生学习的积极性和团队合作意识与沟通能力。2、案例教学法 对于典型项目中的核心技能用生动、直观的案例进行导入。比如在本案例中,利用小鸟的各种动画效果来达到歌曲的意境;3、启发式教学法 学生掌握案例的制作方法后,对案例涉及的知识技能进行拓展提问,启发学生去思考,使学生能够举一反三,拓宽动画设计思路;4、任务驱动项目教学法 把真实的企业项目
32、作为工作任务引入课堂,引导学生在完成任务的过程中模拟进入岗位角色,并以公司的工作制度、工作流程来要求学生完成作品的创作。5、分组教学法 由学生分组模拟企业开发团队,完成动画设计与制作,强化学生的团队协作能力教学过程 1、知识准备 元件和库面板的使用 遮罩动画的使用 简单控制语句的使用 声音合成教学过程 动画制作 设计主体动画;1)确认需要用到的三张背景图片并做相应处理 教学过程 2)导入欧莱雅的图标 3)导入制作滚动动画时所需的8张图片 4)导入背景音乐 教学过程 动画制作 设计滚动动画 1)设计三张背景图片的出现方法和出现时间;第一张背景图片出现时间为第1帧到第119帧,出现方法为遮罩出现,
33、具体操作方法详见2.2.3 遮罩动画及引导层动画的设计与制作中的遮罩动画实例。第二张背景图出现时间为第88帧到第214帧,这里请注意,在第一张背景图和第二张背景图直接有一段交叉的时间,即第88帧到第119帧,在这段时间内,制作第一张背景图逐渐消失的补间动画,以及第二张背景图的逐渐展现的补间动画。第三张背景图出现时间为第195帧到第580帧,从第195帧到第214帧之间与第一张背景图和第二张背景图的交替效果设置一样 教学过程 2)设计背景图片上面的点缀小动画,以逐帧动画和补间动画的形式出现;3)添加文本,以补间动画的方式设置动画效果。文本动画与点缀动画类似,均以补间或者逐帧动画的形式制作,涉及到
34、的知识点在第一章中曾做了详细讲解,这里也不再赘述,请参考源文件制作。引导线答应重叠,比如螺旋状引导线,但在重叠处的线段必须保持圆润,让Flash能辨认出线段走向,否则会使引导失败。教学过程 设计最后停顿画面动画效果 以影片剪辑元件的模式制作滚动动画,其中采用了遮罩动画效果,使得呈现滚动效果;教学过程 动画控制与输出 (1)动画控制 使用补间动画以放大的方式显示宣传语,停顿一段时间之后放置于右上角作为整个动画的LOGO。在滚动动画的影片剪辑实例上设置脚本程序:on(rollOver)stop();on(rollOut)play();使得当鼠标移动到滚动图片的时候,动画静止下来,以便能够看清楚图片
35、内容;当鼠标移开的时候,动画继续播放。在整个图层上新建一个图层命名为“停止”,在该图层的最后一帧添加一个关键帧,并对帧设置脚本程序:stop();使得动画在此时停止循环播放。教学过程 动画控制与输出 (2)添加背景音乐 新建一个图层命名为“背景音乐”,并将库面板中MP3音乐拖动到场景中即可。(3)动画优化与导出 将动画设计与制作完成之后,需要对动画进行优化和导出。单击文件菜单下的发布设置,弹出对话框,根据自己的动画发布需要进行设置即可。教学过程 4、学生操作 略 5、技能拓展 为了让读者巩固在本项目中学到的知识,下面将进行技能拓展练习,本次拓展练习为根据提供的项目订单,设计符合要求的动画效果。
36、6、总结考核 通过本项目,主要让学生巩固了基本动画的设计与制作,强调对元件和图层的规范化管理,以及根据客户需求设计动画效果。由于是采用的分组教学,因此在操作过程中,除了考核记录学生的个人完成情况,还特别考评了学生的小组合作意识和能力,将个人成绩和团队成绩综合成最终评定成绩。项目三:制作项目三:制作Flash MV(一)(一)教学目标了解MV制作的准备工作了解动画中的角色掌握鼠标绘图方法与技巧掌握人物角色动画制作方法掌握动物角色动画制作方法教学重点掌握人物角色动作制作方法掌握动物角色动画制作方法准备知识 基本绘图工具的使用 使用鼠标绘图 基本动画制作教学方法 1、讲授法 利用多媒体计算机教室,教
37、师和学生示范演练同步操作,及时解决制作难题;在课堂上注意教学做结合,教师与学生互动,充分调动学生的积极性,培养学生的动手能力与职业技能,提高学生学习的积极性和团队合作意识与沟通能力。2、案例教学法 对于典型项目中的核心技能用生动、直观的案例进行导入。比如在本案例中,利用小鸟的各种动画效果来达到歌曲的意境;3、启发式教学法 学生掌握案例的制作方法后,对案例涉及的知识技能进行拓展提问,启发学生去思考,使学生能够举一反三,拓宽动画设计思路;教学过程 1、任务布置 (1)需求分析体现出MV中的角色MV中动画尽量符合音乐意境动画效果流畅有基本的控制按钮(2)收集素材资料 在前期策划阶段,需要选择用于MV
38、的歌曲,本次选择赵传演唱的“我是一只小小鸟”,确立MV的风格为卡通系列,确定MV要表现的情节内容:一只小鸟想要飞翔,却总是不能入愿,但它并没有放弃,而是相信风雨过后会有彩虹。确定好情节后,可以去搜集制作所需要的场景、文字、声音等,也可以自己制作的矢量背景,本次项目中有一些是自己设计制作的,有一些图片素材是搜集的。教学过程 2、知识讲授 在制作动画时,常常需要在场景中绘制大量的图形,这些图形大多需要用户自己绘制,若用户没有使用鼠标绘图(以下简称鼠绘)功底,或鼠绘的能力不强,绘制出的图形就不会那么完美。因此,掌握一定的鼠绘技巧是制作动画的重要前提之一。(1)鼠绘常用快捷键:略,祥见教材。(2)鼠绘
39、的常用方法:几何图形法、移动组合法、辅助上色法(3)常见鼠绘风格:古典风格、远近风格、四季风格教学过程 3、动画设计 1)人物角色动画(1)制作头部动画,如下图所示:教学过程(2)制作走路动画,如下图所示:教学过程 (3)制作跑步动画,如下图所示:教学过程 2)动物角色动画(1)制作小鸟飞翔的动画,效果如下图所示:教学过程(2)制作游动的鱼,最终动画效果如下图所示:教学过程 4、学生操作 略 5、技能拓展 学生可以根据课堂学习掌握的技巧,绘制一些类似的人物动画,如转身,跳舞等;动物动画如马儿奔跑,雄鹰展翅等。6、总结考核 通过本次课,主要让学生了解鼠标绘图,掌握一定的鼠绘能力,并熟悉人物的基本
40、动作动画制作方法与技巧,动物的基本动画制作等。在教学过程中,除了考核记录学生的课堂完成情况,还考评学生的课外作业完成能力。项目三:制作项目三:制作Flash MV(二)(二)教学目标掌握基本的自然现象动画制作方法与技巧了解Flash视频的导入了解Flash MV的特点了解Flash MV的制作流程掌握Flash MV的优化与管理教学重点基本自然现象动画的制作Flash MV的优化与管理准备知识 基本自然现象的动画特点 Flash 视频格式 Flash MV的特点教学方法 1、讲授法 利用多媒体计算机教室,教师和学生示范演练同步操作,及时解决制作难题;在课堂上注意教学做结合,教师与学生互动,充分
41、调动学生的积极性,培养学生的动手能力与职业技能,提高学生学习的积极性和团队合作意识与沟通能力。2、案例教学法 对于典型项目中的核心技能用生动、直观的案例进行导入。比如在本案例中,利用小鸟的各种动画效果来达到歌曲的意境;3、启发式教学法 学生掌握案例的制作方法后,对案例涉及的知识技能进行拓展提问,启发学生去思考,使学生能够举一反三,拓宽动画设计思路;教学过程 1、知识讲授 1)Flash中可导入的视频格式如果在Windows系列操作系统中安装了DirectX9.0或其更高版本,则在导入嵌入视频时可支持的视频文件格式为:.mpeg/.mpg、.avi以及.wmv和.asf(Windows媒体文件)
42、。当导入系统不支持的视频文件格式时,Flash会打开一个提示信息对话框,说明不能完成导入。对于某些视频文件,Flash只能导入其中的视频部分而无法导入其中的音频部分,这时Flash也会打开一个提示信息对话框,指出无法导入文件音频部分。教学过程 2)Flash MV的特点 1.动画文件小是Flash的基本特点,一个时长为一分钟的普通动画MV,其文件大小一般都低于1MB,因此非常便于在网络上传播。2.相对于电视MV来说,Flash MV的制作费用要低很多。因此制作的时候不需要大量的工作人员,也可以制作出优秀的MV。3.表现形式多样化,有Q版风格的,也有完全用手绘制作的。不同的表现形式有着不同的风格
43、,让观众有着不同的感受。4.Flash非常适合个人进行创作,只要掌握基本的动画知识,会熟练使用Flash软件,就能制作出完整的MV。教学过程 3)Flash MV的制作流程 (1)前期策划 (2)收集素材 (3)制作动画要素 (4)制作声音和动画 (5)测试并发布 4)Flash MV的优化与管理(1)镜头特效(2)动画风格(3)文件平衡教学过程 2、动画设计 1)风雨动画制作雪和雨动画的制作方式大同小异,雨的形态和雪不一样,下落的轨迹不同。雨是直线快速下落,而雪是以曲线轨迹缓慢下落。风是看不见的气流,生活中只能通过感官和其他参照物才能体会,动画作品中采用线条来表现。效果如下图所示:教学过程
44、2)雷电动画制作雷电动画速度很快,颜色多以亮色为主。可以逐帧制作动画,也可以通过黑白画面的快速切换来表现。一个闪电多在1秒钟内完成从产生到消失的过程。因为声音比光的传播速度要慢,在制作动画时,雷声基本放在闪电结束后出现。而且过程中往往还会下雨,因此本实例接着前面的下雨的效果来做。效果如下图所示:教学过程 3)火动画的制作 火的动画属于不规则的曲线运动,原因是火焰在燃烧时极易受到外界条件的影响。效果如下图所示:教学过程 4)云雾云雾 云、雾是潮湿空气在上升过程中,随着气温的逐渐降低,一部分水气和空气中的微尘聚集在一起,被空气中上升的气流托着,形成飘在空中的云,而那些上升高度不够的则形成了雾。所以
45、云与雾实质上是一样的,只是它们在大气中所处的位置不同,因此其表现形态也略有不同。教学过程 3、学生操作 略 4、技能拓展 学生可以根据课堂学习掌握的技巧,绘制一些课题没有练习到的其他的自然现象动画,配合前面介绍的人物或动物动画,如雨中奔跑的人、或下雪天觅食的豹子等 5、总结考核 通过本次课,主要让学生了解鼠标绘图,掌握一定的鼠绘能力,并熟悉基本的自然现象,如风、雨、雷、电等场景动画制作方法与技巧,并了解Flash视频的导入、Flash MV的制作与优化等。在教学过程中,除了考核记录学生的课堂完成情况,还考评学生的课外作业完成能力。项目三:制作项目三:制作Flash MV(三)(三)教学目标掌握
46、Flash MV的制作掌握动画中声音的处理掌握MV中片头动画的制作掌握MV主体动画的制作教学重点MV中声音的处理MV中片头动画的设计与制作MV中主体动画的设计与制作准备知识 Flash中可导入的声音文件格式 Flash 基本动画制作方法 分场景动画的制作方法教学方法1、讲授法 利用多媒体计算机教室,教师和学生示范演练同步操作,及时解决制作难题;在课堂上注意教学做结合,教师与学生互动,充分调动学生的积极性,培养学生的动手能力与职业技能,提高学生学习的积极性和团队合作意识与沟通能力。2、案例教学法 对于典型项目中的核心技能用生动、直观的案例进行导入。比如在本案例中,利用小鸟的各种动画效果来达到歌曲
47、的意境;3、启发式教学法 学生掌握案例的制作方法后,对案例涉及的知识技能进行拓展提问,启发学生去思考,使学生能够举一反三,拓宽动画设计思路;4、任务驱动项目教学法 把真实的企业项目作为工作任务引入课堂,引导学生在完成任务的过程中模拟进入岗位角色,并以公司的工作制度、工作流程来要求学生完成作品的创作。5、分组教学法 由学生分组模拟企业开发团队,完成动画设计与制作,强化学生的团队协作能力教学过程 1、知识讲授(1)为动画添加声音 a.在Flash CS3中可使用的声音的类型Flash可以使用的声音的类型有很多,一般情况下,在Flash中可以直接导入MP3格式和WAV格式的音频文件。b声音文件的导入
48、Flash本身没有制作音频的功能,制作好动画后,如果需要添加声音必须先将声音导入到库中,其方法与导入图片类似。c为动画插入声音教学过程 将声音导入到库中后,即可在动画中添加声音。一般在Flash动画中,声音主要用于按钮和主时间轴两个方面。本项目中主要将声音应用到主时间轴中,因此主要介绍在主时间轴添加声音。在时间轴的某一帧添加关键帧,然后从库中将声音文件拖动到舞台中,或者直接在【属性】面板的“声音”下拉列表框中选择已导入的声音文件,如下图所示。教学过程 d声音的后期处理 添加了声音后,可以在“属性”面板中对声音的同步模式、音效、重复次数进行设置,还可以在“编辑封套”对话框中对声音进行比较细致的编
49、辑。“属性”面板中的“同步”下拉列表框中包含4个选项:事件:默认的声音同步模式,可以使声音与事件的发生同步开始。当动画播放到声音的开始关键帧时,事件音频开始独立于时间轴播放,即使动画停止,声音也会继续播放直至完毕。开始:如果在同一个动画中添加了多个声音文件,他们在时间上某些部分是重合的,可以将声音设置为开始模式。在这种模式下,如果有其他的声音正在播放,到了该声音开始播放的帧时,则会自动取消该声音的播放,如果没有其他的声音在播放,该声音才会开始播放。停止:停止模式用于停止播放指定的声音,如果将某个声音设置为停止模式,则当动画播放到该声音的开始帧时,该声音和其他正在播放的声音都会停止。数据流:数据
50、流模式用于在Flash中自动调整动画和音频,使他们同步,主要用于在网络上播放流式音频,如Flash MV。在输出动画时,流式音频混合在动画中一起输出。本项目中就采用这种模式。教学过程 2、动画设计 1)设计片头动画观察了播放时间轴上面的音乐,发现片头第二段音乐(主体歌曲)从100帧开始。所以我们将片头动画设计总时长为98帧。根据前期的策划,片头部分主要是要引出歌曲名称,演唱者,以及控制主体动画开始播放的按钮。(1)制作动画对象(2)完成动画制作 教学过程 2)设计主体动画(1)制作第一主场景动画。一只小鸟在一座山峰上面,想要飞翔,却不能如愿。完成后,如下图所示:教学过程 (2)制作第二主场景动