使用 Photoshop 和 Animate

可以结合使用 Adobe® Photoshop® 和 Adobe® Animate® 以创建具有视觉吸引力的基于 Web 的应用程序、动画或交互式消息元素。使用 Photoshop 可以创建静止的图像和插图,您因此能够获得更好的创意发挥能力。Animate 允许您将这些静止的图像组合到一起,并将它们用到交互式 Internet 内容中。

与 Animate 中的工具相比,Photoshop 的绘画和选取工具为您提供了更高程度的创造性控制。 如果您需要创建复杂的视觉图像或修饰照片以便在互动演示文稿中使用,则请使用 Photoshop 来创建插图,然后将完成的图像导入 Animate 中。

将静止图像导入 Animate 中

Animate 可以导入多种格式的静止图像,但是将静止图像从 Photoshop 导入 Animate 时通常使用原生 Photoshop PSD 格式。

导入 PSD 文件时,Animate 可以保留许多在 Photoshop 中应用的属性,并提供保持图像的视觉保真度以及进一步修改图像的选项。 将 PSD 文件导入 Animate 中时,可以选择是将每个 Photoshop 图层表示为 Animate 图层,还是表示为一个个的关键帧。

(仅限 CS6 和更早版本)交换 QuickTime 影片

可以在 Photoshop 和 Animate 之间交换 QuickTime 视频文件。例如,可以直接从 Photoshop 呈现 QuickTime 影片,然后将其导入 Animate,转换为可以在 Flash Player 中播放的 FLV(Animate 视频)文件。

当您使用 Photoshop 修改视频镜头时,可以在帧上进行无损涂色。 保存包含视频图层的 Photoshop 文件时,所保存的是对视频图层所做的编辑,而不是对镜头本身所做的编辑。

注意:

从 Photoshop 向 Animate 导入 QuickTime 视频文件时,请使用“导入视频”对话框(“文件”>“导入视频”)。使用 Photoshop PSD 导入功能来导入视频时只导入视频文件的第一帧。

还可以将 Animate 文档导出为 QuickTime 视频,然后将其导入 Photoshop,在那里您可以对视频帧进行无损涂色。例如,可以在 Animate 中创建一个动画序列,再将该 Animate 文档导出为 QuickTime 视频,然后将该视频导入 Photoshop。

颜色

Animate 在内部使用 RGB(红、绿、蓝)或 HSB(色相、饱和度、亮度)色彩空间中的颜色。尽管 Animate 可以将 CMYK 图像转换为 RGB,但是您应在 RGB 空间中创建 Photoshop 插图。 在将 CMYK 插图从 Photoshop 导入 Animate 之前,需先在 Photoshop 中将图像转换为 RGB。

关于导入 Photoshop PSD 文件

Animate 允许您导入 Photoshop PSD 文件,并保留大部分插图数据。PSD 导入器还可让您控制将 Photoshop 插图导入 Animate 的方式,从而让您既可指定如何导入 PSD 文件中的特定对象,也可指定将 PSD 文件转换为 Animate 影片剪辑。

Animate PSD 导入器提供了下列主要功能:

  • 导入 Animate 中的 PSD 文件可以保持它们在 Photoshop 中的颜色保真度。

  • 保留 Animate 和 Photoshop 共有的混合模式的可编辑性。

  • 将 PSD 文件中的智能对象栅格化,并将其作为位图导入 Animate 中,这样可保留对象透明度。

  • 将 PSD 文件图层转换为单个 Animate 图层或关键帧,或将 PSD 文件作为单个位图图像导入,在这种情况下,Animate 会将该文件拼合(栅格化)。

  • 从 Photoshop 中拖放到 Animate 会调用 PSD 文件导入器,可选择如何导入 Photoshop 插图。

视频和教程

下列视频和教程演示了如何使用 Photoshop 和 Animate。 

Animate 与 Photoshop 之间的兼容性

某些可视属性不能精确导入,或在导入之后,无法在 Animate 创作环境中进一步编辑。PSD 导入器为您提供了多个选项来导入和放置插图以最好地保持其可视外观和可编辑性。 但是,某些可视属性无法保留。使用以下准则可以改善导入 Animate 中的 PSD 文件的外观:

  • Animate 仅支持 RGB 颜色空间,不支持 CMYK 颜色空间(常用于印刷)。Animate 可以将 CMYK 图像转换为 RGB,但如果在 Photoshop 中将 CMYK 颜色转换为 RGB,将更好地保留颜色。

  • Animate 可以导入下列 Photoshop 混合模式并保持其可编辑性:“正常”、“变暗”、“色彩增殖”、“变亮”、“滤色”、“强光”、“差异”和“叠加”。

    如果使用 Animate 不支持的混合模式,则可以将图层删格化以保持其可视外观,也可以从图层中删除该混合模式。

  • Animate 无法将 Photoshop 智能对象作为可编辑对象导入。 为了保留智能对象的可视属性,这些对象将进行栅格化并作为位图导入 Animate 中。

  • Animate 只能导入 Photoshop 视频图层的第一帧。

  • 图像和填充图层在导入 Animate 时总是会被栅格化。

  • 在将 Photoshop 中的 PNG 对象导入 Animate 中时,这些对象会转换为 JPG 文件。生成的 JPG 文件中会保留原始 PNG 中的透明度。

  • 相对于 Animate,Photoshop 可以更好地缩放位图图像。如果您知道自己要缩放从 Photoshop 导入到 Animate 中的位图,请先在 Photoshop 中对该位图进行缩放,然后再将其导入 Animate 中。

  • 将包含透明区域的对象作为拼合的位图导入时,对象透明部分后面的图层上的所有对象都通过透明区域可见(假定也导入包含透明区域的对象之后的对象)。 若要防止出现这种情况,请只将透明对象作为拼合的位图导入。

    若要保持透明度导入多个图层,同时使透明区域后面图层上的对象都不可见,请使用“具有可编辑图层样式的位图图像”选项导入 PSD 文件。 这样,可将导入的对象封装为影片剪辑,并使用影片剪辑的透明度。 如果需要在 Animate 中使不同图层动起来,这种方法尤其有用。

导入 Photoshop PSD 文件

Photoshop 格式 (PSD) 是默认的 Photoshop 文件格式。 Animate 可以直接导入 PSD 文件并保留许多 Photoshop 功能,从而可在 Animate 中保持 PSD 文件的图像质量和可编辑性。 导入 PSD 文件时还可以对其进行拼合,从而创建一个单独的位图图像文件。该文件将保留图像的视觉效果,但会去掉 PSD 文件格式固有的分层图层信息。

