Fireworks简单方法设计网页闪字动画效果

   最近网络上很流行一种超炫的闪彩文字及签名,在QQ空间里、论坛签名里、各类回贴和博客都有炫彩闪字的身影,一些具有个性的闪字还相当耀眼,那么这种炫彩字是如可制作出来的呢?其实制作炫彩字并不难,我们在Fireworks中用闪底素材+粘贴于内部的制作方法,可以省去相当大的工作量,是一种别出心裁的方法哟!

  下面我们来看看闪字的效果。


  部分完成效果

  制作步骤:

  1.打开Fireworks软件,新建一个透明背景的文档。(文档大小可以先设置为390×68像素,如果不合适,后期再进行修改)


  新建一个透明背景的文档

  2.利用左边工具箱中的“文本工具”

  在画布中输入文字,然后在下方“属性面板”中调整文字的大小/字体,并在“消除锯齿级别”中设置为“强力消除锯齿”。


  在“消除锯齿级别”中设置为“强力消除锯齿”

  3.接下来在“帧”面板中将第1帧拖到“新建/重制帧”按钮上

  2将,如下图所示,共制作成3帧。(一般是看闪底素材有多少帧,然后就制作几帧)。


  在“帧”面板中将第1帧拖到“新建/重制帧”按钮上

  8.接下来就是对闪底素材的编辑了,一般的闪底并不是我们想要的大小,有时会比字小,所以我们就需要编辑一下,首先要打开闪底素材,单击下方“属性面板”中的“画布大小”,调整为闪字画布大小。


  打开闪底素材,单击下方“属性面板”中的“画布大小”,调整为闪字画布大小。


  闪底素材

  9.然后在“帧”面板中单击洋葱皮按钮,勾选“多帧编辑”,并将结束帧滑块拖到最后一帧上,并框选所有图像内容。


  将结束帧滑块拖到最后一帧上,并框选所有图像内容

  10.这样,框选中的是三帧中的对象,利用移动工具移到画布最左边,然后利用ALT+移动复制对象至满画布,然后保存并关闭闪底。


  利用ALT+移动复制对象至满画布

  11.回到刚才我们闪字的这个制作画布中,选择菜单中“文件—导入”(Ctrl+R),选择导入刚才修改并保存的闪底素材图。


  选择导入刚才修改并保存的闪底素材图

  (提示:要在第1帧中导入,不要选择其它帧,否则会出现前面的没有效果,后面却多出帧的结果。)

  12.导入后会看到动画元件布满了整个画布,然后选中闪图,按Ctrl+X剪切下来。


  导入后会看到动画元件布满了整个画布

  13.单击第1帧中的文字,将其选中后选择菜单中的“编辑—粘贴于内部”。


  选择菜单中的“编辑—粘贴于内部”。

  这时再点击预览会发现,闪字动画已经制作好了。


  闪字动画

  14.闪字制作完成后,接下来就是将这个闪字图像保存为动画Gif格式,可以选择菜单中“文件—图像预览”命令,在“图像预览”窗口中先单击预览按钮看一下动画效果,然后再单击“导入”按钮导出Gif图像。


  先单击预览按钮看一下动画效果,然后再单击“导入”按钮导出Gif图像。

  到此,闪字就制作完成了,下次给大家讲解闪图的制作。

时间: 2024-11-08 19:11:34

Fireworks简单方法设计网页闪字动画效果的相关文章

Fireworks简单方法打造网页“闪字”动画

网页 最近网络上很流行一种超炫的闪彩文字及签名,在QQ空间里.论坛签名里.各类回贴和博客都有炫彩闪字的身影,一些具有个性的闪字还相当耀眼,那么这种炫彩字是如可制作出来的呢?其实制作炫彩字并不难,我们在Fireworks中用闪底素材+粘贴于内部的制作方法,可以省去相当大的工作量,是一种别出心裁的方法哟! 下面我们来看看闪字的效果. 制作步骤: 1.打开Fireworks软件,新建一个透明背景的文档.(文档大小可以先设置为390×68像素,如果不合适,后期再进行修改) 2.利用左边工具箱中的"文本工

Fireworks快速简单打造网页“闪字”动画

