I made a web app that records Figma prototypes. It records using the browser at the same refresh rate as the prototype.

Check it out here: https://recordfigma.com/

It is completely free, let me know what you think.

🙏🏽 +1 for this feature

This has been a constant debate between my UI friends and me who use Figma. We’ve tried to walk our way round screen recording and gifs. If there’s a plug-in?

Yesterday, had a meeting with a team and was trying to send a file, a video file, didn’t want to record, just wanted to export the file as a video. I maxed out my sight ability looking for and watching almost all the tutorials on “How to export Figma design as video” on YouTube. Everyone had the same info and instruction, record or gifs. The only one that had a video option, according to the Youtuber, was paid.

Now don’t get me wrong, truly videos and GIFs serve different purposes and that is well understood by many, and moreover I feel the context in which they are used depends on your specific needs and goals.

Nevertheless, gifs do have their own benefits as they are quite easy to create, and are widely supported across different platforms. They can also be easily shared across these platforms. They also save time and are easy to download.

But there are some limitations to the use of gifs, I feel. There are a bunch of reasons why having a proper video export option, and not only recording is a necessity for most Figma users.

In the case of motion or duration, videos display longer sequences of motion & convey more complex ideas or stories because they really have no fixed duration limit. But when it comes to GIFs, on the other hand, they are limited in duration and may not be suitable for conveying extensive content.

Also when considering the playback quality of both, videos definitely offer higher quality and smoother playback compared to GIFs, which are mostly limited in terms of resolution and frame rate. I think it’s very crucial for showcasing products or detailed visual content, especially during visual presentations.

Regardless, the choice between video and GIF depends on one’s specific content and audience. Considering one’s goals, and the type of content to be presented, is very important.

It’s important to consider the platforms or devices your audience uses when deciding which format is better suited for their needs.

Hi! This seems to be a post that’s more than 2 years old, but I have the exact same question and cannot find the perfect solution to my situation!

I’m a graphic designer and use Figma for digital advertisements, I just made an animation using prototypes and would love to be able to export them as .mp4 but this seems to be impossible 😦

Not a single plugin that is mentioned here does the job how you’d expect it, and it would just be amazing if Figma would have this as a built in feature instead of having to pay for a subscription that may or may not solve my problem

Every other plugin messes up animating components, scaling them weirdly and some don’t even show up in the export 😕

After 2 years, you’d think there’d be an amazing way to export prototypes to video… is this on the roadmap for Figma? 👀

Anyway, thanks for reading!! and please don’t get me wrong… I freaking LOVE Figma! this is just my only “frustration”!

Kind regards,

Dylan

I am surprised that Figma still doesn’t have the option to export to video or screen record the prototype. Can anyone from Figma confirm if this is in the pipeline?

It is super stupid idea.

Read this topic instead.

Unfortunately for me, it doesn’t work. It just cuts the rendering and drops the error 😦

Hi @Elena_Kvasova,

Thanks for bringing this up. Can you submit the design file either through the plugin or just email it to support@creativeflow.ai ? I will look into this.

We are working hard to bring the export video plugin to feature parity with Figma preview.

Been willing to use it but the watermark is huge and your pricing is through the roof. It’s literally more expensive than taking an After Effect subscription.

Hey @SylvainMaretto, thanks for your comment.

Just to note, we’ve launched an open-source Figma plugin and three other Free Figma plugins that you can check out at creativeflow.ai.

As for the video export plugin, it has been very technically challlenging to build it. The pricing not only mirrors the effort but also helps supports the engineers who tirelessly enhance it.

For some great deals, keep tabs on our Twitter and LinkedIn. We offer significant discounts from time to time 🙂

We recently published the ability of exporting gif fills too to our plugin 😍

The “solve” listed is a plugin that cost $29 A MONTH. That’s more than a Figma subscription. Adobe levels of cost for a PLUGIN. Not only that, but they force you to give your email even to try the trial. Everything I hate about overpriced subscriptions in one. 🙂

Hi @Remain,

Thank you for your candid feedback. I appreciate your perspective and would like to provide some clarity on these points.

Regarding the use of email: We assure you that the primary purpose is for essential technical support and communication. It allows us to effectively identify and resolve any issues you might encounter with the plugin especially since it runs in a tight sandbox as a Figma Plugin. Additionally, while our newsletter is part of the communication, you have full autonomy to unsubscribe at any time. We try to make these emails personal and educative around motion design.

