UX in Motion Manifest

Wer schon einmal ein schlecht animiertes Interface benutzt hat, kennt das Gefühl: Ein Klick, und irgendwas passiert – aber was genau, und warum jetzt, und was bedeutet das für den nächsten Schritt? Diese kurze Orientierungslosigkeit ist kein Nutzerproblem. Sie ist ein Designproblem.

Bewegung im Kontext von User Interfaces ist mehr als ein visuelles Beiwerk. Sie ist eine wirkungsvolle Kraft, die Usability stärkt und die Reichweite gestalterischer Kommunikation erweitert. Genau diesen Gedanken hat der Designer und UX-Experte Issara Willenskomer 2017 in seinem viel beachteten UX in Motion Manifest konsequent zu Ende gedacht – und damit einen konzeptionellen Rahmen geschaffen, der bis heute prägend für professionelles UX/UI-Design ist.

Nach über fünfzehn Jahren intensiver Beschäftigung mit Bewegung in Benutzeroberflächen identifizierte Willenskomer 12 spezifische Situationen, in denen Bewegung die Usability in UX-Projekten gezielt verbessern kann. Was auf den ersten Blick nach einer Sammlung von Designregeln klingt, ist bei näherer Betrachtung ein grundlegendes Umdenken: weg von Animation als optischem Effekt, hin zu Bewegung als funktionalem Kommunikationsmittel.

Wir beschäftigen uns seit Jahren intensiv mit diesen Prinzipien – nicht als akademische Übung, sondern weil wir täglich sehen, wie gut eingesetzte Bewegung das Nutzungsverhalten messbar verändert. In diesem Artikel schlüsseln wir das Manifest auf, ordnen es in den aktuellen Kontext des Webdesigns ein und zeigen, was es für die Praxis bedeutet.

Animation ist nicht das, was die meisten Leute denken

Wenn es um Motion Graphics in Webdesign geht, muss zwischen UX Motion Design und UI-Animationen unterschieden werden. Willenskomer beginnt sein Manifest damit, den Leser zu ermutigen, Bewegungsdesign nicht als "UI-Animationen" zu betrachten – denn viele nehmen Bewegung als Nachgedanken wahr, der der Oberfläche nachträglich aus rein visuellen Gründen hinzugefügt wird.

Motion Design ist nicht dasselbe wie UI-Animation. Das ist entscheidend, weil UI-Animation fast immer als kosmetisches Anhängsel ohne Relevanz für die User Experience behandelt wird. Bewegung ist kein Ornament – sie ist Verhalten. Und Verhalten kann die User Experience entweder verbessern oder verschlechtern.

Das ist keine Kleinigkeit. Es ist eine fundamentale Neupositionierung. Wenn Bewegung Verhalten ist, dann unterliegt sie denselben Designprinzipien wie jedes andere Interface-Element auch: Sie muss einen Zweck erfüllen, sie muss konsistent sein, und sie muss zur mentalen Erwartung des Nutzers passen.

Bewegungsdesign dreht sich nicht nur um Ästhetik – es bestimmt, wie Komponenten funktionieren und sich verhalten. Von Motion Graphics über Übergangsanimationen bis hin zu Micro-Interactions ist Bewegung eine grundlegende Kraft, die die User Experience prägt und bereits in den frühesten Phasen des UX-Designprozesses berücksichtigt werden muss.

Wer diese Unterscheidung verinnerlicht hat, trifft beim nächsten Projekt eine andere Grundentscheidung: Animation wird nicht am Ende "draufgesetzt", sondern ist Teil des konzeptionellen Fundaments – genauso wie Farbgebung, Typografie oder Informationsarchitektur.

Echtzeit vs. Nicht-Echtzeit: Eine Unterscheidung mit großer Wirkung

Bevor die 12 Prinzipien Sinn ergeben, braucht es ein konzeptionelles Werkzeug: die Unterscheidung zwischen Echtzeit- und Nicht-Echtzeit-Interaktion.

Willenskomer unterscheidet in seinem Manifest zwischen Echtzeit- und Nicht-Echtzeit-Bewegung in UX. Echtzeit-Bewegung entsteht, während Nutzer direkt mit dem Interface interagieren, während Nicht-Echtzeit-Bewegung nach der Nutzereingabe einsetzt.

Der Unterschied mag technisch klingen, hat aber unmittelbare Auswirkungen auf das Nutzungsgefühl. Bei Echtzeit-Interaktion reagiert die Oberfläche synchron mit der Handlung des Nutzers – ein Element bewegt sich, während der Finger wischt oder der Cursor zieht. Das erzeugt das Gefühl direkter Kontrolle, von echter Manipulation. Ein digitales Produkt wird in seiner Bewegungsgestaltung wirklich responsiv, wenn Animationen angemessen auf Nutzeraktionen reagieren, ohne ein Gefühl der Trennung zu erzeugen.

Nicht-Echtzeit-Interaktionen sind seriell: Erst handelt der Nutzer, dann reagiert das System. Dieser winzige Zeitversatz – oft nur Millisekunden – ist in der Wahrnehmung spürbar. Das Interface fühlt sich weniger lebendig an, die Verbindung zwischen Aktion und Reaktion ist schwächer. Menschen sind darauf ausgerichtet, Probleme zu bemerken – wenn alles gleichmäßig läuft, fallen Dinge nicht auf. Wenn wir etwas als diskontinuierlich erleben, aktiviert das unsere Alarmsysteme und löst eine Reihe von physiologischen und Verhaltensreaktionen aus.

Das ist kein Design-Luxusproblem. Unternehmen, die diese Ebene im Interface systematisch durchdenken, bauen Interfaces, die sich intuitiv anfühlen – und solche werden länger genutzt, häufiger weiterempfohlen und generieren höhere Conversion-Raten. Jeder in UX investierte Dollar bringt bis zu 100 Dollar Umsatz zurück – ein ROI von 9.900 Prozent für Unternehmen, die Design priorisieren.

Vier Wege, wie Bewegung Usability verbessert

Bewegung unterstützt Usability auf vier Wegen: durch Erwartung, Kontinuität, Narrativ und Beziehungen. Diese vier Dimensionen sind kein Design-Jargon, sondern beschreiben echte kognitive Prozesse, die beim Nutzen digitaler Oberflächen ablaufen.

Erwartung: Das Interface spricht vor dem ersten Klick

Nutzer kommen mit Erwartungen. Nicht nur über Inhalte, sondern über das Verhalten von Objekten. Ein Element, das aussieht wie ein Button, sollte sich auch wie ein Button verhalten. Bewegt sich dieses Element beim Hovern auf eine Weise, die der Erwartung des Nutzers entspricht, entsteht Vertrauen. Bewegt es sich überraschend oder gar nicht, entsteht Unsicherheit.

Bewegung kann diese Erwartungen gezielt erfüllen – oder subtil korrigieren. Ein Link, der beim Hover leicht nach oben gleitet, kommuniziert ohne ein einziges Wort: "Hier passiert etwas, wenn du klickst." Das ist Usability durch Bewegung.

Kontinuität: Kein abrupter Bruch im Nutzungsfluss

Menschen verarbeiten visuelle Informationen in Zusammenhängen. Abrupte Zustandswechsel – ein Element verschwindet, ein anderes taucht auf, ohne erkennbare Verbindung – erzeugen kognitive Reibung. Eine Studie aus dem Jahr 2024 zeigte, dass Animationstechniken in Datenvisualisierungen Nutzern helfen, Muster genauer und schneller zu erkennen und so die kognitive Belastung effektiv zu reduzieren.

Gut eingesetzte Bewegung überbrückt solche Übergänge. Sie macht sichtbar, dass Zustand A und Zustand B zusammenhängen – und dass der Nutzer noch immer in demselben Interface navigiert. Das schafft Orientierung ohne erklärende Texte.