有关使用 Photoshop 和 Animate 设计网站的视频教程,请参阅 www.adobe.com/go/vid0201_cn

  1. 选择“文件”>“导入到舞台”或“导入到库”。
  2. 定位到要导入的 Adobe Photoshop PSD 文件,选择该文件,然后单击“确定”。
  3. (可选)在“PSD 导入”对话框中,选择图层、组和各个对象,然后选择如何导入每个项目。

  4. 为 PSD 文件选择各种高级 导入选项和发布设置。

    PSD 高级选项:舞台

    PSD 高级选项:库

  5. “导入”屏幕中,选择以下选项:

    • 选择 Photoshop 图层复合:允许您选择希望用来导入 PSD 文件的特定图层复合。
    • 作为具有可编辑图层样式的位图图像导入:创建一个内部带有位图的影片剪辑。支持的混合模式、滤镜和不透明度保持不变。在 Animate 中无法重现的混合模式将予以删除。必须将对象转换为影片剪辑。
    • 作为拼合的位图图像导入:将文本栅格化为位图,以保留图层在 Photoshop 中的的原样。
    • 创建影片剪辑:指定在将图像图层导入 Animate 时,将其转换为影片剪辑。如果不希望将所有的图像图层都转换为影片剪辑,则可以在“PSD 导入”对话框中逐个图层对该选项进行更改。
    • 实例名称:指定所导入实例的名称。
    • 注册:允许您设置影片剪辑的注册点。
    • 压缩:允许您选择有损或无损压缩格式。
    • 有损 (JPEG):以 JPEG 格式压缩图像。若要使用为导入图像指定的默认压缩品质,请选择“使用发布设置”。 若要指定新的品质压缩设置,请选择“自定义”选项,并在“品质”文本字段中输入一个介于 1 和 100 之间的值。(设置的值越高,保留的图像就越完整,但产生的文件也会越大。)
    • 无损 (PNG/GIF):使用无损压缩格式压缩图像,这样不会丢失图像中的任何数据。
    • 品质:
      • 使用发布设置:若要使用为导入图像指定的默认压缩品质,请选择“使用发布设置”。
      • 自定义:若要指定新的品质压缩设置,请选择“自定义”选项,并在“品质”文本字段中输入一个介于 1 和 100 之间的值。
    • 计算位图大小:若要计算要导入的所有位图的大小,请选择所有图层,然后单击“计算位图大小”。
    • 将图层转换为:
      • Animate 图层:“选择 Photoshop 图层”列表中的所有选定图层将置于其各自的图层上。Photoshop 文件中的每个图层都标有图层名称。 Photoshop 中的图层是位于各个图层上的对象。 这些对象在被放入库面板中时,还具有在 Photoshop 中的图层的名称。
      • Animate 单一图层:所有 Photoshop 图层都将置于一个单独的 Animate 图层上。
      • 关键帧:“选择 Photoshop 图层”列表中的所有选定图层将置于新图层上的各个关键帧中。新图层将以 Photoshop 文件命名(例如,myfile.psd)。Photoshop 中的图层则成为各个关键帧上的对象。这些对象在被放入库面板中时,还具有在 Photoshop 中的图层的名称。
    • 作为一个单独的位图图像导入:将具有多个图层的对象压缩成一个单独的位图图像。
    • 将对象放置于原始位置:保持 PSD 文件的内容在 Photoshop 中原来的位置不变。例如,如果某对象在 Photoshop 中位于 X = 100 Y = 50 处,则在 Animate 舞台上也具有相同坐标。(未显示在“导入到库”选项中。)
    • 将舞台设置为与 Photoshop 画布(546x513) 同样大小:Animate 舞台会调整为与用于创建 PSD 文件的 Photoshop 文档(或活动裁剪区域)相同的大小。此选项默认不选中。(未显示在“导入到库”选项中。)

    选择“导入”可导入文件,选择“取消”可取消导入过程,选择“隐藏高级选项”可显示基本选项。

    PSD 基本选项:库

  6. 在基本选项中,可选择“图层转换”、“文本转换”和“转换图层”中的选项。

    • 选择 Photoshop 图层复合:允许您选择希望用来导入 PSD 文件的特定图层复合。如果更改基本选项中的“图层复合”,则“高级”选项中的树形布局会根据所选的图层复合得到更新。
    • 保持可编辑路径和效果不变:创建一个内部具有剪切位图的可编辑矢量形状。支持的混合模式、滤镜和不透明度保持不变。
    • 单一拼合图像:将形状栅格化为位图,以保留形状图层在 Photoshop 中的原样。
    • 可编辑文本:通过所选 Photoshop 图层中的文本创建可编辑文本对象。文本外观可能会稍有变化以保持文本的可编辑性。
    • 矢量轮廓:将文本转换为矢量路径以保留文本的可视外观。
    • 拼合的位图图像:将文本栅格化为位图,以保留文本图层在 Photoshop 中的的原样。栅格化的文本不再具有可编辑性。
    • Animate 图层:“选择 Photoshop 图层”列表中的选定图层将置于其各自的图层上。Photoshop 文件中的每个图层都标有图层名称。
    • Animate 单一图层:所有 Photoshop 图层都将置于一个单独的 Animate 图层上。
    • 关键帧:“选择 Photoshop 图层”列表中的所有选定图层将置于新图层上各自的关键帧中。选择“导入”可导入文件,选择“取消”可取消导入过程,选择“显示高级选项”可显示高级选项。
  7. 单击“确定”。

将 PSD 文件导入 Animate 库

将 PSD 文件导入到库与导入到舞台类似。 将 PSD 文件导入到库中时,根文件夹将使用 PSD 文件的名称。 将 PSD 文件导入到库中以后,您可以更改根文件夹的名称,也可以将图层移到文件夹之外。

