Grund
Animationen dienen der Verbesserung der User Experience. Deshalb muss jede Animation einen funktionalen Grund haben.
Grund
Animationen dienen der Verbesserung der User Experience. Deshalb muss jede Animation einen funktionalen Grund haben.
Dauer
Als grober Richtwert gilt für Animationen ein Bereich zwischen 200 und 500 Millisekunden.
Dauer
Als grober Richtwert gilt für Animationen ein Bereich zwischen 200 und 500 Millisekunden.
Easing
Objekte bewegen sich nie linear. Ihre Bewegungsabläufe sollten Ease-In-, Ease-Out oder Ease-In-Out-Bewegungen entsprechen.
Easing
Objekte bewegen sich nie linear. Ihre Bewegungsabläufe sollten Ease-In-, Ease-Out oder Ease-In-Out-Bewegungen entsprechen.
Räumliche Orientierung
Elemente zeigen durch Bewegung, wo sie verankert sind.
Räumliche Orientierung
Elemente zeigen dem Nutzer durch Bewegungen, wo sie verankert sind.
Visuelle Kontinutiät
Elemente, die auf unterschiedlichen Bildschirm-Ansichten zu sehen sind, bewegen sich sichtbar an ihre neue Position.
Visuelle Kontinuität
Elemente, die auf unterschiedlichen Bildschirm-Ansichten zu sehen sind, bewegen sich sichtbar an ihre neue Position.
Staffeln des Inhalts
Elemente werden nicht alle auf einmal animiert, sondern mit kurzen Verzögerungen von ca. 20 Millisekunden (Richtwert).
Staffeln des Inhalts
Elemente werden nicht alle auf einmal animiert, sondern mit kurzen Verzögerungen von ca. 20 Millisekunden (Richtwert).
Pfade
Bewegungen von Objekten sind nicht geradlinig, sondern folgen einer bogenförmigen Linie.
Pfade
Bewegungen von Objekten sind nicht geradlinig, sondern folgen einer bogenförmigen Linie.
Erwartungshaltung erzeugen
Durch gegensätzliche Bewegungen eines Objekts wird auf die Aktion, die gleich passieren wird vorbereitet.
Erwartungshaltung erzeugen
Durch gegensätzliche Bewegungen eines Objekts wird auf die Aktion, die gleich passieren wird vorbereitet.
Übertreibung
Animationen besonders wichtiger Elemente werden übertrieben dargestellt, um die Aufmerksamkeit des Nutzers zu erhalten.
Übertreibung
Animationen besonders wichtiger Elemente werden übertrieben dargestellt, um die Aufmerksamkeit des Nutzers zu erhalten.
Begleitende Animationen
Umliegende Elemente eines animierten Elements reagieren auf dessen Animation.
Begleitende Animation
Umliegende Elemente eines animierten Elements reagieren auf dessen Animation.
