使用 Fireworks 8 中新的图像编辑面板

为什么在 Fireworks 8 中增加了“图像编辑”面板？简单地说，因为它能节省时间！只要能够节省用户的时间，让用户不必在众多菜单中进行搜索的功能，都会受到用户的欢迎。

随着包含可编辑区域的、数据驱动的外包型网站的普及，组织中（尤其在学术领域）的每个人都必须能够编辑内容和上传针对 Web 进行优化过的图像。如果在某个网站或 Intranet 站点的网页上给您分配了一块可编辑区域，由您负责不断更新，那么您将会喜欢新的“图像编辑”面板所提供的省时功能。

管理所有数码图像

如果您有一台数码相机，您可能拍摄了许多数码图像。只需将这些数码图像从相机下载到计算机桌面的一个文件夹（其名称可能为“相机”）中，然后在 Fireworks 8 中打开并进一步处理它们。此外，扫描照片仍然是收集数码图像的一种好方法。假如您像我们中的大多数人一样有成堆的照片，则可以将它们扫描到另一个桌面文件夹，例如名为“扫描的图像”的文件夹中。

如果您的计算机上安装有相机或扫描仪软件，则可以选择“文件”>“扫描”>“Twain 选择”，然后选择相机或扫描仪，将文件直接导入到 Fireworks 8 中。（在 Mac 上，选择“文件”>“获取”>“Twain 选择”或“文件”>“获取”>“选择相机”。）虽然屏幕分辨率最低可以为 72（有时为 96）DPI，但是为了以后能够编辑和增强图像以便在 Web 上发布，最好还是在更高分辨率下保存所有图像，并为以后的高质量打印保留一个副本。

我更喜欢将所有原始图像的副本以 300 DPI TIFF 文件的形式另存到计算机桌面的一个文件夹中。项目结束后，我将所有的文件都移到一张 CD 上或其它外部存储介质上进行长期保存。这样，您以后就只需要决定是要使用整张图像还是图像的一部分，或是要强化图像中的哪些部分，以及希望最终图像有多大等问题了。扫描和缩放（改变尺寸）通常会引起图像模糊，必须对其进行锐化处理后才能看得清楚。这正是 Fireworks 8 中的“图像编辑”面板所要解决的问题。

利用图像编辑面板增强数码图像

新的“图像编辑”面板（见图 1）上有您制作高质量图像以用于 Web 所需的一切功能。

此面板将大多数常用的图像编辑工具集中放置在一个容易查找的位置。在本文中，将向您讲解新“图像编辑”面板的各种功能和工具，并举例说明如何才能充分利用这些功能和工具。

下面将指导您逐步完成图像的准备以便将其张贴在 Ucompass Educator（见图 2）的课程通知窗口中。Educator 是功能强大的、经过 Flash 增强的课程管理系统 CMS 的一个示例，全体教员可利用它来准备和上传课程资料，包括图像、图表、数学问题解答等，从而将在线内容添加到他们所有的校内和远程教学课程中。此外，我们的 Intranet（由 ColdFusion 提供支持的 Judson Academic Intranet http://intranet.judson.edu，采用了 CommToolz 技术）要求我们组织中的几乎每个人都上传图像来自定义站点的某些部分。所有教职员工都必须能够快速跳转到 Fireworks 8 中，找到并使用合适的工具，上传经过优化的图像，然后继续随后的工作。

图 2. Ucompass Educator，一个功能强大的、经过 Flash 增强的课程管理系统

作为图形设计课程的教师，我可能想给学生举几个实际问题的例子。为此，我可能先要向他们展示处理前后的图片，然后为他们提供一个包含提出问题并解决问题的案例研究（见图 3）。

初看上去，这似乎是不可能的。您知道，单纯地放大数码相片会导致图像品质下降。但是再猜一猜！如果是在 300 DPI 分辨率下扫描的图像，您将可以裁切出图像中您想要的那部分，并利用 Fireworks 8 图像编辑面板中的工具来显著改善其效果。

针对案例问题 1 的快速简单解决方案