Narrativ: Das Interface erzählt eine Geschichte

Storytelling in Verbindung mit Motion Design entwickelt sich zu einem wirkungsvollen Werkzeug, um die Aufmerksamkeit der Nutzer zu gewinnen. Ein Interface, das Inhalte sequenziell erschließt – das zeigt, bevor es erklärt, das führt, bevor es fordert –, nutzt Bewegung als narratives Mittel.

Effektive UX dreht sich nicht nur um Usability, sondern auch darum, die Geschichte und Persönlichkeit einer Marke zu vermitteln. Motion Design kann Narrative zum Leben erwecken, indem es Charaktere, Infografiken oder Produktdemonstrationen animiert. Animiertes Storytelling fügt der User Experience Tiefe und Emotion hinzu und erleichtert es Nutzern, sich mit dem Inhalt und der Marke selbst zu verbinden.

Beziehungen: Zusammengehöriges bleibt zusammen

Elemente, die sich gemeinsam bewegen oder aufeinander reagieren, signalisieren Zusammengehörigkeit. Elemente, die unverbunden erscheinen, wirken isoliert und verwirrend. Bewegung kann diese semantischen Beziehungen sichtbar machen – schneller und direkter als jede visuelle Gestaltung durch Farbe oder Form allein.

Die 12 Prinzipien: Ein strukturierter Rahmen für bewegte Interfaces

Willenskomers 12 Prinzipien sind in fünf Dimensionen gegliedert. Was sie von einfachen "Animationstipps" unterscheidet: Sie sind keine ästhetischen Empfehlungen, sondern beschreiben funktionale Zusammenhänge zwischen Bewegung und Nutzerkognition. Willenskomer zeigt mit seinen 12 Prinzipien des "UX in Motion", wie Bewegung die Usability verbessern und das Nutzerverhalten lenken kann.

Timing: Easing und Offset & Delay

Easing beschreibt, wie sich ein Objekt im zeitlichen Verlauf bewegt. Lineare Bewegungen – gleichmäßig von A nach B – wirken mechanisch. Natürliche Bewegungen folgen physikalischen Gesetzen: Sie beschleunigen sanft, verlangsamen am Ziel. Das Easing-Prinzip besagt, dass das Verhalten eines Objekts den Nutzererwartungen entspricht, wenn zeitliche Ereignisse eintreten. Das klingt simpel, hat aber große Auswirkung: Ein Element, das "natürlich" ankommt, fühlt sich organisch an. Eines, das abrupt stoppt, fühlt sich kaputt an.

Offset & Delay überträgt dieses Prinzip auf mehrere Objekte gleichzeitig. Das Offset-&-Delay-Prinzip definiert Objektbeziehungen und Hierarchien, wenn neue Elemente und Szenen eingeführt werden. Wenn drei Elemente nacheinander ins Bild gleiten – das erste voran, die anderen mit minimalem Versatz –, entsteht ohne ein einziges Wort ein Gefühl von Gruppe, Reihenfolge und Zusammengehörigkeit. Der Nutzer versteht die Hierarchie, bevor er die Inhalte gelesen hat.

Objektbeziehungen: Parenting

Das Parenting-Prinzip schafft räumliche und zeitliche hierarchische Beziehungen bei der Interaktion mit mehreren Objekten. In der Praxis bedeutet das: Ein übergeordnetes Element "zieht" ein untergeordnetes mit – durch Bewegung, Größenveränderung oder Positionswechsel. Nutzer erkennen diese Abhängigkeit intuitiv. Sie müssen nicht erklärt werden; sie werden erlebt.

Objekt-Kontinuität: Transformation, Wertänderung, Maskierung, Überlagerung und Klonen

Diese fünf Prinzipien beschäftigen sich alle mit derselben Grundfrage: Wie verändert sich ein Objekt, ohne dass der Nutzer den Überblick verliert?

