FLASH动画教案

FLASH动画教案 教学组织设计 学习领域 二维Flash动画设计 学习情境 情境一 简单的Flash贺卡 单元一 亲密接触动画设计任务单元 学时 4 序号 01 FlashCS4——走进Flash动画世界 授课 日 期 任课教师 专业能力目标: 1. 认识Flash应用和特点的能力。 2. 熟悉并掌握Flash CS4工作环境的能力。 3. 熟练掌握Flash CS4基本操作的能力。 学习目标 方法能力目标: 1. 具备操作方法能力。 2. 理解能力、创意能力和表达能力。 社会能力目标: 1. 具备团队创作能力、组织能力和创新意识。 教学方法:项目教学法 教学方法 及组织形组织形式:以项目为目标，基于工作过程的。 式 案例演示 Flash CS4操作 引言 教学 讨论交流 归纳 布置作业 流程图 课后总结 第1页 共17页 各教学环节目录及时间安排: 1. 引言(分) 2. 案例演示(分) 3. 亲密接触Flash CS4(分)(教师讲解与学生演练互动) 4. 讨论交流(分) 引言 Adobe Flash CS4软件是用来制作各种二维动画作品的。Adobe Flash CS4 在Adobe Flash CS3版本的基础上添加了其他新的功能，可以非常方便地创建出各种动画效果。本次课我们就来了解Flash CS4以及它的工作环境和基本操作，这对于以后制作出好的动画是非常重要的。 案例演示——网站动画 ——Flash广告 ——Flash贺卡 ——Flash MV 教学过程 ——Flash游戏 亲密接触Flash CS 4 1.1动画的形成 1(动画基础 利用人的“视觉暂留”特性，连续播放一系列画面，给视觉造成连续变化的图画。它的基本原理与电影、电视一样，都是视觉原理。 在动画中，动画设计是动画影片的基础。它的每一个镜头中的角色，相当于电影影片中的演员。然后通过画笔来塑造各种角色的形象并赋予其生命、性格和感情。 绘制完角色，只是完成了动画设计中的第一步。然后，将角色与场景整合起来，并形成完整的画面，这就是“原画”。只是原画还不能够使动画动起来，需要在两幅原画之间绘制多张“中间画”。 然后，设计师在给每幅原画及中间画根据实际情况着色。最后，再通过摄像机，将所设计的动画效果录制下来，并通过编辑、添加声音等操作形成完美的动画效果。这就是早期的动画实现方法。 2(数字技术带来动画的复兴 第2页 共17页 在传统动画几经浮沉之际，一股新的动画革命在悄悄酝酿。1950年，麻省理工大学的计算机专家制作了第一部计算机动画。 70年代，一大批科学家和艺术家开始投身计算机图像(CG)领域。 80年代初，计算机动画技术步入实用阶段。一大批数字动画制作公司也相继成立。1980年成立的Pacific Data Images(PDI)、1985年成立的Pixar、1987年成立的Blue Sky Studios，如今都已成为生产电影动画的大型工作室。 90年代数字技术在欧美和日本的动画工作室开始得到普及。数字图像技术成为电影和动画工业复兴的催化剂。迪斯尼公司自1990年的《救难小英雄》(The Rescuers Down Under)以来就利用数字技术降低成本和营造更加美轮美奂的画面，《美女与野兽》(1991)、《阿拉丁》(1993)等动画电影取得巨大成功。1994年的《狮子王》更成为迪斯尼公司有史以来最卖座的一部动画长片。 三维动画片成为动画产业的新主流。 数字动画的浪潮，也在美国之外的区域蔓延。日本动画也大量采用了数字技术，近年来的《幽灵公主》、《千与千寻》、《攻克机动队2》、《蒸汽男孩》等动画片，都采用了数字动画技术。 1.2 Flash的应用 Flash技术至今已成为网络多媒体的既定标准，在互联网中得到广泛的应用，如随处可见的网站进入片头、广告、贺卡、MTV动漫以及Flash小游戏等。 1(网站动画 网络时代的今天，很多商家都应用了网站作为一个宣传和交流的平台。网站的片头动画也越来越受到重视。一个好的片头动画能在很大的程度上起到了引领消费的作用。如图。 第3页 共17页 2(Flash广告 Flash广告动画，一般采用电视媒体制作的表现方式，并且广告较短，比较精辟，非常适合于网络传输。广告又分为很多类，包括产品广告、公益广告、企业宣传广告等。如图 3(Flash贺卡 贺卡的产生源于人类社交的需要，人们通过将美好的祝愿书写在卡片上以传递祝福。如今的电子贺卡和以前相比只是载体发生了改变，不再是纸片，而是电子媒体。通过网络传递给其他人祝福。如图 4(MV动漫 MTV动漫之所以风靡网络的根本原因在于其十足的动感人物效果，身临 第4页 共17页 其境的场景效果，还可以添加悦耳动听的声音，使每个镜头都栩栩如生。如图 5(Flash游戏 Flash游戏一般情节比较简单，操作容易且文件体积较小，因此备受用户的喜爱。如图 1.3 Flash的特点 1、体积小:Flash动画文件和其它格式的动画文件相比，具有体积小，占磁盘空间小，便于存储和网络传输的特点。 2、不会因压缩而失真:用Flash软件制作的动画是矢量动画，矢量图与分辨率无关，它是由适量的数学对象对定义的直线和曲线组成的，将它缩放到 第5页 共17页 任意大小和以任意分辨率在输出设备上打印出来，都不会遗漏细节或者降低清晰度。在观看动画时，不管怎样放大或缩小都不会失真。 3、采用了流媒体技术:Flash播放器在下载Flash影片时采用了流媒体技术。这就意味着动画没有下载完毕之前就可以播放，即边下载边播放，不必等到整个动画文件全部下载完后才可以播放，大大缩短了等待的时间。 4.交互性好:用Flash做成的动画可以具有交互功能。 1.4 Flash中常用的术语 1、位图:它是由若干个独立的像素点排列组成的，每个像素点的位置和颜色必须占用一定的存储空间。位图文件的大小是由画面的面积、分辨率和颜色深度决定的，与图像的复杂程度无关。将位图放大到一定程度时，图像会失真，即图像的边缘会出现“锯齿”现象。 2、矢量图:它是用直线和曲线来描述图形，不是依靠单个像素来组成图像。这些矢量格式的图形元素是一些包含有方向、位置和尺寸的点、线、矩形、多边形、圆、弧线和色块等。对于矢量图形而言，图像文件中只需记录某个颜色区域中的颜色和这个区域的大小、形状以及位置。在矢量图中某一个区域中的颜色变化总是有规律的，它们都是通过数学公式计算获得的。用Flash工具箱中的绘图工具绘制出来的矢量图，适量图占有空间的大小是由其复杂程度决定的，与它的面积大小、分辨率几乎是没有关系的。 第6页 共17页 3、播放头:它是显示在时间轴面板上方的红色矩形方块，可以用鼠标在水平方向上任意拖动，在舞台上看到的画面就是该位置处的内容。 4、帧:在动画中随时间产生动画效果的单元是帧，它是动画中的一个暂停镜头。当若干个帧连续播放时就是一个动画片段。在时间轴上用一个空白小长方形表示一帧。按【F5】键可在时间轴上插入一帧。 5、关键帧:它的内容可以被编辑修改，用来记录帧内容的替换或性质的改变。在时间轴上用实心的小黑点表示。 6、属性关键帧:它是Flash CS4新增的一种关键帧，在对前面的某一帧制作了动画以后，当播放头处在它后面的某一帧时，对该层上的对象的大小、位置、颜色等属性进行任何调整后自动产生的关键帧，用来记录帧内容的属性的改变。在时间轴上用实心的菱形小黑点表示。 7、空白关键帧:指没有任何内容的关键帧，在编辑区中看不到任何画面。在时间轴上用空白小圆圈表示。如果空白关键帧被加入内容，则变成关键帧，在时间轴上出现实心的小黑点。 8、普通帧:它是关键帧的延续，当播放到该处时显示和它前面的关键帧完全相同的内容。在时间轴上显示为灰色。 9、空白普通帧:也是空白关键帧的延续。当播放到该处时不显示任何内容，在时间轴上显示为白色。 10、渐变帧:也称为过度帧，处在两个关键帧中间。当前面一个关键帧作了动画的帧，动画播放到该处时显示出的画面介于两个关键帧之间，在时间轴上用实线表示(虚线表示失败的渐变帧)，在时间轴上用浅蓝色表示动作渐变，用浅绿色表示形状渐变。 11、图层:我们可以把图层比喻成透明的醋酸纤维薄片，在舞台上一层层地向上叠加。图层可以帮助我们组织文档中的插图。可以在图层上绘制和编辑 第7页 共17页 对象，而不会影响其它图层上的对象。如果一个图层上没有内容，那么就可以透过它看到下面的图层。 12、舞台:也叫作动画编辑区，是位于时间轴上面的一个白色矩形区域，用来绘制、编辑和播放动画对象的。包围着舞台的灰色区域叫做操作区域，它是在动画播放时看不到的区域。 13、工作区:用来编辑动画元件的区域。 14、场景:一个影片中可以拥有任意多个场景，它是复杂动画中联系较为密切的一段动画。如果将一个Flash动画文件理解为一部戏，一个场景就是这部戏中的一幕。 15、元件:是指在Flash中创建的图形、按钮或影片剪辑，能够至始至终在您地影片或其她影片中重复使用，元件能够包含从其她应用程序中导入地插画，任何创建地元件都会自动变成但当前文档库地一部分。 16、实例:实例是指位于舞台上或嵌套在另一个元件内地原件副本，实例能够与它地元件地颜色大小和功用上差异很大，编辑原件会更新它地一切实例，但对元件地一个实例应用效果则只更新该实例。 17、库:用来存放元件的地方。用户创建的元件平时放在库中，当需要使用时打开库面板，将需要的元件用鼠标拖放到舞台上，就成了该元件的一个实例。 第8页 共17页 1.5 Flash CS4的工作环境 通过双击桌面上的Flash应用程序图标，也可以通过单击“开始”按钮?“程序”?“Adobe Flash CS4”打开该程序。 一般安装完Flash后，打开Flash CS4时在应用程序窗口前会出现一个Flash CS4的开始界面，如图1.10所示，需要从界面中选择“Flash文件(ActionScript 3.0)”或“Flash文件(ActionScript 2.0)”选项后方可打开需要的Flash应用程序窗口。 第9页 共17页 选择“Flash文件(ActionScript 3.0)”选项进入和选择“Flash文件(ActionScript 2.0)”Flash操作环境后的功能和操作方法基本上相同，所不同的是，选择“Flash文件(ActionScript 2.0)”选项进入后，与3D有关的功能及其他某些个别的功能会受到限制，编写代码时仍然按照传统的ActionScript 2.0的语法规则进行编写。选择“Flash文件(ActionScript 3.0)”选项进入后，支持Flash CS3和Flash CS4的所有新增功能，编写代码时需要按照ActionScript 3.0的语法规则进行编写。 我们也可以通过设置使Flash CS4启动后直接进入应用程序窗口。在出现的开始页界面中，选中“不再显示”复选框后，再选择“Flash 文件”选项，这样以后再启动Flash CS4时，此界面将不再出现;或者在打开Flash CS4应用程序后选择“编辑”?“首选参数”命令，弹出“首选参数”对话框，如图1.11所示。在“类别”列表框中选择“常规”选项，再在“启动时”下拉列表框中选择其中的任何一项，来改变打开Flash CS4应用程序后的初始状态。 第10页 共17页 Flash的最新版本CS4版，从操作环境到各项新增工具，都给人耳目一新的感受。面板的摆放更集中，收合更方便;面板上也有几个新面孔，让人很感兴趣;有些原有的面板也以新的面孔出现在我们面前，使操作更简单、更方便。 Flash CS4的操作环境包括菜单栏、编辑栏、工作区、时间轴、工具箱和各种面板组成。 1. 菜单栏 2. 主工具栏 3. 编辑栏 编辑栏是在文档窗口标题栏下面时间轴上面的一栏。可以通过编辑栏修改动画编辑区中对象的显示比例，切换和选择被编辑的场景和元件。 4. 时间轴 当处在“基本功能”操作界面时时间轴处在文档窗口下面，它是Flash最具特色的部分，分为图层面板(左)和时间轴面板(右)两部分。可以通过图层面 第11页 共17页 板部分，完成对图层的所有操作;通过时间轴部分完成对帧的所有操作。这两部分是密切联系不可分割的。 我们在对动画编辑区中的对象进行编辑时，总是针对某一层上的某一关键帧进行的。在动画编辑区显示出的画面是时间标尺上播放头(红色矩形块)所在帧上的所有层的内容。 因为动画是随着时间在变化的，播放到不同帧时，看到的内容是不同的。可以通过用鼠标单击时间轴上面的标题条打开和关闭时间轴，也可以单击“窗口”菜单中的“时间轴”菜单项或者使用[Ctrl+Alt+T]快捷键打开和关闭时间轴。 5. 工作区 工作区的范围在不同的书中有不同的指定，有的书籍把整个的Flash操作环境称为工作区，在本书中工作区指编辑动画的区域，在主场景中编辑动画时，工作区就是舞台;在编辑元件时指元件的动画编辑区域。 6. 工具箱 使用工具的方法是，用鼠标单击工具箱中的工具按钮，或直接在键盘上按下工具名后相应的字母，该工具就成为当前工具，再在工作区中进行操作。 下面我们详细讲解一下两个最常用的工具:选择工具和任意变形工具。对其它工具只进行简单的介绍，具体的使用方法在以后单元中再做讲解。 第12页 共17页 , 选择工具:选择工具是Flash工具箱中最常用的工具，除钢笔工具和部分选取工具外，在使用其它任何绘图工具时，都可以用按下[Ctrl]键的方法暂时切换成选择工具。在对动画编辑区外的对象进行正常操作时有时也需要切换成选择工具。选择工具可以用来选择对象、移动对象、复制对象和修改对象。 , 部分选取工具:用于移动路径和调整路径上的锚点和控制节点。 , 任意变形工具:是除选择工具外Flash又一常用的工具。该工具可以用来缩放对象、倾斜对象、旋转对象和移动对象。用任意变形工具选中对象后对象上出现若干个调整点。 , 渐变变形工具:用于调整填充在某一区域内的渐变色或者位图的尺寸、方向和中心点。详细的使用方法见单元二中任务二。 , 3D旋转工具:用于绕X、Y、Z三个轴向上旋转选中对象。 , 3D平移工具:用于在X、Y、Z三维空间中移动选中对象。 第13页 共17页 , 套索工具:用于绘制任意形状的选区。 , 钢笔工具:用于创建路径线条。详细的使用方法见单元二中任务五。 , 添加锚点工具:用于在曲线路径上增加点。 , 删除锚点工具:用于删除路径上的锚点。 , 转换锚点工具:用于将平滑锚点和拐点转换成角点。 , 文本工具:用于创建文字对象，编辑文字内容。 , 线条工具:用于绘制直线。 , 矩形工具:用于绘制矩形和正方形。直接拖动绘制矩形，按下[Shift]键拖动绘制正方形。 , 椭圆工具:用于绘制椭圆或圆。直接拖动绘制椭圆，按下[Shift]键拖动绘制正圆形。 , 基本矩形工具:同矩形工具，非矢量图形，不可以用橡皮、选择等编辑工具直接编辑。 , 基本椭圆工具:同椭圆工具，非矢量图形，不可以用橡皮、选择等编辑工具直接编辑。 , 多角星形工具:用于绘制多边形和多角星。 , 铅笔工具:用于绘制任意形状的笔触线条。 , 刷子工具:用于填涂和绘制任意形状填充色块。 , 喷涂刷工具:用于以喷雾的方式绘制图形。 , Deco工具:用于在区域范围内绘制图案。 , 骨骼工具:用于链接多个对象，使对象间产生类似骨骼的连动效果。 , 骨骼绑定工具:用于编辑单个骨骼和形状控制点之间的连接。 , 墨水瓶工具:用于修改笔触颜色。 , 颜料桶工具:用于用填充色填充由笔触线条围成的封闭区的颜色或修改填充色块的颜色。 , 滴管工具:用于获取动画编辑区中对象的笔触颜色或填充颜色。 , 橡皮擦工具:擦除矢量图对象上的内容。 , 手形工具:用于移动舞台位置，以利于观察和编辑对象。 , 缩放工具:用来改变舞台上所有对象的显示比例。 , 笔触颜色:用于修改工具箱中可以绘制笔触颜色的着色工具(直线、铅笔、钢笔、矩形、椭圆、墨水瓶)的笔触颜色，也可以修改选中对象的笔触颜色。 , 填充颜色:用于修改工具箱中可以绘制色块的着色工具(矩形、椭 第14页 共17页 圆、颜料桶)的填充颜色，也可以修改选中对象的色块颜色。 , 黑白:按下该按钮可以将笔触颜色设置为黑色，填充色设置为白色。 , 交换颜色:按下该按钮可以交换笔触颜色按钮和填充色按钮中的颜色。 选项设置区的按钮随绘图工具的不同而变化。 7. 各种面板 Flash CS4提供了丰富的面板，使用面板可以处理对象、颜色、文本、实例、帧、场景和整个文档。常见的面板有库面板、属性面板、动作面板、参数面板、颜色面板和对齐面板等。 ?面板的表现形式 面板的表现形式也是多样的，有结合在窗口右边的，如属性面板、库面板。有结合在窗口下边的，如时间轴面板、动画编辑器面板。有浮动在窗口前面的。为了减少面板在主窗口中的占用面积，可以将一些相关的面板组合在一起形成面板组等。用户可以根据自己的需要随意改变面板的形式。 第15页 共17页 ?面板的基本操作 打开面板:可以通过选择“窗口”菜单中的相应命令打开指定面板，一些常用的面板还可以通过对应的快捷键完成打开和折叠操作。 关闭面板组:在已经打开的面板标题栏上右击，然后在快捷菜单中选择“关闭面板组”菜单项。 折叠或展开面板:单击标题栏或者标题栏上的折叠按钮可以将面板折叠为其标题栏，再次单击即可展开。 移动面板:可以通过拖动标题栏移动面板位置，或者将固定面板移动为浮动面板;或者将浮动面板移动为固定面板。 关闭所有面板:单击“窗口”菜单中的“隐藏面板”菜单项或者使用[F4]快捷键可以关闭和打开所有面板。 恢复默认布局:可以通过主窗口标题栏上的操作环境菜单，将被改变了的操作环境恢复到缺省样式。 可以通过主窗口标题栏上的操作环境菜单切换操作环境。 第16页 共17页 讨论交流 FlashCS4的工作界面及基本操作。 本次课是学习情景一(简单的Flash贺卡)中单元一(亲密接触动画设计FlashCS4)的教学内容。在理实一体化专业教室中进行，有利于学生理解难重 总结回顾 点和操作实践。本次课主要知识点:让学生了解Flash的基本知识，熟悉Flash CS4的工作环境和基本操作。整个过程以项目教学为主。极大地培养了学生的实训动手能力。 第17页 共17页