Motion

Motion ist eine Animationsbibliothek für JavaScript und React. Sie bewegt Elemente mit natürlicher Federphysik, koppelt Animationen an die Scrollposition und animiert Layoutänderungen fließend.

Stärken: was es gut kann

• Natürliche Bewegung: Federn statt fester Laufzeiten lassen Interaktionen direkt wirken.
• Klein und modern: nutzt, wo möglich, die Animations-Engine des Browsers, damit alles flüssig bleibt.
• Scroll und Sichtbarkeit: Effekte, die starten, wenn ein Element erscheint, oder der Scrollposition folgen.
• React-Integration: Ein- und Ausblendungen und gemeinsame Layout-Übergänge mit wenig Code.

Prinzipien: Bewegung mit Sinn

Animation soll den Blick führen, eine Veränderung erklären oder Rückmeldung geben, nie den Nutzer aufhalten. Jede Animation, die ich baue, respektiert die Einstellung „Bewegung reduzieren“, und alles, was sich von selbst bewegt, lässt sich anhalten.

Einsatz: wann ich es wähle

Für Interface-Animationen, Micro-Interactions, Einblendungen beim Scrollen und magnetische Buttons in Websites und Apps. Diese Website nutzt Motion für ihre Scroll-Effekte.