Field Notes
Composition

Composition

The checklist and rules for composing components with the dimensional model.

The Composition Checklist

Answer these questions in order before composing any component:

  1. What does this communicate? → Assign sentiment
  2. How urgently must the user receive this? → Assign emphasis
  3. Is this combination semantically coherent? → Validate against the sentiment-emphasis relationship
  4. What physical scale is appropriate? → Assign size
  5. What spacing tier separates this from adjacent elements? → Apply spacing tiers
  6. Does the overall composition read as a coherent hierarchy? → Validate the postmodern balance

State is never answered here. It is always runtime.

Composition Guardrails

These rules must be validated at composition time. The resolver does not enforce them.

  1. Sentiment is content-driven. Confirm the content's intent before assigning sentiment.
  2. Emphasis reflects criticality. Do not reduce emphasis for aesthetic reasons alone.
  3. Only declared sentiments are valid. Do not improvise sentiments outside the manifest.
  4. State is never set manually. State is always runtime. Never pass a static state prop.
  5. Sentiment flows down; emphasis does not. A container's sentiment may influence its children, but emphasis is always set per-component.
  6. Never set emphasis on a container. Containers provide context (sentiment); emphasis belongs on the action or content elements within.

The Postmodern Balance

No single rule — proximity, dominance, separation — applies universally. Reading a composed layout requires evaluating the whole structure, not applying rules element by element. A correct composition satisfies all three simultaneously:

  • Visual hierarchy — the eye knows where to go first
  • Information sentiment — the right things feel important, cautionary, or ambient
  • Action/data emphasis — interactive elements are appropriately weighted relative to content

On this page