AI for designers: what works, what doesn't, and where it's heading

Product designers can use AI across four areas of their workflow: rapid prototyping and layout generation, image creation and visual assets, design system setup and maintenance, and building functional products with AI coding tools. But the value comes from applying design judgement to AI output, not from treating AI tools as shortcuts. AI for designers is not about handing over the creative process; it’s about understanding how to elevate your strategy with Compass: The AI marketing app . It is about knowing where these tools genuinely save time, where they fall short, and being honest about the difference.

Figma’s 2025 AI report found that only 31% of designers use AI for core design work, compared to 59% of developers (Figma ). That gap exists because most designers haven’t figured out where AI genuinely helps yet. A lot of this stuff is down to experimentation, and most people haven’t done enough of it to form a real opinion.

I’m Fergus Hannant , and at Fifty Five and Five I’ve been experimenting with AI across every stage of the design process. Prototyping, image generation, design systems, and building products with AI coding tools. Over seven years of working across legaltech, healthtech, insuretech, and B2B SaaS, I’ve developed a broad skill set that means I can test these tools across a range of design disciplines, not just one. This piece is a working designer’s account of what actually works, what doesn’t, and where things are heading. Not a tool roundup. Not a trend report. Just what I’ve found by getting stuck in.

Where AI prototyping tools speed up the design process (and where they don’t)

AI prototyping tools speed up the repetitive, systematic parts of the design process: generating layout variations, auto-arranging components, and suggesting accessibility improvements. They are genuinely useful for iteration. Where they fall short is anything that requires strategic thinking, information hierarchy, or an understanding of how real people use a product.

Figma’s 2025 AI report found that 78% of product builders say AI enhances efficiency, but only 32% trust the output (Figma ). That efficiency-trust gap is the key thing to understand about AI prototyping tools right now. They make certain tasks faster, but the output still needs a designer’s eye before it goes anywhere near a user.

The tools themselves are evolving quickly. Figma’s built-in AI features, dedicated wireframing tools, and layout generators can all produce workable starting points in a fraction of the time it would take to build from scratch. For generating multiple layout options to test with stakeholders, or for quickly mocking up a screen that you already know the structure of, these tools are a genuine time saver.

The distinction comes down to what kind of task you’re giving AI. The tasks AI prototyping tools handle well are all systematic and rules-based: “arrange these components in a grid,” “generate three layout variations for this content,” “check colour contrast ratios.” The tasks they handle badly are the ones that require design thinking: deciding what information is most important on a page, designing an interaction that feels intuitive, understanding why a user might abandon a flow at a specific step. Those decisions require empathy and context that AI just doesn’t have.

My approach is straightforward. Use AI to generate options quickly, then apply design judgement to select and refine. Start slow to then be able to move quickly. Let the tool handle the volume. Keep the thinking for yourself.

The designers I know who are getting the most from AI prototyping tools aren’t using them to replace their process. They’re using them to compress the parts of the process that used to eat up time without adding much creative value. That’s a meaningful difference.

AI image generation in practice: from blog assets to branded video

AI image generation tools like Sora, Whisk, and Firefly are fast, increasingly intuitive, and useful for generating visual assets at speed. But the output often feels unfinished. Too flat, too clean, lacking the texture and character that makes a visual feel considered rather than generated. The practical value of AI image generation comes from combining it with human creative post-processing, not from treating the raw output as a finished product.

I’ve been using AI tools to generate internal blog imagery at Fifty Five and Five, and I kept running into the same problem: the images looked polished but lifeless. What was missing was texture, noise, and human character. The kind of imperfection that makes something feel real.

So I built two small tools using Claude Code. The first lets me upload an image and use a texture sample as a brush, adding grain, colour overlays, and noise controls. The second creates pixelated versions of any image with adjustable colour and pixel size parameters. Together they bring back the character that AI visuals often lack. I know these effects can be quite easily created using Photoshop. But I find it really exciting that AI coding tools let me explore creative ideas that I wouldn’t have even considered before. The tools themselves became part of the creative process.

The bigger test came with the TCS London Marathon activation . One of the tougher parts of the project was creating the iconic finish-line environment: the Mall, Buckingham Palace, the finish tape. We needed photo-realistic footage of the finish line without actual runners in it, so that 3D avatars could be composited into the scene. Stock footage couldn’t deliver what we needed: it was either too expensive, too crowded, or outdated. Using AI image tools and our bespoke video tech, we produced the final sequence: a photo-realistic moment of a runner crossing the line. Clean branded footage that simply wasn’t available any other way.

Both of these examples point to the same thing. AI image generation works best as a starting point, not an endpoint. The raw output gets you 70% of the way there quickly. The last 30%, the part that makes it feel considered and on-brand, still needs a designer’s hand. That’s not a limitation of the technology. That’s just how creative work works.

How AI can help you build a design system faster

AI can accelerate the methodical, rules-based parts of building a design system: generating colour scales, type hierarchies, and component libraries from documented guidelines. It turns a process that normally takes weeks of careful setup into something you can get to a reliable starting point on in a fraction of the time.

Setting up a new design system is normally daunting. Guidelines need following closely, and early mistakes are painful to fix later because everything else builds on top of those foundations. When I was setting up a design system for Avalara, I used Claude Code and Figma MCP (Figma’s Model Context Protocol integration, which lets AI tools interact directly with your design files) to create colour and typography variables with a few prompts. I then generated a range of form input components, keeping them on brand by giving Claude Code the Avalara website and design guidelines as reference material.

