Flash文字遮罩动画课件

1、学科学科Flash动画制作动画制作4.194.20星期星期四四五五检查检查签字签字邱少华邱少华班级班级计应计应16计应计应16节次节次1-21-2课题课题Flash文字遮罩动画文字遮罩动画课的类型课的类型理论，上机理论，上机教具教具挂图挂图多媒体教学多媒体教学作业作业上机操作上机操作教学教学环节环节时间时间分配分配1.组织教学时间组织教学时间2-44.归纳小结时间归纳小结时间2-42.复习导入时间复习导入时间2-35.作业布置时间作业布置时间2-33.讲授新课时间讲授新课时间86-906.上机操作时间上机操作时间100教学教学后记后记机电系机电系授课人：曾松元Page 3教学重难点教学目标教学

2、内容教学方法教学目标教学目标了解遮罩层的了解遮罩层的工作原理和图标；工作原理和图标；掌握文字遮罩掌握文字遮罩动画的制作要点。动画的制作要点。 掌握创建文掌握创建文字遮罩动画的方字遮罩动画的方法；法； 培养学生培养学生想象能力和合作想象能力和合作能力。能力。 激发学生学习激发学生学习动画的兴趣，培动画的兴趣，培养学生的动手能养学生的动手能力和创造力，体力和创造力，体验成功的喜悦。验成功的喜悦。Page 4教学重难点教学目标教学内容教学方法理解遮罩层与被遮罩层的概念。理解遮罩层与被遮罩层的概念。理解遮罩动画产生的设计原理。理解遮罩动画产生的设计原理。了解多层遮罩动画的运用。了解多层遮罩动画的运用。

3、掌握使用遮罩原理制作文字遮罩动画的方掌握使用遮罩原理制作文字遮罩动画的方法和技巧。法和技巧。了解复杂文字遮罩动画设计的方法和技巧。了解复杂文字遮罩动画设计的方法和技巧。教学内容教学内容Page 5教学重难点教学目标教学内容教学方法教学重、难点教学重、难点重重 点点难难 点点 学习遮罩动画学习遮罩动画的概念、各种表现的概念、各种表现形式和制作技巧。形式和制作技巧。 了解文字遮了解文字遮罩动画的制作方法，罩动画的制作方法，结合实践巧妙地运结合实践巧妙地运用遮罩设计制作出用遮罩设计制作出各种文字遮罩动画各种文字遮罩动画效果。效果。 分析遮罩层分析遮罩层内容的形状。内容的形状。 掌握使用遮掌握使用遮罩

4、原理制作动罩原理制作动画的方法和技画的方法和技巧。巧。 了解复杂文了解复杂文字动画设计的字动画设计的方法和技巧。方法和技巧。Page 6教学重难点教学目标教学内容教学方法 教学方法采用教学方法采用任务驱动法、实例演示法、任务驱动法、实例演示法、讲解点拨法讲解点拨法。 教学手段采用教学手段采用教师多媒体教学教师多媒体教学，学生上机学生上机实践实践的教学练一体化方式。的教学练一体化方式。教学方法教学方法教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 7娄底技师学院机电系Flash CS3Flash CS3本讲的教学过程本讲的教学过程 利用遮罩制作的一个探照灯效果利

5、用遮罩制作的一个探照灯效果（通过拖动圆来改变可看（通过拖动圆来改变可看的内容）的内容）Flash CS3返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 8娄底技师学院机电系Flash CS3Flash CS3目录目录基本原理基本原理原理实例原理实例实现方法实现方法基本构成基本构成遮罩动画的基本概念遮罩动画的基本概念教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 9娄底技师学院机电系Flash CS3Flash CS3遮罩动画的基本原理遮罩动画的基本原理 遮罩作为一个专有名词来源印刷领域，遮罩作为一个专有名词来源印刷领域

6、，可以把它看作是一个带孔的画布，孔可以可以把它看作是一个带孔的画布，孔可以是任意的形状，遮盖在具有丰富动画内容是任意的形状，遮盖在具有丰富动画内容的图层之上，然后通过这个画布中的孔来的图层之上，然后通过这个画布中的孔来观看被画布覆盖的其他动画层中的运动对观看被画布覆盖的其他动画层中的运动对象，这就是遮罩的基本原理，而这个孔也象，这就是遮罩的基本原理，而这个孔也就是用户要绘制编辑的区域。就是用户要绘制编辑的区域。 返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 10娄底技师学院机电系Flash CS3Flash CS3 先来看两个遮罩的范例，如图所示，不

