LottieFiles is a fully featured platform to create and design Lottie animations. Now, they have also launched their Figma plugin that you can use to turn your Figma designs into Lottie animation. Basically, it lets you select a static frame that you design in Figma and animate it. There are some ready-made animation presets that you can apply to your design and then export them.
With the help of animation presets, you can rotate the shapes or objects that you create in Figma. There are many more such presets available to choose from. Additionally, you can choose a background color and then finally export the animation.
You can convert the animation to GIF and insert in the Figma workspace. Or, you can export the Lottie animation to LottieFiles workspace. After exporting animation to LottieFiles, you can later download the JSON code and use that anywhere you like.
How to Export Figma Designs as Lottie Files by Animating Them?
The LottieFiles plugin for Figma can be installed from this link. Just follow the link and then click “Try it out” option. The plugin will then be added to your Figma Workspace.
Now, you create some design. Draw shape or an object inside a frame.
Launch the LottieFiles plugin from the Plugins menu. The interface of the plugin will open up. In this, go to the new Export to Lottie tab.
It will now ask you to select a frame from your Figma design. So, select a frame and then animate it. It gives you some options there to choose an animation for your design.
After applying the animation, you can simply export it. You can export it as GIF or as a Lottie file. The Lottie file can be exported to your LottieFiles account as well. From there, you can further modify it and then download it if you want to.
This is how easy it is now to turn your Figma designs to Lottie animation. The LottieFiles plugin is quite powerful, it can bring your static Figma designs to life. Just install it and then animate your Figma designs and export as Lottie animation.
Closing thoughts:
If you work with Figma and Lottie animations, then you will love this new Lottie animation plugin for Figma by LottieFiles. I really liked the fact that it gets integrated in Figma fully and then you can choose to animate your designs and then export them. Even though there are limitations in the free version, I think it still offers main core functionality for free. It is good for freelancers and individual front end designers.