下面是要执行的主要步骤：

1. 使用“裁切”工具 裁切要保留的图像部分。
2. 选择“缩放”工具 并向内拖动图像的一角，直到大小符合需要。
3. 在图像外单击，然后选择“属性”面板中的“符合画布”。
4. 单击“滤镜”>“钝化蒙版”。
5. 单击“调整颜色”>“自动色阶”。
6. 如果需要，可使用“模糊” 工具模糊要弱化的图像区域，并使用“锐化”工具 强化其它区域。
7. 使用所选的优化设置将图像另存为 JPEG（见图 4）。

该方法在大多数情况下都能产生可接受的结果，而且得到的图像可能正是您想要的。

但是，如果您更愿意分别控制所有滤镜和工具，Fireworks 8 也提供了全套选项，我将在您逐步完成此解决方案中的步骤时讨论它们：

1. 首先，将 image_editing_samples.zip 文件的内容解压缩到计算机桌面的文件夹中。
2. 打开 Fireworks 8，并打开范例中的 butterfly_1.tif（见图 5）。
3. 如果您像我一样通过是通过反复尝试进行学习，您可通过选择“窗口”>“工具栏”>“主工具栏”，来显示包含便捷的“撤消”和“重做”按钮的主工具栏。（仅适用于 Windows。）

在本文后面的部分中，将指导您完成上述主要步骤。

在 Fireworks 中的画布上隔离对象时，我发现利用 Fireworks 提供的一些可视化向导很有帮助。“图像编辑”面板将这些可视化助理打包放在一个位置以便于访问。如果“图像编辑”面板尚未打开，请选择“窗口”> “图像编辑”将其打开。然后单击面板中的“视图选项”（见图 6）。

下面是对每个视图选项的简短说明：

• 显示/隐藏标尺提供标尺；您可以将标尺的单位设置为英寸或厘米，并且可从标尺拖动辅助线
• 显示/隐藏网格以重复的间隔显示网格线
• 对齐/不对齐网格使对象与网格线对齐
• 编辑网格提供更改网格线的间隔、颜色或选择“对齐网格”的选项
• 显示/隐藏辅助线打开或关闭辅助线
• 对齐/不对齐辅助线使对象与辅助线对齐
• 锁定/解除锁定辅助线锁定或解除锁定辅助线
• 编辑辅助线提供更改辅助线的颜色或其它设置的选项

辅助线经常用于对齐画布上的对象，并帮助提供各对象在画布上相对位置的可视化队列。但是，如果您不熟悉图像编辑，辅助线还可以帮助您标出要裁切的图像区域。在接下来的步骤中，您将使用辅助线标出要保留的图像部分：

1. 在“视图选项”中，单击“显示/隐藏标尺”以显示标尺。
2. 从左标尺拖动，在蝴蝶的右侧创建一条垂直辅助线，然后在蝴蝶的左侧再创建一条垂直辅助线（见图 7）。创建辅助线时，“显示辅助线”命令会自动打开。
3. 从上标尺拖动，在蝴蝶的下方创建一条辅助线，然后在要裁切的蝴蝶图像部分的上方再创建一条辅助线。
4. 将光标放在辅助线上时，光标会发生变化，表明您可以调整辅助线的位置。
5. 调整辅助线的位置，直到您满意为止。

打印或导出图像时，辅助线不会显示在图像上。在下一部分中，将演示如何裁切图像。

现在，您已放置好辅助线，并精确标识出要裁切的区域，那么可以着手进行工作了。注意“图像编辑”面板顶部的工具（见图 8）。

下面是对各个选项的作用的说明：

• 红眼 校正使用闪光灯所拍摄的快照中常见的红眼
• 裁切 允许修剪图像边缘
• 缩放 改变图像的大小（还可用于旋转所选对象）
• 模糊 作用类似于“模糊”滤镜，只是您可以在图像上拖动该工具从而只模糊图像的一部分（我将在本文后面的部分解释滤镜）
• 锐化 作用类似于“锐化”滤镜，只是您可以在图像上拖动该工具从而只锐化图像的一部分
• 减淡 在图像上拖动它时将加亮它下面的区域
• 加深 在图像上拖动它时将加深它下面的区域

