In OTTO Design System, this is expressed primarily through visual cues: a button or card look pressable by being round, underlined text looks clickable, a bordered field looks writable. When these cues are absent or misleading, users either miss interactions entirely – or expect actions that don't exist.
A common form are affordance icons, placed at the right side of components to signal the available interaction. The design system uses the following icons for this purpose:
- arrow-right – in buttons and rows, signals navigation or forwarding
- arrow-down – in accordions, signals an expandable element
- external-link – in buttons and rows, marks an external destination