用Fireworks制作钟摆式公告牌效果

  先参阅一下效果图:

  1、新建一个文件,画布背景颜色选取白色。同时将画布大小设置稍大些;
  2、使用Fwmx2004的矢量工具,绘制圆角矩形,自选一种纹理效果填充,如图:


  3、输入文字“织梦论坛”;
  4、在圆角矩形右、左上角绘制小圆形,如图所示:


  5、添加辅助形,找到该圆角矩形的中心点位置,如图:


  6、在中心点上方垂直辅助线上绘制渐变效果的小圆形,以及两根斜直线段,复选该圆形及斜直线对角,组合并移至最后,使用钢笔工具,分别在两个白色小圆形上绘制曲线。如图:


  7、群组(Ctrl+A、Ctrl+G)所有对象,一个简单的公告牌效果就简单制作完成了。现在进行动画效果的制作。

 
  8、克隆群组后的公告牌,使用工具栏中的缩放工具,分别对画布中显示的公告牌进行旋转处理,如图:


  9、复选这两个对象,并按垂直居中与水平居中进行排列,如图:


  10、在层面板中先屏蔽掉右边的公告牌。再选择修改菜单、动画、选择动画命令,弹出动画属性设置窗口。进行参数的设置,如图:


  11、确定后,公告牌对象自动转化为元件。双击该元件对象,在元件编辑窗口中,将公告牌圆形移至元件编辑窗口中心位置,如图:


  12、返回至主编辑窗口,现在一个由左向右摆动的动画效果已形成。打开帧面板,选择第一帧。将层面板屏蔽的公告牌显示出来,并进行剪切。
  13、在帧面板中新建空帧,粘贴对象至画布内。对当前公告牌进行由右至左的钟摆动画设置。选择修改菜单、动画、选择动画命令,弹出动画属性设置窗口。进行参数的设置,其中各参数与第九步相同,仅需要给旋转方向上变化为顺时针。如图:


  14、将该公告牌参照第十一步修改元件中心的方法进行位置的移动。
  15、这样,由右至左的钟摆动画效果就完成了,在帧面板中将Gif动画效果设置为启永久,让动画连续播放。再导出为Gif动画文件,最终效果图如下所示:

  制作技巧提示:
  ①在位置调整时,比如中心点的对齐、旋转等,可以借助于FW中的辅助线。
  ②使用动画面板调整好旋转角度生成动画后,建议不要在帧面板中进行删除帧了操作了。如果需要调整角度,可以在画布上对元件对象进行选择右键、动画、设置,在弹出动画设置窗口中再进行调整。

  Fireworks制作的Png源图:

时间: 2024-10-30 13:50:37

用Fireworks制作钟摆式公告牌效果的相关文章

Fireworks制作钟摆式公告牌摇摆动画

今天我们用Fireworks制作一个钟摆式的公告牌. 先参阅一下效果图. 1.新建一个文件,画布背景颜色选取白色.同时将画布大小设置稍大些. 2.使用Fwmx2004的矢量工具,绘制圆角矩形,自选一种纹理效果填充,如图. 3.输入文字. 4.在圆角矩形右.左上角绘制小圆形,如图所示. 5.添加辅助形,找到该圆角矩形的中心点位置,如图. 6.在中心点上方垂直辅助线上绘制渐变效果的小圆形,以及两根斜直线段,复选该圆形及斜直线对角,组合并移至最后,使用钢笔工具,分别在两个白色小圆形上绘制曲线.如图.

Fireworks制作公告板上方挂绳效果

经常会看到有些页面中公告板上方有类似挂绳的效果,做了一个.其实很简单,几个路径的组合而已,修改一下也可以制作活页记事本中间的铁环效果: PNG图:

Fireworks制作打破玻璃的动画效果

第一次写教程,可能有的地方写的不清楚,请大家见谅.首先先看一下最终效果: 下面是具体的制作方法: 1.下载并安装滤镜插件Xenofex2到FW的Plug-in目录下(将解压出的文件复制进Plug-in文件夹即可),下载页面在这里(不是广告,我也不知道这是谁的BLOG). 2.运行FW,打开一张图片,我们可以适当缩小这张图片的尺寸,令周围留些空白,背景色设为白色.这样我们更能看清楚破碎扩散的效果.将这层命名为"破碎". 3.然后在图片的中间部分输入破碎效果之后显现的文字,比如此例中的&q

