OBJECTIVE
Design and build a Figma plugin that removes the manual, time-consuming process of exporting animated HTML banners, giving designers a simple, code-free path from Figma frame to production-ready file.
CHALLENGE
Designers working on digital advertising campaigns kept running into the same problem. Figma has no native way to export animated banners as HTML, MP4, or GIF. The existing workarounds meant jumping between multiple tools, writing code manually, or handing off to developers for what should be simple animations. It slowed down campaign production and created unnecessary friction between design and delivery.
The approach
I identified the gap through firsthand experience working on high-volume digital campaigns. Rather than accepting the workaround, I designed and built Hubannero. A Figma plugin that lets designers define animations per layer, apply presets or customised motion paths, and export clean HTML, MP4, and GIF files in a single click. I led the full product process including UX research, plugin UI/UX design, and development using AI-assisted coding with Cursor alongside my own front-end knowledge. The marketing site was also designed and built from scratch to support the launch.
IMPACT
Successfully launched on the Figma Community. What used to take multiple tools and hours of work now takes minutes, directly inside the designer's existing workflow. Built and shipped end-to-end as a solo product.
client
Hubannero
Year
2024
service
Web Design, Marketing
