Renforcez votre contenu avec des animations d'entrée basées sur l'IA, que vous n'avez pas à coder vous-même. Discutez avec AI Assistant dans Storyline 360, décrivez l'effet souhaité dans un langage conversationnel et regardez AI Assistant écrire le code et créer le déclencheur JavaScript. Poursuivez votre lecture pour savoir comment faire.

• Commencez
• Appliquer des animations d'entrée à un ou plusieurs objets
• Itérer et créer des animations en plusieurs étapes
• Comprendre la compatibilité

Commencez

Suivez ces étapes pour créer des animations d'entrée JavaScript attrayantes en discutant avec AI Assistant.

1. Rédigez vos instructions. Cliquez sur l'onglet AI Assistant sur la droite, puis entrez vos instructions dans la boîte de discussion en bas. Les instructions peuvent être aussi simples que « Suggérer une animation pour cette diapositive ». Si vous avez déjà sélectionné un objet, vous pouvez dire quelque chose comme « Faites apparaître cet objet lentement ».
2. Générez le déclencheur. L'Assistant AI répond avec un plan pour une animation appropriée, comme le montre l'image ci-dessous.

2. • Si vous préférez, vous pouvez ignorer le schéma en demandant à AI Assistant de créer le déclencheur immédiatement.
   • Une fois que vous avez approuvé le plan, AI Assistant convertit vos instructions en code JavaScript et crée le déclencheur.
3. Vérifiez et modifiez le code (facultatif). AI Assistant affiche l'extrait de code dans la fenêtre de discussion, mais il est masqué par défaut. Cliquez sur le chevron dans le titre de réponse pour afficher le code, comme indiqué dans l'image ci-dessous.

• • Pour copier le code, cliquez sur l'icône Copier JavaScript (feuilles de papier) située en dessous, sur la droite.
  • Si vous souhaitez modifier manuellement le code ou ajuster les paramètres du déclencheur, cliquez sur l'icône Ouvrir le déclencheur (éclair). Cela ouvre la boîte de dialogue Trigger Wizard, dans laquelle vous pouvez mettre à jour le nom, modifier le code, ajuster le timing et ajouter des conditions.
  • Par défaut, le déclencheur généré par l'IA est lié à l'événement « Timeline starts ». Entrez une invite de suivi si vous souhaitez la modifier. Découvrez comment modifier les déclencheurs d'animation JavaScript à l'aide de l'IA dans ce guide de l'utilisateur.

4. Prévisualisez l'animation. Cliquez sur le bouton Aperçu pour passer Storyline en mode aperçu et voir l'animation jouer.
5. Affinez le résultat. Pendant la prévisualisation, vous pouvez continuer à discuter avec AI Assistant pour effectuer d'autres ajustements. Par exemple, vous pouvez dire des choses comme « Ralentissez l'animation deux fois » ou « Bouclez l'animation à l'infini ». Annulez les actions en demandant simplement dans le chat. Les extraits de code précédents comportent également un bouton Restore Trigger permettant d'annuler ou de comparer différentes versions.
6. Faites-nous part de vos commentaires (facultatif). Si le contenu généré vous est utile, cliquez sur l'icône représentant le pouce levé en bas à gauche, juste en dessous du bouton Aperçu. Si ce n'est pas le cas, cliquez sur l'icône représentant un pouce vers le bas et partagez votre opinion. Vos retours seront transmis directement à nos équipes de produits et d'ingénierie.

Remarque : L'Assistant AI ne se souvient pas encore des conversations passées. La fermeture et la réouverture d'un projet réinitialisent le chat.

Effets d'animation pris en charge

AI Assistant peut générer de nombreux effets d'animation d'entrée populaires, notamment :

• Estomper
• Entrer par avion
• Flottez
• Rotation
• Et bien plus encore...

Remarque : AI Assistant peut également inventer de nouvelles animations d'entrée. Essayez d'expérimenter pour voir ce qui fonctionne. Par exemple, demandez à AI Assistant de « faire bouger les boutons et de les faire disparaître ».

Effets d'animation non pris en charge

