Comprehensive research synthesis · Version 1.3 · OKF-aligned
Design interfaces that make meaning visible.
A mobile-first reference system for visual hierarchy, evidence, color, accessibility, forms, native HTML, interactive surfaces, ARIA semantics, accessibility trees, iconography, data visualization, settings, notifications, and ethical UX. The interface and embedded knowledge graph use the same research model.
Human-directed, AI-assisted research synthesisResearch owner and accountable editor: Jesse Graupmann · AI research and production contributor: OpenAI ChatGPT, GPT-5.6 Thinking · Underlying source creators remain independently attributed.
Governing doctrine
The integrated conclusion across visual evidence, perception, UX, color, and accessibility research.
A strong interface does not minimize information. It minimizes uncertainty about what matters, what belongs together, what can be acted upon, and how the conclusion was reached.
This system treats visual design as an evidence and interaction architecture. It separates durable empirical findings, formal frameworks, standards, and production precedents so future decisions can use the strongest accurate support.
Core principles
12 rules that govern hierarchy, evidence, interaction, semantics, and accessibility.
Numbers are presentation indexes for this catalog. Stable research IDs remain unchanged for links, citations, and machine-readable reuse.
01
Meaning before decoration
Every prominent visual treatment must communicate evidence, hierarchy, state, relationship, or action.
Strong color, filled containers, large typography, motion, borders, and icon backgrounds consume a limited salience budget. Remove them when they do not improve comprehension or operability.
Start with the user question, decision, data type, and required comparison—not with cards, charts, or modals.
A technically polished interface can still solve the wrong problem or represent the wrong abstraction. Component choice occurs after task and evidence modeling.
Keep important options, labels, scope, state, and recovery paths visible or immediately retrievable.
Hidden interactions and unlabeled icons transfer the interface model into the user’s memory. Visible signifiers and persistent state reduce that burden.
Contrast, semantics, focus, reflow, input targets, redundant encoding, and user preferences belong in the design system.
Accessibility is not a final palette audit. It determines token contracts, component states, content structure, interaction recovery, and responsive behavior.
ARIA is a semantic contract, not an interaction implementation.
A role communicates expected meaning and state to accessibility APIs. Authors still own keyboard behavior, focus, pointer interaction, visual feedback, and state synchronization.
Prefer native semantics when available
Implement the complete keyboard model for custom composites
Keep DOM, visual state, and ARIA state synchronized
Names distinguish controls and enable screen-reader navigation, speech activation, automation, and reliable comprehension. They must be concise, stable, and aligned with visible wording.
Use native visible labels first
Include visible label text in the accessible name
Inspect computed names rather than assuming markup intent
Autonomy is a product constraint, not a conversion trade-off.
Optimization is unacceptable when it improves a business metric by making it materially harder for people to understand, express, or reverse their actual preferences.
Measure task success and preference fidelity alongside conversion
Escalate asymmetric choice architecture to ethical review
Treat vulnerable-user impact as a release criterion
Equivalent choices deserve equivalent clarity and effort.
Accepting, declining, subscribing, cancelling, consenting, and withdrawing should not be separated by deceptive prominence, hidden paths, or disproportionate friction.
Use comparable wording and visual weight
Keep material options on the same decision layer
Budget friction symmetrically across opposite choices
The major concept areas and how they inform design decisions.
Open a domain to inspect its core concepts, governing takeaway, and supporting reference keys.
Visual hierarchy & information densityHierarchy is an attention-routing system built from position, size, weight, contrast, spacing, grouping, and sequence.⌄
Core concepts
salience budget
macro/micro reading
proximity as semantics
content dispersion
finding-oriented headings
Governing takeaway
One dominant focal point, a small set of secondary anchors, and quiet supporting metadata.
Visual evidence & TufteVisual storytelling should construct a truthful, inspectable argument from integrated evidence rather than decorative narrative.⌄
Core concepts
graphical integrity
data-ink
small multiples
layering and separation
direct annotation
provenance
Governing takeaway
Show enough evidence for the reader to reconstruct the conclusion while making the principal finding immediately visible.
Graphical perception & visual grammarVisual channels have different strengths. Position and length usually support more accurate quantitative comparison than area, angle, volume, or color.⌄
Core concepts
visual variables
expressiveness
effectiveness
aligned comparison
task-specific encoding
Governing takeaway
Use the strongest perceptual channel appropriate to the data relationship and required precision.
Attention, scanning & cognitionUsers scan before reading. Unique features can guide attention quickly, while combinations of subtle differences create slower visual search.⌄
Core concepts
preattentive features
front-loaded wording
first impressions
recognizable patterns
aging and peripheral attention
Governing takeaway
Use one dominant visual distinction for important exceptions and keep critical information inside the primary scan path.
Narrative, annotation & memoryEffective digital stories balance author guidance with reader agency and place explanatory annotations adjacent to supporting evidence.⌄
Core concepts
guided exploration
annotation
object constancy
memorability
meaningful embellishment
Governing takeaway
State the finding, guide attention to the evidence, then permit verification and exploration.
Color systems & palettesColor is an information-encoding system. Hue, lightness, and chroma perform different jobs and should map to explicit semantic roles.⌄
Core concepts
neutral-first structure
semantic tokens
sequential palettes
diverging palettes
qualitative palettes
contextual color meaning
Governing takeaway
Reserve saturated color for actions, exceptions, selection, and analytical focus—not general decoration.
Responsive & preference-aware deliveryResponsive design must preserve information and task capability while adapting representation, density, and navigation.⌄
Core concepts
semantic zoom
320 CSS-pixel reflow
text spacing
light/dark modes
increased contrast
reduced transparency
Governing takeaway
Change layout and representation—not the meaning or evidence available to the user.
Ethical interaction designEquivalent choices require equivalent clarity and effort. Interfaces should not manufacture urgency, hide consequences, or obstruct recovery.⌄
Core concepts
dark patterns
consent parity
sponsorship disclosure
reversibility
transparent defaults
Governing takeaway
Optimize task success and informed decisions rather than clicks, lock-in, or accidental consent.
Forms are structured conversations that combine persistent labels, semantic grouping, constraints, validation, recovery, and confirmation.
native form lifecycle
persistent labels
fieldset and legend
error summaries
input preservation
explicit save semantics
A form is successful when users can understand, complete, correct, and confirm it without losing their work.
Interactive surfaces & interruption
Menus, popovers, dialogs, sheets, toasts, and settings are selected through a common model of intent, focus, persistence, dismissal, and consequence.
surface selection matrix
notification escalation ladder
focus restoration
light dismiss
responsive transformation
settings reachability
Use the least interruptive surface that preserves discoverability, context, state, and recovery.
ARIA, accessibility trees & semantic contracts
ARIA supplements native HTML by exposing roles, names, states, properties, and relationships through browser accessibility trees to platform APIs and assistive technologies.
Patterns that deceive, coerce, obstruct, pressure, or materially impair informed choice across acquisition, consent, pricing, subscriptions, privacy, and agent-mediated interactions.
Runnable fixtures connect research claims to semantic markup, keyboard behavior, focus and dismissal traces, responsive transformations, and recorded evidence.
fixture registry
feature detection
keyboard trace
focus restoration
support matrix
automated checks
manual evidence
report export
A design rule becomes operational when teams can run it, inspect the result, record the environment, and protect it from regression.
97 synthesized conclusions translated into design-system implications.
Each finding distinguishes the observed or documented insight from its practical design implication. Reference keys link directly to the detailed source register.
Visual hierarchy & information density5 findings
Information density and visual density are different variables.
High information density can remain understandable when related values are aligned, grouped, consistently labeled, and visually quiet. Sparse layouts can still be confusing when every element competes equally.
Design implication: Prefer structural clarity over indiscriminate removal of information.
A single distinctive visual feature can guide search faster than a conjunction of subtle features.
Finding a unique color or orientation is easier than finding an item defined by a combination such as medium-blue, thin-border, slightly different icon.
Design implication: Use one strong distinguishing property for important exceptions.
UI palettes and data palettes require separate contracts.
A button color communicates interaction priority; a chart color must support discrimination, ordering, and comparison. Reusing them creates semantic collisions.
Design implication: Create dedicated token namespaces for action, state, accent, and data visualization.
A color does not pass by itself. Foreground, background, font characteristics, state, and compositing determine the result.
Design implication: Test every permitted token pairing across default, hover, pressed, selected, focused, disabled, light, dark, and forced-color modes.
Native form controls, dialog, details, and popover behavior inherit browser participation, keyboard behavior, state, validation, and platform integration that custom widgets must otherwise reproduce.
Design implication: Require a native-element assessment before approving a custom interaction component.
A visible label remains available after entry and creates a larger activation target while placeholder-only identification disappears and can be confused with example data.
Design implication: Use explicit labels for every field and reserve placeholders for optional examples.
Custom controls inherit the complete form contract.
A custom control must address naming, value, validation, form association, disabled state, reset, autofill, keyboard, touch, and assistive-technology behavior.
Design implication: Gate custom controls with a lifecycle checklist and require form-associated custom elements only where they materially help.
Interactive surfaces differ primarily by interruption and persistence.
Inline content, disclosures, popovers, drawers, dialogs, alerts, and toasts can contain similar content but impose different focus, dismissal, and context costs.
Design implication: Choose the lowest-interruption surface that still meets the user’s task and consequence requirements.
ARIA menus use specialized arrow-key and roving-focus behavior that is unnecessary for most site navigation and can conflict with ordinary link expectations.
Design implication: Use nav, links, and disclosure buttons for typical navigation; reserve menu roles for application-style commands.
Toasts are unsuitable for critical or durable information.
Transient notifications can be missed, vanish before comprehension, and provide no durable recovery record.
Design implication: Use toasts for noncritical confirmation; use inline, banner, history, or dialog surfaces when information persists or requires action.
Notification persistence should match consequence duration.
A condition that remains true after a message disappears should have a persistent representation, while routine confirmations should not dominate attention.
Design implication: Define a notification escalation ladder from inline guidance through alert dialog based on urgency and durability.
Drawers and sheets are presentation modes, not semantics.
A side or bottom panel may represent navigation, complementary information, nonmodal editing, or a blocking dialog, each with different semantic and focus requirements.
Design implication: Choose nav, aside, section, or dialog semantics based on behavior rather than slide-in animation.
Settings are navigable state models, not modal forms.
Settings contain persistent system state, dependencies, defaults, consequences, and repeated retrieval tasks that require stable navigation and search.
Design implication: Provide categories, deep links, current-state summaries, search, reset, dependencies, and clear save semantics.
Advanced HTML interaction primitives require progressive enhancement.
Popover is broadly available, while newer declarative command and dismissal features may have uneven deployment and behavior across product support matrices.
Design implication: Define baseline, enhanced, and experimental tiers with feature detection and tested fallbacks.
Accessible names are computed, not copied from one attribute.
Browsers follow an ordered algorithm across aria-labelledby, aria-label, native labeling, contents, and fallback sources to produce one flat name string.
Design implication: Inspect the computed accessible name and avoid conflicting or empty high-precedence naming attributes.
The accessible name identifies the object; the description supplies optional supporting context. Long instructions inside a name create repetitive, hard-to-scan announcements.
Design implication: Keep names concise and place constraints, help, and errors in descriptions or nearby structured content.
aria-current, aria-selected, aria-checked, aria-pressed, aria-expanded, aria-invalid, aria-busy, and aria-disabled represent different concepts and apply to different roles.
Design implication: Create a semantic state taxonomy and prohibit generic selected or active styling from driving arbitrary ARIA attributes.
aria-hidden and presentation solve different problems.
aria-hidden removes a subtree from the accessibility tree, while role none/presentation suppresses an element’s semantics but ordinarily retains descendant content.
Design implication: Never place aria-hidden on a focusable element or an ancestor of focusable content; use none/presentation only to remove misleading wrapper semantics.
Landmarks translate visual layout into navigable structure.
Meaningful banner, navigation, search, main, complementary, form, and contentinfo regions help screen-reader users understand and jump through page structure.
Design implication: Use native sectioning elements, label repeated landmarks, and avoid turning every card into a region.
aria-disabled communicates state but does not disable behavior.
Unlike the HTML disabled attribute, aria-disabled does not remove focusability, suppress events, or block form submission.
Design implication: Use native disabled by default; use aria-disabled only when discoverability requires focus and implement all blocked behavior explicitly.
Automated checks are necessary but cannot certify usability or interoperability.
Machines can detect many structural failures, but they cannot fully determine announcement quality, comprehension, task success, or assistive-technology behavior.
Design implication: Separate automated, manual, assistive-technology, and disabled-user evidence in every report.
Focus and dismissal traces reveal hidden application state.
Many severe interaction failures occur during entry, replacement, Escape, outside click, submission, and restoration rather than in the resting visual state.
Design implication: Record focus transitions and close reasons as first-class fixture output.
Responsive transformations are separate behavioral variants.
A desktop popover becoming a mobile sheet can change focus containment, dismissal, context visibility, and save behavior even when the task name stays the same.
Design implication: Test each supported transformation as a named fixture variant.
60 prioritized actions for building and governing the system.
P0 establishes the information and accessibility foundation. P1 defines the core experience. P2 adds advanced analytical and machine-readable capability.
P0 · Foundation6 recommendations
P0System foundation
Adopt a task-to-visual contract before rendering.
Prevents card-first and chart-first generation.
Implementation guidance
Identify audience and decision
Define primary questions and comparisons
Classify data types and uncertainty
Select interaction and density requirements
Choose the representation only after the contract is complete
Stable fixture records link component contracts, semantic baselines, expected keyboard behavior, automated rules, manual tests, references, and known limitations.
RoleNative form semantics; toolbar only for a coherent command group; listbox/combobox only when their full interaction model is implemented
NameVisible filter labels and a named filter region when useful
Statesaria-pressed for independent toggle filters · aria-checked for checkable options · aria-expanded for filter disclosures · aria-busy on the coherent results region during update
RelationshipsResult count/status associated through visible text and live status where needed
KeyboardNative controls; composite arrow navigation only when a documented composite pattern is chosen
FocusPreserve focus on the changed filter; do not reset to page start after results update
ProhibitedPills that look interactive but are passive · aria-selected on unsupported generic buttons · Silent scope changes
Sponsored content blockDisclose commercial content while providing enough information for an informed evaluation.⌄
Anatomy
Clear sponsorship label
Product or service name
Problem addressed
Material differentiation
Verification caveat
Destination link
Use
Keep disclosure visible
Use equivalent readability
Separate claims from editorial assessment
State what should be independently verified
Avoid
Native-looking undisclosed promotion
Urgency theater
Oversized visual prominence
Editorial endorsement implied by styling
ARIA semantic contract
Native preferencearticle, section, or aside with explicit visible sponsorship disclosure
RoleNo special ARIA sponsor role; complementary only when the block is truly secondary to main content
NameVisible sponsor and offer heading; disclosure included in text, not only an accessible label
StatesNone
RelationshipsSource and sponsor links remain ordinary links
KeyboardNative links and controls
FocusDocument order
ProhibitedDisclosure hidden only from visual users or only from assistive technology · Banner or alert role used to force attention · Sponsored card indistinguishable from editorial content
Native preferencelabel plus native input/select/textarea
Roleimplicit native role
NameNative label preferred; visible label included in name
Statesaria-invalid after validation failure · aria-disabled only when native disabled is unsuitable · aria-required only when native required is unsuitable
Relationshipsaria-describedby for help and error text · aria-errormessage only with tested support and valid invalid state
KeyboardNative control behavior
Focusnative
Prohibitedaria-label overriding visible label · aria-hidden help referenced as description without testing
Typed knowledge objectGive each reusable research concept a stable human-readable and machine-readable identity.⌄
Anatomy
Stable ID and concept type
Title and concise description
Status, owner, and timestamp
Body structured for the task
Links to related concepts
Citations and provenance extensions
Use
Keep one bounded concept per file
Use descriptive self-explanatory types
Generate deep links and backlinks
Preserve unknown producer fields
Compile the same IDs into JSON and JSON-LD
Avoid
One monolithic Markdown file as the only source
Unstable generated IDs
Hidden relationships encoded only in prose
Rejecting unknown concept types
Treating the SPA DOM as the database
ARIA semantic contract
Native preferencearticle or section with heading, typed metadata, relationships, and stable anchor
RoleNo generic knowledge-object role; use native structure and links
NameVisible concept title; type remains supplementary metadata
Statesaria-current when the object is the current graph/navigation target
RelationshipsOutgoing links and backlinks are ordinary links; disclosure for optional machine metadata
KeyboardNative document and link navigation
FocusDeep link may focus the concept heading without adding it to normal tab order
ProhibitedCustom application role for a document explorer · ARIA relationships replacing visible navigable links · Region landmark for every atomic concept
ARIA semantic contractDocument the role, name, description, states, relationships, keyboard model, focus strategy, and prohibited combinations for a custom component.⌄
Native-first behavior, focus, interruption, dismissal, responsive transformation, and settings architecture.
Forms, menus, popovers, dialogs, drawers, toasts, and settings share one lifecycle. Select the surface by task and behavioral cost—not by whether the desired shape is a floating card or sliding panel.
Governing rule
Use the least interruptive native or semantically equivalent surface that preserves discoverability, context, focus, state, and recovery.
Shared interaction lifecycle
1
Trigger
2
Reveal
3
Orient
4
Move or retain focus
5
Collect input or action
6
Validate and communicate
7
Dismiss or persist
8
Restore context
Form blueprint
1
Purpose and scope
Explain the transaction, completion expectation, privacy implications, and only the data required.
2
Persistent identity
Give every field a visible label. Add examples, units, formats, and required state without replacing the label.
3
Semantic groups
Use fieldset/legend, headings, optgroup, and spacing so relationships exist both visually and programmatically.
4
Constraint and validation
State constraints before errors. Parse forgivingly, validate client and server, and distinguish advice from blocking failure.
5
Recovery
Preserve valid work, present an error summary, link to fields, use matching corrective language, and expose retry.
6
Commit and confirmation
Make save semantics explicit, prevent duplicate operations, confirm completion, and explain the next state.
Interaction-surface selection matrix
Surface
Primary intent
Focus
Dismissal
Persistence
Use when
Avoid when
Inline
Input or persistent information
Document flow
Not applicable
Persistent
Users need comparison or repeated access
The content is genuinely secondary
Disclosure
Optional related content
Stays on trigger
Explicit toggle
User-controlled
Summary remains useful when collapsed
Primary evidence or errors are hidden
Action menu
Commands
Moves into menu
Action, Escape, outside
Transient
Short command set affects current context
Ordinary navigation or value selection
Context menu
Expert accelerator
Moves into menu
Action, Escape, outside
Transient
Commands are relevant to selected object
It is the only path to capability
Popover
Contextual info or a few actions
Conditional
Mode-dependent light dismiss
Transient
Task is small and anchored
Warning, long form, or unsaved draft
Drawer / panel
Navigation or inspection
Depends on modality
Explicit, Escape, conditional outside
Transient or persistent
Parent context should remain visible
Semantics are chosen from animation alone
Dialog
Scoped blocking task
Contained
Explicit, Escape
Until dismissed
Background interaction must stop
Routine information or page-like content
Toast / status
Noncritical feedback
Does not move
Timeout or explicit
Transient
Confirmation can safely be missed later
Critical, durable, or response-required information
Banner
Persistent condition
Does not move
Until resolved or acknowledged
Persistent
State affects ongoing page or application work
One-time routine confirmation
Alert dialog
Critical response
Contained
Explicit response
Until answered
Consequence is high and action is required now
Common undoable actions
Notification escalation ladder
1
Inline hintTyping guidance and format expectations.
2
Inline validationLocal correction while the control remains in context.
3
Field errorBlocking correction associated with one control.
4
Section messageA condition affecting one grouped region.
5
Page messageResult or condition affecting the current page.
6
Toast / statusNoncritical transient confirmation with no focus movement.
7
Notification centerDurable history for background or consequential events.
Custom components remain legitimate when the domain task requires them, but they inherit the complete interaction lifecycle and validation burden.
APG can be copied too literally
APG examples demonstrate patterns, not universal production support. Mobile, touch, browser, and assistive-technology testing remain mandatory.
Modality is often implementation convenience
A dialog guarantees attention but disrupts focus, comparison, and mobile input. Use it only when background interaction must stop.
Transient visibility is not communication
A toast that appeared can still have failed. Critical and durable outcomes need persistent or recoverable representation.
Settings become internal flag dumps
Expose meaningful user choices, not every implementation switch. Good defaults and primary workflows should work without settings repair.
LLM schemas can optimize locally
Require user goal, page context, alternatives considered, and interruption justification so a model cannot choose a technically valid but task-inappropriate widget.
Fold-in roadmap
v1.2
Documentation foundation
Research domains, decision matrix, findings, behavioral component contracts, recommendations, validation methods, references, JSON-LD, and OKF concepts.
v1.6.2
Implementation patterns
Native HTML examples, focus state diagrams, form error patterns, browser-support badges, and responsive surface examples.
v1.4
Interactive validation lab
Live components, keyboard traces, forced-color previews, mobile simulation, automated audits, and exportable implementation contracts.
ARIA is an interface contract between authored DOM, browser accessibility trees, platform accessibility APIs, and assistive technologies. It supplements semantics; it does not create behavior.
The semantic pipeline
1
User task
What is the person reading, choosing, editing, navigating, or operating?
2
Native HTML
Use the element that already carries correct semantics and behavior.
3
ARIA delta
Add only missing role, name, state, property, or relationship information.
4
Accessibility tree
Inspect the browser-computed role, name, description, state, and hierarchy.
5
Platform API
Browsers map the tree into operating-system accessibility APIs.
6
Assistive technology
Screen readers, speech input, switches, and other tools interpret the API.
7
Interaction
Authored keyboard, focus, pointer, touch, and state logic complete the component.
8
Verification
Test real combinations and preserve evidence of support and known gaps.
Five governing rules
Native first
Use HTML semantics and behavior before introducing custom roles.
No role without behavior
A role commits the component to the associated keyboard and state model.
Names are API
Visible and computed labels must be concise, aligned, and testable.
State is synchronized data
Visual, DOM, and ARIA state change together or the interface forks.
Inspect output, not intent
The accessibility tree—not source markup alone—is what assistive technology receives.
Semantic state taxonomy
State
Meaning
Typical use
Do not substitute
aria-current
The current item within a related set
Current page, step, date, location
Selection inside a tab, option, or grid
aria-selected
Selection in roles that support selection
Tab, option, row, gridcell, treeitem
Generic active styling or current route
aria-checked
Checked choice or binary value
Checkbox, radio, switch, menuitemcheckbox
Toggle command state on a button
aria-pressed
Toggle-button pressed state
Mute, pin, bold, favorite toggle button
Checkbox or selection state
aria-expanded
Whether a controlled/owned region is expanded
Disclosure, menu button, combobox, treeitem
Visibility unrelated to the control
aria-disabled
Perceivable but unavailable operation
Discoverable disabled composite item
Native disabled when native behavior is desired
aria-invalid
Value has failed validation
Form field or group after validation
Required-but-empty before validation policy says invalid
aria-busy
Region is undergoing a coherent update
Results, feed, form, or live region update
Generic visual spinner without update semantics
Role decision boundaries
Need
Preferred baseline
ARIA pattern only when
Common failure
Site navigation
nav, links, disclosure buttons
A true desktop-style application command menu is required
Using menubar for ordinary navigation
Choose one value
select, radio group
Autocomplete, virtualized choices, or complex option content are essential
Using menu for value selection
Layer peer content
Links or disclosure when possible
One panel at a time with tab-style arrow navigation is the task
Tabs for sequential workflow or navigation
Static tabular information
table
Cells need composite navigation, editing, or dense interaction
Grid role only to shorten tab order
Hierarchy
Nested headings, lists, and disclosures
Desktop-style hierarchy navigation materially improves the task
Tree role for nested site links
Supplemental text
Persistent visible helper text
A short noninteractive description is genuinely secondary
Interactive tooltip or tooltip-only label
ARIA red-team questions
Could native HTML do this?
Document the rejected native element and the unmet task requirement.
What behavior does this role promise?
List keyboard, focus, selection, and update obligations.
What does the browser compute?
Inspect role, name, description, hierarchy, and state in the accessibility tree.
Can visible and programmatic state diverge?
Exercise every open, close, select, check, disable, invalidate, and loading transition.
Does the pattern work across support targets?
Use ARIA-AT as evidence and test the actual product combinations.
Is the semantic complexity worth it?
Prefer simpler document interaction when a composite widget adds more failure modes than value.
Patterns to recognize, prohibit, measure, and replace with autonomy-preserving alternatives.
Dark or deceptive patterns are not merely annoying interfaces. They are design mechanisms that materially interfere with informed preference through deception, asymmetric friction, hidden consequences, repeated pressure, or exploitation of vulnerability.
Boundary: persuasion versus impairment
Not every recommendation, default, or simplified flow is deceptive.A technique is safer when information is truthful, alternatives remain meaningful, the recommendation aligns with a documented user benefit, material consequences are visible, and the choice can be inspected and reversed.Escalate when the design works by reducing comprehension, hiding a meaningful alternative, exploiting inertia or vulnerability, or increasing the cost of expressing an existing preference.
Mechanism taxonomy
Obstruction
Adds unnecessary friction to an action the user already intends to take.
Preferred alternative: Show future effects and durable reversal controls.
Choice and lifecycle parity
Dimension
Compare
Failure signal
Salience
Size, contrast, placement, iconography
The provider-preferred option dominates without user benefit
Language
Grammar, specificity, tone, consequences
Decline is vague, shaming, or double-negative
Layer
Same screen versus deeper settings
Accept is immediate; reject requires exploration
Effort
Steps, time, channel, authentication
Exit is materially harder than entry
Information
Price, recurrence, data, limitations
Material terms appear after commitment or sunk effort
Reversal
Inspect, modify, withdraw, cancel
The original preference cannot be changed proportionately
Research findings
Dark patterns are autonomy failures, not a synonym for bad usability.
The central concern is not visual ugliness or accidental friction alone, but interface choices that steer, deceive, coerce, obstruct, or materially impair informed preference expression.
Design implication: Classify deceptive design by impact on understanding, choice, effort, and reversibility—not by aesthetics.
Intent is ethically relevant, but effect is often the operational review threshold.
Manipulative intent can be difficult to observe. Regulatory and policy frameworks increasingly evaluate whether the design materially distorts or impairs free and informed decisions.
Design implication: Red-team effects and incentive structures even when no team explicitly intended harm.
Persuasion, defaults, and reduced friction are not inherently deceptive.
Choice architecture can help users understand complexity or complete intended tasks. Harm depends on truthfulness, user alignment, proportionality, alternatives, and context.
Design implication: Do not ban all nudges; require a documented user-benefit hypothesis and autonomy safeguards.
Easy enrollment paired with cancellation mazes, repeated retention prompts, or channel switching can block users from executing an already-formed preference.
Design implication: Compare steps, time, cognitive load, channel, and error rates for opposite lifecycle actions.
False urgency and scarcity manufacture a decision deadline.
Countdown timers, stock claims, activity messages, and limited-time language become deceptive when the underlying condition is false, unverifiable, or repeatedly resets.
Design implication: Require a verifiable source, expiry, scope, and fallback for every urgency or scarcity claim.
Requiring registration, contact access, marketing consent, or broad data sharing to complete an unrelated task converts access into coerced disclosure.
Design implication: Separate purposes and ask at the moment a capability is genuinely needed.
A deceptive pattern can emerge across several individually plausible screens.
A journey may hide consequences through progressive fragmentation, repeated deflection, or cumulative friction even when no single screen appears egregious.
Design implication: Review end-to-end paths and temporal state, not only isolated screenshots.
Children, older adults, and cognitively burdened users can face disproportionate harm.
Limited literacy, digital skill, attention, financial resilience, or developmental capacity can make biased framing and obstructive journeys more consequential.
Design implication: Include vulnerability-centered personas and stricter defaults in ethical review.
Conversion experiments can industrialize harmful design.
Rapid A/B testing can discover which wording, color, timing, or friction most effectively overcomes user resistance—even without an explicit deceptive-design requirement.
Design implication: Place ethical guardrails before experimentation and reject variants that improve metrics through reduced comprehension or autonomy.
Agent-mediated interaction creates a second autonomy boundary.
GUI agents can miss deceptive patterns or prioritize task completion over the user’s broader interests; human oversight can also create attention and workload costs.
Design implication: Expose total cost, recurring terms, permissions, and irreversible consequences in machine-readable confirmation boundaries.
Reversal is part of the original decision contract.
Consent, subscription, privacy, and notification choices remain valid only when users can later inspect and change them without disproportionate effort.
Taxonomies and automated tools are useful, but identical visual techniques can be benign or harmful depending on truthfulness, task, timing, alternatives, and consequences.
Design implication: Combine pattern detection with a structured autonomy and evidence review.
Many harms emerge from timing, defaults, prior decisions, cumulative screens, or what happens after commitment.
Do not substitute bright manipulation
A privacy-friendly or socially desirable outcome does not justify deception, guilt, obstruction, or hiding alternatives.
Do not treat legal minimums as the ethical ceiling
Jurisdictional rules vary. The system standard remains truthful information, meaningful alternatives, proportional effort, and reversal.
Do not assume agents are resistant
Automation can follow the most procedurally obvious path and miss optional costs, recurrence, or manipulative wording.
LAB
Interactive validation lab · v1.4 foundation
Scenario-based red-team checks for autonomy, choice symmetry, lifecycle friction, price integrity, and pressure.
This lab is a review aid, not a legal classifier. Check the conditions present in a candidate flow. The weighted score highlights where a deeper human review is required.
0risk points
No conditions selected.
Ethical alternative
Present equivalent choices with parallel wording, comparable salience, and explicit consequences.
One visually dominant action and a vague, de-emphasized alternative.
Accept allContinue without extras
Prefer · explicit alternatives
Parallel labels and consequences on the same layer.
Use necessary onlyAllow optional analytics
Avoid · late total
Headline price: $80
Mandatory service and processing fees appear after checkout details.
Final: $112
Prefer · attainable total
Base $80 · mandatory fees $32
Optional add-ons remain unselected.
Total: $112
Roadmap status
v1.3ARIA semantics, accessible-name contracts, landmarks, live regions, composite focus, and accessibility-tree validation completed.
v1.4Deceptive-design domain, autonomy contracts, implementation examples, and scenario-based validation-lab foundation completed.
NextExecutable native component fixtures, browser and assistive-technology result capture, journey recording, and automated parity analysis.
RUN
Executable component laboratory · v1.6.2
Runnable semantic fixtures, runtime capabilities, interaction traces, support evidence, and exportable validation reports.
Use the lab to reproduce component behavior and record evidence. Automated results identify structural defects; they do not replace real assistive-technology or disabled-user testing.
Certification boundary
Executable evidence available · production certification pending
The laboratory can generate reproducible structural evidence. Production certification still requires observed representative browser, assistive-technology, and disabled-user results.
Fixtures
10
Capabilities
7
Evidence records
0
Runtime capability detection
Native dialogbaseline
Not checked
Inline scoped region or explicitly implemented accessible dialog
Common visual, interaction, accessibility, and evidence failures.
Hierarchy
Equal visual weight for every card
Multiple saturated accent colors in one viewport
Pills for passive dates, sources, counts, and metadata
Large colored icon containers for minor attributes
Borders and shadows around every nested region
Oversized utility-page hero sections
Centered alignment for dense analytical content
Interaction
Important controls visible only on hover
Unfamiliar icon-only primary actions
Filters with no visible reset
State changes without feedback
Disabled controls without explanation
Irreversible deletion
Dragging as the only operation
Auto-advancing carousels
Accordions hiding primary evidence
Color
Rainbow scales for ordered data
Red and green as the sole distinction
Low-contrast metadata
Yellow text on white
One brand color used for links, focus, selection, information, and chart series
Mechanical light-to-dark inversion
Transparent essential foregrounds
Arbitrary emotional color claims
Visualization
Choosing a chart before defining the question
Pie charts for small precise differences
Bubble size for critical quantitative values
3D effects
Dual axes without compelling justification
Inconsistent scales across small multiples
Remote legends when direct labels are possible
Signal scores without methodology
Responsive
Fixed sticky offsets that assume one header height
Silent removal of comparison fields on mobile
Desktop card spacing stretched from mobile
Tiny icon targets
Focus clipped by overflow
Critical actions only at screen edges
Evidence & ethics
Mixing observed facts with inference
Hiding source or uncertainty
Sponsored material styled as editorial
Preselected consent
Artificial urgency or scarcity
Making enrollment easy and cancellation difficult
Optimizing clicks instead of task success
Provenance & knowledge governance
Generic AI-generated labels without accountable ownership
Replacing source creators with the synthesis author
Treating the SPA as the only canonical artifact
Silent agent rewriting of accepted conclusions
Unvalidated frontmatter, links, or citation keys
Publishing public structured data that overstates invisible content
Conflating publisher, hosting site, and creator
Losing rejected changes or superseded states
Forms
Placeholder-only field identification
Multiple unrelated questions in one row
Validation rules revealed only after submission
Clearing valid input after an error
Color-only required or invalid state
Custom controls without form reset, submission, and labeling behavior
Generic errors without correction guidance
Silent save or ambiguous commit semantics
Disabling submit without visible busy and retry state
Interactive surfaces
Choosing a component by visual shape rather than behavior
Using ARIA menu roles for ordinary site navigation
Context menus as the only access to important actions
Critical failures shown only in transient toasts
Light dismiss that silently discards work
Nested modal dialogs
Popover cascades
Nonmodal drawers that trap focus
Modal sheets that allow background interaction
Settings placed in a one-time modal mega-form
Unbounded notification stacks
No browser-support tier for emerging HTML primitives
ARIA semantics & accessibility trees
Adding ARIA when native semantics already express the correct contract
Using a role without implementing its keyboard and focus expectations
Redundant role attributes that can drift from the HTML element
aria-label that replaces or contradicts visible text
Empty aria-labelledby or aria-describedby references
Using aria-selected for generic active styling
Stale aria-expanded, aria-checked, aria-pressed, or aria-busy state
aria-disabled without blocking activation
aria-hidden on focusable elements or their ancestors
role none/presentation used to hide content
aria-owns used to repair avoidable DOM structure
Application, menu, grid, tree, or treegrid roles used for ordinary document content
Every section exposed as a region landmark
Assertive live regions for routine success and keystroke feedback
APG example code copied without browser and assistive-technology testing
Accessibility review based only on source markup rather than computed tree output
Deceptive design & autonomy
Unequal visual prominence for equivalent choices
Hidden or second-layer decline and reject controls
Confirmshaming, trick questions, and double negatives
Preselected optional charges, data sharing, or recurring commitments
Late mandatory fees and drip pricing
False or resetting urgency and scarcity claims
Disguised advertising or sponsored content
Repeated prompting after a clear decision
Enrollment–cancellation friction asymmetry
Retention mazes and channel switching
Bundling unrelated permissions with task completion
Default settings that are difficult to inspect or reverse
Personalizing pressure toward vulnerable users
Conversion-only A/B testing
Transient disclosure of durable consequences
Agent transactions without machine-readable consequences
Using bright patterns to manipulate toward a preferred social outcome
Treating legal compliance as the only ethical threshold
Validation and certification failures
Calling automated output production certification
Publishing support without a complete environment tuple
Testing only the resting visual state
Ignoring compact and transformed variants
Allowing handbook examples and shipped components to diverge
Using parity calculations as a substitute for contextual ethical review
Research reference library
176 sources with evidence class, creator/publisher attribution, citation wording, application, and boundaries.
Showing 176 of 176
Tufte & visual evidence9 sources
TUFTE-VDQIThe Visual Display of Quantitative InformationGraphical integrity, data-ink ratio, lie factor, small multiples, data density, and high-resolution displays.Framework
Use for
Graphical integrity, data-ink ratio, lie factor, small multiples, data density, and high-resolution displays.
Reference as
Tufte argues that visual displays should maximize meaningful data communication while reducing graphical elements that do not support interpretation.
Do not overstate
Do not claim controlled UX research proves that maximizing data-ink always produces the best interface.
TUFTE-EIEnvisioning InformationLayering and separation, micro/macro readings, visual complexity, color and information, escaping flatland, and multidimensional data.Framework
Use for
Layering and separation, micro/macro readings, visual complexity, color and information, escaping flatland, and multidimensional data.
Reference as
Tufte proposes layering and separation as mechanisms for presenting complex information without fragmenting it.
TUFTE-VEVisual Explanations: Images and Quantities, Evidence and NarrativeCause and effect, processes, motion, before-and-after evidence, decision-making, and Challenger analysis.Framework
Use for
Cause and effect, processes, motion, before-and-after evidence, decision-making, and Challenger analysis.
Reference as
Tufte emphasizes that explanations should show mechanisms, comparisons, sequence, and causes rather than presenting isolated outcomes.
Best future application
Incident timelines, deployment analysis, before-and-after views, causal hypotheses, and process visualization.
TUFTE-BEBeautiful EvidenceIntegrating prose, numbers, diagrams, images, annotations, and provenance into one evidential structure.Framework
Use for
Integrating prose, numbers, diagrams, images, annotations, and provenance into one evidential structure.
Reference as
Tufte treats words, numbers, images, diagrams, and motion as complementary forms of evidence that should be evaluated for quality, relevance, and integrity.
Best future application
Claim–evidence structures, source attribution, annotated charts, sparklines, and multimodal reports.
TUFTE-SFESeeing with Fresh Eyes: Meaning, Space, Data, TruthObservation, analytical seeing, typography, meaning, spatial reasoning, and truth in presentation.Framework
Use for
Observation, analytical seeing, typography, meaning, spatial reasoning, and truth in presentation.
Reference as
Tufte frames visual reasoning as a discipline of sustained observation rather than merely choosing an attractive representation.
Best future application
Reframing UI problems before choosing cards, charts, or interaction patterns.
TUFTE-VSTVisual and Statistical Thinking: Displays of Evidence for Making DecisionsDecision evidence, multivariate reasoning, causal analysis, comparison, and the Challenger case.Framework
Use for
Decision evidence, multivariate reasoning, causal analysis, comparison, and the Challenger case.
Reference as
Tufte argues that decision displays should arrange relevant variables together so the reader can test relationships and alternative explanations.
Best future application
Executive decision support, incident review, risk analysis, and evidence-based recommendations.
CM-1984Graphical Perception: Theory, Experimentation, and Application to the Development of Graphical MethodsRelative accuracy of position, length, angle, slope, area, volume, and color-based encodings.Primary
Use for
Relative accuracy of position, length, angle, slope, area, volume, and color-based encodings.
Reference as
Cleveland and McGill found that judgments based on aligned position and length were generally more accurate than judgments based on area or volume.
Best future application
Justifying bars, dots, aligned values, and tables over bubbles, radial gauges, or 3D forms.
Boundary
Treat the ordering as a population-level empirical pattern, not an immutable rule for every task or individual.
CM-1985Graphical Perception and Graphical Methods for Analyzing Scientific DataExtending graphical-perception findings to scientific data analysis.Primary
Use for
Extending graphical-perception findings to scientific data analysis.
Reference as
Cleveland and McGill used perceptual evidence to motivate graphical methods that support more accurate quantitative comparison.
Best future application
Technical dashboards, scientific reporting, and analytical interfaces.
GRAPHICAL-PERCEPTION-REVIEWA Review of Graphical Perception ResearchContemporary synthesis and qualification of classic encoding hierarchies.Review
Use for
Contemporary synthesis and qualification of classic encoding hierarchies.
Reference as
Later graphical-perception research broadly supports the importance of encoding choice while showing that outcomes vary by task, chart construction, and population.
Best future application
Avoiding overly rigid references to a single universal encoding hierarchy.
VIS-INDIVIDUAL-DIFFERENCESIndividual Differences in Visualization PerceptionVariability among users in chart decoding and visualization performance.Primary
Use for
Variability among users in chart decoding and visualization performance.
Reference as
Visualization performance can vary meaningfully across individuals, so population-level design rankings should not replace testing with the intended audience.
Best future application
Accessibility, expert-versus-novice interfaces, and configurable visualization modes.
MUNZNER-NESTEDA Nested Model for Visualization Design and ValidationSeparating domain problems, data/task abstraction, visual encoding and interaction, and implementation algorithms.Framework
Use for
Separating domain problems, data/task abstraction, visual encoding and interaction, and implementation algorithms.
Reference as
Munzner’s nested model identifies distinct failure modes at the domain, abstraction, encoding and interaction, and algorithmic layers.
Best future application
Task-first design reviews and diagnosing whether a UI failure is conceptual or merely presentational.
MUNZNER-BOOKVisualization Analysis and DesignVisualization task abstraction, idiom selection, data types, validation, interaction, and scalability.Framework
Use for
Visualization task abstraction, idiom selection, data types, validation, interaction, and scalability.
Reference as
Munzner provides a systematic methodology for moving from domain questions to data abstractions and appropriate visual idioms.
Best future application
Formal visualization design standards and generated chart-selection logic.
TREISMAN-1980A Feature-Integration Theory of AttentionFeature search, conjunction search, preattentive attributes, and selective attention.PrimaryFramework
Use for
Feature search, conjunction search, preattentive attributes, and selective attention.
Reference as
Treisman and Gelade distinguished rapid search for a unique visual feature from slower search requiring combinations of features.
Best future application
Exception highlighting, selected states, and limiting the number of visual properties required to find an item.
Boundary
Do not summarize this as “any brightly colored element is processed instantly.”
LINDGAARD-2006Attention Web Designers: You Have 50 Milliseconds to Make a Good First ImpressionRapid judgments of visual appeal.Primary
Use for
Rapid judgments of visual appeal.
Reference as
Lindgaard and colleagues found that visual-appeal judgments formed after very brief exposure could remain consistent with judgments formed after longer exposure.
Do not say
“Users understand the interface in 50 milliseconds” or “usability is determined in 50 milliseconds.”
Creator / author
Gitte Lindgaard, Gary Fernandes, Cathy Dudek, J. Brown
TUCH-2012The Role of Visual Complexity and Prototypicality Regarding First Impression of WebsitesVisual complexity, familiar structural patterns, and first impressions.Primary
Use for
Visual complexity, familiar structural patterns, and first impressions.
Reference as
Tuch and colleagues found that visual complexity and prototypicality influence immediate aesthetic evaluations of websites.
Best future application
Supporting recognizable information architecture and controlling first-viewport complexity.
OLDER-ADULT-EYETRACKING-REVIEWEye-Tracking Research on Older Adults: Systematic ReviewAge-related visual search, fixation, attention, and interface evaluation.Review
Use for
Age-related visual search, fixation, attention, and interface evaluation.
Reference as
Research on older adults indicates that clutter, peripheral placement, and complex visual search can create disproportionate difficulty for aging users.
Best future application
Designing for older adults, accessible travel tools, dense dashboards, and critical workflows.
OLDER-ADULT-PERIPHERYOlder Adults Fail to See Peripheral InformationPeripheral placement, attention distribution, and age-related discoverability.Primary
Use for
Peripheral placement, attention distribution, and age-related discoverability.
Reference as
Eye-tracking evidence suggests that older adults can be less likely to notice information placed outside their primary scan path.
Best future application
Avoiding critical actions or alerts only at viewport edges.
SHNEIDERMAN-EYESThe Eyes Have It: A Task by Data Type Taxonomy for Information Visualizations“Overview first, zoom and filter, then details on demand.”Framework
Use for
“Overview first, zoom and filter, then details on demand.”
Reference as
Shneiderman proposes an information-seeking sequence that begins with orientation, supports narrowing, and then exposes detail.
Boundary
Treat it as a design mantra, not a universal experimental law.
NNG-CONTENT-DISPERSIONContent DispersionExcessive whitespace, mobile layouts stretched onto desktop, and information fragmentation.Practice
Use for
Excessive whitespace, mobile layouts stretched onto desktop, and information fragmentation.
Reference as
NN/g uses content dispersion to describe layouts in which related information is spread so widely that understanding and comparison require unnecessary navigation or memory.
WIEDENBECK-1999The Use of Icons and Labels in an End User Application ProgramIcons alone versus labels and icon-plus-label interfaces.Primary
Use for
Icons alone versus labels and icon-plus-label interfaces.
Reference as
Wiedenbeck found performance and learning differences among icon-only, label-only, and icon-plus-label conditions, with text labels materially supporting initial use.
Boundary
Do not generalize the result into a claim that every conventional icon always requires visible text in every context.
FITTS-1954The Information Capacity of the Human Motor System in Controlling the Amplitude of MovementPointer-target size, distance, acquisition time, and placement.Primary
Use for
Pointer-target size, distance, acquisition time, and placement.
Reference as
Fitts’s work models target-acquisition difficulty as a relationship between distance and target width.
Best future application
Mobile controls, icon buttons, frequent actions, and avoiding small targets.
Boundary
Do not reduce Fitts’s law to “make every element as large as possible.”
SEGEL-HEER-2010Narrative Visualization: Telling Stories with DataAuthor-driven versus reader-driven presentation, narrative genres, annotations, and guided exploration.PrimaryFramework
Use for
Author-driven versus reader-driven presentation, narrative genres, annotations, and guided exploration.
Reference as
Segel and Heer describe narrative visualization as a balance between guided communication and reader-controlled exploration.
Best future application
Briefings that state a finding first and then permit evidence inspection.
HEER-ROBERTSON-2007Animated Transitions in Statistical Data GraphicsAnimated state transitions, object constancy, filtering, reordering, and changes in graphical representation.Primary
Use for
Animated state transitions, object constancy, filtering, reordering, and changes in graphical representation.
Reference as
Heer and Robertson found that carefully designed animated transitions can help viewers track changes between visualization states.
Boundary
Do not say animation is always better. It can impede exact comparison and accessibility.
BORKIN-2015Beyond Memorability: Visualization Recognition and RecallWhat viewers remember from visualizations, not merely whether they recognize having seen them.Primary
Use for
What viewers remember from visualizations, not merely whether they recognize having seen them.
Reference as
Later Borkin research investigated which visualization elements viewers recognize and recall over time.
Best future application
Editorial explainers, executive communication, and durable visual storytelling.
COLORBREWERColorBrewer 2Choosing palette families that match data structure.FrameworkPractice
Use for
Choosing palette families that match data structure.
Reference as
ColorBrewer distinguishes sequential palettes for ordered magnitude, diverging palettes for deviations around a midpoint, and qualitative palettes for unordered categories.
Best future application
Maps, heatmaps, risk scales, variance displays, and category colors.
SCHLOSS-2024Color Semantics in Human CognitionCurrent synthesis of color-concept associations, semantic inference, and lightness–magnitude expectations.Review
Use for
Current synthesis of color-concept associations, semantic inference, and lightness–magnitude expectations.
Reference as
Current color-semantics research indicates that color mappings can support interpretation when they align with learned and contextually relevant expectations.
SEMANTIC-COLOR-2013Selecting Semantically Resonant Colors for Data VisualizationCategory-color mappings such as blue for oceans or yellow for bananas.Primary
Use for
Category-color mappings such as blue for oceans or yellow for bananas.
Reference as
Lin and colleagues found that semantically resonant category-color assignments improved speed in chart-reading tasks compared with a standard palette.
Best future application
Category palettes where concepts have recognizable color associations.
Boundary
Semantic resonance must still be balanced with contrast and category discriminability.
ELLIOT-MAIER-2014Color Psychology: Effects of Perceiving Color on Psychological FunctioningQualifying claims about color affecting behavior and cognition.Review
Use for
Qualifying claims about color affecting behavior and cognition.
Reference as
Reviews of color psychology report contextual effects but also substantial boundary conditions and unresolved questions.
Best future application
Rejecting simplistic statements such as “blue always creates trust” or “orange always improves conversion.”
VIRIDISIntroduction to the Viridis Color MapsAn implementation precedent for perceptually ordered, color-vision-aware scales.Practice
Use for
An implementation precedent for perceptually ordered, color-vision-aware scales.
Reference as
Viridis provides a practical family of continuous palettes designed to remain perceptually ordered and usable under grayscale and common color-vision deficiencies.
Boundary
Cite Kovesi or primary color-map research for theory; cite Viridis for implementation precedent.
CIVIDISOptimizing Colormaps with Consideration for Color-Vision DeficiencyThe Cividis palette and color-vision-aware continuous scale construction.PrimaryPractice
Use for
The Cividis palette and color-vision-aware continuous scale construction.
Reference as
Cividis was developed to provide a perceptually appropriate continuous scale with improved accessibility for common color-vision deficiencies.
Best future application
Scientific or operational heatmaps requiring continuous quantitative color.
CATEGORICAL-COLOR-2023The Effects of Color Palette and Category Count on Multiclass ScatterplotsCategory count, palette discriminability, and interpretation accuracy.Primary
Use for
Category count, palette discriminability, and interpretation accuracy.
Reference as
Categorical palette effectiveness declines as category count and discrimination demands increase.
Best future application
Limiting simultaneous series, using direct labels, filtering, shapes, or small multiples.
WCAG-1.4.1Understanding 1.4.1: Use of ColorProhibiting color as the only means of communicating information, actions, responses, or distinctions.Standard
Use for
Prohibiting color as the only means of communicating information, actions, responses, or distinctions.
Reference as
WCAG 2.2 SC 1.4.1 requires that color not be the only visual means used to communicate meaningful information.
CVD-GLOBAL-REVIEWColor-Vision Deficiency: A Global PerspectiveBroader contemporary context, acquired deficiencies, prevalence, and practical implications.Review
Use for
Broader contemporary context, acquired deficiencies, prevalence, and practical implications.
Reference as
Color accessibility must consider both congenital and acquired color-vision limitations.
DARK-PATTERNS-2019Dark Patterns at Scale: Findings from a Crawl of 11K Shopping WebsitesDark-pattern taxonomy, manipulation, coercion, hidden costs, obstruction, urgency, and deceptive defaults.Primary
Mathur and colleagues identified 1,818 dark-pattern instances across approximately 11,000 shopping websites and classified them into 15 types and seven broader categories.
The OKF draft defines a minimal human- and agent-readable Markdown/YAML exchange envelope with one concept per file and permissive producer-defined extensions.
Best future application
Canonical authoring layer and portable knowledge exchange.
Boundary
OKF is intentionally minimal and does not define a complete research ontology, schema registry, query system, or validation implementation.
OKF-SKILLSokf-skills: OKF authoring, maintenance, validation, and visualization toolkitAgent-assisted OKF authoring, deterministic validation, graph visualization, deep links, portable skill distribution, and knowledge-as-code workflows.Practice
Use for
Agent-assisted OKF authoring, deterministic validation, graph visualization, deep links, portable skill distribution, and knowledge-as-code workflows.
Reference as
The community implementation demonstrates how OKF bundles can be authored by agents, checked deterministically, visualized as graphs, and maintained as versioned knowledge.
Best future application
Operationalizing OKF with agent skills and CI validation.
Boundary
Community implementation behavior is a production precedent rather than part of the normative OKF draft.
OKF-SKILLS-SAMPLEokf-skills sample bundleA linked OKF example with services, datasets, decisions, runbooks, metrics, index navigation, and graph visualization.Practice
Use for
A linked OKF example with services, datasets, decisions, runbooks, metrics, index navigation, and graph visualization.
Reference as
Different concept types can coexist in one linked bundle and be rendered into a shareable self-contained explorer.
OKF-SKILLS-SELFokf-skills documented in its own OKF bundleSelf-documenting repository with skills, components, reference specifications, and architecture decisions.Practice
Use for
Self-documenting repository with skills, components, reference specifications, and architecture decisions.
Reference as
Dogfooding creates a feedback loop in which the knowledge system documents and validates its own design.
W3C-PROVPROV-O: The PROV OntologyRepresenting entities, activities, people, organizations, and software agents involved in derivation and attribution.Standard
Use for
Representing entities, activities, people, organizations, and software agents involved in derivation and attribution.
Reference as
PROV-O provides a vocabulary for distinguishing accountable agents, software-agent activities, source entities, and generated derivatives.
Best future application
Internal provenance graph and contribution records.
JESSE-OKF-VIDEOOKF usage example and AI-assisted research workflow (video)First-party example supplied by the research owner demonstrating how OKF can be applied and communicated.Practice
Use for
First-party example supplied by the research owner demonstrating how OKF can be applied and communicated.
Reference as
Track the originating human creator and disclose AI assistance as separate provenance fields.
HTML-DIALOGHTML Standard — The dialog elementNative dialogs, modal presentation, top-layer behavior, close requests, return values, and declarative dismissal.Standard
Use for
Native dialogs, modal presentation, top-layer behavior, close requests, return values, and declarative dismissal.
Reference as
The HTML Living Standard defines dialog as the native primitive for modal and nonmodal dialog surfaces.
Best application
Scoped tasks, confirmations, and modal focus behavior.
Boundary
Native dialog does not determine whether modality is appropriate or supply complete product-level focus and data-loss policy.
HTML-DETAILSHTML Standard — The details and summary elementsNative disclosure behavior, summary labeling, open state, and named mutually exclusive details groups.Standard
Use for
Native disclosure behavior, summary labeling, open state, and named mutually exclusive details groups.
Reference as
The HTML Living Standard defines details/summary as a native disclosure primitive rather than a general replacement for menus or tabs.
Best application
Optional explanations, advanced detail, and secondary evidence.
Boundary
Exclusive accordion behavior can obstruct comparison when users need several sections open.
HTML-FORM-INFRAHTML Standard — Form control infrastructureForm ownership, submission, validation, labels, disabled state, reset, autofill, and the form control lifecycle.Standard
Use for
Form ownership, submission, validation, labels, disabled state, reset, autofill, and the form control lifecycle.
Reference as
The HTML Living Standard defines a broad form lifecycle that custom controls must deliberately reproduce or inherit.
Best application
Native-first form architecture and custom-control acceptance criteria.
Google Chrome Developers explains that custom controls inherit substantial lifecycle obligations and can use form-associated custom elements to recover some native behavior.
Best application
Advanced custom-control governance and progressive enhancement.
Boundary
Form-associated custom elements are an advanced mechanism and do not eliminate accessibility and cross-browser testing requirements.
W3C-FORM-LABELSWAI Forms — Labeling controlsPersistent visible labels, explicit label association, control naming, enlarged activation areas, and mobile labeling.Practice
Use for
Persistent visible labels, explicit label association, control naming, enlarged activation areas, and mobile labeling.
Reference as
W3C recommends descriptive labels associated with form controls, ordinarily through the native label element.
W3C-FORM-INSTRUCTIONSWAI Forms — Form instructionsRequired/optional state, formats, units, overall instructions, aria-describedby, and placeholder limitations.Practice
Use for
Required/optional state, formats, units, overall instructions, aria-describedby, and placeholder limitations.
Reference as
W3C recommends stating constraints and instructions in forms in a way that remains available to assistive technologies.
APG-INTROARIA Authoring Practices Guide — IntroductionScope and limitations of APG patterns, semantic HTML preference, assistive-technology testing, and production caveats.Practice
Use for
Scope and limitations of APG patterns, semantic HTML preference, assistive-technology testing, and production caveats.
Reference as
W3C describes APG examples as illustrative patterns that require real browser and assistive-technology testing before production use.
Best application
Governance for ARIA pattern adoption.
Boundary
APG is not a production component library or a replacement for testing.
APG-MENU-BUTTONARIA APG — Menu button patternButtons that open action menus, aria-haspopup, aria-expanded, initial focus, and menu keyboard behavior.Practice
Use for
Buttons that open action menus, aria-haspopup, aria-expanded, initial focus, and menu keyboard behavior.
Reference as
The APG menu-button pattern is intended for a button that opens a menu of commands or choices with an application-style keyboard model.
APG-DISCLOSURE-NAVARIA APG — Disclosure navigation menuWebsite navigation with links and disclosure buttons without applying application-menu roles.Practice
Use for
Website navigation with links and disclosure buttons without applying application-menu roles.
Reference as
W3C recommends disclosure-based navigation for most sites because ARIA menubar semantics introduce unnecessary complexity.
FORM-USABILITY-2014Designing Usable Web Forms — Empirical Evaluation of Web Form Improvement GuidelinesControlled eye-tracking evaluation of combined web-form design guidelines on real company forms.Primary
Use for
Controlled eye-tracking evaluation of combined web-form design guidelines on real company forms.
Reference as
Seckler and colleagues found that optimized forms produced faster completion, fewer submission trials, fewer eye movements, and higher satisfaction.
Best application
Evidence-backed form layout and interaction guidance.
Boundary
The study evaluates a combined guideline package; individual rules should not be treated as universal thresholds.
Creator / author
Mirjam Seckler, Silvia Heinz, Javier A. Bargas-Avila, Klaus Opwis, Alexandre N. Tuch
CHROME-QUIET-PROMPTS-2021“Shhh…be Quiet!” Reducing Unwanted Notification Permission InterruptionsLarge-scale field experiments on quieter notification permission prompts and interruption reduction.Primary
Use for
Large-scale field experiments on quieter notification permission prompts and interruption reduction.
Reference as
Bilogrevic and colleagues found that a quieter permission UI reduced unnecessary prompt actions by up to 30% with less than a 5% effect on grant rates in their A/B test.
Best application
Interruption proportionality and contextual permission requests.
Creator / author
Igor Bilogrevic, Balazs Engedy, Judson L. Porter III, Nina Taft, Kamila Hasanbega, Andrew Paseltiner, Hwi Kyoung Lee, Edward Jung, Meggyn Watkins, PJ McLachlan, Jason James
CHROME-QUIETING-2024Don’t Interrupt Me — On-Device Permission Prompt Quieting in ChromeContext-aware prompt quieting, on-device activation, large-scale telemetry, and user sentiment.Primary
Use for
Context-aware prompt quieting, on-device activation, large-scale telemetry, and user sentiment.
Reference as
Harbach and colleagues report that context-aware quieting was often perceived as helpful and achieved high precision and coverage in the studied deployment.
Best application
Adaptive interruption and permission-request governance.
Creator / author
Marian Harbach, Igor Bilogrevic, Enrico Bacis, Serena Chen, Ravjit Uppal, Andy Paicu, Elias Klim, Meggyn Watkins, Balazs Engedy
WAI-ARIA-1.3Accessible Rich Internet Applications (WAI-ARIA) 1.3 Working DraftEmerging ARIA role and relationship requirements, including explicit accessibility-parent constraints and evolving states and properties.Draft
Use for
Emerging ARIA role and relationship requirements, including explicit accessibility-parent constraints and evolving states and properties.
Reference as
The current WAI-ARIA 1.3 working draft explores changes that may affect future authoring and validation rules.
Best application
Standards monitoring and forward-compatible schema design.
Boundary
This is a working draft, not the current conformance baseline.
Creator / author
W3C working group or task force; individual authors not asserted here
ACCNAME-1.1Accessible Name and Description Computation 1.1The current Recommendation defining how browsers compute accessible names and descriptions exposed to assistive technologies.Standard
Use for
The current Recommendation defining how browsers compute accessible names and descriptions exposed to assistive technologies.
Reference as
AccName 1.1 defines the ordered computation that turns HTML and ARIA labeling relationships into flat accessible-name and description strings.
Best application
Accessible-name testing and debugging.
Creator / author
W3C working group or task force; individual authors not asserted here
ACCNAME-1.2Accessible Name and Description Computation 1.2 Working DraftThe evolving accessible-name and description algorithm, including aria-description and updated name-from rules.Draft
Use for
The evolving accessible-name and description algorithm, including aria-description and updated name-from rules.
Reference as
The AccName 1.2 working draft documents emerging computation behavior that may supersede AccName 1.1.
Best application
Standards monitoring and forward-compatible accessible-name tooling.
Boundary
Use AccName 1.1 and current browser behavior for conformance until 1.2 reaches Recommendation.
Creator / author
W3C working group or task force; individual authors not asserted here
HTML-AAM-1.0HTML Accessibility API Mappings 1.0 Working DraftHow browsers map HTML elements and attributes into platform accessibility APIs and derive accessible names and descriptions.Draft
Use for
How browsers map HTML elements and attributes into platform accessibility APIs and derive accessible names and descriptions.
Reference as
HTML-AAM documents the accessibility-tree semantics browsers expose for native HTML.
Best application
Accessibility-tree inspection and native-semantics debugging.
Boundary
This is an implementation-facing working draft and can change.
Creator / author
W3C working group or task force; individual authors not asserted here
APG-PRESENTATIONAPG — Hiding Semantics with the presentation RoleThe difference between removing semantics and hiding content, inherited presentational effects, and cases where presentation is ignored.Practice
Use for
The difference between removing semantics and hiding content, inherited presentational effects, and cases where presentation is ignored.
Reference as
role="presentation" and role="none" suppress element semantics while ordinarily retaining descendant text and semantics.
Best application
Layout-only wrappers and composite-widget structure normalization.
Boundary
Do not use presentation or none as a general-purpose method for hiding content.
Creator / author
W3C working group or task force; individual authors not asserted here
APG-AT-SUPPORTAPG — Assistive Technology Support TablesARIA-AT must-have and should-have interoperability results, limitations, and recommendations for product testing.Practice
Use for
ARIA-AT must-have and should-have interoperability results, limitations, and recommendations for product testing.
Reference as
ARIA-AT support tables help prioritize testing but are not a final verdict for a specific product implementation.
Best application
Browser/screen-reader test matrices and implementation-risk review.
Creator / author
W3C working group or task force; individual authors not asserted here
WCAG-1.3.1WCAG 2.2 — Info and RelationshipsProgrammatic expression of structure and relationships conveyed visually.Standard
Use for
Programmatic expression of structure and relationships conveyed visually.
Reference as
WCAG 2.2 SC 1.3.1 requires information, structure, and relationships conveyed through presentation to be programmatically determinable or available in text.
Best application
Landmarks, headings, form groups, tables, and component relationships.
Creator / author
W3C working group or task force; individual authors not asserted here
WCAG-4.1.2WCAG 2.2 — Name, Role, ValueProgrammatic name and role, user-settable states and values, and notification of changes.Standard
Use for
Programmatic name and role, user-settable states and values, and notification of changes.
Reference as
WCAG 2.2 SC 4.1.2 requires UI components to expose programmatically determinable names and roles and to make state/value changes available to user agents.
Best application
Custom control conformance and automated accessibility testing.
Creator / author
W3C working group or task force; individual authors not asserted here
WCAG-4.1.3WCAG 2.2 — Status MessagesProgrammatic announcement of status messages without moving focus.Standard
Use for
Programmatic announcement of status messages without moving focus.
Reference as
WCAG 2.2 SC 4.1.3 requires status messages to be programmatically determinable through role or properties so assistive technologies can present them without focus.
Best application
Toasts, inline saves, loading completion, errors, and result counts.
Creator / author
W3C working group or task force; individual authors not asserted here
GRAY-2018The Dark (Patterns) Side of UX DesignPractice-led taxonomy and ethical concerns around manipulative or unreasonably persuasive UX work.PrimaryFramework
Use for
Practice-led taxonomy and ethical concerns around manipulative or unreasonably persuasive UX work.
Reference as
Gray and colleagues identify practitioner concerns, design strategies, and forms of designer complicity associated with dark patterns.
Best application
Ethical design review, taxonomy foundations, and organizational accountability.
Creator / author
Colin M. Gray, Yubo Kou, Bryan Battles, Joseph Hoggatt, Austin L. Toombs
DARK-ONTOLOGY-2023Towards a Preliminary Ontology of Dark Patterns KnowledgeHarmonizing academic and regulatory dark-pattern taxonomies into a shared hierarchy.PrimaryFramework
Use for
Harmonizing academic and regulatory dark-pattern taxonomies into a shared hierarchy.
Reference as
Gray, Santos, and Bielova propose a preliminary ontology that connects multiple dark-pattern taxonomies and regulatory vocabularies.
Best application
Machine-readable deceptive-design classification and cross-regulatory mapping.
SHADOWS-2024Shadows in the Interface: A Comprehensive Study on Dark PatternsA comprehensive literature-derived taxonomy and assessment of dark-pattern detection capabilities.ReviewPrimary
Use for
A comprehensive literature-derived taxonomy and assessment of dark-pattern detection capabilities.
Reference as
The study synthesizes 76 publications into a broad taxonomy and identifies gaps in available detection tools and data.
Best application
Coverage audits and automated-review roadmap.
Boundary
Taxonomy breadth does not mean every named pattern is equally harmful in every context.
Creator / author
Organization-authored or not individually asserted
LUGURI-2021Shining a Light on Dark PatternsRandomized experiments measuring the effectiveness and user response to mild and aggressive dark patterns.Primary
Use for
Randomized experiments measuring the effectiveness and user response to mild and aggressive dark patterns.
Reference as
Luguri and Strahilevitz provide experimental evidence that dark patterns can materially change consumer choices and can provoke backlash when aggressive.
Best application
Autonomy impact assessment and evidence for rejecting conversion-only optimization.
NOUWENS-2020Dark Patterns after the GDPR: Scraping Consent Pop-ups and Demonstrating their InfluenceLarge-scale consent-interface measurement and a field experiment on consent choice architecture.Primary
Use for
Large-scale consent-interface measurement and a field experiment on consent choice architecture.
Reference as
Nouwens and colleagues found widespread noncompliant consent designs and showed that hiding opt-out choices materially increased consent.
Best application
Consent-surface symmetry, first-layer choice parity, and revocation design.
Creator / author
Midas Nouwens, Ilaria Liccardi, Michael Veale, David Karger, Lalana Kagal
FTC-DARK-2022Bringing Dark Patterns to LightUS regulator synthesis of deceptive interfaces involving disguised ads, cancellation obstruction, hidden terms and fees, and privacy manipulation.PracticeStandard
Use for
US regulator synthesis of deceptive interfaces involving disguised ads, cancellation obstruction, hidden terms and fees, and privacy manipulation.
Reference as
The FTC documents patterns that trick or trap consumers and connects them to enforcement concerns under existing consumer-protection law.
Best application
US-oriented deceptive-design policy, review checklists, and enforcement examples.
Boundary
Regulatory applicability depends on facts, jurisdiction, and governing law.
Creator / author
Organization-authored or not individually asserted
OECD-DCP-2022Dark commercial patternsInternational synthesis of definitions, prevalence, effectiveness, harms, and policy responses.ReviewPractice
Use for
International synthesis of definitions, prevalence, effectiveness, harms, and policy responses.
Reference as
The OECD describes dark commercial patterns as practices that steer, deceive, coerce, or manipulate consumers into choices often contrary to their interests.
Best application
Cross-jurisdiction policy framing and harm taxonomy.
Creator / author
Organization-authored or not individually asserted
EDPB-DECEPTIVE-2023Guidelines 03/2022 on deceptive design patterns in social media platform interfacesFinal European data-protection guidance for recognizing and avoiding deceptive design in privacy-related social-media interfaces.StandardPractice
Use for
Final European data-protection guidance for recognizing and avoiding deceptive design in privacy-related social-media interfaces.
Reference as
The EDPB categorizes deceptive design practices and relates them to fairness, transparency, data protection by design, and valid consent.
Best application
Privacy flows, registration, settings, rights requests, and account deletion.
Boundary
Guidance must be applied with the GDPR and relevant national enforcement context.
Creator / author
Organization-authored or not individually asserted
EU-DSA-ARTICLE25Digital Services Act — Article 25: Online interface design and organisationEU prohibition on interface design that deceives, manipulates, or materially impairs free and informed decisions for covered online platforms.Standard
Use for
EU prohibition on interface design that deceives, manipulates, or materially impairs free and informed decisions for covered online platforms.
Reference as
DSA Article 25 prohibits covered platforms from designing or operating interfaces that materially distort or impair free and informed choice.
Best application
European platform governance, choice prominence, nagging, cancellation, and default-setting reviews.
Boundary
Article 25 scope and interaction with GDPR and unfair-commercial-practice law require legal analysis.
Creator / author
Organization-authored or not individually asserted
CMA-OCA-2022Online Choice Architecture: How digital design can harm competition and consumersTaxonomy and policy discussion of online choice architecture, consumer harm, and competition effects.ReviewPractice
Use for
Taxonomy and policy discussion of online choice architecture, consumer harm, and competition effects.
Reference as
The CMA explains how choice structure, information, and pressure can distort decisions and weaken competition.
Best application
Product review beyond narrow deception, including sludge, ranking, defaults, scarcity, and personalization.
Creator / author
Organization-authored or not individually asserted
CMA-OCA-EVIDENCE-2022Evidence review of Online Choice Architecture and consumer and competition harmDetailed evidence review across 21 online-choice-architecture practices.Review
Use for
Detailed evidence review across 21 online-choice-architecture practices.
Reference as
The CMA evidence review distinguishes practices that are usually harmful from context-dependent techniques and evaluates evidence strength.
Best application
Evidence grading, design-review prioritization, and identifying context-sensitive risks.
Creator / author
Organization-authored or not individually asserted
ICO-PRIVACY-DESIGNICO — Data protection by design and by defaultCurrent UK guidance on neutral choices, strong privacy defaults, understandable information, and avoiding harmful language or color nudges.StandardPractice
Use for
Current UK guidance on neutral choices, strong privacy defaults, understandable information, and avoiding harmful language or color nudges.
Reference as
The ICO expects privacy controls to be findable, balanced, understandable, and available throughout the user journey.
Best application
Privacy defaults, consent, withdrawal, settings, and vulnerable-user reviews.
Boundary
Legal obligations depend on UK data-protection scope and facts.
Creator / author
Organization-authored or not individually asserted
CONSENT-NUDGES-2023Don’t Accept All and Continue: Exploring Nudges for More Deliberate Interaction with Tracking Consent NoticesExperimental comparison of interventions intended to interrupt habitual consent responses.Primary
Use for
Experimental comparison of interventions intended to interrupt habitual consent responses.
Reference as
Gerber and colleagues show that consent behavior is often habitual and evaluate mechanisms intended to support more deliberate choice.
Best application
Designing consent for reflection rather than maximizing either acceptance or rejection.
BRIGHT-PATTERNS-2025Dark and Bright Patterns in Cookie Consent RequestsPreregistered experiments comparing privacy-unfriendly and privacy-friendly choice nudges.PrimaryDraft
Use for
Preregistered experiments comparing privacy-unfriendly and privacy-friendly choice nudges.
Reference as
The experiments show that reversing a nudge toward a privacy-friendly choice can also influence behavior, raising questions about autonomy even for well-intended bright patterns.
Best application
Avoiding simplistic substitution of manipulative dark patterns with manipulative bright patterns.
Boundary
Preprint status; findings should be interpreted with the final publication and broader evidence.
Creator / author
Paul Graßl, Hanna Schraffenberger, Frederik Zuiderveen Borgesius, Moniek Buijzen
DARK-AGENTS-2026Dark Patterns Meet GUI Agents: LLM Agent Susceptibility to Manipulative Interfaces and the Role of Human OversightEmpirical comparison of humans, GUI agents, and human-agent teams facing 16 deceptive pattern types.Primary
Use for
Empirical comparison of humans, GUI agents, and human-agent teams facing 16 deceptive pattern types.
Reference as
The study reports that agents often fail to recognize manipulative interfaces and may prioritize task completion over protective action; oversight helps but introduces new costs.
Best application
Agent-safe transactions, confirmation boundaries, and automated dark-pattern auditing.
Creator / author
Jingyu Tang, Chaoran Chen, Jiawen Li, Zhiping Zhang, Bingcan Guo, Ibrahim Khalilov, Simret Araya Gebreegziabher, Bingsheng Yao, Dakuo Wang, Yanfang Ye, Tianshi Li, Ziang Xiao, Yaxing Yao, Toby Jia-Jun Li
FTC-AMAZON-PRIMEFTC v. Amazon.com, Inc. — Prime enrollment and cancellation allegationsA current enforcement example concerning alleged nonconsensual enrollment and cancellation obstruction.Practice
Use for
A current enforcement example concerning alleged nonconsensual enrollment and cancellation obstruction.
Reference as
The FTC case illustrates regulatory scrutiny of enrollment flows and cancellation journeys designed to retain users rather than execute their stated intent.
Best application
Subscription lifecycle red-teaming and cancellation parity.
Boundary
The case is pending; allegations are not final adjudicated findings.
Creator / author
Organization-authored or not individually asserted
FTC-HOPPER-2026FTC v. Hopper — hidden and preselected fee settlementA 2026 enforcement example involving allegedly hidden and preselected optional fees and misleading price claims.Practice
Use for
A 2026 enforcement example involving allegedly hidden and preselected optional fees and misleading price claims.
Reference as
The Hopper matter illustrates risks from preselection, hidden fees, inaccurate total-price communication, and confusing optional-service presentation.
Best application
Checkout, travel, fee, and add-on review.
Boundary
Use the filed complaint and order for precise legal facts and obligations.
Creator / author
Organization-authored or not individually asserted
APG-READ-FIRSTARIA Authoring Practices Guide — Read Me FirstRole-as-promise governance, native HTML preference, and mandatory interoperability testing before production use.Practice
Use for
Role-as-promise governance, native HTML preference, and mandatory interoperability testing before production use.
Reference as
APG states that a role is a promise and that ARIA semantics do not create the keyboard or interaction behavior associated with the role.
Best application
Custom-widget acceptance criteria and fixture design.
Boundary
APG examples are illustrative patterns, not production-certified components.
CHROME-COMMAND-2025Chrome for Developers — Introducing command and commandforDeclarative dialog and popover invocation, custom command events, and capability-based progressive enhancement.Practice
Use for
Declarative dialog and popover invocation, custom command events, and capability-based progressive enhancement.
Reference as
Chrome documents command and commandfor as declarative relationships that map buttons to supported dialog and popover actions.
Best application
Feature-detected fixture variants that reduce bespoke JavaScript.
Boundary
A browser implementation announcement is not a cross-browser support guarantee; test the actual product matrix.
CHROME-WEBUI-2025Chrome for Developers — What’s New in Web UI: I/O 2025 RecapPublished implementation milestones for dialog closedby, command invokers, popovers, and anchor positioning.Practice
Use for
Published implementation milestones for dialog closedby, command invokers, popovers, and anchor positioning.
Reference as
Chrome’s Web UI recap records implementation milestones for declarative interaction primitives and their intended modal or nonmodal behavior.
Best application
Support-tier metadata and progressive-enhancement planning.
Boundary
Milestone tables age quickly and must be reverified against supported browser versions.
Knowledge architecture, attribution, and provenance
Separate source credit, human accountability, AI contribution, and generated projections.
Version 1.3 extends the canonical OKF and provenance system with ARIA semantic contracts, computed accessibility-tree guidance, accessible-name rules, state taxonomies, keyboard models, and interoperability evidence.
1 · Source attribution
Each reference records its creator or author when verified, publisher when known, hosting organization, origin, retrieval date, and attribution status. Unknown authors remain explicitly pending rather than guessed.
2 · Human ownership
Jesse Graupmann is recorded as research director, author, editor, and accountable owner. Direction, evaluation, acceptance, publication approval, and future material changes remain human responsibilities.
3 · AI contribution
OpenAI ChatGPT · GPT-5.6 Thinking is credited as a software-agent contributor for research discovery, source analysis, synthesis, drafting, schema design, implementation, OKF packaging, and validation.
Canonical projection pipeline
OKF bundle Human- and agent-readable Markdown/YAML concepts
Deterministic validation Types, frontmatter, links, citations, IDs, and counts
JSON + JSON-LD Application data and typed PROV graph
SPA + future outputs Mobile reference, search, print, and generated artifacts
OKF profile
OKF supplies the portable exchange envelope. Local profile extensions add ownership, status, relationships, contribution records, and review metadata while remaining tolerable to generic OKF consumers.
Research SourceResearch FindingDesign PrincipleImplementation RecommendationComponent PlaybookValidation MethodAnti-pattern GroupCitation Language RuleContribution RecordProvenance ActivityGenerated ArtifactSchema ProfileValidation ResultInteraction Surface ContractForm Experience ContractNotification Escalation ContractARIA Semantic ContractAccessible Name ContractKeyboard Interaction Contract
Projection boundaries
Projection
Purpose
Schema.org JSON-LD
Public discovery metadata that describes visible content.
Internal JSON-LD / PROV
Claims, citations, agents, activities, ownership, and generated artifacts.
Research JSON
Complete application contract for future systems and agents.
Canonical knowledge and presentation outputs should be separate layers.
A self-contained SPA is an effective reading and sharing projection, but it should not be the only canonical representation of the research.
Design implication: Maintain an OKF-compatible concept bundle as the portable authoring layer, then compile JSON, JSON-LD, search indexes, and the SPA from stable object IDs.
Source authorship and synthesis contribution are independent provenance dimensions.
The creator of a paper, book, standard, repository, or video remains the source author even when a human researcher and AI system transform it into a new synthesis.
Design implication: Record source creators and publishers separately from the research owner, software-agent contributor, derivation activity, review status, and generated artifact.
AI contribution should be explicit without displacing human accountability.
A software agent can be credited for research discovery, synthesis, drafting, schema design, implementation, and validation while the accountable human retains direction and publication authority.
Design implication: Use contribution roles and activities rather than assigning AI an ambiguous co-author label; record who directed, reviewed, accepted, or rejected the output.
Public structured data and the internal research graph serve different audiences.
Schema.org JSON-LD should truthfully describe visible public content, while an internal JSON-LD/PROV graph can express richer claims, citations, derivations, ownership, and agent activity.
Design implication: Generate both projections from the same canonical identifiers instead of forcing one vocabulary to serve discovery, governance, and reasoning simultaneously.
Publish constrained public JSON-LD and a richer internal provenance graph.
Search engines and public consumers need concise truthful metadata; enterprise agents need typed relationships, contribution activities, and evidence lineage.
Implementation guidance
Use Schema.org Dataset/CreativeWork for the visible artifact
Use PROV-O for agents, activities, derivation, and attribution
Use stable @id values matching SPA anchors and OKF concept IDs
Use the strongest accurate verb for each evidence class.
Evidence class
Recommended wording
Usage boundary
Standard
WCAG 2.2 requires…
Use for normative requirements and final technical specifications.
Primary research
The experiment found…
Describe the population, task, and boundary when material.
Review
The review concludes…
Use to summarize a body of evidence or qualify classic findings.
Framework
The framework proposes…
Do not present conceptual models as experimental proof.
Practice guidance
The practitioner guidance recommends…
Use for applied patterns and production precedent.
Draft
The current working draft explores…
Never present draft language as a current requirement.
Continuous compiler & release governance
Deterministic generation, source freshness, integrity manifests, and accountable review.
The research system is now compiled as a versioned product. Canonical data, presentation templates, provenance, search indexes, and OKF concepts are validated together; published derivatives receive content hashes and explicit evidence boundaries.
Build identity
8742e6f0154118dae479
Compiler v1.0.0 · System v1.6.2
Canonical inputs
5
Derivative classes
8
Freshness ledger
181 sources tracked
181 date-current · 9 attribution reviews pending
Offline validation does not prove current URL reachability or source supersession.
Certification boundary
Compiler-verified, not production-certified
Structural, integrity, and deterministic gates are automated. Representative visual and assistive-technology evidence remains required.
Deterministic compiler pipeline
1
Load canonical inputs
Read versioned research JSON, graph, template, and OKF concepts.
Inject script-safe JSON, graph, and pointer search index into the presentation template.
5
Run structural gates
Check HTML IDs, anchors, button names, JavaScript syntax, catalog continuity, and unsafe URL schemes.
6
Evaluate freshness and evidence gaps
Apply review cadences by source class and preserve unresolved attribution and test evidence.
7
Generate integrity manifest
Hash inputs and derivatives and record the compiler, build identity, sizes, and validation status.
8
Require governed review
Material changes move through proposed, validated, reviewed, approved, released, and superseded states.
Release gates
passBlocking
Schema and count parity
Release cannot proceed when this gate fails.
passBlocking
IDs, anchors, references, and OKF links
Release cannot proceed when this gate fails.
passBlocking
HTML data, JSON-LD, and JavaScript syntax
Release cannot proceed when this gate fails.
passBlocking
Two clean rebuilds produce identical bytes
Release cannot proceed when this gate fails.
warningEvidence
Source freshness and attribution review
This evidence gap remains visible and scheduled.
pendingEvidence
Stable visual regression runner
This evidence gap remains visible and scheduled.
pendingBlocking
Representative browser and assistive-technology evidence
Release cannot proceed when this gate fails.
template readyBlocking
Accountable human release approval
Release cannot proceed when this gate fails.
Governed review workflow
01
Proposed
Describe intended change, affected objects, evidence, and risk.
Owner: contributor
02
Machine Validated
Pass deterministic schemas, references, syntax, and integrity gates.
Owner: compiler
03
Human Reviewed
Evaluate meaning, evidence quality, user impact, and rejected alternatives.
Owner: research owner or delegate
04
Approved
Record approval, limitations, and release scope.
Owner: accountable approver
05
Released
Publish manifest, package, changelog, and known limitations.
Owner: release process
06
Superseded
Preserve prior state and link to the replacement.
Owner: maintainer
Source freshness policy
Evidence class
Review cadence
Reason
Draft
30 days
Working documents can change materially without a stable release boundary.
Standard or specification
45 days
Normative status, editions, errata, and implementation support may change.
Practice guidance
90 days
Browser, platform, and design-system behavior evolves quickly.
Primary study or review
365 days
The original evidence is stable, but later replication or synthesis may qualify it.
Framework or book
730 days
Foundational concepts are durable; editions and interpretation still require periodic review.
A valid URL is not proof that the content is current, unchanged, authoritative, or not superseded. Network and archival checks remain a separate pipeline stage.
Build artifacts
Rebuild and audit the release
The package includes the canonical compiler inputs, deterministic template, schemas, CI example, review template, freshness ledger, and integrity manifest.
The SPA, embedded JSON, JSON-LD graph, OKF bundle, component behavior contracts, and ARIA semantic contracts share stable IDs, references, attribution, and validation records.
Data contract
The structured payload is embedded in <script type="application/json" id="research-data">. Future systems can extract it without interpreting layout or CSS.
meta
Version, generation date, description, schema version, and entity counts.
principles
Governing rules with summaries, detailed implications, and reference relationships.
domains
Concept taxonomy, key concepts, takeaways, and source keys.
findings
Stable findings with domain, evidence summary, design impact, and citations.
recommendations
Prioritized implementation actions, rationale, steps, and evidence.
components
Component purpose, anatomy, recommended use, anti-patterns, and sources.
methods
Validation questions, test steps, and supporting research.