Interaction model#

The hover and select frames in assets/ aren’t separate renders — they’re states of one interactive artifact. The interactive HTML embeds the dataset, so hover is purely client-side (zero calls); only a click that opens the inspector hydrates detail via GetDevice / GetPort.

Default → Hover → Select states and their call costs
Default → Hover → Select states and their call costs

States#

  • Default — the full render.
  • Hover (rollover) — client-side highlight of the node under the pointer. No server calls.
  • Select (click) — opens the inspector for the clicked node, hydrated with a GetDevice or GetPort call. As an operator clicks deeper, each click is one more lookup.

Locked conventions#

The visual design system and interaction vocabulary are locked in assets/DESIGN.md: palette, typography, heat gradients, device icons, and the semantic highlight rules (dead = red, survives = green). Renderers reproduce the approved mockups; they don’t invent a new look. The interaction-cost model is detailed in TOOLS.md.

Backward Observability Contributing Forward