Éditeur Studio : À propos des animations

Temps de lecture : 2 min
L'intégration de nos animations dans vos designs peut vraiment les faire passer au niveau supérieur. L'éditeur de Studio propose 5 types d'animation différents, en fonction du moment où vous souhaitez qu'elles apparaissent.
Faites apparaître des animations lorsque les visiteurs survolent, cliquent ou font défiler un élément. Vous pouvez également ajouter une animation d'entrée, lors du premier chargement de l'élément, ou une animation qui se répète en boucle, le tout sans une seule ligne de code.

Animation d'entrée

Ajouter une animation d'entrée à un élément est un excellent moyen d'attirer l'attention des visiteurs sur lui. L'animation apparaît lorsque l'élément apparaît pour la première fois, de sorte qu'il attire instantanément le regard. Il existe de nombreux types parmi lesquels choisir et personnaliser selon les besoins exacts de vos clients.
Un exemple d'animation d'entrée appliquée à une page entière, la révélant lors de son chargement

Interactions de survol et de clique

Ajoutez des effets sympas qui apparaissent lorsque les visiteurs survolent ou cliquent sur un élément. Vous pouvez transformer des éléments, les déplacer ou révéler du nouveau contenu lors du survol/clic.
Choisissez parmi une gamme d'effets prédéfinis, ou créez un effet personnalisé avec vos spécifications exactes. Gérez le calendrier, l'ordre et la facilité pour lier le tout, puis prévisualisez le résultat final directement à partir de l'éditeur.
Vous pouvez également créer des interactions entre les éléments, donc survoler ou cliquer sur un élément en anime un autre.
Dans l'exemple ci-dessous, le survol du paragraphe déclenche le déplacement du bouton et de l'image.
GIF montrant à quoi ressemblent les interactions sur un site en ligne.

Animation de défilement

Augmenter l'engagement et créez des effets intéressants avec des animations basées sur le défilement. La progression de l'animation est directement liée à la position de défilement, en avant et en arrière lorsque les visiteurs font défiler vers le haut et le bas. 
Vous pouvez également créer des interactions entre les éléments, de sorte que faire défiler un élément en anime un autre.
Dans l'exemple ci-dessous, faire défiler le titre fait s'agrandir le répéteur. 
Un exemple d'animation de défilement sur un site en ligne

Animation en boucle

Créez une impression de mouvement dans votre design avec des animations en boucle continue. Vous pouvez ajouter une animation en boucle à n'importe quel élément que les visiteurs remarquent. Certains sont plus subtils et d'autres attirent l'attention. 
Un exemple d'élément de masque de texte avec une animation en boucle sur un site en ligne

Cela vous a-t-il aidé ?

|