flash二维动画设计与制作教案.docx

flash二维动画设计与制作教案.docx

《flash二维动画设计与制作教案.docx》由会员分享，可在线阅读，更多相关《flash二维动画设计与制作教案.docx（116页珍藏版）》请在冰豆网上搜索。

flash二维动画设计与制作教案

2、教案设计

试讲教案（4学时）

广宗县职教中心赵云肖2018.8

课程名称

FlashCS5二维动画制作案例教程

学时

4

序号

1

授课班级

计算机1班

日期

2018.8

任课教师

赵云肖

课题

FlashCS5基础知识

教学目标

能力目标：

1.掌握Flash软件的多种启动和关闭方法。

2.熟练掌握工作面板的设置方法

应用性知识目标

熟练掌握不同FLASH文档中,场景和背景等属性的设置方法

训练

项目

（任务）

能够结合行业理解不同类型Flash动画的特点和作用

教学

媒体

准备

多媒体播放，利用FLASH技术完成的视频、动画、游戏作品

教学重点

1.了解Flash动画的特点、应用领域和制作流程。

2.认识Flash的工作界面，并熟练设置Flash文档的属性。

教学难点

如何为不同类型的动画文档设置文档属性。

教学环节

教学内容

教师活动

学生活动

引入

新授

播放flash动画

一、Flash软件介绍

1. Flash软件介绍

2．Flash动画的应用领域

Flash动画

Flash电视动画

FlashMV

Flash广告

Flash电影

网页设计与网络导航

网络动画

网络游戏

3. Flash的界面介绍

菜单栏

主工具栏

时间轴

工具箱

场景

属性检查器

库面板

动作面板

4．启动和退出FlashCS5

5.创建和设置“范例”动画文档

6.新建动画文档

7.设置动画文档的属性

8. 保存动画文档

9.实训——创建“练习”动画文档

1.4 思考与练习

播放动画

介绍

讲解

播放动画

广播

演示教学

指导

讲解

指导

观看

听讲

观看

记忆

思考

理解

制作

听讲

练习

小结

1、了解FlashCS5的特点、应用领域、制作流程和工作界面。

2、掌握动画文档的新建、设置和保存操作，并能设置网格、标尺和辅助线等文档属性。

3、对于本章的内容，学员应认真学习和掌握，为后面工具和命令的使用打下基础。

课外作业

想一想：

在生活中常在哪些地方看到Flash作品的使用？

教后札记

第3、4课时教案月日第周星期

课时内容

绘制图形

课型

新授

课时

2

教学目标

1.掌握FlashCS5工具箱中工具的使用

2.熟练掌握工作面板的设置方法。

教学重点

1.工具箱中工具的使用方法

2.工具属性的设置

教学难点

工具属性的设置

课前准备

备课，准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

如何新建文档和设置文档属性

一、工具的使用

基础绘图知识

矢量图形和位图图像

矢量图可以无限放大，不会有任何变化

位图也称点阵图像，它由许多像素点组成

线条和填充图形

所谓线条是指线条工具、钢笔工具、铅笔工具、椭圆工具、矩形工具；

所谓填充是指墨水瓶工具、颜料桶工具、刷子工具

墨水瓶工具改变线条的颜色，颜料桶工具不可以改变线条的颜色

1、铅笔工具

铅笔工具可绘制任意线条。

使用铅笔工具绘制线条时，按住shift键可绘制水平及垂直直线。

单击铅笔工具后，在选项区域中显示铅笔模式按钮。

铅笔模式有伸直、平滑、墨水

设置铅笔工具的属性

2、线条工具

线条工具用于绘制各种不同角度的直线

设置线条工具的属性

创建规则图形

3、椭圆工具

1.绘制椭圆

2.使用对象绘制模式绘图

4、矩形工具

1.绘制矩形

5、多角星形工具

绘制多边形和星形

1.3案例1绘制简单脸谱

1.3.1创建动画

案例1绘制简单脸谱，制作步骤：

1.文件--新建Flash文档

2.通过”窗口——工作区——设计人员,将窗口设置为”设计人员”模式;

3.用工具面板中的圆形工具，在舞台中绘制正圆。

