效果图

今天这个效果动画，做出来还是挺好玩的，仔细的看会特别的有意思，很适用于UI设计里面

二、教程

1、

• 首先打开我们的AE

2、

• 新建一个合成，1080*660px，持续时间5秒钟，画布颜色浅蓝色

• 然后右键点击时间栏，我们新建一个纯色图层（快捷键：ctrl+y），颜色也是为浅蓝色
• 然后用圆角矩形工具，在画布上画一个白色的圆角矩形（这里给大家一个小技巧，画圆角矩形的时候，按小键盘上的左右方向键，可以直接调节为直角或者圆角）
• 然后将白色圆角矩形的中心点移到画布中间，一会方便对齐
• 然后我们在点击椭圆工具，在白色圆角矩形里面按住shift画一个正圆，来作为我们的笑脸，颜色改为背景色
• 选中两个形状，我们垂直居中对齐

3、

• 我们点击正圆图层
• 按P键打开位置属性，在时间线为0秒的时候，我们打上关键帧
• 时间线移动到20帧，我们将正圆移动到右端
• 同理点击正圆图层，我们按S键打开缩放属性
• 在时间线为0秒的时候我们打上关键帧，将时间线移动了为10秒的位置，我们将缩放数值的锁链取消，单独改变后面的数值为80
• 最后在移动到20帧的位置
• 我们将值改为100

• 右键正圆-图层样式-颜色叠加
• 现在正圆变为红色，我们点击正圆-图层样式-颜色叠加-混合模式-颜色，我们将颜色改回背景色
• 我们再时间线为0秒时候，打上关键帧
• 然后将时间线移动到15帧的时候，颜色不变，继续打上关键帧
• 最后移动到20帧，我们将颜色改为黑色

4、

• 我们点击椭圆工具
• 在画布上画出两个正圆，来当笑脸的眼睛
• 在画一个正圆，画完正圆以后直接点击矩形工具
• 然后点击工具创建蒙版
• 绘制出矩形，把圆的上半部分遮挡住，这样我们就得到了一个半圆，来当嘴巴
• 在用布尔运算，相减，就行了

5、

• 我们点击两只眼睛和嘴巴的图层
• 都将他们的父级改为小圆，这样就可以跟着移动了
• 我们再选中两只眼睛，嘴巴，圆脸的图层
• 按S键，调出他们的缩放功能
• 现在我们按住Alt点击缩放前门的码表，我们打开缩放属性的表达式
• 找到两只眼睛和嘴巴图层的表达式：缩放
• 旁边有个父级的图标一样的图标，叫表达式关联器（将参考拉入目标）
• 我们将这个图标拉倒圆脸的缩放属性上，不是图层，是缩放属性，别错了
• 三个图层都这样拉动，这样缩放我们也关联了，效果和父级一样

6、

• 我们点击嘴巴图层，按M调出蒙版路径
• 我们再11帧的位置，为嘴巴上关键
• 然后移动到15帧位置，嘴巴不动，在打上关键帧
• 最后移动到20帧的位置，我们将蒙版拉到上方，只显示上半部分的圆
• 在按P键调出位置属性
• 我们先在0秒打上关键帧
• 然后将时间线移动到16帧的位置，我们位置不变，打上关键帧
• 最后移动到20帧的位置，我们将嘴巴往下移动一段距离和笑脸一样
• 现在选择所有图层，我们按U调出所有的关键帧
• 选择所有的关键帧复制
• 将时间线移动到1秒7帧，粘贴关键帧
• 右键关键帧-关键帧辅助-反向关键帧，这样我们整个动画就结束了

7、

• 现在让我们来看看最后的效果吧

结语：今天的教程看起来简单，其实比昨天的还要复杂点，主要是有个关联父级的知识比较的麻烦，但是非常好用，可以省去很多时间，还有新的布尔运算知识（总的来说新知识2个）