创建动画布局

自从InDesign推出以来,Adobe一直致力于将其作为打印设计的首选。然而,自那时以来,创意世界以前所未有的速度发展,并且正如我们许多人所发现的那样,客户经常调试屏幕而非打印工作。

尽管如此,Adobe并没有小心翼翼,而且通过CS5,它引入了大量工具,可以将富媒体添加到您的布局中,这些工具可以导出为Flash和PDF。真正的好处是工作流程对任何InDesign老手都很直观,甚至新手也可以快速掌握这些工具。

在本教程中,我们将介绍动画对象的基础知识,创建按钮并使其触发动作。我们只是想了解这些新工具的功能,但是一旦掌握了基础知识,您就可以自由地探索所有选项。

单击此处下载支持文件(3.85MB)

Interactive workspace menus

交互式工作区

01InDesign CS5最便捷的功能之一是能够快速更改工作区。我们将主要使用交互式工具套件,因此请转到Window> Workspace> [Interactive],然后返回相同的菜单并单击Reset Interactive。这会将工作区重置为其原始默认值,这样就不会打开额外的菜单来分散您的注意力。

Movement graphics heading,

运动图形标题

02在支持文件中的Shakespeare_Folder中打开shakespeare.indd。让我们首先在标题文本中添加一些动作。选择分组文本“莎士比亚的十四行诗”并打开动画面板。如果查看“名称”字段,您会看到InDesign已自动将其命名为“组”。建议养成命名元素的习惯,否则事情会变得非常混乱,特别是如果你有许多不同的元素需要管理。输入名称“标题”。

Preset animation headings

预设动画

03单击“预设”菜单以显示Adobe提供的预设动画数组。一旦你有兴趣使用这些,你可以创建自己的,但现在我们将选择'从左边飞入'。检查Event(s)是否设置为On Page Load。 InDesign会自动选择这个,这可能令人困惑,但在这种情况下,它就是我们想要的那个。将其余设置保留为默认值。

running animation motion path preview

运动路径

04请注意,现在该对象附有绿线。这是运动路径,并显示动画将遵循的方向。值得庆幸的是,每次要检查动画时都不必导出文件。打开“预览”面板,您将看到文件的小预览。要使动画运行,请按“预览”窗格左下角的“播放三角形”图标。您应该看到文本从左侧移入。默认的“预览”窗格非常小,因此抓住左下角并将其拖出以获得合适大小的窗口。

Trigger button animation

触发动画

05现在我们将制作另一个动画并创建一个按钮来触发它。选择包含十四行诗的文本框,然后打开“动画”面板。检查它的名称为“Sonnet XIX”,然后从“预设”菜单中选择“淡入”。通过在“事件”菜单中单击它来取消选择“页面加载” - 这次我们将创建自己的触发器。然后将持续时间减少到0.75秒。

Covert object to buttion

隐蔽的态度

06接下来,使用选择工具(黑色箭头),选择内部带有数字XIX的圆形图标。这将成为我们的按钮。打开“按钮”面板,在底部单击“将对象转换为按钮”图标。您将看到[Normal]状态加载了图标。单击[翻转]以创建第二个状态。

Rollover and normal states

翻滚正常

07我们希望读者能够区分这两种状态,并且InDesign无法使这更容易。在[翻转]状态仍然突出显示的情况下,将按钮的不透明度更改为100%。现在,在两个状态之间单击应显示一个按钮,该按钮可在翻转时更改不透明度。为了更好地了解导出时的外观,请查看“预览”面板。

roll over event web design

滚动事件

08现在我们有了按钮,我们需要给它一些事情。返回“按钮”菜单中的“名称”字段下方,您将看到“事件”菜单。这些是将触发事件的实例。如果您熟悉网页设计,您将认识到各种选项。选择On Roll Over,然后单击其下方的小Plus符号以查看“操作”菜单。

reverse on roll off export flash

滚动时反转

09此菜单分为三类。有些操作只会导出到Flash,有些只会导出到PDF,有些会导出到两者。在这种情况下,我们将导出到Flash,因此请继续选择动画。在出现的动画下拉菜单中,选择我们创建的Sonnet XIX动画并将Play保留为选项。勾选“反向滚动”框。

preview all layers

预习

10现在启动“预览”面板以确保所有动画都正确无误。标题文本应该从左侧飞入,按钮应该在翻转时突出显示,当你滚动或关闭XIX按钮时,十四行诗应该淡入淡出。如果您对所有内容感到满意,那么让我们将文件导出到Flash。

Export to flash SWF

导出到flash

11转到文件>导出。您将在出现的格式下拉菜单中看到两个Flash选项:FLA和SWF。如果您将文件交给Flash开发人员,则应选择FLA:它会转储我们刚刚添加的所有动画,但可以将这些文件导入Flash以进行进一步的工作。 SWF选项将创建一个可在大多数浏览器或独立Flash Player中播放的Flash文件。这是我们想要的选项。

html, swf, save

生成HTML并保存SWF

12单击“保存”,您将看到“导出SWF”面板。确保将“导出”设置为“所有页面”,并勾选“生成HTML文件”和“导出后查看SWF”框。保留其余默认值,但在“高级”面板中,确保将“文本”设置为“Flash Classic”,并将“图像处理分辨率”设置为72ppi。单击“确定”,您的默认浏览器将启动并准备好Flash文件并等待。恭喜:您现在已经创建了一个移动布局。



翻译字数超限