Ces deux termes répondent à des questions différentes. Smart Animate répond « Quels changements ? » Il examine deux images, trouve des calques dont les noms correspondent et anime leur position, leur taille, leur rotation, leur opacité et d'autres propriétés d'une image à l'autre.
Réponses assouplissantes : « Comment cela évolue-t-il avec le temps ? » Figma vous permet de choisir une courbe standard telle qu'une sortie facile, une courbe de Bézier cubique personnalisée ou un ressort. L'assouplissement du ressort est défini par les paramètres physiques, la rigidité, l'amortissement et la masse, plutôt que par une durée fixe, de sorte que le mouvement s'accélère et se stabilise comme le font les objets réels.
La vraie différence apparaît dans le code. Dans un produit, un ressort peut démarrer à partir de la position et de la vitesse actuelles d'un élément. Si un utilisateur interrompt une transition ou feuillette une feuille, le mouvement continue naturellement au lieu de sauter. Une transition prototype se joue de la même manière à chaque fois, ce qui est bien pour montrer l'intention mais ne montre pas comment le mouvement se comporte sous une entrée réelle.
Un prototype Figma est donc une bonne référence, mais les développeurs reconstruisent toujours le mouvement dans le code. Pour que les valeurs restent cohérentes, de nombreuses équipes enregistrent les paramètres du ressort sous forme de jetons de mouvement. Notre convertisseur gratuit d'animation Figma vers Spring transforme l'assouplissement Figma en paramètres Spring que vous pouvez utiliser dans le code.
Si vous souhaitez que la version interactive soit le livrable plutôt qu'une référence, un outil avec un runtime est nécessaire. ExodeUI, que nous créons, stocke les états, les ressorts et les événements dans un seul fichier qui s'exécute dans l'application.