# Tạo tương tác Follow 2D - Hana | Mọi điều bạn cần biết - Spline Academy (https://spline.design/vi/academy/tutorials/create-a-2d-follow-interaction)

> Nếu đây là lần đầu bạn thử thiết kế 2D tương tác, đây là nơi tuyệt vời để bắt đầu! 😉 Trong hướng dẫn này, chúng tôi sẽ hướng dẫn bạn từng bước cách dễ dàng…

1. [Academy](https://spline.design/vi/academy)
2. [Khóa học](https://spline.design/vi/academy/collections)
3. [Hana | Mọi điều bạn cần biết](https://spline.design/vi/academy/collections/hana-everything-you-need-to-know)
4. Tạo tương tác Follow 2D

# Tạo tương tác Follow 2D

Bài 6 / 15HanaCơ bản8 phút

Nếu đây là lần đầu bạn thử thiết kế 2D tương tác, đây là nơi tuyệt vời để bắt đầu! 😉 Trong hướng dẫn này, chúng tôi sẽ hướng dẫn bạn từng bước cách dễ dàng tạo một tương tác 2D đi theo con trỏ (hoặc theo thao tác chạm trên thiết bị di động) bằng Hana, một canvas thời gian thực mới để thiết kế và tạo hoạt ảnh cho các trải nghiệm 2D tương tác.

Chúng ta sẽ xây dựng tương tác vui nhộn này bằng cách áp dụng sự kiện Follow để tạo ra một chuỗi phản ứng mượt mà, liền mạch. Đây là cách thú vị và dễ dàng để thêm chút chuyển động và cá tính cho website hoặc dự án của bạn.

Demo 👉 <https://app.spline.design/ui/98440491-bf75-4e54-ab6f-afa16fc04f7e>

Học cách tạo hiệu ứng này ở dạng 3D bằng trình chỉnh sửa 3D của Spline: <https://youtu.be/TQe5Ae16rE8>

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

1. [0:00Bắt đầu](https://www.youtube.com/watch?v=bKrapjgDBNo&t=0s)
2. [0:49Tạo hình elip và áp dụng sự kiện Follow](https://www.youtube.com/watch?v=bKrapjgDBNo&t=49s)
3. [2:41Điều chỉnh giá trị Damping và kích thước](https://www.youtube.com/watch?v=bKrapjgDBNo&t=161s)
4. [6:10Xuất và nhúng thiết kế](https://www.youtube.com/watch?v=bKrapjgDBNo&t=370s)

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

- [Follow CirclesMẫu](https://app.spline.design/academy/tutorials/create-a-2d-follow-interaction?redirect-duplicate-template-uuid=3b7c3f0a-306e-4a88-aa07-e705edb96030&is-2d-file=true)
- [Designing in HanaTài liệu](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Hana EventsTài liệu](https://docs.spline.design/hana-a-canvas-for-interactivity/interactivity-in-hana#hana-events)
- [Exporting as EmbedTài liệu](https://docs.spline.design/hana-a-canvas-for-interactivity/exporting-in-hana#exporting-as-embed-link)

## Tổng quan

- Hana
- 8 phút
- Cơ bản

## Tiếp theo

[Thiết kế hiệu ứng tương tác với progressive blur và gradient mượt9 phútCơ bản](https://spline.design/vi/academy/collections/hana-everything-you-need-to-know/design-interactive-effects-with-progressive-blur-and-smoothing-gradients)[Tiếp tục](https://spline.design/vi/academy/collections/hana-everything-you-need-to-know/design-interactive-effects-with-progressive-blur-and-smoothing-gradients)

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