# Animer le long d’un tracé avec Hana et Spline - Hana | Tout ce qu’il faut savoir - Spline Academy (https://spline.design/fr/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline)

> Dans ce tutoriel, nous vous montrons comment utiliser l’une de nos récentes mises à jour de Hana pour animer facilement des formes ou des designs le long…

1. [Academy](https://spline.design/fr/academy)
2. [Cours](https://spline.design/fr/academy/collections)
3. [Hana | Tout ce qu’il faut savoir](https://spline.design/fr/academy/collections/hana-everything-you-need-to-know)
4. Animer le long d’un tracé avec Hana et Spline

# Animer le long d’un tracé avec Hana et Spline

Leçon 11 sur 15HanaDébutant7 min

Dans ce tutoriel, nous vous montrons comment utiliser l’une de nos récentes mises à jour de Hana pour animer facilement des formes ou des designs le long d’une trajectoire personnalisée.

Nous vous présentons différentes façons de dessiner un tracé dans Hana, d’aligner des formes sur ce tracé, de créer des animations, d’ajuster les décalages de position et de choisir entre une orientation globale et tangentielle.

Démos 👉 <https://app.spline.design/ui/6a36d303-a217-4466-95f5-85a1561c5725>

## Ce que vous allez apprendre

1. [0:00Intro](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=0s)
2. [0:16Créer un tracé avec l’outil Vector](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=16s)
3. [1:00Utiliser Align to Path](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=60s)
4. [2:07Créer des animations](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=127s)
5. [3:23Créer un tracé à partir d’une forme](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=203s)
6. [4:03Ajuster les décalages de position](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=243s)
7. [4:53Orientation globale ou tangentielle](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=293s)
8. [6:13Align to Path en 3D](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=373s)

## Ressources associées

- [Shapes Follow PathModèle](https://app.spline.design/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline?redirect-duplicate-template-uuid=86ecf61d-28ed-4c69-9f76-029bd8130eed&is-2d-file=true)
- [Algin to Path ModiferDocument](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana#%F0%9F%8E%A2-modifiers)

## Présentation

- Hana
- 7 min
- Débutant

## À suivre

[Concevoir et animer avec des masques vectoriels7 minDébutant](https://spline.design/fr/academy/collections/hana-everything-you-need-to-know/design-and-animate-with-vector-masks)[Continuer](https://spline.design/fr/academy/collections/hana-everything-you-need-to-know/design-and-animate-with-vector-masks)

[Spline](https://spline.design/fr)

L’éditeur 3D et 2D pour les équipes et leurs agents. Publiez sur le web, iOS et Android.

#### Interrogez l’IA sur Spline

#### Produits

- [Design 3D](https://spline.design/fr/3d-design)
- [Hana](https://spline.design/fr/hana)
- [Omma](https://omma.build)
- [Génération 3D par IA](https://spline.design/fr/ai-generate)
- [Spline MCP](https://spline.design/fr/mcp)
- [Spline Arena](https://spline.design/fr/arena)
- [Tarifs](https://spline.design/fr/pricing)
- [Enterprise](https://spline.design/fr/enterprise)

#### Runtimes

- [Web](https://spline.design/fr/web)
- [iOS](https://spline.design/fr/ios)
- [Android](https://spline.design/fr/android)

#### Apps

- [Télécharger](https://spline.design/fr/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Télécharger Spline Mirror](https://spline.design/download-mirror)

#### Apprendre

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/fr/academy)
- [API Spline](https://www.npmjs.com/package/@splinetool/runtime)
- [Solutions](https://spline.design/solutions)

#### Communauté

- [Communauté Spline](https://community.spline.design)
- [Blog](https://spline.design/fr/blog)
- [Nouveautés](https://spline.design/fr/changelog)
- [Éducation](https://spline.design/fr/education)
- [Contra](https://spline.design/contra)
- [Affiliation](https://spline.design/fr/affiliate)

#### Entreprise

- [Clients](https://spline.design/fr/customers)
- [Carrières](https://www.ycombinator.com/companies/spline/jobs)
- [Sécurité](https://spline.design/fr/security)

#### Mentions légales

- [Conditions générales](https://spline.design/terms)
- [Confidentialité](https://spline.design/privacy)

#### Contact

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.