​
Exporting to MP4 Video

After you’ve clicked the Export to GIF/Video and configured your export settings, you can click the Export MP4 button at the bottom of the export panel to begin exporting your banners from Figma to MP4. This will export your animated banners to h264 encoded MP4 videos.

Browser Support. Due to browser compatibility issues, MP4 videos can only be exported using Chrome or the Figma Desktop App.
MP4s are automatically optimized. MP4 video exports will automatically be optimized to get the best quality at the lowest file size.
Figma blend modes aren’t supported in MP4/WebM exports. Please note that blend modes aren’t supported for exports to GIF or WebP; they’re only supported for HTML exports.
Including or excluding banners in your export. By default, all of the top level layers in your Figma file that are loaded into Bannerify as banners will be included in your export; if you would like to exclude any banners from being included (without re-loading the selected banners in), you can toggle the Include Banner in Export switch in any banner’s timeline header to “off”; this will hide that banner’s timeline and also exclude it from being added to any exports.

​
Adding an audio track to MP4 video exports

Before exporting your MP4 video, you can optionally include an .mp3 audio file to your exported videos by dragging and dropping an .mp3 file from your computer (you can download .mp3 music files from a site like Pixabay) into the Bannerify export settings. Then you can click the Export MP4 button at the bottom of the export panel to begin exporting your banners from Figma to MP4 with the audio track automatically included.

Alternatively, if you’ve already embedded a video URL into one of your layers and would prefer to use the audio from that video, you can enable the Use audio from embedded video toggle, and this will automatically include the audio from the video on your banner’s timeline layer.

Browser Support. Due to browser compatibility issues, MP4 videos can only be exported using Chrome or the Figma Desktop App.

​
Downloading the final MP4 video .zip file

After Bannerify has finished processing your banners, you’ll be shown a confirmation message; you can download your .zip file containing your exported banners by clicking the Download your .zip file button.

Saving file downloads from Figma If you're using the Figma desktop app, you'll see a prompt appear to download your file. However, if you're using Figma in a web browser, your file will automatically be downloaded to your computer by default (usually to the Downloads directory on your computer).

​
Opening your MP4 video .zip file

After you’ve downloaded your .zip file from Figma to your computer, you can open your file explorer to the directory where it was saved. Double clicking on the exported .zip file will unzip the contents and let you use your banners however you like.

​
Exporting to WebM Video

After you’ve clicked the Export to GIF/Video and configured your export settings, you can click the Export WebM button at the bottom of the export panel to begin exporting your banners from Figma to WebM. This will export your animated banners to WebM videos.

Browser Support. Due to browser compatibility issues, WebM videos can only be exported using Chrome or the Figma Desktop App.
WebMs are automatically optimized. WebM video exports will automatically be optimized to get the best quality at the lowest file size.
Including or excluding banners in your export. By default, all of the top level layers in your Figma file that are loaded into Bannerify as banners will be included in your export; if you would like to exclude any banners from being included (without re-loading the selected banners in), you can toggle the Include Banner in Export switch in any banner’s timeline header to “off”; this will hide that banner’s timeline and also exclude it from being added to any exports.

​
Downloading the final WebM video .zip file

After Bannerify has finished processing your banners, you’ll be shown a confirmation message; you can download your .zip file containing your exported banners by clicking the Download your .zip file button.

Saving file downloads from Figma If you're using the Figma desktop app, you'll see a prompt appear to download your file. However, if you're using Figma in a web browser, your file will automatically be downloaded to your computer by default (usually to the Downloads directory on your computer).

​
Opening your WebM video .zip file

After you’ve downloaded your .zip file from Figma to your computer, you can open your file explorer to the directory where it was saved. Double clicking on the exported .zip file will unzip the contents and let you use your banners however you like.

​
Configuring video export FPS (frames per second) settings

You can change the framerate of your video exports by using the Frames Per Second select box options. You can select from the FPS options below:

  • 60 FPS (Ludicrous Mode)
  • 30 FPS (Ultra Smooth)
  • 24 FPS (Smooth)
  • 18 FPS (Less Smooth)
  • 12 FPS (Least Smooth)
  • 6 FPS (Jittery)

Was this page helpful?

Export to HTMLExport to GIF