要使用这些工具，只需选择它们，并将它们拖动到要修改的图像部分即可。在本例中，您将使用“裁切”工具：

1. 在“图像编辑”面板中选择“裁切”工具。
2. 单击该工具，然后将其拖过图像中的蝴蝶（见图 9）。

利用裁切手柄重新定位裁切区域，以使裁切轮廓与在上一部分中创建的辅助线吻合。重新定位裁切区域时，您会发现裁切区域边框与辅助线对齐。

3. 按 Enter (Return) 键执行裁切。注意，图像现在按 100% 比例显示（见图 10）。单击画布右下角的百分比并从菜单中选择 100%，可以在 100% 比例下显示图像。也可以通过选择“查看”>“缩放比率”来选择比率。

熟悉“裁切”工具的使用后，您可能发现在裁切图像之前可以不使用辅助线。在下一部分中，将演示如何缩放图像。

经常会碰到这样的情况：裁切的图像大小不合适，或者需要以某种方式改变图像。“图像编辑”面板的“变形工具”部分中的功能可帮助您完成这些操作。在接下来的步骤中，您将缩放裁切过的蝴蝶图像。

在“图像编辑”面板中，单击“变形工具”部分。注意出现的菜单中的所有工具（见图 11）：

• 缩放放大或缩小对象；使用角手柄可保持缩放对象的比例不变
• 倾斜通过以相反的方向移动控制手柄来扭曲对象
• 扭曲通过允许分别移动每个角手柄来修改对象的比例
• 任意旋转允许沿顺时针或逆时针方向拖动来旋转图像

下面是对图像使用“缩放”工具的具体方法：

1. 选择“缩放”工具。
2. 将指针放在图像右下角，直到光标变成一个斜箭头。
3. 按住 Shift 键，单击并向左上方拖动该角（见图 12）。按住 Shift 键可保持图像比例不变。您不应该使图像在水平方向上的缩放比例比在垂直方向上的缩放比例多，否则会使图像变形。在缩放图像的过程中，可查看标尺上的指示器来了解最终的图像大小。

使画布适合裁切图像的大小

缩放图像后，您会发现画布上多出来一些不需要的空白区域。采用以下步骤可删除这些空白区域：

1. 在画布上的图像外单击（见图 13）。
2. 在属性面板中选择“符合画布”。画布中多余的区域将被消除，以便只显示图像而不显示空白（见图 14）。

在下一部分中，将演示如何使用“图像编辑”面板中的“变形”命令。

“图像编辑”面板的“变形命令”部分提供了用于旋转和翻转图像的各种工具（见图 15）。

在“图像编辑”面板中，单击“变形命令”部分。注意出现的菜单中的所有工具：

• 数值变形使您可以使用精确值缩放、旋转图像或调整图像的大小
• 旋转 180 度使图像倒置
• 顺时针旋转 90 度沿顺时针方向将图像旋转 90 度
• 逆时针旋转 90 度沿逆时针方向将图像旋转 90 度
• 水平翻转沿水平轴翻转图像
• 垂直翻转沿垂直轴翻转图像
• 删除变形使您能重新开始工作

也许您确实很喜欢自己的图像，但是与您最终要将它放入的网页上的其它元素相比，它的方向不正确。请执行下列步骤来水平翻转图像：

1. 选择画布上的图像。
2. 从“图像编辑”面板的“变形命令”部分选择“水平翻转”。蝴蝶翻转为面向相反的方向（见图 16）。

在下一部分中，我们将回顾调整图像颜色的方法。

您的初始图像经常会因曝光和拍摄时的光线条件等因素导致图像颜色太暗或太亮，从而需要进行一些调整。“图像编辑”面板的“调整颜色”部分提供了一整套工具，从最简单的自动修复到最高级的工具一应俱全（见图 17）。

下面是对“图像编辑”面板的“调整颜色”部分中各个选项的简短说明：

