网页美工技巧之如何制作GIF动画

    动画是网页中除静态图像外的另一个重要辅助表现手法，使要表现的内容更有动感，更活泼，更有灵动的美感。但因网络速度等因素的限制，一般动画体积都做的较小，而格式也大多采用GIF图片类型的动画。那么做为网页美工如何制作GIF动画呢？下面我就通过一个小实例来简要说一下GIF动画的制作方法。

    动画是由多幅画面组成的，其中每一幅画面称为一个动画帧。在网络世界中最常用的动画格式是GIF格式，要创建动画，需要打开一个多层图像文件，通过创建新帧和对层进行编辑，来制作动画。每一个图层在动画中都是一个独立的对象，对图层所做的更改，如隐藏、显示或移动，使用不透明度或效果，都会体现在每个帧中，这是我们做为网页美工所了解的常识性知识。

    下面通过一个实例来说明其制作过程，具体操作步骤如下。

    （1）在Photoshop中新建一个图像文件，图象尺寸为400╳400像素，分辨率为72像素/英寸，如图1所示。

    （2）在图层面板中单击“新建图层”图标按钮，增加一个新的图层；在工具箱中选择椭圆选取工具，在图像窗口中制作图形选区。在工具箱中选择径向渐变工具，选择“红色到白色”渐变，在选区内填充变色，其结果如图2所示。

    （3）执行菜单中的[编辑]→[自由变换]命令，将球压扁成椭圆球体，形成卡通人物的头部。使用铅笔工具给卡通人物画上嘴，如图3所示。

    （4）新建3个图层，分别命名为“全开”、“全闭”，用于制作眼睛的3种形态。利用相应选框工具和渐变填充工具，分别在各自的图层上制作出卡通人物的眼睛及眉毛，如图4所示。然后将文件保存成为PSD格式文件“卡通”。

    （5）单击工具箱中的切换图标按钮，切换到ImageReady程序中，选择菜单中的[文件]→[打开]命令，打开刚保存过的“卡通”文件，如图5所示。

    （6）在图层面板中显示全开图层，其他图层隐藏。在动画面板中自动形成动画第一帧，显示卡通人物的眼睛处于全开状态，如图6所示。

    （7）在动画面板中单击“复制当前帧”图标按钮，创建一个新帧，并在图层面板中，隐藏“全开”图层，打开“半开”图层，在第二帧中显示卡通人物的眼睛处于半开状态，如图7所示。

    （8）在动画面板中单击“复制当前侦”图标按钮，创建第三个动画帧，在图层面板中，隐藏“半开”图层，打开“关闭”图层，显示出卡通人物眼睛的全闭状态，如图8所示。至此，动画帧设置完成。

    （9）在动化面板下方调整每一帧的显示时间，单击“播放动画”图标按钮，观察动画播放效果。

    （10）选择菜单中的[文件]→[将优化结果保存为]命令，将其保存为GIF格式的动画文件“卡通”。如果希望在IE浏览器窗口中预览动画效果，可以选择菜单中的[文件]→[预览]→[Internet Explorer]命令，此时系统将自动打开浏览器并播放动画，最终效果如图9所示。

    以上小例子是关于一个小卡通动态图片的制作过程，当然也可以把多张照片做成动画来表现，也可以用剪辑的电影来做GIF动画，都是可以的，这需要我们网页美工人员在实际工作中做到触类旁通，举一反三。如果您对网页美工类的知识感兴趣，欢迎您到网访问咨询，也可以按您的需求情况发布任务信息，网的众多专业人士将积极与您合作完成工作任务。