一篇也许有点过时但我认为依然值得一看的文章。
Lottie 的原理说起来很简单：在 Ae 中做好动画后使用插件导出成 json 文件，在程序中引入 Lottie 框架，就可以显示动画了。
事实上，一旦开始真正制作，就会遇到各种问题，尤其在初期安装插件上。
1.使用什么 Ae 插件导出 json 文件？
Bodymovin
2.Bodymovin 插件如何正确的获取、安装和使用？
参照文档指引，顺带一说， Lottie 的文档和 github 页面写得非常好，指引极度清晰。
3.Bodymovin 插件及 Lottie 支持 Ae 中的哪些效果？
见文档说明。
https://airbnb.io/lottie/#/
4.Sketch 中的图形怎么导入 Ae？
- 导出为 svg 后再转成 ai 文件
- 使用 Sketch2Ae 插件从 Sketch 直接导出到 Ae
补充：现在插件已经全新改名为AEUX
5.Sketch2Ae 怎么正确获取和安装？
遵循文档指引，到官网上获取和安装或者自行 google 搜索出来的第一项。
注意：不要使用 Sketch 里的 Runner 插件命令行安装，搜索到的是国内开发者开发的另一个同名插件，并不是 google 团队开发的版本，有兴趣可以从以下链接了解两者关系： https://zhuanlan.zhihu.com/p/28828769
6.Sketch2Ae 怎么使用？
参考官网上的详细步骤说明，再顺带一说，Sketch2Ae 官网上的使用教程也非常清晰。
7. svg 转成 ai 文件后，导入 Ae 前要做什么处理吗？
自行 google。
8. ai 文件怎么导入 Ae ？
自行 google。
9. 使用 Sketch2Ae 导出的渐变图层变成了位图怎么办？
- 那就使用位图；
- 在 Ae 里重绘图形；
- 去除渐变效果，导出图形，在 Ae 里重新添加渐变效果；
- 看下一部分的解决方法；
10. 开发文档中写明支持渐变但是为什么导出的变成了黑白渐变？
这个问题官方文档中没有描述，很有趣。 我在 github 的 issue 上逛了半天，出现这个问题的人很多，问题的产生与系统，区域语言设置，软件语言，插件版本，甚至色彩模式都可能有关系，所以提出的解决方法也很多，「对症下药」的难点是变量太多，一时也难以确定原因，只能把看到的方法都尝试一下。
我的系统版本：macOS 10.12.6
软件版本：Ae CC 2017（简体中文）
插件版本：Bodymovin 5.5.18
实测对于本机可行：
方法1： 用任何一个编译器打开 json 文件，搜索如下代码：
其中 [0,1,1,1,1,0,0,0] = [0,r,g,b,1,r,g,b]，每四项表示一个颜色，首位1/第五位0=渐变位置，r=红色/255，g=绿色/255，b=蓝色/255，颜色换算出来后填进去，以下为例子：
方法2： 将图层的渐变名称 Gradient 1，实测了一下以下名称：
可行：Gradient / Gradient 1 / gradient 1 / Gradient1
不可行：gradient
后来抽空又测试了一些随意起的英文名称，都可行，识别规律未明，建议还是用以上的名称。
实测对于本机不可行
方法3：
在渐变编辑器里把 TSL 改为 RGB 方法 1 和 3 都来源于以下文章：
https://medium.com/@mehdi.boumendjel/after-effects-x-bodymovin-x-lottie-gradients-black-white-rendering-issue-1ab36f2a2353
以下链接也有提及： https://github.com/airbnb/lottie-web/issues/719
方法4：
保存后再导出 json（一般是问按照上面的方法做了为什么没有效果的人需要的解决方法）
方法5：
合成名字改成 comp
方法6：
Windows 系统下，修改系统区域后修改 Ae 语言，详细参考以下链接：
https://github.com/airbnb/lottie-web/issues/1201
11. 怎么预览我的文件是否正确？
- 使用 Bodymovin 中的生成预览
- 在线地址预览：LottieFiles - Free animation files built for Lottie
- 移动端预览：Lottie Files
12. 图形在 Ae 中预览没有问题，但是最终输出有问题
从 Sketch 中导入时必须是纯粹的图形，不能是由布尔运算计算出来的图形，简而言之，必须使用 Flatten 工具处理图形后才能导出。
13. 我的图形全绿了！
我在一个项目中存在多个合成，每个合成中均有渐变，导出时发现所有的渐变都绿了（其实是都变成了第一个合成的渐变颜色）。 没有在网上搜索过原因，大概能猜到原因：具有渐变的图形，渐变属性都是从另外一个图形复制而来的，之后再进行颜色的修改。虽然颜色不一致，但是渐变的名称都是Gradient1，插件对相同的名称的属性进行了统一处理。
解决方法也很简单： 重命名渐变的名称或者将合成分离到多个项目中都可以解决。
大部分基础问题，会查阅官方文档基本没有问题，值得一看的是关于渐变的问题，不过我也不清楚现在官放层面上解决这个问题没有，希望对看到的读者们有帮助。
