EN
AI Product Design in Practice: Designing AI Features and Working With AI

AI Product Design in Practice: Designing AI Features and Working With AI

Book a call now

Explore all our theme

The essentials

AI product design has two halves. Designing AI features means designing for uncertainty: set expectations, show the work, keep outputs editable, explain sources, and plan for failure. Using AI in the design workflow means delegating translation and repetition while keeping positioning, concepts, and final judgment human. Both depend on a design system and brand guidelines precise enough for a machine to follow.

AI product design is the design of digital products that use AI, and the use of AI inside the design process itself. The two meanings overlap more every month, and funded startups usually meet both at once: the product roadmap adds an AI feature while the design team starts using AI tools to ship faster.

This article covers both halves from a studio's point of view. First, the UX patterns that make AI features trustworthy. Then, what we delegate to AI in our own workflow and what we refuse to. Last, how to write brand guidelines that an AI tool can actually follow.

Why AI features need different design

Traditional software is deterministic: the same click produces the same result. AI features are probabilistic: the same request can produce a different answer, a slow answer, or a wrong one. Most of the classic UX toolkit assumes the first kind of software. Designing for the second means designing for uncertainty, which changes how you handle expectations, waiting, errors, and control.

The stakes are highest in the sectors where we work most. In fintech, a confident wrong answer about money destroys trust faster than no answer. In B2B SaaS, an AI feature that cannot be audited will not pass a security review. In Deeptech & AI products, the interface is often the only part of the technology a buyer can judge.

Six patterns for AI features users trust

1. Set expectations before the first prompt

Users arrive with expectations shaped by general chat assistants. Tell them what the feature is good at and what it will not do, with examples they can click. A blank input with a blinking cursor is the worst possible onboarding for an AI feature.

2. Show the work in progress

Waiting for an answer with no feedback feels broken. Stream the output as it is generated, or show the steps the system is taking ("reading 3 documents", "comparing prices"). Visible progress turns latency into evidence that work is happening.

3. Make every output editable

Treat AI output as a first draft the user owns. Let them edit it inline, regenerate one part without losing the rest, and undo. Features that deliver a final, untouchable result push users to copy the output somewhere else, and the product loses the session.

4. Explain where answers come from

Show sources, the data used, or the reasoning in short form. Citations and "based on" labels let users check the answer instead of trusting it blindly, and they make the feature defensible in enterprise reviews.

5. Design the failure states first

Decide what users see when the model is slow, uncertain, or wrong: a fallback to the manual flow, a clear "I'm not sure" state, an easy way to report a bad answer. These screens get less attention than the happy path and do more for retention.

6. Keep the human in control

For any action with consequences (sending a message, moving money, deleting data), the AI proposes and the user confirms. Make the confirmation specific: show exactly what will happen, not a generic "Are you sure?".

AI in the design workflow: what we delegate and what we keep

The second meaning of AI product design is the AI design workflow: how studios and product teams use AI tools to design and ship. Our rule is simple. AI takes the translation and repetition work. Humans keep the decisions that define the brand.

What we delegate: turning Figma design tokens into code, generating component variants from an approved base, writing first drafts of documentation, and checking that shipped pages match the design system. On the website redesign we led for InCard, this workflow cut the build from roughly five weeks to three. We describe the full stack in how we scale design systems with Figma, Claude and GitHub.

What we keep human: positioning, naming, identity concepts, and every final judgment call on quality. These are the decisions a client pays for, and the ones where a plausible-looking average answer is the worst outcome. AI is fast at producing options; it is not accountable for choosing between them.

If you are evaluating tools rather than workflows, we compared the market in the best AI design tools for marketing teams.

AI brand guidelines: making your brand machine-readable

Brand guidelines were written for designers who could interpret intent. AI tools cannot, so guidelines that work well for people often fail when a team starts generating copy, images, or layouts with AI. AI brand guidelines close that gap. Four changes make the difference.

Put the design system in code. Colors, type, and spacing should live as tokens an AI tool can read, not as values in a PDF.

Write rules as examples. "Friendly but professional" means nothing to a model. Three on-brand and three off-brand examples of the same sentence mean a lot.

Give the voice a test set. A short list of headlines, error messages, and emails in the brand voice becomes the reference every AI prompt can include.

Add an AI usage section. State what may be generated (illustration variants, first drafts) and what may not (the logo, product screenshots, customer quotes), and who approves the output.

These guidelines are part of what we hand over in a brand identity engagement, next to the Figma library.

Where to start

If you are adding an AI feature: prototype the failure states and the editing flow before polishing the happy path, and test them with real users. If you are adopting AI in your design workflow: start with token translation and design QA, where the gains are easy to measure. In both cases the foundation is the same: a design system precise enough that a machine can follow it. Our product design practice works on both.

What is AI product design?

AI product design means two things. It is the design of products and features powered by AI, such as assistants, recommendations, or automated workflows, which requires patterns for uncertainty, editing, and control. It is also the use of AI tools in the design process itself, to speed up repetitive work like turning design tokens into code or generating component variants.

How do you design AI features users trust?

Set expectations before the first use, show progress while the model works, make every output editable, explain where answers come from, design the failure states first, and keep the user in control of any action with consequences. Trust comes from users being able to check and correct the AI, not from the AI being perfect.

Will AI replace product designers?

AI is replacing parts of the work: translation between design and code, variant generation, documentation drafts. It is not replacing the decisions: what the product should do, how the brand should feel, and which of many plausible options is right. Teams that use AI for the first kind of work have more time for the second.

What are AI brand guidelines?

AI brand guidelines are brand guidelines written so that AI tools can follow them: design tokens stored in code, voice rules expressed as on-brand and off-brand examples, a reference set of copy, and a section that says what may be generated with AI and who approves it.

What is an AI design workflow?

An AI design workflow is a design process where AI tools handle defined, repetitive steps, such as converting Figma tokens to CSS, generating component states, or checking that production matches the design system, while designers keep strategy, concepts, and final review. Done well, it shortens build phases without lowering quality.

Good to know

If your product team is adding an AI feature this quarter, design the failure states first: what the user sees when the model is slow, wrong, or refuses. Those screens decide whether users trust the feature after the first bad answer, and they are the ones most teams leave for the end.

Design, business, and brand. No bullshit.

Insights on branding, conversion, and product building.
What we learn shipping for startups that scale.
Book a call now