目录

 

正文

本文编辑于OS X系统,之前出现过windows下看不到部分图片的情况,如有请大家告知

为什么需要Lottie

在相对复杂的移动端应用中,我们可能会需要使用到复杂的帧动画。例如:
  • 刚进入APP时候可能会看到的入场小动画,带来愉悦的视觉享受
  • 许多Icon的互动变化比较复杂多变的时候,研发复现成本高
总而言之,我们的难题是: 这些事情如果给我们用CSS3(Web)或者Animated(RN)去实现是非常棘手的,而且因为研发人员和设计师之间本身无法做到心灵相通,导致如果全部交给研发者完成效果,做出来的结果往往也不能让设计师满意。同时开发成本实在太高太高。
 
诶? 那我们想,能不能把所有的动画交给设计师用设计工具(如AE)去做这些工作,然后直接导出一个文件给开发者去使用呢?如果这样,设计师就能完全独立自主,而开发者只要像“引用一张图片”那样去用这个动画就好了呀。
 
对,Lottie这个工具做的就是这件事。
 

Lottie动画简介

Lottie是一个用于Web和iOS(Android)的移动库,用于解析使用Bodymovin导出为json的Adobe After Effects动画,并在移动设备上呈现它们。设计师第一次可以创建和运送漂亮的动画,而无需工程师手工重新创建。
 
引用原文
Lottie is a mobile library for Web, and iOS that parses Adobe After Effects animations exported as json with Bodymovin and renders them natively on mobile! For the first time, designers can create and ship beautiful animations without an engineer painstakingly recreating it by hand.
参考文献