当前位置: 首页 > 图文教程 > 平面设计 > FireWorks > Fireworks打造动态banner全过程

FireWorks
Fireworks教程:制作网页公告的装饰
Fireworks仿真绘画质感金属球
实例汇总Fireworks抠图方法
英文教程:Fireworks学习教程40个
Fireworks最新的CS5版本新增功能
Fireworks教程:绘制矢量的邮件图标
Fireworks简单绘制矢量碳纤维安全帽图标
Fireworks教程:绘制矢量逼真的铅笔图标
网页常用的PNG,GIF,JPG图片压缩率对比
Fireworks教程:绘制奇特发光的圆特效
Fireworks教程:制作晶莹剔透的魔幻花瓣
Fireworks教程:简单制作超酷炫光效果
Fireworks 抠图方法实例汇总
Fireworks学习教程40个英文教程
Fireworks 绘制矢量逼真的铅笔图标
Fireworks 简单绘制矢量碳纤维安全帽图标
Fireworks 绘制矢量的邮件图标
网页常用的PNG,GIF,JPG图片压缩率对比分析说明
Fireworks 绘制奇特发光的圆特效
Fireworks 制作晶莹剔透的魔幻花瓣

FireWorks 中的 Fireworks打造动态banner全过程


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-15   浏览: 112 ::
收藏到网摘: n/a

效果图:

本文涉及知识点:
1、fw创建gif动画的基本过程;
2、fw帧动画中共享层的使用;
3、fw形状渐变动画的制作;
4、fw缩放动画的制作;
5、fw帧帧动画的制作;
...
第一步:做背景层
大家知道,大多动画的背景图片都是固定的,变化的只是动画里的文字阿、图标等等。我们可以事先将背景部分做好,然后将其设为共享层,其他帧里我们就不用再复制背景层了。
新建468*60文档;

用矩形工具画一个矩形,大小同画布;

将填充颜色改为线性渐变,调整颜色如下;

通过“文件”菜单里的“导入”功能,将修饰图片导入场景;

并调整布局及搭配,结果如下图:

将层面板中层1设置为共享层,并新建层2;

选择层2,场景中输入“海量”两个字,大小为120px,调整透明度为60%;调整颜色及倾斜角度;

在帧面板中讲帧1鼠标拖拉之新建图标,复制创建帧2,并将文字大小设置为44;

在画布中输入“免费”,在滤镜的“阴影和光晕”中选择“发光”;

调整参数如下:

再对“免费”两个字进行模糊处理:在滤镜的“模糊”中选择“缩放模糊”;

调整参数如下:

复制该帧,并将新帧中的“免费”的模糊参数修改如下:

再复制该帧,删除“免费”的模糊滤镜。

复制帧,添加输入“教”;复制帧,添加输入“程”;重复复制帧,添加输入“.”实现如下图的效果:

新建帧(直接点新建帧图标,不用复制帧的操作),输入“尽在”,导入图片,调整位置、文字字体等。