Bien que de simples animations de masquage soient possibles, les animations qui correspondent exactement aux animations de masquage existantes de Storyline, ou les animations de masque très complexes, ne fonctionneront probablement pas. Cela inclut, sans toutefois s'y limiter :

• Split
• Essuyer
• Forme
• Barres aléatoires

Conseils de pro :

• Besoin d'inspiration créative ? Demandez des idées à AI Assistant. Par exemple, « Suggérer des animations pour cette diapositive ».
• L'AI Assistant reconnaît les sélections de diapositives, il n'est donc pas toujours nécessaire de nommer les objets dans les instructions.
• Vous pouvez appliquer des animations d'entrée JavaScript aux objets des calques de diapositives, et pas uniquement aux objets de la diapositive de base.
• Demandez à AI Assistant d'écrire des commentaires détaillés sur le code afin de clarifier le rôle de chaque partie lors de l'inspection du code JavaScript généré.
• Soyez prudent lorsque vous combinez des transitions de diapositives et des animations JavaScript, car certaines peuvent entrer en conflit et entraîner des résultats inattendus, en particulier avec certains types de mouvement.

Appliquer des animations d'entrée à un ou plusieurs objets

Lorsque vous travaillez avec un ou plusieurs objets sur une diapositive, AI Assistant offre une certaine flexibilité dans l'application des animations d'entrée.

Animer des objets individuels

Spécifiez l'animation qui doit s'appliquer à chaque objet individuel. Vous trouverez ci-dessous un exemple d'application d'une animation différente à chaque objet.

Invite : déplacez le carré de gauche à droite, le cercle de haut en bas, la croix de droite à gauche et le triangle de bas en haut

Animation de plusieurs objets

Animez tous les objets en utilisant le même effet d'animation à l'aide d'une seule invite. L'exemple ci-dessous montre la même animation appliquée à tous les objets.

Invite : Faites apparaître les objets lentement

Conseil de pro : AI Assistant crée un déclencheur unique quel que soit le nombre d'animations et d'objets. Si vous avez besoin d'un déclencheur distinct pour chaque objet, spécifiez-le dans le chat.

Itérer et créer des animations en plusieurs étapes

Discuter avec AI Assistant pour créer des animations facilite l'itération. Il vous permet également de combiner des effets dans des animations en plusieurs étapes, renforçant ainsi l'interactivité du contenu. Voici comment procéder :

1. Commencez par demander à AI Assistant de créer une animation initiale.
2. Cliquez sur le bouton Aperçu pour passer en mode aperçu. La boîte de discussion AI reste ouverte pendant la prévisualisation. Cliquez sur le bouton AI Assistant en haut à droite pour le masquer ou le rouvrir.
3. Pendant la prévisualisation, vous pouvez fournir des instructions supplémentaires pour ajouter de nouveaux effets aux animations existantes. Vous pouvez ajouter autant d'étapes que vous le souhaitez, et AI Assistant réécrit le code tout en conservant le même déclencheur.
4. Chaque mise à jour actualise automatiquement l'aperçu, ce qui vous permet de voir les modifications instantanément.
5. Vous n'êtes pas satisfait des résultats ? N'oubliez pas que vous pouvez facilement annuler des actions en demandant à AI Assistant dans le chat ou en utilisant le bouton Restore Trigger dans les extraits de code précédents pour revenir à une étape spécifique ou comparer les versions.

Consultez notre article sur les trucs et astuces pour obtenir d'autres idées et exemples rapides.

Vous souhaitez créer des interactions plus avancées ? Lisez ce guide de l'utilisateur pour en savoir plus.

Comprendre la compatibilité

Les animations d'entrée en JavaScript AI sont exclusives à Storyline 360 à compter du 2 décembre 2025. Les projets dotés de déclencheurs d'animation JavaScript créés dans AI Chat ne s'ouvriront pas dans les versions antérieures de Storyline 360. Pour rétablir la compatibilité, supprimez le nom du déclencheur dans le déclencheur JavaScript généré, puis enregistrez votre fichier.