如何使用After Effects (Ae)软件创建LottieFiles动画

想加入LottieFiles潮流吗？我们将向您说明如何使用After Effects （Ae）软件创建LottieFiles动画。

LottieFiles创建了一种快速、可扩展、后渲染的可编辑文件类型，您可以轻松参与并以这种格式创建动画。使用Adobe After Effects和一些插件，你可以成为最新的文件类型宣传的一部分：Lottie。

什么是Lottie？

Lottie或dotLottie是一种文件类型，它正在席卷web开发人员。您可能已经制作了动画以包含在您的设计中，无论是用于社交媒体、网页设计还是用户体验和UI设计。您可能会将动画保存为GIF、SVG或PNG文件。Lottie文件是所有这些文件类型的好部分，但在渲染后更小、更快、更容易编辑。

LottieFiles是一个以Lottie或JSON格式保存的预制动画的巨大数据库。这些动画可实时渲染，以便更快地传送到您的设计中。无需等待下载这些文件；页面一打开，它们就会出现。

入门

Mac助理小编将使用Adobe After Effects创建Lottie，但您可以使用其他软件创建Lottie动画。您可以使用Adobe Animate和Lottie Files插件创建Lottie。如果您已经制作了这种格式的动画，还可以将SVG格式的动画转换为Lottie。

然而，考虑到LottieFiles最初是为了在After Effects中使用而创建的，After Affects肯定是首选。

1.创建动画

Lottie的动画效果与其他格式相同。Mac助理小编本人使用Adobe Illustrator软件在macOS创建了动画插图。这将使层保持分离，并准备好导入到After Effects中。导入插图后，可以为最终动画调整构图的层。

Lottie动画在一个连续的循环中运行，所以考虑一下这一点作为设计的终点和起点。动画应该很简单，大约三秒长。

2.下载插件

有两个插件可以用来创建Lottie文件：LottieFiles插件或Bodymovin插件。两者都适用于After Effects，但LottieFiles插件也可以在其他软件中找到。它们各自做的事情略有不同，但我们现在将重点关注LottieFiles插件。

要下载LottieFiles插件，请前往LottieFile for After Effects插件页面。您将找到两个下载选项。

右侧的选项需要Anastasiy的扩展管理器，该扩展管理器适用于Mac和Windows。下载扩展管理器后，从LottieFiles页面下载ZXP插件。

下载ZXP插件后，打开Anastasiy扩展管理器，单击After Effects，从列表中选择LottieFiles插件，然后单击Install。

回到LottieFiles插件页面，下载Adobe Exchange插件；打开您的Creative Cloud桌面应用程序并安装插件。返回“After Effects”中完成的动画。

有些人在使用这些插件时会出现权限错误。为避免此问题，请转到After Effects > 首选项 > 编写脚本和表达式 > 应用程序脚本并勾选允许脚本写入文件并访问网络框。

完成后，LottieFiles的弹出窗口将要求您登录。如果您还没有LottieFiles帐户，现在是创建一个帐户的时候了。

3. 导出你Lottie

安装了LottieFiles插件后，您可以渲染Lottie动画。在完成动画合成后，单击“窗口>扩展>LottieFiles”。这将弹出一个弹出窗口，显示您的作文名称。单击构图名称旁边的绿色箭头，这将打开Lottie渲染窗口。

几秒钟后，动画将出现在弹出窗口中。动画将在循环中实时播放。在这里，您可以选择保存动画或将动画上载到LottieFiles库。

单击另存为将为您提供两个导出选项：Lottie JSON（*.JSON）或dotLottie（*.Lottie）。dotLottee文件是一个压缩文件，包含元数据，我们并不需要导出元数据。我们使用了Lottie JSON。

导出的文件将是文本文件，而不是视觉动画文件；这就是JSON文件的工作方式。但如果你想让动画准备好呢？让我们看看如何访问它。

如何使用Lottie动画

要将Lottie上载到Lottie文件库，请单击上载（Upload）。这将渲染几秒钟。然后，单击带有地球仪的按钮。这将打开LottieFiles网站，您可以将您的Lottie动画提交到LottieFile库。命名您的文件并点击Handoff。

一旦您的动画在LottieFiles库中获得批准，您就可以在Adobe XD、Figma或Sketch等软件中使用LottieFile插件来将动画传送到您的设计中。

除了直接在插件库中使用外，还有其他方法可以使用LottieFiles动画。您可以从浏览器中的窗口进一步编辑Lottie动画。它提供了一个基本层面板；您可以更改背景颜色、播放速度、帧速率等。

从Handoff窗口，您可以将动画下载为JSON文件，以便在web开发和设计中实现，也可以将其转换为GIF，用于更常规的用途。您还可以使用HTML嵌入代码嵌入动画，还有iOS和Android选项，因此您可以将动画发布到您的网页设计中。

嵌入Lottie HTML允许您编辑代码以编辑动画。当您将代码添加到网站时，可以在代码中更改颜色和大小。

通过在手机上下载LottieFiles应用程序，您可以扫描动画的二维码，在应用程序中预览动画。您还可以使用LottieFiles键盘，并在某些帖子中将您的dotLottie作为注释。

使用After Effects软件创建Lottie

虽然它可能仍然感觉像一种非传统的文件类型，因为你不能像使用GIF或PNG那样简单地将动画直接上传到社交媒体，但Lottie为使用插件或在设计中嵌入代码的网络开发人员和设计师带来了许多好处。

与传统文件类型相比，Lottie和JSON文件节省了空间和加载时间，并保持了质量。LottieFiles不断创造新的方法来实现设计，可能性是无穷的。