Figma Support Forum

A way to export the animated interactions in the prototypes?

Hi everybody,

Is there a way please to export the animated interactions settings (with all the ease settings and so on…) I have made in the “prototype” section of Figma ?
I mean through SVG + CSS with @keyframes, JQUERY or anything else ?

It’s too bad I have to recreate in HTML, JS etc… all the stuff out of Figma.
I would like to be more efficient and productiv in that part of the pipeline of production.

So : “Once you have validated your Figma animated designs, what are the best practices to keep ‘out of Figma’ the code applied for the animate part of the prototype ?”

Thank you very much,
Best Regards,
Robin

1 Like

There are no ways to do that at the moment so feel free to edit your topic to turn it into a suggestion instead of a question and move it to #product-ideas (or create a new topic there if you wish). There is a suggestion for exporting prototypes to video, but not to code.

Thanks Gleb,

That’s perfectly clear and it would be so amazing to add this feature, developers would appreciate :slight_smile:

Best Regards,
Robin

2 Likes

I really hope that the new feature of “export interactive prototype into video or gif” cause once designer wants to insert the prototype into mockup file there is a lot of tedious steps that need to do with photoshop and ae.

1 Like

There is an Anima app that exports the Figma design to HTML. But to create effects, animations, and interactions you (or your developer) can use https://toruskit.com This tool allows you to do everything right in your HTML without writing any CSS or JS.

From my experience, I know how easy it is to create a prototype in Figma, but when the developer sees what is required of him, he starts to go crazy. So tools such a https://toruskit.com helps him to get rid of the CSS styling and writing any JS.

In spite of everything, you should make prototypes in HTML :slight_smile: