Introducing Prototyper
Powerful prototyping with code in Figma
We’re excited to share that starting today everyone can use Prototyper for Figma.
Prototyper is a powerful new way to prototype in Figma. It’s based on the open source Framer Library JavaScript framework and lets you create high-fidelity interactive prototypes with animations in Figma using code.
Prototyper started as an idea when I came across a tweet in March about using the old Framer.js library. I instantly shared my love for the old Framer Classic days. The best prototypes I’ve ever made were in the old Framer app — there was something so special about a code editor side by side with the design canvas. Being able to use their library to hack together prototypes in a lightweight, messy way made it my favorite tool to prototype in.
We wanted to resurrect that magic from the past and build on Framer’s amazing open source work. We discovered unique ways to bring the library into a Figma plugin that renders a realtime preview of your design and turns every layer on your canvas into a variable that you can manipulate using code.
We’re really happy with how it turned out, and we hope you are too. A special shoutout to Alex Widua for taking the seed of the idea and turning it into something beyond our wildest dreams.
Prototyper isn’t possible without the open source work and inspiration from Framer. We’re standing on the shoulders of giants.
Visit prototyper.design
Read the Prototyper docs
Join the Discord