# Mit Hana und Spline entlang eines Pfads animieren - Spline Academy (https://spline.design/de/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline)

> In diesem Tutorial zeigen wir dir eines unserer neuesten Updates in Hana und wie du Formen oder Designs ganz einfach entlang einer eigenen Bahn animierst.

1. [Academy](https://spline.design/de/academy)
2. [Tutorials](https://spline.design/de/academy/tutorials)
3. Mit Hana und Spline entlang eines Pfads animieren

# Mit Hana und Spline entlang eines Pfads animieren

HanaEinsteiger7 Min.

In diesem Tutorial zeigen wir dir eines unserer neuesten Updates in Hana und wie du Formen oder Designs ganz einfach entlang einer eigenen Bahn animierst.

Wir zeigen dir verschiedene Wege, in Hana einen Pfad zu gestalten, Formen an diesem Pfad auszurichten, Animationen zu erstellen, Positionsversätze anzupassen und zwischen World- und Tangential-Ausrichtung zu wählen.

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

## Das lernst du

1. [0:00Intro](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=0s)
2. [0:16Einen Pfad mit dem Vector Tool erstellen](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=16s)
3. [1:00Align to Path verwenden](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=60s)
4. [2:07Animationen erstellen](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=127s)
5. [3:23Einen Pfad aus einer Form erstellen](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=203s)
6. [4:03Positionsversätze anpassen](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=243s)
7. [4:53World- vs. Tangential-Ausrichtung](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=293s)
8. [6:13Align to Path in 3D](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=373s)

## Weitere Ressourcen

- [Shapes Follow PathVorlage](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 ModiferDokument](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana#%F0%9F%8E%A2-modifiers)

## Überblick

- Hana
- 7 Min.
- Einsteiger

## Teil von

- [Hana | Alles, was du wissen musst](https://spline.design/de/academy/collections/hana-everything-you-need-to-know/how-to-animate-along-a-path-with-hana-and-spline)

## Ähnliche Tutorials

[Alle Tutorials](https://spline.design/de/academy/tutorials)

[Eine 2D-Follow-Interaktion erstellenHanaEinsteiger8 Min.](https://spline.design/de/academy/tutorials/create-a-2d-follow-interaction)[Erste Schritte mit interaktivem 2D in HanaHanaEinsteiger17 Min.](https://spline.design/de/academy/tutorials/get-started-with-interactive-2d-in-hana)[Interaktive Designs, die auf deine Maus reagieren, mit Hana erstellenHanaEinsteiger6 Min.](https://spline.design/de/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)

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

Der 3D- und 2D-Editor für Teams und ihre Agenten. Veröffentliche im Web, auf iOS und Android.

#### Frag die KI zu Spline

#### Produkte

- [3D-Design](https://spline.design/de/3d-design)
- [Hana](https://spline.design/de/hana)
- [Omma](https://omma.build)
- [KI-3D-Generierung](https://spline.design/de/ai-generate)
- [Spline MCP](https://spline.design/de/mcp)
- [Spline Arena](https://spline.design/de/arena)
- [Preise](https://spline.design/de/pricing)
- [Enterprise](https://spline.design/de/enterprise)

#### Runtimes

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

#### Apps

- [Download](https://spline.design/de/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Spline Mirror herunterladen](https://spline.design/download-mirror)

#### Lernen

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

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/de/blog)
- [Changelog](https://spline.design/de/changelog)
- [Bildung](https://spline.design/de/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/de/affiliate)

#### Unternehmen

- [Kunden](https://spline.design/de/customers)
- [Karriere](https://www.ycombinator.com/companies/spline/jobs)
- [Sicherheit](https://spline.design/de/security)

#### Rechtliches

- [AGB](https://spline.design/terms)
- [Datenschutz](https://spline.design/privacy)

#### Kontakt

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

© 2026 - Spline, Inc.