Diese beiden Begriffe beantworten unterschiedliche Fragen. Smart Animate antwortet: „Was ändert sich?“ Es betrachtet zwei Frames, findet Ebenen mit übereinstimmenden Namen und animiert deren Position, Größe, Drehung, Deckkraft und andere Eigenschaften von einem Frame zum anderen.
Vereinfachende Antworten: „Wie verändert es sich im Laufe der Zeit?“ Mit Figma können Sie eine Standardkurve wie eine Ease-out-Kurve, eine benutzerdefinierte Kubik-Bezier-Kurve oder eine Feder auswählen. Die Federnachgiebigkeit wird durch physikalische Einstellungen, Steifigkeit, Dämpfung und Masse und nicht durch eine feste Dauer definiert, sodass die Bewegung schneller und ruhiger wird, so wie es bei echten Objekten der Fall ist.
Der wahre Unterschied zeigt sich im Code. In einem Produkt kann eine Feder von der aktuellen Position und Geschwindigkeit eines Elements ausgehen. Wenn ein Benutzer einen Übergang unterbricht oder ein Blatt schnipst, wird die Bewegung natürlich fortgesetzt, anstatt zu springen. Ein prototypischer Übergang spielt sich jedes Mal auf die gleiche Weise ab, was gut ist, um die Absicht zu zeigen, aber nicht zeigt, wie sich die Bewegung unter realen Eingaben verhält.
Ein Figma-Prototyp ist also eine gute Referenz, aber Entwickler bauen die Bewegung trotzdem im Code nach. Um die Werte konsistent zu halten, speichern viele Teams die Federeinstellungen als Bewegungstoken. Unser kostenloser Figma Animation to Spring Converter wandelt die Figma-Beschleunigung in Federeinstellungen um, die Sie im Code verwenden können.
Wenn Sie möchten, dass die interaktive Version das Ergebnis und nicht eine Referenz ist, ist ein Tool mit einer Laufzeit erforderlich. ExodeUI, das wir erstellen, speichert Zustände, Federn und Ereignisse in einer Datei, die in der App ausgeführt wird.