Notes on product design and AI product UX
Plain-language notes on product design, design engineering and AI product UX, from the studio.
Style debt: how to keep design and code from drifting apart
Hardcoded colors, heading sizes that don't match, dark mode that breaks. That's style debt. Here's how we set up color, type and tokens so the design file and the code stay in step.
Read the post-
How we scope fixed-price design work
Fixed scope protects both sides. How we agree screens, flows and changes before we start, and when we do not quote a fixed price.
Read -
Healthtech product design: clarity, privacy and care
Health products need plain language and careful data handling. Design points for healthtech UX, and where you need specialist review.
Read -
What a dev-ready handoff includes
"Dev-ready" is a promise. Here is what is in the box when we hand over a design: flows, screens, states, components, tokens, notes and a walkthrough call.
Read -
Fintech app design: trust, onboarding and compliance screens
Fintech users need clarity before they share data. Design guidance on trust cues, KYC steps, money screens, errors, notifications and working with legal.
Read -
How we run the free design review
The free design review is a short video review of one page or flow. Here is how it works, what we look at, what you get and what it does not cover.
Read -
Design tokens explained for product teams
A plain explanation of design tokens: what they are, how to name them, how they move from Figma variables to CSS and what to do first in an existing product.
Read -
Approval steps and undo in agentic interfaces
When software acts for the user, mistakes cost more. Which actions need approval, how previews work, and how to design undo and a readable activity log.
Read -
What to prepare before you hire a design agency
A short list of what to gather before you contact a design agency: goals, users, old work and constraints. Quotes come faster and scoping gets better.
Read -
Figma to code: a handoff engineers do not have to redo
A good Figma to code handoff is a shared structure, not a longer spec. Naming, components, tokens, states and how to review the built result.
Read -
Redesigning a SaaS product without losing existing users
How to change a live SaaS product without upsetting the people who already use it: what to check first, how to stage the change and how to tell users.
Read -
WCAG 2.2 for product teams: the changes that matter in practice
WCAG 2.2 adds rules that touch everyday UI, like target size and focus visibility. What changed, in terms designers and developers can act on.
Read -
Google-style design sprint vs MVP design sprint: what is the difference
Both use the word sprint. We compare a five-day workshop with a four-week design project, and say when each one is the better choice.
Read
Want this kind of thinking on your product?
Send your site or app and get a free design review. No sales call, no cost.