Transformation ist das direkteste davon: Ein Objekt ändert seine Form, um eine veränderte Funktion zu signalisieren. Das Transformationsprinzip schafft einen kontinuierlichen narrativen Fluss, wenn sich die Funktion eines Objekts ändert. Ein klassisches Beispiel: Der Absenden-Button eines Formulars, der sich nach dem Klick in einen Ladekreis und dann in ein Häkchen verwandelt. Kein Nutzer fragt sich mehr, ob das Formular gesendet wurde.

Wertänderung nutzt dynamisch wechselnde Zahlen oder Anzeigen als Feedback-Kanal. Ein Fortschrittsbalken, eine Prozentanzeige, ein sich füllender Kreis – diese Responsivität signalisiert: "Dieses Interface ist lebendig, es reagiert auf dich." Der Loop baut Vertrauen auf.

Maskierung macht sichtbar, wenn ein Zustand dauerhaft ist. Ein ausgegrauer, nicht mehr anklickbarer Button signalisiert: Diese Aktion ist abgeschlossen, nicht mehr umkehrbar. Das reduziert Fehler – und gibt dem Nutzer Kontrolle.

Überlagerung hingegen kommuniziert Temporäres. Ein Element tritt in den Vordergrund, während ein anderes zurücktritt – aber beide bleiben potenziell aktiv. Die Unterscheidung zwischen Maskierung und Überlagerung ist fein, aber kognitiv bedeutsam: Sie entscheidet darüber, ob ein Nutzer eine Aktion als reversibel oder irreversibel einschätzt.

Klonen schließlich nutzt visuelle Ähnlichkeit als Bedeutungsträger. Ein aus einem Elternelement hervorgehendes Kind-Element, das dieselbe Form übernimmt, kommuniziert sofort: Diese Elemente gehören zusammen, sie teilen Funktion oder Kontext.

Zeitliche Hierarchie: Defokussierung (Obscuration)

Zu den 12 Prinzipien des UX in Motion gehört auch die Obscuration – die gezielte Unschärfe als Gestaltungsprinzip. Durch das Verschwimmen nicht-relevanter Elemente lenkt die Oberfläche die Aufmerksamkeit auf das, was gerade zählt. Das menschliche visuelle System ist darauf ausgelegt, Bewegung besser zu erkennen als statisches visuelles Feedback – ein evolutionäres Überlebensinstinkt. Im digitalen Design hilft dieser Mechanismus, die Nutzeraufmerksamkeit natürlich zu lenken.

Defokussierung öffnet zudem die dritte Dimension: Elemente im Vordergrund und Hintergrund erzeugen Tiefengefühl – ohne dass eine echte 3D-Umgebung nötig wäre.

Räumliche Kontinuität: Parallaxe, Dimensionalität und Dolly & Zoom

Diese drei Prinzipien spielen alle mit räumlicher Wahrnehmung. Parallax-Effekte und sanfte Übergänge schaffen eine fließende, narrativ geführte Nutzerreise. Die Website zeigt so nicht nur Informationen, sondern nimmt Besucher mit auf ein immersives Erlebnis.

Dimensionalität nutzt subtile 3D-Effekte, um Tiefe und Orientierung zu vermitteln. Fortschritte in der Grafikentechnologie haben den Weg für den breiten Einsatz von 3D-visuellen Elementen im UI/UX-Design geebnet. Dreidimensionale Grafiken verleihen Tiefe und Realismus und bieten eine immersivere und visuell ansprechendere User Experience.

Dolly & Zoom – der kinematografische Blickwechsel – lenkt die Aufmerksamkeit durch Annäherung oder Distanzierung. Präsentationswerkzeuge wie Prezi haben dieses Prinzip populär gemacht; im modernen Webdesign findet es sich in Scroll-Animationen, die Inhalte progressiv enthüllen, statt sie auf einmal zu präsentieren.

Warum diese Prinzipien 2025/2026 relevanter sind denn je

