# Cara Mencipta Interaksi Karusel 3D - Spline Academy (https://spline.design/ms/academy/tutorials/how-to-create-a-3d-carousel-interaction)

> 🎡 Dalam tutorial ini, kita akan menyelami cara mencipta interaksi karusel 3D yang menyeronokkan menggunakan keajaiban pemboleh ubah! Kami akan membimbing…

1. [Academy](https://spline.design/ms/academy)
2. [Tutorial](https://spline.design/ms/academy/tutorials)
3. Cara Mencipta Interaksi Karusel 3D

# Cara Mencipta Interaksi Karusel 3D

Spline 3DLanjutan16 min

🎡 Dalam tutorial ini, kita akan menyelami cara mencipta interaksi karusel 3D yang menyeronokkan menggunakan keajaiban pemboleh ubah! Kami akan membimbing anda melalui setiap langkah, daripada meletakkan objek dan menyediakan pengklonan jejarian hingga mencipta kesan putaran licin yang dicetuskan oleh klik pengguna.

👉 Adun Semula Demo Karusel yang Dipaparkan dalam Tutorial! 👇 Contoh Karusel Kiub 3D Asas: <https://app.spline.design/file/7a7cdf26-ca54-4690-a76d-247dcaaf257a>

Karusel Kad 3D: <https://app.spline.design/file/f2857f06-7a97-4245-a43e-fe88503913d4>

\---

🧑‍🏫 Ketahui lebih lanjut tentang Pemboleh Ubah: <https://www.youtube.com/watch?v=Id%5FSZVCUVMM> <https://www.youtube.com/watch?v=eCxLYk2rNzg>

\--- Temui lebih ramai pencipta dan projek hebat #MadeInSpline di <https://community.spline.design/>

## Apa yang akan anda pelajari

1. [0:00Menyediakan Karusel 3D](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=0s)
2. [0:15Membina Karusel Asas](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=15s)
3. [1:32Menggunakan Pemboleh Ubah untuk Putaran](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=92s)
4. [6:33Mencetuskan Putaran dengan Peristiwa Mouse Down](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=393s)
5. [8:35Mencipta Kesan Penskalaan (Contoh Karusel Kad)](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=515s)

## Sumber berkaitan

- [Basic 3D Cubes CarouselTemplat](https://app.spline.design/academy/tutorials/how-to-create-a-3d-carousel-interaction?redirect-duplicate-template-uuid=db997029-a24c-4b33-b016-ec27a2ff7fc3&is-2d-file=false)
- [Cloner MotionDokumen](https://docs.spline.design/designing-in-3-d/cloner-motion)
- [VariablesDokumen](https://docs.spline.design/interaction-states-events-and-actions/variables)
- [Mouse Down EventDokumen](https://docs.spline.design/interaction-states-events-and-actions/events/mouse-down-event)

## Gambaran keseluruhan

- Spline 3D
- 16 min
- Lanjutan

## Sebahagian daripada

- [Spline Lanjutan | Menyelami Ciri](https://spline.design/ms/academy/collections/spline-advanced-feature-deep-dive/how-to-create-a-3d-carousel-interaction)

## Tutorial berkaitan

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

[Cipta Watak 3D Interaktif menggunakan Pemboleh UbahSpline 3DLanjutan17 min](https://spline.design/ms/academy/tutorials/create-an-interactive-3d-character-using-variables)[Cara Menyediakan API dan Webhook Masa Nyata untuk Adegan 3D AndaSpline 3DLanjutan16 min](https://spline.design/ms/academy/tutorials/how-to-set-up-real-time-apis-and-webhooks-for-your-3d-scenes)[Benamkan Adegan 3D Interaktif ke dalam Laman Web WixSpline 3DPemula5 min](https://spline.design/ms/academy/tutorials/embed-interactive-3d-scenes-into-wix-websites)

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

Editor 3D dan 2D untuk pasukan dan ejen mereka. Terbitkan ke web, iOS dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Reka Bentuk 3D](https://spline.design/ms/3d-design)
- [Hana](https://spline.design/ms/hana)
- [Omma](https://omma.build)
- [Penjanaan 3D AI](https://spline.design/ms/ai-generate)
- [Spline MCP](https://spline.design/ms/mcp)
- [Spline Arena](https://spline.design/ms/arena)
- [Harga](https://spline.design/ms/pricing)
- [Perusahaan](https://spline.design/ms/enterprise)

#### Runtime

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

#### Aplikasi

- [Muat Turun](https://spline.design/ms/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Muat turun Spline Mirror](https://spline.design/download-mirror)

#### Belajar

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

#### Komuniti

- [Komuniti Spline](https://community.spline.design)
- [Blog](https://spline.design/ms/blog)
- [Log Perubahan](https://spline.design/ms/changelog)
- [Pendidikan](https://spline.design/ms/education)
- [Contra](https://spline.design/contra)
- [Afiliat](https://spline.design/ms/affiliate)

#### Syarikat

- [Pelanggan](https://spline.design/ms/customers)
- [Kerjaya](https://www.ycombinator.com/companies/spline/jobs)
- [Keselamatan](https://spline.design/ms/security)

#### Undang-undang

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

#### Hubungi

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

© 2026 - Spline, Inc.
