# Menambahkan Interaksi Berbasis Mouse ke Objek 3D - Spline Academy (https://spline.design/id/academy/tutorials/add-mouse-based-interactions-to-3d-objects)

> Pelajari cara membuat interaksi dengan mudah, dengan membuat elemen 3D bereaksi terhadap kursor Anda!

1. [Academy](https://spline.design/id/academy)
2. [Tutorial](https://spline.design/id/academy/tutorials)
3. Menambahkan Interaksi Berbasis Mouse ke Objek 3D

# Menambahkan Interaksi Berbasis Mouse ke Objek 3D

Spline 3DPemula14 mnt

Pelajari cara membuat interaksi dengan mudah, dengan membuat elemen 3D bereaksi terhadap kursor Anda!

Panduan ini dirancang untuk pemula, sebagai pengantar yang mudah diikuti untuk konsep-konsep ini.

Kami menunjukkan kekuatan mouse event dalam memperkaya desain 3D, seperti event mouse up, down, press, dan hover. Kami juga menunjukkan cara membuat pengalaman interaktif dengan menghubungkan mouse event ke action seperti perubahan warna, ukuran, dan animasi, serta gerakan kamera, dan masih banyak lagi!

Lihat tutorial lainnya ini untuk mempelajari mouse event lebih lanjut! <https://youtu.be/pR2AhQ22KwM> <https://youtu.be/eCxLYk2rNzg> <https://youtu.be/hRy-Iqle6EU> <https://youtu.be/RmC2xEtXobE> <https://youtu.be/lJIDSiDlhvw>

\---

Temukan lebih banyak kreator dan proyek luar biasa #MadeInSpline di <https://community.spline.design/>

## Yang akan Anda pelajari

1. [0:00Intro](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=0s)
2. [0:29Memahami mouse event](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=29s)
3. [1:42Membuat interaksi Mouse Down sederhana](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=102s)
4. [5:02Mengubah warna saat diklik](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=302s)
5. [6:03Tombol interaktif dan perubahan warna](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=363s)
6. [8:47Interaksi klik dengan perubahan posisi kamera](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=527s)
7. [10:54Menambahkan efek suara](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=654s)
8. [12:01Menjelajahi action Create Object](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=721s)
9. [12:20Menambahkan URL untuk membuka situs web saat diklik.](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=740s)

## Sumber terkait

- [Mouse Hover EventTemplate](https://app.spline.design/academy/tutorials/add-mouse-based-interactions-to-3d-objects?redirect-duplicate-template-uuid=267cdcd9-2272-426a-9b67-4028d2c1d024&is-2d-file=false)
- [How state-based animation worksDokumen](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Events & InteractivityDokumen](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)
- [EventsDokumen](https://docs.spline.design/#events)
- [ActionsDokumen](https://docs.spline.design/#actions)

## Ikhtisar

- Spline 3D
- 14 mnt
- Pemula

## Bagian dari

- [Spline 101 | Membuat Scene Interaktif Pertama Anda](https://spline.design/id/academy/collections/spline-101-build-your-first-interactive-scene/add-mouse-based-interactions-to-3d-objects)

## Tutorial terkait

[Semua tutorial](https://spline.design/id/academy/tutorials)

[Membuat Desain Interaktif yang Bereaksi terhadap Mouse dengan HanaHanaPemula6 mnt](https://spline.design/id/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)[Cara Membuat Bola 3D Reaktif dengan Gerakan dan InteraksiSpline 3DMenengah7 mnt](https://spline.design/id/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)[Cara Membuat Visualisasi Data 3D di Spline dengan Variabel dan API Real-TimeSpline 3DLanjutan15 mnt](https://spline.design/id/academy/tutorials/how-to-create-3d-data-visualizations-in-spline-using-variables-and-real-time-apis)

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

Editor 3D dan 2D untuk tim dan agen mereka. Rilis ke web, iOS, dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Desain 3D](https://spline.design/id/3d-design)
- [Hana](https://spline.design/id/hana)
- [Omma](https://omma.build)
- [Pembuatan 3D dengan AI](https://spline.design/id/ai-generate)
- [Spline MCP](https://spline.design/id/mcp)
- [Spline Arena](https://spline.design/id/arena)
- [Harga](https://spline.design/id/pricing)
- [Enterprise](https://spline.design/id/enterprise)

#### Runtime

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

#### Aplikasi

- [Unduh](https://spline.design/id/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Unduh Spline Mirror](https://spline.design/download-mirror)

#### Belajar

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

#### Komunitas

- [Komunitas Spline](https://community.spline.design)
- [Blog](https://spline.design/id/blog)
- [Changelog](https://spline.design/id/changelog)
- [Pendidikan](https://spline.design/id/education)
- [Contra](https://spline.design/contra)
- [Afiliasi](https://spline.design/id/affiliate)

#### Perusahaan

- [Pelanggan](https://spline.design/id/customers)
- [Karier](https://www.ycombinator.com/companies/spline/jobs)
- [Keamanan](https://spline.design/id/security)

#### Legal

- [Syarat & Ketentuan](https://spline.design/terms)
- [Privasi](https://spline.design/privacy)

#### Kontak

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

© 2026 - Spline, Inc.