Thư viện thuật ngữ / UI/UX

Độ nổi là gì?

Còn gọi: elevation, elevation material, z-depth, độ cao lớp giao diện

Elevation là khái niệm mô tả khoảng cách theo chiều sâu giữa các bề mặt giao diện, thể hiện bằng bóng đổ hoặc sắc độ màu, giúp người dùng hiểu lớp nào nằm trên lớp nào.

Hiểu kỹ hơn

Material Design xem giao diện như các tấm vật liệu chồng lên nhau: thẻ nằm trên nền, menu nằm trên thẻ, hộp thoại nằm trên tất cả. Material Design 3 dùng 6 mức elevation, từ level 0 đến level 5, và ngoài bóng đổ còn dùng tông màu bề mặt (surface tint) để phân biệt, đặc biệt ở giao diện tối nơi bóng đổ khó thấy. Ví dụ: thẻ sản phẩm ở mức thấp, thanh điều hướng khi cuộn nâng lên một mức, FAB và hộp thoại ở mức cao hơn. Trong design system, elevation nên là một bộ token cố định thay vì mỗi người tự chỉnh bóng đổ khác nhau. Lỗi phổ biến là bóng đổ quá đậm và lan rộng, làm giao diện nặng và cũ.