Design systems under non-deterministic output
Primitives for AI-native products
Technical Research Note. Independent research. Not peer reviewed.
Abstract
A design system is a mechanism for making a decision once and applying it everywhere. Its components encode assumptions about the content they hold: that it was authored by a person, that its length falls in a known range, that its structure is fixed, that it is present rather than arriving, and that it is true.
Generated content violates all of these. In current practice, each violation is handled locally by whichever team ships the feature, which means a product accumulates six different treatments for machine-authored text, four different loading behaviours for streamed output, and no consistent way to represent that the system does not know something.
This note works through the broken assumptions and proposes eight primitives that would absorb them at the system level, together with an extended state enumeration. The method is conceptual analysis. Nothing proposed here has been implemented or tested, and the note is explicit about the risk that these primitives would be used to decorate uncertainty rather than to reduce it.
Research question
Which assumptions encoded in a conventional design system does generated content violate, and what primitives would allow a system to absorb those violations once rather than once per feature?
Background
The value of a design system is not consistency of appearance. It is that a decision made carefully in one place is inherited everywhere, including by teams who were not present when it was made and who lack the context to make it well.
That mechanism works because components encode assumptions. A card component encodes that a title is short, that a body is a paragraph or two, that an image has a known aspect ratio. A state enumeration encodes that a component is in exactly one of a small number of conditions. A token layer encodes that spacing, colour and type are drawn from a fixed scale.
Six such assumptions are load-bearing and all six fail under generated content.
Authorship. The system has no vocabulary for distinguishing a string a person wrote from a string a model produced. Every component treats both identically.
Bounded length. Component designs assume a range. Generated output has no upper bound that the system controls, and the practical bound is a model parameter rather than a design decision.
Fixed structure. A component expects fields. Generated output may omit a field, add one, or return prose where a list was expected.
Small state set. The conventional enumeration is default, hover, focus, disabled, loading, error and empty. Generated content introduces states this list cannot express.
Presence. Content is present or absent. Streamed content is arriving, which is a third condition with layout, accessibility and interaction consequences.
Truth. Nothing in a design system marks a string as possibly false. Provenance and verifiability are not properties any component vocabulary has needed until now.
Methodology
Conceptual analysis, meaning reasoning from stated premises toward a framework, with no data collection.
The premises are the six assumptions listed above and the claim that they are encoded in current component libraries rather than merely common. Published specifications and guidelines are used to supply constraints that any proposal must satisfy, particularly on accessibility and layout stability, where the requirements are externally defined rather than a matter of preference.
No products were audited, no components were built, and no users were tested. Where build experience appears it is declared as practitioner observation from a single-operator sample.
Evidence
Frost, Atomic Design, 2016. The compositional model most systems follow, building interfaces from atoms through molecules and organisms to templates and pages. The relevant property is inheritance: a decision made at the atom level propagates upward, and a decision made at page level does not propagate at all. This is why a per-feature treatment of generated content produces divergence by construction.
Design token practice, as established by the Salesforce Lightning Design System and subsequent work. Tokens are the mechanism by which a design decision becomes a named, versioned, referenceable value. The argument in this note depends on tokens being available for non-visual decisions as well as visual ones, which is a use they already support in practice for motion and elevation semantics.
Nielsen, 1994, usability heuristics. Visibility of system status, user control and freedom, error recovery. The empty state and loading state vocabulary in modern systems descends from these, and the heuristics are the reason a state enumeration exists at all rather than states being handled ad hoc.
Norman, 2013, The Design of Everyday Things. The gulf of evaluation, meaning the effort a user expends determining what the system did and whether it matched their intent. Generated content widens this gulf, because the output does not carry a visible relationship to the input. Any primitive proposed here should be assessed by whether it narrows the gulf.
Amershi et al., 2019, "Guidelines for Human-AI Interaction" (CHI). Eighteen validated guidelines. Several are stated at a level that maps onto components rather than onto features: make clear what the system can do and how well, support efficient invocation, dismissal and correction, convey consequence, and notify users about changes.
The observation this note takes from the set is that guidelines phrased as product advice are implemented inconsistently, whereas the same guidance embodied in a component is implemented by default. A guideline that survives only in a document will be followed by the teams that read the document.
Cumulative Layout Shift, as specified in Google's Web Vitals. A defined metric for unexpected layout movement during a page's lifetime, with a published good threshold at 0.1. This is the hardest available constraint on streamed content, because it is measurable, externally defined and already tracked by teams for search reasons.
Streaming output into a region that grows and displaces content below it is a layout shift generator, and the metric makes it a budgeted problem rather than an aesthetic one.
WCAG 2.1, success criterion 4.1.3, Status Messages. Requires that status messages be programmatically determinable through role or properties, so that assistive technology can announce them without moving focus. Streamed model output is a status message stream, and the politeness level and update granularity are design decisions with a defined requirement behind them.
Related criteria that bear on the same problem: 1.4.10 on reflow, and 2.2.1 on timing, where content that updates or auto-scrolls without user control is a barrier.
This note reads the criteria and does not claim conformance for any implementation. No audit was performed.
Shneiderman, 2020, Human-Centered AI. Argues for designs that keep human control and system reliability as first-order properties rather than as constraints on capability. Cited for the framing that control affordances belong in the system layer.
Analysis
The eight primitives
Each answers one or more of the broken assumptions, and each is proposed at the system level, meaning defined once with a name, a token set and a documented behaviour.
1. Generated container. A wrapper with a declared overflow policy, a reserved minimum height and a maximum extent before collapse. The policy is a token value with a small number of options, such as truncate with expansion, scroll within a bounded region, or collapse to a summary. This makes unbounded length a system decision with three legitimate answers rather than a per-feature improvisation.
2. Provenance token set. A systematic marker for authorship with three values: authored, generated, and generated-then-edited. Visual treatment and machine-readable attribute, defined once.
The third value is the one products consistently omit and the one users need most, since content a person reviewed and modified has a different standing from either pure state. Without a system-level treatment, provenance becomes a badge that one team invents and four teams style differently.
3. Uncertainty vocabulary. A three-state model for any inferred value: known, unknown, conflicting. Rendered distinctly, not as a faded version of known.
This primitive carries a prohibition as well as a pattern. Numeric confidence should not appear in the user-facing layer, because the reviewed evidence on trust calibration does not support it as a calibration mechanism and users have no basis for converting a percentage into a decision. The system exposes three states and no number.
4. Streaming layout contract. Reserved space sized before the first token arrives, append-only insertion regions, a prohibition on reflow above the insertion point, a declared layout shift budget, and a correctly configured live region with a chosen politeness level and update granularity.
This is the primitive with the strongest external constraints, since both the layout metric and the accessibility criterion are externally specified. It is also the one most often reinvented, because streaming feels like a feature-level concern and is in fact a layout contract.
5. Citation primitive. A component that binds a claim to a resolvable source, resolves it, and renders differently when resolution fails.
The requirement is stronger than a link. A citation that cannot be resolved must be visibly distinct from one that can, because the failure mode of generated references is a plausible reference to something that does not exist, and a component that renders both identically is participating in the error.
6. Editable suggestion. The propose-then-apply pattern as one component with three states, proposed, accepted and dismissed, plus a diff view where the target has prior content.
Every product that lets a model act on a user's work needs this, and every product currently builds it separately. Defining it once is also the cheapest way to make the propose-rather-than-apply default actually hold across a product, since a team that has to build the pattern from scratch will sometimes skip it.
7. Reversal affordance. Undo as a system primitive with declared scope and duration rather than a per-feature capability.
The declaration matters as much as the mechanism. A system-level undo whose scope is undocumented produces a user model that is wrong in the cases that matter, and the cases that matter are the ones where reversal is unavailable.
8. Refusal presentation. A defined treatment for the case where the system declines or cannot produce output, distinct from an error and distinct from an empty state.
Conflating refusal with error is the current norm and it misinforms the user about what to do next. An error invites a retry. A refusal does not.
The extended state enumeration
The conventional set does not cover the conditions generated content produces. The proposal is eleven states, with every component that can hold generated content required either to define each or to explicitly inherit a system default.
Default, empty, loading, streaming, partial, stale, superseded, unknown, refused, error, disabled.
The five that are genuinely new are worth stating.
Streaming is arriving, which differs from loading in that content is present and incomplete. Partial is complete-as-delivered but known to be missing fields, which is the normal outcome of a schema mismatch that was repaired rather than rejected. Stale is content generated against inputs that have since changed. This is the state most products lack and most need, because generated content silently decouples from its source. Superseded is content replaced by a newer generation, where the older version still exists and may be what the user is looking at. Unknown is the third value from primitive three, present at component level.
A system that adds five states adds cost, and the cost is real. The argument for paying it is that these conditions occur whether or not the system names them, and unnamed conditions are rendered as whichever adjacent state the implementing developer picked.
Governance changes, and this is the uncomfortable part
A design system that ships a component containing model behaviour, meaning an instruction set, a schema or a retrieval configuration, has stopped being a presentation layer. It now owns behaviour.
That has three consequences. The system inherits the version axes that any AI-native deployable has, so a component release can change product behaviour without any consuming team changing code. Review requires someone who can evaluate output quality, which is not the skill set of a design system team. And a regression in a component's instruction set is a regression in every product that consumes it, discovered at consumer sites rather than at the source.
The defensible position is a boundary: the system owns presentation, state, layout, provenance and control affordances, and it does not own instructions or model selection. Products own behaviour. This is less convenient than a component that does everything, and it keeps the accountability where the domain knowledge is.
What a design system cannot do
A primitive set does not fix an information architecture that is wrong about what the product is for. Cognitive load reduction comes mostly from deleting concepts rather than from styling controls, and no token layer deletes a concept.
There is also a specific misuse worth naming. A rich vocabulary for expressing uncertainty makes it easy to ship uncertainty attractively. A provenance badge and an unknown state can become a way to pass unresolved ambiguity to the user in a well-designed container, and the design system will make that look deliberate. The primitives are worth building and they are not evidence that the underlying problem was addressed.
Findings
-
Design systems encode six assumptions about content, authorship, bounded length, fixed structure, a small state set, presence and truth, and generated content violates all six.
-
Because the compositional model propagates decisions upward and not downward, handling these violations at feature level guarantees divergence across a product.
-
Eight primitives would absorb the violations at system level: generated container, provenance token set, uncertainty vocabulary, streaming layout contract, citation primitive, editable suggestion, reversal affordance and refusal presentation.
-
The state enumeration needs five additions: streaming, partial, stale, superseded and unknown. Stale is the most commonly missing and the most consequential, because generated content silently decouples from the inputs it was derived from.
-
Two of the constraints on streamed content are externally specified rather than matters of preference: layout stability has a published metric and threshold, and status message announcement has a defined accessibility criterion.
-
Numeric confidence should be excluded from the user-facing layer. The reviewed trust literature does not support it as a calibration mechanism.
-
Refusal is a distinct state from error, and conflating them gives the user the wrong next action.
-
A design system that ships instruction sets or model configuration acquires behavioural ownership it is not equipped to govern. The defensible boundary is presentation, state and control in the system, behaviour in the product.
Limitations
Nothing here has been built. The eight primitives are a proposal derived by reasoning. No component library implements them, no product has adopted them, and no user has encountered them. Their status is an argued design position, and the most likely failure of a proposal like this is that it is coherent on paper and unusable in a real system with real teams and real deadlines.
The state enumeration may be wrong in both directions. Eleven states is a substantial increase in surface area for every component, and the cost falls on implementers. It is possible that three of the five additions collapse into one another in practice, or that a twelfth is needed. There is no evidence here either way, because no one has tried it.
The accessibility discussion is a reading, not an audit. Success criteria are cited and interpreted. No conformance testing was performed, no assistive technology was used, and no claim of conformance is made for any implementation, including the archive this note sits in.
No layout measurement was taken. The layout stability argument cites a specified metric and threshold and does not report a measurement of any streaming interface, so the claim that streaming implementations commonly breach the threshold is an expectation rather than a finding.
The governance argument is speculative about organisations. The claim that design system teams cannot evaluate model output quality is a generalisation from role definitions and not from any study of how such teams actually work.
The author's own record does not demonstrate any of this. Veena Studio's documented interface makes provenance and reversal claims, and the underlying work was a design exploration rather than a shipped system with a token layer. The site this archive is published on has a token layer and holds no generated content, so it demonstrates nothing about the problem. The practitioner position available is that of someone who has designed around these conditions in individual features and has never built the system layer being proposed.
The misuse risk is unquantified. The concern that an uncertainty vocabulary enables the attractive presentation of unresolved ambiguity is stated as a design judgement. It could be tested by comparing products with and without such vocabularies on whether their underlying ambiguity was reduced, and it has not been.
Implications
For design system teams. Add the five states before adding the components. A state enumeration is cheap to publish and it changes what implementers notice. Define the provenance token set with three values, and define the streaming layout contract against the published layout metric and the status message criterion rather than against taste.
For product teams. Ask which of the eleven states each generated surface can enter and what it renders in each. The state most often missing is stale, and its absence is invisible until a user acts on output derived from inputs that changed.
For governance. Draw the boundary explicitly. Presentation, state, layout, provenance and control in the system. Instructions, model selection and retrieval in the product. Write it down, because a component that quietly acquires an instruction set will not announce it.
For accessibility. Streamed output needs a live region decision made once, at system level, with a politeness level and an update granularity. Left to features, it will be made differently each time and mostly wrong.
For further work. The missing evidence is straightforward to obtain and nobody has published it: an audit of streaming AI interfaces against the layout stability threshold and the status message criterion, across a sample of shipping products. That would convert the two externally-specified constraints in this note from expectations into measurements.
Conclusion
Generated content breaks the assumptions a design system is built on, and the breakage is currently absorbed at the feature level, which is the one level in the compositional model where a decision does not propagate.
The response is not new components for AI features. It is a small number of additions to the system's foundations: a state enumeration that can express arriving, incomplete, stale, superseded and unknown; a provenance vocabulary with a value for human-edited machine output; a layout contract for streaming that respects two externally specified constraints; and system-level treatments for proposal, reversal, citation and refusal.
Two cautions belong in the conclusion rather than the appendix. A system that ships model behaviour has acquired ownership it cannot govern, and the boundary should be drawn before that happens rather than after. And a good vocabulary for uncertainty makes uncertainty easy to ship attractively, which is not the same as resolving it.
References
- B. Frost, Atomic Design, 2016.
- Salesforce, Lightning Design System, design token specification and practice.
- J. Nielsen, "Enhancing the Explanatory Power of Usability Heuristics", CHI 1994, and the associated ten heuristics.
- D. A. Norman, The Design of Everyday Things, revised edition, Basic Books, 2013. Gulfs of execution and evaluation.
- S. Amershi, D. Weld, M. Vorvoreanu, A. Fourney, B. Nushi, P. Collisson, J. Suh, S. Iqbal, P. N. Bennett, K. Inkpen, J. Teevan, R. Kikin-Gil and E. Horvitz, "Guidelines for Human-AI Interaction", CHI 2019.
- Google, Web Vitals, Cumulative Layout Shift definition and threshold. https://web.dev/articles/cls
- W3C, Web Content Accessibility Guidelines 2.1, success criteria 4.1.3 Status Messages, 1.4.10 Reflow and 2.2.1 Timing Adjustable. Read and interpreted here; no conformance claim is made and no audit was performed. https://www.w3.org/TR/WCAG21/
- B. Shneiderman, Human-Centered AI, Oxford University Press, 2022.
- Veena Studio interface documentation describing an agentic digital audio workstation with an AI co-producer. Recorded as A36 and A37 in
SOURCE_INVENTORY.md.
Related reading in this archive
- Designing with AI in the interface: the guarantees these primitives are trying to restore
- Designing trust in AI interfaces: the evidence behind the prohibition on numeric confidence
- Cognitive load is the real SaaS design problem: why deleting a concept beats styling a control
- Latency, trust and the two variables everyone conflates: the duration side of the streaming problem
- Veena Studio