比GIF更好用的Lottie动画是什么？

       不知道大家有没有这样的困扰，每次制作GIF图的时候，难免会出现边缘锯齿，就算加上白边之后，在夜晚模式的时候锯齿就更明显了。除此之外，GIF图对于渐变填充的呈现也很糟糕，会出现渐变断层的情况，看起来很不自然。

最让人难以接受的情况是：

        在2017年的时候，一款比GIF动画更好用的动画图片格式诞生了！！！

        那就是我们今天将要介绍的Lottie动画。

       Lottie动画是一种基于 JSON 的动画文件格式，允许在任何平台上发送动画，就像发送图片一样轻松。Lottie是可在任何设备上运行的小文件，并且可以放大或缩小而不会出现锯齿的一种动画格式。

 

和GIF、Apng 或 MP4 等其他格式相比，Lottie 动画要小得多，同时保持相同的动画表现，甚至更流畅。

Lottie动画是基于矢量设计制作的，这意味着可以随意放大或缩小它们，而不必担心分辨率的大小导致的锯齿问题。放大无数倍也是清晰如初。

对于所有开发人员来说，Lottie动画的交接非常简单。现在我们可以在 iOS、Android、Web 和 React Native 上使用 Lottie 动画，也不需要修改。使用和调用都非常方便。

在 Lottie 动画中，动画元素可以设计为可交互组件，用户可以操纵它们进行交互，实现滚动、单击和悬停等交互效果。这是GIF、Apng和MP4等动画文件都没办法做到的。

       目前，Lottie官网提供了很多动效设计软件的插件供大家使用和下载。目前下面这些设计软件可以在官网下载到Lottie动画的导出插件。

其中，Lottie Creator是Lottie官方的网页版动画制作工具，登录官网就可以使用。

 https://lottiefiles.com

       说了这么多Lottie的优点，其实Lottie也是有短板的。比如说，AE里面的fx效果，Lottie就全部不支持，另外复合路径动画等等动效效果也不支持。

       为了方便大家快速上手Lottie动画，作者把Lottie支持的效果整理归类成了几张图片，方便大家制作的时候快速查阅。