# Interaktive Designs, die auf deine Maus reagieren, mit Hana erstellen - Hana | Alles, was du wissen musst - Spline Academy (https://spline.design/de/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)

> In diesem Video geben wir dir eine Einführung und zeigen verschiedene Beispiele, wie du mit Hana Designs in interaktive Erlebnisse verwandelst, die auf…

1. [Academy](https://spline.design/de/academy)
2. [Kurse](https://spline.design/de/academy/collections)
3. [Hana | Alles, was du wissen musst](https://spline.design/de/academy/collections/hana-everything-you-need-to-know)
4. Interaktive Designs, die auf deine Maus reagieren, mit Hana erstellen

# Interaktive Designs, die auf deine Maus reagieren, mit Hana erstellen

Lektion 5 von 15HanaEinsteiger6 Min.

In diesem Video geben wir dir eine Einführung und zeigen verschiedene Beispiele, wie du mit Hana Designs in interaktive Erlebnisse verwandelst, die auf deinen Cursor reagieren. Wir erkunden Events wie Mouse Down, Mouse Up, Mouse Press, Mouse Hover, Look At und Follow und zeigen, wie du damit Animationen und Effekte auslöst.

## Das lernst du

1. [0:00Intro](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=0s)
2. [0:15Klicks auslösen – Mouse-Down-Event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=15s)
3. [2:32Den Klick loslassen – Mouse-Up-Event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=152s)
4. [2:46Gedrückt halten – Mouse-Press-Event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=166s)
5. [2:56Hover-Magie – Mouse-Hover-Event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=176s)
6. [3:26Dein Design zum Cursor ausrichten – Look-At-Event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=206s)
7. [4:51Dein Design dem Cursor folgen lassen – Follow-Event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=291s)
8. [5:57Vorschau auf das nächste Tutorial](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=357s)

## Weitere Ressourcen

- [Interactive Flat IconsVorlage](https://app.spline.design/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana?redirect-duplicate-template-uuid=2a05e307-90dd-4666-bc8b-f2b7f3c2cce8&is-2d-file=true)
- [Designing in HanaDokument](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Interactivity in HanaDokument](https://docs.spline.design/hana-a-canvas-for-interactivity/interactivity-in-hana)

## Überblick

- Hana
- 6 Min.
- Einsteiger

## Als Nächstes

[Eine 2D-Follow-Interaktion erstellen8 Min.Einsteiger](https://spline.design/de/academy/collections/hana-everything-you-need-to-know/create-a-2d-follow-interaction)[Weiter](https://spline.design/de/academy/collections/hana-everything-you-need-to-know/create-a-2d-follow-interaction)

[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.