不知道大家有没有这样的困扰，每次制作GIF图的时候，难免会出现边缘锯齿，就算加上白边之后，在夜晚模式的时候锯齿就更明显了。除此之外，GIF图对于渐变填充的呈现也很糟糕，会出现渐变断层的情况，看起来很不自然。
稍微把动画做流畅一些，GIF的文件大小就变得巨大无比。
在2017年的时候，一款比GIF动画更好用的动画图片格式诞生了！！！
Lottie动画是一种基于 JSON 的动画文件格式，允许在任何平台上发送动画，就像发送图片一样轻松。Lottie是可在任何设备上运行的小文件，并且可以放大或缩小而不会出现锯齿的一种动画格式。
和GIF、Apng 或 MP4 等其他格式相比，Lottie 动画要小得多，同时保持相同的动画表现，甚至更流畅。
Lottie动画是基于矢量设计制作的，这意味着可以随意放大或缩小它们，而不必担心分辨率的大小导致的锯齿问题。放大无数倍也是清晰如初。
对于所有开发人员来说，Lottie动画的交接非常简单。现在我们可以在 iOS、Android、Web 和 React Native 上使用 Lottie 动画，也不需要修改。使用和调用都非常方便。
在 Lottie 动画中，动画元素可以设计为可交互组件，用户可以操纵它们进行交互，实现滚动、单击和悬停等交互效果。这是GIF、Apng和MP4等动画文件都没办法做到的。
目前，Lottie官网提供了很多动效设计软件的插件供大家使用和下载。目前下面这些设计软件可以在官网下载到Lottie动画的导出插件。
其中，Lottie Creator是Lottie官方的网页版动画制作工具，登录官网就可以使用。
Lottie官网地址
https://lottiefiles.com
说了这么多Lottie的优点，其实Lottie也是有短板的。比如说，AE里面的fx效果，Lottie就全部不支持，另外复合路径动画等等动效效果也不支持。
为了方便大家快速上手Lottie动画，作者把Lottie支持的效果整理归类成了几张图片，方便大家制作的时候快速查阅。
作者：江浩大叔工作室
链接：https://www.zcool.com.cn/article/ZMTYxODY4MA==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
