fireworks 动画.ppt
合集下载
fireworks基础PPT课件
创建导航栏
1. 创建按钮元件后，可以从库面板中，将该元件的一 个实例拖到工作区域中，重复这个过程，创建多个按钮。
2. 为了对齐各个按钮，需要先作出引导线。选中“视 图”>“标尺”。
3.从标尺上，拖出水平和垂直的引导线。
4.反复从库面板中，把按钮的实例拖到文档中，并且对齐 到引导线。
5.选中不同的按钮实例，在属性面板上，修改文本 和链接地址。
6.单击“填充颜色框”图标。 7.在颜色弹出窗口中选择“透明按钮”。
8.选中“描边”工 具。
9.在“描边种类”中选择“铅笔”>“一像素柔化”。
10.按住Shift键，使用“指针”工具同时选择圆和文 字。
11.打开菜单栏的“文本”菜单，单击“附加到路径”。 12.环绕文字就做好了。
13.如果想旋转文字，选择“工具”面板中的“缩放工具”。 14.出现圆形箭头，就可以旋转文字。
3.打开层面板，选中当前图层，拖到“新建复制层”按 钮上，复制一个新层。
4.锁定层1。
5.选中层2，将填充方式变为实心，填充颜色为白色。 在菜单栏，选择修改，变形，数值变形，将宽高都设 置为90％。
6.使用“刀子工具”，在圆角矩形的上部四分之 一处，横向切割。
7.使用“指针”工具，点选下半部分，按键盘上的 DEL键，删除。如果无法选中，先导航
在 Fireworks 中，可以使用按钮编辑器快速创建一个按钮元件， 从库面板中，克隆多个按钮元件，就可以制作成导航栏。 创建带有样式的按钮 使用“按钮按钮编辑器”创建按钮，为了美化按钮，可以应 用样式面板中的样式，还可以应用“属性面板”上的各种效 果。
1.打开 Fireworks，通过“文件”>“新建”，新建一个文 档。
制作替换动画的原理：把一个GIF格式的图片变成切片，添 加“交换图象行为”，选择一个GIF动画文件。
fireworks课件第二讲动画 帧和Gif动画切片与热区
3 层的共享:将某一图层在整个fireworks文档中的所有帧 中共享 4公布到层:(commands—Document—Distribute to Layers)
制做动画的三种方式: 1 modify—symbol—Tween Instances…. 2 modify—Animation—Animation selection 3 给每一个帧都编辑对象可以用(distributed to frames (distributed (分配到帧))去做
利用切片的优点: 1 加快下载速度. 2 便于构建图像映射. 3 减少重复图像. 4 便于局部更新及局部优化.
创建及编辑切片: 1 显示和隐藏切处对象:工具箱中的按扭 2 移动和变形切片形状. 3 给切片添加URL. 创建切片响应: 1 拖拽图像翻转是建立翻转和图像交换效果最快的方法,它可以定义 当鼠标指针经过图像时发生的事件,最终效果往往是翻转图像.
按扭状态: 1 释放(up):是按扭的默认外观或闲置时的外观. 2 滑过(over):是当鼠标指针滑过按扭时该按扭的外观. 3 按下(down):鼠标按下时的状态. 4 按下时滑过(Over While Down):是用户将指针滑过处 于按下状态的按扭时按扭的外观. 按扭的编辑:
URL面板及库面板的介绍. 帧的讲解: 1 帧面板右键菜单: 添加帧: 复制帧: 改变帧排列顺序:
网页三剑客之一
Fireworks
第二讲 帧 动画和Gif动画的制作及切片与热点 教学目标:动画面板的介绍及动画的制作 教学重点:GIF动画制作 教学难点:切片的应用 主要内容:
1 元件 符号是指可以重复利用的图像,动画或者按扭, 它们保存在库里. 2 符号的分类: a 图形符号. b 按扭. c 动画 创建符号: 1 转换一个符号 F8 2 新建一个符号 Ctrl+F8
Fireworks 全套教学课件
FireWorks
北京工商大学 计算机与信息工程学院
毛典辉 maodianhui@
一、Fireworks的工作环境
启动Fireworks Fireworks的人机交互界面
Fireworks的启动
FireWorks的工作环境
Fireworks的工作模式
矢量绘图模式 位图编辑模式
利用画笔预设工具还可以定义自己感兴趣 的画笔形状（执行[编辑]->[自定义画笔 预设]）；
可以设置画笔的颜色、笔触、散布、透明、 纹理等项目。
三、铅笔工具
绘制没有笔锋的图形使用的画笔。
四、擦除工具
橡皮擦用来将图像的某些区域涂抹成背景 或透明色。
使用橡皮擦
擦除图像的多余部分，可通过设置透明度 来达到部分擦除的效果。
使用[曲线]命令——与色阶命令类似，但 使用的控制变量更多；
使用[自动色阶]命令——由计算机将图像 像素的最亮与最暗定义为白色和黑色，按 比例自动分配中间像素的值。
通道使——用选择[色调整阶的]颜命色；令
输入色调——调整暗、中 间和高光的值，对应下面 的三个滑块；
输出色阶——限定处理后 图像的亮度范围；
持续移动鼠标，在边缘的顶点处单击
[魔术棒]工具
根据预想边缘颜色的近似度来选取选区
鼠标单击选取颜色，通过调整容差、消除锯 齿等参数来选取。
使用[全选]命令
选择图像中的全部像素
使用[反选]命令
选择选区之外的区域
使用[选取相似]命令
选取与选区颜色相类似的区域
4、选区的编辑
选区的移动 选区的删除、合并、减少、重叠运算 选区的反转 选区范围的调整
创建Fireworks文档的基本操作
创建Fireworks文件（PNG格式图片） 绘图画布的设置 图像大小的调整 简单绘图与添加文字 操作的撤销与恢复 历史纪录面板的作用
北京工商大学 计算机与信息工程学院
毛典辉 maodianhui@
一、Fireworks的工作环境
启动Fireworks Fireworks的人机交互界面
Fireworks的启动
FireWorks的工作环境
Fireworks的工作模式
矢量绘图模式 位图编辑模式
利用画笔预设工具还可以定义自己感兴趣 的画笔形状（执行[编辑]->[自定义画笔 预设]）；
可以设置画笔的颜色、笔触、散布、透明、 纹理等项目。
三、铅笔工具
绘制没有笔锋的图形使用的画笔。
四、擦除工具
橡皮擦用来将图像的某些区域涂抹成背景 或透明色。
使用橡皮擦
擦除图像的多余部分，可通过设置透明度 来达到部分擦除的效果。
使用[曲线]命令——与色阶命令类似，但 使用的控制变量更多；
使用[自动色阶]命令——由计算机将图像 像素的最亮与最暗定义为白色和黑色，按 比例自动分配中间像素的值。
通道使——用选择[色调整阶的]颜命色；令
输入色调——调整暗、中 间和高光的值，对应下面 的三个滑块；
输出色阶——限定处理后 图像的亮度范围；
持续移动鼠标，在边缘的顶点处单击
[魔术棒]工具
根据预想边缘颜色的近似度来选取选区
鼠标单击选取颜色，通过调整容差、消除锯 齿等参数来选取。
使用[全选]命令
选择图像中的全部像素
使用[反选]命令
选择选区之外的区域
使用[选取相似]命令
选取与选区颜色相类似的区域
4、选区的编辑
选区的移动 选区的删除、合并、减少、重叠运算 选区的反转 选区范围的调整
创建Fireworks文档的基本操作
创建Fireworks文件（PNG格式图片） 绘图画布的设置 图像大小的调整 简单绘图与添加文字 操作的撤销与恢复 历史纪录面板的作用
fireworks课件
Macromedia Fireworks 8
Macromedia Fireworks 8
一、Fireworks 工作界面介绍 二、动画制作 三、切片和热点 四、行为 五、优化和导出
Fireworks 工作界面介绍
绘图编辑区是编辑图形图像的工作区 工具箱与工具栏提供了常用的绘图工具和编辑工具 控制面板主要有【层】、【帧】、【优化】和【历史】 等面板组成，用于设置动画、优化和简化工作流程等 行为。 菜单栏主要包括【文件】、【编辑】、【视图】、 【选择】、【修改】、【文本】、【命令】、【滤 镜】、【窗口】和【帮助】10个菜单，主要负责工具 箱与工具栏没有的其他一些复杂命令与行为。
菜单栏 工具栏
控制 面板 绘图编 辑区 工具箱
属性检 查器
工具箱
选取工具组 变换工具组
部分选定工具 切割工具组
选取框工具组 魔术棒工具 铅笔工具 模糊工具组
套索工具组 刷子工具 橡皮擦工具 橡皮章工具
工具箱
直线工具 矩形工具组 自由路径工具组
钢笔工具组Байду номын сангаас文本工具 刻刀工具
热区工具组 隐藏热区和切片
行为——fireworks自带的行为 自带的行为 行为
简单变换图像行为 交换图像行为 添加状态栏信息 添加导航栏 添加弹出菜单
注：切换到fireworks
动画制作
行为
行为就是在网页中进行的一系列动作。通过这 些动作，可是实现用户同网页的交互或导致某 个任务的执行。通常一个行为由一个事件和一 系列动作组成。 举个例子，用户将鼠标移动到一副图像上，这 就产生了一个事件，如果这时候图像发生变化， 就导致了一系列动作发生。
行为
Fireworks的行为可以通过行为面板进行添加 和编辑。 不是所有对象都能添加行为的， Fireworks只 允许为热区或切片添加行为。
Macromedia Fireworks 8
一、Fireworks 工作界面介绍 二、动画制作 三、切片和热点 四、行为 五、优化和导出
Fireworks 工作界面介绍
绘图编辑区是编辑图形图像的工作区 工具箱与工具栏提供了常用的绘图工具和编辑工具 控制面板主要有【层】、【帧】、【优化】和【历史】 等面板组成，用于设置动画、优化和简化工作流程等 行为。 菜单栏主要包括【文件】、【编辑】、【视图】、 【选择】、【修改】、【文本】、【命令】、【滤 镜】、【窗口】和【帮助】10个菜单，主要负责工具 箱与工具栏没有的其他一些复杂命令与行为。
菜单栏 工具栏
控制 面板 绘图编 辑区 工具箱
属性检 查器
工具箱
选取工具组 变换工具组
部分选定工具 切割工具组
选取框工具组 魔术棒工具 铅笔工具 模糊工具组
套索工具组 刷子工具 橡皮擦工具 橡皮章工具
工具箱
直线工具 矩形工具组 自由路径工具组
钢笔工具组Байду номын сангаас文本工具 刻刀工具
热区工具组 隐藏热区和切片
行为——fireworks自带的行为 自带的行为 行为
简单变换图像行为 交换图像行为 添加状态栏信息 添加导航栏 添加弹出菜单
注：切换到fireworks
动画制作
行为
行为就是在网页中进行的一系列动作。通过这 些动作，可是实现用户同网页的交互或导致某 个任务的执行。通常一个行为由一个事件和一 系列动作组成。 举个例子，用户将鼠标移动到一副图像上，这 就产生了一个事件，如果这时候图像发生变化， 就导致了一系列动作发生。
行为
Fireworks的行为可以通过行为面板进行添加 和编辑。 不是所有对象都能添加行为的， Fireworks只 允许为热区或切片添加行为。
Fireworks_8图像制作ppt课件
使用工具面板上的基本形状工具可以轻松 地绘制直线、矩形、圆等基本图形。基本 形状工具位于工具面板的“矢量”栏上。
22
1.绘制直线、矩形和椭圆
（1）从“工具”面板中选择“直线”工具、 “矩形”工具或“椭圆”工具。
（2）在“属性”面板中设置笔触和填充属性。 （3）在画布上拖动以绘制形状。
•对于“直线”工具，按住 Shift 键并拖动可限制只能按 45°的倾角增量来绘制直线。 •对于“矩形”或“椭圆”工具，按住 Shift 键并拖动可 将形状限制为正方形或圆形。
2. 用工具箱中的矩形工具，在编辑区拖画出一个长和宽都 是100象素的正方形，填充色为浅蓝色（＃0099CC）。
3. 选中该正方形，“编辑“－> “克隆”，克隆出一个，选 中克隆出的正方形，“修改”－>“变形”－>“数值变 形”，在弹出的对话框中设置为“调整大小”，把长和 宽都设为60象素。然后同时选中这两个一大一小的正方 形，“修改”－>“组合路径”－>“打孔”。这样，得到 了一个边框为20象素的镂空正方形。
在fireworks 8.0中导入一张明星图片，图片 宽度为400像素，保存件名为“明星.png”, 要求导出文件名为“明星.jpeg”。
19
2.文件视图
文件视图选项卡 显示比例和动画控制按钮
20
4.2 矢量编辑
计算机图形可以分为两种：矢量图和位图。
21
4.2.1 绘制矢量对象
可以将多个路径对象合并成单个路径对象。 选择两个或多个路径，然后选择“修改”
－> “组合路径”－>“合并” 。
36
（3）路径的基本操作——联合
联合路径是指将多个对象混合后，以所有 对象的外部轮廓作为路径，生成一个新的 对象。
22
1.绘制直线、矩形和椭圆
（1）从“工具”面板中选择“直线”工具、 “矩形”工具或“椭圆”工具。
（2）在“属性”面板中设置笔触和填充属性。 （3）在画布上拖动以绘制形状。
•对于“直线”工具，按住 Shift 键并拖动可限制只能按 45°的倾角增量来绘制直线。 •对于“矩形”或“椭圆”工具，按住 Shift 键并拖动可 将形状限制为正方形或圆形。
2. 用工具箱中的矩形工具，在编辑区拖画出一个长和宽都 是100象素的正方形，填充色为浅蓝色（＃0099CC）。
3. 选中该正方形，“编辑“－> “克隆”，克隆出一个，选 中克隆出的正方形，“修改”－>“变形”－>“数值变 形”，在弹出的对话框中设置为“调整大小”，把长和 宽都设为60象素。然后同时选中这两个一大一小的正方 形，“修改”－>“组合路径”－>“打孔”。这样，得到 了一个边框为20象素的镂空正方形。
在fireworks 8.0中导入一张明星图片，图片 宽度为400像素，保存件名为“明星.png”, 要求导出文件名为“明星.jpeg”。
19
2.文件视图
文件视图选项卡 显示比例和动画控制按钮
20
4.2 矢量编辑
计算机图形可以分为两种：矢量图和位图。
21
4.2.1 绘制矢量对象
可以将多个路径对象合并成单个路径对象。 选择两个或多个路径，然后选择“修改”
－> “组合路径”－>“合并” 。
36
（3）路径的基本操作——联合
联合路径是指将多个对象混合后，以所有 对象的外部轮廓作为路径，生成一个新的 对象。
第8章 Fireworks CS4 基础PPT课件
10
8.2.1 矢量图和位图概念
一、 矢量图像 矢量图像使用数学的方法描述，是用包含颜色和位置属性的直线
或曲线（即称为矢量）来描述图像属性的一种方法。比如说一个椭圆， 它就包括由通过椭圆边缘的一些点组成的轮廓和轮廓内的点两部分。
对于矢量图像，椭圆的颜色取决于椭圆轮廓曲线的颜色和轮廓封 闭的区域颜色，与轮廓内单独的点无关。我们可以通过修改描述椭圆 轮廓的直线或曲线来更改椭圆的性质，也可以移动、放缩、变形，或 者在不改变图像显示质量的前提下，改变具有矢量性质的椭圆的颜色。
网页设计与制作
20
8.2.4 矩形及相关工具
在这里，我们通过一个星形工具来实现一个 光芒四射的效果，进一步学习该工具的使用。 最终效果如图8-12所示
网页设计与制作
21
8.2.4 矩形及相关工具
网页设计与制作
22
8.2.4 矩形及相关工具
网页设计与制作
23
8.2.5 文本工具
网络图像的制作当然离不开文本。在Fireworks里刚创建的文本对象，既 不是位图对象，也不是普通的矢量对象。使用文本工具就可以在图像中输入 文本，步骤如下：
第八章 Fireworks CS4 基础
本章内容
8.1 熟悉工作环境 8.2 绘制和编辑对象 8.3 GIF动画 8.4 图像优化和导出
网页设计与制作
2
Fireworks CS4 简介
Fireworks CS4是Adobe公司推出的专门针对网络图形设计的工具 软件，是专业网络图像设计和处理的最好选择之一。Fireworks把位 图处理和矢量处理完美的结合在一起，并提供图像的优化和预览功能， 大大简化了网页图像和屏幕图形的制作过程。有了Fireworks，设计 者的工作就不再是复杂地从一个工具转到另一个工具，大量的重复工 作被省略，由此可以节省大量宝贵的时间。
《Fireworks应用》课件
添加文本
在Fireworks中，您可以添加文本内容，并且可以对文本进行格式化，例如修改字体、颜色和大小等。 另外，还可以为文本添加描边、阴影等效果。
添加和编辑图像
添加图像
通过导入、拖放等方式添加图 像。
调整图像大小和位置
可以为图像设置大小和位置， 以便更好地集成到设计中。
图像编辑工具
提供裁剪、旋转、矫正等多种 图像编辑功能，确保图像符合 您的设计要求。
图像滤镜效果
通过应用各种滤镜，例如模糊、锐化、马赛克、变形等，可以为图像添加各种有趣和独特的视觉效果。
添加和编辑图层
通过添加图层，可以更好地管理设计元素，例如文本、图像、形状等。通过 调整图层属性，例如透明度、填充、边框等，可以更好地控制设计元素的外 观和信息。
制作按钮和动画
通过各种工具和技巧，您可以制作出各种按钮、标志、图标和动画效果。例如，您可以通过组合形状和 动画来创建下拉菜单或轮播图。
Fireworks应用
欢迎来到Fireworks应用的PPT课件。这个课件将会向大家介绍如何使用 Fireworks软件来创建惊人的图形和动画效果。
Fireworks软件简介
Fireworks是一款专为网页开发和创意设计制作的图像编辑软件，其功能强大 而且易于上手。通过这个课件，您将掌握Fireworks的基本操作和技巧，学会 制作精美的Web图形。
导出PPT
在完成设计工作后，您可以将Fireworks作品输出到PPT文件中，方便与他人进行分享和展示。
常见问题解答
1 如何复制图层？
可以通过选中图层，然后按Ctrl/Cmd+C和Ctrl/Cmd+V来复制和粘贴图层。
2 如何添加多个图像？
可以通过拖放方式将多个图像添加到Fireworks中，也可以通过导入功能来添加。
第2篇第9~13章 Fireworks的基本操作PPT课件
思考题
11.1 绘制矢量对象
1、绘制规则路径
– “直线工具”（Line） – “矩形工具”（Rectangle） – “圆角矩形工具”（Rounded Rectangle） – “椭圆工具”（Ellipse）
– “多边形工具”（Polygon） 2、绘制自由路径
– “钢笔工具”（Pen） – “矢量路径工具”（Vector Path）
• 用数值控制变形
– “修改”|“变形”|“数值变形” （ Numeric Transform ）
9.6.3 组织对象
• 组合与解除组合：将多个对象组合起来作为一个对象
处理
– 组合：“修改”|“组合” （Group） – 解除组合：“修改”|“解除的排列
1、 选择规则形状区域
– 矩形工具（Marquee tool） – 椭圆形工具（Over Marquee tool）
2、选择不规则形状区域
– 套索工具（Lasso tool） – 多边形工具（Polygon Lasso Tool）
3、选择相似色彩区域
– “魔术棒”工具（Magic Wand Tool）
每个滤镜的设置窗口均不相同，但在调整各个参 数时，均可立即看到“预览”效果。 【例10-2】在一个心形图形上应用斜面处理
10-2制作方法
• 用钢笔画一半心性曲线，克隆一次，水平
翻转一次。
• 选择两个后组合并平面化所选（成为位图） • 用橡皮擦除多余部分 • 用油漆桶对其填充红色 • 使用滤镜-eye candy/bevel boss
– Eye Candy 滤镜又名眼睛糖果/ Bevel Boss （浮雕滤镜），它可以生成各式的斜面与雕刻 外型，并能把之变成浮雕效果。
第2篇 第11章 用Fireworks制作和处理矢量图
11.1 绘制矢量对象
1、绘制规则路径
– “直线工具”（Line） – “矩形工具”（Rectangle） – “圆角矩形工具”（Rounded Rectangle） – “椭圆工具”（Ellipse）
– “多边形工具”（Polygon） 2、绘制自由路径
– “钢笔工具”（Pen） – “矢量路径工具”（Vector Path）
• 用数值控制变形
– “修改”|“变形”|“数值变形” （ Numeric Transform ）
9.6.3 组织对象
• 组合与解除组合：将多个对象组合起来作为一个对象
处理
– 组合：“修改”|“组合” （Group） – 解除组合：“修改”|“解除的排列
1、 选择规则形状区域
– 矩形工具（Marquee tool） – 椭圆形工具（Over Marquee tool）
2、选择不规则形状区域
– 套索工具（Lasso tool） – 多边形工具（Polygon Lasso Tool）
3、选择相似色彩区域
– “魔术棒”工具（Magic Wand Tool）
每个滤镜的设置窗口均不相同，但在调整各个参 数时，均可立即看到“预览”效果。 【例10-2】在一个心形图形上应用斜面处理
10-2制作方法
• 用钢笔画一半心性曲线，克隆一次，水平
翻转一次。
• 选择两个后组合并平面化所选（成为位图） • 用橡皮擦除多余部分 • 用油漆桶对其填充红色 • 使用滤镜-eye candy/bevel boss
– Eye Candy 滤镜又名眼睛糖果/ Bevel Boss （浮雕滤镜），它可以生成各式的斜面与雕刻 外型，并能把之变成浮雕效果。
第2篇 第11章 用Fireworks制作和处理矢量图
fireworks课件教案第9章基础动画的
9.1.2 设置帧率和背景色
（1）执行“修改”菜单里的“文档”命令来打开文档属性对话 框，从而可以设定帧率和背景色。如图所示。
（2）在“帧频”文本框中，可以输入每秒钟动画要播放的帧数。 通常，对于大多数在计算机上显示的动画来说，尤其是对通过网络传 输的动画来说，帧率设在8～24fp/s之间为宜。
（3）在“背景颜色”下拉框中，选择动画的背景颜色。 在设定后帧率和背景色之后，就可放心地动手制作Flash动画了。
下面以一个实例来说明如何制作逐帧动画。这个实例是制作一个转动 的钟，其时针和分针会一直不停地转动，且当分针转过一周后，时针 才会转动一格。效果图如所示。
该实例制作的基本步骤如下：
（1）执行“文件”菜单里的“新建”命令，在弹出的对话框中，类型选 择为Flash文件（ActionScript 2.0）或Flash文件（ActionScript 3.0）， 然后单击“确定”按钮。
（14）在图层2的第60帧上单击鼠标右键，选择“插入帧”，设置动画延 续到第60帧。
（15）重复以上3步，直到第360帧结束。
这样就完成了如此规模庞大的逐帧动画，如图所示。
9.3 运动渐变动画
渐变动画不同于逐帧动画，它需要创建两个不同性质特征的关键 帧，而不用每帧的设计。渐变动画两个关键帧之间的帧由Flash自动 创建。
9.2 逐帧动画
动画的制作实际上就是改变连续帧的内容的过程。在逐帧动画中，需 要在每一帧上创建一个不同的画面，连续的帧组合成连续变化的动画。 利用这种方法制作动画，工作量非常大，如果要制作的动画比较长， 那就需要更多的关键帧，需要投入相当大的精力和时间。不过这种方 法制作出来的动画效果却非常好，因为是对每一帧都进行绘制，所以 动画变化的过程非常准确、真实。
Fireworks.ppt
选择“滤镜”＞“模糊”＞“运动模糊”，参数设置如下：角度 = 127; 距离 = 5。（改变水滴出来的位置）选择“滤镜”＞“模糊”＞“高斯模糊”，参数设 置为：模糊范围 = 3.3，（改变水滴的大小 ）
选择“滤镜”＞“颜色调整”＞“亮度/对比度”，参数设置如下：亮度 = -16； 对比度 = 100。这个效果是为了得了一个纯黑白对象。
实例一环绕文字
新建宽和高都是300像素的文件，背景设为白色。 点选“工具”面板中的“文本”工具，在工作区输入文本
“/fuguotao/，字体选择“Arial Black”，字号 为20像素大小，颜色为黑色。 点选“工具”面板“矢量”部分的“椭圆”工具。按住 “Shift”键，在工作区画一个圆。在“属性”检查器中输入 新的宽度 (w) 或高度 (h) 值，这里都是130。 单击“填充颜色框”图标。在颜色弹出窗口中选择“透明按 钮” （无填充） 选中“描边”工具。在“描边种类”中选择“铅笔”>“一像 素柔化”。按住Shift键，使用“指针”工具同时选择圆和文 字。打开菜单栏的“文本”菜单，单击“附加到路径”。 如果想旋转文字，选择“工具”面板中的“缩放工具”。出 现圆形箭头，就可以旋转文字。 如果希望文本沿路径的内侧排列，选择“文本”菜单中的 “倒转方向”。
一 文件窗口
fireworks 的文件窗口上有四个标签，可以同 时编辑和预览图象，你可以同时预览四种不 同的优化设定所产生的效果，选择最理想的 一种选 择、创建、编辑图象 的工具,有的工具按钮 的右下角有一个小三 角，说明这个工具包 含有几种不同的形式， 按住这个工具不放就 能显示其他的形式。
实例二 羽化图片
打开一个图片。点击 “工具”面板“位图” 部分的“选取框”工具。 也可以选择“椭圆选取 框”工具，选择部分图 象。
选择“滤镜”＞“颜色调整”＞“亮度/对比度”，参数设置如下：亮度 = -16； 对比度 = 100。这个效果是为了得了一个纯黑白对象。
实例一环绕文字
新建宽和高都是300像素的文件，背景设为白色。 点选“工具”面板中的“文本”工具，在工作区输入文本
“/fuguotao/，字体选择“Arial Black”，字号 为20像素大小，颜色为黑色。 点选“工具”面板“矢量”部分的“椭圆”工具。按住 “Shift”键，在工作区画一个圆。在“属性”检查器中输入 新的宽度 (w) 或高度 (h) 值，这里都是130。 单击“填充颜色框”图标。在颜色弹出窗口中选择“透明按 钮” （无填充） 选中“描边”工具。在“描边种类”中选择“铅笔”>“一像 素柔化”。按住Shift键，使用“指针”工具同时选择圆和文 字。打开菜单栏的“文本”菜单，单击“附加到路径”。 如果想旋转文字，选择“工具”面板中的“缩放工具”。出 现圆形箭头，就可以旋转文字。 如果希望文本沿路径的内侧排列，选择“文本”菜单中的 “倒转方向”。
一 文件窗口
fireworks 的文件窗口上有四个标签，可以同 时编辑和预览图象，你可以同时预览四种不 同的优化设定所产生的效果，选择最理想的 一种选 择、创建、编辑图象 的工具,有的工具按钮 的右下角有一个小三 角，说明这个工具包 含有几种不同的形式， 按住这个工具不放就 能显示其他的形式。
实例二 羽化图片
打开一个图片。点击 “工具”面板“位图” 部分的“选取框”工具。 也可以选择“椭圆选取 框”工具，选择部分图 象。
fireworks教案课件第2章FlashCS4基础
从图中可以看出该工具栏提供了16个最常用的命令，它可以固定横放 在菜单栏的下面，也可以垂直固定在左右边框上，还可以浮动在屏幕 上。
2.1.4 绘图工具箱
使用Flash CS4进行动画创作，必须绘制各种图形和对象，这就必须 使用到各种绘图工具。绘图工具箱中包含了10多种绘图工具，用户可 以使用这些工具对图像或选定区进行操作。单击工作区右侧的工具箱 缩略图标，即可展开工具箱面板，如图所示。
2.2.2 工具栏、工具面板的设置
通过“窗口”菜单及其子菜单下的各项命令，可以方便地显示工具栏和工具 面板。工具面板有很多种，同时显示出来的话会使工作界面凌乱不堪，可以 根据实际工作需要选择其中几种，或修改面板的显示方式。单击Flash CS4面 板右上角的 按钮可以将面板缩为标题栏半透明的精美图标。单击 按钮 即可展开面板。
2.1.5 时间轴
Flash CS4的时间轴窗口默认情况下位于工作区的下方，它是处理帧 和层的地方，而帧和层则是动画的主要组成部分。当选择某一层，然 后在舞台上绘制内容或者将内容导入到舞台中时，该内容将成为这个 层的一部分，因为它是当前所选的内容。时间线上的帧可根据时间改 变内容。舞台中所出现的每一帧的内容表示该时间点上出现在各层上 的所有内容的反映。可以移动、添加、改变和删除不同帧的各层上的 内容以创建运动和动画。在时间线上使用多层层叠技术可将不同内容 放置在不同层，从而创建一种有层次感的动画效果。
时间轴窗口分为两大部分：图层面板和时间轴控制区。
2.1.6 动画舞台
舞台是一个矩形区域，相当于实际表演中的舞台。可以在其中绘制和 放置电影内容。任何时间看到的舞台中显示当前帧的内容。
舞台的默认颜色为白色，可用作电影的背景。在最终电影中的任何区 域都可看见该背景，可以将位图导入Flash，然后将它放置在舞台的 最底层，这样它可覆盖舞台，成为一个背景。
2.1.4 绘图工具箱
使用Flash CS4进行动画创作，必须绘制各种图形和对象，这就必须 使用到各种绘图工具。绘图工具箱中包含了10多种绘图工具，用户可 以使用这些工具对图像或选定区进行操作。单击工作区右侧的工具箱 缩略图标，即可展开工具箱面板，如图所示。
2.2.2 工具栏、工具面板的设置
通过“窗口”菜单及其子菜单下的各项命令，可以方便地显示工具栏和工具 面板。工具面板有很多种，同时显示出来的话会使工作界面凌乱不堪，可以 根据实际工作需要选择其中几种，或修改面板的显示方式。单击Flash CS4面 板右上角的 按钮可以将面板缩为标题栏半透明的精美图标。单击 按钮 即可展开面板。
2.1.5 时间轴
Flash CS4的时间轴窗口默认情况下位于工作区的下方，它是处理帧 和层的地方，而帧和层则是动画的主要组成部分。当选择某一层，然 后在舞台上绘制内容或者将内容导入到舞台中时，该内容将成为这个 层的一部分，因为它是当前所选的内容。时间线上的帧可根据时间改 变内容。舞台中所出现的每一帧的内容表示该时间点上出现在各层上 的所有内容的反映。可以移动、添加、改变和删除不同帧的各层上的 内容以创建运动和动画。在时间线上使用多层层叠技术可将不同内容 放置在不同层，从而创建一种有层次感的动画效果。
时间轴窗口分为两大部分：图层面板和时间轴控制区。
2.1.6 动画舞台
舞台是一个矩形区域，相当于实际表演中的舞台。可以在其中绘制和 放置电影内容。任何时间看到的舞台中显示当前帧的内容。
舞台的默认颜色为白色，可用作电影的背景。在最终电影中的任何区 域都可看见该背景，可以将位图导入Flash，然后将它放置在舞台的 最底层，这样它可覆盖舞台，成为一个背景。
第2篇第9~13章 Fireworks的基本操作PPT课件
10.4 滤镜的使用
10.1 创建位图对象
1、打开外部位图文件：“文件”|“打开” 2、导入外部位图文件：“文件”|“导入” 3、矢量图转变为位图： “修改”|“平面化所选” 4、绘制位图对象
– 使用“铅笔”（Pencil）工具 – 使用“刷子”（Brush）工具
10.2 编辑位图对象 10.2.1 选择位图的编辑区域层: 点击层面板中的“新建 | 复制层”按钮。 – 复制层: 将要复制的层拖到层面板的“新建/复制层”按
钮。 – 删除层: 将要删除的层拖到层面板的垃圾桶中。 – 重命名层或对象: 双击层面板中欲命名的层或对象，在弹
出文本框中输入新名。 – 移动层或对象: 将层面板中要移动的层或对象拖到所需位
“显示网格”和“编辑网 格” 命令
9.4 使用“历史记录”面板 例9-1 （1 ）
图9-6 建立3个操作后的历史记录面板
9.4 使用“历史记录”面板 例9-1 （2 ）
图9-7 撤消后两个操作
可选中后两步，保存为tt
9.4 使用“历史记录”面板 例9-1 （3 ）
对新画的圆，执行“命令”|tt
置。 – 组合层: 同一层或不同层中矢量对象或位图对象可以被合
并，以简化层面板。 【例9-5】 制作一个含有两个层的图形。
第2篇 第10章 位图的创建和编辑
10.1 创建位图对象 10.2 编辑位图对象 10.3 调整位图的颜色和色调
10.3.1 调整位图色调 10.3.2 调整位图的亮度或对比度 10.3.3 调整位图的色相或饱和度 10.3.4 反相位图
5、旋转画布
9.6 对象的操作 9.6.1 选择对象
• 使用指针工具
– 用指针在画布上拖出一个矩形区域，则该区域中包含的所 有对象都会被选中；
10.1 创建位图对象
1、打开外部位图文件：“文件”|“打开” 2、导入外部位图文件：“文件”|“导入” 3、矢量图转变为位图： “修改”|“平面化所选” 4、绘制位图对象
– 使用“铅笔”（Pencil）工具 – 使用“刷子”（Brush）工具
10.2 编辑位图对象 10.2.1 选择位图的编辑区域层: 点击层面板中的“新建 | 复制层”按钮。 – 复制层: 将要复制的层拖到层面板的“新建/复制层”按
钮。 – 删除层: 将要删除的层拖到层面板的垃圾桶中。 – 重命名层或对象: 双击层面板中欲命名的层或对象，在弹
出文本框中输入新名。 – 移动层或对象: 将层面板中要移动的层或对象拖到所需位
“显示网格”和“编辑网 格” 命令
9.4 使用“历史记录”面板 例9-1 （1 ）
图9-6 建立3个操作后的历史记录面板
9.4 使用“历史记录”面板 例9-1 （2 ）
图9-7 撤消后两个操作
可选中后两步，保存为tt
9.4 使用“历史记录”面板 例9-1 （3 ）
对新画的圆，执行“命令”|tt
置。 – 组合层: 同一层或不同层中矢量对象或位图对象可以被合
并，以简化层面板。 【例9-5】 制作一个含有两个层的图形。
第2篇 第10章 位图的创建和编辑
10.1 创建位图对象 10.2 编辑位图对象 10.3 调整位图的颜色和色调
10.3.1 调整位图色调 10.3.2 调整位图的亮度或对比度 10.3.3 调整位图的色相或饱和度 10.3.4 反相位图
5、旋转画布
9.6 对象的操作 9.6.1 选择对象
• 使用指针工具
– 用指针在画布上拖出一个矩形区域，则该区域中包含的所 有对象都会被选中；
《Fireworks应用》课件
工具栏
提供常用工具的快速访问，如选择工具、画 笔工具等。
工作区
显示和编辑图像的区域。
创建和编辑图像
01
02
03
创建新图像
通过选择“文件”>“新 建”命令，可以创建一个 新的空白图像。
导入图像
通过选择“文件”>“导 入”命令，可以将其他图 像或图片导入到当前工作 区。
编辑图像
使用各种工具和命令对图 像进行编辑，如裁剪、调 整亮度/对比度、应用滤镜 等。
件时。这得益于Fireworks的优化和专为网页设计的功能。
与Illustrator的比较
设计目的
Fireworks和Illustrator都是矢量图形设计工具，但 Fireworks更专注于网页设计和原型设计，而Illustrator则 更适合印刷品设计和图形设计。
操作方式
Fireworks的操作方式更直观，容易上手。而Illustrator的 操作方式则更为专业，需要更多的学习和实践。
详细描述
Fireworks支持多种移动设备尺寸和分辨率，提供了丰富的移动界面设计工具和 资源，如矢量图形、图标、按钮等。通过实例展示，可以深入了解Fireworks在 移动应用界面设计方面的应用和技巧，提高设计师的设计水平和效率。
游戏界面设计实例
总结词
游戏界面设计实例展示了Fireworks在游戏界面设计方面的应 用，包括游戏图标、菜单、界面布局等方面的设计技巧。
Fireworks的未来展望
更加高效的设计工具
Fireworks将不断优化性能，提高设计和制作效率，满足用户快速 迭代和高效工作的需求。
更加丰富的素材和模板
Fireworks将提供更加丰富和多样的素材和模板，降低用户寻找和 制作素材的时间成本。
fireworks教案课件第1章FlashCS4概述
1.2.6 动画编辑器
使用Flash CS4新增的动画编辑窗口可以对关键帧参数进行全面、 细致的控制，这些参数包括旋转、大小、缩放、位置和滤镜等，即 使是细微的调整也能轻而易举的做到。
1.2.7 动画预设
动画预设是作为动画编辑窗口的辅助出现。动画预设可应用于任何对 象。用户可以从大量预设中进行选择，或创建并保存自己的动画，或 导入/导出动画预设，以与他人共享，以节省动画创作时间。
与以骨骼动画出名的2D动画软件Anime Studio Pro相比，Flash还有 相当多的地方需要改进，比如目前骨骼工具还不能直接作用于位图。
1.2.5 装饰工具和喷涂刷工具
这是两个非常实用的功能，可以将任何元件转变为即时设计元素，并 应用于喷涂刷工具和装饰工具。
使用装饰工具可快速创建类似于万花筒的效果并应用填充。使用喷涂 刷工具可在指定区域随机喷涂元件，特别适合添加一些特殊效果，比 如星光、雪花、落叶等画面元素，极大地拓展了Flash的表现力。
1.2.8 针对 Adobe AIR 进行创作
Flash CS4的安装程序中加入了Adobe AIR作为可选安装组件。 Adobe AIR的发布方式给用户提供了更多的想象空间，面向跨更多 设备——Web、移动和桌面的更多用户。借助发布到 Adobe AIR 运 行时的全新集成功能，用户可实现交互式桌面体验。
第1章 Flash CS4概述
本章重点
本章将向读者介绍Flash的基本情况，内容包括Flash的发展历史、 软件特色、文件类型、Flash CS4的新增功能与新特性以及Flash CS4的应用范围等知识。
学习目的
通过本章的学习，您可以： 了解Flash的软件特色。。 掌握Flash的文件格式。 了解Flash CS4比以往Flash版本的新增功能与新特性。 了解Flash CS4的应用范围。
使用Flash CS4新增的动画编辑窗口可以对关键帧参数进行全面、 细致的控制，这些参数包括旋转、大小、缩放、位置和滤镜等，即 使是细微的调整也能轻而易举的做到。
1.2.7 动画预设
动画预设是作为动画编辑窗口的辅助出现。动画预设可应用于任何对 象。用户可以从大量预设中进行选择，或创建并保存自己的动画，或 导入/导出动画预设，以与他人共享，以节省动画创作时间。
与以骨骼动画出名的2D动画软件Anime Studio Pro相比，Flash还有 相当多的地方需要改进，比如目前骨骼工具还不能直接作用于位图。
1.2.5 装饰工具和喷涂刷工具
这是两个非常实用的功能，可以将任何元件转变为即时设计元素，并 应用于喷涂刷工具和装饰工具。
使用装饰工具可快速创建类似于万花筒的效果并应用填充。使用喷涂 刷工具可在指定区域随机喷涂元件，特别适合添加一些特殊效果，比 如星光、雪花、落叶等画面元素，极大地拓展了Flash的表现力。
1.2.8 针对 Adobe AIR 进行创作
Flash CS4的安装程序中加入了Adobe AIR作为可选安装组件。 Adobe AIR的发布方式给用户提供了更多的想象空间，面向跨更多 设备——Web、移动和桌面的更多用户。借助发布到 Adobe AIR 运 行时的全新集成功能，用户可实现交互式桌面体验。
第1章 Flash CS4概述
本章重点
本章将向读者介绍Flash的基本情况，内容包括Flash的发展历史、 软件特色、文件类型、Flash CS4的新增功能与新特性以及Flash CS4的应用范围等知识。
学习目的
通过本章的学习，您可以： 了解Flash的软件特色。。 掌握Flash的文件格式。 了解Flash CS4比以往Flash版本的新增功能与新特性。 了解Flash CS4的应用范围。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
• 向序列中添加状态
1 从“ 状态” 面板的“ 选项” 菜单中选择“ 添加状态”。 2 输入要添加的状态的数目。 3 选择要插入状态的位置并单击“ 确定”。
• 反向状态的顺序
您可以反向所有状态的顺序或选定范围内的状态顺序。 1 选择“ 命令”>“ 文档”>“ 反向状态”。 2 执行下列操作之一： • 选择“ 所有状态” 以反向从开始到结束的状态顺序。 • 选择“ 状态范围”，然后选择开始状态和结束状态，以反向
（ 4 将文档优化为 GIF 动画文件 5 将文档作为 GIF 动画文件或者 SWF 文件导出，或者保存为
Fireworks PNG 文件并导入到 Flash 中做进一步编辑。
一、动画基础知识
• 关于动画元件
动画元件是动画中的主角。动画元件可以是您创建或导入的任何 对象，并且一个文件中可以有许多元件。每个元件都拥有其各
六、使用现有动画
• 螺旋式渐隐
您可以使用“ 螺旋式渐隐” 效果创建组合成多种效果的动画。
一、动画基础知识
• 更改动画元件的属性
1 选择一个动画元件。 2 选择“ 修改”>“ 动画”>“ 设置” 打开“ 动画” 对话框。
如果“ 属性” 检查器尚未打开，可选择“ 窗口”>“ 属性” 将其打开。 3 更改属性。 4 如果正在使用“ 动画” 对话框，单击“ 确定” 以接受更改 的属性。
一、动画基础知识
所选范围之内的状态顺序。 3 单击“ 确定”。
二、状态
• 在“ 状态” 面板中移动所选对象
可以使用“ 状态” 面板将对象移动到另一个状态。仅出现在 单个状态中的对象会在播放动画时消失；您可以使它们在不 同的时
间消失和重新出现。 在“ 状态” 面板中，状态延迟时间右侧的小圆圈表示该状态
中的对象状态。 1 在画布上，选择要显示在另一个状态上的对象。 2 在“ 状态” 面板中，将选取指示器（状态延迟时间右侧的
第五讲 动画
教学目标
通过本讲的学习掌握创建编辑位 图图像
• 1、
教学内容：
• 重点：了解Firworks的使用范围
教学重难点：
一、动画基础知识
Adobe® Fireworks®可以创建能够移动的横幅广告、徽 标和卡通形象等动画图形。可以通过向称为动画元件 的对象分配属性来创建动画。元件的动画可分成多种 状态，状态包含动画中的图像和对象。一个动画中可 以有一个以上的元件，每个元件可以有不同的动作。 不同的元件可以包含不同数目的状态。当所有元件的 所有动作都完成时，动画就结束了。
散到状态” 按钮 来完成此操作。
四、预览动画
• 在工作区中预览动画
使用显示在文档窗口底部的状态控件。
• 在“ 预览” 视图中预览动画
1 单击文档窗口左上角的“ 预览” 按钮。 2 使用状态控件
• 在 Web 浏览器中预览动画
选择“ 文件”>“ 在浏览器中预览”，并从子菜单中选择一个浏览器。 注： 若要在预览动画时查看动作，请在“ 优化” 面板中选择“GIF
播放动画。
五、优化动画
• 从“ 优化” 面板中选择设置
优化过程会将文件压缩成最小的包，这会缩短 Web 下载时间。 1 选择“ 窗口”>“ 优化”。 2 在“ 优化” 面板中选择导出文件格式。 3 选择“ 调色板” 和“ 抖动” 选项。 4 在“ 优化” 面板的“ 透明度” 弹出菜单中，选择“ 索引色
二、状态
• 在播放期间隐藏状态
隐藏状态在播放期间不显示而且也不会导出。 1 执行下列操作之一： • 从“ 状态” 面板的“ 选项” 菜单中选择“ 属性”。 • 双击状态延迟列。 2 取消选择“ 导出时包括”。 3 按 Enter 或者在“ 帧” 面板外部单击。
二、状态
• 添加新状态
单击“ 状态” 面板底部的“ 新建/ 重制状态” 按钮。
自的属性和独立的行为，因此可以创建在其它元件淡入淡出或收 缩时在屏幕上移动的元件。
不是动画的每个方面都需要使用元件。但是，对于出现在多个状 态中的图形使用元件和实例会减小文件大小。
可以随时使用“ 动画” 对话框或“ 属性” 检查器更改动画元 件的属性。还可以在不影响文档其余部分的情况下编辑元件的 图
状态数是一个关键属性。在设置此属性时， Fireworks 会自动 将完成该动作所需的状态数添加到文档中。
一、动画基础知识
• 动画元件的属性
状态动画中状态的数量。可以用滑块指定状态数（最多可指定 250 个），也可以在“ 状态” 框中输入任何数字。默认值为 5。
移动（仅限“ 动画” 对话框）对象移动的距离（用像素表示）。默认 值为 72，但没有上限。移动是线性的，并且没有关键状态
二、状态
可以通过创建其内容将出现在“ 状态” 面板上的状态来生成动 画。
每个状态也都有相关的属性。通过设置状态延迟或隐藏状态， 可以在编辑动画时查看其外观。
• 设置状态持续时间
状态延迟指定当前状态显示多长时间，用一秒的百分之一表示。 例如，指定 50 可将该状态显示半秒，指定 300 可将该状态 显示三秒。
三、编辑动画基本概念
• 补间实例
1 选择画布上同一图形元件的两个或更多的实例。不要选择不 同元件的实例。
2 选择“ 修改”>“ 元件”>“ 补间实例”。 3 在“ 补间实例” 对话框中输入要插入到原始对之间的补间
步骤的数目。 4 若要将补间对象分散到不同的状态中，请选择“ 分散到状
态” 并单击“ 确定”。 以后可以通过选择所有实例并单击“ 状态” 面板中的“ 分
默认值为 100%。创建淡入/ 淡出需要同一元件的两个实 例：一个播放淡入，另一个播放淡出。 旋转从开始到完成，旋转的度数。值的范围从 0 到 360º。要想让元件
旋转不止一圈，可以输入更高的值。默认值为 0º。 “ 顺时针” 和“ 逆时针” 对象旋转的方向（顺时针 (CW) 或逆时针
(CCW)）。
打开洋葱皮时，前后状态中的对象将变暗，以便您可以将它们 与当前状态中的对象区分开。
• 补间
在 Fireworks 中，补间是一个手动过程，它混合同一元件的 两个或多个实例，并使用插值属性创建中间的实例。使用补 间可以
创建对象在画布间的复杂移动，以及其动态滤镜在动画的每个 状态下发生更改的对象的复杂移动。
1 选择一个或多个状态： 2 执行下列操作之一： • 从“ 状态” 面板的“ 选项” 菜单中选择“ 属性”。 • 双击状态延迟列。 3 为状态延迟输入一个值。 4 按 Enter 或者在“ 帧” 面板外部单击。
二、状态
• 在播放期间隐藏状态
隐藏状态在播放期间不显示而且也不会导出。 1 执行下列操作之一： • 从“ 状态” 面板的“ 选项” 菜单中选择“ 属性”。 • 双击状态延迟列。 2 取消选择“ 导出时包括”。 3 按 Enter 或者在“ 帧” 面板外部单击。
• 删除所选动画元件中的动画
选择“ 修改”>“ 动画”>“ 删除动画”。 元件变成图形元件，不再有动画属性。如果您以后将元件重新转
换为动画元件，它将保留其先前的动画设置。。
• 从文档库中删除元件
1 在“ 文档库” 面板中选择所需的动画元件。 2 将元件拖到右下角的垃圾桶图标上。
一、动画基础知识
• 改变元件的移动或方向
方向（仅限“ 动画” 对话框）对象移动的方向（从 0 到 360º）。还 可以通过拖动对象的动画手柄来更改“ 移动” 和“ 方向” 的值。
缩放从开始到完成，元件大小的变化百分比。默认值为 100%，但没 有上限。若要将对象从 0% 缩放到 100%，原始对象必须
很小；建议使用矢量对象。 不透明度从开始到完成，淡入或淡出的度数。值的范围从 0 到 100，
一、动画基础知识
• 动画工作流程
1 可以从头开始创建动画元件，也可以通过将现有对象转换为元 件来创建动画元件
2 可以在“ 属性” 检查器或“ 动画” 对话框中编辑动画元件。 可以设置移动的角度和方向、缩放、不透明度（淡入或淡出） 以及旋转的角度和方向
注： 移动的角度和方向选项只能在“ 动画” 对话框中找到。 3 使用“ 状态” 面板中的“ 状态延迟” 控件设置动画速度。
矢量对象或位图对象。 5 在完成对该元件的编辑之后，切换到整页
一、动画基础知识
• 将对象转换为动画元件
1 选择该对象。 2 选择“ 修改”>“ 动画”>“ 选择动画”。 3 通过设置动画属性来编辑元件。 动画控件出现在对象的边框上，而元件的副本添加到库中。
一、动画基础知识
• 编辑动画元件
可以更改各种元件属性，如动画不透明度和旋转。可以使元件显 示为旋转、加速、淡入淡出或者是这些属性的任意组合。
动画” 作为“ 导出文件格式works PNG 文件形式导入 Flash 也是如此。
五、优化动画
设置构成动画的元件和状态后，请优化动画以使其便于加载和顺 利播放
• 通过循环将动画设置为重复
使动画重复之后，循环处理将尽可能减少生成动画所需的状态数。 1 选择“ 窗口”>“ 状态” 以显示“ 状态” 面板。 2 单击面板底部的“GIF 动画循环” 按钮。 3 选择动画第一遍播放后重复播放的次数。 例如，如果选择 4，则动画共播放 5 遍。“ 永久” 不停地重复
黑色小圆圈）拖到新的状态上。 若要将选定对象复制到其它状态，请在按住 Alt 的同时，拖
动这些对象。
二、状态
• 查看状态中的对象
从“ 层” 面板底部的“ 状态” 弹出菜单中选择状态。
三、编辑动画基本概念
• 洋葱皮
洋葱皮是一种技术，用来查看位于所选状态之前和之后状态的 内容。可以很流畅地使对象变为动画，而不用在对象中来回 跳跃。
导入文件后，可以将文件格式设置为 GIF 动画，以便能够从 Fireworks 中导出动 作。
1 从“ 状态” 面板的“ 选项” 菜单中选择“ 添加状态”。 2 输入要添加的状态的数目。 3 选择要插入状态的位置并单击“ 确定”。
• 反向状态的顺序
您可以反向所有状态的顺序或选定范围内的状态顺序。 1 选择“ 命令”>“ 文档”>“ 反向状态”。 2 执行下列操作之一： • 选择“ 所有状态” 以反向从开始到结束的状态顺序。 • 选择“ 状态范围”，然后选择开始状态和结束状态，以反向
（ 4 将文档优化为 GIF 动画文件 5 将文档作为 GIF 动画文件或者 SWF 文件导出，或者保存为
Fireworks PNG 文件并导入到 Flash 中做进一步编辑。
一、动画基础知识
• 关于动画元件
动画元件是动画中的主角。动画元件可以是您创建或导入的任何 对象，并且一个文件中可以有许多元件。每个元件都拥有其各
六、使用现有动画
• 螺旋式渐隐
您可以使用“ 螺旋式渐隐” 效果创建组合成多种效果的动画。
一、动画基础知识
• 更改动画元件的属性
1 选择一个动画元件。 2 选择“ 修改”>“ 动画”>“ 设置” 打开“ 动画” 对话框。
如果“ 属性” 检查器尚未打开，可选择“ 窗口”>“ 属性” 将其打开。 3 更改属性。 4 如果正在使用“ 动画” 对话框，单击“ 确定” 以接受更改 的属性。
一、动画基础知识
所选范围之内的状态顺序。 3 单击“ 确定”。
二、状态
• 在“ 状态” 面板中移动所选对象
可以使用“ 状态” 面板将对象移动到另一个状态。仅出现在 单个状态中的对象会在播放动画时消失；您可以使它们在不 同的时
间消失和重新出现。 在“ 状态” 面板中，状态延迟时间右侧的小圆圈表示该状态
中的对象状态。 1 在画布上，选择要显示在另一个状态上的对象。 2 在“ 状态” 面板中，将选取指示器（状态延迟时间右侧的
第五讲 动画
教学目标
通过本讲的学习掌握创建编辑位 图图像
• 1、
教学内容：
• 重点：了解Firworks的使用范围
教学重难点：
一、动画基础知识
Adobe® Fireworks®可以创建能够移动的横幅广告、徽 标和卡通形象等动画图形。可以通过向称为动画元件 的对象分配属性来创建动画。元件的动画可分成多种 状态，状态包含动画中的图像和对象。一个动画中可 以有一个以上的元件，每个元件可以有不同的动作。 不同的元件可以包含不同数目的状态。当所有元件的 所有动作都完成时，动画就结束了。
散到状态” 按钮 来完成此操作。
四、预览动画
• 在工作区中预览动画
使用显示在文档窗口底部的状态控件。
• 在“ 预览” 视图中预览动画
1 单击文档窗口左上角的“ 预览” 按钮。 2 使用状态控件
• 在 Web 浏览器中预览动画
选择“ 文件”>“ 在浏览器中预览”，并从子菜单中选择一个浏览器。 注： 若要在预览动画时查看动作，请在“ 优化” 面板中选择“GIF
播放动画。
五、优化动画
• 从“ 优化” 面板中选择设置
优化过程会将文件压缩成最小的包，这会缩短 Web 下载时间。 1 选择“ 窗口”>“ 优化”。 2 在“ 优化” 面板中选择导出文件格式。 3 选择“ 调色板” 和“ 抖动” 选项。 4 在“ 优化” 面板的“ 透明度” 弹出菜单中，选择“ 索引色
二、状态
• 在播放期间隐藏状态
隐藏状态在播放期间不显示而且也不会导出。 1 执行下列操作之一： • 从“ 状态” 面板的“ 选项” 菜单中选择“ 属性”。 • 双击状态延迟列。 2 取消选择“ 导出时包括”。 3 按 Enter 或者在“ 帧” 面板外部单击。
二、状态
• 添加新状态
单击“ 状态” 面板底部的“ 新建/ 重制状态” 按钮。
自的属性和独立的行为，因此可以创建在其它元件淡入淡出或收 缩时在屏幕上移动的元件。
不是动画的每个方面都需要使用元件。但是，对于出现在多个状 态中的图形使用元件和实例会减小文件大小。
可以随时使用“ 动画” 对话框或“ 属性” 检查器更改动画元 件的属性。还可以在不影响文档其余部分的情况下编辑元件的 图
状态数是一个关键属性。在设置此属性时， Fireworks 会自动 将完成该动作所需的状态数添加到文档中。
一、动画基础知识
• 动画元件的属性
状态动画中状态的数量。可以用滑块指定状态数（最多可指定 250 个），也可以在“ 状态” 框中输入任何数字。默认值为 5。
移动（仅限“ 动画” 对话框）对象移动的距离（用像素表示）。默认 值为 72，但没有上限。移动是线性的，并且没有关键状态
二、状态
可以通过创建其内容将出现在“ 状态” 面板上的状态来生成动 画。
每个状态也都有相关的属性。通过设置状态延迟或隐藏状态， 可以在编辑动画时查看其外观。
• 设置状态持续时间
状态延迟指定当前状态显示多长时间，用一秒的百分之一表示。 例如，指定 50 可将该状态显示半秒，指定 300 可将该状态 显示三秒。
三、编辑动画基本概念
• 补间实例
1 选择画布上同一图形元件的两个或更多的实例。不要选择不 同元件的实例。
2 选择“ 修改”>“ 元件”>“ 补间实例”。 3 在“ 补间实例” 对话框中输入要插入到原始对之间的补间
步骤的数目。 4 若要将补间对象分散到不同的状态中，请选择“ 分散到状
态” 并单击“ 确定”。 以后可以通过选择所有实例并单击“ 状态” 面板中的“ 分
默认值为 100%。创建淡入/ 淡出需要同一元件的两个实 例：一个播放淡入，另一个播放淡出。 旋转从开始到完成，旋转的度数。值的范围从 0 到 360º。要想让元件
旋转不止一圈，可以输入更高的值。默认值为 0º。 “ 顺时针” 和“ 逆时针” 对象旋转的方向（顺时针 (CW) 或逆时针
(CCW)）。
打开洋葱皮时，前后状态中的对象将变暗，以便您可以将它们 与当前状态中的对象区分开。
• 补间
在 Fireworks 中，补间是一个手动过程，它混合同一元件的 两个或多个实例，并使用插值属性创建中间的实例。使用补 间可以
创建对象在画布间的复杂移动，以及其动态滤镜在动画的每个 状态下发生更改的对象的复杂移动。
1 选择一个或多个状态： 2 执行下列操作之一： • 从“ 状态” 面板的“ 选项” 菜单中选择“ 属性”。 • 双击状态延迟列。 3 为状态延迟输入一个值。 4 按 Enter 或者在“ 帧” 面板外部单击。
二、状态
• 在播放期间隐藏状态
隐藏状态在播放期间不显示而且也不会导出。 1 执行下列操作之一： • 从“ 状态” 面板的“ 选项” 菜单中选择“ 属性”。 • 双击状态延迟列。 2 取消选择“ 导出时包括”。 3 按 Enter 或者在“ 帧” 面板外部单击。
• 删除所选动画元件中的动画
选择“ 修改”>“ 动画”>“ 删除动画”。 元件变成图形元件，不再有动画属性。如果您以后将元件重新转
换为动画元件，它将保留其先前的动画设置。。
• 从文档库中删除元件
1 在“ 文档库” 面板中选择所需的动画元件。 2 将元件拖到右下角的垃圾桶图标上。
一、动画基础知识
• 改变元件的移动或方向
方向（仅限“ 动画” 对话框）对象移动的方向（从 0 到 360º）。还 可以通过拖动对象的动画手柄来更改“ 移动” 和“ 方向” 的值。
缩放从开始到完成，元件大小的变化百分比。默认值为 100%，但没 有上限。若要将对象从 0% 缩放到 100%，原始对象必须
很小；建议使用矢量对象。 不透明度从开始到完成，淡入或淡出的度数。值的范围从 0 到 100，
一、动画基础知识
• 动画工作流程
1 可以从头开始创建动画元件，也可以通过将现有对象转换为元 件来创建动画元件
2 可以在“ 属性” 检查器或“ 动画” 对话框中编辑动画元件。 可以设置移动的角度和方向、缩放、不透明度（淡入或淡出） 以及旋转的角度和方向
注： 移动的角度和方向选项只能在“ 动画” 对话框中找到。 3 使用“ 状态” 面板中的“ 状态延迟” 控件设置动画速度。
矢量对象或位图对象。 5 在完成对该元件的编辑之后，切换到整页
一、动画基础知识
• 将对象转换为动画元件
1 选择该对象。 2 选择“ 修改”>“ 动画”>“ 选择动画”。 3 通过设置动画属性来编辑元件。 动画控件出现在对象的边框上，而元件的副本添加到库中。
一、动画基础知识
• 编辑动画元件
可以更改各种元件属性，如动画不透明度和旋转。可以使元件显 示为旋转、加速、淡入淡出或者是这些属性的任意组合。
动画” 作为“ 导出文件格式works PNG 文件形式导入 Flash 也是如此。
五、优化动画
设置构成动画的元件和状态后，请优化动画以使其便于加载和顺 利播放
• 通过循环将动画设置为重复
使动画重复之后，循环处理将尽可能减少生成动画所需的状态数。 1 选择“ 窗口”>“ 状态” 以显示“ 状态” 面板。 2 单击面板底部的“GIF 动画循环” 按钮。 3 选择动画第一遍播放后重复播放的次数。 例如，如果选择 4，则动画共播放 5 遍。“ 永久” 不停地重复
黑色小圆圈）拖到新的状态上。 若要将选定对象复制到其它状态，请在按住 Alt 的同时，拖
动这些对象。
二、状态
• 查看状态中的对象
从“ 层” 面板底部的“ 状态” 弹出菜单中选择状态。
三、编辑动画基本概念
• 洋葱皮
洋葱皮是一种技术，用来查看位于所选状态之前和之后状态的 内容。可以很流畅地使对象变为动画，而不用在对象中来回 跳跃。
导入文件后，可以将文件格式设置为 GIF 动画，以便能够从 Fireworks 中导出动 作。