Bureau voor bewegingsontwerp
Beweging is
een argument,
geen versiering.
Deze pagina documenteert zichzelf. Elke animatie die u hier ziet staat naast haar eigen curve, haar duur in milliseconden en één zin over waarom ze bestaat. Wat niet uit te leggen valt, hoort er niet te zijn.
Fig. 0 — Elke lijn is één versnellingscurve, uitgezet over tijd. Zelfde seed, zelfde veld. Getekend in canvas, niet gefotografeerd.
Vier vragen per animatie
Wij bouwen geen beweging voordat alle vier beantwoord zijn. In een oplevering staan de antwoorden in de code, niet in een los document.
- V/01
Waarom beweegt dit?
Beweging zonder taak is ruis. Richten, verklaren, bevestigen of vertragen — kies er één.
- V/02
Wat beweegt er precies?
Positie, dekking, schaal of kleur. Twee eigenschappen tegelijk is bijna altijd één te veel.
- V/03
Hoe lang duurt het?
Onder 200 ms voelt als reactie, boven 500 ms als wachten. Daartussen zit vakmanschap.
- V/04
Welke curve hoort erbij?
Iets dat binnenkomt remt af. Iets dat vertrekt versnelt. Lineair bestaat alleen in machines.
Specimenkast
Vijf bewegingen uit de dagelijkse praktijk. Druk op afspelen om er één te herhalen. De annotatie rechts wordt gegenereerd uit dezelfde constanten die de animatie aandrijven — de documentatie kan dus niet verlopen.
Curve-atlas
Dezelfde afstand, dezelfde duur, een andere curve. Zet er twee naast elkaar en het verschil is niet subtiel.
—
—
De rustige variant
Een deel van uw bezoekers zet beweging uit — wegens migraine, vestibulaire klachten of gewoon voorkeur. Dat is geen uitzonderingsgeval dat je achteraf afvangt; het is een tweede ontwerp dat er vanaf het begin is. Zet de schakelaar om en de hele pagina wisselt.
volgt nu uw systeeminstelling: —
| Onderdeel | Volledige beweging | Rustige variant |
|---|---|---|
| Onthulling bij scroll | schuift 24 px omhoog, 420 ms | verschijnt direct, geen verplaatsing |
| Hover op een kaart | licht op en schuift 3 px | alleen randcontrast |
| Volgorde in een lijst | 60 ms per rij na elkaar | alles tegelijk zichtbaar |
| Paginaovergang | uitfaden, dan inschuiven | directe wissel |
| Generatief veld | tekent zichzelf in ± 6 s | één stilstaand eindbeeld |
Wat wij opleveren
Een bewegingssysteem in tokens: duren, curves en regels die uw team kan hergebruiken zonder ons. Plus deze pagina, ingevuld met uw eigen bewegingen, als levende documentatie.
Terug naar boven