18. OKTOBER 2023
Erweiterte Entspannung in Tildas Schritt-für-Schritt-Animation
Sie haben jetzt mehr Flexibilität bei der individuellen Anpassung der Lockerung für jeden Schritt der Animation. Zuvor waren fünf Grundtypen von Lockerungen verfügbar: Linear, Einschwingen, Ausschwingen, Einschwingen-Ausschwingen und Elastic-Fin. Jetzt können Sie das Easing manuell anpassen, genaue Werte für diese Funktion festlegen und die Vorteile von 24 neuen Arten von Easing nutzen.
Was ist Erleichterung?
Easing ist eine Änderung der Bewegungsgeschwindigkeit eines Elements innerhalb einer einzelnen Animation, die sich verlangsamt oder beschleunigt. Sie verleiht nicht-physischen Objekten physische Eigenschaften: Authentizität, Charakter und Dynamik.

Die lineare Bewegung wirkt am unnatürlichsten. Stellen Sie sich vor, dass sich die Geschwindigkeit des Elements während der gesamten Animation nicht ändert, als ob es keine Schwerkraft und Reibung gäbe. Eine solche Animation wirkt künstlich und einfach schlampig.

Beispiel für eine Animation ohne den Lockerungseffekt. Die Geschwindigkeit des Elements bleibt während der gesamten Bewegung konstant.

Ein Beispiel mit dem Lockerungseffekt am Anfang und Ende der Animation. Das Abschwächen am Anfang und am Ende ist symmetrisch.

Wenn es sich anbietet
Unterschiedliche Arten von Lockerungen und die Möglichkeit, diese mit Bezier-Kurven zu modifizieren, ermöglichen es Ihnen, mit der Animation je nach Szenario zu experimentieren und die beste Einstellung zu wählen. Dies ist besonders wichtig für Projekte, die komplexe, beeindruckende Animationen enthalten.
Ein Beispiel für eine Website. Für den Animationseffekt des Kreises wird der "Expo In Out"-Typ der Lockerung verwendet.
So richten Sie die Entspannung ein
  1. Wählen Sie ein Element aus und fügen Sie einen Animationsschritt für dieses Element hinzu.
  2. Stellen Sie Move (oder einen anderen Parameter) ein und gehen Sie zu Easing → Edit.
  3. Hier können Sie den Staffelungstyp aus der Liste auswählen, die Staffelung mit Bezier-Kurven ändern oder die genauen Werte dafür festlegen. Unten können Sie das Animationsmuster für diesen Schritt ausführen, indem Sie auf das Abspielsymbol klicken.

Die Abschwächung wird für jeden Animationsschritt separat angepasst.
Einrichten des Easing-Parameters im Nullblock-Editor von Tilda
Wo Sie den Easing-Editor finden: Schritt-für-Schritt-Animation → Easing → Bearbeiten.
Siehe auch
Der neue Block verwandelt jeden Zero Block in ein Pop-up

 Sie können jetzt Vektorelemente im Zero-Block-Editor von Tilda Website Builder erstellen und bearbeiten.

Hergestellt am
Tilda