Lotie是Airbnb开源的一套动画渲染库，可用于Web、Android，iOS。它体积小，质量高，可以实现非常漂亮的动画。
可以先看看它所实现的动画效果：https://lottiefiles.com/
具体来说，它可以通过Bodymovin插件解析AE（adobe After Effects）导出生成JSON文件，并在IOS、安卓、Web、React Native端实现相同的动画效果，也就是说，设计师可以将AE中的部分动画直接输出给研发同学使用。
Lottie相关网站：
- Lottie 官网
- Lottie on Github
- Lottie for Android
- Lottie for iOS
- Lottie for Web
- Lottie for React Native
- Lottie for Vue
使用准备
1.1下载并安装最新版本的 Adobe After Effects
地址：https://www.qssily.com/app/1074.html
1.2下载安装 Bodymovin
1.2.1 要想使用Bodymovin插件，要先安装 ZXP Installer扩展
下载地址：https://aescripts.com/learn/zxp-installer/
1.2.2 然后再下载 bodymovin 扩展
下载地址：
https://github.com/airbnb/lottie-web/blob/master/build/extension/bodymovin.zxp
1.2.3先安装好ZXP Installer扩展，安装好后，打开File选项，再打开（Open）刚刚下载好的bodymovin扩展
1.2.4打开Adobe After Effects，打开扩展就可以看到Bodymovin了
如何使用
安装好必要的工具之后，我们就可以开始使用了，使用前需要给大家推一个Lottie动画库
LottieFiles 提供了很多设计师上传的 Lottie 动画，并提供预览的效果，并且可以直接下载成 JSON ，或者生成二维码，可供 Lottie App 扫描看效果，非常的方便。
有了这个网站，我们导出的动画JSON文件就可以在线预览，当然，你也可以从LootieFiles上下载动画文件，通过Bodymovin导入AE，进行二次加工
我们在AE里制作好动画，然后通过Lottie的Bodymovin扩展导出，导出的动画JSON文件给到开发者使用，这就是Lottie实现动画渲染的整个工作流程
关于Lottie的详细使用方法，网上已经有视频教程，这里推荐一位字节跳动动效师出的教程，看完他的视频，就可以掌握Lottie的用法了
地址：https://www.notion.so/heyjerio/
最后关于Lottie 动画利弊
好处：
- Lottie 只需要解析导出的 JSON 文件及所需要的图片，就能在各个平台上实现动画效果，上线后可动态替换对应的 JSON 文件就能实现，可配置、可运营；
- 动画由设计使用专业的动画制作工具 Adobe After Effects 来实现，使动画实现更加方便，动画效果也更好；
- 各平台 RD 可以方便的调用动画，并对动画进行控制，减少 RD 动画编程工作量；
- 还原程度好；
- 体积小，JSON 文件大小通常会比 gif、webp 文件小很多。
不足：
- 很多 AE 常用的 Effects / 特效、Layer Styles / 图层样式不支持，如高斯模糊、外发光等；
- 部分 AE 中的动画属性不支持导出，或不同系统设备展示效果不一，如 iOS 端实现的时候不能识别JSON 文件中 Alpha Inverted Matte /反向蒙版（Alpha Matte / 正向蒙版支持），但是 Android 可以识别。
- 形状图层的大多数属性都支持，但比如 Merge Path / 合并路径、Wiggle Path /扭动路径 等还是不支持；
- 渐变支持的不好，看系统以及 Lottie 版本，需修改 JSON 代码；
以上供参考，具体以官方更新的动画支持情况为准；
厉害