Das UX in Motion Manifest ist nicht veraltet – es ist aktueller als je zuvor. Denn die Anforderungen an digitale Interfaces sind in den vergangenen Jahren deutlich gestiegen.

Microinteractions und Motion UI sind 2025 keine optionalen Extras mehr, sondern essentielle Bestandteile modernen Webdesigns. Sie prägen die User Experience erheblich und verdienen ihren Platz in jeder ernsthaften Designstrategie. Diese subtilen, gezielten Animationen und interaktiven Elemente liefern sofortiges Feedback, lenken die Aufmerksamkeit der Nutzer und schaffen emotionale Verbindungen.

23 Prozent der Designer erwarten, dass Micro-Interactions und Motion Design einen großen Einfluss haben werden, während 50 Prozent bereits Micro-Interactions und Animationen in ihre aktuelle Arbeit integrieren.

Bewegung ist aus dem modernen Webdesign nicht mehr wegzudenken. Allerdings hat sich der Einsatz von Animationen deutlich verändert. Während früher oft spektakuläre Effekte im Vordergrund standen, liegt der Fokus 2026 klar auf Funktionalität und Nutzerführung. Microinteractions, sanfte Übergänge und dezente Hover-Effekte geben Nutzern Feedback und machen die Bedienung intuitiver. Animationen erklären, was passiert, und helfen dabei, Zusammenhänge zu verstehen.

Das deckt sich exakt mit dem, was Willenskomer bereits 2017 formuliert hat: Bewegung um der Bewegung willen ist wertlos. Bewegung im Dienst der Nutzerführung ist unersetzlich.

Interfaces beginnen, sich lebendig anzufühlen – sie reagieren auf Nutzereingaben mit Bewegung, Textur und subtilen Rückmeldungen. Googles neueste Iteration des Material Design, genannt "Material Expressive", setzt auf dynamische Bewegung und taktile Reaktion. Diese Entwicklung spiegelt einen breiteren Wandel wider, hin zu Design, das sich sensorischer anfühlt.

Motion Design in der Praxis: Was wir in Projekten beobachten

Micro-Interactions und Motion UI halten Nutzer neugierig und aufmerksam, was die Absprungrate reduziert. Visuelle Bewegung hilft anzuzeigen, was anklickbar ist, was als nächstes kommt und was wichtig ist – ohne sich ausschließlich auf Text verlassen zu müssen. Professionelles Motion Design für Websites signalisiert Qualität, Glaubwürdigkeit und Modernität. Wenn Nutzer emotional und visuell eingebunden sind, folgen sie häufiger Handlungsaufforderungen.

In unserer Arbeit an Webanwendungen und Softwarelösungen beobachten wir regelmäßig, wie stark der Unterschied zwischen einem Interface mit durchdachten Bewegungsübergängen und einem ohne ist. Das gilt besonders für komplexe Anwendungen mit mehrstufigen Prozessen: Wenn Zustandsänderungen sichtbar gemacht werden – ein Element, das sich verwandelt, statt einfach zu verschwinden – reduziert sich die Fehlerquote spürbar.

Das gilt auch für Responsive Webdesign: Auf mobilen Geräten, wo Gesten die primäre Interaktionsform sind, sind Echtzeit-Animationen besonders wirksam. Swipe-Bewegungen, die sichtbar auf den Finger reagieren, Elemente, die beim Tippen Feedback geben – das sind keine visuellen Extras, sondern direkte Kommunikation zwischen Interface und Nutzer.

Kognitive Last beschreibt die Menge an Gehirnleistung, die benötigt wird, um eine Website reibungslos zu navigieren. Gute UX hält diese niedrig. Performancefreundliches Motion Design liefert visuelle Hinweise und Feedback, die es Nutzern erleichtern zu verstehen, wie ein Interface funktioniert – ohne sie mit Informationen zu überladen.

