Flash CS6动画与制作 电信学院.

Presentation on theme: "Flash CS6动画与制作 电信学院."— Presentation transcript:

1 Flash CS6动画与制作 电信学院

2 第2章 电子贺卡制作 教学提示 1 教学重点与难点 2 教学内容 3 本章小结 4

3 第2章 电子贺卡制作 教学提示 本章主要通过3个导入案例介绍使用Flash工具箱中的工具绘制图形的方法和技巧。最后通过综合项目“圣诞贺卡”介绍电子贺卡类作品的制作流程和技巧

4 第2章 电子贺卡制作 教学重点与难点 掌握Flash工具箱中的各种工具的使用方法，元件和实例的建立和编辑方法，图层的基本操作方法，场景的应用方法，电子贺卡类作品的制作方法与技巧

5 第2章 电子贺卡制作 教学内容 2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例
2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例 2.5 “圣诞贺卡”项目

6 2.1 概述 本节内容 1. 绘图工具介绍 2. 绘图常用的操作技巧

7 2.1 概述 一、绘图工具介绍 几何形状绘制工具 基本绘图工具 徒手绘制工具 选择工具 填充工具 图形修改工具 变形工具 文本工具

8 2.1 概述 二、绘图常用的操作技巧 （1）选择、移动和复制对象； （2）进入对象内部进行操作； （3）排列图形；
（4）进行图形的组合和打散； （5）导入位图； （6）将位图转换为矢量图形； （7）建立和使用元件； （8）建立新图层和使用图层的技巧； （9）将线条转换为填充；

9 第2章 电子贺卡制作 教学内容 2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例
2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例 2.5 “圣诞贺卡”项目 9

10 2.2 “都市街道” 案例 本节内容 1. 案例效果 2. 操作步骤 3. 技术拓展 4. 练习

11 2.2 “都市街道” 案例 一、案例效果 重点与难点：“线条”、“铅笔”、“矩形”、“椭圆”、“刷子”、“橡皮擦”的使用及“属性”面板的设置，一点透视法的绘图方法与原理，以及图形的平滑、伸直和优化等功能应用

12 2.2 “都市街道” 案例 二、操作步骤 1.设置“文档属性”，并把文件保存为“都市街道” 2.绘制天空，绘制效果如下图
2.2 “都市街道” 案例 二、操作步骤 1.设置“文档属性”，并把文件保存为“都市街道” 2.绘制天空，绘制效果如下图 注意：“填充颜色”设为“#C7EDFC”

13 2.2 “都市街道” 案例 二、操作步骤 3.绘制具有透视效果的道路 ，绘制过程如下图

14 2.2 “都市街道” 案例 二、操作步骤 4.绘制具有透视效果路灯 ，绘制过程如下图 14

15 2.2 “都市街道” 案例 二、操作步骤 5.绘制具有透视效果的建筑物 ，绘制过程如下图

16 2.2 “都市街道” 案例 二、操作步骤 6.绘制白云，利用刷子和橡皮擦工具实现 7.保存并测试影片 16

17 2.2 “都市街道” 案例 三、技术拓展 1.“线条工具”的使用：“线条工具”擅长的是绘制直线 。“线条工具”的属性面板如下图
2.2 “都市街道” 案例 三、技术拓展 1.“线条工具”的使用：“线条工具”擅长的是绘制直线 。“线条工具”的属性面板如下图 提示：在使用“线条工具”绘制直线时，按住【Shift】键可以绘制水平、竖直方向上的直线，也可以绘制出倾斜45°的直线。

18 2.2 “都市街道” 案例 三、技术拓展 2.“铅笔工具”的使用：可以绘制出任意形状的线条和图形。“铅笔工具”有3种绘图模式：“直线化”、“平滑”和“墨水”绘图模式，如图所示。

19 2.2 “都市街道” 案例 三、技术拓展 3.“矩形工具”的使用：“矩形工具”擅长绘制矩形、正方形和圆角矩形。“矩形工具”的属性面板如下图

20 2.2 “都市街道” 案例 三、技术拓展 4.“椭圆工具”的使用：“椭圆工具”擅长绘制椭圆和正圆，还可绘制扇形、空心椭圆或空心扇形。“基本椭圆工具”的属性面板如下图。 注意：Shift键可以画正圆。使用“基本椭圆工具”绘制扇形时，需要输入起始角度，其范围为0～360，沿顺时针方向旋转。

