Fireworks制作变色banner的详细步骤（2）

• Fireworks制作
• 变色banner
• 详细步骤

画布的效果如图。

7.这样，一种渐变效果应该说是搞定了，接下来是要让它由绿色变为紫色，在帧面板里选择最后一帧，即第10帧

如果步骤没有错误的话，画布中的人物应该成了绿色了。单击帧面板右上角的小箭头，选择填加帧Duplicate frame...,在弹出的对话框内选择填加一帧，在原来帧后面，如图（一般默认，直接点确定就可以）。

这时画布又变为背景了，在层面板中选中图层2，将紫色的符号拖到画布中，在properties面板中设置X,Y坐标，如步骤7进行动画设置，怎么设置呢，对了，紫色在这一次变化中是不变的，只设置帧数为10便可以了~！选中图层3，将绿色的符号拖到画布中，设置坐标，设置动画。这次，绿色符号的透明度应该由100变到0，让它淡去，紫色就出现了，实现由蓝变绿，由绿变紫的效果。

8.现在该由紫变回蓝色去了，不用我说，你也该会了吧。同上，在帧面板中选中20帧，再添加一帧，选中层3，将蓝色符号拖到画布中，设置透明由0到100，选中图层2，拖入紫色符号，透明度不变，帧数也是10帧。（其实这一步可以在第7步中一次搞定，因为紫色符号一直没有变化，所以，第7步中直接让它20帧就可以了！为了说明思路，这里我们分开来做）。

9.现在，大功告成了，点击播放按钮浏览一下吧，是不是速度太快了，没关系，按住Shift键，选中所有的帧，双击，将帧速调整为10，现在速度可以了吧！

10.变色是实现了，可没有文字的Banner是没有用的。加文字动画可以根据自己的需要设置，这里我罗嗦一下例子中的几个文字动画效果，大家也可以进一步熟悉动画制作的一些技巧。

接上面步骤，选中第1帧，然后选中图层3，填加图层4，这一层应该在最上面。选择文字工具，在这一层输入制作动画的文字，如例中输入“风云设计眼”，然后按快捷键F8，将其转化为动画符号，因为我要它保持静止状态5帧，所以在设置动画时和前面不变色的图片符号一样，只输入帧数就可以了，其他的设置不变。如图

如果要达到自己想要的效果，可以自行设置，这个不会影响我们设置的颜色渐变动画，可以根据需要自己调整。然后输入网址（就是下面移动的小字）同样按F8转化为动画符号，在弹出的设置窗口中做如下设置：如图

调整动画控制柄，如下图，绿色点为动画起始位置，将它移到图片外面，红色点为终止位置，将它移到文字的下放，然后在帧面板中选中第5帧，双击后面的数字，将帧速设为200。

选中第6帧，这时我们所做的前5帧动画看不到了，看看层面板，始终保持在第4层，我们来实现例中的那个“动感模糊”，好多网友不知道用Fireworks怎么很好的实现！

11.绘制和要模糊的文字差不多大小的一个矩形，然后选择填充下面的Fill Options...，如图对矩形进行Folds填充

成为如下图的效果！

（模拟条形码，详细教程见：http://）然后羽化，在Properties面板里选择Effects，选择Motion Trail...滤镜，进行两次“动感”一次角度为0，如下图，一次为180。

完成的效果如图：

然后打开库面板，将“风云设计眼”字样的符号拖到场景中，右键->Symbol->Break Apart，断开和库的联系，然后选中文字，在Properties面板选择Effects，对其进行高斯模糊，模糊度设置为2.0就可以了，然后将处理好的矩形放到模糊文字的上面，适当调节透明度，这样两个文字过渡时候的动感模糊效果就实现了，如图中效果：

12.选中第7帧，输入文字“点燃灵感”，转化为动画符号，也设置5帧的动画，设置和前面“风云设计眼”完全一样，只是下面的文字变化方向不同而已，大家可以打开原文件看看就明白