二维动画的处理课件

1、网络动画资源处理FLASH操作入门 Networked Animation Resources Processing周露武汉大学图书馆第1页，共84页。讲述内容Flash的重要概念：场景、图层、时间轴、帧与关键帧、元件、实例、遮罩Flash三种基本动画：逐帧动画、Shap动画、Motion动画动态按钮理解影片剪辑元件旋转的地球理解按钮元件、实例、遮罩层、音乐背景插入作业用Flash制作长镜头第2页，共84页。1.1动画的分类按动画的表现形式来分二维动画沿用传统动画的概念，将一系列画面连续显示，使物体产生在平面上运动的效果。GIFAnimator、Flash三维动画又叫空间动画，主要表现三维物体

2、和空间运动。例如：3D Studio，Cool 3D变形动画具有把物体从一种形态过渡到另外一种形态的特点，其形态和颜色的变换都需经过复杂的计算。例如：WinImage:morph第3页，共84页。1.2 二维动画处理的常见工具FLASH由美国Macromedia公司出品的矢量图形编辑和动画创作的专业软件，主要应用于网页设计和多媒体创作等领域，其功能十分强大和独特，从内容显示到数据库连通，以及视频调试，可创建完整的动态站点，已成为制作交互式矢量动画的标准软件。 Macromedia现已被Adobe公司收购。Ulead GIF Animator 是目前最快和最易使用的 GIF 动画工具。Illus

3、ion Impulse开发的一个粒子动画系统，可以制作各种粒子效果动画，枫叶飞舞，雪花飘扬，火星四溅等等。ANIMO英国Cambridge Animation公司出品的二维卡通动画制作系统。目前美国好莱坞的特技动画委员会已经把它作为二维卡通动画制作方面一个标准。第4页，共84页。1.3 Flash史上经典作品欣赏1999年DFly，19岁，我的心好乱第一个国产flash版MTV1999年小小，过关斩将小小3号小小特警深受国外欢迎的最具中国特色的flash，小火柴人的中国功夫2001年大话三国系列，SHOWGOOD公司出品，神啊，救救我吧第5页，共84页。1.3 史上Flash精品网站湛江在线信

4、息港：碧海银沙心意坊武汉信息港：卡秀Cardshow闪客帝国（已关闭）TOM Flash频道（已取消）腾讯QQ Flash频道（已被Flash动漫频道取代）闪8：/（专业的flash学习和传播网站）太平洋教学学院：/videoedu/flash/（强烈推荐）第6页，共84页。2.1 Flash CS5绿色版的安装与启动第7页，共84页。2.2 Flash的重要概念：场景参考来源：/article/view/224098场景就是专门用来容纳、包含图层里面的各种对象的平台，它相当于一块场地，上面可以摆放与动画相关的各种对象或元件。同时，这个场地也是动画播放的舞台。即是摆放的场地也是动画表演的舞台。

5、场景是由图层组成，而图层又是由帧来组成，一个图层包含多个帧，按有无意义来区分，可以拥有0个帧，也可以拥有N个帧，帧由各种对象或元件来组成。flash里面允许我们建立一个或多个甚至是N个场景，以此来扩充更多的舞台范围。没有了场景，动画就等于失去了展示的空间。如果一个动画比较庞大，动画所使用的对象很多，导致所使用的舞台也很多，那么，光靠一个场景是不能容纳这么多对象的。因此，这类动画通常需要多个场景。第8页，共84页。插入新场景第9页，共84页。2.2 FLASH的一些概念图层概念：就像是一叠透明纸一样，上层的物体会盖住下层的。Flash也以图层的概念来存储影片，类似于Photoshop中的层，区别

6、在于一个是静止的而另一个是运动的。作用：要做一段影片在一个层中很难完成，在多个层中就能同时控制多个对象了。通过增加层，可以在一层中编辑运动而在另一层中使用形变而互不影响，因此，才可以编辑较复杂的效果。第10页，共84页。：表明此层处于活动状态，可以对该层进行各种操作；：表明此层处于隐藏状态，即在编辑时是看不见的，同时，处于隐藏状态的图层不能进行任何修改。这就告诉我们一个小技巧，当我们要对某个图层进行修改又不想被其他层的内容干扰时，可以先将其他图层隐藏起来。：表明此层处于锁定状态，被锁定的图层无法进行任何操作。在 Flash 制作中，大家应该养成个好习惯，凡是完成一个层的制作就立刻把它锁定，以免

7、误操作带来麻烦。：表明此层处于外框模式。处于外框模式的层，其上的所有图形只能显示轮廓。请注意，其他图层都是实心的方块，独有此层是外框形式。第11页，共84页。2.2 FLASH的一些概念时间轴动画是随着时间来展开的，时间线是动画形成的原因，对动画的所有控制都是用时间线来控制的。时间线第12页，共84页。2.2 FLASH的一些概念帧与关键帧关键帧的概念：是指动画中定义的更改所在的帧，或包括修改影片的帧动作脚本的帧。帧的概念：Flash可以在关键帧之间补间或填充帧，从而生成流畅的动画。关键帧之间补间可以使设计师不用画出每个帧就可以生成动画，使创建影片更为简易。作用：通过在时间轴中拖动关键帧来更改

8、补间动画的长度。帧和关键帧在时间轴中出现的顺序决定它们在影片中显示的顺序。第13页，共84页。时间轴里的每个小格就是一个帧有内容的关键帧以该帧前面的实心圆表示。空白的关键帧则以该帧前面的空心圆表示关键帧是可以直接编辑的帧 ，第14页，共84页。2.2 FLASH的一些概念元件、实例元件：概念：元件是指在Flash中创建的图形、按钮或影片剪辑，可以自始至终在影片中重复使用。可以包含从其他应用程序中导入的插图。任何创建的元件都会自动变为当前文档的库的一部分。实例：概念：实例是指位于舞台上或嵌套在另一个元件内的元件副本。编辑元件会更新它的所有实例，但对元件的一个实例应用效果则只更新该实例。在影片中使

9、用元件可以显著减小文件的大小；保存一个元件的几个实例比保存该元件内容的多个副本占用的存储空间小。元件是一种可重复使用的对象，而实例是元件在舞台上的一次具体使用。第15页，共84页。把这片花瓣转换为元件共享库中能看见这个元件第16页，共84页。从共享库中把花瓣元件拖到场景中，场景中的这个花瓣就是一个实例。第17页，共84页。2.2 FLASH的一些概念遮罩概念：与Photoshop中的遮罩类似，遮罩必须有两个层，上面的一层遮罩着下面的一层，就好像用一层有洞的布蒙在一幅画上看到的感觉，即用上面一层的形状来显示下面一层的内容。作用：在形状图层创建的图形超出了舞台，扩展到了画布区域。尽管画布区域不会出

10、现在发布的影片中，但是在创作环境中，超出舞台的图形会使人感到杂乱。当然可以擦除进入画布的那部分形状，但是还有一个更好的办法，就是在舞台上应用遮罩，使只有遮罩下的区域才是可见的。如果想返回到原有形状来修改它们，它们将仍是完好的。第18页，共84页。遮罩层里画了一个椭圆作为遮罩被遮罩层里是一个美丽的风景画第19页，共84页。用ctrl+Enter演示遮罩效果第20页，共84页。2.2 FLASH的一些概念网格概念：在舞台中，可以沿着水平和垂直网格线对齐对象。作用：可以设置网格为不可见，在不可见状态下，对象与网格也可以对齐。可以修改水平网格线之间和垂直网格线之间的距离，并创建与舞台边界对齐的网格。第

11、21页，共84页。工作区中显示的这些方格线就是网格第22页，共84页。3 FLASH的动画制作3.1 简单的逐帧动画，也就是一幅一幅的画3.2 Shape动画，也就是形状改变的动画3.3 Motion动画，也就是移动动画 这三种动画不是单一的，要融会贯通，合理搭配使用。第23页，共84页。3.1 逐帧动画移动的欢迎标志第24页，共84页。启动Flash单击层名称使之成为当前层，然后在动画开始开始播放的层中选择一个帧；选择【插入】 【关键帧】使之成为一个关键帧；逐帧动画更改每一帧中的舞台内容，它最适合于每一帧中的图像都在更改而不是仅仅简单地在舞台中移动的复杂动画。第25页，共84页。在序列的第一

