Flashcs5基础知识.ppt
Flash技能培训,授课老师:罗萍,了解动画的起源与发展。掌握动画制作的原则。了解Flash的发展历史。了解Flash CS5的工作界面。掌握Flash动画制作流程。,第1章 Flash CS5动画制作基础知识,1.1 动画设计综述1.2 Flash CS5动画设计简介1.3 制作第一个Flash动画,本章大纲,1.1 动画设计综述,1.1.1 动画的应用领域,Flash动画被广泛应用于网页设计、网页广告、网络动画、多媒体教学课件、游戏、企业宣传、产品展示和电子相册等领域。,网页广告 Flash音乐动画,迪斯尼公司于20世纪30年代提出了动画制作的12条原则,这些原则为动画师们找到了表现精致复杂动画的方法。下面详细讲解这12条基本动画原则。,动画的设计原则,掌握时序。慢入和慢出。弧形动作。预期性。使用夸张。挤压和伸展。辅助动作。完成动作和重叠动作。,逐帧动画和关键帧动画。布局。吸引力。个性。,常用动画制作软件简介,三维动画制作软件 目前最常见的三维动画制作软件有3ds Max、Maya、SoftImage和Lightwave等。交互式二维动画制作软件Flash 在众多的二维动画制作软件中,Flash最为璀璨,随着Flash的发展,Flash已经逐渐成为二维动画制作软件的代名词。,每个人创建Flash动画的习惯不同,但都会遵循一个基本的流程。下面介绍创建Flash动画的流程。,发布作品,1.1.4 Flash动画创作流程,1.2 Flash CS5动画设计简介,Flash动画制作流程 Flash动画制作流程十分的简单,分为:新建Flash文档、编辑场景、保存影片、发布影片4个步骤,其中编辑动画部分是流程的关键,发布影片控制着发布影片的大小、质量和文件格式等重要性质,所以也是十分重要的。二.Flash CS5界面介绍,1.2.1 Flash CS5简介,启动Flash CS5并熟悉工作界面,启动Flash CS5,1.单击“开始”按钮,在弹出的菜单中选择“所有程序”“Adobe Design Premium CS5”“Adobe Flash Professional CS5”,或双击桌面上的图标。,正确安装Flash CS5并进行注册后,可参照以下步骤启动Flash CS5。,Flash CS5开始页,单击“ActionScript 3.0”或者“ActionScript 2.0”选项即可新建一个Flash文档,并进入Flash CS5的工作界面。,2.打开Flash CS5的开始页,Flash CS5工作界面,可以看到其工作界面由标题栏、菜单栏、文档选项卡、主工具栏、时间轴、编辑栏、舞台、工具箱和多个控制面板等组成。,3.进入Flash CS5的工作界面后,“时间轴”面板:默认情况下,“时间轴”面板位于舞台下方,用于组织和控制动画内容,它主要包括图层和时间帧两部分。“时间轴”面板的左侧区域显示了动画中包含的图层名称及其相应状态,右侧显示了各图层的时间轴。,“时间轴”面板,牛刀小试简单动画,【设计思路】新建文档。制作背景。制作文字。补间动画。保存影片。发布影片。,【设计效果】创建图所示效果。,最终效果,操作要求:实现“从零开始学Flash”几个文字由右运动到左的动画效果。,【操作步骤】,创建新文件。选择【新建】/【Flash文件(ActionScript 2.0)】命 令,新建一个Flash文档。【要点提示】此处选择【Flash文件(ActionScript 3.0)】和【Flash文件(ActionScript 2.0)】差别在于其动画文件支持的后台脚本不同。ActionScript 2.0主要针对对象编写代码,编写时语言很简单,而ActionScript 3.0较为复杂。,制作背景。选择【修改】/【文档】菜单命令,打开【文档属性】对话框,将【高】选项改为“400像素”,【宽】为“500像素”。3.添加文字使用工具箱中的文字工具,输入“从零开始学Flash”的静态文本,字体设为“华文琥珀”,大小设为“60”。4.制作动画将文字拖放到舞台最右边外侧。在第60帧上插入关键帧(按F6),将文字拖放到舞台最左边外侧。在时间轴面板上,设置补间为“创建传统补间”。5.保存文件将制作的文件保存为“我的第一个动画.fla”。按Ctrl+Enter快捷键自动生成SWF文件。,高手接招大红大吉,【设计思路】新建文档。制作背景。制作文字。导入素材。保存影片。发布影片。,【设计效果】创建图1-13所示效果。,最终效果,【操作步骤】,创建新文件。选择【新建】/【Flash文件(ActionScript 2.0)】命 令,新建一个Flash文档。,制作背景。选择【修改】/【文档】菜单命令,打开【文档属性】对话框,将【高】选项改为“300像素”。将默认的“图层1”重命名为“背景”层。选择【矩形】工具,在舞台上绘制一个矩形,效果如图1-16所示。选择【选择】工具,双击刚才绘制的矩形,然后在【属性】面板中按照图1-17进行设置。在【颜色】面板中,设置线性渐变的第1个色块颜色为“FF0000”(红色),第2个色块颜色为“CC0000”(暗红色)。【要点提示】在设置【颜色】面板的属性时,一定要保证矩形处于被选中的状态,否则矩形的颜色将无法改变。,图1-16 绘制矩形,设置矩形属性 图1-7,输入文字。在“背景”层上面新建一个“文字”层。选择【文字】工具,在舞台上输入“Adobe Flash CS5”文字,如图1-20所示。,图1-20 输入文字,将文字全部选中,设置字体为“Zombie”,字体大小为“50”,填充颜色为“FFFF00”(黄色),选区的x和y坐标分别为“80”、“120”,如图1-21所示。,图1-21 设置文字属性,至此文字制作成功,其效果如图1-22所示。,图1-22 文字效果,导入素材。在“文字”层下面新建一个“特效”层。选择【文件】/【导入】/【打开外部库】菜单命令,将教学资源包中的“素材第一章特效库.fla”文件打开,如图1-24所示。,图1-24 打开特效库,按下鼠标左键拖动鼠标光标,将“星星”元件拖曳到舞台中,在拖曳过程中操作界面中会自动显示“星星”元件的虚框,然后将其放置到图1-25所示的位置。,图1-25 拖入素材,保存和发布影片。动画制作完成,按CtrlS快捷键保存影片。选择【文件】/【发布设置】菜单命令,打开图1-26所示的【发布设置】对话框。【要点提示】在【发布设置】对话框的【格式】选项卡中可以设置发布影片的格式和路径,在【Flash】选项卡中可以设置发布文件的播放器版本、压缩比例、防止导入等重要属性。全部保持默认设置,单击 按钮,发布影片,然后单击 按钮完成发布设置(也可以按F12快捷键发布影片)。至此动画制作完成。,图1-26 发布设置,【要点提示】通常在制作过程中,需要实时地测试和观看影片效果,并不需要正式发布影片,所以可用快捷键CtrlEnter测试影片。【案例小结】在本案例中,通过一个十分简单的Flash动画制作,为读者简述了制作Flash动画的流程和思路。例子虽然比较简单,却包含了制作复杂Flash动画的各个基本步骤。所以希望通过本案例的操作,对Flash CS5有所了解。,小结 在本章中,主要是对动画的整体概念和发展做了较为全面的讲解,并对动画制作的原则进行了简单的讲解,从Flash CS5动画制作软件的发展历程到界面介绍,再到制作动画流程介绍,为读者进入Flash动画世界开启了一扇大门,并在本章的最后安排了典型的案例,通过对该案例的学习,可以使读者对Flash动画的制作流程和设计思路有了简单了解,从而为其后期学习打下坚实的基础。,