Animate and export Figma Buzz banners to HTML, MP4 video, or GIF

Watch how to load Figma Buzz banner designs into Bannerify, animate them, and export them to HTML, MP4 video, or GIF.

← Back to Bannerify Video Tutorials

What this video covers ​

This tutorial shows how to animate banner designs from Figma Buzz with Bannerify, reuse those animations across multiple banner sizes, and export the finished banners to HTML, MP4 video, or GIF.

Things you'll need ​

  • A Figma Buzz file with a banner design
  • The Bannerify Figma plugin

Steps ​

  1. Create a Figma Buzz file, then add a banner template or create a banner from scratch.
  2. Open the Plugins panel, search for Bannerify, and run the Bannerify Figma plugin.
  3. Click Load All Banners, then use the pop-out icon in the plugin header to open the full Bannerify animation timeline.
  4. Apply animations to the layers in your first banner, adjust their positions on the timeline to stagger the timing, and preview the result.
  5. Copy and paste the animated banner in Figma Buzz, then select a different ad size for the copied frame.
  6. Click the refresh button in Bannerify and load all banners again. The animations from the original banner are automatically applied to the copied banner sizes.
  7. To create an HTML export, click Export to HTML, choose the target platform and any additional settings, then export and download the zip file.
  8. Unzip the HTML export and open its index.html file in a browser to preview the banners. For platforms such as Google Ads, use the upload-ready files in the _zips folder.
  9. To create a video or GIF export, click Export to GIF/Video, choose an output format such as MP4 or GIF, configure any optional settings, then export and download the zip file.
  10. Unzip the export to access the generated media files, or open the included index.html file to preview them together in a browser.