Fireworks课件第一章 Fireworks CS6 概述
【培训必备】第一章 Fireworks基础【连载】
图形图像处理软件：①位图图像处理软件（处理像素）：如PhotoShop②矢量图形处理软件（处理矢量图形）：如Coreldraw、Illustrator而Fireworks专门为了网页设计师设计和开发的，它具有位图处理及矢量制作的许多工具，又可以制作网页进行交互的相关功能，利于网页的输出，因此特别适用于网页制作。
Fireworks能为网站建设作些什么：1、众多的图像效果、处理工具、颜色控制以及图像优化使得Fireworks可以制作出漂亮的“LOGO”（标志）图和其它Web图像。
2、在将照片上传到网站前，可以使用Fireworks对这些图像进行压缩，然后图像的质量损失却很小甚至是无损的。
3、如果有很多的图片要放到网页中，可以考虑使用Fireworks的缩略图功能。
并且可以设置热点，当用鼠标点击方式修改图片时可进行放大。
4、使用Fireworks可以制作小巧而且富有动感的广告条。
5、使用Fireworks图像映射可以为网站做导航。
6、使用Fireworks可以为网页制作普通按钮和用JavaScript实现的滚动按钮。
7、使用Fireworks还可以创建整个WEB页面。
第一章Fireworks基础§1.1 Fireworks操作界面1、启动：“开始”——“Macromedia”——“Macromedia Fireworks”2、开始页快速“打开最近的文件”，“新建”文件……3、工作环境标题栏、菜单栏、工具箱、编辑窗口、面板组、属性面板等组成。
4、退出§1.1.1 标题栏1、作用：显示当前正在编辑的文件名称。
2、 Fireworks默认的源文件扩展名为PNG，还可以生成如JPG、GIF、BMP等格式的图像文件。
3、标题栏的左侧是窗口控制菜单，右侧是三个按钮（最小化、最大化、关闭）。
§1.1.2 菜单栏（十个菜单按钮）§1.1.3 工具栏1、作用：方便用户进行某些操作而设置的。
中文版 Dreamweaver CS6网页设计 第1章 Dreamweaver CS6简介
22
1.5.2 设置外部编辑器
(3) 选择Photoshop程序文件，然后单击 “打开”按钮退出对话框，此时在“编辑器” 列表框中出现所加载的Photoshop程序。 (4) 选择Photoshop程序名称，单击“编辑 器”列表框上方的“设为主要”按钮，将 Photoshop设置为默认的主要编辑器。完成后， 在Photoshop名称后面出现“主要”字样。 (5) 如果要删除“编辑器”列表框中没用的 编辑器，则选择编辑器名称后，单击“编辑 器”列表上方的按钮即可。
Dreamweaver CS6的新增功能。 Dreamweaver CS6的安装、删除和启动。 Dreamweaver CS6的工作界面。 Dreamweaver CS6的一般操作。
本章重点
Dreamweaver CS6常用面板的使用方法。 Dreamweaver CS6的文件操作。
15
1.4.3 文档工具栏
“文档工具栏”中包含一些按钮，使 用这些按钮可以在“代码”视图、 “设计”视图以及“拆分”视图间快 速切换。文档工具栏还包含一些与查 看文档、在本地和远程站点间传输文 档有关的常用命令和选项，如图1-21 所示。
16
1.4.4 文档窗口
“文档窗口”用于显示当前文档，可以选择下 列任一视图。
1.5.1 预览设置
在设计过程中，用户需要随时在浏览器中打开设计的 文档，以便查看其设计效果和及时进行更改和完善。 Dreamweaver CS6提供了在设计过程中预览的功能， 用户只需使用菜单命令或快捷键就可以在浏览器中打 开设计中的文档。 依次选择“编辑”|“首选参数”菜单命令，打开“首选 参数”对话框，在“分类”列表框中选择“在浏览器 中预览”选项，右侧即出现相关界面，如图1-27所示。
Fireworks课件第一章 Fireworks CS6 概述
1.3.5 面板
面板是工作区的重要组成部分，它是浮动的 控件。可以通过面板编辑所选对象的各个方面或 文档的元素。通过面板，还可以处理状态、层、 元件、颜色样本等。工作区中的每个面板都是可 以拖动的，可以按照自定义排列方式对面板进行 分组。
1.3.6 管理窗口和面板
面板组的显示模式有上网本模式、具有面板 名称的图标模式、面板模式以及展开模式。
第1章 FW CS6概述
1.1 关于Adobe Fireworks CS6 1.2 Fireworks CS6 的新功能 1.3 认识Fireworks 的工作环境
1.2 Fireworks CS6 的新功能
· 大大提升了软件的性能和稳定性 ·提取CSS 对象属性 ·创建jQuery Mobile 主题 ·将切片导出为CSS Sprite · 其他增强功能
1.3 认识Fireworks 的工作环境
Fireworks CS6 的工作环境主要由“ 开始”界面、菜单栏、工具栏、“工具” 面板、文件窗口、“属性”检查器和其他 一些浮动面板组成。
在工作区中，可以使用面板、工具栏 以及窗口等创建和处理文档和文件。
1.3.1 开始页
1.3.2 工具栏
“工具栏”位于菜单栏的下方和活动窗口上 方的位置，单击“窗口”菜单下的“工具栏”→“主 要”命令，可显示或隐藏工具栏。
大大提升了软件的性能和稳定性大大提升了软件的性能和稳定性提取提取csscss对象属性对象属性题主题将切片导出为将切片导出为cssspritecsssprite其他增强功能其他增强功能fireworkscs6的工作环境主要由开始界面菜单栏工具栏工具面板文件窗口属性检查器和其他一些浮动面板组成
1.3.3 “ 工具”面板
“工具”面板位于Fireworks 工作区的左侧， 按不同的功能可分为6 个类别：选择、位图、矢 量、Web、颜色和视图，每一个功能块又按不同 的用途再次分成若干个工具按钮。
Fireworks概论剖析
2018年10月12日星期五
制作人：齐海霞 16
椭圆工具、矩形工具和多边形工具的使用及 属性
矩形”、“椭圆”及“多边形”工具分别用于 绘制矩形、椭圆及多边形，如果按住Shift键单 击并拖动，则可绘制正方形和圆形。按住Alt键 单击并拖动可绘制中心对称图形。按住Shift +Alt组合键单击并拖动，可从中心点绘制正方 形和圆形。 对于多边形工具而言，可利用属性面板设置绘 图开头边数，以及绘制星形时的夹角。
1、菜单栏
Fireworks 的“菜单栏”几乎集中了它的全部操作命令， 利用这些命令可以编辑图形图像，制作简单动画以及设 置操作界面等。
2、工具栏
Fireworks 的工具栏分为“主要”工具栏和“修改”工 具栏，如下图所示。其中，“主要”工具栏用于辅助用 户执行一些常用的操作，如文档的打开、导入与导出， 文档的保存与打印，文档的剪切、复制和粘贴，操作的 撤销与恢复等。“修改”工具栏则用于组合、合并、对 齐、翻转和旋转对象以及调整对象前后顺序等。
制作人：齐海霞 22
2018年10月12日星期五
制作人：齐海霞 5
Fireworks的安装(略) 矢量图与位图(像素)图的概念
位图图像使用像素来描述图形，它的特点是画面细腻、数据量大和放大后 图像的质量会下降。在编辑位图图像时，修改的是像素，而不是直线和曲 线。位图图像与分辨率有关，因为描述图形的数据是固定在特定尺寸的风 格上的。 矢量图形数据量较小，它使用直线和曲线描述图形。在编辑该类图像时， 可以修改描述图像的线条的属性而不影响其品质。矢量图形的显示与分辨 率无关，它可以显示在任何分辨率的输出设备上。不会因放大或缩小而影 响图形的质量，一般的标志、图案等都是以矢量图形的格式存在，一般 为GIF、CDR等。 Fireworks中，利用系统提供的工具和命令既可编辑位图对象，也可编辑 矢量对象。因此，Fireworks中的PNG文档可同时保存这两类对象。但是 由于PNG文档无法直接用于网页中，必须首先将其导出为位图格式的GIF 或JPG格式的图像文件。
第1章FlashCS6快速入门ppt课件全
Flash CS6提供了多样化的新建文件方法，不仅可以方便用户使用，而且 可以有效提高工作效率。本次实例的目的是让大家掌握新建和保存Flash文 件的方法。
实例重点
掌握新建空白Flash文档的方法 掌握多种保存Flash文档的方法
掌握新建Flash模板的方法
掌握将Flash文档保存为模板的方法
实例2：启动与退出Flash CS6
实例目的
完成了Flash CS6的安装，接下来就可以启动Flash CS6，本次实例的 目的是让大家掌握Flash CS6启动与退出的方法。
实例重点
掌握启动Flash CS6的方法 掌握退出Flash CS6的方法
中，使用模板创建新的影片文件，就是根据原有的架构对其 中可以编辑的元件进行相应的修改、更换或调整，从而能够方便、快 速地制作出精彩的影片。本次实例的目的是让大家掌握使用模板快速 创建Flash动画的方法。
实例重点
掌握使用Flash模板的方法
掌握测试Flash动画的方法
掌握替换Flash位图素材的方法
实例4：打开和关闭Flash文件
实例目的
本次实例的目的是让大家掌握打开和关闭Flash文件的方法，这些都是 Flash文档的基础操作。
实例重点
掌握打开Flash文档的方法 掌握打开Flash文档的技巧 掌握关闭单个和多个Flash文档的方法
实例5：模板——快速创建Flash动 画
实例目的
fireworks讲义
Fireworks及综合课讲义第一讲基本操作 (1)第一节：基本概念 (1)第二节实例演示 (2)第二讲切片，行为，按钮 (4)第一节切片，切片行为 (4)第三讲综合课 (11)第一节：站点的管理与上传 (11)第二节：知识点复习 (11)第一讲基本操作第一节：基本概念一、 fireworks概述Fireworks是一个专业化的Web图象设计程序。
它是第一个专门针对web而开发的图象设计软件，使用它，既可以编辑web图象，又可以编辑web动画，它的一个很大优势就在于它将位图处理和矢量处理功能合二为一。
换句话说，它既是一个优秀的位图图象处理程序，又是一个矢量图象处理程序。
这使得它的应用更加广泛。
与photo shop相比，安装文件小，只有25M，携带方便。
二、 fireworks功能1、设计制作并美化页面2、制作动态效果3、优化网页图片三、 工作环境在介绍了fireworks的功能后，我们来看一个它的工作环境。
1、工具栏：工具栏位于工作界面的左侧，其中包括了6组工具，分别为：选择，位图，矢量，网页、颜色和视图工具，其中每一组工具中，又包含了几种不同的工具。
2、属性面板：位于工作界面的底部，在我们编辑不同的对象时，属性面板的内容会随着编辑对象的不同而发生变化。
例如：当我们在工具栏中选取了线条工具时，属性面板上就会显示线条工具的各项参数，方便我们进行设定。
当我们选文字工具时，属性面板显示的是文字的各项参数。
文字属性面板图13、浮动面板；fireworks中包含了大量的浮动面板，每个浮动面板都有其独特的作用。
Optimize优化面板，layer层面板，assets资源面板，历史记录面板，frame帧面板等。
四、 文档操作1、新建：宽，高，分辨率，画布颜色2、更改画布大小颜色和图像：选中箭头工具，在属性面板上可以设置。
3、保存：产生PNG格式的源文件。
导出格式：默认为gif格式。
Gif格式图象最多包含256色。
FireworksCS6案例教程第二版课程设计
FireworksCS6案例教程第二版课程设计Fireworks CS6是一款常用的网页设计工具，它集合了图像处理、动画制作、网页布局和UI设计等多种功能。
本篇课程设计旨在通过练习案例来教授Fireworks CS6的使用方法，让学生了解和掌握其基本功能和技巧。
课程背景学生目标：1.掌握Fireworks CS6的常用工具和界面；2.熟悉图像处理的基础方法，如裁剪、缩放、修饰等；3.学会利用Fireworks CS6进行二维图形绘制和编辑；4.学习使用Fireworks CS6制作网页布局和UI设计；5.了解和应用Fireworks CS6的动画制作功能。
教学内容及方法教学内容第一章常用工具和界面1.Fireworks CS6界面介绍2.工具栏功能对应第二章图像处理基础方法1.选区工具使用方法2.图像修饰功能介绍3.图像压缩方法与技巧第三章二维图形绘制和编辑1.矩形、圆形、箭头等基本形状绘制方法2.贝塞尔曲线的绘制和编辑技巧3.复制、绕转、合并等图形编辑功能的使用第四章网页布局和UI设计1.网页布局的制作方法2.文字、按钮、联系表格、图片轮播、菜单栏等元素的设计方法第五章动画制作1.基本动画效果的实现方法2.帧动画的制作方法3.动画效果的优化与导出教学方法1.理论讲解结合案例实践；2.给学生独立配置软件并指导其熟悉其操作方法；3.引导学生自主解决问题，鼓励学生提出解决问题的思路；教学评价与考核方式•实验报告：50%•阶段考试：30%•作业：20%教学资源1.教材：《FireworksCS6案例教程（第二版）》2.实验室配备：电脑、Fireworks CS6安装包教师建议1.本课程可以结合网页设计入门、UI设计、平面设计等相关课程进行教学；2.在教学过程中，可以鼓励学生利用互联网资源进行案例分析，或结合实际项目进行综合设计实践；3.根据学生的学习进度和情况，适当进行授课内容和方法的调整。
Fireworks全套课件
用空间至少60 MB 4. 只读光驱CD-ROM 5. 800× 600像素分辨率，256色或更高的显示模式 6. Adobe Type Manager 4或更高版本，以便处理Type1字体。
《网页设计与制作》
——《Fireworks》
主要内容
• Fireworks简介 • 用Fireworks切割图形 • 用Firework制作有动态效果的切图 • 用Fireworks制作动画 • 用Fireworks的绘图工具的使用 • 文字工具及文字特效
一、Fireworks简介
Fireworks是一个创建、编辑和优化网页图形的多功能应用程序，可以创 建和编辑位图及矢量图形，设计网页效果、如变换图像和弹出菜单、修剪 和优化图像，以压缩其大小 特点： 活效果：在对象的效果改变后，仍然保存着路径的可编辑性 自动应用纹理和填充效果 完整的文本控制组件
一、合并图像形成动画 文件—打开，在打开图片对话框中，勾选“以动画打开”
第四节、用Fireworks制作动画
二、使用元件生成动画 • 创建一个动画元件：编辑—插入—新建元件，类型选择为“动画” • 编辑元件，在元件中插入文字或图片，完成后，使用“属性检查器输入动
画元件的设置，如角度、方向、缩放等 • 查看“帧”面板，通过调整“帧延时”来设置速度 • 将文档优化为GIF动画：窗口—优化，设置参数即可 • 也可以到处为SWF文件
谢谢同学们！
第四节、用Fireworks制作动画
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
1.3 认识Fireworks 的工作环境
Fireworks CS6 的工作环境主要由“ 开始”界面、菜单栏、工具栏、“工具” 面板、文件窗口、“属性”检查器和其他 一些浮动面板组成。
在工作区中，可文件。
1.3.1 开始页
1.3.2 工具栏
“工具栏”位于菜单栏的下方和活动窗口上 方的位置，单击“窗口”菜单下的“工具栏”→“主 要”命令，可显示或隐藏工具栏。
1.3.3 “ 工具”面板
“工具”面板位于Fireworks 工作区的左侧， 按不同的功能可分为6 个类别：选择、位图、矢 量、Web、颜色和视图，每一个功能块又按不同 的用途再次分成若干个工具按钮。
1.3.3 “ 工具”面板
1.3.4 “ 属性”检查器
“属性”检查器在Fireworks 中是非常重要的 一个面板，它是一个上下文关联的面板，可以通 过“属性”检查器显示当前选区的属性、当前工具 选项以及文档属性。
第1章 FW CS6概述
1.1 关于Adobe Fireworks CS6 1.2 Fireworks CS6 的新功能 1.3 认识Fireworks 的工作环境
1.2 Fireworks CS6 的新功能
· 大大提升了软件的性能和稳定性 ·提取CSS 对象属性 ·创建jQuery Mobile 主题 ·将切片导出为CSS Sprite · 其他增强功能
1.3.5 面板
面板是工作区的重要组成部分，它是浮动的 控件。可以通过面板编辑所选对象的各个方面或 文档的元素。通过面板，还可以处理状态、层、 元件、颜色样本等。工作区中的每个面板都是可 以拖动的，可以按照自定义排列方式对面板进行 分组。
1.3.6 管理窗口和面板
面板组的显示模式有上网本模式、具有面板 名称的图标模式、面板模式以及展开模式。