12、个帧上用文字工具创建一个字母“W”并设置为红色。第26页，共84页。单击同一行中右侧的下一个帧，然后选择【插入】 【关键帧】，这将添加一个新的关键帧即第2帧，其内容和第1个关键帧一样；第27页，共84页。在第2帧的内容上添加字母“E”，其颜色设置为黄色，并把这两个字母享有移动一个字符；第28页，共84页。重复第4、5步，第3、4、5、6、7帧分别在前一帧的基础上添加字母“L”、“C”、“O”、“M”、“E”，且每个都添上不同的颜色。第29页，共84页。选择【控制】 【播放】或单击控制器上的【播放】按钮可看到“W”、“E”、“L”、“C”、“O”、“M”、“E”这7个不同色彩的字母依次出现，最终

13、形成“WELCOME”字样。导出flash文档为动画文件one.swf。使用菜单：【文件】 【导出】 【导出影片】。第30页，共84页。3.2 Shape动画制作一个从圆变方的小动画。第31页，共84页。启动Flash在舞台上单击鼠标右键，在下拉菜单中选定文档属性。在【属性大小】对话框中，设置舞台区域为400250，其他选项不变。第32页，共84页。在时间轴面板的时间控制区中选择第一帧单击绘图工具箱的椭圆工具，然后在舞台中绘制一个正圆，通过调色板设置该正圆的填充色块是由红到黑的【径向】填充风格，然后在属性面板的【补间】下拉式列表框中选择【形状】选项 。第33页，共84页。在时间控制区第24帧右

14、击鼠标。从弹出的快捷菜单中选择【插入关键帧】命令。选择矩形工具，在舞台的中间绘制一个矩形，并将舞台中的椭圆删除。第34页，共84页。在时间控制区的第48帧右击鼠标，从弹出的快捷菜单中选择【插入关键帧】命令重新选择椭圆工具，在舞台的中间绘制一个椭圆，通过调色板设置该椭圆的填充色块是由绿到黑的【径向】填充风格，并将舞台中的矩形删除。第35页，共84页。在第一帧，点击鼠标右键，创建补间动画，操作完成后，选择【控制】 【播放】菜单命令，观看形状变化的动画效果。导出flash文档为动画文件shap.swf。使用菜单： 【文件】 【导出】 【导出影片】。第36页，共84页。3.3 Motion动画移动的小

15、球启动Flash单击层名称使之成为当前层，然后在动画开始播放的层中选择一个空白关键帧；第37页，共84页。2) 创建第一个帧，用【椭圆工具】创建一个图形对象圆，用鼠标右键单击圆的边缘，在弹出的菜单上选择【剪切】以去掉圆的边框；第38页，共84页。然后用【插入】 【转化为元件】命令把它转换为一个元件；第39页，共84页。锁定图层1，用鼠标右键单击图层管理栏中的图层1，在弹出的菜单中选择【添加引导层】命令，然后在引导层用铅笔工具绘制一条曲线；第40页，共84页。分别在两个层的第25帧插入一个关键帧，解开图层1的锁，把第1帧圆的中心拖到引导线的左端；第41页，共84页。同样在第25帧将圆心对准引导线

16、的右端；第42页，共84页。右击图层1的第1帧，在弹出的菜单中选择【创建补间动画】命令；用【控制】【测试影片】命令可以看到动画效果，当播放动画时，元件将沿着运动路径移动。导出flash文档为动画文件motion.swf。使用菜单：【文件】【导出】【导出影片】。第43页，共84页。3.4元件、实例、按钮、影片剪辑元件的应用例子：flash动态按钮的制作画一个椭圆，填充渐变色（自定义渐变色）第44页，共84页。把椭圆转换为元件，影片剪辑，命名为“鼠标经过时动画”在时间轴上插入关键帧，生成动画把刚才的椭圆元件复制一个，生成图形元件，命名为“常态图形”回到场景，新建一个元件，按钮，命名为“我的按钮”第

17、45页，共84页。第46页，共84页。在按钮的四个帧“弹起、指针经过时、按下、点击”中，分别放入对应的图形元件，影片剪辑元件。将“我的按钮”拉入到场景中，在“控制”菜单中“测试影片”，即可看到鼠标滑过动画的按钮。第47页，共84页。3.5 用例子“转动的地球”理解图层、遮罩、库、元件、实例的概念以及添加背景音乐参考来源：/s/blog_4c158f710100azpf.html第48页，共84页。1，打开FLASH8制作软件界面，舞台文档属性为：尺寸200*200像素，帧频30帧。第49页，共84页。2， “插入”-“新建元件”（名称：地图；类型：图形）。“文件”-“导入舞台”随书光盘“素材”

