Subtiele animaties zijn niet decoratie — ze’re de vogellijm tussen gebruiker en interface. Een knippering hier, een sliding daar, en plots voelt je website als een echte ervaring in plaats van een opeenstapeling van klikbare vakjes.
Het Verhaal
Marijn begon in 2012 als junior webdesigner in Utrecht. Destijds ontdekte hij wat veel designers nog steeds missen: subtiele animaties bepalen hoe mensen met interfaces omgaan. Het ging niet om flashy effecten — het ging om beweging die voelt als feedback.
Na drie jaar dook hij diep in CSS-animaties en JavaScript-interacties. Hij realiseerde zich dat de meeste developers nooit de balans vonden tussen visueel aantrekkingskracht en daadwerkelijke bruikbaarheid. Dus specialiseerde hij zich in microinteracties — die kleine, betekenisvolle animaties op hover, scroll en click-momenten die je waarschijnlijk niet eens bewust opmerkt, maar die wel degelijk het verschil maken.
Zijn doorbraak kwam in 2018. Hij bouwde een systeem voor real-time formuliervalidatie-animaties dat de foutquote bij online formulieren met 28% verlaagde. Dat was het moment waarop het klikt: bewegingsontwerp is niet alleen mooi, het is ook functioneel. En het moet voor iedereen werken — inclusief mensen die voorkeur geven aan gereduceerde beweging.
Bij Animotion Studio B.V. helpt Marijn Nederlandse bedrijven bewegingsontwerp correct in te voeren. CSS-transities, keyframe-animaties, laadstate-indicatoren die de waargenomen wachttijd verminderen, formulier-feedback die eigenlijk voelt als hulp in plaats van kritiek. En ja, hij let heel goed op WCAG-toegankelijkheidsnormen. Want elegante beweging hoort voor iedereen beschikbaar te zijn.
Jaar ervaring in frontend design
Reductie in waargenomen wachttijd voor klanten
Lagere foutquote in online formulieren
Professioneel Traject
Hogeschool van Amsterdam
Afstuderen in Interaction Design. Focus op gebruikerservaring en digitale interfaces. Hier ontdekte Marijn dat animaties niet alleen visueel moeten werken, maar ook psychologisch.
Junior Webdesigner — Creative Bureau Utrecht
Start als junior designer bij een creatief bureau. Ontdekt dat subtiele CSS-animaties het verschil maken in hoe gebruikers interfaces ervaren. Begint zich te specialiseren in bewegingsontwerp.
Frontend Developer — Digital Agency Amsterdam
Verdieping in CSS-animaties en JavaScript-driven interacties. Realiseert zich dat veel developers geen balans vinden tussen esthetiek en prestatie. Begint systematisch microinteracties te documenteren.
Doorbraak: Real-Time Formuliervalidatie-Systeem
Ontwerpt en implementeert een systeem voor formuliervalidatie-animaties dat foutquotes met 28% verlaagt. Dit moment maakt duidelijk dat bewegingsontwerp ook functioneel is. Start focus op WCAG-toegankelijkheid.
Senior Designer — Animotion Studio B.V.
Treedt toe tot Animotion Studio B.V. als Senior Frontend Designer & Animation Specialist. Leidt projecten waarin CSS-transities, keyframe-animaties en laadstate-indicatoren worden geïmplementeerd voor Nederlandse bedrijven. Focus op prestatie-optimalisatie en inclusiviteit.
Specialisaties
Waar Marijn zich op focust en waarom het belangrijk is
UI Microinteracties
Kleine, betekenisvolle animaties op hover, scroll en click-momenten. Marijn ontwerpt beweging die feedback geeft zonder storend te zijn. Knipperingen die je ziet, slides die voelen als hulp, en hover-effecten die voelen als antwoord van de website.
CSS Transities & Keyframe-Animaties
Vloeiende visuele effecten gebouwd met pure CSS. Geen heavy JavaScript, geen externe bibliotheken — alleen elegante transities en keyframe-animaties die snel laden en soepel werken. Dit is de basis van modern webdesign.
Laadstate-Indicatoren
De waargenomen wachttijd verminderen zonder daadwerkelijk sneller te laden. Marijn ontwerpt laadstatus-indicatoren die gebruikers het gevoel geven dat er iets gebeurt. Progressiebalkjes, spinner-animaties en skelet-loaders die echt werken.
Formulier-Validatie-Animaties
Real-time feedback die zich voelt als hulp in plaats van kritiek. Groene checkmarks die verschijnen, waarschuwingen die gently verschijnen, en foutmeldingen die niet straf voelen. Dit verhoogt inzendingen en vermindert frustratie.
Prefers-Reduced-Motion & Toegankelijkheid
Elegante beweging hoort voor iedereen beschikbaar te zijn. Marijn respecteert WCAG-normen en implementeert prefers-reduced-motion-voorkeur. Beweging die optioneel is, niet verplicht. Animaties die verbeteren, niet hinderen.
Prestatie-Optimalisatie
Bewegingsontwerp dat niet ten koste gaat van snelheid. GPU-geacceleerde animaties, efficient CSS, en slimme laadstrategieën. Marijn bouwt interfaces die zich voelen als vloeiend en ook daadwerkelijk snel zijn.
Hoe Marijn Werkt
Begrijpen
Eerst begrijpt Marijn wat je website doet en wie het gebruikt. Waar willen gebruikers heen? Waar zouden animaties echt nuttig zijn? Dit bepaalt alles wat volgt.
Ontwerpen
Beweging wordt ontworpen, niet gegokt. Marijn schetst keyframe-animaties, test timing en easing-functies, en zorgt dat alles voelt als echte feedback.
Implementeren
Pure CSS-transities en keyframe-animaties. Geen overbodige JavaScript, geen animatie-bibliotheken die je site vertragen. Alles is handgeschreven en geoptimaliseerd.
Testen & Verfijnen
Testen op werkelijke devices. Controleren of timing voelt goed. Zorgen dat prefers-reduced-motion wordt gerespecteerd. Itereren totdat alles soepel is.
Wat Marijn Heeft Geschreven
Diepgaande artikelen over UI-animatie en microinteracties
CSS Transities en Keyframe Animaties: De Basis
Alles wat je moet weten over CSS-transities en @keyframe-animaties. Van eenvoudige hover-effecten tot complexe bewegingssequenties. Marijn legt uit waarom deze technieken het fundament zijn van modern webdesign.
Lees artikelLaadstatus Indicatoren: Wachttijd Verminderen
Hoe je de waargenomen wachttijd vermindert zonder daadwerkelijk sneller te laden. Progressiebalkjes, spinner-animaties en skelet-loaders. Marijn deelt praktische technieken die echt werken.
Lees artikelFormulier Feedback met Realtime Validatie Animaties
Hoe je formuliervalidatie voelt als hulp in plaats van kritiek. Real-time feedback, animaties die aanmoedigen, en foutmeldingen die niet straf voelen. Dit verhoogt inzendingen echt.
Lees artikelAnimaties en Toegankelijkheid: Prefers-Reduced-Motion
Elegante beweging hoort voor iedereen beschikbaar te zijn. Hoe je prefers-reduced-motion respecteert en WCAG-normen volgt. Marijn toont aan dat toegankelijkheid en mooi design hand in hand gaan.
Lees artikelWil je meer weten?
Ontdek meer over hoe Marijn Nederlandse bedrijven helpt bewegingsontwerp correct in te voeren, of neem contact op om te zien hoe hij jouw project kan verbeteren.