跟着女王ES学习动图制作（一）

     各位小伙伴们，是否和我一样的情怀，看到别人制作的动图总是羡慕不已。为了学会动图我也是拼了，从今天开始我决定跟着女王ES学习动图制作。高兴趣的小伙伴看过来！

    一、逐帧动画

    逐帧动画指利用Photoshop自带的时间轴制作的动画，每一帧都需要我们自己去绘制，然后一帧一帧的拼起来。

    比如说制作五帧的小动画具体操作：新建图层Ctrl+N-背景图层填充白色-新建五个图层Ctrl+Shitf+N-第一图层出现数字1-第一帧出现的是数字1-第二帧出现的是2-以此类推第三帧是3-第四帧是4-第五帧是5-窗口-时间轴-创建视频时间轴-点击左下角的三个小放块-时间轴这一列出现了类似右侧图层这样的一个窗口-点击新建图标-建立了第二个帧-多点几下。

     每一帧想要出现的图层，就相应的选中这个图层，把其他不需要出现的图层隐藏掉，点击五秒，即每一帧出现的间隔，我们设定为0.1秒，也可以根据自己的喜欢来设定其他时长。这里1次，点开有1次、3次、永远和其他，指的是循环次数，一般我们选择“永远”，点击播放动画，五帧动画做好了，小伙伴们动起手来吧。

    循环：如果我们想做一个不止五帧的动画，但是想利用五帧的动画来做，比如想做一个123454321一直循环下去的动画，再点一下，出现一个新的帧，设置为演示图层4；再新建图层，演示图层3；图层2，直接循环回去即可。

跟着女王ES学习动图制作（一）

    导出保存：文件-存储为web格式-预览-图像大小可以更改。快捷键Control+Shift+Alt+S同时按下，或用数位屏或数位板的一键来设置成这四个键加起来的快捷方式保存，点击存储在桌面。

    打开桌面gif文件，现在的动画背后是白色的，很多动画表情要求背景是透明的，回到ps,我们直接把背景图层隐藏即可，选择第三帧，把右侧的背景图层隐藏掉，现在大画布上显示出来“3”，背景图层是透明的；其他帧还是白色，这说明在时间轴里面调整图层，要一张张的修改。

     每一帧都添加或删除一个图层，选定第一帧，勾选背景图层，就会发现后面所有的图层都会和第一帧保持一致。

     二、动画表情完整的流程

    草稿：新建画布-时间轴-背景图层填充-新建图层1-先画呈现的一帧-新建图层2-把图层1透明度降低-选择图层2-​画动画形态-新建图层3-隐藏图层1-降低图层2透明度-图层3继续画-显示所有的图层-稍作调整-时间轴设置第一帧，第二帧和第三帧。所有动作比较生硬，不流畅，加轴，相邻的图层全部显示，降低透明度，中间加一图层，继续画，形态介于两则之间。调整的时候把透明度调整回来，要不断的调整播放来感觉下怎么用会更合适，确定帧数，如何循环，再存储。

    线稿：把所有的帧都删掉，把右侧所有的图层都显示出来，丢到一个组里面，新建6组，每个组放两个图层在正式绘制时，把所有要用的图层全部建立好。把草稿纸的透明度降低，一帧一帧的绘制。第一帧先勾线，隐去，透明度降低；第二帧以上一帧的线稿为准，这样会准确一点；继续勾线，因为这个动作是弹起来的动作，在画的时候注意某一个地方尽量不要变，就是背部贴地的地方，四肢可以适当地位移一下。同样的方式来绘制第四帧、第五帧，把草稿纸隐去，开始调试。

    上色：大部分动图表情都要求背景是透明的，这样上色的时候会更明显哪边没有涂好啊之类的，都可以直接显现出来。加一个饱和度比较高的图层，这样上色会比较明显。画草稿时要确定帧数、循环次数，会提高效率。画线稿的时候需要把上一帧的图层透明度降低，对着上一层来画新的一层，这样就能保证整体不会变形，位移不会过大。尽量在每一步奏画完之后都要在时间轴里面调试，以便及时发现问题调整纠正。把背景图层隐去，运行，有些地方上色没上全的再补一下，导出。

     描边-图层样式-10个像素-白色描边-复制图层，黏贴图层试样要在第一帧完成，其他图层自动会描边。

      小伙伴们赶紧动起手来，制作一个自己喜欢的动图小图标吧！