Fireworks 制作数字镂空圆孔效果教程

效果: 1.新建一个300*300的文档,并画一个220*180的矩形,颜色#333333 2.写一个数字,大小是250(这个数值要在属性里自己填写),我写的是5,字体要尽量选择粗一点的字体,我选择的是HandelGothic BT ,放在矩形上面; 3.选择写好的数字,用Firework自带的滤镜Alien skin Splat->Edges,mode选择Halftone Dots,具体参数设置如下图: 4.把刚才做好的数字和矩形图层分别选择:修改->平面化所选,然后选择矩形并按住ALT键再

Fireworks制作Vista毛玻璃效果

今天用Fireworks制作类似vista毛玻璃的效果,局部效果图: 1.建立画布,导入背景素材 2.绘制圆角矩形,垂直线性渐变填充 3.绘制矩形高光部分,复制矩形,原位粘贴,并删除下半部分,进行垂直线性渐变,调整透明度 4.开始制作毛玻璃效果,线性渐变绘制一个圆形,羽化10px 5.添加杂点8px 6.选择先前绘制矩形,在刚才画的圆形上点击反键-编辑-粘贴为蒙版 7.得到如下效果 8.同上步骤再绘制一个矩形.放射性填充.羽化及添加杂点步骤 9.在msn小人这块区域绘制一个椭圆行,使用绸缎填充,

Fireworks制作水泡效果

目的:本节主要学习使用一透明渐变色选项. 要点:通过本节的学习,要掌握下列工具和菜单命令的使用方法: 1. Ellipse Tool(圆形绘制工具): 2. Subselection Tool(超级选择工具): 3. Scale Tool(缩放工具): 4. Modify(修改)/Group(组合群组): 5. Pen Tool (钢笔工具). 操作步骤: (1)启动Fireworks MX,新建一个文件.长和高分别为300x300像素,背景色为绿色#009933. (2)单击工具箱中的Elli

Fireworks制作文字探照灯效果实例教程

  我们经常可以看到一些用Flash做文字遮罩效果的教程文章,这种效果用Fireworks也同样可以做出来,并且可以生成GIF格式的小动画.下面,就让我引导大家一步步用Fireworks制作文字探照灯效果. 1.点击"File>New",建立一个新文件,将背景设置为黑色. 2.点击工具面版中的椭圆形工具,用鼠标在新画布上拖动一个椭圆,将椭圆的填充色设置为"None". 3.点选工具面版上的文字工具,在弹出的文字编辑对话框中输入文字,在此我们输入"ta

Fireworks制作打破玻璃的GIF动画效果

  本教程是向大家介绍如何利用Fireworks制作打破玻璃的GIF动画效果,制作方法并不是很难,效果非常不错,推荐过来,希望大家喜欢! 首先先看一下最终效果: 下面是具体的制作方法: 1.下载并安装滤镜插件Xenofex2到FW的Plug-in目录下(将解压出的文件复制进Plug-in文件夹即可),下载页面在这里(不是广告,我也不知道这是谁的BLOG). 2.运行FW,打开一张图片,我们可以适当缩小这张图片的尺寸,令周围留些空白,背景色设为白色.这样我们更能看清楚破碎扩散的效果.将这层命名为"

Fireworks 制作精美导航效果教程

  本教程是向大家介绍利用Fireworks 制作精美导航效果,制作难度不大,教程介绍地非常详细,新手朋友也可以过来学习,希望这篇教程对大家有所帮助!我们先来看看最终效果图: (图2.1) 下边我将教大家如何制作以上这个按钮: 先新建一个500*400大小的画布,画一个400*40的长方形,调成渐变,如图2.1.1 (图2.1.1) 于是乎出来了一个我们做出来了个这个样子的图形如图2.1.2 (图2.1.2) 然后我们用部分固定选定工具 选取长方形的上边两点如图2.1.3 (图2.1.3) 按住