1/3: Figma updates 2026: Exploring Figma Motion
July 16, 2026- by Oriana Calemi
:focal(undefined))
As a designer, I always look forward to Figma Config. Alongside the rest of the design and development community, I consider it the premier event of the year for shaping and optimizing our workflow.
This year, the big news is Figma Motion. Because let’s be honest: when it comes to UI animation, the struggle has always been real. Adobe After Effects is usually overkill, requiring way too many skills just to animate something simple. On the other side, tools like Jitter often feel too limited for what you actually want to achieve. Even Figma’s native prototyping often hits a wall when you had a specific vision in mind. Over the past few days, I’ve exploring the Figma Motion features to see what actually works, and where there is still room for improvement.
:focal(undefined))
What is Figma Motion?
To kick things off, you’ll notice a brand-new tab in the menu bar: Motion. For me, the biggest plus is that you can now handle your entire animation workflow right inside Figma. No more jumping back and forth between external programs- at least, as long as your animation isn’t overly complex.
What makes it truly great is that Figma Motion creates a dedicated timeline for each object or component within your frame. This means you can layer multiple animations and effects onto a single object, giving every single element its own specific timing or delay.
Before we dive deeper, let’s break down the main timeline functions you’ll see on your screen:
:focal(undefined))
Timeline
Play or Pause: Instantly preview your animation.
Auto-keyframe: A massive timesaver. The timeline automatically adds a keyframe every time you make an adjustment to an object.
Current time & Duration: Keep track of exactly where you are and how long your animations last.
Time unit: Change your time-format, ms or s.
Playback options: Play your animations once, loop it, or use ‘ping-pong’ to see it move smoothly back and forth.
:focal(undefined))
Putting it into action
When you select an element in a frame within the new Motion tab, you’re instantly given a clear choice: either let the AI Agent create the animation for you and based on a prompt, or manually add the layer to the timeline.
When you choose manual, you can start selecting specific properties to animate: Position, Scale, Rotation, Size, Opacity and Path (if a path is detected). The moment you click one, it pops right onto the timeline.
I love that all manipulatable inputs are clearly marked by the standard diamond keyframe icon (◇). These allow you to tweak inputs quickly. What’s even better is that this also works with Auto-layout: those inputs are fully animatable too.
You can layer multiple animations onto a single layer, drag elements around to adjust the duration or timing, and manually add keyframes. For any designer who has previously worked with tools like Adobe After Effects or Jitter, this timeline flow will feel intuitive and easy to master.
Once your animation is finished, Figma also has your back when it comes to exporting. You can export your work into the most common formats: MP4, WebM, GIF, and SVG. To make sure it fits your excact needs, you can also easily customize the size, quality, and frame rate before hitting export.
Key improvements needed
While Figma Motion is impressive, it is still in Beta. Having put it through its paces, I have a wishlist I’m hoping to see implemented to truly make this a power-user tool:
Cleaner stacking UI: Things get complex fast when adding multiple animations to one layer. Currently, the animations are shown as separate stacked bars, with all keyframes grouped below them. I’d love to see each animation bar paired directly with its own keyframes.
Dedicated shortcuts: There are no shortcuts for the Motion tab to do things quickly like switch between timelines. For anyone used to flying through Figma with shortcuts, the lack of them slows the process down.
Built-in animation presets: It would be amazing to see more effects and expressions - like a wiggle expression or a typewriter text effect - to save us from manually keyframing.
Timeline parenting & nesting: Being able to parent layers directly in the timeline, where a child layer inherits the motion of its parent, would open up so many advanced animation possibilities.
Multi-select in animation panel: the ability to select, move, or adjust multiple animation blocks at once within the panel is an absolute must-have to speed up the workflow.
The verdict: A big step, but not a replacement (yet)
Figma Motion is a massive leap forward for digital designers or content creators for social media , who need to add minimal, elegant animations to their UI without leaving the canvas. It completely removes the friction of exporting for everyday prototyping.
However, let’s be realistic: It’s not going to replace Adobe After Effects of Rive yet. For dedicated Motion Designers, the current toolset will fall short. It’s a fantastic addition to our daily toolkit, but for complex, heavy-lifing animations, those external tools are still very much required.