首页  ·  知识 ·  前端
光线掠过效果
linkmeng  linkmeng  综合  编辑:dzstudio  图片来源:网络
今天,我将向大家介绍极cool的光线掠过
今天,我将向大家介绍极cool的光线掠过效果的制作过程,在开始学习之前,您必须对下面的技术有所了解:
  •  移动变换和形状变换(Motion & Shape Tween)
  •  颜色渐变(Gradients)
  好了,让我们先来看看成品动画吧~~怎么样,Cool吧。:)

Ray.swf 11k
  由于本教程制作过程比较复杂,故本文仅以第一个字母为例,其他字母的制作过程完全一样,只是开始的时间比第一个滞后5-10帧而已。
1.首先,我们需要新建2个图层。一个名为top,用来放置字母,另一个用来放置光线效果。为了使光线的效果更为逼真,我们将动画的背景颜色(用ctrl+m修改)设置为黑色。
2.用文字工具在top层里输入一个字母,将其打散(Ctrl+B),并复制(Ctrl+C)。
3.按Ctrl+F8新建一个名为“A-light”的symbol,粘贴(Ctrl+V),我们将在这个图层里实现字母的光线运动效果,具体为一下3个步骤,如图:
  • ( Step #1 )从字母的末端出发,用铅笔(Line)工具画两条直线,并围成类似光线的区域。
  • ( Step #2 )填充刚才的光线区域,并将边缘多余的线条删除。
  • ( Step #3 )用由黑到白的渐变色(Gradients)填充上述区域。
4.好了,字母的光线效果symbol已经完成了,我们的工作也完成一半了。:) 将它(A-light)放置到主场景的第二个图层中(就是top下面那层)。接下来要做的就是利用Motion/Shape变换使光线看起来更加逼真。
5. 光线淡入——要实现光线的出现部分。按住ctrl键,将第1帧复制到第6帧。回到第1帧,右键单击这个关键帧,Color Effects--Tint--100% Black(即将颜色设为黑色),并创建Motion Tween。
   光线移动——在第6帧上也创建一个Motion Tween;将第14帧创建为关键帧,将这个symbol向右做一定角度的缩放。注意:光线的边缘一定要和字母的所在位置吻合。
  光线淡出——在第14帧创建最后一个Motion Tween,并在第22帧里(这是本图层的最后一个帧)将symbol略微放大,同“光线淡入”类似,将颜色设为100% Black 。
6.很好,光线部分的变换我们已经完成了,下面要做的就是对字母(top层)进行一定的变换,使之与光线的变换相协调。
  ■ 字母淡入——对应于上面Layer的每个Keyframe,我们在第1个关键帧上创建Motion tween,并将里面的Symble颜色设定为100% Black。在第14个关键帧里,将该Symble颜色设定为白色。这样做将会使字母在光线掠过时呈现出由黑变白的效果。   
  ■ 字母保持——为了维持字母的亮度和颜色,我们需要创建一些帧。
  ■ 字母淡出——在第18个关键帧上再创建一个motion tween,并在第22个关键帧里重新将这个字母颜色设定为白色。
  ok!这样我们就完成了第1个字母的光线掠过效果,你要做的工作就是重复上面的步骤,将其他的字母和光线做好。注意呦,工作的时候一定要仔细和耐心,因为一点点的错误就会导致动画很不协调。假如你对本文不大明白的话,请单击这里下载源文件,慢慢看。:
本文作者:linkmeng 来源:linkmeng
CIO之家 www.ciozj.com 微信公众号:imciow
    >>频道首页  >>网站首页   纠错  >>投诉
版权声明:CIO之家尊重行业规范,每篇文章都注明有明确的作者和来源;CIO之家的原创文章,请转载时务必注明文章作者和来源;
延伸阅读