7、论是左先来看两个遮罩的范例，如图所示，不论是左侧图中在单色背景上，还是右侧图中在图片上，都侧图中在单色背景上，还是右侧图中在图片上，都是以一个不规则的图形作为遮罩，控制另一幅图片是以一个不规则的图形作为遮罩，控制另一幅图片的显示区域。的显示区域。 遮罩原理实例遮罩原理实例 返回返回Flash CS3教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 11娄底技师学院机电系Flash CS3Flash CS3 遮罩动画就是使用一个动画层遮住下一个动画遮罩动画就是使用一个动画层遮住下一个动画层的一部分或全部，使其部分或全部显示出来的动层的一部分或全部，使其部分或全部显

8、示出来的动画。要创建遮罩动画，至少需要有两层，一层作为画。要创建遮罩动画，至少需要有两层，一层作为遮罩层遮罩层，一层作为一层作为被遮罩层被遮罩层。遮罩动画的构成遮罩动画的构成遮罩层遮罩层被遮罩层被遮罩层注：注：一个遮罩层下可以有多个被遮罩层！一个遮罩层下可以有多个被遮罩层！下一张下一张返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 12娄底技师学院机电系Flash CS3Flash CS3 说明：说明： 遮罩项目可以是遮罩项目可以是填充的形状填充的形状、文字对象、图形元、文字对象、图形元件的实例或影片剪辑。件的实例或影片剪辑。 将多个图层组织在一个遮罩

9、层下可创建更加复杂将多个图层组织在一个遮罩层下可创建更加复杂的遮罩效果。的遮罩效果。 若要创建动态效果，可以让若要创建动态效果，可以让遮罩层或被遮罩层动遮罩层或被遮罩层动起来起来。对于用作遮罩的填充形状，可以使用补间形状；。对于用作遮罩的填充形状，可以使用补间形状；对于类型对象、图形实例或影片剪辑，可以使用补间对于类型对象、图形实例或影片剪辑，可以使用补间动画。动画。遮罩动画的构成遮罩动画的构成疑问？疑问？轮廓线制作的图形可不可以用做遮罩项目？疑问？疑问？ 遮罩层动起来的效果和被遮罩层动起来的动画效果有什么不同？返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例P

10、age 13娄底技师学院机电系Flash CS3Flash CS3制作遮罩动画的具体操作如下。制作遮罩动画的具体操作如下。 （1）在普通层中创建要显示的内容。）在普通层中创建要显示的内容。 （2）在普通层上方新建一个图层，在其）在普通层上方新建一个图层，在其中创建一个对象或一段动画用来遮罩对象。中创建一个对象或一段动画用来遮罩对象。 （3）将上方的图层转换为遮罩层即可完）将上方的图层转换为遮罩层即可完成一个遮罩动画的创建。成一个遮罩动画的创建。 遮罩动画的实现方法遮罩动画的实现方法疑问？疑问？ ：遮罩动画效果的颜色、形状、大小、动作是取决于遮罩层还是被遮罩层中的对象。Flash CS3返回返回

11、教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 14娄底技师学院机电系Flash CS3Flash CS3文字遮罩动画实例文字遮罩动画实例文字遮罩动画实例文字遮罩动画实例波动文字波动文字任意位置文字任意位置文字反色文字反色文字变色文字变色文字炫动文字炫动文字教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 15娄底技师学院机电系Flash CS3Flash CS3文字遮罩动画实例文字遮罩动画实例波动文字波动文字波动文字的动画效果：波动文字的动画效果：在文字在文字1层输入文字。层输入文字。在文字在文字2层复制文字层复制文字1层的文

12、字并粘贴在当前位置。层的文字并粘贴在当前位置。再插入一个图层，并将其置于最底层，然后制做如图所示矩形再插入一个图层，并将其置于最底层，然后制做如图所示矩形条（高度和长度都要大于文字），并转换成元件，在相应位置插条（高度和长度都要大于文字），并转换成元件，在相应位置插入关键帧，在两个关键帧将矩形条的左边分别对齐文字入关键帧，在两个关键帧将矩形条的左边分别对齐文字1的最左的最左边和最右边，并创建补间动画。边和最右边，并创建补间动画。将文字将文字1层设为遮罩层。层设为遮罩层。【设计思路】【设计思路】Flash CS3返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Pa

