前段时间，Airbnb出了个移动端的动画库Lottie，可以和一个名叫Bodymovin的AE插件结合起来，把在AE上做好的动画导出为json文件，然后以Android/iOS原生动画的形式在移动设备上渲染播放。AE（Adobe After Effects）可是视频后期特效和动画制作的行家，现在把安装和使用方法分享给大家。
下面就分步骤总结下Bodymovin的安装和使用
如果电脑上没有AE的话，需要安装AE CC2014或更高版本。以AE CC2017为例：
（AE CC2017 欢迎界面）
1.png
AE安装完成后，安装Bodymovin插件。
2.1到GitHub的首页下载Bodymovin插件包（地址：https://github.com/bodymovin/bodymovin），下载或者克隆插件包到本地。
2.png
2.2在项目目录的“/build/extension”目录下找到“bodymovin.zxp”文件，然后双击安装此插件。（安装过程中关闭AE软件）如果没有如下图片，先不用管，先进行下一步2.3操作。
image.png
2.3下载ZXP Installer（地址：[http://aescripts.com/learn/zxp-installer/），然后双击打开软件，点击“File”>“Open”菜单项载入上述bodymovin.zxp插件包，ZXP Installer会自动开始安装。安装完成后的软件主页面如下图所示，表示插件已成功安装。
image.png
打开AE，点击“编辑”>“首选项”>“常规”菜单项，选中“允许脚本写入文件和访问网络”，点击确定。
4.png
4.点击“窗口”>“扩展”>“Bodymovin”菜单项，就可以打开Bodymovin的界面使用插件了。
5.png
我们在空的AE项目里，新建一个名为“视频”的合成，并制作一段简单的动画：
22.png
打开Bodymovin插件窗口，可以发现“视频”出现在了下面的列表中。选中“视频”，设置好json文件输出位置，点击“Render”。
11.png
Bodymovin还为生成出的json文件提供了预览功能，点击插件界面上的“Preview”按钮，点击“Browse”载入刚刚生成的json文件，就会看到，动画被原汁原味地导出了：
00.png
作者：ui_小鸡蛋
链接：https://www.jianshu.com/p/9a1500571269
来源：简书
网友评论