图10-83 完成效果技术提示
罗盘小游戏中颜色渐变部分的动画，主要是制作按钮图像在画面中循环变色的动画效果。在制作图像颜色渐变的流程中，首先为图像设置不同的颜色，并将每个颜色的图像记作一帧动画，然后在这几帧动画之间添加过渡帧，制作出图像颜色渐变的动画效果。如图 10-84 所示，为本实例的制作流程。
图10-84 制作概览制作步骤
（ 1 ）启动 Photoshop ，打开本书附带光盘 \Chapter-10\ “罗盘背景 .jpg ”文件，如图 10-85 所示。
图10-85 背景图片
（ 2 ）在“图层”调板中新建“图层 1 ” 。设置前景色为白色，使用 “椭圆”工具，配合 键，绘制如图 10-86 所示的白色圆形图像。
图10-86 绘制白色圆形
（ 3 ）在“图层”调板中设置“图层 1 ” 的“填充”选项为 0% 。再执行“图层”→“图层样式”→“斜面和浮雕”命令，如图 10-87 所示，为该图层添加“斜面和浮雕”效果。
图10-87 添加“斜面和浮雕”效果
（ 4 ）新建“图层 2 ” 。再使用 “椭圆”工具，在凹下去的圆形的中间部分绘制如图 10-88 所示的白色圆形。
图10-88 新建图层并绘制圆形
（ 5 ）参照图 10-89 所示，在“样式”调板中单击“铬合金”样式，为“图层 2 ” 中的圆形添加预设的样式效果。
图10-89 添加预设样式
（ 6 ）在“图层”调板中关闭“图层 2 ” 的“投影”样式效果，然后参照图 10-90 所示，更改“颜色叠加”样式效果的颜色设置。
图10-90 更改图层样式效果
（ 7 ）按下 键，再在“图层”调板中单击“图层 1 ” ，将“图层 2 ” 和“图层 1 ” 同时选择。然后按下 键，将选择的图层合并为一个图层，如图 10-91 所示。
图10-91 选择图层并合并图层
（ 8 ）新建“图层 3 ” ，再绘制如图 10-92 所示的白色圆形，然后更改该图层的“填充”设置为 0% 。接着参照图示所示，为该图层添加白色“外发光”和红色“颜色叠加”效果。
图10-92 绘制并编辑圆形图像
（ 9 ）下面执行“窗口”→“动画”命令，打开“动画”调板，当前视图中的图像将成为第 1 帧动画。接着创建第 2 帧，然后更改“图层 3 ” 的“颜色叠加”图层样式的颜色设置，编辑第 2 帧动画，如图 10-93 所示。
图10-93 设置第2帧动画
（ 10 ）按照上一步骤中更改“颜色叠加”样式的颜色设置的方法，再参照图 10-94 所示，继续设置第 3 ～ 4 帧动画。
图10-94 设置第3～4帧动画
（ 11 ）在“动画”调板中选择第 2 帧动画，然后单击 “动画帧过渡”按钮，如图 10-95 所示，在第 1 帧和第 2 帧动画之间插入 5 个过渡帧，这时调板中共有 9 帧动画。
图10-95 在第1帧和第2帧之间设置过渡帧
（ 12 ）再在第 7 帧和第 8 帧之间插入 5 个过渡帧，这时共有 14 帧动画。在第 13 帧和第 14 帧之间插入 5 个过渡帧，这时共有 19 帧动画。
（ 13 ）接着参照图 10-96 所示，再在第 19 帧和第 1 帧动画之间插入 5 个过渡帧。
图10-96 在第19帧和第1帧之间设置过渡帧
（ 14 ）按下 键，将“罗盘背景 .jpg ”文件另存为 PSD 格式的文件。
（ 15 ）然后再执行“文件”→“存储为 Web 所用格式”命令，如图 10-97 所示，设置文件名为“制作颜色渐变动画”，存储优化 结果为 GIF 格式文件。
提示：在保存过程中如出现一个对话框，提示存储的一些文件名称与某些Web浏览器和服务器不兼容时，请单击“确定”按钮，关闭该对话框。
读者可打开本书附带光盘 \Chapter-10\ “制作颜色渐变动画 .gif ”文件查看最终效果。
图10-97 存储优化结果
查看更多关于Photoshop制作罗盘游戏中颜色渐变动画的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did74360