最近网络上很流行一种超炫的闪彩文字及签名,在QQ空间里论坛签名里.各类回贴和博客都有炫彩闪字的身影,一些具有个性的闪字还相当耀眼,那么这种炫彩字是如可制作出来的呢?其实制作炫彩字并不难,我们在Fireworks中用闪底素材+粘贴于内部的制作方法,可以省去相当大的工作量,是一种别出心裁的方法哟! 下面我们来看看闪字的效果.文章末尾提供闪图素材包供大家下载参考.         制作步骤: 1.打开Fireworks软件,新建一个透明背景的文档.(文档大小可以先设置为390×68像素,如果不合适,后

PS制作出漂亮的双向流光字动画效果

  双向流光字,用PS其实很好制作出来的,没有很多细节的东西 下图是在效果图的基础上修改了一下(把图层1和图层2的改为白色) 方法/步骤 1.按快捷键"CTRL+N"新建一个画布 大小根据自己要制作的文字来设定 这里小编设定700x400像素 2.然后我们选择"文字工具" 打出你要制作的文字 颜色字体根据你的喜好来定 这里小编输入"平生不会相思,才会相思,便害相思......"然后按快捷键"CTRL+T"调整字的大小 (不要在

photoshop设计绚丽光束文字动画效果制作教程

给各位photoshop软件的使用者们来详细的解析分享一下设计绚丽光束文字动画效果的制作教程. 教程分享: 1.新建一个700 * 500像素的画布,背景填充黑色,选择文字工具,打上想要的文字,字体颜色用蓝紫色:#8316fe,效果如下图.   <图1>2.把文字图层复制一层,然后右键选择"栅格化文字".确定后新建一个组,把栅格化后的文字拖到组里面,并再复制一份,如图3.   <图2>   <图3> 3.把文字移到画布的靠右位置,如下图.   <

Photoshop简单方法调出人像艺术油画感效果

  本教程主要使用Photoshop简单方法调出人像艺术油画感效果,一副好的画面包含很多构成因素:色彩.明暗对比.曲线感等,即使同一张图片,换成不同的色调.修改成不同亮度都会给观者带来不同的视觉感受,所以后期在数码摄影里也占据了很重要的位置. 美女摄影师蝴蝶以下面的这张照片为例,为大家分析她的后期手法.在这幅图中做了二次构图,简单去除杂色,改变色调几个步骤. 在PS的Camera Raw打开原图,很多人会忽略这一步,而其实这里的设置也是很重要的,不仅能够挽救回一定的失败曝光参数,也可以进行相机原

JS实现网页右侧带动画效果的伸缩窗口代码_javascript技巧

本文实例讲述了JS实现网页右侧带动画效果的伸缩窗口代码.分享给大家供大家参考,具体如下: 这是一款带缓冲效果的网页右侧固定伸缩窗口,点击带颜色的区域,浮动的层窗口就会伸缩出来,再次点击则缩进去.无jQuery,完全JavaScript实现的效果. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-right-dh-dlg-style-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XH

Android仿ViVO X6 极速闪充动画效果_Android

一直都在看自定义View,经过一个星期的坚持,基本上能够写出一些比较实用的控件效果了,今天天气太热,就待在家里玩手机,然后手机没电了,在充电的时候,看到了手机的充电动画,觉得挺酷,然后自己我就仔细的分析了一下这里的动画内容,就觉得,这个我也能写出来,所以就有了这篇博客.纯属原创. 先看看效果,因为图片的原因,只能看到静态的. 这个就是效果图了.当然了,这么看好像不怎么样,但是配上了动画,还是挺好看的. 自定义控件的话,其实做的多了,运用的多了,就会觉得自定义View,跟在Photo shop 里

Android仿ViVO X6 极速闪充动画效果

一直都在看自定义View,经过一个星期的坚持,基本上能够写出一些比较实用的控件效果了,今天天气太热,就待在家里玩手机,然后手机没电了,在充电的时候,看到了手机的充电动画,觉得挺酷,然后自己我就仔细的分析了一下这里的动画内容,就觉得,这个我也能写出来,所以就有了这篇博客.纯属原创. 先看看效果,因为图片的原因,只能看到静态的. 这个就是效果图了.当然了,这么看好像不怎么样,但是配上了动画,还是挺好看的. 自定义控件的话,其实做的多了,运用的多了,就会觉得自定义View,跟在Photo shop 里

绚丽的闪字动画-Flash AS特效

代码如下:import mx.transitions.*; import mx.transitions.easing.*; var r:Number = 45; var p:Number = 0; var drag:Boolean = false; var num:Number = 0; var name_array:Array = new Array("闪", "吧", "2", "0", "0", &q