• 自动色阶应用可平衡图像内色调范围的预设调整
• 亮度/对比度可用来提高或降低图像明暗区域之间的亮度和对比度
• 曲线是一种非常高级的工具，可用来更改色调图表
• 色相/饱和度可用来给图像着色或改变图像内的颜色值
• 反转可反转图像（如果是从负片开始工作时非常有用）
• 色阶是另一种高级工具，它允许您移动黑色、白色和中点值
• 转换为灰色调可从它的名字看出它的作用
• 转换为棕褐色调同样可从它的名字看出它的作用

调整图像色调范围最简单的方法就是应用“自动色阶”。为此，请在画布上选择图像，然后在“图像编辑”面板的“调整颜色”部分中选择“调整颜色”>“自动色阶”，来查看图像的即时改进效果（见图 18）。大多数情况下，这正是您要对图像所做的修复。

如果您决定对颜色调整施加更多控制，可以选择“亮度/对比度”，这将打开一个对话框，它允许您通过拖动滑块条来分别调整这些值（见图 19）。

在下一部分中，将演示如何对图像应用滤镜。

滤镜是一些可应用于图像的效果。使用“图像编辑”面板应用了这些滤镜后，就只能通过“撤消”命令删除它们。因此，在保存文件前，应确信自己确实喜欢这种滤镜效果，因为以后您将无法再打开文件并删除滤镜。

“属性”检查器的“动态滤镜”区域中也包含有同样的滤镜。如果考虑到可能要在关闭图像后删除某个滤镜，应通过“属性”检查器来应用该滤镜。不过，将可用滤镜与“图像编辑”面板中的其它图像编辑工具放在同一个位置会很方便（见图 20）。大多数情况下，在应用某个滤镜后，您就能立即确定是否需要保留它。

下面是对各个滤镜的作用的简短说明：

• 锐化、进一步锐化、模糊和进一步模糊工具可通过类似方式使用；只需单击滤镜下拉列表中的名称即可应用它们
• 添加杂点向图像中添加粒状纹理
• 转换为 Alpha 将图像转换为灰色调版本，从而允许创建透明效果
• 查找边缘创建使颜色之间具有边缘的线条

“钝化蒙版”是改善扫描图像最快捷的方法之一。它在锐化图像方面与“锐化”命令类似。与“锐化”滤镜不同的是，“钝化蒙版”允许您控制图像的锐化量。Fireworks 通过分析组成图像中对象边缘的明暗像素来锐化图像。

按照下列步骤来应用“钝化蒙版”滤镜：

1. 在画布上选择蝴蝶。
2. 从“滤镜”下拉菜单中选择“钝化蒙版”。出现“钝化蒙版”对话框。
3. 调整“锐化量”、“像素半径”和“阈值”滑块（见图 21）。“锐化量”滑块控制在组成图像中对象边缘的明暗像素之间应用多少对比度。“像素半径”滑块控制在决定是否调整对比度时要考虑到的像素量。“阈值”滑块控制要使锐化操作能够影响到对象的边缘，对象边缘周围明暗像素的差异必须有多大。
4. 在打开和关闭状态之间切换“预览”选项，看看这些设置是否可以改善图像效果。
5. 得到所需的设置后，单击“确定”。
6. 如果对产生的效果不满意，则单击“撤消”按钮来删除它。

熟悉“钝化蒙版”滤镜中的滑块设置需要一些时间。如果没有得到想要的效果，可尝试“锐化”滤镜。

注意：“属性”检查器的“动态滤镜”部分中还包含其它几个滤镜，但是编辑图像时最常用的滤镜已包括在“图像编辑”面板中。

在下一部分中，我们将回顾“图像编辑”面板中的“模糊”、“加深”和“减淡”工具。

“模糊”、“减淡”和“加深”工具（见图 22）的作用类似于前面讨论的滤镜，只是滤镜要应用于整个图像，而这些工具的效果可以只应用于它们被拖过的区域。我已在本文的裁切图像部分中简要描述了这些工具。请参考这一部分，复习这些工具的用途。

