如何看待 Airbnb 新发布的 Lottie？

长久以来设计师的越炫酷越好”与程序猿的“够用就好”的矛盾在自定义动画上体现的尤为明显。我相信还原一个优秀动画的过程中,二者的“撕逼”是无止尽地，一场“撕逼”下来双方都是一肚子苦水，此处略去一本辞海 ... ...

作为一个设计师我“曾经”天真的想过，有没有一键将动画生成代码的工作流。说真的我幻想了很久，最近似乎这个幻想慢慢地接近成真了！！虽然之前已经出现了squall、bodymoving（它已经很具有想象力了，但是今天的这个开源动画库，让它的想象力成为了真正的生产工具）等工具，但都有其局限性，要么平台限制，要么动画元素的局限性。

不过，一个革命性的开源动画库诞生了！

我们有了一个衔接设计与开发的新的工作流，它就是Airbnb 发布的 Lottie ！

Lottie 的使用流程很简单，就是在AE中设计完成你的动画后，通过bodymoving插件导出一份记录动画信息的JSON文件，然后开发人员使用 Lottie 的Android，iOS，React Native apps开源动画库读取这份JSON文件。

工欲善其事必先利其器！

• Adobe AE CC 2017版本
• ZXP installer 一个AE插件与脚本安装工具
• bodymovin 一个将AE合成转换为记录动画信息的JSON文件的插件
• Lottie Android iOS React Native Lottie 开源动画库

一一倒腾之后，就可以体会它的无穷魅力了，在朋友圈得知此消息后已经乐此不疲的折腾了好久了，以后再也不用导出gif图了，以后做动画似乎可以肆意挥霍自己的任性了？！

···················· 以下内容不定期更新 ····················

目前 Lottie开源动画库/bodymoving 支持的AE属性

Keyframe Interpolation 关键帧插值
Linear Interpolation 线性（关键帧）插值
Bezier Interpolation 贝塞尔插值
Hold Interpolation 定格插值
Rove Across Time 漂浮插值（漂浮穿梭时间 ）
Spatial Bezier 空间插值
Solids 固态层
Transform Anchor Point 描点变换
Transform Position 位置变换
Transform Scale 缩放变换
Transform Rotation 旋转变换
Transform Opacity 透明度变换
Masks 蒙版
Path 路径
Opacity 透明度
Multiple Masks (additive) 多个蒙版（叠加模式）
Track Mattes 遮罩模式
Alpha Matte 带alaha通道的遮罩
Parenting 父子关系
Multiple Parenting 多级父子层
Nulls 空对象
Shape Layers 形状层
Anchor Point 描点
Position 位置
Scale 缩放
Rotation 旋转
Opacity 透明度
Path 路径
Group Transforms (Anchor point, position, scale etc) 组变换
Rectangle (All properties) 矩形路径（所有属性）
Ellipse (All properties) 椭圆路径（所有属性）
Multiple paths in one group 一个组里的多个路径
Stroke (shape layer) 描边（形状层）
Stroke Color 描边颜色
Stroke Opacity 描边透明度
Stroke Width 描边宽度
Line Cap 描边端点（圆头，平头）
Dashes 描边断点
Fill (shape layer) 填充（形状层）
Fill Color 填充颜色
Fill Opacity 填充透明度
Trim Paths (shape layer) 修剪路径（形状层）
Trim Paths Start 修剪路径起点
Trim Paths End 修剪路径终点
Trim Paths Offset 修剪路径偏移

···················· 以上内容不定期更新 ····················

最后，希望Adobe和Airbnb能好好把它弄起来，我相信这个以后会成为衔接动效与开发的高效工作流之一！

以上