UI动效小记

在dribbble上看到设计师Taras Migulko的作品，配色非常好就临摹一下。

下面开始记笔记~~~

先用PS画（1600px宽)；PSD直接拖入AE(600×800px）做动效；AE导出.mov格式，拖入PS导出为gif~

静态设计稿我使用了栅格系统，和原作品有出入。分12栏无间隔。

这次动效用到了Alpha遮罩，木偶图钉工具。

Alpha遮罩和形状遮罩的区别就是Alpha遮罩相当与PS的剪切蒙版，遮罩图层不会随着变化。

木偶图钉工具，只适合小幅度的变化，比如这次动效中的裙摆，沙发上男子勾脚动作等。

动效调整好，PS导入的所有图层做一个预合成，不动的部分在AE里直接用矢量工具画完，给刚刚的预合成加一个外发光的效果，就完成了。

AE导出.mov后直接拖入PS，最新的PS可以直接导出gif，不用png序列帧去做了，非常方便。动效都是最简单的一些放大缩小旋转位置等，上面3点是这次动效get的新技能~希望自己继续做更多的练习~