14979597539457.png
优点
1. 通过 Canvas 绘制动画⾮常⾮常流畅，并且在 AE 动画没有遮罩的前提下内存控制得也⾮常好，基本可以取代⽤ GIF 做动画
2. ⼀个 JSON ⽂件可以同时复⽤于 iOS、 Android和React Native，免去了动画重复开发实现，并且还原度都⽐较⾼。
总的来说，这个动画库为跨平台低成本动画实现提供了⾮常有想象⼒的解决⽅案，⼀旦做成了对很多前端同学会有⼀定的冲击......毕竟以后做⽜逼的动画可能就不那么稀奇了。
顺便，设计师们赶快去抓⼀抓 AE 吧，以后实现原⽣动画可能就没那么费劲，许多好效果也都可以慢慢搬上台⾯了。
以前
在 Android、iOS、React Native 上实现⼀套复杂动画是⼀件蛮困难⽽且耗时的事。开发者们不仅要为各种屏幕尺⼨加载⼀⼤堆素材，还得写成百上千⾏⽣硬、难维护的代码。正因如此，绝⼤部分 App 都不愿意使⽤动画 —— 尽管动效对⽤户体验来说是⼀个强⼤的⼯具。
使⽤场景和效果
14979608110448.gif
实现特效的代码js
Lottie 让⼯程师们可以轻松实现丰富的动画效果。我们所熟悉的如 Nick Butcher 的跳动进度条效果、Bartek Lipinski 的汉堡菜单栏动画、Twitter 的爱⼼动效就是实现动画费时费⼒的最好代表。⽽通过 Lottie，⼯程师可以准确地实现设计师所要的动画效果，并且使得那些与动画框架做⽃争、猜测动画时间和⼿动重建动画曲线等等繁复的操作成为历史。
我们的⽬标就是尽可能准确地实现 AE 制作出来的动画，Lottie 提供的⽰例 App 将会向⼤家展⽰如何利⽤ AE 和 JSON ⽂件快速、灵活且精确地实现动效。在⽰例中，也提供了很多复杂动画的源⽂件，包括以线条为基础的动画、以字体变形为基础的动画、动态 Logo 以及多⾓度多切⾯的效果。
14979610569405.gif
⽬前的 Airbnb App 中已经有不少动画是通过 Lottie 实现的，如应⽤内通知、全动画引导、评价页⾯等。接下来我们还打算在趣味性的动画上进⼀步拓展。
14979611089236.gif
Airbnb简介
Airbnb 是⼀家全球化的公司，服务于数百万旅⾏者和房主，因此我们的动画也将运⾏在各种各样的设备和平台上。尽管 Marcus Eckert 的Squall 和 Facebook 的 Keyframes 库和 Lottie 很相似，但我们各⾃的⽬标略有不同。
Facebook 为专注于响应式布局，只选择⽀持了少数 AE 动效，Lottie 则打算尽可能多的实现效果本⾝。Squall 的 AE 预览 App 是⾮常有⽤的⼯具，但它⽬前只⽀持 iOS，所以我们的⼯程师需要跨平台的解决⽅案。
Lottie 的 API 中集成了许多很棒的功能，让整体变得更佳⾼效和易⽤：它⽀持通过⽹络加载 JSON ⽂件，这对 A/B 测试⽅案⾮常有⽤；它有可选的缓存机制，能⽀持调⽤缓存中的动画；动画的速度、相关联的⼿势都可以通过简单的参数来控制；甚⾄ iOS 中还⽀持在 Runtime 中添加额外的原⽣ UI ，从⽽实现复杂的过渡动画。
除了⽬前已有的各个功能之外，未来我们还打算为 Lottie 动画增加 mapping 视图、转场视图等功能。
前景
Airbnb 将 Lottie 在 GitHub 开源出来，正是希望它能成为连接开发者和设计师们的⼀个桥梁，让所有喜欢动画的⼈都加⼊进来。
9 Squares, Motion Corpse, 和 Animography 等动画交流社区的兴起让我们倍受⿎舞，它们让全世界的动画⼈连结到⼀起，即便这些⼈从来没有⼀起⼯作过。虽然这个过程伴随各个团队之间持续⼏个⽉的争吵，但毫⽆疑问，最终的成果对动画界来说价值⾮凡。
在这些⼈的引领下，Airbnb 接触到这三⼤动画社区，并将来⾃它们的许多动画增加到我们的⽰例 App 中。我们相信把这些惊艳的设计整合到Lottie 强⼤的⼯程师社区中，将会点燃创意的⽕花。
14979613771552.gif

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。