基础实例47简单帧操作—闪烁文字 目的:制作如图47.1所示的闪烁文字效果。 要点:本例初步接触ImageReady的功能, Flash 通过简单的帧操作来向大家介绍动 画的基本制作方法。本例主要应用 Flash Type Tool、 Paint Bucket Tool、 Layer Style、 Duplicates current frame功能 Flash 等工具完成。 图47.1闪烁文字效果 操作步骤 1.打开 ImageReady软件,选择 FileNew命令,打开New对话框,在其中 设置 Width为34 00 pixels, Height为240 pixels, Contents of First Layer选择为 White, 点击OK按钮确认建立一幅动画图像文件。 Flash 2.在工具箱中选择 Type Tool,在工具 栏选项中设置字体为 Arial Black,大小设为 96px,颜色使用默认的黑色,然后在图像 图47.2添加文字 中合适位置添加“Flash”字样,如图47.2 所示。 3.选择Layers面板,点击面板下方的 Create new layer按钮,建立一个新的空白 图层 Layerl 说明:在 ImgeReady中大部分针对图像 Flash 的操作和处理和 Photoshop是相同的,只是 在命令名称或者命令行位置设置等处有少 许不同。 4.按住Ctrl键同时点击 Flash图层在 图47.3填充文字选区 Layers面板中的缩略图,将文字图像区域作 为选区载入
47 简单帧操作──闪烁文字 目的：制作如图 47.1 所示的闪烁文字效果。 要点：本例初步接触 ImageReady 的功能， 通过简单的帧操作来向大家介绍动 画的基本制作方法。本例主要应用 Type Tool、Paint Bucket Tool、Layer Style、Duplicates current frame 功能 等工具完成。 图 47.1 闪烁文字效果 操作步骤 1．打开 ImageReady 软件，选择 File|New 命令，打开 New 对话框，在其中 设置 Width 为 340 pixels，Height 为 240 pixels，Contents of First Layer 选择为 White， 点击 OK 按钮确认建立一幅动画图像文件。 2．在工具箱中选择 Type Tool，在工具 栏选项中设置字体为 Arial Black，大小设为 96 px，颜色使用默认的黑色，然后在图像 中合适位置添加“Flash”字样，如图 47.2 所示。 3．选择 Layers 面板，点击面板下方的 Create a new layer 按钮，建立一个新的空白 图层 Layer1。 说明：在 ImgeReady 中大部分针对图像 的操作和处理和 Photoshop 是相同的，只是 在命令名称或者命令行位置设置等处有少 许不同。 4．按住 Ctrl 键同时点击 Flash 图层在 Layers 面板中的缩略图，将文字图像区域作 为选区载入。 图 47.2 添加文字 图 47.3 填充文字选区
新概念百例 入门·创作·提高— Photoshop70 5.选择工具箱上的 Paint Bucket Tool, 将前景色设为红色,在新的 Layerl图层中 填充文字选区,得到如图473所示的图像。 ①注意:值得注意的是 Image Ready的工具 Flash 箱中比 Photoshop少了几种常用工具,可见 其并不是为图像处理而设计的软件,而只是 Photoshop处理网页动画的辅助软件。 图474 6.在 Layers面板中,在 Layer图层 图层样式 上点击右键,在弹出的菜单中选择 Layer Style(图层样式),在子菜单中选择 Outer Glow(外发光)效果。重复操作选择子菜 单中的 Bevel and Emboss(斜面与浮雕)效 果,完成后如图474所示。 Flash 7.重复步骤3~6,建立图层 Layer3, 并在步骤5中改用黄色填充文字选区,其余 不变,完成后得到如图475所示的效果。 图475处理 Laver2图层 8.再次重复步骤3~6,建立图层 Layer2,并在步骤5中改用蓝色填充文字选 区,其余不变,完成后得到如图476所示 的效果 9.使用Ctrl+D键取消选区 Flash 10.然后选择 Animation面板,在其中 点击下方的 Duplicates current frame(复 制当前帧)按钮两次,得到两个和刚刚编辑 的帧相同的两个副本 图476处理 Layer3图层 说明: Animation面板是 Photoshop中所 不曾见过的面板,它是实现动画效果的主要 场所。帧的概念我们第一次接触,动画效果 的实现就是依靠不同帧的快速变换实现的。 11.在 Animation面板中选中第1帧, 图47.7调整各帧 然后转到 Layers面板中,将图层 Layer3和 Layer2都设为隐藏 12.在 Animation面板中选中第2帧, 然后到 Layers面板中,将 Layer3设为隐藏
146 新概念百例 入门·创作·提高━━Photoshop7.0 5．选择工具箱上的 Paint Bucket Tool， 将前景色设为红色，在新的 Layer1 图层中 填充文字选区，得到如图 47.3 所示的图像。 注意：值得注意的是 ImageReady 的工具 箱中比 Photoshop 少了几种常用工具，可见 其并不是为图像处理而设计的软件，而只是 Photoshop 处理网页动画的辅助软件。 6．在 Layers 面板中，在 Layer1 图层 上点击右键，在弹出的菜单中选择 Layer Style（图层样式），在子菜单中选择 Outer Glow（外发光）效果。重复操作选择子菜 单中的 Bevel and Emboss（斜面与浮雕）效 果，完成后如图 47.4 所示。 7．重复步骤 3～6，建立图层 Layer3， 并在步骤 5 中改用黄色填充文字选区，其余 不变，完成后得到如图 47.5 所示的效果。 8．再次重复步骤 3～6，建立图层 Layer2，并在步骤 5 中改用蓝色填充文字选 区，其余不变，完成后得到如图 47.6 所示 的效果。 9．使用 Ctrl＋D 键取消选区。 10．然后选择 Animation 面板，在其中 点击下方的 Duplicates current frame （复 制当前帧）按钮两次，得到两个和刚刚编辑 的帧相同的两个副本。 说明：Animation 面板是 Photoshop 中所 不曾见过的面板，它是实现动画效果的主要 场所。帧的概念我们第一次接触，动画效果 的实现就是依靠不同帧的快速变换实现的。 11．在 Animation 面板中选中第 1 帧， 然后转到 Layers 面板中，将图层 Layer3 和 Layer2 都设为隐藏。 12．在 Animation 面板中选中第 2 帧， 然后到 Layers 面板中，将 Layer3 设为隐藏， 图 47.4 添加图层样式 图 47.5 处理 Layer2 图层 图 47.6 处理 Layer3 图层 图 47.7 调整各帧
第十一篇制作网页素材 新概念百例闯 之后三个帧状态如图477所示。 13.在 Animation面板中,点击第1 帧下方0sec字样右侧的小三角图标,则弹 出如图478所示的下来菜单,在其中选择 02,将第1帧的间隔时间设为02秒。 14.同样操走将其余两帧的间隔时间 图478调整间隔时间 都设为02秒。然后点击面板下方的D按钮 就可以播放编辑好的闪烁文字动画了
第十一篇 制作网页素材 新概念百例 147 之后三个帧状态如图 47.7 所示。 13．在 Animation 面板中，点击第 1 帧下方 0 sec 字样右侧的小三角图标，则弹 出如图 47.8 所示的下来菜单，在其中选择 0.2，将第 1 帧的间隔时间设为 0.2 秒。 14．同样操走将其余两帧的间隔时间 都设为0.2秒。然后点击面板下方的 按钮， 就可以播放编辑好的闪烁文字动画了。 图 47.8 调整间隔时间