Eight Dimensions of AI-Native Design ↗
The cleanest break with the old frame: components become conversations, states become spectrums. My demos stream and blend instead of flipping for exactly this reason.
SOURCES · AI-NATIVE DESIGN
Canonical readings for AI-native design, sequenced as a path. Every note is mine, written after reading the piece. Suggest what is missing: ayodhyarammohanthy@gmail.com.
What AI-native design is, and why it is not a skin on old software.
The cleanest break with the old frame: components become conversations, states become spectrums. My demos stream and blend instead of flipping for exactly this reason.
The textbook. User needs, mental models, trust - less fashionable than the agent discourse and more useful when you actually ship.
How the surface changes when software acts on your behalf.
Users evaluate an agent the way they evaluate a colleague - reliable, restrained, honest about what it did. Restraint as a design material. That one idea rewires a roadmap.
Generative UI is mainstream now. The design question is what stays fixed when the surface assembles itself - and the answer is grammar, not layout.
A pattern playbook with the right spine: show the reasoning, admit the uncertainty, hand control back. Closest to how I grade my own demos.
Your next user may not be human. Design for both readers.
An agent needs to know what a thing is, not what it looks like. The semantic contract under the pixels - most sites, mine included, are still catching up.
Once a team has several agents, the design object is the fleet. Give every agent an identity, owner, purpose, access boundary, review cadence and off switch. Make delegation preserve the initiating identity and pass only task-scoped authority with its own expiry. The control plane should answer what exists, who owns it, what it can reach, who it can call, what it did and how to stop it. Governance works when those answers are part of the build, not a document beside it.
An approval is not durable when the task keeps moving. Bind every effect to the exact task revision, referenced objects, role authority, operational controller and outcome evidence. When a person edits the shared application, a policy changes or a provider response arrives late, invalidate only the claims whose premises changed and ask again where needed. A correct component call can still compose into the wrong effect; continuous assurance belongs at the intent-to-effect boundary. This is a strong specification with worked examples, not yet evidence of production benefit.
Intuitive for people, structured for machines. Automated traffic has passed human traffic; be legible to both or illegible to one.
Governance consumes reasoning capacity. A full operating procedure can help a frontier model and stall a weaker one; a single verification rule may outperform the larger scaffold. The stronger move is an answer-blind definition of done derived from the task's policy and published standards, not one generic process for every workflow. Choose the model and the governance burden together, then measure each workflow separately. The results are exploratory - partial implementation, small cells and single trials - but the boundary condition is the useful decision.
Most teams are quietly building the wrong half - the half that draws, not the half that promises. Read it before your next system audit.
How shipped AI products actually got designed - told by the teams that built them.
Affora reverses the usual question. Instead of asking how an agent can cope with an interface built for people, it asks which interaction meanings the interface must preserve for both readers. The operating rule is substrate invariant, skin variable: keep controls, names, state, choices and outcomes explicit from component to site, while visual identity remains free to change. The checks are a conformance floor, not proof of task success.
The strongest generative UI pipeline starts before generation and ends after it. Teachers approve the objectives; levels, hints and feedback derive from those objectives; agentic checks test pedagogy, mechanics, solvability and visual noise; and a teacher decides whether the result can enter the library. Dynamic UI becomes credible when authority, evaluation and publication gates are designed as one system.
Supervision should shorten the path from 'what happened?' to a safe correction. Separate activity, elapsed time, tool traffic, workspace artifacts and subagent traces; then let people interrupt, revise the task or hand the same run to a stronger model without rebuilding context. AgentGUI's small study suggests that structured trajectories improve both lookup speed and accuracy, while its automated audit shows the largest completion gains on workers that can do most, but not all, of the job. The evidence is promising, not broad: eight participants and one synthetic steering task.
Propose several structured design directions first; choose one explicitly; then hold downstream code generation fixed. This architecture makes exploration a controllable product decision instead of adding randomness to both aesthetics and syntax. The evaluation lesson matters just as much: measure coverage, rendered difference, adherence, execution, accessibility and human preference separately, because broader variation did not consistently mean better judged quality.
The important move is not adding a CLI. It is keeping one typed design truth behind skill, MCP and CLI, then judging the whole task instead of the payload. Atlassian held agent, model and tasks constant, read transcripts as well as metrics, and let observed behavior change routing, batching and follow-up guidance. Distribution stays flexible because governance does not fork.
I keep returning to the subtraction test: does this help someone delegate, or give them another surface to manage? Grok Bot uses that question to govern the whole system - persistent Bots instead of disposable chats, presence that shows state, graduated status/preview/takeover supervision, role-bound context, structured responses and routines that keep work moving. The useful lesson is coherence: primitives, coordination and autonomy all answer to the same product principle.
Sierra’s leverage comes from refusing to become the 51st engineer. A tiny design team supports an engineering org nearly 20x its size by moving from individual polish to the systems, patterns and components that raise everyone’s floor, while keeping the judgment-building parts of craft deliberately human. Prototype against real data early; automate the infrastructure, not the taste.
Amazon Ads turns Figma into production React across 20+ marketplaces with a governed agent team: specialists extract the design system, generate code, test overlap and overflow, research local constraints and measure quality. The leadership pattern is allocation by consequence - shared rules for every agent, the strongest model on code generation, deterministic checks on the rendered result, and measurement as a first-class role.
The leadership asset is shared context, not a clever individual setup. Together AI gives every product area the same current context, encodes repeatable research and PRD work as team skills, and closes the loop with agent journeys that find product gaps, leave transcripts and re-verify the fix. AI-native product operations become collective memory plus continuous evidence.
Design governance becomes code: a repo skill routes judgment, linters enforce deterministic rules, evals test the guidance, and a weekly collector/judge/review-packet loop keeps human approval in charge. The operating metric matters: agents failed to invoke an available skill in 56% of Next.js evals, so trigger reliability must be tested separately from rule-following.
The leadership pattern is appropriate friction at scale: a named owner sets the models, skills, backends and approval rules for each project, while telemetry and deprecation keep a 2,000-skill ecosystem usable. Governance is product infrastructure, not a warning added at the end.
One design truth, two delivery shapes: Storybook for people and structured CLI/MCP plus workflow skills for agents. The leadership move is the hard stop - if neither source can verify the system, the agent does not improvise frontend code.
Treating agents as direct users makes design an operating-system problem: give them organizational context, keep a named human accountable across agent chains, and make inference spend a product decision. That is the leadership layer above any single AI interface.
The useful leadership shift is not "designers code more." Design moves upstream into roadmap judgment and downstream into the shipped interface, while agents compress the execution middle. That is the operating shape I want this portfolio to prove.
Linear designed boundaries instead of paths: system prompt, tool design, run scope and the harness underneath are where the behaviour is shaped. Script it too tightly and you dilute the flexibility that makes an agent useful - the agent-design trade in one line.
Intercom rebuilt Fin for email from first principles instead of porting the chat surface: an Intermission problem doc, an alpha with no bells, then iteration. The channel changes the contract - a case study in not copying your own pattern blindly.
The bowling-bumper model of agent design: walk the flow, ask what can go wrong at each phase, build the guard there. The alias trick is the gem - swap raw IDs for aliases and every hallucinated citation becomes detectable instead of silent.
Pattern-level playbooks for the daily work.
Lovable treats AI-native design as an org and governance problem, not a tool rollout. End-to-end ownership expands when everyone can build, while half the design system is written for agents. The useful failure is the leadership lesson: a two-week background-agent push did not hold, so the team kept the deterministic linters that did. Automate where the control is testable; kill the fashionable mechanism when it is not.
When build time collapses, design leadership moves to the two ends: deciding what deserves to exist and protecting the last mile of quality. Anthropic’s 30-person design, research and content team makes that operating shift concrete - code-first prototypes in the middle, stronger judgment before and after, and agents enforcing routine content standards in production.
Three accountable functions turn AI-native design into an operating model: skill librarian, eval owner and AgentOps. The draft RACI, fractional starting capacity, conversion thresholds, artifacts and cadences make the decision rights concrete enough to staff before they become full-time roles.
The leadership job is not to add panic to a team already moving fast. Steady the work, sharpen the principles, hire for dissent, and name which kind of speed matters before asking for more of it.
Sixteen patterns across delegate, steer, approve, interrupt, recover. The control-surface checklist alone is worth the read.
8 bookmarked systems, shared with the ayodhya. design system.
For keeping one product language coherent across platforms without forcing sameness.
For pairing a precise token system with component guidance you can inspect, test, and use.
For treating agent-ready documentation and customization as part of the system, not an integration added later.
Open the Astryx library in Figma ↗For a token architecture that can scale without losing intent.
Design tokens ↗Accessibility ↗Open the Microsoft 365 UI Kit in Figma ↗Open the Microsoft Teams UI Kit in Figma ↗Open Microsoft Teams App Templates in Figma ↗For keeping the Figma library, component states, local variables, and implementation aligned one to one.
Open Moon Design System v1 in Figma ↗For adaptive theming when one language must flex across contexts.
Open the Material 3 Design Kit in Figma ↗For product guidance that gives a component judgment, not only anatomy.
For governance that keeps consistency alive through scale and time.
AGENT DESIGN SKILLS · 11 STUDIED
The skills, guardrails, and workspaces I study to keep agent-made interfaces specific, usable, and true to their product.
UI prompting skillactive
For specifying type, image, crop, rhythm, and variation before the model reaches for a template.
Prompt like a system, not a moodboard.Interface audit skillactive
For giving an agent clear verbs to inspect and improve a rendered interface.
Critique must lead to a changeAgent skill and commandsactive
For turning aesthetic critique into explicit commands and detector rules.
Taste needs an operational vocabularyInteraction skill collectionactive
For translating interaction craft into a shared vocabulary designers, engineers, and agents can act on.
Polish needs shared languageAesthetic guardrailv2 experimental
For making aesthetic constraints visible before generic interface habits take over.
Guardrails before decorationUI quality skill setactive
For turning spacing, hierarchy, interaction, and accessibility into a repeatable finishing pass.
Taste needs a quality floor.Browser quality skill setactive
For proving the finished interface works in the browser, not only in the design review.
A beautiful screen still has to survive evidence.Agent skill
The baseline that made visual judgment portable inside a coding-agent workflow.
Portable visual judgmentLocal-first design workspaceactive
For keeping product design context local, legible, and close to the work.
Context belongs beside the productAnti-slop skill familyactive
For separating visual, implementation, and writing guardrails without pretending they are the same job.
Specific critique beats one generic scoreDesign reasoning skillv2.0
For exposing a wide design reasoning surface an agent can consult before it renders.
Breadth still needs product judgmentPEOPLE IN DESIGN · 1 FOLLOWED
Designers and design engineers whose work sharpens how I think about systems, interaction, and craft.
For the care he brings to how interfaces move, feel, and behave - and for making that judgment legible to designers and engineers.
WHAT TO STUDYPurposeful motion, timing and easing, interaction detail, and the bridge between design judgment and production code.
Reading holds when it meets running software. The patterns, the map and the starter kit are one click away.