Plans qui incluent cette fonctionnalité : Tous les plans

Rendez votre contenu accrocheur en donnant vie à vos ressources grâce à des animations. Le mouvement attire l'attention, c'est inévitable. Chez Genially, vous pouvez enrichir votre contenu avec des effets de mouvement spectaculaires qui susciteront l'intérêt de votre public, et transformer vos créations en contenu animé en quelques clics. En voilà un effet WOW !


Cet article couvre les aspects suivants :

  • Quels types d'animations existent
  • Comment appliquer des animations à un élément
  • Les aspects d'une animation que vous pouvez personnaliser
  • Comment copier et coller une animation d'un élément à l'autre
  • Comment savoir si des effets d'animation ont été appliqués à un élément
  • Comment supprimer une ou toutes les animations d'un élément


Quels types d’animations existent

Pour voir les types d'animations disponibles, sélectionnez un élément en cliquant dessus, puis sur l'icône ‘Animation’ qui apparaît au-dessus. Un onglet s'ouvre sur la droite avec toutes les options d'animation.


Les types d'animation disponibles sont les suivants :

  • Animation d'entrée : L'effet d'animation sera montré lorsque l'élément animé entrera dans l'écran.
  • Animation de sortie : L'animation sera affichée juste avant que l'élément ne disparaisse de la zone d’édition. Ce type d'animation peut être utilisé pour retirer des ressources lorsque vous souhaitez que votre public ne les voie que pendant un temps limité.
  • Animation continue : Elle est affichée en permanence tant que l'élément est à l'écran, et ne s'arrête que lorsque vous passez à une autre page. Elle est souvent utilisé pour montrer quels éléments de votre générique ont une interactivité.
  • Animation au passage de la souris : Activée uniquement lorsque vous passez la souris sur l'élément. Elle permet de masquer et d'afficher des éléments. Vous pouvez faire en sorte qu'un élément ne soit visible que par votre public pendant qu'il interagit avec lui.


Comment appliquer des animations à un élément

Pour animer un élément :


1. Sélectionnez l'élément auquel vous souhaitez donner vie avec de l’animation.

 

2. Cliquez sur l'icône ‘Animation’ qui apparaît juste au-dessus de l'élément.

 

3. Choisissez le type d'animation : entrée, sortie, continu ou passage de la souris. N’oubliez pas que les 4 types d'animation peuvent être appliqués à la fois au même élément.

 

4. Personnalisez votre animation : il existe également différentes options pour faire passer vos animations au niveau supérieur. Nous vous en apprendrons davantage à ce sujet dans la section suivante.

 

NOTE : Les animations peuvent également être appliquées sur une multi-sélection ou un regroupement d'éléments.



Les aspects d’une animation que vous pouvez personnaliser

Les aspects personnalisables d'une animation sont les suivants :

  • La direction : Pour définir dans quelle direction l'élément va se déplacer. Il peut rester en position ou se déplacer tant horizontalement que verticalement.
  • L'effet : Vous pouvez choisir parmi de nombreux styles d'animation. Les effets disponibles varient en fonction de la direction que vous choisissez. Passez la souris sur chaque option pour prévisualiser l'animation sur le tableau de bord, ce qui facilite grandement le choix !
  • Le début : À modifier si vous voulez marquer le moment où l'animation est déclenchée, en commençant à compter lorsque l'élément entre dans l'écran. Pouvoir éditer le début de l'effet amène à des options très utiles. Par exemple, l'ordre d'entrée des éléments d'un genially. 
  • La vitesse : Vous pouvez définir si vous voulez que l'animation se reproduise plus vite ou plus lentement. La vitesse minimale est de 4 secondes et la vitesse maximale de 0,5 seconde.

 

TIP : Pour obtenir le meilleur résultat, choisissez toujours la direction de l'animation avant l'effet, car chaque type de direction a des effets différents disponibles.



Comment copier et coller l’animation d’un élément à un autre

Si vous voulez que plusieurs éléments aient les mêmes effets d'animation, vous n'avez pas besoin de les éditer un par un. Il vous suffit de quelques clics pour copier et coller les animations d'un élément à l'autre. Les étapes à suivre sont les suivantes :

 

1. Sélectionnez l'élément qui possède les animations que vous souhaitez reproduire et cliquez sur l'icône d'animation.


2. Dans le menu d'animation, cliquez sur l'icône ‘Copier’ qui apparaît en haut.


3. Sélectionnez l'élément auquel vous voulez appliquer les animations.


4. Dans le menu d'animation, cliquez sur l'icône 'Coller' qui apparaît en haut.




Comment savoir si des effets d’animation ont été appliqués à un élément

Cliquez sur l'élément et regardez l'icône d'animation. S'il est gris, aucune animation n'est appliquée. Mais si l'icône est bleue, l'élément contient des animations appliquées.

 

Cliquez pour afficher le menu des animations et voir quels types d'animations lui ont été appliqués.  Vous pouvez facilement les identifier : lorsque l'animation est active, un point jaune apparaît à côté du type d'animation. 


Comment éliminer une ou toutes les animations d’un élément

Pour éliminer une animation, cliquez sur le type d'animation que vous souhaitez supprimer, puis sélectionnez l'option ‘Aucun’ dans la catégorie  ‘Effet’.




Pour éliminer toutes les animations en une seule fois, cliquez sur l'icône ‘Corbeille’ en haut du menu des animations.