Jetpack Compose Glimmer

Thiết kế rõ ràng, dễ nhìn cho màn hình quang học trong suốt.

Jetpack Compose Glimmer là một hệ thống thiết kế và bộ công cụ giao diện người dùng của Google dành cho màn hình nhìn xuyên qua (OST), chẳng hạn như kính thông minh XR có dây. Hệ thống thiết kế cung cấp các quyết định có thể sử dụng lại – từ các thành phần nguyên thuỷ về màu sắc, kiểu chữ và hình dạng, cho đến các thành phần và hướng dẫn.

Nguyên tắc

Jetpack Compose Glimmer là một trong những khung giao diện người dùng đầu tiên được tối ưu hoá cho màn hình trong suốt và hệ số hình dạng kính. OST chiếu ánh sáng của dự án trực tiếp lên thế giới thực thay vì sử dụng màn hình hiển thị mờ đục. Glimmer giúp nhà phát triển xây dựng giao diện người dùng có độ tương phản cao, dễ nhìn và duy trì sự hiện diện trong thế giới thực.

Màn hình trong suốt xuất hiện trước

Được tối ưu hoá và hỗ trợ bởi nghiên cứu cũng như khoa học về màu sắc, dành cho màn hình trong suốt và kiểu dáng mắt kính để mang đến trải nghiệm nhìn xuyên thấu quang học đẹp mắt và chu đáo.

Màn hình trong suốt xuất hiện trước

Đầu vào phần cứng

Đầu vào tương tác được thiết kế dựa trên các khả năng của kính thông minh XR có dây.

Được thiết kế riêng

Các kiểu và thành phần được thiết kế riêng để sử dụng ngay cho kính. Jetpack Compose Glimmer được tối ưu hoá cho màn hình trong suốt và sự thoải mái của người dùng. Mặc dù được thiết kế có mục đích, nhưng hệ thống này không cứng nhắc. Ngoài kiểu chữ và màu sắc, bạn có thể tuỳ chỉnh các điểm nổi bật khi lấy tiêu điểm.

Được thiết kế riêng

Kiểu

Ngôn ngữ thiết kế của Jetpack Compose Glimmer có một giao diện đơn giản để có khả năng hiển thị tối ưu trên kính. Bạn có thể tuỳ chỉnh màu sắc và kiểu chữ để thể hiện ngữ nghĩa và tính gắn kết của ứng dụng. Các nguyên tắc thiết kế trực quan nhấn mạnh sự rõ ràng, dễ đọc và giảm thiểu yếu tố gây mất tập trung. Mặc dù kính có dây có trường nhìn rộng hơn và có thể ít bị nhiễu "thế giới thực" hơn, nhưng bạn vẫn nên cân nhắc việc đặt giao diện người dùng ở vị trí không gây cản trở.

Glimmer có một giao diện cơ bản được tối ưu hoá cho kính OST. Bạn có thể tuỳ chỉnh màu sắc và kiểu chữ để thể hiện ngữ nghĩa và tính gắn kết của ứng dụng. Màu đen trong suốt trên màn hình quang học nhìn xuyên thấu. Hãy lưu ý điều này khi thiết kế, vì màu tối sẽ xuất hiện mờ hoặc trong suốt, nhưng bạn cũng có thể dùng màu tối để tạo chiều sâu.

Phối màu

Bảng phối màu của kính (tập hợp các mã thông báo hoặc vai trò màu sắc để tạo giao diện màu cho ứng dụng của bạn) bao gồm 3 vai trò nhấn, 6 vai trò bề mặt (hoặc vai trò trung tính) và các vai trò tương ứng.

Phối màu

Tuỳ chỉnh màu

Bạn có thể tuỳ chỉnh màu chính để sử dụng màu thương hiệu hoặc màu tương tác chính. Hãy cân nhắc độ tương phản, độ rực màu và mức tiêu thụ điện năng của màu đã chọn.

Đọc thêm về hệ thống màu của Glimmer và các phương pháp hay nhất.

Kiểu chữ

Jetpack Compose Glimmer có một thang kiểu chữ mặc định được tối ưu hoá. Bao gồm 2 vai trò với 3 kiểu chữ cho mỗi vai trò, vai trò kiểu chữ dựa trên mục đích và hệ thống phân cấp của chúng. Để biết thêm thông tin, hãy xem phần Kiểu chữ lấp lánh.

Bề mặt và độ sâu

Các bề mặt chứa nội dung. Chúng cung cấp các điểm lấy nét rõ ràng trong trường nhìn của người dùng, có thể chứa nội dung hoặc hành động. Thông tin khác về bề mặt và độ sâu được dùng trong Glimmer.

Thành phần

Các thành phần là những khối xây dựng có mục đích cụ thể để xây dựng giao diện người dùng. Ứng dụng của bạn nên sử dụng Jetpack Compose Glimmer cho các thành phần, vì các thành phần này được tối ưu hoá cho các trường hợp sử dụng riêng của kính OST. Để biết thêm thông tin, hãy xem bài viết Các thành phần Glimmer.

Bạn đã sẵn sàng triển khai các thành phần? Hãy xem tài liệu về Jetpack Compose Glimmer.

Các thành phần Glimmer có nhiều mục đích về trải nghiệm người dùng. Một số thành phần bao gồm các nút cho thao tác, chỉ báo tiến trình để giao tiếp, ngăn xếp để chứa, điều hướng và chỉ báo bằng giọng nói để nhập.