Die Seite wirkt statisch und billig.
Animation & Motion Design
Bewegung mit Aufgabe.
Animation ist kein Schmuck. Richtig eingesetzt zeigt sie, was zusammengehört, wohin der Blick soll und dass das System reagiert hat. Falsch eingesetzt kostet sie Ladezeit und macht Menschen mit Bewegungsempfindlichkeit schwindelig.
Ausgangslage
Typisch, wenn Sie
hier landen.
Effekte ruckeln auf dem Handy.
Alles bewegt sich, aber nichts wird dadurch klarer.
Leistungsumfang
Das ist enthalten.
Bewegungskonzept: was wird animiert und warum
Scroll- und Hover-Zustände, Seitenübergänge, Ladezustände
Weiche Kurven statt Standardverläufe
60 Bilder pro Sekunde geprüft auf einem Mittelklasse-Telefon
Rücksicht auf reduzierte Bewegung im Betriebssystem
Nutzen
Was sich ändert.
Ein ruhiger, abgestimmter Ablauf wirkt teurer als jede Effektsammlung.
Bewegung zeigt Zusammenhänge, die Text erklären müsste.
Wer Bewegung reduziert hat, bekommt eine ruhige Fassung.
Ablauf
In drei Schritten.
Konzept
Welche Stellen brauchen Bewegung — meist weniger als gedacht.
Umsetzung
Animation auf Transform und Deckkraft, nicht auf Layout-Eigenschaften.
Messen
Bildrate auf echten Geräten prüfen, nicht im Schreibtischbrowser.
Fragen
Was hier gefragt wird.
Macht das die Seite langsamer?+
Nur wenn es falsch gebaut ist. Wir animieren ausschließlich Eigenschaften, die die Grafikkarte übernimmt.
Was ist mit Bewegungsempfindlichkeit?+
Wer im Betriebssystem reduzierte Bewegung eingestellt hat, bekommt eine Fassung ohne Animation. Das ist Pflicht, nicht Höflichkeit.
Weitere Themen