Illustration

🎞️ Présentation des animations

Le système d'animation permet de poser, modifier et visualiser des tiles animées directement dans l'éditeur. Celles-ci fonctionnent sur une timeline indépendante par animation et sont intégrées dans le niveau via le même système de layers.

Animation Editor
Info : Lorsqu'un niveau est créé, une animation nommée animation_1 est automatiquement générée. Vous pouvez la renommer, la modifier ou la supprimer après avoir créé une autre animation.

🧰 Animation Editor

Pour créer une animation, allez dans Animation > New. Renseignez un nom unique, une durée (en secondes) et une vitesse (facteur de lecture).

Une fois créée, la timeline s'affiche en bas, et l'éditeur d'animation en haut à droite. Vous pouvez aussi ouvrir l'éditeur d'animation depuis Animation > Editor.
Il vous permet de :

  • Renommer l'animation
  • Modifier sa durée
  • Changer sa vitesse (par défaut 1s sur la timeline = 1s réel)
  • Changer l'animation courante via un menu déroulant
  • Supprimer une animation
  • Afficher les keyframes sur la carte en temps réel (affichage en cyan)
Astuce : Lors de la modification de la vitesse d'une animation elle s'effectue en temps réel.
Sélecteur d'animation
Attention : Chaque animation doit avoir un nom unique.

⏱️ Timeline

La timeline permet de poser des keyframes dans le temps. Chaque frame peut contenir plusieurs modifications visuelles (pose ou suppression de tiles).

Timeline
  • Clic gauche : déplacer le curseur
  • Clic gauche glissé : déplacer le curseur
  • Clic droit sur une keyframe : la sélectionner
  • Clic droit glissé : sélectionner plusieurs keyframes
  • Suppr : supprimer les keyframes sélectionnées
  • Shift + Drag gauche : déplacer les keyframes sélectionnées
  • Molette : zoom dans la timeline
  • Espace : jouer ou mettre en pause l'animation
  • + et - : déplacer le curseur image par image
Info : Les modifications de keyframes sont entièrement compatibles avec les raccourcis Ctrl + Z (annuler) et Ctrl + Y (restaurer).
Keyframes

Les boutons de la barre de timeline permettent de :

  • ▶️ Play
  • ⏸️ Pause
  • 🔁 Loop / Unloop
  • Hide la timeline
  • 🔵 Record : active l'enregistrement des poses
Information : En mode record (🔵 activé), les poses de tiles créent automatiquement des keyframes dans l'animation courante. Les poses sont bleues, les suppressions cyan.
animation
Attention : Si plusieurs keyframes sont posées au même moment, elles s'empilent verticalement. Si leur nombre dépasse 5, un compteur comme +9 s'affiche.

💡 Affichage et Overlay

Dans l'éditeur, les tiles animées sont dessinées sur le même layer que les tiles classiques. Elles sont simplement affichées par-dessus les tiles statiques présentes à la même position. Cela signifie que :

  • Si une tile statique est déjà placée sur un layer, et qu'une tile animée est ajoutée au même endroit sur le même layer, la tile animée sera visible à la place de la statique.
  • Inversement, si vous ajoutez une tile statique par-dessus une tile animée déjà présente, elle risque de ne pas être visible, car masquée par l'animation lors de sa lecture.

Pour vous éviter ce genre de conflit, l'éditeur affiche un aperçu jaune dans les zones où une animation est déjà présente sur le layer courant. Cela vous alerte que vous êtes sur le point de poser une tuile là où une animation s'exécute déjà.

Conseil : Ce système de surbrillance peut être désactivé si vous le souhaitez. Rendez-vous dans Settings > Advanced > Keyframe Overlay pour couper l'aperçu jaune.
keyframes
Information : Le bouton Animation > Sync permet de réinitialiser toutes les animations en cours à 0s pour une synchronisation parfaite.

🎮 Intégration en mode Play

Lors du passage en mode Play, les animations se comportent comme dans l'éditeur : une animation en pause le restera, une animation en loop continuera à jouer.

🔌 Contrôle via l'éditeur nodal

Voici les nodes disponibles pour contrôler les animations :

  • Play Animation — Démarre l'animation à 0s
  • Set Animation Time — Modifie manuellement la position temporelle
  • Stop Animation, Pause Animation
  • Loop / Unloop Animation
  • Set Animation Speed, Get Animation Speed
Important : si vous utilisez Set Animation Time, assurez-vous d'avoir d'abord lancé l'animation avec Play Animation, sinon la position temporelle sera réinitialisée à 0.

Envie d'en savoir plus ?

Consultez les pages suivantes pour explorer les fonctionnalités clés de l'éditeur :

  • 🔧 Interface — Comprendre les outils de dessin, la gestion des layers et le fonctionnement du viewport.
  • 🎮 Mode Play — Tester votre niveau avec un personnage jouable et déclencher des événements de gameplay.
  • 🧠 Éditeur Nodal — Prototyper des logiques interactives avec un système de nœuds visuels.
Éditeur Nodal