The result was a significant time saving with consistent output that could be relied upon with minimal manual work. There was still some effort needed renaming and turning designs into proper components, but the heavy groundwork was done. The AI handled the structured, pattern-following tasks well: applying colour values correctly across a scale, generating consistent type hierarchies, building components that matched documented patterns. What still needed human work were the edge cases, the judgement calls about where a guideline needed interpreting rather than following literally.

The key principle here is one I come back to across all AI work: start slow to then be able to move quickly. Give the AI clear, documented brand guidelines as input. Not a vague brief. Not “make it look modern.” Actual specifications: these are the brand colours, these are the type scales, these are the spacing rules. The more precise the input, the more reliable the output. When I gave Claude Code the Avalara guidelines as a starting point, the generated components were close enough to be useful immediately. When inputs are vague, the output is vague too.

I would definitely consider doing this going forwards for new design system projects. The time saving is real, the quality is consistent, and the parts that need human attention are exactly the parts where a designer should be spending their time anyway: the edge cases, the interpretation, the judgement calls that make a design system feel coherent rather than just technically correct.

How designers are building real products with AI coding tools

The biggest shift happening in design right now is that designers can build functional products, not just design them. AI coding tools have changed the role fundamentally. This isn’t replacing development. It’s expanding what a designer can deliver.

Andrej Karpathy coined the term “vibe coding” in early 2025 to describe non-developers building real products with AI coding tools. What started as a niche experiment is becoming a genuine shift in how digital products get made. Designers who understand user flows, information architecture, and interaction patterns now have the tools to turn those designs into working products without waiting for a development handover.

The Fifty Five and Five website is the clearest example I can point to. I led the design and build from scratch using Claude Code. No WordPress. No web builder platforms. We ended up with a site we can maintain and update rapidly, fully optimised for SEO and GEO (Generative Engine Optimisation, meaning it’s structured for AI search engines too), scoring 100/100 on Google PageSpeed. The design thinking was the same as any other project. The difference was that I could take a design decision and implement it immediately, testing and refining in real time rather than handing off a mockup and hoping it translated.

The TCS London Marathon project pushed this further. I started in Figma mapping user flows and early layouts, then moved into Claude Code to build the front end and get the experience working in real time. Thousands of runners used the tool across the Expo. It was a fast-paced and innovative project. Seeing thousands of runners use something I had designed and built was a highlight I won’t forget. The project won a Drum award for Campaigns Powered by AI.

The tools making this possible include Claude Code, Databutton, and Figma Make. Each handles a different part of the process: Claude Code for building and iterating on code directly, Databutton for rapid app prototyping, and Figma Make for bridging design files into functional output.

The design thinking is the same as it has always been. User research, information architecture, interaction design, visual hierarchy. None of that changes. What changes is the output. A designer who can build is not a worse developer. They are a designer who can deliver more. The perspective they bring to building, the attention to user experience and detail, is something that makes the final product better.

Will AI replace designers? Not if you understand what it can’t do

AI won’t replace designers, but it will change what the role looks like. Figma’s 2025 AI report found that 85% of designers and developers say learning AI will be crucial for future success, yet designers remain consistently more sceptical of AI output quality than developers (Figma ). And for good reason.

Over half of designers surveyed in a DesignLab study expressed concern about AI’s impact on design quality (DesignLab ). That concern is not unfounded. AI generates output that looks competent on the surface but often lacks the strategic thinking underneath. It can produce a layout, but it cannot tell you whether that layout serves the user’s actual goal. It can generate a dozen icon variations, but it cannot decide which one communicates the right message in context.

What AI cannot do: strategic thinking, user empathy, design judgement, brand interpretation, and knowing when to break rules. These are the capabilities that define a good designer, and they’re the ones AI is furthest from replicating. AI excels at the repeatable, pattern-based parts of design. It struggles with anything that requires understanding context, making trade-offs, or empathising with the person on the other end of the screen.

AI is not something that I default to. It’s something that I consider and think about the best way to use. Experimenting is the best way to figure out how to utilise these new technologies. It’s not just taking them as a given as a shortcut. It’s thinking about where we can use them appropriately and get the best results for clients and internally.

The designers who thrive will be the ones who treat AI as a tool in the process, not a shortcut around it. The ones who experiment, figure out where AI genuinely helps in their specific workflow, and apply their judgement to everything AI produces. AI amplifies craft. It does not replace it.

How can product designers use AI in their design process

The question was how designers can use AI in their design process. The answer: across prototyping, image generation, design systems, and building products with AI coding tools. But always with design judgement applied to AI output.

Start with the repeatable, structured parts of your workflow. That is where AI saves the most time. Layout generation, component creation, colour scale setup, accessibility checks. These are tasks where AI can produce reliable output quickly, freeing you to spend more time on the decisions that actually matter.

Don’t accept AI output as finished. Post-process, refine, apply your judgement. The “too clean” problem I described with AI image generation applies across the board. AI output needs a designer’s hand to feel considered, on-brand, and human.

Experiment with AI coding tools. The “designer who builds” is not a future concept. It is happening now. Tools like Claude Code, Databutton, and Figma Make are enabling designers to deliver functional products, not just designs. The design thinking is the same. The output has grown.

Be honest about what AI cannot do. Strategy, empathy, taste. These are the capabilities that make design valuable, and they’re exactly the ones AI lacks. AI for designers is not a finished story. The tools are evolving quickly, and the designers who invest in understanding what works now, and what doesn’t, will be the ones who use it best.

I’ll be going deeper into three areas in upcoming pieces: AI image generation for designers, AI design systems, and AI development tools for designers. Each one deserves its own detailed look at what’s working, what’s not, and what I’ve learned from building real projects with these tools.

If you’re looking for AI-augmented design capability for your next project, get in touch . I’d be happy to walk you through how we approach it at Fifty Five and Five.

Frequently asked questions