（SHIFT）

4.用工具面板中的”线条工具”，在舞台中绘制三根直线，并用”选择工具”将直线调整成弧线，做成眼睛和嘴巴的样子。

5.在时间轴面板上选择图层1的第20帧，按下F6键，插入关键帧。

6.测试影片（CTRL+ENTER）

7.保存文件

提问

介绍工具

讲解

演示工具使用方法

介绍

讲解

广播

演示

指导

思考、回答

听讲

记忆工具的功能

观看

理解

记忆工具属性设置

听讲

记忆

练习

小结

1.掌握工具的作用

2.掌握工具的使用方法

3.熟练设置工具属性，绘制图形

课内外

作业

绘制如图所示标志：

教后札记

第5、6课时教案月日第周星期

课时内容

FlashCS5工具的使用

课型

新授

课时

2

教学目标

1、学会使用选择工具、颜料桶工具

2、学会使用变形面板调整图形

教学重点

学会编辑、调整图形

教学难点

使用工具绘制组合图形

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

工具的简单使用

一、导入：

我们经常在动画片中看到蓝天白云及小屋，它们是怎么绘制出来的呢？

下面我们来试试把它绘出来。

二、案例4绘制蓝天、白云和房屋

方法：

1、白云：

用椭圆相交咬合的方法，绘制多个椭圆相交，删除多余的线条；

2、房屋：

（1）先绘制两个相同宽度的矩形，上面一个做房顶，下面一个做房屋的正面。

（2）用任意变形工具将上面的矩形修改成平行四边形，并向右水平移动。

（3）用线条工具连接两个图形

（4）用线条工具画出房屋的顶部和左面

（5）用矩形、线条工具划出窗户和门，最后填充颜色。

三、课堂练习：

2、绘制城市夜景

提问

介绍工具

分析

演示工具使用方法

介绍

讲解

广播

演示

广播如何使用变形工具

演示填色方法

指导

拓展练习

分析

指导

思考、回答

听讲

思考

观看

理解

听讲

记忆

听讲

记忆

练习

思考

绘制

制作

小结

1.掌握工具的作用

2.掌握填色工具的使用方法

3.熟练设置工具属性，绘制图形

课内外

作业

教后札记

第7、8课时教案月日第周星期

课时内容

FlashCS5工具的使用

课型

新授

课时

2

教学目标

1、学会钢笔工具的使用

2、熟练工具绘制、编辑图形

教学重点

1、钢笔工具的使用

2、编辑、调整图形

教学难点

图形的编辑

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

工具的简单使用

一、导入：

回顾前面工具的使用情况

二、介绍钢笔工具的使用

1．新建一个FlashCS4空白文档，进入场景，点鼠标右键，在弹出的快捷菜单中，选择“文档属性”，（800*400）

2．选择工具箱中的“钢笔”作为主要绘图工具。

并将“钢笔”工具的属性设置为图所示。

笔线要细，色彩要柔和一些。

（0.1，灰色）

3．绘制脸形、耳朵的轮廓线。

注意锚点要尽量平滑、自然。

基本符合青年男性的解剖特征。

当然最好根据剧本的要求来设定。

4．进行轮廓线的调整。

主要利用“钢笔”的锚点添加、删除、转。

5．根据面部轮廓画出眼睛和眉毛。

为了角色以后的动作设计和修改方便，最好根据绘制顺序和各部分器管命名为不同的图层。

分别为面部轮廓、眼睛眉毛、鼻子、嘴巴、头发等。

6．根据以上的方法再分别用“钢笔”工具画出其它各部分的线条草图。

提问

介绍工具

分析

演示工具使用方法

介绍

讲解

广播

演示

广播如何使用变形工具

演示填色方法

指导

拓展练习

分析

指导

思考、回答

听讲

思考

观看

理解

听讲

记忆

听讲

记忆

练习

思考

绘制

小结

1.掌握工具的作用

2.掌握填色工具的使用方法

3.熟练设置工具属性，绘制图形

课内外

作业

绘制灭火器

教后札记

第9、10课时教案月日第周星期

课时内容

编辑图形

课型

新授

课时

2

教学目标

