Ein animierter Like-Button, ein sanfter Farbwechsel beim Hover — kleine Details, die eine Website lebendig wirken lassen.


Microinteractions sind die kleinen Animationen und Rückmeldungen, die passieren, wenn ein Nutzer etwas tut — ein Klick, ein Hover, ein abgeschicktes Formular. Sie bestehen im Kern immer aus einem Auslöser, einer Regel, einer sichtbaren Rückmeldung und manchmal einem wiederkehrenden Zustand.
Ihr Nutzen ist größer, als die winzige Größe vermuten lässt: Sie bestätigen dem Nutzer, dass eine Aktion funktioniert hat — etwa ein Häkchen nach dem Absenden eines Formulars — und geben einer Website dadurch eine Art fühlbare Verlässlichkeit, die reiner Text nicht schafft.
Die wichtigste Regel dabei: subtil bleiben. Eine Microinteraction, die zu auffällig oder zu langsam ist, nervt schneller, als sie begeistert — als Richtwert hat sich bei mir eine Animationsdauer zwischen 200 und 500 Millisekunden bewährt. Technisch lassen sich die meisten Effekte bereits mit einfachen CSS-Transitions umsetzen, für komplexere Fälle kommen JavaScript oder Bibliotheken wie Lottie oder Framer Motion dazu.
Der Fehler, den ich am häufigsten sehe: zu viele Microinteractions gleichzeitig, die dann eher unruhig als hochwertig wirken. Weniger, dafür konsequent zur Marke passend umgesetzt, schlägt fast immer die Variante mit möglichst vielen Effekten.
Webdesigner & SEO-Experte aus Augsburg — seit 1999