21 2.2 “都市街道” 案例 三、技术拓展 5.“刷子工具”的使用：刷子可以设置其形状和大小，共有5中模式可供选择

22 2.2 “都市街道” 案例 三、技术拓展 6.“橡皮擦工具”的使用：橡皮擦可以设置其形状和大小，共有5中模式可供选择

23 2.2 “都市街道” 案例 三、技术拓展 7．图形的平滑、伸直和优化
2.2 “都市街道” 案例 三、技术拓展 7．图形的平滑、伸直和优化 在Flash中还有一些辅助功能不但可以使图形美观，而且可以减少线段的数量，减小Flash影片的尺寸，以方便使用“选择工具”来调整线条，它们是“平滑”、“伸直”和“优化”功能。

24 2.2 “都市街道” 案例 三、技术拓展 8. 透视：在Flash动画中安排场景中的人物、道具、背景时，常常需要使用“透视”原理，简单的说，“透视”就是指按照近大远小的原理安排图形

25 2.2 “都市街道” 案例 三、技术拓展 一点透视法：
2.2 “都市街道” 案例 三、技术拓展 一点透视法： 是指画面上透视线汇集于一点，就像伸向远方的铁轨那样，而这一点又叫消失点。 如下图所示：

26 2.2 “都市街道” 案例 四、练习 (1) 使用“矩形工具”、“椭圆工具”和“多角星形工具”绘制一座别墅，样式自己设计。
2.2 “都市街道” 案例 四、练习 (1) 使用“矩形工具”、“椭圆工具”和“多角星形工具”绘制一座别墅，样式自己设计。 (2)“刷子工具”有几种绘画模式？它们各有什么特点？ (3)“橡皮擦工具”有几种擦除模式？它们各有什么特点？

27 第2章 电子贺卡制作 教学内容 2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例
2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例 2.5 “圣诞贺卡”项目 27

28 2.3 “春天来了” 案例 本节内容 1.案例效果 2.操作步骤 3.技术拓展 4.练习

29 2.3 “春天来了” 案例 一、案例效果 重点与难点：“选择工具”、“钢笔工具”、“多角星形工具”、 “任意变形工具”、“颜料桶工具”、“渐变变形工具”的使用，元件的建立和编辑，实例的编辑，图层的基本操作

30 2.3 “春天来了” 案例 二、操作步骤 1.设置“文档属性”，并把文件保存为“春天来了”。 2.绘制树干
（1）使用“铅笔工具”的“平滑”模式绘制大树的树干轮廓，利用“选择工具”调整线条，使其如下图

31 2.3 “春天来了” 案例 二、操作步骤 （2）使用“颜料桶工具”填充树干，“渐变变形工具”调整填充效果，过程如下图
（3）选中整棵大树，把其转换为“大树”元件

32 2.3 “春天来了” 案例 二、操作步骤 3.绘制树叶 (1)设置“钢笔工具”的属性，绘制一片树叶，过程如下图

33 2.3 “春天来了” 案例 二、操作步骤 3.绘制树叶 （2）复制5片树叶，调整树叶位置及大小如下图。
（3）使用“铅笔工具”绘制树干，效果如下图。 （4）将绘制好的整个树叶转换为“树叶”图形元件。

34 2.3 “春天来了” 案例 二、操作步骤 4.绘制“小草”元件，并“平滑”小草，过程如下图。
5.绘制“小鸟”元件，并进行颜色填充，过程如下图。

35 2.3 “春天来了” 案例 二、操作步骤 6.整合图层。绘制草地，并把绘制好的各个元件，拖放到舞台的适当位置进行调整，最后效果如下图。

36 2.3 “春天来了” 案例 三、技术拓展 1.“多角星形工具”的使用：“多角星形工具”擅长绘制多边形和星形。“多角星形工具”的属性面板如下图：

37 2.3 “春天来了” 案例 三、技术拓展 2.“钢笔工具”的使用：钢笔工具擅长绘制直线和曲线 （1）钢笔工具下拉菜单不同图标的含义如下图

38 2.3 “春天来了” 案例 三、技术拓展 （2）在使用【钢笔工具】绘制图形的过程中，光标也会出现不同的三种样式， 表示单击可以创建一个锚点， 表示单击该锚点并拖动可以绘制出一条直线， 还可以将原来弧线的锚点变成直线的连接点。 表示单击锚点可以形成一个封闭的图形。 ： ： ； ： ”

