# Cách xây dựng quả cầu 3D phản hồi với chuyển động và tương tác - Spline nâng cao | Đi sâu vào tính năng - Spline Academy (https://spline.design/vi/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)

> Hôm nay, chúng tôi sẽ chỉ cho bạn cách tạo quả cầu 3D tương tác mang cảm hứng công nghệ này bằng cloner và sự kiện chuột trong Spline, hoàn hảo cho mọi dự…

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 xây dựng quả cầu 3D phản hồi với chuyển động và tương tác

# Cách xây dựng quả cầu 3D phản hồi với chuyển động và tương tác

Bài 3 / 17Spline 3DTrung cấp7 phút

Hôm nay, chúng tôi sẽ chỉ cho bạn cách tạo quả cầu 3D tương tác mang cảm hứng công nghệ này bằng cloner và sự kiện chuột trong Spline, hoàn hảo cho mọi dự án web như landing page, giới thiệu sản phẩm hoặc bất kỳ dự án thiết kế nào bạn thích.

Cảnh này được tạo bởi Vlad Kolokolnikov, hãy xem cộng đồng Spline để tìm cảnh này và nhiều cảnh 3D khác có thể remix miễn phí.

Demo: <https://app.spline.design/community/file/306ca2a5-d1ab-46ac-a27c-198575c82db0>

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

1. [0:00Giới thiệu](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=0s)
2. [0:18Tạo đối tượng cơ sở và thêm vật liệu](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=18s)
3. [1:30Dùng Cloner](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=90s)
4. [2:25Thêm sự kiện Follow](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=145s)
5. [3:46Thêm sự kiện Distance](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=226s)
6. [4:32Hoàn thiện hoạt ảnh](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=272s)
7. [5:17Tạo hoạt ảnh cho nhóm cloner](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=317s)
8. [5:47Thiết kế hoàn chỉnh](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=347s)
9. [6:13Mẹo xuất](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=373s)
10. [6:20Kết thúc](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=380s)

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

- [Reactive OrbMẫu](https://app.spline.design/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction?redirect-duplicate-template-uuid=684c8aec-6fec-4d6b-ae37-a3a1fd5fac27&is-2d-file=false)
- [Cloner MotionTài liệu](https://docs.spline.design/designing-in-3-d/cloner-motion)
- [How state-based animation worksTài liệu](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Materials & ShadingTài liệu](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)

## Tổng quan

- Spline 3D
- 7 phút
- Trung cấp

## Tiếp theo

[Dùng biến để tạo nội dung 3D tương tác24 phútNâng cao](https://spline.design/vi/academy/collections/spline-advanced-feature-deep-dive/use-variables-to-create-interactive-3d-content)[Tiếp tục](https://spline.design/vi/academy/collections/spline-advanced-feature-deep-dive/use-variables-to-create-interactive-3d-content)

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