De standaardlook van een muziektool bepaalt het genre van de muziek dat mensen ermee maken. Een zwart-paarse synthtool duwt mensen richting synthtracks. Een warme-papieren folktool duwt ze richting folktracks. Wij wilden dat aisonggen neutraal aanvoelt over genre, dus heeft het vier thema's die alle vier gelijkwaardig bij de voordeur staan.
De vier sferen waar we op uitkwamen
- Sonic Teal — de koele, klinische standaard. Ziet eruit als de binnenkant van een masteringstudio na middernacht. Beste voor ambient, techno, alles waar het nummer meer architectuur is dan verhaal.
- Neon Orange — de luide, hete. De merkstandaard. Ziet eruit als een cluburitgang om 2 uur 's nachts. Beste voor trap, hyperpop, alles waar de energie het punt is.
- Studio Black — de stille dure. Houtskool en goud. Ziet eruit als een gitaarversterker gemaakt van leer. Beste voor jazz, soul, singer-songwritertakes die serieus genomen willen worden.
- Electric Magenta — de speelse. Roze en chroom. Ziet eruit als de binnenkant van een Y2K-muziekvideo. Beste voor pop, dance, alles waar de grap voor de hand mag liggen.
Wat de thema's ons kostten
Ontwerpen voor één thema is duizend kleine beslissingen over
contrast, hiërarchie en nadruk. Ontwerpen voor vier is dezelfde
duizend beslissingen, vier keer — en ze moeten op hetzelfde
component landen zonder dat het breekt. We maakten het hanteerbaar
door elke kleur in een tokensysteem te zetten, zodat de componenten
zelf nooit naar een hexcode reiken, alleen naar een rol: --primary,
--accent, --bg-elevated. De thema's veranderen de waarden;
de componenten veranderen helemaal niet.
Wat het ons opleverde
Wat we niet hadden verwacht: mensen begonnen thema's te kiezen op genrecontext, niet op persoonlijke smaak. Een producer die aan een trapbeat werkte, sloeg om naar Neon Orange, ook al was zijn standaard Sonic Teal. De themaschakelaar werd geen instellingenmenu meer en werd onderdeel van de workflow — een manier om de kamer in de juiste stemming te brengen voor het nummer dat je toevallig schreef.
Een opmerking over toegankelijkheid
Alle vier de thema's voldoen aan WCAG AA op tekstcontrast en focusringen. Geen ervan vertrouwt alleen op kleur voor status — elke actieve status verandert ook vorm, gewicht of positie. Een gebruiker die het kleurverschil tussen Sonic Teal en Neon Orange niet kan zien, moet nog steeds kunnen zien dat een knop is ingedrukt.