39 2.3 “春天来了” 案例 三、技术拓展 3.“任意变形工具”的使用
使用【任意变形工具】不仅可以对矢量图形进行缩放、旋转、倾斜、扭曲封套等，还可以对元件实例、群组、文本和位图等执行这些操作。 提示：当按住【Shift】键来扭曲图形时，可以进行对称扭曲，如图2.83所示的第三个图就是通过把鼠标指针放在右上方的控制柄上单击并向下拖动实现的。

40 2.3 “春天来了” 案例 三、技术拓展 4.“颜料桶工具”的使用
在使用各种线条绘制工具和几何图形绘制工具绘制物体的外观轮廓线之后，一般使用“颜料桶工具” 来填充颜色。 （1）纯色填充 （2）渐变色填充 （3）位图填充

41 2.3 “春天来了” 案例 三、技术拓展 5.“渐变变形工具”的使用
“渐变变形工具”主要用来调整渐变色填充和位图填充的效果，如渐变色的范围、方向和角度等。

42 2.3 “春天来了” 案例 三、技术拓展 6.元件的使用 （1）使用“元件”的好处：一是可以重复使用“库”中已存在的元件；二是想改变实例的效果不用一个一个来修改，只要修改“库”中的元件；三是同个元件的实例还可以通过“属性”面板来修改它的“位置”、“颜色”“透明度”等，使每个实例都有所不同，四是舞台上每个元件的实例是一个整体，图形之间不会相互影响。 （2）“元件”的建立、编辑和修改方法 。 （3）“元件”实例的编辑方法。

43 2.3 “春天来了” 案例 三、技术拓展 7.对实例的编辑
对实例位置和大小的修改是比较简单的，可以把实例拖放到不同位置，再使用“任意变形工具”就可以修改它的位置和大小了 ，而实例的“颜色”、“透明度”等则是通过实例的“属性”面板来修改的。

44 2.3 “春天来了” 案例 三、技术拓展 8.对图层的操作 （1）图层的种类：普通图层、引导图层、遮罩图层
（2）新建、删除、重命名、复制和移动、隐藏、显示和移动图层 （3）设置和修改图层属性

45 2.3 “春天来了” 案例 四、练习 （1）在使用【钢笔工具】时，光标的不同形状 、 、 、 、 各代表什么含义？
（1）在使用【钢笔工具】时，光标的不同形状 、 、 、 、 各代表什么含义？ （2）请使用【线条工具】绘制下面的小船。 （3）请说出【铅笔工具】的几种绘图模式，各有什么特点？

46 2.3 “春天来了” 案例 四、练习 (4) Flash中有几种填充？它们各有什么特色？ (5) 使用元件有什么好处？
(6) 平滑图形和优化图形有什么区别？各有什么作用？ (7) 建立影片剪辑有几种方法？

47 第2章 电子贺卡制作 教学内容 2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例
2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例 2.5 “圣诞贺卡”项目 47

48 2.4 “特效文字” 案例 本节内容 1.案例效果 2.操作步骤 3.技术拓展 4.练习

49 2.4 “特效文字” 案例 一、案例效果 重点与难点：导入位图的方法、“套索工具”的使用和选项的设置、将位图转换为矢量图形的方法、“文本工具”的使用和“墨水瓶工具”的使用技巧

50 2.4 “特效文字” 案例 二、操作步骤 1.设置“文档属性”，并把文件保存为“特效文字”。 2.制作背景。
2.4 “特效文字” 案例 二、操作步骤 1.设置“文档属性”，并把文件保存为“特效文字”。 2.制作背景。 (1)将舞台的显示比例设为50％，绘制一个矩形，并进行线性填充，使用“渐变变形工具”调整填充效果，效果如下图

51 2.4 “特效文字” 案例 二、操作步骤 (2) 新建一个“图层2”，在该图层导入图片“花与蝴蝶”，将该位图转换为矢量图形，选中其中的花朵和蝴蝶，粘贴到“图层1”并将其转换为元件，调整元件在舞台中的位置，设置其透明度为45％，并删除图层2及库中的位图“花与蝴蝶”，背景图片的效果如下图。

52 2.4 “特效文字” 案例 二、操作步骤 3.制作文字 (1)新建一个“文本”图层，在该图层上使用“文本工具”书写“happy birthday”，并将文字打散，变形、扩充。 (2)借助“墨水瓶工具”，“刷子工具”“颜料桶工具”对文字进行加工，并为字母“a”和“i”设置动画效果，保存为影片剪辑，效果如下图。

