flashCS3课件(精品)

,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,计算机平面动画设计教程,计算机平面动画设计,主讲人：,王雪峰,邮箱：,wxf-1220,上机：,周三下午,5-8,节 （教室,526,）,本课程学分：,6,本课程学时：,每周,6,课时，共,18,周,考试：,闭卷,实验目标：,完成课后实例最后上交一个综合案例,计算机平面动画设计教程,第一章,Flash CS3,基础入门,学习目标,本章要点,习 题,计算机平面动画设计教程,学习目标,学习和掌握计算机平面动画技术之前，首先应了解计算机动画和,Flash,的基础知识。,本章将对,Flash CS3,的背景、特点、应用领域、界面、功能和应用等基础知识进行详细的介绍。,计算机平面动画设计教程,本章要点,Flash CS3,的发展,Flash CS3,的特点,Flash CS3,的应用领域,Flash CS3,的基本术语,Flash CS3,的基本界面,第一章,Flash CS3,基础入门,计算机平面动画设计,认识,Flash,Flash CS3,的基本术语,Flash CS3,的基础操作,计算机平面动画设计教程,1.1,认识,Flash,Flash,的背景知识,Flash,的应用领域,Flash,的特点,计算机平面动画设计教程,Flash,的背景知识,Flash,是目前最优秀的网络动画编辑软件之一，从简单的动画效果到动态网页设计、短片音乐剧、广告电子游戏的制作，利用该软件制作的动画尺寸要比位图动画文件,如,GLF,动画,尺寸小的多，用户不但可以在动画中加入声音，视频和位图图像，还可以制作交互式的影片或者具有完备功能的网站，,Flash,的应用领域日趋广泛。,通过本章的学习，读者应熟悉,FLASH,动画的特点，,Flash CS3,的界面组成元素，并通过制作实例了解,FLASH,动画的一般步骤。,计算机平面动画设计教程,Flash,的发展历史,Macromedia,公司收购,Future Splash,，并进行修改，改名为,Flash,。,1998,年，,Flash3.0,与同时推出的,Dreamweaver2.0,和,Fireworks2.0,一起称为,Dream Team,，即网页三剑客。,2000,年，,Flash5.0,掀起了闪客旋风，把矢量图的精确性和灵活性与位图、动画、声音和交互性巧妙结合，功能显著增强。,2003,年，,Macromedia,推出新一代的网络多媒体动画制作软件,-Flash MX,。,计算机平面动画设计教程,2006,年，,Adobe,公司收购,Macromedia,，带来,Flash,的巨大变革，,2007,年,3,月，发布,Flash CS3,，支持脚本语言,ActionScript3.0,，实现了,Flash,历史上的第二次飞跃。,目前,Flash,的动画播放器在全世界的普及率达到,98.8%,，最新版本是,FlashCS5,。,每一次的变革，都是,Flash,这款软件功能更全面，更灵活。,Flash,的发展历史 （续）,计算机平面动画设计教程,Flash,的特点,流媒体动画,操作简单，容易学习,小容量动画文件,强大的交互功能,Flash,的图文元素,计算机平面动画设计教程,Flash,的应用领域,网络广播,制作游戏,MTV,制作教学课件,Flash,的电子贺卡,产品宣传,站点建设,制作视频文件,实例演示,计算机平面动画设计教程,1.2,Flash CS3,的基本术语,矢量图像,矢量图像是用包含颜色和位置属性的点和线来描述的图像。无论怎样放大图像都不会影响画质，依旧保持原有的清晰度。,位图图像,位图图像是通过像素点来记录图像的，许多不同色彩的点组合在一起后，就形成了一幅完整的图像，位图图像存在的方式及所在空间的大小是由像素点的数量来控制的。,计算机平面动画设计教程,场景,场景是设计者直接绘制帧图形或者从外部导入图形之后进行编辑处理，行程单独的帧图合成为动画的场所。它需要有固定的长、宽、分辨率、帧的播放速率等。,动画的原理,Flash CS3,的基本术语（续）,当我们将这三幅画面依次按照一定速度播放的时候，给我们的视觉效果就是看上去感觉飞机在从左向右飞行，如图,4,所示。动画就是由一系列近似的画面按照一定的顺序和速度进行播放而产生，它是欺骗人视觉效果的一种把戏。,图,1,图,2,图,3,图,4,计算机平面动画设计教程,帧,帧是一个数据传输的发送单位，帧内包含一个信息，在,Flash,中是指时间轴窗口的窗格内一个一个的小个子，由左到右编号，每帧内包含图像信息，在播放时，每帧内容会随时间轴一个一个放映而改变，最后形成连续的动画效果。,由动画的原理我们知道，动画就是画面的连续播放所产生的，电影是每秒播放,24,幅画面，电视则每秒播放,25,幅画面，,Flash,默认每秒播放,12,幅画面（可以修改）。每一幅画面我们都称它为一个帧。,Flash CS3,的基本术语（续）,计算机平面动画设计教程,Flash CS3,的基本术语（续）,关键帧,关键帧是定义了动画变化的帧，也可以是包含了帧动作的帧。默认情况下，每一层的第一个帧就是关键帧，在时间轴上一黑点表示。,帧序列,帧序列是指某一层中的一个关键帧和直到下一个关键帧之间的静态帧，不包括下一个关键帧。,这几个概念在,Flash,制作中非常重要，使用的频率也最高 。,计算机平面动画设计教程,Flash CS3,的基本术语（续）,空白关键帧和关键帧,普通帧,空白关键帧,+,内容（比如画个圆）,=,关键帧。,关键帧后面的灰色部分都是普通帧，普通帧里面没有实际的内容，但是它却能将离它最近的关键帧的内容显示出来，用来延续一幅画面的存在时间。,代表普通帧的结束,计算机平面动画设计教程,1.3,Flash CS3,的基本操作,运行、退出程序,认识,Flash CS3,的基本界面,初试,Flash,制作第一个动画,（,演示,）,计算机平面动画设计教程,认识,Flash CS3,的基本界面,Flash CS3,的基本界面主要有标题栏、菜单栏、工具栏、时间轴、工具箱、工作区、面板和属性面板组成。这个界面更具有亲和力，操作和使用也更方便。,Flash CS3,的新面貌不但大大简化了编辑过程，还为用户提供了更大的发挥空间。,计算机平面动画设计教程,认识,Flash CS3,的基本界面,菜单栏,工具箱,舞台,工具栏,时间轴,面板：动作、对齐、颜色、信息、样本,属性面板,计算机平面动画设计教程,初试,Flash,制作动画,入门为基础，掌握基础知识。,精通为目的，掌握,Flash CS3,和,ActionScript0,的高级运用。,范例为导向，实际操作动画实例，掌握,Flash,的常用功能及重点技术。,理念为精华，学习优秀设计思想及前人的丰富教学经验。,计算机平面动画设计教程,Flash CS3,文件,.Fla,：源文件，可编辑（,Flash,软件打开）,.swf,：最终生成的文件格式，不可编辑（硕思闪客精灵）（,Flash Player,播放）,.as,：,flash,脚本文件（任意文本软件编辑）,.exe,：,swf,文件可以创建不需,Flash Player,播放的可执行文件,计算机平面动画设计教程,时间轴、舞台、工作区,时间轴：文档卡、图层、层文件夹、帧、层工具、洋葱皮、动画信息,舞台：编辑区域，生成文件后的显示区域（网格、标尺、辅助线）,工作区：场景、工作区（个性化环境）、缩放,计算机平面动画设计教程,工具栏详解,计算机平面动画设计教程,工具栏详解（续）,计算机平面动画设计教程,Flash,制作流程,制作流程,2.,新建,Flash,影片文档,3.,设置文档属性,4.,制作动画,5.,测试和保存影片,1.,准备素材,6.,导出和发布影片,计算机平面动画设计教程,第二章,绘制图像,学习目标,本章要点,习 题,计算机平面动画设计教程,学习目标,熟悉工具箱,绘制线条,选择图形,绘制形状,绘制路径,图形的笔触与填充,变形对象,修饰图像,绘图综合案例,计算机平面动画设计教程,本章技术要点,Flash CS3的工具箱主要包括哪些工具？,绘制形状主要用那些工具？,Flash提供了几种对图像的修饰方法？,利用那些相关工具可以通过绘制精确的路径来确定直线和平滑的曲线？,计算机平面动画设计教程,2.1,选取工具,内 容 提 要,1,、选择工具,:,此工具用于选择、移动、复制图形以及,改变形状图形的形状。,单击某个对象，即可选中对象，被选中的对象会覆盖上一层灰色；,双击还会选中与其相连的对象；,拖拽或按住,SHIFT,键复选可选中多个对象,单击对象选择全部，拖拽框选选择局部,按下,Ctrl,键拖动实现复制,2,、部分选取工具,:,此工具主要用于选择线条、移动线条和编辑节点以及节点方向等,计算机平面动画设计教程,2.1,选取工具,内 容 提 要,3,、套索工具,:,用套索工具可以,精确地选择不规则对象中的任意部分,，在工具箱中选择套索工具，其选项区域如图，使用魔棒自动选择区域需要现将对象“分离”。,抠图 “和尚”图案 （,1,）“修改”,-“,分离”（,2,）“编辑”,“,取消全选”（,3,）使用“套索工具”的“魔术棒”功能来去除。,计算机平面动画设计教程,2.2,绘制线条,内 容 提 要,线条是最简单的图形，它是复杂图形的基础。,Flash CS3,在线条处理方面有一些新的改进，例如更新了钢笔工具，使它接近于同类其他软件，本节主要讲解线条的基本绘制方法、快速套用线条属性、用选择工具改变线条属性、线条的端点设置和线条的接合。,计算机平面动画设计教程,知 识 要 点,2.2.1,线条工具,2.2.2,自定义笔触样式,2.2.3,快速套用线条属性,2.2.4,用选择工具改变线条属性,2.2.5,线条的端点设置,2.2.6,线条的接合,计算机平面动画设计教程,实战范例,韵律线条,1,新建影片文档和设置文档属性,2,用线条工具绘制直线并调整成曲线,3,用“变形面板”对线条进行变换操作,计算机平面动画设计教程,2.3,绘制基本形状,内 容 提 要,本小节在学习绘制基本线条的基础上，学习绘制基本形状如三角形、四边形、星星、月亮、十字花、圆环、扇形等的方法和技巧。,计算机平面动画设计教程,知 识 要 点,2.3.1,绘制三角形,2.3.2,绘制四边形,2.3.3,绘制星星,2.3.4,绘制月亮,2.3.5,圆角矩形和十字花图的绘制,2.3.6,圆环和扇形的绘制,上机练习：,计算机平面动画设计教程,绘制直线,绘制曲线,编辑锚点,综合实例,绘制路径,钢笔工具,计算机平面动画设计教程,墨水瓶工具,颜料桶工具,滴管工具,橡皮擦工具,图像的笔触与填充,2.4,变形对象,计算机平面动画设计教程,内 容 提 要,前面我们已经绘制了单色填充的图形，它们色彩单一，填充简单。而渐变填充色彩绘制的图形色彩丰富，设置复杂，但极富表现力，应用的范围也更广。本小节就学习渐变色彩图形的绘制方法,计算机平面动画设计教程,知 识 要 点,2.4.1,渐变填充,1,线性渐变,2,放射状渐变,计算机平面动画设计教程,2.4.2,绘制立体按钮图形,1,.新建影片文档和设置文档属性,2.,绘制放射状渐变的圆,3.,绘制线性渐变的椭圆,2.5,绘制复杂图形,计算机平面动画设计教程,内 容 提 要,前面的小节中绘制的形状都是比较规则的，因此运用线条、矩形、椭圆工具都能轻而易举地绘制出来。如果要绘制比较复杂的不规则图形，这些工具都不能胜任了，这时就要用到功能强大的钢笔、铅笔、刷子工具等绘图工具，以及部分选取工具和橡皮擦工具等这些辅助工具了。,计算机平面动画设计教程,小 结,教学目的：,（,1,）掌握使用选择工具选择并修改节点和图形。,（,2,）掌握绘画工具的使用、辅助选项和属性的设置。,（,3,）掌握文本的输入与编辑，文本的打散与分离。,（,4,）掌握颜色的编辑，笔触和填充的设置与编辑。,（,5,）标尺和网格线的使用方法。,教学重点：,（,1,）绘图工具的使用。,（,2,）图形的修改。,（,3,）渐变颜色的设置、不透明度的设置。,（,4,）渐变填充、位图填充的调整。,教学难点：,使用钢笔工具绘制各种图形。,计算机平面动画设计教程,第三章 文本与对象的操作,创建文本,设置文本属性,编辑文本,制作特效文本,文本滤镜,计算机平面动画设计教程,创建文本,文本类型：,静态文本、动态文本、输入文本字段,文本属性,：,不同的文本类型具有不同的文本属性,提示,：,线条类型,、,在文本周围显示边框,、,嵌入,只是对动态文本和输入文本有效,计算机平面动画设计教程,文本样式,字体（嵌入字体）、字号、颜色、粗体、斜体、,文本对齐格式选项：缩进、行距、左边距、右边距,文本方向、旋转（仅垂直时）,字母间距、字符位置、字体呈现方法、自动调整间距,换行、可选、,HTML,格式、变量、边框、超链接和目标,计算机平面动画设计教程,文本工具（,分离和组合,）,分离与组合,由于这个含义有些抽象，以图例的方法来增强理解并做简要解释,:,分离,组合,正常,选择,移动,计算机平面动画设计教程,由图中可以看出，在正常状态下，两者没有区别，但选中以后，组合的对象周围有一个蓝框，表示当前物件处于选中状态，而打散的对象则以星点表示。在移动时，组合的对象在动过程中始终以一个整体进行移动，物件的外框线出现在当前的拖动位置，当开鼠标后，对象整个移至外框线位置，被打散的对象则不同，可以单独移动选中的部分，选种部分可以与其整体分离，单独移动。当然，也可选中全部对象进行移动。,文本工具（,分离和组合,）,提示：,Flash,中对象的两种基本形态，分离与组合，我们要对建立的对象分离，可按快捷键,Ctrl + B,若要对打散的对象进行组合则可按,Ctrl + G,或者在修改菜单下进行选择,.,文本图形化操作,需要两次,Ctrl+B,计算机平面动画设计教程,使用设备字体：,指定,SWF,文件使用本地计算机上安装的字体来显示字体。 使用设备字体时，应选择最常安装的字体系列。,位图文本（未消除锯齿）：,关闭消除锯齿功能，不对文本提供平滑处理。 用尖锐边缘显示文本，增加,SWF,文件的大小。 位图文本的大小与导出大小相同时，文本比较清晰，但对位图文本缩放后，文本显示效果比较差。,动画消除锯齿：,通过忽略对齐方式和字距微调信息来创建更平滑的动画。 此选项会导致创建的,SWF,文件较大，因为嵌入了字体轮廓。 为提高清晰度，应在指定此选项时使用,10,磅或更大的字号。,字体呈现方法,计算机平面动画设计教程,可读性消除锯齿：,使用,Flash,文本呈现引擎来改进字体的清晰度，特别是较小字体的清晰度。 此选项会导致创建的,SWF,文件较大，因为嵌入了字体轮廓。（如果要对文本设置动画效果，请不要使用此选项，而应使用“动画消除锯齿”。）,自定义消除锯齿：,使您可以修改字体的属性。 使用“清晰度”可以指定文本边缘与背景之间的过渡的平滑度。 使用“粗细”可以指定字体消除锯齿转变显示的粗细。 （较大的值会使字符看上去较粗。）,字体呈现方法（续）,计算机平面动画设计教程,滤 镜,滤镜：,它是可以对,Flash,播放器在运行时呈现的对象应用的视觉效果，使用滤镜只需要进行简单的操作就可以制作出复杂的效果。,滤镜包含七个功能选项,：投影、模糊、发光、斜角、渐变发光、渐变斜角、调整颜色,提示：,滤镜只适用于文本、影片剪辑、按钮,计算机平面动画设计教程,特效文本案例,实例,1.,图案效果,实例,2.,描边效果,实例,3.,立体文字,实例,4.,滤镜系列效果,