# Liquid Glass và 3D trong Hana - Spline blog (https://spline.design/vi/blog/hana-3d-glass-autolayout-video)

> Mới trong Hana: 3D Transform, Liquid Glass và Autolayout

[Blog](https://spline.design/vi/blog)

9 tháng 7, 2025

# Liquid Glass và 3D trong Hana

Mới trong Hana: 3D Transform, Liquid Glass và Autolayout

[Mở Hana](https://app.spline.design)

Hôm nay, chúng tôi công bố một bản cập nhật lớn cho Hana với những tính năng đột phá như Liquid Glass thời gian thực, 3D Transform, Autolayout và Video Layer.

## Liquid Glass trong Hana

Với sự ra mắt của iOS 26, hiệu ứng Liquid Glass đã thu hút sự chú ý của cộng đồng thiết kế. Giờ đây, bạn có thể áp dụng hiệu ứng này cho bất kỳ layer đối tượng nào trong Hana.

Bạn có thể chỉnh các tham số của kính, như Distortion, để điều khiển mức độ khúc xạ.

Không chỉ dừng lại ở phong cách iOS, bạn còn có thể tạo hiệu ứng kính tùy chỉnh. Chúng tôi đã thiết kế các tham số đủ tổng quát để đạt được nhiều kết quả sáng tạo khác nhau, cho phép bạn cường điệu một số hành vi của hiệu ứng và tạo nên thẩm mỹ thị giác ấn tượng hơn.

Rê chuột hoặc chạm để tương tác (trải nghiệm làm bằng Hana)

## Kính xếp chồng

Trong hầu hết các công cụ thiết kế, hiệu ứng blur hoặc kính thường bị giới hạn trong một layer duy nhất, nghĩa là khi bạn xếp chồng nhiều layer, độ méo của kính sẽ không cộng dồn mà vẫn phẳng.

Trong Hana, bạn có thể dễ dàng xếp chồng nhiều lớp kính và thấy cách mỗi lớp khúc xạ các phần tử phía sau hoặc bên dưới, giống như ngoài đời thực, mở ra cả một loạt cơ hội sáng tạo mới. Điều này áp dụng cho hiệu ứng kính và cả hiệu ứng làm mờ nền.

Điều khiển nhiều lớp Liquid Glass trong Hana

## 3D Transform

Chuyển từ 2D sang 3D luôn là một thử thách. Khi bắt đầu làm tính năng này, chúng tôi biết mình muốn có một cách liền mạch để dễ dàng chuyển đổi giữa 2D và 3D mà không đánh mất gì ở giữa.

Trong Hana, giờ đây bất kỳ đối tượng nào cũng có thể là đối tượng 3D, với các tham số để điều khiển vị trí (Depth), góc xoay và phối cảnh trong không gian 3D.

Tất cả các tham số này đều có thể tạo hoạt ảnh và tương thích với hệ thống trạng thái/sự kiện.

Điều khiển phối cảnh, góc xoay và vị trí z của đối tượng trong Hana

## Frame và cổng 3D

Khi một frame trở thành 3D, nó cũng trở thành cửa sổ nhìn vào không gian 3D của riêng nó. Điều này đặc biệt hữu ích để tạo cổng (portal), một phần tử thị giác cho bạn thấy chiều sâu bên trong chính nó.

Rất dễ: chỉ cần đặt các phần tử vào trong một frame, chuyển frame thành 3D, rồi thay đổi vị trí hoặc góc xoay 3D của các phần tử bên trong. Giờ nếu bạn thay đổi góc xoay hoặc vị trí của frame, bạn sẽ thấy các phần tử được kết xuất bên trong với nhiều tầng chiều sâu.

Cổng 3D bên trong frame, tạo bằng Hana

## Autolayout

Hana giờ đã hỗ trợ layout với các tham số có thể tạo hoạt ảnh hoàn toàn. Bạn có thể tạo layout dọc và ngang với padding và khoảng cách tùy chỉnh.

Layout hoạt động cùng sự kiện và trạng thái, cập nhật theo thời gian thực để tăng tính tương tác.

Chúng tôi cũng đã hỗ trợ layout masonry, tương tự layout dạng cột của Pinterest.

Trải nghiệm làm bằng Hana với Layout

## Video Layer

Giờ bạn có thể dễ dàng nhúng video vào bất kỳ layer nào trong Spline Hana. Tính năng này rất tiện khi xây dựng bài thuyết trình tương tác hoặc thiết kế chuyển động. Chỉ cần chuyển sang Video Layer trong bảng Fill rồi tải lên hoặc kéo thả video của bạn.

Giống như trình chỉnh sửa 3D của Spline, video trong Hana cũng có thể được kích hoạt bằng sự kiện tùy chỉnh. Mặc định, video sẽ phát ở sự kiện Start, nhưng bạn có thể thay đổi và kích hoạt nó bằng sự kiện chuột hoặc bất kỳ sự kiện nào khác.

## Những khả năng sáng tạo mới

Thật nhiều thứ! Chúng tôi hy vọng bạn sẽ thích tất cả các tính năng mới vừa phát hành hôm nay và bắt đầu tạo ra những thiết kế mới thú vị.

— Đội ngũ Spline

## Thêm từ blog

[3 tháng 11, 2026Giới thiệu Spline Arena](https://spline.design/vi/blog/introducing-spline-arena)[21 tháng 10, 2026Giới thiệu Spline cho ChatGPT](https://spline.design/vi/blog/introducing-spline-for-chatgpt)[27 tháng 8, 2026Giới thiệu Hana V2](https://spline.design/vi/blog/hana-v2)

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