13、ge 16娄底技师学院机电系Flash CS3Flash CS3炫动文字炫动文字炫动文字的动画效果：炫动文字的动画效果：在最底层选取一幅图片做背景，并将图层转换成元件。在最底层选取一幅图片做背景，并将图层转换成元件。插入一个新图层，并输入文字。插入一个新图层，并输入文字。在图片层的相应帧插入关键帧，并在两个关键帧的位置分别在图片层的相应帧插入关键帧，并在两个关键帧的位置分别将图片的不同端对齐文字，然后创建补间动画。将图片的不同端对齐文字，然后创建补间动画。将文字所在的层设为遮罩层。将文字所在的层设为遮罩层。时间轴的设置如下图所示：时间轴的设置如下图所示：【设计思路】【设计思路】Flash CS

14、3返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 17娄底技师学院机电系Flash CS3Flash CS3变色文字变色文字变色文字的动画效果：变色文字的动画效果：在最底层（文字在最底层（文字1）录入文字，并设置文字为想要的颜色。）录入文字，并设置文字为想要的颜色。插入一个图层（文字插入一个图层（文字2），并将最底层的文字复制到该的同），并将最底层的文字复制到该的同一位置，并设置为另一种颜色。一位置，并设置为另一种颜色。再插入一个图层（遮罩条），用矩形工具划一高和长都大于再插入一个图层（遮罩条），用矩形工具划一高和长都大于文字的的长矩形，并转换成元件，

15、然后在该层相应位置插入文字的的长矩形，并转换成元件，然后在该层相应位置插入关键帧。关键帧。在两个关键帧将矩形条的左边分别对齐文字在两个关键帧将矩形条的左边分别对齐文字2的最左边和最的最左边和最右边，并创建补间动画，然后将该层设为遮罩层。右边，并创建补间动画，然后将该层设为遮罩层。【设计思路】【设计思路】Flash CS3返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 18娄底技师学院机电系Flash CS3Flash CS3反色文字反色文字反色文字的动画效果：反色文字的动画效果：在图层在图层1画一矩形，并设左右两边画一矩形，并设左右两边 颜色为黑白两色

16、。颜色为黑白两色。在图层在图层2上复制图层上复制图层1的矩形到当前位置，并将其水平翻转。的矩形到当前位置，并将其水平翻转。在图层在图层3中输入文字并转换成元件，然后在相应帧插入关中输入文字并转换成元件，然后在相应帧插入关键帧，并在第一帧将文字移到矩形左边，在最后一个关键帧键帧，并在第一帧将文字移到矩形左边，在最后一个关键帧将文字移到矩形中间，创建补间动画。将文字移到矩形中间，创建补间动画。将图层将图层3设为遮罩层。设为遮罩层。【设计思路】【设计思路】思考思考：能不能实现红绿两种颜色的文字。能不能实现红绿两种颜色的文字。Flash CS3返回返回教学过程教学过程文字遮罩动画文字遮罩动画基本基本概

17、念概念动画动画实例实例Page 19娄底技师学院机电系Flash CS3Flash CS3舞台任意位置显示文字舞台任意位置显示文字舞台任意位置显示文字的动画效果：舞台任意位置显示文字的动画效果：在最底层选取一幅图片做背在最底层选取一幅图片做背景。景。插入一个文字层，然后输入插入一个文字层，然后输入一段文字，并转换为元件。一段文字，并转换为元件。插入一个形状图层，并在相插入一个形状图层，并在相应位置画一矩形，宽度和高度应位置画一矩形，宽度和高度最好大于文字块的大小。最好大于文字块的大小。在文字层相应位置插入关键在文字层相应位置插入关键帧，第一帧将文字移到矩形块帧，第一帧将文字移到矩形块下面，第二

18、关键帧文字移到矩下面，第二关键帧文字移到矩形块的上面，创建补间动画。形块的上面，创建补间动画。将形状图层设为遮罩层。将形状图层设为遮罩层。【设计思路】【设计思路】返回返回Flash CS3教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 20娄底技师学院机电系Flash CS3Flash CS3上机实习上机实习一、上机制作本讲所讲的文字遮罩动画。一、上机制作本讲所讲的文字遮罩动画。【实训目的】【实训目的】FlashFlash是一个工具软件，只有通过大量的练习和是一个工具软件，只有通过大量的练习和思考，才能提高我们的动画制作水平。思考，才能提高我们的动画制作水平。教学过程教学过程文字遮罩动画文字遮罩动画基本基本概念概念动画动画实例实例Page 21娄底技师学院机电系Flash CS3Flash CS3思考与练习思考与练习思考如何利用遮罩制作放大镜效果，如图所示。 上机实习上机实