18、第4章“swf文件地图”。（图2） 第50页，共84页。3， 点击地图，“编辑”-“复制”；“编辑”-“粘贴到中心位置”；将复制的地图放在原地图的右侧，成为相连的两幅地图。第51页，共84页。4，“插入”-“新建元件”（名称：球；类型：图形）。舞台中使用圆形工具，制作一个灰色的圆形，其信息：164*164大小，在圆点位置。第52页，共84页。5，使用混合器编辑，设多个“颜色界面点”将圆形图制作为有立体感的“球”。第53页，共84页。6， 回到场景1，“窗口”打开“库”，将库中的“地图”移入场景中图层1；第54页，共84页。7，并在图层1之上添加图层2；将库中的球体移入场景图层2中；将地图移动至

19、球的适当位置；第55页，共84页。8， 在图层2“复制”（球），添加图层3，“编辑”-“粘贴到当前位置”第56页，共84页。9，在180帧在3个图层选择“插入帧”命令；10，在180帧的图层1选择“插入关键帧”命令；第57页，共84页。11，将右侧的地图移动球体的适当位置第58页，共84页。12， 在图层1中第1帧与180帧之间的任一帧，选择“创建补间动画”命令第59页，共84页。13，在图层2中选择“遮罩层”命令 第60页，共84页。12，“控制”-“测试影片”命令，可以显示一个播放的“swf文件” 动画第61页，共84页。作业 长镜头遮罩层应用实例第62页，共84页。课外欣赏 FLASH的

20、雪落樱花舞效果制作第63页，共84页。首先启动Macromedia Flash MX 2004,按下ctrl+j来设置一下文档的属性。默认文档尺寸,默认白色背景，修改FPS值为16。新建一个图符元件(按下ctrl+F8)，起名为:“文字”。如图:第64页，共84页。 确定后在打开的新窗口中用【文本工具】在场景中输入文字“雪落樱花舞”，文字属性如图设置：第65页，共84页。再新建一个影片剪辑元件(按下ctrl+F8)。起名为:“文字动画”。如图:第66页，共84页。确定后,打开库面板(ctrl+L),将“文字”元件拖到窗口中来，调整一下位置，然后新建一个图层，在这个图层上画一个无边框的方形。大小

21、为能够遮盖一个文字就好，不要太大也不要过小。如图:第67页，共84页。然后打开【混色器】面板给小方块填充放射状渐变色.混色器中设置如图:第68页，共84页。填充好后用“填充变形工具”将填充修改如图:第69页，共84页。然后选中【方块】元件进行【复制】【 粘贴】N次(这里复制了10个)，排列成如图所示；选中这些方块后按下F8将它们转换成一个图符元件。起名为“方块遮罩”如图：第70页，共84页。接下来作遮罩动画，将图层2设成显示轮廓状态(点击图层2名称右边的小方框),然后将”方块遮罩”元件放到如图位置:第71页，共84页。然后将所有图层延长到第30帧处，并在图层2的30帧处插入一个关键帧。将“方块

22、遮罩”元件移到如图位置,并建立运动间补动画。第72页，共84页。这样就可以形成一个动画嵌套的运动的效果。将图层2拖到图层1下，设立遮罩，图层1为遮罩层，图层2为被遮罩层，然后将图层2的轮廓显示取消。设置为循环播放，Ctrl+回车看一下效果。第73页，共84页。导出flash文档为动画文件flower.swf。使用菜单：【文件】 【导出】【导出影片】。第74页，共84页。附1 Flash的相关格式Flash编辑格式.flaFlash的导出格式.swfFlash视频格式.flv，请参阅/wiki/FLVFLV 是FLASH VIDEO的简称，FLV流媒体格式是一种新的视频格式，全称为Flash Video。由于它形成的文件极小、加载速度极快，使得网络观看视频文件成为可能，它的出现有效地解决了视频文件导入Flash后，使导出的SWF文件体积庞大，不能在网络上很好的使用