900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > html5 制作 蝴蝶飞动的动态图片 fireworks制作蝴蝶飞gif动画

html5 制作 蝴蝶飞动的动态图片 fireworks制作蝴蝶飞gif动画

时间:2019-11-09 13:42:23

相关推荐

html5 制作 蝴蝶飞动的动态图片 fireworks制作蝴蝶飞gif动画

最近看到好多朋友在画:随着一只上下飞舞的小蝴蝶,漂亮的书法字就一笔一划地写出来了。那么我们也来看看吧。下面学习啦小编给大家整理了关于fireworks制作蝴蝶飞gif动画的方法,希望你们喜欢。

fireworks制作蝴蝶飞gif动画的效果如下:

fireworks制作蝴蝶飞gif动画的方法步骤:

fireworks制作蝴蝶飞gif动画的步骤1.在Fireworks中新建一个宽100像素、高120像素、画布颜色为自定义(颜色值为#C6E0FF)的文档。

fireworks制作蝴蝶飞gif动画的2.然后在左边工具箱中选择矩形工具 ,设置属性如下图所示(其中颜色值为#69ACFF),制作边框。

提示:如果这个矩形大小不合适,可利用Ctrl+T变形进行调整。

fireworks制作蝴蝶飞gif动画的3.在右边图层面板中将此层共享,然后新建一层。

fireworks制作蝴蝶飞gif动画的4.使用文字工具在上面打上合适的字,字的大小颜色等自行调整。(这里我设置的字体为华文行楷)

fireworks制作蝴蝶飞gif动画的5.如图,选中文字后,选择菜单修改/平面化所选,将这个文字层转化为位图。

fireworks制作蝴蝶飞gif动画的6.接下来在帧面板中选择重制帧,复制在22帧左右。(复制帧数按根据字的笔画多少有所不同)

fireworks制作蝴蝶飞gif动画的7.将素材中的蝴蝶复制在这些帧中(注意单数帧上放置合起翅膀的蝴蝶,双数帧放置张开翅膀蝴蝶)。

fireworks制作蝴蝶飞gif动画的8.用橡皮擦写字数的笔划(可以从后往前每帧擦掉一笔),并将该层的蝴蝶放在合适的位置。

提示:擦时注意调整橡皮擦大小,随时进行调节。

fireworks制作蝴蝶飞的效果如下图所示:

fireworks制作蝴蝶飞gif动画的10.画笔字完成后,将没有蝴蝶的最后一帧重置18帧(与提供的素材相同帧数,方便导入)。然后每帧调整文字的透明度,从99%每帧下调一点,一直到文字透明。

fireworks制作蝴蝶飞gif动画的11.选中第倒数第18帧(即刚制作好擦写完成的文字),选择菜单文件/导入,将素材动画蝴蝶导入进来。

fireworks制作蝴蝶飞gif动画的12.最后在帧中选中制作文字的部分帧(可利用shift一次加选),设置其帧延时30/秒。剩下的蝴蝶效果为15/秒。

fireworks制作蝴蝶飞gif动画的13.利用下方的播放预览后,最后就是导出漂亮的动画了。选择文件/图像预览,在保存设置中选择动画GIF接近网页128(这种图片效果不错而且比较小),单击导出即可。

(点击看大图)

素材(蝴蝶飞):

PNG源文件:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。