1.掌握“任意变形工具”的使用方法。

2.熟练掌握图形的复制、组合、对齐和分离等操作方法。

3.熟练使用“渐变变形工具”调整图形的填充。

教学重点

1、工具的使用

2、编辑、调整图形

教学难点

图形的编辑

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

知识回顾：

在前面讲解了FlashCS5编辑图形的相关操作，在实例制作过程中也接触了图形调整和场景组合等操作。

编辑花朵

1. 填充渐变色

颜料桶工具的使用

2. 调整渐变色

调整渐变色工具的使用

3. 选择和复制图形

选择对象的方法

套索工具的使用

复制对象的方法

4. 旋转和变形图形

变形工具的使用

变形面板的使用

完成花朵的制作

提问

介绍工具

分析

演示工具使用方法

广播如何使用变形工具

演示填色方法

指导

拓展练习

分析

指导

思考、回答

听讲

思考

记忆

听讲

记忆

练习

思考

绘制

小结

1.掌握工具的作用

2.掌握面板的设置方法

课内外

作业

教后札记

第11、12课时教案月日第周星期

课时内容

编辑图形

课型

新授

课时

2

教学目标

1.加强对工具栏中的图形编辑工具的认识和理解，熟练掌握使用菜单栏编辑图形的操作方法。

教学重点

编辑图形，层叠对象

教学难点

图形的编辑

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

图形的编辑方法

组合图形

1. 渐变工具的使用

使用渐变工具对图形填充色进行编辑

2. 组合对象

对象的选择和组合

3. 层叠图形

设置对象的层

4. 对其图形

对齐面板的使用

练习：

制作圣诞场景

提问

介绍工具

分析

演示工具使用方法

广播如何使用变形工具

演示填色方法

指导

拓展练习

分析

指导

思考、回答

听讲

思考

记忆

听讲

记忆

练习

思考

绘制

小结

1.掌握工具的作用

2.掌握面板的设置方法

课内外

作业

课堂案例2——制作圣诞场景上机实训——制作山坡场景

教后札记

第13、14课时教案月日第周星期

课时内容

创建文本

课型

新授

课时

2

教学目标

1.掌握文本工具使用方法

2.理解不同文本的使用

3.掌握文本属性设置

教学重点

文本输入与编辑

教学难点

文本属性设置

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

图形的编辑方法

文本的类型

1. TLF文本

1）TLF文本介绍

2）TLF文本的输入

3）TLF文本的属性设置

2. 传统文本

1）传统文本的类型与使用介绍

2）传统文本的输入

3）传统文本属性设置

3. 打散文本

4. 文本超链接设置

1）超链接设置

2）超链接链接选项介绍

练习：

制作卡通文字

提问

介绍工具

广播

演示工具使用方法

演示

操作

讲解

指导

思考、回答

听讲

理解

思考

记忆

听讲

记忆

练习

思考

制作

小结

1.掌握工具的作用

2.掌握面板的设置方法

课内外

作业

制作如下图所示卡通文字

教后札记

第15、16课时教案月日第周星期

课时内容

创建文本

课型

新授

课时

2

教学目标

1.掌握文本工具使用方法

2.掌握滤镜的使用方法

教学重点

文本输入与编辑、滤镜使用

教学难点

文本属性设置、滤镜设置

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

文本的类型及使用

滤镜设置

1. 投影滤镜

滤镜的添加与设置

2. 发光滤镜

滤镜的添加与属性设置

3. 斜角滤镜

4. 调整颜色滤镜

5.模糊滤镜

6.滤镜的启用与禁用

7.滤镜的重置与删除

练习：

制作招聘网页

提问

介绍

广播

演示

操作

讲解

指导

思考、回答

听讲

理解

思考

记忆

听讲

记忆

练习

思考

制作

小结

1.掌握工具的作用

2.掌握面板的设置方法

课内外

作业

课堂练习1——招聘网页课题练习2——个人名片

教后札记

第17、18课时教案月日第周星期

课时内容

使用素材和元件

课型

新授

课时

2

教学目标

1.掌握图片素材和分层文件的导入操作。

2.熟练掌握元件的创建、“库”面板中素材的管理和使用等操作。