请在自己的工作中巧妙地使用这些工具。需要花些时间来熟悉这些工具；它们很容易使事情做过了头。

蝴蝶图片实际上可能并不需要应用上述任意一种工具，对该图像使用它们只是为了让您对它们的用途有一定了解：

1. 选择“视图”>“缩放比率”>“300%”来放大图像，以便有更多空间来处理细节。
2. 选择“模糊”工具 ，然后在您希望模糊的图像区域上拖动它。在本例中，请在蝴蝶后面黑色窗框的亮边缘上拖动它。这将删除亮边缘上的细节以免转移对蝴蝶的注意力。
3. 选择“减淡”工具 ，然后在希望变亮的图像部分上拖动它。在本例中，请在蝴蝶翅膀的橙色部分拖动以使它变亮。拖动次数越多则越亮。动作需尽量细致一些。如果太亮，则选择“编辑”>“撤消”。
4. 选择“加深”工具 ，然后在希望变暗的图像部分上拖动它。在本例中，请在蝴蝶下面的黄色花朵上拖动。
5. 选择“视图”>“缩放比率”>“100%”，使图像重新以 100% 比率显示。

在下一部分中，将指导您如何导出图像以便为 Web 发布进行优化。

现在，您已裁切和改进了图像，接下来需要选择一种文件格式来保存图像，以便为 Web 发布进行优化。虽然导出操作不是在“图像编辑”面板中进行的，但由于它是创建 Web 优化图像的基本步骤，因此将在这里进行说明。

用户下载大文件需要花很长时间。在我任教的 Judson 大学，许多远程教育的学生都使用很慢的拨号连接，因此，就我们而言，使用尽可能小而品质仍可接受的文件非常重要。Fireworks 8 提供了多种格式来保存文件。虽然 GIF 图像对于徽标或线状图很有用，但是对于通常由多种颜色组成的照片，最好另存为 JPEG。

有几种方法可将图像保存为 JPEG 格式。可以选择“文件”>“导出”、“文件”>“保存”或“文件”>“另存为”将文件保存到桌面的一个文件夹中：

1. 单击“文件”>“另存为”。
2. 导航到要用来存储最终图像的文件夹。我通常将其命名为“final”。
3. 输入文件的名称，然后在“保存类型”框中选择 JPEG。
4. 单击“选项”按钮以打开“图像预览”对话框。也可以通过选择“文件”>“图像预览”而不是“文件”>“另存为”来访问该对话框。
5. 在“图像预览”对话框中选择所需的品质（见图 23）。品质越高，文件越大。对于所选的每种品质设置，都可以看到最终文件大小和图像预览。您只需要决定哪种设置能兼顾到品质与文件大小。注意，即使在最后的这一阶段，您仍然可以选择裁切或编辑图像。

   实际上，在该过程的任何阶段，您都可以返回去修改前面应用的设置。我鼓励您尝试“图像预览”对话框中的各种选项。它的功能实际上相当强大。

图 23. 将文件另存为经过优化的 JPEG

6. 完成选择后，单击“保存”。工作就完成了（见图 24）。

现在您就可以将图像上传到 Web 上了。案例问题 1 的教授可能要求他的学生识别蝴蝶类型（Gulf Fritillary 蝶或 Agraulis vanillae 蝶—在我生活的阿拉巴马州很常见），或吸引蝴蝶的植物类型（马缨丹属类，也很常见）。

下一步该做什么

学习如何使用 Fireworks 8 中“图像编辑”面板的最好方法之一，就是从要在 Web 上使用的图像入手，然后尝试使用各种工具来处理该图像。阅读 Macromedia 开发人员中心中的 Converting Images to Successful Web Graphics（将图像转换为成功的 Web 图形）和 iFelix 上的 How Do I Prepare a Digital Image Using Fireworks MX for Use on the Web?（如何使用 Fireworks MX 准备数码图像以便在 Web 上使用？）文章，可了解有关如何准备图像以便在 Web 上使用的更多内容。