53 2.4 “特效文字” 案例 二、操作步骤 4.女孩和小狗 新建一个图层，导入位图“女孩和小狗”，借助“套索工具”将其中的小狗和女孩裁出，放在“happy birthday” 文字的下方，最后效果如下图。

54 2.4 “特效文字” 案例 三、技术拓展 1.图像的导入 2.“套索工具”的使用
2.4 “特效文字” 案例 三、技术拓展 1.图像的导入 2.“套索工具”的使用 套索工具用于选择图形中的不规则形状区域，被选定区域可以作为一个单独的对象进行移动、旋转或变形。共有3种功能按钮，“魔术棒”， “魔术棒设置”和“多边形模式”。 3.将位图转换为矢量图形

55 2.4 “特效文字” 案例 三、技术拓展 4.“文本工具”的使用。
2.4 “特效文字” 案例 三、技术拓展 4.“文本工具”的使用。 要创建漂亮的文字，第一步要选择合适的字体；第二步是对文字进行变形，如压缩、倾斜、旋转等，还可将文字打散后使用图形绘制工具来调整文字形状。 5. “墨水瓶工具”的使用 “墨水瓶工具” 主要用来修改矢量图形的线条，如改变线条的粗细和颜色，也可以为没有轮廓线的填充区添加边线。

56 2.4 “特效文字” 案例 四、练习 （1）制作如图所示的效果文字。 56

57 第2章 电子贺卡制作 教学内容 2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例
2.1 概述 2.2 “都市街道”案例 2.3 “春天来了”案例 2.4 “特效文字”案例 2.5 “圣诞贺卡”项目 57

58 2.5 “圣诞贺卡” 项目 本节内容 1.项目概述 2.项目效果 3.操作步骤 4.技术拓展 5.练习

59 2.5 “圣诞贺卡” 项目 一、项目概述 Flash电子贺卡是由动画、图形、祝福文字和音乐等元素组合而成的特殊艺术品。与传统的纸质贺卡相比，电子贺卡不仅经济、环保，而且方便、快捷。电子贺卡的种类很多，新年卡、圣诞卡、中秋卡、生日卡、情人节卡、儿童节卡等等，不同种类的电子贺卡适合不同的节日和人群。

60 2.5 “圣诞贺卡” 项目 二、项目效果 重点与难点：场景的应用，分镜头脚本的基本绘制知识，动作中的预备与缓冲，按钮元件的建立和使用

61 2.5 “圣诞贺卡” 项目 三、操作步骤 1. 故事情节及分镜头脚本的绘制 （1）编写故事情节
2.5 “圣诞贺卡” 项目 三、操作步骤 1. 故事情节及分镜头脚本的绘制 （1）编写故事情节 （2）根据情节介绍，提炼出重点部分，绘制出分镜头脚本 2. “文档属性”设置。 新建文档设置属性，并把文件保存为“圣诞贺卡”。 3.导入所有的素材

62 2.5 “圣诞贺卡” 项目 三、操作步骤 4.制作“雪球”元件，制作过程如下图：

63 2.5 “圣诞贺卡” 项目 三、操作步骤 5.制作装饰相关图形元件,各元件效果如下图：

64 2.5 “圣诞贺卡” 项目 三、操作步骤 6．制作“圣诞树”元件, 制作过程如下图：

65 2.5 “圣诞贺卡” 项目 三、操作步骤 7．制作“雪花”元件, 效果如下图： 提示：利用“文本工具”制作

66 2.5 “圣诞贺卡” 项目 三、操作步骤 8．制作“礼花”元件, 制作过程如下。 （1）“hua”元件制作： （3）“礼花”元件
2.5 “圣诞贺卡” 项目 三、操作步骤 8．制作“礼花”元件, 制作过程如下。 （1）“hua”元件制作： （3）“礼花”元件 （2）move1和move2元件

67 2.5 “圣诞贺卡” 项目 三、操作步骤 9．制作按钮元件 （1）制作“replay”按钮 （2）制作“惊喜”按钮

68 2.5 “圣诞贺卡” 项目 三、操作步骤 10．制作场景1动画，效果如下图，具体操作步骤请参照教材

69 2.5 “圣诞贺卡” 项目 三、操作步骤 11．制作场景2动画，效果如下图，具体操作步骤请参照教材