3.熟练掌握视频的导入和FLVPlayback组件的编辑操作。

4.加强对元件、实例和“库”面板的认识和理解，能够在设计作品时有条理地管理文件。

教学重点

1.各种类型文件的导入操作。

2.元件的创建和“库”面板的管理操作。

教学难点

文本属性设置、滤镜设置

课前准备

如何在设计作品过程中灵活运用并管理“库”面板中的文件。

教学环节

教学内容

教师活动

学生活动

回顾

新授

回顾前面制作圣诞场景的时候用到的转换元件方法

一.合成“郊外”场景

1.认识元件

介绍元件种类及特点

2创建元件

演示如何创建元件

3.认识“库”面板

介绍库面板

演示如何使用库面板

4.导入位图

演示导入位图的方法

5.导入PSD文件

演示如何导入psd文件

6导入AI文件

演示如何导入AI文件

7将位图转换为矢量图

演示将位图转换为矢量图的方法

8Flash支持的文件格式

介绍flash支持的格式

二.　制作“蓝雨片头”播放网页

5.2.1设置图层不透明度

5.2.2编辑FLVPlayback组件外观

三.习题

提问

介绍

广播

演示

操作

讲解

指导

思考、回答

听讲

理解

思考

记忆

听讲

记忆

练习

思考

制作

小结

1、认识元件和“库”面板。

2、掌握创建元件、导入位图、导入PSD文件、导入AI文件、将位图转换为矢量图以及视频文件的导入和编辑等操作。

课内外

作业

利用元件绘制人物头像，并制作动画

教后札记

第19、20课时教案月日第周星期

课时内容

制作基础动画

课型

新授

课时

2

教学目标

1.认识“时间轴”面板中的图层和帧。

2.熟练掌握图层和帧的基本操作。

3.熟练掌握逐帧动画制作方法

教学重点

1.时间轴面板的使用

2.逐帧动画的制作

教学难点

关键帧和空白关键帧的使用

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

新授

一.时间轴面板的使用

1.认识图层

图层的种类

2图层按钮的使用

1）如何新建图层，新建文件夹，删除图层

2）显示隐藏图层按钮的使用

3）锁定和解锁图层按钮的使用

4）显示轮廓按钮的使用

3.认识帧

帧的种类

帧居中等按钮的使用

4.百合花开逐帧动画的制作

1）导入素材到库

2）插入空白关键帧

3）制作第一帧内容

4）插入空白关键帧

5）制作第二帧内容

……

5.测试修改动画

学生完成跑动的小狗动画制作

提问

介绍

广播

演示

操作

讲解

指导

思考、回答

听讲

理解

思考

记忆

练习

思考

制作

小结

1.图层和帧的认识与操作。

2.掌握逐帧动画的制作方法。

课内外

作业

制作跑动的小狗动画

教后札记

第21、22课时教案月日第周星期

课时内容

制作红绿灯动画

课型

新授

课时

2

教学目标

1.熟练掌握图层和帧的操作。

2.熟练掌握逐帧动画制作方法

3.认识逐帧动画的应用

教学重点

1.时间轴面板的使用

2.逐帧动画的制作

教学难点

关键帧和空白关键帧的使用

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

回顾

新授

一.回顾关键帧和空白关键帧的使用

一、播放动画，提出任务

红灯亮20s后转黄灯3s，然后绿灯20s，再转黄灯3s，再变成红灯……

二、分析任务

1.灯的时间长度怎么计算？

2.动画分基层，每层内容是什么？

3.关键帧在哪些地方使用？

三、学生尝试完成任务

四、根据学生完成情况进行针对性指导

五、假如灯的进行变化前的一秒要闪动三下，如何完成？

提示：

关键帧使用

六、假如灯在亮的同时要进行计秒倒计时，该如何实现？

提示：

加层，加帧的计算

提问

广播

提出任务

演示

分析

讲解

指导

巡视

提示

解答

提问

分析

思考、回答

观看

思考

听讲

思考

理解

制作

提问

思考

完成制作

思考

制作

小结

1.如何通过帧来控制时间

2.关键帧的正确使用

3.要注意交通安全

课内外

作业

完成红绿灯动画制作

教后札记

第23、24课时教案月日第周星期

课时内容

制作跳动小球

课型

新授

课时

2

教学目标

1.掌握移动动画的制作方法

2.理解传统动画和补间动画的区别

3.掌握形变动画的制作方法

教学重点

1.动画制作

2.动画与传统动画的区别

教学难点

动画间的区别

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

新授

一、移动动画的制作

1.如何制作传统移动动画

2.制作移动动画（不需要使用关键帧，要转换成元件）

二、制作跳动小球

1.制作背景

2.制作小球移动动画

3.更改小球移动路径

4.测试动画

三、创建文字形变动画

1.输入文本

2.创建形变动画

3.添加形状提示

4.测试动画

操作

广播

操作演示

讲解

指导

广播

讲解

分析

指导

观看

听讲

听讲

思考

记忆

制作

观看

思考

完成作业

小结

1.传统移动动画和补间动画的区别

2.形变动画的制作

课内外

作业

下落的小球

教后札记

第25、26课时教案月日第周星期

课时内容

形变动画

课型

新授

课时

2

教学目标

1.了解补间动画的概念及原理

2.区分动作补间动画和形状补间动画

3.能制作简单形状补间动画

教学重点

制作形状补间动画

教学难点

会制作形状补间动画

课前准备

备课、准备素材

教学环节

教学内容

教师活动

学生活动

新授

1、补间动画的概念

在Flash动画制作过程中，只做开始和结果，中间过程由Flash软件自动生成的动画。

2、补间动画的制作方法

两个关键帧、一个补间。

3、补间动画的类型

补间动画分为传统补间动画和形状补间动画两类。

区别之处

动作补间动画

形状补间动画

在时间轴上的表现

淡紫色背景加长箭头

淡绿色背景加长箭头

组成元素

影片剪辑、图形元件、按钮

形状，如果使用图形元件、按钮、文字，则必先打散再变形。

完成的作用

实现一个元件的大小、位置、颜色、透明等的变化。

实现二个形状之间的变化，或一个形状的大小、位置、颜色等的变化。

4、形状补间动画分为如下两类：

一般补间形状：

一般补间形状是指不需要人工干预

可控补间形状：

运用形状提示（添加变形提示符）

形状补间动画的【属性】面板上只有二个参数：

（1）“简单”选项

在“0”边有个滑动拉杆按钮

 ，单击后上下拉动滑杆或填入具体的数值，形状补间动画会随之发生相应的变化。

1.在1到-100的负值之间，动画运动的速度从慢到快，朝运动结束的方向加速度补间。

2.在1到100的正值之间，动画运动的速度从快到慢，朝运动结束的方向减慢补间。

3.默认情况下，补间帧之间的变化速率是不变的。

（2）“混合”选项

“混合”选项中有二项供选择：

1.“角形”选项：

创建的动画中间形状会保留有明显的角和直线，适合于具有锐化转角和直线的混合形状。

2.“分布式”选项：

创建的动画中间形状比较平滑和不规则。

至此，“形状补间动画”的相关知识大家都已经有所了解，下面动手个实例，体会一下形状补间动画的奇妙。

三、实例演示

案例15:

圆变方

方法要领：

在两个关键帧中分别画出图形“圆”和“矩形”，创建形状补间动画。

步骤：

1、在第1个关键帧中用“椭圆”工具绘制一个正圆。

2、在时间轴面板第30帧插入关键帧，用“矩形”工具绘制一个正方形。

3、将鼠标放到时间轴1于30帧之间，单击右键，在弹出的菜单里选择“创建补间形状动画”。

4、测试、保存。

案例16：

制作文字变形动画

方法要领：

因为形状补间动画操作对象是图形，因此，在用文字、数字等制作变开动画时，要先分离成图形（Ctrl+B）

步骤：

1、在第1个关键帧中用“文本”工具输入文字“变形文字”；

2、执行“修改——分离”命令（或按Ctrl+B）两次，将文字分离成图形；

3、在第30帧插入关键帧，输入文字“FLASH”；

4、利用步骤2中的方法将“FLASH”分离成图形；

5、将鼠标移动到1到30帧之