Zum Hauptinhalt springen

Animation

Es gibt vier Wege, etwas zu bewegen. Das sind wirklich verschiedene Werkzeuge, keine Schichten eines einzigen — die erste Aufgabe ist also, den richtigen zu wählen.

WegAm besten fürEingestellt in
Transitioneine weiche Änderung von hier nach dorteiner Dauer an einem Schritt oder State
Animationsschritteine wiederverwendbare Bewegung an einem Ereigniseinem Schritt in einem Ereignis
TimelineChoreografie — mehrere Objekte, mehrere Spuren, eine Uhrdem Animation Controller
Modell-ClipAnimation, die mit einem importierten Modell kamden Einstellungen des Modells

Als grobe Regel: ein ausblendender Button ist eine Transition, eine Tür, die beim Antippen aufgeht, ein Animationsschritt, eine Zwischensequenz die Timeline, und eine gehende Figur ein Modell-Clip.

Ein Objekt, ein Mechanismus

Animieren Sie dasselbe Objekt nie auf zwei Arten gleichzeitig. Die Timeline schreibt jedes Bild in ihre Objekte und überschreibt eine Transition stillschweigend. Wenn eine Animation mit sich selbst zu kämpfen scheint, liegt es daran.

Transitionen

Geben Sie einer Änderung eine Dauer, und sie läuft weich statt zu springen. Das gilt für einen State-Wechsel mit Dauer ebenso wie für einen Ereignisschritt mit Dauer.

Eine Transition hat eine Dauer, ein Easing und optional eine Wiederholungszahl und einen Ping-Pong-Modus. Was weich laufen kann, steht unter was weich animiert; alles andere ändert sich am Ende.

Eine Wiederholungszahl von 1 ist ein einzelner Durchlauf

Ping-Pong beginnt bei 2. Das bewahrt ältere Projekte davor, plötzlich zu pulsieren.

Animationsschritte

Ein Animationsschritt verschiebt, dreht, skaliert oder blendet aus, worauf Sie ihn richten.

Geben Sie ihm ein einzelnes Ziel, gleitet er dorthin. Geben Sie ihm zwei oder mehr Keyframes, spielt er die ganze Kurve.

SchrittAnimiert
TransformationPosition, Rotation, Skalierung
DeckkraftEin- und Ausblenden
Knochen-Transformationeinen einzelnen Knochen
Materialkopiert das Aussehen eines gespeicherten Materials auf Ihre Ziele
Animation abspielen / stoppenstartet oder stoppt ein Timeline-Preset

Keyframes und Easing

Ein Keyframe ist ein Zeitpunkt und ein Wert.

Das Easing gehört zu dem Keyframe, in den Sie hineinlaufen

Nicht zu dem, den Sie verlassen. Setzen Sie das Easing am Ziel-Keyframe. Kein Easing bedeutet eine gerade Linie.

Easing ist eine Kurve mit zwei Griffen, genau wie CSS cubic-bezier. Die benannten Presets — quad, quart, circular, expo, back, jeweils als In, Out oder InOut — sind nur nützliche Griffpositionen.

EasingFühlt sich an wie
Inlangsam anfangen, Tempo aufnehmen — etwas setzt sich in Bewegung
Outankommen und sich setzen — das Natürlichste für Oberflächen
InOutan beiden Enden weich — gut für lange Bewegungen
Backleicht überschießen und zurückkommen — verspielt
Elasticüberschießen und nachwippen, mit eigener Stärke und Periode
Stephalten, dann am Ende umspringen — zum Schalten, nicht zum Gleiten

Im Zweifel ist Out fast immer die richtige erste Vermutung.

Die Timeline

Der Animation Controller ist für Choreografie — mehrere Dinge, die sich auf einer Uhr gemeinsam bewegen.

Sein Aufbau hat drei Ebenen:

  • ein Preset ist eine Animation, die Sie über ihren Namen abspielen können;
  • ein Balken ist der Part eines Objekts darin, auf einer Spur;
  • innerhalb eines Balkens hat jede Eigenschaft eigene Keyframes.

Ein Balken kann auch ein Abspielbalken sein: Statt selbst etwas zu animieren, startet er das Preset eines anderen Objekts, sobald der Abspielkopf ihn erreicht. So bleibt eine Figur, deren Gliedmaßen eigene Presets sind, synchron. Schleife und Geschwindigkeit werden an alles weitergereicht, was er startet, und ein Preset zu stoppen stoppt alles, was es gestartet hat.

Einzelne Eigenschaften in einem Balken lassen sich stummschalten: Ein Balken, der Position und Rotation animiert, kann seine Rotation abschalten, ohne die Keyframes zu verlieren.

Importierte Clips behalten ihre Originalkurven

Animation, die mit einem Modell ankommt, wird nicht neu angenähert — ein importierter Gehzyklus läuft genau so, wie die Künstlerin oder der Künstler ihn angelegt hat.

Modell-Clips

Ein Modell bringt eigene benannte Clips mit. Wählen Sie einen, stellen Sie dann Geschwindigkeit, Schleife (einmal, eine Anzahl, oder endlos) und ein Startbild ein — gezählt mit 30 Bildern pro Sekunde, gleich welche Rate die Quelle hatte.

Den Clip oder das Startbild zu ändern spult zurück. Pausieren hält die aktuelle Zeit, statt sie zurückzusetzen.

Einheiten, und eine Sache, die fehlt

  • Zeit in Sekunden (Dauern bei State-Wechseln sind in Millisekunden);
  • Rotation in Grad überall, wo Sie sie sehen können;
  • Startbilder gezählt mit 30 fps.
Es gibt kein Ereignis „Animation beendet"

Keiner der vier Mechanismen liefert eines. Um nach einer Animation etwas anderes anzuschließen, nehmen Sie einen Warte-Schritt derselben Länge oder verfolgen die verstrichene Zeit in einem Skript.


Weiter: States — benannte Momentaufnahmen eines Objekts.