# Thiết kế biểu tượng tương tác mượt mà trong Hana - Spline Academy (https://spline.design/vi/academy/tutorials/design-smooth-interactive-icons-in-hana)

> Học cách tạo một biểu tượng tương tác gọn gàng bằng Hana!

1. [Academy](https://spline.design/vi/academy)
2. [Hướng dẫn](https://spline.design/vi/academy/tutorials)
3. Thiết kế biểu tượng tương tác mượt mà trong Hana

# Thiết kế biểu tượng tương tác mượt mà trong Hana

HanaCơ bản7 phút

Học cách tạo một biểu tượng tương tác gọn gàng bằng Hana!

Trong hướng dẫn này, chúng ta sẽ đi qua toàn bộ quá trình thiết kế — từ dựng các hình khối đến thêm vật liệu và tương tác hover mượt mà.

Hoàn hảo cho người mới bắt đầu và các nhà thiết kế muốn nâng cao kỹ năng chuyển động UI.

Bắt đầu thôi! 🚀

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

- [Frosted Glass IconsMẫu](https://app.spline.design/academy/tutorials/design-smooth-interactive-icons-in-hana?redirect-duplicate-template-uuid=1eb3b7da-7eb4-44a9-ab46-b060a5ad66cd&is-2d-file=true)
- [Designing in HanaTài liệu](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Effects in HanaTài liệu](https://docs.spline.design/hana-a-canvas-for-interactivity/effects-in-hana)
- [Interactivity in HanaTài liệu](https://docs.spline.design/hana-a-canvas-for-interactivity/interactivity-in-hana)

## Tổng quan

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

## Thuộc

- [Hana | Mọi điều bạn cần biết](https://spline.design/vi/academy/collections/hana-everything-you-need-to-know/design-smooth-interactive-icons-in-hana)

## Hướng dẫn liên quan

[Tất cả hướng dẫn](https://spline.design/vi/academy/tutorials)

[Thêm chiều sâu cho thiết kế Hana với hiệu ứng 3D ShapeHanaCơ bản3 phút](https://spline.design/vi/academy/tutorials/add-dimension-to-hana-designs-with-the-3d-shape-effect)[Cách học thiết kế 3D với Spline: lộ trình thực tế từ người mới đến chuyên giaSpline 3DCơ bản8 phút](https://spline.design/vi/academy/tutorials/how-to-learn-3d-design-with-spline-a-practical-roadmap-for-beginners-to-pros)[Xây dựng hoạt ảnh tương tác: UI biến hình và hiệu ứng phát sáng phản hồi trong Hana (từng bước)HanaCơ bản13 phút](https://spline.design/vi/academy/tutorials/build-interactive-animations-morphing-ui-reactive-glow-in-hana-step-by-step)

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