# Cách tạo tương tác carousel 3D - Spline nâng cao | Đi sâu vào tính năng - Spline Academy (https://spline.design/vi/academy/tutorials/how-to-create-a-3d-carousel-interaction)

> 🎡 Trong hướng dẫn này, chúng ta sẽ tạo một tương tác carousel 3D thú vị nhờ sức mạnh của biến! Chúng tôi sẽ hướng dẫn bạn từng bước, từ định vị đối tượng…

1. [Academy](https://spline.design/vi/academy)
2. [Khóa học](https://spline.design/vi/academy/collections)
3. [Spline nâng cao | Đi sâu vào tính năng](https://spline.design/vi/academy/collections/spline-advanced-feature-deep-dive)
4. Cách tạo tương tác carousel 3D

# Cách tạo tương tác carousel 3D

Bài 6 / 17Spline 3DNâng cao16 phút

🎡 Trong hướng dẫn này, chúng ta sẽ tạo một tương tác carousel 3D thú vị nhờ sức mạnh của biến! Chúng tôi sẽ hướng dẫn bạn từng bước, từ định vị đối tượng và thiết lập nhân bản theo hướng tâm đến tạo hiệu ứng xoay mượt mà khi người dùng nhấp chuột.

👉 Remix các bản demo carousel trong hướng dẫn! 👇 Ví dụ carousel khối lập phương 3D cơ bản: <https://app.spline.design/file/7a7cdf26-ca54-4690-a76d-247dcaaf257a>

Carousel thẻ 3D: <https://app.spline.design/file/f2857f06-7a97-4245-a43e-fe88503913d4>

\---

🧑‍🏫 Tìm hiểu thêm về biến: <https://www.youtube.com/watch?v=Id%5FSZVCUVMM> <https://www.youtube.com/watch?v=eCxLYk2rNzg>

\--- Khám phá thêm nhiều nhà sáng tạo và dự án tuyệt vời #MadeInSpline tại <https://community.spline.design/>

## Bạn sẽ học được gì

1. [0:00Thiết lập carousel 3D](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=0s)
2. [0:15Xây dựng carousel cơ bản](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=15s)
3. [1:32Dùng biến để xoay](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=92s)
4. [6:33Kích hoạt xoay bằng sự kiện Mouse Down](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=393s)
5. [8:35Tạo hiệu ứng phóng to thu nhỏ (ví dụ carousel thẻ)](https://www.youtube.com/watch?v=pR2AhQ22KwM&t=515s)

## Tài nguyên liên quan

- [Basic 3D Cubes CarouselMẫu](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 MotionTài liệu](https://docs.spline.design/designing-in-3-d/cloner-motion)
- [VariablesTài liệu](https://docs.spline.design/interaction-states-events-and-actions/variables)
- [Mouse Down EventTài liệu](https://docs.spline.design/interaction-states-events-and-actions/events/mouse-down-event)

## Tổng quan

- Spline 3D
- 16 phút
- Nâng cao

## Tiếp theo

[Cách thiết lập API và Webhook thời gian thực cho cảnh 3D16 phútNâng cao](https://spline.design/vi/academy/collections/spline-advanced-feature-deep-dive/how-to-set-up-real-time-apis-and-webhooks-for-your-3d-scenes)[Tiếp tục](https://spline.design/vi/academy/collections/spline-advanced-feature-deep-dive/how-to-set-up-real-time-apis-and-webhooks-for-your-3d-scenes)

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

Trình chỉnh sửa 3D và 2D cho các nhóm và tác nhân AI của họ. Xuất bản lên web, iOS và Android.

#### Hỏi AI về Spline

#### Sản phẩm

- [Thiết kế 3D](https://spline.design/vi/3d-design)
- [Hana](https://spline.design/vi/hana)
- [Omma](https://omma.build)
- [Tạo 3D bằng AI](https://spline.design/vi/ai-generate)
- [Spline MCP](https://spline.design/vi/mcp)
- [Spline Arena](https://spline.design/vi/arena)
- [Bảng giá](https://spline.design/vi/pricing)
- [Doanh nghiệp](https://spline.design/vi/enterprise)

#### Runtime

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

#### Ứng dụng

- [Tải xuống](https://spline.design/vi/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Tải Spline Mirror](https://spline.design/download-mirror)

#### Học

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/vi/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Giải pháp](https://spline.design/solutions)

#### Cộng đồng

- [Cộng đồng Spline](https://community.spline.design)
- [Blog](https://spline.design/vi/blog)
- [Changelog](https://spline.design/vi/changelog)
- [Giáo dục](https://spline.design/vi/education)
- [Contra](https://spline.design/contra)
- [Tiếp thị liên kết](https://spline.design/vi/affiliate)

#### Công ty

- [Khách hàng](https://spline.design/vi/customers)
- [Tuyển dụng](https://www.ycombinator.com/companies/spline/jobs)
- [Bảo mật](https://spline.design/vi/security)

#### Pháp lý

- [Điều khoản & Điều kiện](https://spline.design/terms)
- [Quyền riêng tư](https://spline.design/privacy)

#### Liên hệ

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

© 2026 - Spline, Inc.
