Skip to main content
Solved

Looping animation issues when animating between frames in prototype

  • March 18, 2024
  • 1 reply
  • 770 views
Darrel

I’m not sure this is doable in Figma. Looking either for confirmation of that and/or if there are workarounds.

What I’m trying to do:

  • I have a continuously looping animated component I’ve set as the bottom most element of a frame (the background)

  • I want to animate elements on top of it and navigate between frames

  • the problem: navigating from frame 1 to frame 2 using smart animation works for everything BUT the background looping animation.

What happens is that the background animation freezes, the rest of the elements animated, and then the background animation ‘resets’ and continues on animating.

It’s a very jarring transition.

The only thing I’ve thought of (but haven’t tried yet) is redoing this looping animation in aftereffects and exporting as a movie, and then bringing that into Figma. But have a hunch I may have the same ‘reset’ issue.

Best answer by dvaliao

Hey @Darrel, thanks for reaching out!

From what you’ve described, it sounds like an issue with your prototype’s state management.

For what you want to achieve, you’ll want your background animation to re-open in the same state in the next frame. But you might be better off using a video as your suggested, since we know that Figma can memorize the play state of any videos used in your prototypes.

View original
This topic has been closed for comments

1 reply

dvaliao
Figmate
  • dvaliao
  • Community Support
  • 4666 replies
  • Answer
  • March 20, 2024

Hey @Darrel, thanks for reaching out!

From what you’ve described, it sounds like an issue with your prototype’s state management.

For what you want to achieve, you’ll want your background animation to re-open in the same state in the next frame. But you might be better off using a video as your suggested, since we know that Figma can memorize the play state of any videos used in your prototypes.

Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings