Design Engineering
How to audit an AI-built product for design drift
After months of agent-written UI, products drift: near-duplicate components, stray values, mismatched patterns. A step-by-step audit to find it, rank it and fix it.
4 min read
Blog
Design Engineering
Design systems, tokens, responsive and accessible UI, and keeping agent-built products consistent.
8 articlesRSS
Articles
8 articles
- Design Engineering
How to improve typography in AI-generated websites
AI-generated sites default to safe fonts, too many sizes and weak hierarchy. How to fix the type scale, pairing, line length, spacing, wrapping and font loading.
4 min read
- Design Engineering
How to make AI-generated UI responsive
Why AI-generated interfaces break on phones, and how to fix tables, sidebars, navigation, cards, touch targets and type with specific prompts and real-width testing.
5 min read
- Design Engineering
How to make AI-generated interfaces accessible
A practical checklist for AI-generated UI: semantics, keyboard, focus, contrast, forms, target size and ARIA, plus what automated tools catch and what they miss.
5 min read
- Design Engineering
Design tokens for AI coding agents: CSS variables and Tailwind
Set up semantic design tokens with CSS variables and Tailwind v4 so AI coding agents can only use your colours, type and radii, with a tested check for drift.
6 min read
- Design Engineering
How to keep AI coding agents consistent across a product
When several people and agents build one product, the UI drifts. Shared instructions, principles, components, tokens, references and review keep it coherent.
4 min read
- Design Engineering
How to make Claude Code follow your design system
Stop visual drift in AI-written UI. Point Claude Code at your components and tokens, write rules it can verify, enforce the critical ones, and review the result.
4 min read
- Design Engineering
The design engineering workflow: from reference to working product
A five-stage design engineering workflow with AI coding agents: collect references, define direction, build in code, review in the browser and refine.
3 min read
Better design starts with better context.
Give your AI coding agents access to your design taste, references and preferences.