Annotation Playground
A quiet annotation component for explaining a meaningful decision without turning an interface into a tutorial.
- Category
- Interface detail
- Year
- 2026
- Status
- Experiment
Release review
Navigation feedback
The active state appears immediately, while the full navigation rhythm stays quiet until someone needs it.
What it is
A directional note for details that deserve context.
An annotation should make one decision easier to notice. Here it explains why the primary state is calm and why the action remains singular, instead of repeating what the interface already says.
Play with the component
Use DialKit to tune the actual annotation and specimen.
The live controls adjust the card geometry, annotation offset, and arrow scale. They are intentionally scoped to the component so the surrounding Craft preview remains a neutral reading surface.
Design decisions
A little personality only works when it protects hierarchy.
Point at a decision, not a label
The note explains the reasoning behind the state and action. It does not duplicate the heading, status, or button label.
Keep the specimen realistic
A compact release review gives the arrows something useful to clarify. The component can then be judged in the conditions where it would actually be used.
Tune the object, not the frame
DialKit changes the annotation component and the interface it describes. The shared preview wrapper stays out of the control surface.