1、Flash动画设计基础知识快速导读快速导读 本讲介绍了Flash的发展历程、基本术语、应用领域、工作界面和基本操作等知识。重点是Flash动画的特点,Flash动画原理及基本术语,工作界面和基本操作。难点是Flash动画原理及基本操作。本讲的学习目标是对Flash有一个概括性了解,理解它的工作原理并掌握它的基本操作,为接下来的学习打下坚实的基础。第第1 1讲讲 Flash Flash动画设计基础知识动画设计基础知识河南理工大学 马新荣 188391166881.1.1 Flash动画的特点动画的特点 受资源制约小 操作简单 流式播放技术 交互性优势 可扩展性1.1 Flash动画概述动画概述河
2、南理工大学 马新荣 18839116688 1.1.2 Flash的应用领域的应用领域 Flash用于矢量图形的绘制和编辑、网页制作、动画创作以及演示文稿的创作等方面。在现阶段,Flash的应用领域主要体现在以下几个方面:网络动画 主要包括娱乐短片、片头和MTV等。MTV河南理工大学 马新荣 18839116688 制作网站广告条 用Flash制作的网站广告条具有短小精悍、动感时常、表现力强等优点,从而使得它在这一领域得到广泛应用。网站广告河南理工大学 马新荣 18839116688 制作交互动画 交互动画结合Flash动画的特点和ActionScript的逻辑功能,用户通过鼠标或键盘控制动画
3、的演示过程,以达到交互的效果。应用领域有网络小游戏、【登录】界面和调查表等。Flash交互动画河南理工大学 马新荣 18839116688 制作动态演示课件 制作出融声音、动画于一体的动态课体,演示过程中通过键盘或鼠标控制课件的进程。教学课件河南理工大学 马新荣 18839116688 制作电子贺卡 FLASH可以将画面、文字、音乐美妙的融合在一起,绘成一个有声有色的电子卡片。电子贺卡河南理工大学 马新荣 18839116688 制作多媒体光盘界面 目前支持ActiveX的程序设计系统都可以显示FLASH动画,所以越来越多的多媒体光盘界面应用了FLASH动画。多媒体光盘河南理工大学 马新荣 1
4、8839116688 1.2.1 场景场景 场景的概念其实十分简单,它就是一段相对独立的动画。不同的场景按先后顺序排列在一起就组合成了一个动画。每一个场景都有各自独立的图层和帧。场景1.2 Flash中的基本术语中的基本术语河南理工大学 马新荣 18839116688 1.2.2 帧帧在Flash中主要有两种格式的帧,一种是关键帧,一种是普通帧。关键帧就是用来定义动画变化的帧,在时间轴中有内容的关键帧显示为实心圆,无内容的关键帧则用空心圆表示。普通帧在时间轴上显示为一个个的单元格。无内容的帧是空白的单元格,有内容的帧显示出一定的颜色。关键帧普通帧河南理工大学 马新荣 18839116688 1
5、.2.3 图层图层 Flash中的图层用于制作复杂的动画。用户也可以在不影响其他图层上内容的情况下,在一个图层上绘制并编辑元件。也可以利用特殊的引导层、遮罩层创建丰富的动画效果。图层可以增加多个,可以改变多个图层间的排列顺序和图层的名称。图层河南理工大学 马新荣 188391166881.2.4 库库 【库】面板是存储和组织在Flash中创建的各种元件的地方。它还用于存储和组织导入的文件,包括位图图形、声音文件和视频剪辑等。通过【窗口】【公用库】【按钮】可以打开公用库中编辑好的元件,直接调用。河南理工大学 马新荣 18839116688 分别是创作各帧内容和制作动画的区域1.2.5 舞台及工作
6、区河南理工大学 马新荣 18839116688 在Flash中有两种创建动画的方法,分别是逐帧动画和补间动画 1.2.6 Flash动画类型 逐帧动画:将所要表现的动态部分分解,一个个地绘制动作 河南理工大学 马新荣 18839116688 运动补间动画:在一个帧中定义一个实例、组或文本 块的位置、大小和旋转等属性,然后 在另一个帧改变那些属性1.2.6 Flash动画类型河南理工大学 马新荣 18839116688 形状补间动画:使一个形状看起来随着时间变成另一 个形状 2.Flash动画类型河南理工大学 马新荣 18839116688 1.3.1 Flash的启动的启动 Flash的启动有
7、如下3种方法。选择【开始】【所有程序】【Adobe Flash CS3 Professional】命令,启动Flash CS3。双击桌面上的快捷方式图标 。双击Flash CS3相关联的文档。1.3 Flash基本操作基本操作河南理工大学 马新荣 18839116688 1.3.2 Flash文档的基本操作文档的基本操作 新建Flash文档 在Flash中创建新的文档,有以下3种方法。1.启动Flash CS3,在弹出的【开始】页中单击【创建新项目】中的【Flash文件ActionScript3.0】选项,建立一个空白文档。2.按下Ctrl组合键。3.选择【文件】【新建】命令。河南理工大学 马
8、新荣 18839116688 打开Flash文档 打开现有文档的步骤如下。选择【文件】【打开】命令,弹出【打开】对话框。在【文件名】下拉列表框中输入文件的路径或者直接选择文件。单击【打开】输入文件路径选择文件。单击打开按钮,即可打开所选的文件。河南理工大学 马新荣 18839116688 保存Flash文档 保存Flash文档的步骤如下。选择【文件】【保存】命令,以覆盖当前存盘文件方式存盘。要将文档保存到不同的位置或用不同的名称保存文档,需选择【文件】【另存为】命令。如果选择【另存为】命令,或者以前从未保存过该文档,刚应在【文件名】下拉列表框中输入文件名和位置。单击保存按钮。河南理工大学 马新
9、荣 18839116688 1.3.3 Flash的退出的退出 退出Flash CS3有以下5种方法。1.单击Flash CS3程序窗口右上角的 按钮。2.选择【文件】【退出】命令。3.双击Flash CS3程序窗口左上角的 图标。4.按下Alt+F4 组合键。5.按下Ctrl+Q 组合键。河南理工大学 马新荣 18839116688 1.4.1 设置文档属性设置文档属性 新建的Flash文档将自动采用当前默认的文档属性。用户也可以根据需要对文档的属性进行设置。按Ctrl+F3组合键打开【属性】面板,单击【属性】面板中【大小】后面的 按钮,弹出【文档属性】对话框。在此对话框中可以设置文档的标题
10、、舞台的大小、颜色以及帧频等。1.4 设置动画场景设置动画场景河南理工大学 马新荣 18839116688 1.4.2 网格和标尺的设置网格和标尺的设置在动画的制作过程中,有时候需要对对象进行精细的设置,这就需要利用标尺和网格来辅助完成动画制作。1.网格的设置 选择【视图】【网格】【显示网格】命令,在工作场景中将显示网格线。执行同样的操作可隐藏网格。选择【视图】【网格】【编辑网格】命令,在打开的【网格】对话框中可以对网格的颜色、大小和对齐方式进行设置。网格网格对话框河南理工大学 马新荣 18839116688 2.标尺的设置 选择【视图】【标尺】命令,在场景的上侧和左侧将显示水平和垂直的标尺。
11、向舞台中拖动一下标尺就会产生一条标尺线。要删除标尺线只需把它拖到工作区以外即可。网格和标尺都是动画制作中的辅助设计线,只在工作区上操作时显示,在最终的生成文件中并不可见。标尺河南理工大学 马新荣 18839116688本讲介绍了Flash的发展历程,动画特点,应用领域及动画设计过程中所涉及的一些术语,如场景、帧、图层、库等。还了解了Flash的启动和退出,介绍了Flash中的基本操作和工作界面以及一些常用的设置。通过这些内容的学习,能够使大家对Flash有一个最基本的认识,对Flash各部分的结构、作用有所了解。作为Macromedia公司的战略先锋,Flash以其强大的动画编辑功能和广泛的应
12、用性为设计者所喜好。掌握这个软件,跟上网络前进的步伐,是大家共同的希望。1.6 本讲小结本讲小结河南理工大学 马新荣 18839116688一、判断题一、判断题1Flash是用于绘制位图图像的软件。()2Flash在网络上传播时采用的不是流式传播技术。()3打开库面板的方法是:选择【窗口】【库】命令。()二、选择题二、选择题1()面板是存储和组织在 Flash 中创建的各种元件的地方,它还用于存储和组织导入的文件,包括位图图形、声音文件和视频剪辑等。A.库 B.动作 C.工具 D.以上答案都正确2Flash动画的特点有()A.受资源制约小 B.流媒体传播 C.可交互性和可扩展性 D.操作简单1
13、.7 思考与练习思考与练习河南理工大学 马新荣 18839116688三、上机操作题三、上机操作题 根据所学知识,利用【矩形】工具和【颜色】面板制作一个渐变背景,要求:渐变线条的左端的颜色值为“#000000”,右端的颜色值为“#FFFFFF”。如下图所示。河南理工大学 马新荣 18839116688The End!The End!河南理工大学 马新荣 18839116688 位图是由不同亮度和颜色的像素所组成,适合表现大量的图像细节,可以很好的反映明暗的变化、复杂的场景和颜色,它的特点是能表现逼真的图像效果,但是文件比较大,并且缩放时清晰度会降低并出现锯齿。位图有种类繁多的文件格式,常见的有
14、JPEG、PCX、BMP、PSD、PIC、GIF和TIFF等。位图图像效果好,放大以后会失真 而矢量图则使用直线和曲线来描述图形,这些图形的元素是一些点、线、矩形、多边形、圆和弧线等等,它们都是通过数学公式计算获得的,所以矢量图形文件一般较小。矢量图形的优点是无论放大、缩小或旋转等都不会失真;缺点是难以表现色彩层次丰富的逼真图像效果,而且显示矢量图也需要花费一些时间。矢量图形主要用于插图、文字和可以自由缩放的徽标等图形。一般常见的文件格式有AI等。矢量图图像效果差,放大以后不会失真 位图与矢量图的区别位图与矢量图的区别河南理工大学 马新荣 18839116688 位图放大到一定程度就会模糊失真
15、,矢量图可无限放大。位图一般可以直接浏览,而矢量图一般要用专用设计软件打开。同样画面的位图文件比较大,矢量的很小 jpg/bmp/psd/gif/png/tga等格式属于位图;CDR/AI/WMF/FH/EPS/等属于矢量图(非绝对)位图与矢量图的区别位图与矢量图的区别河南理工大学 马新荣 18839116688矢量图矢量图vector,也叫做向量图,简单的说,就是缩放不失真的图像格式。,也叫做向量图,简单的说,就是缩放不失真的图像格式。矢量图是通过多个对象的组合生成的,对其中的每一个对象的纪录方式,都矢量图是通过多个对象的组合生成的,对其中的每一个对象的纪录方式,都是以数学函数来实现的,也就
16、是说,矢量图实际上并不是像位图那样纪录画是以数学函数来实现的,也就是说,矢量图实际上并不是像位图那样纪录画面上每一点的信息,而是纪录了元素形状及颜色的算法。常用的格式有面上每一点的信息,而是纪录了元素形状及颜色的算法。常用的格式有DWG,DXF,CDR.矢量图矢量图 50%显示显示 矢量图矢量图 200%显示显示位图,也叫做点阵图,删格图像,像素图,简单的说,就是最小单位由位图,也叫做点阵图,删格图像,像素图,简单的说,就是最小单位由象素构成的图,缩放会失真。构成位图的最小单位是象素,位图就是由象素象素构成的图,缩放会失真。构成位图的最小单位是象素,位图就是由象素阵列的排列来实现其显示效果的,
17、每个象素有自己的颜色信息,在对位图图阵列的排列来实现其显示效果的,每个象素有自己的颜色信息,在对位图图像进行编辑操作的时候,可操作的对象是每个象素,我们可以改变图像的色像进行编辑操作的时候,可操作的对象是每个象素,我们可以改变图像的色相、饱和度、明度,从而改变图像的显示效果。常用的格式有相、饱和度、明度,从而改变图像的显示效果。常用的格式有JPG,TIF,BMP,GIF.位图位图 100%显示显示 位图位图 300%显示显示另外矢量图,轮廓的形状更容易修改和控制,且线条工整,可以重复使另外矢量图,轮廓的形状更容易修改和控制,且线条工整,可以重复使用,但是对于单独的对象,色彩上变化的实现不如位图
18、来的方便直接。用,但是对于单独的对象,色彩上变化的实现不如位图来的方便直接。位图,色彩变化丰富,编辑上,可以改变任何形状的区域的色彩显示效位图,色彩变化丰富,编辑上,可以改变任何形状的区域的色彩显示效果,但对轮廓的修改不是很方便。相应的,要实现的效果越复杂,需要的象果,但对轮廓的修改不是很方便。相应的,要实现的效果越复杂,需要的象素数越多,图像文件的大小素数越多,图像文件的大小长宽长宽和体积和体积存储空间存储空间越大。越大。另外在另外在Illustrator中矢量图可以很好的或者完美的转换为位图图像,而中矢量图可以很好的或者完美的转换为位图图像,而在位图转换成矢量图的技术上虽然还不像矢量图转换
19、成位图那么完美,但是在位图转换成矢量图的技术上虽然还不像矢量图转换成位图那么完美,但是IllustratorCS2的新增功能的新增功能“动态追踪动态追踪”为我们提供了位图转换成矢量图的为我们提供了位图转换成矢量图的便捷途径,为我们的艺术和创造提供了更加广阔的天地。便捷途径,为我们的艺术和创造提供了更加广阔的天地。位图与矢量图的区别位图与矢量图的区别河南理工大学 马新荣 18839116688河南理工大学 马新荣 18839116688河南理工大学 马新荣 18839116688 数字图像通常有位图和矢量图形两种表示形式,Flash创建的是矢量动画,同时也能处理其他图像处理软件创建位图 1.位图与矢量图河南理工大学 马新荣 18839116688