On the topic of pricing: The development of this plugin has been a significant technical challenge. We openly encourage other development teams to try to tackle it too. For instance, LottieFiles offers a comparable plugin, but as soon as you use it you’ll realize it comes very short of producing the right output. Meanwhile Lottiefiles is 50 times our size and have raised millions of dollars; while at CreativeFlow we are just a small team in Canada and bootstrapping with little to no money raised. The pricing allows us to “exist” as a solution to this problem.

Thanks again for brining this up and I hope to have answered this concern.

We really need this Figma! Cropping out multiple prototypes in 3rd party screen capture apps is a very crappy experience!

IN BETWEEN SOLUTION: At least make the prototype preview window a PROPER WINDOW (also on PC) that can be detected as a separate window by 3rd party screen capture apps. That would save us the cropping!

For the industry-leading experience look at PROTOPIE (I gave this tip before)

Koen

We really need the ability to (video) screen-record a prototype within Figma! (with the option to auto-crop away anything outside the frame). Cropping out multiple prototypes the same way in 3rd party screen capture apps is a very crappy experience!

possible in-between solution: At least make the prototype preview window a real window (also on PC) that can be detected as a separate window by 3rd party screen capture apps. That would save us the cropping!

For the industry-leading experience for prototyping look at Protopie. (I gave this tip before)

Koen

Hi!

First of all, I’d like to say that I am aware this topic has been discussed before but not a single good solution has been provided over the past years 😕

I would LOVE to be able to export prototypes to either GIF or .mov to post on social media (as reels, or just fun dynamic web-bannering)

But here’s the tricky part… these prototypes are build up with components with nested instances… I’ve tried every single free plugin but these screw it up entirely, by loading them in weirdly or not at all.

Has anyone found a good solution to this issue by any chance? The animation I’m looking for is very basic… it comes down to pretty much scaling in/out and repositioning.

I tried all the demos of the paid plugins, but none were able to load in components, and this is pretty vital to retain our current workflow (without having to break up / detach)

Thanks in advance and hope this gets sorted! I do hope this will be a build-in option over time, without the need to use plugins, free or not!

Kind regards,

Dylan

For sure. But that’s the amount that supports the devs of Figma, who build and maintain something way more complicated that your plugin. So you might wanna recheck your business plan if you need that much of a monthly payment to support a plugin.

Waiting on this

I fully understand that the pricing might be the lowest one to keep you guys afloat, but the quarter-screen fully opaque watermark is a dealbreaker for me 😦

Eighth* of a screen, sorry. It’s still is a dealbreaker for me though

hey @Krovatko,

The watermarked exports still incur us processing costs so we hope if you need this plugin, you at least try to support it by paying for it.

We are a vert small dedicated team in Canada working on this problem full-time and the pricing allows us to to at least pay ourselves a minimum wage and feel motivated to continue to work hard on this problem.

If you believe the pricing is unjustified, try the few competition plugins out there… You will soon realize how hard the technical aspect of this project is to the extent that even bigger players aren’t solving it well.

Fairly sure it’s in the pipes at Figma’s. Meanwhile I screen record and edit. While I do hope your team will get successful - minimum wage is never fun - we can’t rationally pay more for a plugin than you pay for the main app, especially when you can hack the feature as I do. A big one time payment is acceptable, but a high recurring subscription, no way. I don’t even use it every month…

Hey Lovely designer, we at creativeflow.ai recently published another plugin to help you export your prototypes. This time it is an export to HTML/CSS animation. It is a free plugin and would love to hear your feedback once you tried it:

https://www.figma.com/community/plugin/1316914571143821889/export-to-css-animation

Hi,

I really need the same function that I had with Adobe XD (record prototype), then a final video preview of my prototype. I have already tried all the solutions you mentioned above, but it’s not what I need. Any news about this? It’s really a pity that after so many years we are still there.

hi @Francesca_Sanfilippo I built the Figma export to GIF/Mp4 plugin and happy to troubleshoot any issues you might have had if you are willing to DM me with more details: https://www.figma.com/community/plugin/1170836206919391034/export-to-gif-video