70 2.5 “圣诞贺卡” 项目 三、操作步骤 12．制作场景3送礼动画，效果如下图，具体操作步骤请参照教材

71 2.5 “圣诞贺卡” 项目 四、技术拓展 1．Flash贺卡制作流程 制作Flash贺卡一般分为以下几个步骤：
2.5 “圣诞贺卡” 项目 四、技术拓展 1．Flash贺卡制作流程 制作Flash贺卡一般分为以下几个步骤： （1）了解Flash贺卡的种类以及各类贺卡的风格特点，分析制作意向，确定贺卡制作方案，写出初步创意设计方案； （2）围绕设计方案进行策划、分切镜头和寻找相关素材； （3）根据现有所得素材和自身动画制作能力适当修改设计方案； （4）根据最终设计方案，完成各个动画片段制作； （5）将动画片段合成动画短片，并对动画整体进行优化，最终发布作品。

72 2.5 “圣诞贺卡” 项目 四、技术拓展 2．按钮元件的建立与编辑 （1）按钮元件的建立方法
2.5 “圣诞贺卡” 项目 四、技术拓展 2．按钮元件的建立与编辑 （1）按钮元件的建立方法 （2）按钮元件总共包括4种状态：“弹起”、“指针经过”、“按下”和“点击”

73 2.5 “圣诞贺卡” 项目 四、技术拓展 3．元件的使用技巧 在Flash中经常会用到3类元件:图形元件、影片剪辑元件和按钮元件。
2.5 “圣诞贺卡” 项目 四、技术拓展 3．元件的使用技巧 在Flash中经常会用到3类元件:图形元件、影片剪辑元件和按钮元件。 提示：“影片剪辑”元件只需要主时间轴上的一帧就可播放自己时间轴上的任意数目的帧；而“图形”元件只有当主时间轴上的帧数大于等于自己时间轴上的帧数时才能完整播放。在主时间轴上无法直接播放“影片剪辑”元件的动画效果，但可以直接播放“图形”元件的动画效果。 4．实例的颜色调节 可以通过改变舞台中实例对应的“属性”面板中的“色彩效果”选项，对实例的颜色进行调节

74 2.5 “圣诞贺卡” 项目 四、技术拓展 5．场景的应用
2.5 “圣诞贺卡” 项目 四、技术拓展 5．场景的应用 场景操作有：打开、查看、添加、删除、更改场景名、复制、更改场景播放顺序和测试场景动画方法。

75 2.5 “圣诞贺卡” 项目 四、技术拓展 6．场景分镜头绘制
2.5 “圣诞贺卡” 项目 四、技术拓展 6．场景分镜头绘制 分镜头脚本的内容包括镜头号（SC）、背景（BG）、景别、摄影方法、画面的内容、台词、音乐、音效、镜头长度。 镜头分为长焦镜头和广角镜头。

76 2.5 “圣诞贺卡” 项目 四、技术拓展 7．动作中的预备与缓冲
2.5 “圣诞贺卡” 项目 四、技术拓展 7．动作中的预备与缓冲 预备：如果在主要动作之前有一些准备动作，如在踢之前将脚向后缩，观众的注意力将会集中在脚上，这就能保证观众会注意到踢的动作，而这些准备动作就叫做动作中的预备 。 缓冲：在一个动作完成之后由于受到摩擦、空气阻力和风的影响，在停下来的时候为了保持平衡往往要对物体做缓冲。

77 2.拓展题：制作一张感恩节动态贺卡，要求贺卡中要有祝福对象和祝福语句，且贺卡中的动画效果要符合感恩主题。
2.5 “圣诞贺卡” 项目 五、练习 1.拓展题：制作一张梦想成真的贺卡，自己绘制背景上的星空效果，可以添加心形信封及闪烁的星星等，再加入一些你的真心祝福词，参考效果如图 所示。 2.拓展题：制作一张感恩节动态贺卡，要求贺卡中要有祝福对象和祝福语句，且贺卡中的动画效果要符合感恩主题。 77

78 本章小结 本章先通过3个导入案例介绍Flash工具箱中常用工具绘制图形的方法和技巧，以及修改图形的一些辅助菜单的使用。本章最后通过综合项目“圣诞贺卡” 介绍了电子贺卡类Flash作品的制作流程和技巧，而且讲解场景的应用方法、Flash分镜头脚本的绘画方法、元件的使用技巧、动作中的预备与缓冲等知识技能。