A familiar page — a long-form article — reinterpreted as a field. The structure stays ordinary
semantic HTML; the field adds a second layer: orientation, memory, and relationship. It remains
fully readable with the field off or motion reduced. This is the first of the
concept studies.
Data honesty
Data source
Synthetic. The article, its citations, and the two example claims (one supported, one contested) are hand-authored to demonstrate the layers — not a real publication or a real citation graph.
Snapshot
Fixed sample content defined in-page; no committed snapshot and no snapshot script feeds this study.
Live refresh
No external data, so no live refresh. Attention and memory accrue in-page as you read and toggle the controls.
Not claimed
The field adds orientation, memory, and relationship over the semantic HTML. It does not fact-check the article or resolve the contested claim — support and conflict are shown as structure, not verdicts.
BeforeA plain semantic article — headings, citations, a source list. Toggle the field off to see it.
AfterField on: sections gather attention and accrue memory, citations thread to sources, claims show support and conflict.
InspectReveal the live relationship graph and the platform readout — why the page behaves as it does.
semantic article — field off
Field off stops the simulation and the page reverts to the plain semantic article — different
from turning a single projection off (say, the relation lens), where the field keeps
running and only that one expression stops being drawn.
Origins
Early interfaces were instruments before they were screens: panels of switches and dials where every control mapped to one machine state.1 The operator held the model in their head.
The shift toward metaphor began when displays became cheap enough to show a representation of state rather than the state itself.
The metaphor era
The desktop metaphor made the computer legible to non-specialists by borrowing objects people already understood — documents, folders, a trash can.2
Metaphor traded fidelity for familiarity. It is widely held that the desktop metaphor was the decisive factor in personal-computer adoption — a claim worth examining, since timing and price fell at once.3
Direct manipulation
Direct manipulation replaced commands with continuous, reversible action on visible objects: drag, drop, resize, undo.4
Its cost is that everything must be on screen to be actuated. As systems grew, the operator's mental model returned — now as navigation rather than memorized commands.
Relational interfaces
A document is a tree, but meaning is a graph: a citation relates to a source, a claim to its evidence, a control to the thing it changes. Interfaces have mostly represented those relations passively, as links to click.
A relational interface treats them as live structure — visible, weighted, inspectable — without abandoning direct manipulation or semantic HTML.
Evidence
Claims are bodies; sources bind to them. A claim with a contradiction reads as contested; one with only support reads as supported. Hover a claim to thread it to its sources.
The desktop metaphor caused personal-computer adoption. contested
Smith et al., “Designing the Star User Interface” (1982)
Norman, “The Design of Everyday Things” (1988)
Shneiderman, “Direct Manipulation” (1983)
Patterns applied
Each is a real FieldPattern from the catalog. The ones marked
live are driven through applyPattern() on this page; the
rest are the conceptual family this study embodies.