How Do You Do Smart Animate in Figma?

Using Figma is a great way to create professional animations with ease. The ability to use the same powerful tools that are available in Adobe After Effects or Adobe Flash, but without having to learn complex coding, makes Figma an ideal choice for those looking to get creative with their animations. Creating animations with Figma is relatively straightforward, and if you’re familiar with basic animation principles, you should be able to create something impressive without too much difficulty.

An important part of creating animations within Figma is understanding how to do “smart animate.” Smart animate allows users to quickly and easily animate between two separate frames or states of their design. This can be used for all sorts of things, such as transitioning between different states of a button or menu, or animating a complex object from one position to another. The key to successful smart animate is understanding the different tools and options available within Figma.

The first step in setting up a smart animate animation is selecting the objects that you want to animate. You can do this by selecting both objects in the Layers panel, right-clicking on them, and then selecting “Smart Animate” from the context menu. This will bring up a dialogue box which allows you to adjust various settings related to the animation, such as duration and easing type.

Once you’ve set up your animation options, you can then begin animating the objects. Figma has a variety of tools which allow you to adjust how your objects move between frames.

You can adjust things like speed, easing type (such as linear or ease-in/ease-out), direction (forward or reverse), delay (for when you want an element to start moving after a certain amount of time), and even looping (for when you want an element to repeat its motion). All of these settings will help determine how your animation looks when it is played back.

Creating smart animate in Figma may seem intimidating at first glance but it’s actually quite simple once you understand the basics. With some practice and experimentation, anyone can create stunning animations with ease using this powerful tool.


Smart Animate in Figma allows users to quickly create professional animations with minimal effort. By understanding the various tools available within Figma for adjusting speed, easing type, direction, delay and looping effects users can easily create stunning animations that are sure to impress!