Lottie是一种基于JSON的动画数据格式,可以像静态资产一样在任何平台上随时使用。它们是紧凑的文件,可以无像素化地放大或缩小,并在任何设备上运行。最重要的是,Lottie动画不需要任何编码技能
乐迪动画如何让你的生活更轻松?
Lottie's几乎可以在任何平台上使用,包括网络和手机。因此,你可以简单地将它们纳入应用程序和在线网站。
Lottie动画 也可以作为聊天平台的贴纸使用。JSON文件是紧凑的,而不是GIF和PNG文件;因此,使用Lottie文件可以提高下载速度,并尽量减少磁盘空间的使用。
你可以用Lottie混合矢量和光栅组件,并在运行时应用变换。在ITG.digital中制作动画和利用Lottie动画将帮助你更好地理解。
Lottie文件被用于网站大部分登陆页面的精彩动画中。
制作Lottie动画的最佳方式是什么?
设计(步骤1)
首先,也是最重要的,你必须完成并准备你的动画设计。我想到了一个女孩和狗的插图。你需要调整姿态,以适应女孩沉重的叹息和敲打她的脚。改变姿态后,为女孩的衣服勾勒出不同的纹理替代方案。
如果你选择使用纹理来制作动画,你应该注意以下几点。
使用矢量纹理是比较好的,因为产生的文件会比较短。
在绘制纹理草图时请记住,你的小点和小块越多,动画制作就应该越简单。你也可以通过保持最小的纹理来减少完成的动画文件的大小。
如果可能的话,避免在动画中使用掩码;否则,在某些浏览器中可能会出现问题。
制作动画(步骤2)
动画是下一个阶段。你需要对一些图画进行动画处理,并将其转化为JSON,以创建一个Lottie文件。
保持简单的东西是你在这个阶段能得到的最细微的建议。不要使用特效,而是对图层的主要属性进行动画处理:位置、旋转、比例和不透明度。路径动画也将是完美无缺的。
你的动画在整合时可以重放或播放一次。
如果你想在网站/应用程序上有一个完美的循环,确保你的动画在从After Effects导出之前有一个完美的循环。
导出动画 (步骤3)
一旦你完成了动画的制作,就该发布动画了。
1.启动Bodymovin,寻找你想制作的作品。
2.对参数进行调整。
3.点击渲染,你就完成了!
4.在Lottie文件网站或Bodymovin中查看你的动画。
5.如果你想向不熟悉Lottie的人展示你的动画,请点击渲染中的 "演示"。
总结
用Lottie Animation精确地获得你想要的最终动画效果。与JavaScript动画相比,After Effects中的动画更容易获得,而且用途广泛。从Seahawk Media等值得信赖的网站上了解Lottie Animation后,你就能在设计过程中发挥更大的想象力。