How to Use Figma Make to Build Client Prototypes (and Land More Work)
Contra Tips
April 1, 2026
· 3 min read
Figma Make is an AI prototyping tool built directly into Figma. Describe what you want - or drop in a rough sketch - and you get a working, interactive prototype in minutes. That speed changes the math on how many projects you can run, how fast you close, and what you actually take home each month.
Below you’ll find prompts you can copy-paste for real client work, a proposal workflow that moves your close rate, the earnings math on faster prototyping, and where Figma Make falls short.
Table of Contents:
What Is Figma Make?
Figma Make is Figma's AI prototyping tool, powered by Claude. Feed it a prompt - a text description, a screenshot, a reference design - and it spits out an interactive prototype you can click through, share, and publish.
Why does this matter vs. standalone AI builders like Lovable or Bolt? Make lives inside Figma. You generate a prototype, pull it onto your canvas, refine it with your own design system, push it back into Make. No tab-switching. No export/import friction.
Three things matter for client work specifically:
Canvas integration: Copy any Make prototype to your Figma canvas, edit it with your normal design tools, then paste the updated design back into Make. This is the loop: Make → Canvas → Design → Make → Refine.
Point and edit: Click directly on any element in the prototype and change it - text, colors, spacing-— without touching code or hunting through layers.
Publish-ready output: Connect a domain and publish directly from Make. You can share a live link with a client, not a static screenshot.
See the Full Workflow
Watch Daniel Bright run through the process in this 5-minute video - from a raw prompt all the way to a refined prototype with canvas edits and point-and-edit tweaks.
Now here's how to actually apply this to client work.
5 Prompts You Can Copy for Client Projects
Most Figma Make content tells you to "write a good prompt" and leaves it at that. Not helpful. Here are five for common freelance project types. Copy them, tweak the details, paste into Make. They follow the prompt structure that actually gets clean output: context → description → platform → visual style → UI components.
Freelance Agency / Studio Landing Page
Build a modern agency landing page for a creative design studio. Include a hero section with a bold headline, subheadline, and a "View Our Work" CTA button. Below, add a services grid (3 columns: Brand Design, Web Design, Product Design) with icons. Then a portfolio section showing 4 project thumbnails in a masonry grid. End with a testimonial carousel and a contact form. Use clean sans-serif typography, generous whitespace, and a dark navy + white + accent gold color palette. Desktop-first layout.
SaaS Product Landing Page
Create a landing page for a SaaS project management tool called "FlowBoard." Hero section with headline "Ship projects faster," a subheadline explaining the product, a "Start Free Trial" CTA, and a product screenshot mockup. Below: a 3-column feature grid with icons (Task Boards, Time Tracking, Team Chat), a pricing table with 3 tiers (Free, Pro at $12/mo, Team at $29/mo), a social proof section with logos of 5 companies, and a final CTA section. Light theme, Inter or similar modern font, blue primary color with gray accents. Desktop layout.
E-Commerce Product Page
Design a product detail page for a premium DTC skincare brand. Include a product image gallery (main image + 4 thumbnails), product title, price ($48), star rating, size selector (30ml / 50ml / 100ml), "Add to Bag" button, accordion sections for Ingredients, How to Use, and Shipping Info. Below, add a "You May Also Like" carousel with 4 related products. Aesthetic: minimal, warm tones, serif headlines with sans-serif body text, lots of breathing room. Desktop layout.
Client Dashboard / Admin Panel
Build a project management dashboard for a freelance client portal. Left sidebar nav with: Dashboard, Projects, Invoices, Messages, Settings. Main content area with a welcome greeting, 4 stat cards (Active Projects, Pending Invoices, Unread Messages, Hours This Week), a recent projects table (5 rows with project name, status badge, due date, and budget), and a quick-action button for "New Project." Clean and professional, light gray background, blue accent color, compact information density. Desktop layout.
Portfolio / Personal Site
Create a freelance designer portfolio site. Navigation bar with name/logo, Work, About, Contact links. Hero section with a large headline "I design products people love" and a brief intro paragraph. Work section showing 6 case study cards in a 2-column grid (thumbnail image, project title, one-line description, "View Case Study" link). About section with a photo placeholder and two paragraphs of bio. Contact section with email link and social icons. Minimal aesthetic, black and white with one accent color, modern sans-serif font. Desktop layout.
One thing worth noting: front-load detail into your first prompt. Platform, visual style, color palette, specific components, user goal. The more you give Make upfront, the less back-and-forth. You can also paste a Figma component or screenshot directly into the prompt box — Make will match the style, which is a huge shortcut if you already have a design system started.
The Proposal Hack: How to Close More Work With Figma Make
The traditional freelance sales flow:
Discovery call with client (30 min)
Send a written proposal with scope + pricing (1-2 days later)
Client reviews, maybe asks for a revision (2-5 days)
Client ghosts or says "we're going with someone else" (unknown)
The Figma Make sales flow:
Discovery call with client (30 min)
While the conversation is still fresh, open Figma Make and prompt a prototype based on what they described (10-15 min)
Pull it to canvas, swap in some quick brand-aligned touches (15-20 min)
Send the client a proposal with the clickable prototype link attached — within 2 hours of the call
Client clicks around something that feels like their product already exists
Why does the second flow win? You collapse the time between "this person seems competent" and "they already understand my project." A clickable prototype sitting next to a proposal just hits different than a PDF with bullet points. The project feels real. You go from "one of three options" to obvious choice.
The math on why this matters:
If you're sending 4 proposals a month and closing 1 (a 25% close rate — fairly normal for freelance design), and your average project is worth $4,000, you're earning $4,000/month from new clients.
If attaching a prototype bumps your close rate from 25% to 40% — and that's conservative when you're literally the only person sending a clickable demo — you go from closing 1 project to 1.6. That's an extra $2,400/month from the same number of calls you're already taking.
Annualized: roughly $28,800 in additional revenue. From adding 30 minutes of work to each proposal. That's the kind of leverage that's worth paying attention to.
The Earnings Math: What Faster Prototyping Does to Your Rate
The close-rate stuff is the big win, but faster prototyping also shifts the economics on every project you take.
Traditional prototyping timeline for a landing page project:
Discovery + brief: 2-4 hours
Wireframing: 4-8 hours
High-fidelity mockup: 8-16 hours
Interactive prototype: 4-8 hours
First client review: 18-36 hours of work before feedback
Figma Make prototyping timeline:
Discovery + brief: 2-4 hours
Prompt prototype in Make: 0.5 hours
Refine on canvas + push back to Make: 2-4 hours
First client review: 4.5-8.5 hours of work before feedback
That's a 60-75% reduction in time before a client sees anything. And revisions get faster too — point-and-edit for small changes instead of digging through layers and rebuilding components.
So what does that actually look like? Say you're charging $4,000-6,000 per landing page and each project runs ~3 weeks. You're doing 3-4 per quarter. Compress the prototyping phase and you can run 5-6 in that same window, especially once projects start overlapping.
At $5,000/project, that's $15,000/quarter vs. $30,000. Not a marginal improvement.
When NOT to Use Figma Make
No tool does everything well. Here's where Make breaks down and what to reach for instead:
Don't use Figma Make for native mobile apps.
It generates web-based prototypes. If your client needs native iOS or Android, use Bolt (supports React Native/Expo) or stick with Figma's standard prototyping for static flows. Make's mobile output tends to spit out weird hybrid layouts that take more time to fix than they saved you.
Don't use Figma Make for projects that need backend logic.
Auth, database queries, payments, persistent user data - Make doesn't do any of this natively. If the client needs a working MVP and not just a prototype, Lovable handles full-stack generation with Supabase better. (Make does have Supabase integration now, but it's limited. Don't rely on it for anything production-grade.)
Don't use Figma Make for complex multi-screen apps with 10+ pages.
After roughly 900 prompts in a single Make file, the AI context window gets bloated and it starts doing its own thing - ignoring instructions, generating random elements. If you're building something with 10+ screens, use Make for the hero screens (homepage, dashboard, one key detail page) and build the rest in Figma the normal way.
Don't use Figma Make when the client is paying for the design process, not just the output.
Some clients - especially agencies and larger companies - are paying for your thinking, not just the deliverable. Design rationale, system architecture, documentation. If you skip straight to a generated prototype, you're cutting out the strategic work that justifies $100+/hour rates. Use Make to speed up execution. Don't use it to skip the work that makes you expensive.
Where Make earns its keep: landing pages and marketing sites (absolute sweet spot), early-stage concept exploration when you're still feeling out direction, proposal prototypes to win work (see above), and client presentations where showing something clickable is worth 10x a static mockup.
Put This to Work
The playbook here is pretty simple: use Figma Make to attach clickable prototypes to your proposals, compress your revision cycles, and run more projects in parallel. The leverage is real.
If you skipped the video above, watch Dan build a full prototype from scratch in under 5 minutes. It makes the workflow click.
If you're building with tools like Figma Make and want to get that work in front of clients, set up a Contra portfolio. It's built for independents — showcase your prototyping work, get discovered, keep 100% of what you earn.
This post is part of Contra University, where independent professionals learn the tools and workflows that help them earn more.
Contra Tips
We're here to help. 👋
Need some help? You've come to the right place. Here, you'll learn more about Contra and how we can help you with your journey.