注意:库将按字母顺序对导入的 PSD 文件内容进行排序。分层组合和文件夹结构保持不变,但库会按字母顺序重新排列它们。

 

将创建一个包含 PSD 文件中已导入到时间轴的所有内容的影片剪辑,就像将内容导入到舞台一样。几乎所有影片剪辑都有一个位图或其他资源与其相关。 为了尽量减少混淆和命名冲突,这些资源存储在该影片剪辑所在的相同文件夹中的 Assets 文件夹中。

注意:导入到库时,PSD 文件的内容将导入到影片剪辑的时间轴,而不是 Animate 主时间轴。

 

Photoshop 导入选项

当您导入包含多个图层的 Photoshop PSD 文件时,您可以设置下列选项:

图层复合

如果 Photoshop 文件包含图层复合,则可以指定要导入的图像版本。 图层复合是 Photoshop“图层”调板状态的快照。 图层复合记录了三种类型的图层选项,这三种图层选项都导入 Animate 中:

  • 图层可见性:显示还是隐藏图层。

  • 文档中的图层位置

  • 图层外观:是否将图层样式应用到图层和图层的混合模式。

如果没有显示图层复合,则将隐藏此弹出菜单。Animate 支持图层复合保真度的所有方面,包括可见性、位置和图层样式。

 

导入文本对象

文本对象是位于 Photoshop 中的文本图层。选择将文本导入 Animate 的方式。

可编辑文本

从所选 Photoshop 图层上的文本创建可编辑文本对象。 为保持文本的可编辑性,文本外观可能受损。 如果将文本作为影片剪辑导入,该影片剪辑将包含可编辑文本对象。

注意:将可编辑文本导入到库中时,该文本必须位于影片剪辑内。只有影片剪辑、位图和图形元件能够存储在库中。 为要导入到库中的文本图层选择“可编辑文本”选项时,会自动将其导入为图形元件。

矢量轮廓

将文本转换为矢量路径以保留文本的可视外观。 文本自身不再具有可编辑性,但不透明度和可兼容模式仍然保持其可编辑性。 如果选择了此选项,则必须将此对象转换为影片剪辑。

注意:(仅限 Windows 8)在选中“矢量轮廓”选项的情况下,如果导入的 PSD 文件包含文本,则您无法编辑矢量对象的锚点。对于使用 Windows 8 中不支持的字体来创建的 PSD 文件也是如此。

拼合的位图图像

将文本栅格化为位图以保留文本图层在 Photoshop 中的确切外观。 栅格化的文本不再具有可编辑性。

注意:在导入路径上的文本时,必须将其导入为拼合的位图图像,以保持对象的视觉保真度。

导入形状对象

形状图层对象是最初在 Photoshop 中为形状图层的对象,或是具有矢量剪切蒙版的图像图层的对象。

可编辑路径与图层样式

创建矢量内带有剪切位图的可编辑矢量形状。 支持的混合模式、滤镜和不透明度保持不变。将删除在 Animate 中无法重现的不受支持的混合模式。 必须将对象转换为影片剪辑。

拼合的位图图像

将形状栅格化为位图以保留形状图层在 Photoshop 中的确切外观。 栅格化的图像不再具有可编辑性。

导入图像或填充图层

如果图像或填充图层与矢量蒙版相关,则将其视为形状图层对象。

具有可编辑图层样式的位图图像

创建内部带有位图的影片剪辑。 支持的混合模式、滤镜和不透明度保持不变。将删除在 Animate 中无法重现的不受支持的混合模式。 必须将对象转换为影片剪辑。

拼合的位图图像

将图像栅格化为位图以保留图像或填充图层在 Photoshop 中的确切外观。

(仅限 CS6 和更早版本)导入合并后的位图对象和合并位图中的对象

合并的位图是包含多个 Photoshop 图层的对象,这些图层在导入 Animate 时将拼合(即合并)为一个单独的位图。 合并位图中的对象表示 Photoshop 中的图层。 若要创建合并的位图,请选择两个或更多个图层,然后选择“合并图层”按钮。

(仅限 CS6 和更早版本)导入多个不同类型的对象

