# Interaktive 3D-Boxen animieren - Spline Academy (https://spline.design/de/academy/tutorials/animate-interactive-3d-boxes)

> Hallo! In diesem Tutorial lernen wir mit viel Spaß, wie du eine Interaktion zauberst, bei der mehrere Würfel verspielt ihre Position verändern und ihre…

1. [Academy](https://spline.design/de/academy)
2. [Tutorials](https://spline.design/de/academy/tutorials)
3. Interaktive 3D-Boxen animieren

# Interaktive 3D-Boxen animieren

Spline 3DFortgeschritten4 Min.

Hallo! In diesem Tutorial lernen wir mit viel Spaß, wie du eine Interaktion zauberst, bei der mehrere Würfel verspielt ihre Position verändern und ihre Farbe wechseln, wenn du mit dem Cursor darüberfährst.

Und dafür brauchen wir weniger als 5 Minuten! 👀 Sieh dir Spline an: <https://spline.design/>

Remix 👉 <https://app.spline.design/file/8f4650a0-c475-415a-a6d5-c914d47c16bd>

Teile deine Version in unserer Community auf <https://community.spline.design/> Wir können es kaum erwarten, sie zu sehen 🤩

Viel Spaß beim Lernen!

## Das lernst du

1. [0:00Einführung](https://www.youtube.com/watch?v=RmC2xEtXobE&t=0s)
2. [0:12Einen Würfel erstellen](https://www.youtube.com/watch?v=RmC2xEtXobE&t=12s)
3. [0:31Farben und Materialien hinzufügen](https://www.youtube.com/watch?v=RmC2xEtXobE&t=31s)
4. [1:29Tiefe hinzufügen](https://www.youtube.com/watch?v=RmC2xEtXobE&t=89s)
5. [1:56Eine Mouse-Hover-Interaktion erstellen](https://www.youtube.com/watch?v=RmC2xEtXobE&t=116s)
6. [2:39Würfel duplizieren](https://www.youtube.com/watch?v=RmC2xEtXobE&t=159s)
7. [4:00Exportoptionen und Inspiration aus der Community](https://www.youtube.com/watch?v=RmC2xEtXobE&t=240s)

## Weitere Ressourcen

- [Interactive Cubes ExperienceVorlage](https://app.spline.design/academy/tutorials/animate-interactive-3d-boxes?redirect-duplicate-template-uuid=3274b34e-60fa-4a92-bb4a-2fb5383f3021&is-2d-file=false)
- [Mouse Hover EventDokument](https://docs.spline.design/interaction-states-events-and-actions/events/mouse-hover-event)
- [Cloner MotionDokument](https://docs.spline.design/designing-in-3-d/cloner-motion)
- [ComponentsDokument](https://docs.spline.design/designing-in-3-d/components)
- [Transition ActionDokument](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)

## Überblick

- Spline 3D
- 4 Min.
- Fortgeschritten

## Teil von

- [Animation und Interaktionen in Spline](https://spline.design/de/academy/collections/animation-interactions-in-spline/animate-interactive-3d-boxes)

## Ähnliche Tutorials

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

[Einen interaktiven 3D-Roboter zum Leben erweckenSpline 3DEinsteiger13 Min.](https://spline.design/de/academy/tutorials/bring-an-interactive-3d-robot-to-life)[Interaktive Erlebnisse nativ für iOS und visionOS exportierenSpline 3DFortgeschritten15 Min.](https://spline.design/de/academy/tutorials/export-interactive-experiences-natively-for-ios-and-visionos)[Natives 3D für Android exportierenSpline 3DFortgeschritten12 Min.](https://spline.design/de/academy/tutorials/how-to-export-native-3d-for-android)

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