Eine Verbesserung des UX-Designs, die die Kundenbindung um nur 5 Prozent erhöht, kann sich in einem Gewinnzuwachs von 25 Prozent niederschlagen. Das sind Zahlen, die in strategischen Entscheidungen eine Rolle spielen sollten – und die den Stellenwert von Bewegung als Designprinzip weit über die Frage des Geschmacks heben.

Die richtige Balance: Wann Bewegung hilft und wann sie schadet

Willenskomers Manifest ist kein Plädoyer für mehr Animation. Es ist ein Plädoyer für richtiger Animation. Und das schließt den bewussten Verzicht ausdrücklich ein.

Zu viele Animationen, lange Loops oder auffällige Effekte lenken ab, statt zu fesseln. Große JavaScript-Animationen können Ladezeiten erhöhen, was SEO und UX schadet. Nutzer mit eingeschränkten Bewegungspräferenzen oder älteren Geräten können leiden – Fallback-Lösungen sind daher immer bereitzustellen.

Das CSS-Attribut prefers-reduced-motion ist heute technischer Standard und sollte in jedem Projekt berücksichtigt werden. Accessibility und Motion Design schließen sich nicht aus – sie bedingen einander, wenn man es richtig macht.

Micro-Interactions sind subtile, aufgabenbasierte Animationen oder Reaktionen, die Nutzer während ihrer Interaktion mit einem Produkt führen, informieren oder erfreuen. Diese kleinen Designelemente verbessern die User Experience, indem sie visuelles oder auditives Feedback geben und Aufgaben intuitiver und ansprechender machen.

Der Maßstab ist immer: Hilft diese Bewegung dem Nutzer, oder ist sie da, weil sie beeindruckend aussieht? Die erste Frage führt zu besseren Interfaces. Die zweite zu mehr Ablenkung.

Was das Manifest für Entscheider bedeutet

Das UX in Motion Manifest ist nicht primär ein Dokument für Entwickler und Designer. Es ist ein konzeptioneller Rahmen, der erklärt, warum bestimmte digitale Produkte sich mühelos anfühlen – und andere nicht.

Für Unternehmen, die in digitale Oberflächen investieren, bedeutet das: Die Qualität von Bewegung im Interface ist kein ästhetisches Detail, das am Ende des Projekts entschieden wird. Sie ist eine strategische Variable, die früh in den Designprozess gehört. Webdesign 2026 ist deutlich mehr als eine Frage des Geschmacks. Es ist ein strategisches Werkzeug, das darüber entscheidet, ob eine Marke Vertrauen aufbaut, Nutzer begeistert und langfristig erfolgreich ist.

UX-Design beeinflusst direkt das Kundenerlebnis und wirkt sich auf wichtige Kennzahlen wie Engagement, Bindung und Conversion-Raten aus. Unternehmen, die an der Verbesserung der Customer Experience arbeiten, verzeichnen im Durchschnitt eine Verbesserung der Kundenbindung um 42 Prozent, eine Verbesserung der Kundenzufriedenheit um 33 Prozent und eine Steigerung von Cross- und Up-Selling um 32 Prozent.

Das sind messbare Ergebnisse – nicht Designphilosophie. Und sie entstehen nicht zufällig, sondern durch strukturierte Designentscheidungen, zu denen der Einsatz von Bewegung nach den Prinzipien Willenskomers gehört.

Unternehmen, die heute systematisch in die Qualität ihrer digitalen User Experience investieren – und das schließt Motion Design als funktionales Element explizit ein –, schaffen Interfaces, die nicht erklärt werden müssen. Sie werden einfach benutzt. Das ist das eigentliche Ziel jedes guten UX/UI-Designs: eine Oberfläche, die so selbstverständlich funktioniert, dass die Technik dahinter unsichtbar wird.

Das UX in Motion Manifest ist, fast acht Jahre nach seiner Entstehung, kein historisches Dokument. Es ist ein Werkzeug – für alle, die digitale Produkte bauen, die wirklich funktionieren.