如果导入多个不同类型的对象,则 Animate 只允许您用所选对象共有的导入选项(例如创建影片剪辑和注册)导入这些对象。

导入相同类型的多个对象

如果导入相同类型的多个对象,则显示的导入选项是相同的,就好像选择了该类型的一个对象。 如果这些对象不共享相同属性,则显示的导入选项处于不确定的状态,并且可能不会显示预期的结果。

(仅限 CS6 和更早版本)导入组文件夹

导入组文件夹时,可以将其作为影片剪辑导入,也可以将组中的每个图层置于其自身的图层上或置于时间轴的关键帧上。

如果选择“导入为影片剪辑”,则组文件夹中每个图层将置于影片剪辑的某个图层上,然后将该图层置于其自身的图层上或置于时间轴的关键帧上。 影片剪辑使用该组文件夹在 Photoshop 中的名称,如果将该影片剪辑导入 Animate 图层,该图层将使用同样的名称。

如果未将组置于一个影片剪辑中,每个图层将被转换为当前为其设置的类型,且组中的每个图层将被导入它自己的 Animate 图层。 Animate 图层将被依照 PSD 文件中的各个图层而命名。

(仅限 CS6 和更早版本)导入和合并图层

PSD 导入器可让您将两个或更多个图层合并到一个合并的位图中,该位图将导入为一个位图文件而不是单独的对象。

选择用来创建合并位图的图层必须是同一层内连续的两个或更多个图层。例如,您无法选择某个组内的一个图层和该组外的某个图层并将这两个图层合并。相反,必须选择整个组和单独的图层。

设置发布选项

PSD 导入器中的“发布”设置使您可以指定将 Animate 文档发布为 SWF 文件时应用到图像的压缩程度和文档品质。这些设置仅在将文档发布为 SWF 文件时才有效,将图像导入 Animate 舞台或库时对图像没有影响。

压缩

使您可以选择有损或无损压缩格式:

有损

“有损 (JPEG)”将以 JPEG 格式压缩图像。 若要使用为导入图像指定的默认压缩品质,请选择“使用发布设置”。 若要指定新的品质压缩设置,请选择“自定义”选项,并在“品质”文本字段中输入一个介于 1 和 100 之间的值。(设置的值越高,保留的图像就越完整,但产生的文件也会越大。)

无损

“无损 (PNG/GIF)”将使用无损压缩格式压缩图像,这样不会丢失图像中的任何数据。

注意:对于具有复杂颜色或色调变化的图像(例如具有渐变填充的照片或图像),请使用有损压缩。对于具有简单形状和相对较少颜色的图像,请使用无损压缩。

计算位图大小

确定基于导入选择为指定图层创建的位图的数目,以及该图层上得到的位图压缩后的大小(以 KB 单位)。例如,如果选择带有投影和模糊的图层并保持图层样式,则“计算位图大小”信息会表明通过导入将得到三个位图:每种滤镜效果对应一个位图,图像本身对应一个位图。若要计算要导入的所有位图的大小,请选择所有图层,然后单击“计算位图大小”。

(仅限 CS6 和更早版本)Photoshop 文件导入器首选参数

Animate 的“首选参数”对话框可让您为 Photoshop PSD 文件设置导入首选参数。您指定用于导入 PSD 文件的首选参数将影响为 Photoshop 图层类型最初填充“PSD 导入”对话框的选项。

注意:

若要以逐个对象为基础覆盖为不同图层类型指定的首选参数,请使用“PSD 导入”对话框。 请选择要更改其导入选项的图层,并指定所需选项。

导入图像图层首选参数

这些选项指定图像图层的导入选项的初始设置。可导入图像图层来提供以下用途:

具有可编辑图层样式的位图图像

创建内部嵌套位图的影片剪辑。指定该选项会保持受支持的混合模式和不透明度,但是在 Animate 中不能重现的其他视觉属性将被删除。如果选择了此选项,则必须将此对象转换为影片剪辑。

拼合的位图图像

将任何文本栅格化为拼合的位图图像,以保持文本图层在 Photoshop 中的确切外观。

创建影片剪辑

