# Getting Started with Bannerify


# Introduction

Bannerify (opens new window) is a premium Figma plugin that lets you animate and export production ready banners from Figma to HTML, GIFs and Videos, in seconds.

# Features

  • Criminally easy timeline animation and real-time previews inside Figma.
  • Generates all the images, HTML, CSS and Javascript you need for every banner.
  • Export to HTML/CSS, GSAP, <canvas>, Google Ads, DoubleClick and many more.
  • Export your animated banners to GIFs or MP4/WebM video files.
  • Create your own animations, or use dozens of professional presets.
  • Set a maximum file size (kb) per banner for automatic asset optimization.
  • Optionally include static fallback "backup" JPG for every banner.
  • Impress your clients with beautifully responsive HTML preview pages.
  • Automatically saves all of your exported banners and preview page as a single .zip file.

# Installing the plugin

Figma Organization Users

Anyone with a Figma account can install plugins; however, users in a Figma Organization may only be able to install approved plugins.

Ensure you're logged into your Figma account, then follow the steps below to install the Bannerify Figma plugin.

# Install with your Web Browser

Navigate to the Bannerify Figma plugin (opens new window) page in your web browser, then click the Install button in the top right hand side of the page to install Bannerify.

# Install with the Figma Desktop App

  1. Open the file browser in Figma.
  2. Click the Community page in the sidebar.
  3. Enter Bannerify into the search bar at the top of the page.
  4. Click the Plugins tab to filter results to plugins only.
  5. Click the Install button on the right-hand side of the Bannerify search result.

# Running the plugin

Edit Access Required

Anyone with Edit access to a file can run a plugin in that file, anyone who only has View permissions won't be able to run any plugins in that file.

Browser Support

Due to browser compatibility issues, Bannerify isn't supported in Safari. Please run the plugin in another browser (like Chrome (opens new window)) or the Figma Desktop App (opens new window) instead.

Once you've installed the Bannerify Figma plugin, you can switch back into any Figma project file, then follow the steps below.

  1. Right-click anywhere on your Figma project canvas
  2. Hover your mouse over Plugins
  3. Click on the Bannerify plugin

# Quickly re-running the plugin

After you've run the Bannerify plugin once in a Figma file, you'll be able to quickly re-launch it by clicking the Bannerify icon in the right-hand side Figma column (under the "Plugin" subheading).

# Activating the plugin

After using the trial version of Bannerify 10 times, you'll be asked for your license key to continue using the plugin. Simply enter your key, select your plan and click Activate.

Need a Bannerify License?

You can purchase a license key for you or your team by visiting the Bannerify (opens new window) plugin page on the Hypermatic website.

VPN may be required in China

Please note, if you're in China, the license server may be blocked by "The Great Firewall of China". If you're seeing a license error, despite using a valid key, you will likely need to use a VPN (opens new window) to resolve the issue.