Animation and interaction
Motion that adds value instead of distracting. Page transitions, scroll effects, and micro-interactions that complete the experience without compromising speed.
Your site is either static, or it moves so much that it becomes slow and overwhelming, leaving users unsure of where to look.
Does this sound familiar?
Tell me what isn't working or what's taking up too much of your time, and I'll let you know what I would do and roughly what it would cost. You'll be speaking directly to me, not an account manager.
Animation and interaction is motion that adds value instead of distracting. Page transitions, scroll effects, hover responses, and micro-interactions that complete the experience without compromising speed. We build this with GSAP and Barba.js, ensuring it remains smooth on every device and makes the site feel like a cohesive whole.
Why motion
Motion shows where something comes from and where it is going. A menu that slides open, a page transitioning to the next, a button that reacts to your mouse. It makes a site feel tangible. Too much motion makes it slow and exhausting. The art lies in knowing when to stop.
What we build
Page transitions without reloads, making the site feel like an application. This site uses a pixel transition. Scroll animations: elements that appear as you scroll past them, parallax that adds depth. Hover effects on buttons, cards, and menus. Marquees, tickers, and scrolling logos. Text animations that build letter by letter or line by line. And navigation that reacts to scrolling.
How we do it
All animation is contained in a single script, built on GSAP, which we manage independently of Webflow. This makes it fast, testable, and reusable across projects. Barba.js handles the page transitions. Every animation cleans itself up during a page change. Visitors who prefer less motion get exactly that: the site respects the system setting for reduced motion.
What it costs and how long it takes
Animation is usually part of a website project and is designed alongside the pages. Adding page transitions to an existing site takes a few days of work, depending on how many scripts are running. GSAP itself is free.
Who it is not for
For portals and applications with many forms and logins, page transitions introduce more complexity than they are worth. And if loading speed is the priority for your site, we keep the motion minimal.
Where we have done it
Bistrobar Beaune: transitions, scroll effects, and a menu that captures the atmosphere of the restaurant. This site itself: pixel transition, mega menu with a sliding highlight, magnetic buttons.
Read more
The design that the motion belongs to: web design. Maintaining speed: performance optimization.
How can we help?
Cases
.avif)
.avif)
Get more out of your website
DeDigitaal Clients
Questions about
Animation and interaction
Maakt animatie de site langzamer?
Niet als het goed gebouwd is. GSAP is licht en we laden alleen wat de pagina nodig heeft. We meten het.
Werken de animaties ook op mobiel?
Ja. Hover-effecten vallen weg op touch, de rest schaalt mee. Zware effecten zetten we op mobiel uit.
Kunnen we de animaties zelf aanpassen?
De meeste effecten werken via data-attributen in Webflow: attribuut toevoegen, animatie erop. Nieuwe effecten bouwen wij.
Wat kost animatie en interactie?
Basisanimatie zit in elk project. Uitgebreide overgangen en effecten zijn een extra dagdeel tot enkele dagen, afhankelijk van de wensen.
Zijn de animaties toegankelijk?
Ja. De site luistert naar de systeeminstelling voor beperkte beweging en alle content is bereikbaar zonder animatie.