Standards contribution
Acoustic tokens
The sound parallel to the visual token system.
No sound appears on a Designesy surface without a token name and a rationale here. The W3C Design Tokens Format Module 2025.10 does not define acoustic token types — this system is net-new relative to the canonical standard.
Standards context
W3C DTCG 2025.10
The W3C Design Tokens Format Module 2025.10 does not define acoustic/audio token types. Designesy acoustic tokens are net-new relative to the canonical standard.
Proposed type
Designesy declares $type: sound with $extensions.designesy namespacing per the DTCG extension convention. This format may be proposed to the W3C DTCG as a future token type contribution.
Reference format
{"$value":"tick","$type":"sound","$description":"Navigation hover","$extensions":{"designesy":{"engine":"cuelume","role":"nav"}}}
Token reference
Ten cues, ten interaction roles. Every sound on a Designesy surface traces to a token here.
--cue:brand · sparkle
Character. Bright playful accent
Role. Brand wordmark contact
Where · Hero wordmark, topbar logo, footer mark, Open field card hover
--cue:nav · tick
Character. Crisp instant tick
Role. Navigation and wayfinding
Where · Topbar nav links, surface footer links, secondary CTAs
--cue:invite · chime
Character. Soft default chime
Role. Primary invitation / machine surfaces
Where · Primary hero CTA hover, kit field card, machine footer links
--cue:action · press
Character. Dull muted knock
Role. Pointer-down on actionable surfaces
Where · Buttons, field cards, surface cards
--cue:resolve · release
Character. Brighter springy tick
Role. Pointer-up default resolve
Where · Most buttons and cards
--cue:complete · success
Character. Warm three-note confirmation
Role. High-value resolve
Where · Primary Open CTA release, Open/Kit field card release
--cue:reveal · bloom
Character. Warm slow swell
Role. Content / experiment reveal
Where · Pillar cards, Lab field card hover
--cue:list · whisper
Character. Breathy quiet swell
Role. Dense list / surface scan
Where · Surface cards, principle rails, dense lists
--cue:switch · toggle
Character. Mechanical click-clack
Role. State toggle
Where · Sound preference button
--cue:contact · droplet
Character. Soft dismissive droplet
Role. Contact / outbound mail
Where · Footer mail, privacy mail
Mapping rules
- Brand marks earn sparkle. Hero wordmark, topbar logo, and footer mark are brand contact — not generic nav ticks.
- One primary cue family per role. Nav stays tick. Brand stays sparkle. Dense lists stay whisper. Do not randomize per page without updating this document.
- Hover sounds are fine-pointer only upstream. On coarse/touch pointers, Designesy binder maps the same hover cue to a single tap.
- Press/release on touch. Designesy binder plays the same cues on touch/pen pointerdown/pointerup.
- Toggle sounds fire via preference hook. The sound button does not use data-cuelume-toggle.
- No ambient audio. Cuelume is interaction-only. No background music, no mood beds, no loading sounds.
- Preference is user-owned. Designesy stores the sound preference in localStorage under designesy:sound.
- Audio unlock on first real cue. Mobile Safari keeps AudioContext suspended until a user gesture.
- Every cue must trace to this document. If a sound appears in the markup without a token here, it is a contract violation.
Accessibility
- Reduced motion → sound off. prefers-reduced-motion: reduce is treated as an acoustic-reduction proxy. The user can still enable sound manually via the toggle.
- No focus sounds. Sounds fire on pointer and click events, not on focus. Screen reader users navigate by focus and are not bombarded with hover cues.
- Toggle is keyboard-accessible. The sound toggle button uses aria-pressed and plays via the preference hook on click (includes keyboard activation).
- Silent fallback. If Web Audio is blocked or unavailable, all sounds become no-ops. No errors, no degradation of visual experience.
- Volume is not adjustable. Cuelume synthesizes at fixed gain levels tuned for subtlety. If a user finds sounds too loud, they can mute via the toggle.