Régler une transition commune aux effets
Sans transition, un effet au survol peut passer brusquement d’une valeur à l’autre. La transition de l’animation adoucit ce passage. Elle se règle dans les effets de l’animation, séparément du groupe de transitions de style de l’élément.
Les gestes présentés utilisent le mode Expert, sans code.
Avant de tester le mouvement : dans le menu Écran, utilisez un seul cadre et activez Activer les animations. Cette option concerne le rendu dans l’éditeur. En affichage de plusieurs écrans côte à côte, les animations sont désactivées.
1. Ouvrir une animation interactive
Sélectionnez l’élément, puis ajoutez un préréglage de survol, par exemple Lift. Ce mouvement combine un déplacement vertical et une légère variation d’échelle.
Ouvrez la ligne de l’animation. Vérifiez que Hover est actif. Les mêmes réglages de transition sont proposés pour le déclencheur Click, qui correspond à la pression maintenue.
2. Activer la transition
Lecture impossible. Réessayez avec les commandes vidéo.
Sélectionnez un effet, puis activez Transition dans ses réglages. Une durée et une courbe d’évolution apparaissent.
Réglez la durée à 500 ms pour un premier essai. Cela correspond à une demi-seconde. Une durée plus courte donne une réponse plus vive ; une durée trop longue peut donner l’impression que l’interface réagit avec retard.
La courbe modifie la manière dont la vitesse évolue. Testez le résultat avec Lecture, puis avec une véritable entrée et sortie de la souris.
3. Appliquer aux autres effets
Si l’animation contient plusieurs effets, activez Appliquer à tous les effets. La durée et la courbe sélectionnées sont propagées aux effets de cette animation.
Ce réglage n’agit pas sur les autres animations de la page. Il ne rend pas toutes les propriétés identiques : un déplacement et une échelle gardent chacun leurs valeurs de début et de fin.
4. Contrôler le second effet
Ouvrez l’onglet Scale dans l’exemple Lift. Vérifiez que la durée est bien passée à 500 ms, comme sur le déplacement vertical.
L’option d’application commune sert à propager les paramètres pendant l’édition. Vérifiez les onglets lorsque vous reprenez l’animation plus tard : ne supposez pas qu’un réglage indépendant sera toujours synchronisé.
5. Tester l’interaction réelle
Fermez la fenêtre de réglage, survolez l’élément, puis sortez la souris. Le mouvement doit rester discret et revenir de manière claire à son état normal.
Pour une pression, utilisez l’aperçu visiteur afin de ne pas confondre le clic d’édition avec l’action du visiteur. Vérifiez aussi le tactile : une information essentielle ne doit pas dépendre exclusivement du survol.
Enregistrez lorsque le résultat vous convient.
Si le mouvement reste brusque
Vérifiez que la transition est activée sur les effets concernés et que la durée n’est pas trop courte. Assurez-vous de modifier la transition de cette animation, pas seulement celle du groupe général de styles.