资源描述
Flash动画制作,Flash 概述、工作界面、基本术语 基本操作:绘制轮廓线、填充、画圆、画方框、擦除图形、移动图形 动画制作:逐帧动画、过渡动画、引导层动画、遮罩动画、Alpha通道、声音的导入、发布与输出,Flash 概述 工作界面 基本术语,Flash 概述,Flash 是美国Macromedia公司推出的一款非常优秀的基于矢量图形的交互式动画设计软件。 它可以将音乐、声效、动画以及富有新意的界面等多媒体元素融合在一起,制作出高品质的动画效果。 它可应用在网页设计、MTV、电子贺卡、广告制作、游戏制作以及课件制作。,教学进程,Flash 8 工作界面,Flash基本术语,时间轴 帧 图层 场景 元件、实例 对象,时间轴,时间轴位于主工具栏的下面,是用来进行动画创作和编辑的主要工具,分为两大部分:层控制区和时间轴控制区,如图所示。,图示,帧(Frame) 构成Flash动画的基本组成元素,几种类型:,图层(Layer ),图层就像透明的胶片,每个图层上所绘制的对象按一定的顺序重叠在一起,形成复杂的动画。每个每个图层都有各自的时间轴。在Flash 中图层分为普通层、遮罩层、运动引导层。,图2 场景面板,场景(Scene) 场景如同拍电影的不同场所,一个影片可以有一个也可以有多个场景,每个场景是Flash作品中相对独立的一段动画内容.,元件、实例,元件:存放在库中可反复取出使用动画元素 实例:将元件从库中拖到舞台上就形成了这个元件的一个实例. 一个元件可以产生多个实例,当元件更新后,舞台上的所有实例全部更新,但修改实例的属性对元件没有丝毫影响。 说明:为了方便,在场景中引入的实例也简称为元件。,图示,图 示,对象(Object) Falsh中的动画都是由对象组成的,对象可以分为: 形状 通过绘图工具绘制产生的如园、矩形等形状;对象被选中,以网点所覆盖,对象不是整体,各部分的形状、大小都可以改变。 组 将形状通过“修改|组合”命令转换成为组对象,对象是个整体,只能改变组对象的大小、角度等操作。组对象通过“修改|分离”命令打散转变为形状对象。 元件 通过“插入”菜单的“|新建元件”或“转换为元件”命令创建的元件,在场景中引用,其实质也是组。 文本 通过工具箱的“文本工具”产生。,基本操作: 绘制轮廓线、填充、画圆、画方框、擦除图形、移动图形,界面特点与绘制工具,(1) 双击 Flash软件图标,(2) 选择“文件 / 新建”菜单 (此步不可省略,否则窗口尺寸有误),教学进程,设置动画尺寸及其他,(1) 单击底部“属性”工具条, 操作步骤,(2) 单击“尺寸”按钮,(3) 输入“尺寸”数值,(5) 输入“帧频” fps (取值1225),(4) 单击“背景颜色”框 确定动画窗口背景色,(6) 确定标尺单位 (像素、英寸、厘米、毫米等),(7) 单击“设为默认值”按钮,保存当前设置,(8) 单击“确定”按钮,(9) 单击“属性”标题栏,关闭,教学进程,动画的画法,(1) 选择铅笔工具,(2) 选择铅笔颜色,(3) 选择轮廓模式,(4) 描绘轮廓, 绘制轮廓线,(1) 选择颜料桶工具,(2) 选择填充模式 (渐变、单色均可),(3) 选择封闭模式,(4) 单击图形内部 填充颜色,教学进程,画图形,(2) 选择圆内单色或渐变色,(3) 画圆 (鼠标椭圆 /Shift+鼠标正圆),(1) 选择画圆工具,(2) 选择单色或渐变色,(3) 单击“圆角” 按钮,设置圆角, 画圆,(4) 画方框 (鼠标任意 /Shift+鼠标正方),教学进程,处理图形,(1) 选择橡皮工具,(3) 选择橡皮尺寸,(2) 选择擦除模式,(4) 擦除图形,(2) 移动图形, 擦除图形,教学进程,北京 BEIJING,输入文字,(1) 选择文本工具,(2) 鼠标左键划出文本框,(3) 输入文本内容,(4) 光标条覆盖文本,(6) 鼠标对准文本输入框,移动文字,(7) 单击非文本输入区结束,教学进程,动画制作,1.逐帧动画 2.过渡动画(形状补间、动作补间) 3.引导层动画 4.遮罩层动画 5.添加声音,逐帧动画,逐帧动画: 每一帧的画面都需要自己制作。逐帧动画的体积一般比较大。 例8.10 :显示数字计数器,在显示数字5这帧时停留时间长些。 设计思想: (1)在时间轴第1帧输入数字1 ,其它帧插入关键帧,将数字改变,在数字5后的帧间隔长一些; (2)“修改|文档”将帧的播放速度由默认12改为4,使显示速度慢一些。 例:制作文字滚动的动画文字 在关键帧依次增加文字,过渡动画,过渡动画:可以做出位移、旋转、缩放、颜色改变等动画效果。 制作方法:改变两个关键帧的位置、形状、颜色和大小等属性来完成。也可通过几个层之间动画的叠加来实现。 实现过渡动画:通过“补间”来实现两个关键帧之间的动画变化;有两种“补间”: “动作补间”:关键帧是矢量图(组、元件); “动画补间”:关键帧是分离的图形。,例8.11 “形状补间” ,使用改变帧形状的方法制作由圆形变为方形、三角形的动画。 例8.12 “动画补间” 利用两个图层实现两个球碰撞的效果。 设计思想:利用元件、两个图层的时间轴实现两球碰撞的模拟; 场景中的网格便于定位,通过“查看|网格|显示网格”来设置。,引导层动画,引导层动画: 使运动的对象沿着特定的路径运动,运动的对象可以是实例、组合及文本块,而引导层中的路径必须是矢量图形。 例8.13 利用引导层使对象沿指定曲线运动的动画。 设计思想: “插入|新建元件” 建立一个元件,作为运动对象; 在图层1不同帧引用元件; 添加运动层,用铅笔画一条光滑运动轨迹; 在图层1对象定位在运动曲线上,作”动作补间”。,遮罩层动画,遮罩层动画:遮罩层的内容就好比一个洞,透过这个洞,我们可以看到下面的层。遮罩层的对象可以是填充的形状、文字和实例。 例8.14 制作探照灯效果的动画。 设计思想:利用遮罩层运动的圆遮罩下面的文字,形成探照灯的效果。 例8.16 使用图层的遮罩技术滚动显示彩色文字,文字颜色使用一幅图片来填充。 设计思想:在图层1有运动的图片; 在图层2有所需的文字,设置为遮罩层。,Alpha通道应用,Alpha通道:是指元件对象颜色的透明度,应用在对象由近到远逐渐变淡的过程。 例8.15 通过改变文本的位置、颜色和大小的方法制作逐渐消失的文字。 注意: 使用Alpha通道属性的对象必须是元件或组,不能是分散的图形。,声音的导入与使用,声音在动画中占有相当重要的地位,它在整个动画过程中起着画龙点睛的作用。一个精彩的的动画,配以合适的背景音乐,将会使作品生动起来,变得更加精彩。 添加声音过程 1. 导入声音 2. 在场景中加入使用声音 3. 声音属性设置(音效、播放),1.导入声音,使用“文件”“导入”命令; 选择.wav或.mp3格式的文件,将其导入到库中; 如果想获得较好的音效,可导入22kHz、16位立体声格式的声音文件;如果为了提高动画文件的传输速度,则应导入8kHz、8位单声道格式的声音文件。,2.在场景中加入声音,库面板中将声音文件拖到关键帧上,3.声音属性设置,效果:有淡入淡出等 同步方式四种: 事件:某个动作触发;播放前必须下载完才播放;动画 停止,声音也要播完; 可能会同时听到多个声音。 开始:与事件相似;区别是要播完原来的; 不会同时听到多个声音 停止:立即停止播放当前帧的声音; 数据流:边下载边播放;动画停止,声音停止。,发布与输出,制作完动画之后,可以把生成的动画导出为后缀名为.swf的动画播放文件,也可以把它发布为影片,生成网页浏览器支持的HTML、GIF、JPEG文件。 当动画导出为影片或者是完成HTML文档的创建后,就可以上载给有MIME类型文件、能识别Flash影片的浏览器,任何带有Flash播放器(Shockwave Flash Player)的浏览器都可以播放它。,发布的过程为: 发布设置 选择“文件|发布设置”命令,指定要发布的文件格式和文件名。每种图形格式都有相应的选项,在选择了一种图形格式发布时Flash会自动嵌入该图形的HTML代码。 发布 设置完成后可直接单击发布按钮,或关闭对话框后选择“文件|发布”命令。,制作帧动画, 绘制图形,7.1.3,教学进程,制作自动动画, 直线移动动画,(4) 鼠标右键单击第1帧,选择“创建动画动作”,(6) 预览动画效果,图形从第1帧的位置移动到第20帧的位置,7.1.4,(1) 在第1帧中画 一个图形,(2) 鼠标右键单击某一帧,如第20帧 选择“插入关键帧”,(5) 鼠标右键单击第20帧,选择“创建动画动作”,教学进程,自由路径移动动画,(3) 单击铅笔工具,(10) 预览动画效果,(1) 制作直线 移动动画,(5) 画自由路径,(2) 单击 (添加引导图层)按钮,(4) 选择“平滑”效果,(6) 单击图形图层,(8) 单击第1帧,把图形置于路径的起始位置,(9) 单击最后1帧,把图形置于路径的终了位置,教学进程,为动画添加声音,(2) 指定文件类型和声音文件,(3) 单击“打开”按钮,(4) 单击某个动画图层, 操作步骤,(5) 单击“属性”工具栏,(6) 在“声音”框中指定声音文件,(7) 指定“同步”对象 (事件、开始、停止、数据流),(8) 预览动画 (可听到声音),7.1.5,(1) 选择“文件/导入”,教学进程,保存动画, 保存可编辑文件 fla,(1) 选择“文件/另存为”,(2) 输入文件名,(3) 单击“保存”按钮,7.1.6,(3) 单击“保存”按钮,(1) 选择“文件/导出影片”菜单,教学进程,动画制作举例, 帧数:5 动画文件格式:GIF,操作步骤 (1) 设置动画尺寸及其他 (2) 绘制轮廓线 (3) 增加关键帧 (4) 重复步骤(2)、(3) (5) 保存, 绘制一组虫子爬行的画面,教学进程,
展开阅读全文