指定在将图像图层导入 Animate 时,将其转换为影片剪辑。如果不希望将所有的图像图层都转换为影片剪辑,则可以在“PSD 导入”对话框中逐个图层对该选项进行更改。

文本图层导入首选参数

这些选项指定文本图层的导入选项的初始设置。

可编辑文本

从 Photoshop 文本图层上的文本创建可编辑文本对象。 为保持文本的可编辑性,文本外观将会受影响。 如果选择了此选项,则必须将此对象转换为影片剪辑。

矢量轮廓

将文本向量化为路径。 文本外观可能会改变,但是视觉属性会得到保留。 如果选择了此选项,则必须将此对象转换为影片剪辑。

拼合的位图图像

栅格化文本以保持文本图层在 Photoshop 中所具有的确切外观。

创建影片剪辑

在将文本图层导入 Animate 时,自动将其转换为影片剪辑。 如果您不希望将所有的文本图层都转换为影片剪辑,则可以在“PSD 导入”对话框中逐个对象对该选项进行更改。选择“可编辑文本”或“矢量轮廓”后,此选项是必需的。

形状图层导入首选参数

这些选项指定形状图层的导入选项的初始设置。

可编辑路径与图层样式

该选项将创建矢量形状内带有被剪裁的位图的可编辑矢量形状。 该选项也会保留受支持的混合模式和不透明度,但是在 Animate 中不能重现的其他视觉属性会受到影响。 如果选择了此选项,则必须将此对象转换为影片剪辑。

拼合的位图图像

该选项将栅格化形状并保留形状图层在 Photoshop 中所具有的确切外观。

创建影片剪辑

在将形状图层导入 Animate 时,该选项会设置要转换为影片剪辑的形状图层。 如果您不希望将某些形状图层转换为影片剪辑,则可以逐个对象对该选项进行更改。如果选中“保持可编辑路径与图层样式”复选框,则禁用此选项。

图层组导入首选参数

这一选项指定图层组的选项的初始设置。

创建影片剪辑

指定在导入 Animate 时,将所有组转换为一个影片剪辑。 如果不希望将某些图层组转换为影片剪辑,可以逐个对象地更改该选项。

合并位图导入首选参数

这一选项指定合并位图的导入选项的初始设置。

创建影片剪辑

在将合并的位图导入 Animate 时,该选项会设置要转换为影片剪辑的合并位图。如果不希望将某些合并位图转换为影片剪辑,则可以逐个对象对该选项进行更改。如果选中“保持可编辑路径与图层样式”复选框,则禁用此选项。

影片剪辑注册导入首选参数

为创建的影片指定一个全局注册点。 此设置会应用于所有对象类型的注册点。 在“PSD 导入”对话框中,可以逐对象更改此选项;这是所有对象类型的初始设置。 有关影片剪辑注册的详细信息,请参阅编辑元件

用于已导入图像的发布设置

使用 FLA 文件的发布设置首选参数,可以指定将 Animate 文档发布为 SWF 文件时应用到图像的压缩程度和文档品质。这些设置仅在将文档发布为 SWF 文件时才有效,将图像导入 Animate 舞台或库时对图像没有影响。

压缩

使您可以选择有损或无损压缩格式:

有损

“有损 (JPEG)”将以 JPEG 格式压缩图像。 若要使用为导入图像指定的默认压缩品质,请选择“使用发布设置”。 若要指定新的品质压缩设置,请选择“自定义”选项,并在“品质”文本字段中输入一个介于 1 和 100 之间的值。(设置的值越高,保留的图像就越完整,但产生的文件也会越大。)

无损

“无损 (PNG/GIF)”将使用无损压缩格式压缩图像,这样不会丢失图像中的任何数据。

注意:对于具有复杂颜色或色调变化的图像(例如具有渐变填充的照片或图像),请使用有损压缩。对于具有简单形状和相对较少颜色的图像,请使用无损压缩。

品质

可让您设置压缩的品质级别。

使用发布设置

应用发布设置中的当前“JPEG 品质”设置。

自定义

可用于指定单独的特定品质设置。

本产品经 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 许可  Twitter™ 与 Facebook 中的内容不在 Creative Commons 的条款约束之下。

法律声明   |   在线隐私策略