不知道大家有沒有這樣的困擾，每次制作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
來源：站酷
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。
