# Maak met Hana interactieve designs die op je muis reageren - Spline Academy (https://spline.design/nl/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)

> In deze video geven we je een introductie en laten we met verschillende voorbeelden zien hoe je designs met Hana omzet in interactieve ervaringen die op je…

1. [Academy](https://spline.design/nl/academy)
2. [Tutorials](https://spline.design/nl/academy/tutorials)
3. Maak met Hana interactieve designs die op je muis reageren

# Maak met Hana interactieve designs die op je muis reageren

HanaBeginner6 min

In deze video geven we je een introductie en laten we met verschillende voorbeelden zien hoe je designs met Hana omzet in interactieve ervaringen die op je cursor reageren. We bekijken events als Mouse Down, Mouse Up, Mouse Press, Mouse Hover, Look At en Follow, en hoe je ze gebruikt om animaties en effecten te triggeren.

## Wat je leert

1. [0:00Intro](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=0s)
2. [0:15Dingen laten klikken – Mouse Down-event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=15s)
3. [2:32De klik loslaten – Mouse Up-event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=152s)
4. [2:46Ingedrukt houden – Mouse Press-event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=166s)
5. [2:56Hovermagie – Mouse Hover-event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=176s)
6. [3:26Laat je design naar de cursor kijken – Look At-event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=206s)
7. [4:51Laat je design de cursor volgen – Follow-event](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=291s)
8. [5:57Een voorproefje van de volgende tutorial](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=357s)

## Gerelateerde bronnen

- [Interactive Flat IconsTemplate](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 HanaDocument](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Interactivity in HanaDocument](https://docs.spline.design/hana-a-canvas-for-interactivity/interactivity-in-hana)

## Overzicht

- Hana
- 6 min
- Beginner

## Onderdeel van

- [Hana | Alles wat je moet weten](https://spline.design/nl/academy/collections/hana-everything-you-need-to-know/create-interactive-designs-that-react-to-your-mouse-with-hana)

## Gerelateerde tutorials

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

[Interactieve effecten ontwerpen met progressive blur en zachte gradiëntenHanaBeginner9 min](https://spline.design/nl/academy/tutorials/design-interactive-effects-with-progressive-blur-and-smoothing-gradients)[Voeg muisinteracties toe aan 3D-objectenSpline 3DBeginner14 min](https://spline.design/nl/academy/tutorials/add-mouse-based-interactions-to-3d-objects)[3D-datavisualisaties maken in Spline met variabelen en realtime API’sSpline 3DGevorderd15 min](https://spline.design/nl/academy/tutorials/how-to-create-3d-data-visualizations-in-spline-using-variables-and-real-time-apis)

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

De 3D- en 2D-editor voor teams en hun agents. Publiceer op het web, iOS en Android.

#### Vraag AI naar Spline

#### Producten

- [3D-design](https://spline.design/nl/3d-design)
- [Hana](https://spline.design/nl/hana)
- [Omma](https://omma.build)
- [3D genereren met AI](https://spline.design/nl/ai-generate)
- [Spline MCP](https://spline.design/nl/mcp)
- [Spline Arena](https://spline.design/nl/arena)
- [Prijzen](https://spline.design/nl/pricing)
- [Enterprise](https://spline.design/nl/enterprise)

#### Runtimes

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

#### Apps

- [Downloaden](https://spline.design/nl/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Spline Mirror downloaden](https://spline.design/download-mirror)

#### Leren

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

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/nl/blog)
- [Changelog](https://spline.design/nl/changelog)
- [Onderwijs](https://spline.design/nl/education)
- [Contra](https://spline.design/contra)
- [Affiliates](https://spline.design/nl/affiliate)

#### Bedrijf

- [Klanten](https://spline.design/nl/customers)
- [Vacatures](https://www.ycombinator.com/companies/spline/jobs)
- [Beveiliging](https://spline.design/nl/security)

#### Juridisch

- [Algemene voorwaarden](https://spline.design/terms)
- [Privacy](https://spline.design/privacy)

#### Contact

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

© 2026 - Spline, Inc.