《数字设计与动画制作》课件-第5课 传统补间动画

第5课

传统补间动画任务1片头动画

活动1片名动画活动2背景变色第5课传统补间电子日记传统补间是Animate的前身Flash早期用来创建动画的一种形式，虽然其控制性不如后来增加的新的补间动画，但鉴于其易用性和对HTML5Canvas更友好的支持，现在依然很重要的一种动画形式。传统补间动画可以记录元件实例的位置、大小、颜色、效果、滤镜及旋转等各种属性的变化。本案例是利用传统补间动画技术制作的一个志愿者故事的电子日记：片头是电子日记名；第一幕她第一次遇见正在扶老奶奶过马路的志愿者他；第二幕她很多次遇见他在做各种各样的志愿者服务；第三幕她终于加入他的行列也成为一名光荣的志愿者。1案例设计理解传统补间动画的原理，了解传统补间动画的特点，熟练掌握创建传统补间方法；掌握使用传统补间为对象创建位置、大小、颜色、效果、滤镜及旋转的动画效果。2

学习目标3

策划导图传统补间动画传统补间是指在一个关键帧放置一个元件实例，然后在另一个关键帧上放置同一个元件实例并改变其大小、色彩、位置、方向等属性，Animate自动在这两个关键帧之间的普通帧内插入中间状态形成动画，类似于传统动画中的原画和中间画。传统补间可以实现两个实例之间的位置、大小、旋转、色彩等各种过渡效果。4

预备知识各种形式的传统补间动画4

预备知识学习步骤

以案例教学为核心，采用任务驱动式的行动导向教学法。采取了由浅入深、循序渐进的教学策略，以学生的感知、理解、巩固、运用为教学设计流程。教学互动环节中主要包括六个步骤：明确任务——计划筹备——学生实施——引导组织——评估反馈——巩固实践。教学资源

多媒体机房、投影仪、电子教学平台、视频演示教程、案例源文件、素材、ppt等任务2第一幕动画

活动1女生进场动画活动2男生进场动画活动3文字进场动画活动4退场动画第5课传统补间电子日记（1）创建传统补间动画步骤1：在图层的特定帧处创建关键帧，作为起始关键帧，将元件实例放入舞台，并设置好此实例的初始属性，如位置、大小、颜色等。5

知识链接步骤2：选择同一图层的另外一帧处，添加结束关键帧，修改舞台上此实例的属性。5

知识链接步骤3：在起始和结束关键帧之间的任意一帧处单击鼠标右键，在弹出菜单中选择“创建传统补间”命令（或选择时间轴控件中的“创建传统补间”命令），两个关键帧之间会变为浅紫色背景并出现一条从动画起始帧指向结束帧的箭头，这就表示传统补间动画已经创建成功了。5

知识链接学习步骤

以案例教学为核心，采用任务驱动式的行动导向教学法。采取了由浅入深、循序渐进的教学策略，以学生的感知、理解、巩固、运用为教学设计流程。教学互动环节中主要包括六个步骤：明确任务——计划筹备——学生实施——引导组织——评估反馈——巩固实践。教学资源

多媒体机房、投影仪、电子教学平台、视频演示教程、案例源文件、素材、ppt等任务3第二幕动画

活动1女生进场动画活动2男生进场动画活动3文字进场动画活动4退场动画第5课传统补间电子日记（2）设置传统补间属性选择起始和结束帧之间的任意一帧，在“属性”面板中可以设置补间动画的缓动、旋转以及支持沿路经运作等属性。5

知识链接

默认情况下，补间动画补间帧之间的变化速率是不变的，若要产生更逼真的动画效果，可对传统补间应用缓动属性，缓动可以通过逐渐调整变化速率创建更为自然的加速或减速效果。缓动类型：下拉列表中包括“属性（一起）”和“属性（单独）”两个选项，可以为对象的位置、旋转、缩放、颜色、滤镜属性一起设置或分开单独设置缓动。5

知识链接缓动效果：单击每个属性的“缓动效果”按钮，打开缓动预设窗口，如图3.3.58所示，可以从中选择预设好各种缓动效果，双击应用到对象上。5

知识链接编辑缓动：单击“编辑缓动”按钮，打开“自定义缓动”对话框，如图3.3.59所示，可以更精确地控制传统补间的速度。“自定义缓动”对话框显示一个表示运动程度随时间而变化的图形。水平轴表示帧，垂直轴表示变化的百分比。第一个关键帧表示为0%，最后一个关键帧表示为100%。5

知识链接学习步骤

以案例教学为核心，采用任务驱动式的行动导向教学法。采取了由浅入深、循序渐进的教学策略，以学生的感知、理解、巩固、运用为教学设计流程。教学互动环节中主要包括六个步骤：明确任务——计划筹备——学生实施——引导组织——评估反馈——巩固实践。教学资源

多媒体机房、投影仪、电子教学平台、视频演示教程、案例源文件、素材、ppt等任务4第三幕动画

活动1文字进场动画活动2男女生进场动画活动3Logo动画第5课传统补间电子日记（3）传统补间动画的制作技巧构成传统补间动画的对象必须是元件实例，包括影片剪辑、图形元件、按钮、文字、位图和组合等；不能是形状，只有把形状“组合”或转换为“元件”后，才可以创建传统补间动画。创建传统补间动画需要建立起始和结束两个关键帧，而且两个关键帧处一般是同一元件的实例，如果是不同元件的实例，虽然也能建立补间，但补间效果难以达到要求。两个关键帧处的内容都只允许一个元件实例，如果有多个对象要创建传统补间，应该把它们放在不同的图层上。在对滤镜变化创建传统补间的时候，两个关键帧的实例必须使用的是同一种滤镜。5

知识链接知识获取知识要点理解传统补间动画的原理熟练掌握创建传统补间方法掌握使用传统补间为对象创建位置、大小、颜色、效果、滤镜及旋转的动画效果学会设置补间缓动效果技能掌握实训案例技能目标

任务1片头动画

æ片名动画

æ背景变色任务2第一幕动画

æ人物进场

æ文字进场

æ出场动画任务3第二幕动画

æ人物进场

æ文字进场

æ出场动画任务4第三幕动画

æ人物进场

æ文字进场

校园日志6

学习检测学习步骤

以案例教学为核心，采用任务驱动式的行动导向教学法。采取了由浅入深、