Figma's AI Prototyping Tool is Here And...It's a Must Try
A deep dive into Figma Make's unique visual editing features and how the team built the product, including 4 types of AI evals and a demo of Make's most surprising use cases
Dear subscribers,
Today, I want to share a new episode with David Kossnick.
David is the Head of AI Product at Figma and gave me an exclusive demo of Figma Make, Figma’s new AI prototyping tool. We had a great chat about how Make stands out from other tools and how it works under the hood, including a deep dive on evals.
Watch now on YouTube, Apple, and Spotify.
This episode is brought to you by Merge — Merge gives SaaS companies like Ramp and Drata a single API to launch over 200 product integrations fast. Book a meeting via www.merge.dev/peteryang and get a $50 Amazon gift card when you attend.
Timestamps:
(00:00) Building the best design-to-prototype tool in the market
(03:17) Demo: From static image to interactive solar system
(06:05) 3 ways that Make stands out from other prototyping tools
(12:01) How Make actually works behind the scenes
(15:21) 4 types of evals to improve Make's AI prototypes
(17:40) How the "Great Bakeoff" transformed the product
(23:29) The biggest product challenges in building Make
(27:23) Why prototypes are now the gold standard for design
(40:36) Demo: Drawing apps, games, and more with Make
Amazing things that you can create with Make
Welcome David! Can you start by showing us some cool use cases for Figma Make?
Sure. Figma Make is our new tool that transforms text, screenshots, and Figma designs into real interactive prototypes. Here are three examples:
Beautiful image gallery. Let’s give Make the prompt: “modern image gallery, where you can tap around on different photos and transition." It’ll then reason about scope and describe the work before coding.
Interactive solar system. I took a picture of the solar system and asked Make to “Make it interactive.” You can see the planets are rotating - this’ll be amazing for teaching my kids.
Interactive Figma designs. Of course, we're Figma, so we want to be the best prototyping tool for designers. If I hop over to a Figma file, I can paste a frame into Make and say, "Make this interactive." The result is a functional prototype where I can click around, show and hide elements, and edit profiles.
When you copy a Figma frame, does it include all the data?
It does. We’re not just bringing the image when you copy a Figma frame. We’re giving AI the rich, structured data layers, metadata, and styling details.
3 ways in which Make stands out from the competition
There are many AI prototyping tools on the market. Where does Make stand out?
Make stands out in 3 areas:
Best Figma to prototype: Each Figma design you bring in includes a lot of context — there’s a lot of benefit in having Make live in Figma’s existing platform.
True multiplayer collaboration: Figma is multiplayer first, and so is Make. I can share a file with you; you'll see my avatar and changes update in real time.
Interactive editing: You can use contextual prompts to modify specific components, and edit code with others live in the multiplayer code editor.
We designed Make to be flexible and easy to understand. You can use it without having to know the latest prompting techniques.
4 types of AI evals to improve Make’s prototypes
How do you evaluate the quality of the AI-generated prototypes?
We realized early there were two different quality axes for users:
Design score: How good the prototype looked
Functional score: How well the prototype works
Even though we target designers as our primary persona, different sub-personas value these scores differently. Internal tools might prioritize functionality, for example.
To test the product thoroughly, we went through 4 phases:
Initial internal testing. We created a giant FigJam board and tried 100s of prompts. We then scored results on a 1-4 scale for design and functionality.
Company-wide dogfooding. We then expanded testing to the entire company — we had 12 in-person sessions across global time zones where employees experimented with the tool and documented their experiences.
Structured evaluation dataset. The best examples and most frustrating failures from our company sessions became our first 1000+ evaluation items—a structured dataset that we could use to track improvements against.
Scaled human judgment. We partnered with contractors to expand our evaluation capacity and standardize our eval criteria.
Within this process, we use four distinct types of evaluations to measure quality:
Deterministic evaluations. These are clear-cut, objective measures—like "does the code compile?" or "did it shorten the text when asked to?"
Qualitative human assessment. Similar to how Google trains search raters with comprehensive guidelines, we developed criteria for human evaluators to judge quality consistently.
AI as judge. For certain well-defined problems, we can use AI to evaluate outputs—essentially using a model to judge another model's work.
Usage analytics. Once we're live with real users, A/B testing helps us understand how different approaches and models affect user behavior and satisfaction.
The 3 biggest product challenges of building Make
What was the most challenging part about building this product?
We had to overcome 3 main challenges:
Infrastructure. Made evolved from a project called code layers, which eventually launched as a feature in Figma Sites. It required different rendering technology, converting Figma nodes into publishable elements, and addressing latency.
Quality and cost optimization. Model quality is a difficult hill-climbing exercise with business and product experience trade-offs. We had to determine where to position ourselves in the quality-speed-cost triangle.
AI non-determinism. The system would sometimes perform well and sometimes fail spectacularly. For example, we discovered that the AI was just pretending to read an image when it had no idea what the image looked like.
Navigating the maze of choice with AI products
How did the team build this product? I'm assuming it's not a waterfall process.
A prototype is worth $1000, and the cost of prototyping is rapidly decreasing.
Prototypes have evolved from helpful supplements to the gold standard for design artifacts in the last year. They'll soon also become the standard for PM artifacts. Why write a PRD when you can just prompt to something you can play with?
Prototypes are vital for AI teams because you don't know if something works until you hook it up. I talk to my team about "the maze of choice" in AI:
Straight path. Your idea works immediately, and models support it.
No entry. Your idea is too slow, expensive, or impossible with current models.
Partial success. Your idea works in some ways but not others, forcing you to wait for better models, narrow your scope, or invest in solving hard technical problems.
Being an AI PM means knowing which turn to take in this maze.
How Figma learned from its past AI launches
What did you learn from previous AI tools like the text-to-design feature that got mixed reactions?
Two major lessons informed Make's development:
Transparency about systems. One of our previous AI features didn't clearly explain how it worked or what model powered it. Now we explicitly say that Figma Make is "powered by Claude 3.7 Sonnet" and provide more context.
Clarity of purpose. Some designers were worried that AI features would replace their jobs. We now focus on being clear that we're extending designers' capabilities, not replacing them.
Closing advice for AI product builders
Any closing advice for people building AI products?
It's an incredible time to be making software. We’re trying to make it easier to go from idea to product, and it's inspiring to see the range of things people create with Make.
One of our alpha testers is my six-year-old son, who has already made 10 games with Make. He comes home from school with sketches, asking, "Can I give this picture to Make and start making the game?" This generation is experiencing creation in a completely different way.
My advice is to just start making. Learn by doing and build empathy by creating for yourself and your friends. Get to something playable and follow that direction.
We've seen some amazing use cases beyond our design focus—a simple spray painting tool created in five minutes, a 3D first-person shooter, marketing campaign workflows, personalized journaling tools, and artistic vector field experiments. It's been an incredible journey.
Thank you, David! If you enjoyed this interview, follow David and check out Figma Make.