AI
The Designer's Playbook for Designing AI Products
Some of us stumbled into AI design without meaning to. One day you're pushing pixels for a fintech dashboard, the next you're figuring out how to make a chatbot feel less like a customer service nightmare and more like a colleague who actually listens. That's how it happened for me. I was working on a feature, and someone said, "Can we add AI to this?" I didn't have a playbook. I don't think anyone did.
If you're reading this, you're probably in a similar position. Maybe your product team just decided everything needs to be "AI-powered" now. Maybe you're genuinely curious about what changes when the interface can talk back. Either way, welcome. I've spent the past months digging through research, case studies, and my own experiments to figure out what actually works. This is what I've learned.

The old rules still apply (mostly)
Here's something that surprised me: designing for AI isn't as alien as it sounds. The fundamentals (user needs, clear feedback, intuitive flows) don't disappear just because there's a language model involved. If anything, they matter more. When the system can generate unpredictable outputs, your job as a designer is to create enough structure that users don't feel lost.
But there's a catch. Traditional interfaces are deterministic. You click a button, something happens, and it happens the same way every time. AI breaks that contract. The same prompt can yield different responses. The system might confidently give you wrong information. It might do exactly what you asked but not what you meant.
According to research from Maggie Appleton, conversational AI is slow. Users struggle to articulate their intent efficiently, sometimes taking 30 to 60 seconds just to type what they need. I read that and thought about every time I've watched someone stare at a blank chat input, unsure what to type. The blinking cursor is a terrible onboarding experience. This is why the best AI products don't just throw you into a conversation. They guide you.
Start with the user, sprinkle AI where it helps
There's a phrase I keep coming back to: AI-second design. The idea is simple. You don't start by asking, "How can we use AI here?" You start by asking, "What does the user actually need?" Then you figure out where AI can quietly make that easier.
Think about it like seasoning. You don't dump an entire jar of pepper into a pot because you bought pepper. You taste the food first, then add what's missing. AI is the same. It should enhance what's already working, not become the entire meal.
Jakob Nielsen's team at NN/g calls this the difference between "AI-first" and "user-first" design. The products that win are the ones where you barely notice the AI is there. It just makes things faster, smarter, or more personal.
The trust problem (and why it's your problem now)
Here's the uncomfortable truth: most people don't trust AI. And honestly, they probably shouldn't, at least not blindly. The systems hallucinate. They make things up with complete confidence. They reflect biases from their training data. As designers and developers, we're now in the business of managing expectations we didn't create.
I think about trust in three layers:
- Visibility - Can the user see what the AI is doing?
- Explainability - Can they understand why it did what it did?
- Control - Can they change it, override it, or ignore it entirely?
What this looks like in practice
- LinkedIn tells recruiters why a candidate is a good match.
- Microsoft Copilot shows citations so you can verify sources.
- PayPal uses machine learning to detect fraud and explains why transactions are flagged.
Patterns that actually work
Wayfinders
These help users get started. Think example galleries, prompt suggestions, templates, and action chips.
Governors
These keep humans in the loop. Action plans that show what the AI is about to do before it does it, and explicit confirmation controls.
Trust builders
Caveats that acknowledge uncertainty, citations that link to sources, and clear disclosure labels.
Tuners
Knobs, filters, parameter sliders, and iterative adjustment controls to refine intent.
Errors will happen. Design for them.
Good error design in AI products does three things:
- Clears up the misunderstanding transparently.
- Explains what the AI can and can't do.
- Offers a clear path forward (or handoff to a human).
Predictions for the next era
- Chat will become one input among many — Multimodal task-oriented interfaces will lead.
- Agentic AI delegation interfaces — Designing for autonomous collaborators with guardrails.
- Progressive disclosure — Clean default surfaces with layered depth on demand.
- Real-time adaptive interfaces — Dynamic density and personalization.
- Visible confidence scores — Nuanced indicators showing certainty levels.
Resources
- Shape of AI — Emily Campbell's pattern library
- Microsoft HAX Toolkit — Human-AI interaction guidelines
- People + AI Guidebook — Google's AI UX resource
- NN/g AI and Machine Learning UX Guidance