Figma shipped a lot of AI features in the 2025–2026 period — First Draft, Figma AI sidebar, prototype generation, Make (the design-to-code feature), and several smaller AI-assisted tools. I've been using Figma as my primary design tool for 4 years and have given all of these a genuine test in real client projects. Here's the honest evaluation.
First Draft — genuinely useful for ideation, not production
First Draft lets you describe a UI in natural language and generates a basic Figma frame with components, layout, and content. For example: "A SaaS dashboard homepage for an e-commerce analytics tool — dark mode, left navigation, headline stats across the top, a chart below, and a recent orders table." The output: a recognisable starting point that captures the described structure, with approximately correct component types and a placeholder layout.
What it's good for: the blank-canvas problem. When I'm starting a new project and staring at an empty Figma frame, First Draft gives me a structural starting point that I can then edit, refine, and push toward the actual design. It compresses the "blank canvas to rough structure" step from 20–30 minutes to 5 minutes. I still replace most of the generated content, refine the spacing, and make the component choices that match the actual design system. But I'm working from something rather than nothing, which is psychologically and practically different.
What it isn't: production-ready design. Every First Draft output I've used has required significant editing. The typography is generic, the spacing is approximate, and the component choices often don't match the design system you're working in. Use it as a thinking tool and ideation accelerator, not as a deliverable.
Figma AI sidebar — the features I actually use daily
The Figma AI sidebar has several capabilities. The ones that have earned a place in my daily workflow:
Rename layers: This is the most unsexy feature and one of the most genuinely useful. After importing an asset, doing a quick wireframe, or working with auto-generated components, the layer panel is often a mess of "Frame 47," "Group 12," and "Rectangle 3." The AI rename function looks at each layer's content and renames them descriptively ("Header Navigation," "Hero Section," "Card Component"). This saves 10–15 minutes per file and makes the design much easier to hand off. I use this on every project now.
Generate placeholder content: Instead of manually writing dummy text for each text layer, I select all text layers and ask Figma AI to fill them with appropriate content for the context. For a restaurant website design, it generates plausible dish names, descriptions, and prices. For a SaaS product, it generates realistic metric values and user names. This is meaningfully better than "Lorem ipsum" for client presentations where realistic content helps demonstrate the design intent.
Translate content: For designs that need to be localised, the AI can translate UI copy while maintaining formatting and layer structure. Useful when presenting designs to clients who need to see the interface in their language.
Auto Layout assistance — saves time on implementation
Figma's AI can suggest and apply Auto Layout configurations to existing frames. If you've designed components manually without proper Auto Layout constraints, the AI can analyse the structure and apply appropriate Auto Layout settings so the component behaves responsively. This is not design magic — it still produces imperfect results for complex layouts — but for standard component patterns (card grids, list items, navigation bars), it produces correct or near-correct Auto Layout in a single click that would have taken several manual steps.
Make (design to code) — promising but use with caution
Figma Make generates front-end code from designs. In 2026, the output quality has improved substantially from its early versions. For simple, well-structured components with proper design system organisation, the generated code is reasonably clean. For complex, densely layered designs or designs that weren't built with code generation in mind: the output requires significant editing.
My honest use case for Make: generating a starting-point component in a specific framework (React + Tailwind, for example) that I then hand to a developer as a reference implementation, not as production code. The developer reviews it, cleans it up, and integrates it with appropriate changes. This collapses the design-to-development hand-off gap — the developer starts with something that's 60–70% there rather than a static image. The collaboration quality improvement is real even if the code isn't shipped as-is.
What I don't do: ship Make output to production without review. The generated code doesn't always follow accessibility best practices, sometimes produces inline styles where class-based styles are better, and doesn't handle edge cases or responsive behaviour as a developer would. It's a starting point, not a finisher.
My actual weekly Figma AI workflow
To make this concrete: here's how AI features factor into a typical week of design work for me.
Monday (project kick-off for a new client): I open First Draft, describe the client's business and the primary pages I need, and generate a rough structural layout for 3–4 pages. I review the output, take the structural elements that make sense, discard what doesn't, and start building my actual design from the cleaned-up starting point. This replaces my previous workflow of spending 30–40 minutes looking at reference sites and positioning blank frames.
Tuesday–Wednesday (design development): inline within normal Figma design work. I use AI rename layers after building any significant section to keep the layer panel clean. I use the AI fill content tool when I need realistic placeholder text for presentation frames — restaurant menus, product names, article headlines. Small uses, consistent time savings.
Thursday (hand-off prep): if the project involves a developer hand-off, I run Figma Make on 2–3 key components to generate starting-point code for the developer. I annotate the generated code with notes about what needs review and send it alongside the design specs. The developer tells me consistently that this reduces the "translating design to code" interpretation work.
What I don't use Figma AI for: final client presentations (First Draft output is too raw to present directly to clients), production asset exports, or anything where accuracy is critical and AI output needs fact-checking. The line between "AI as an accelerator" and "AI as a corner-cutter" is where the design work suffers or doesn't. Stay on the right side of it.
Figma AI on responsive design — what still needs manual work
One area where Figma AI hasn't meaningfully accelerated the work: responsive layout behaviour. First Draft generates desktop layouts that look good at 1440px. The mobile interpretation — how the layout collapses, which elements stack, what the tap targets become on 375px — is still entirely manual work and it's still where most of the design time goes for client projects.
The Auto Layout AI assistance helps with component-level responsive behaviour, but the whole-page responsive design logic remains a significant manual process. For a 5-page marketing site, I'd estimate Figma AI saves me 2–3 hours on the desktop design and zero time on the mobile design. It's still worth using for the desktop savings alone, but calibrate your expectations: the mobile design process is the same as it was before AI features shipped.
The area where I'm watching for improvements: Figma's annotation and developer spec features in the AI context. If Figma can generate accurate responsive behaviour annotations alongside the Make code output — specifying breakpoints, stack order, spacing rules — that would meaningfully change the hand-off workflow. As of early 2026, that's not there yet.
Related: Framer AI vs Webflow vs custom code and Cursor vs Windsurf vs GitHub Copilot in 2026.