Thẻ thông tin cho phép người dùng truy cập nhanh vào thông tin và thao tác cần thực hiện để hoàn tất công việc. Sau khi thực hiện thao tác vuốt trên mặt đồng hồ, người dùng có thể xem tiến bộ của mình trong việc đạt được mục tiêu thể chất, xem thông tin thời tiết, cũng như làm nhiều việc khác. Người dùng cũng có thể khởi chạy ứng dụng và nhanh chóng hoàn tất công việc cần thiết nhờ có thẻ thông tin.
Người dùng có thể chọn thẻ thông tin muốn xem trên thiết bị Wear OS, cả từ chính thiết bị đó và trong ứng dụng đồng hành.
Nguyên tắc thiết kế trải nghiệm người dùng
Thẻ thông tin do hệ thống cung cấp sử dụng ngôn ngữ thiết kế nhất quán, vì vậy, người dùng mong muốn các thẻ thông tin sẽ là:
- Ngay lập tức: Thẻ thông tin được thiết kế để giúp người dùng nhanh chóng hoàn tất các nhiệm vụ thường xuyên. Trình bày nội dung quan trọng trong một hệ phân cấp thông tin rõ ràng để người dùng có thể hiểu được nội dung của thẻ thông tin.
- Có thể dự đoán: Nội dung trong mỗi thẻ thông tin phải luôn tập trung vào một tác vụ dành cho người dùng. Điều này giúp người dùng dự đoán thông tin nào họ có thể xem trên thẻ thông tin này, từ đó cải thiện khả năng ghi nhớ.
- Phù hợp: Người dùng luôn mang theo thiết bị Wear OS mọi lúc mọi nơi. Hãy cân nhắc đến mức độ liên quan của nội dung trong thẻ thông tin với tình huống và bối cảnh hiện tại của người dùng.
Biểu tượng ứng dụng
Biểu tượng ứng dụng có thể xuất hiện ở đầu màn hình là do hệ thống tạo tự động từ biểu tượng trình chạy. Đừng đặt biểu tượng này trong bố cục của thẻ thông tin.
Nên
Không nên
Hướng dẫn thiết kế
Hãy ghi nhớ các nguyên tắc sau đây khi tạo thẻ thông tin.
Tập trung vào một nhiệm vụ
Nên
Không nên
Tạo thẻ thông tin riêng cho từng nhiệm vụ
Nếu ứng dụng của bạn hỗ trợ nhiều nhiệm vụ, hãy cân nhắc việc tạo nhiều thẻ thông tin cho từng nhiệm vụ mà ứng dụng hỗ trợ. Ví dụ: một ứng dụng thể dục có thể có cả thẻ thông tin mục tiêu và thẻ thông tin hoạt động tập thể dục.
Cho thấy các bản trình bày giúp xem nhanh biểu đồ và đồ thị
Nên
Không nên
Cho biết nội dung cập nhật dữ liệu mới nhất
Cho người dùng biết rõ mức độ gần đây của dữ liệu của thẻ thông tin. Nếu bạn hiện dữ liệu đã lưu vào bộ nhớ đệm, hãy cho biết lần cập nhật gần đây nhất.
Sử dụng tốc độ làm mới dữ liệu phù hợp
Chọn tốc độ cập nhật phù hợp cho thẻ thông tin của bạn, có cân nhắc tác động đến thời lượng pin của thiết bị. Nếu bạn đang sử dụng các nguồn dữ liệu nền tảng như nhịp tim và số bước, thì Wear OS sẽ kiểm soát tốc độ cập nhật cho bạn.
Trạng thái trống
Thẻ thông tin có hai loại trạng thái trống. Đối với cả hai, hãy sử dụng PrimaryLayout.
Lỗi hoặc quyền
Hãy thông báo cho người dùng biết rằng họ cần cập nhật các chế độ cài đặt hoặc lựa chọn ưu tiên trên thẻ thông tin.
Đăng nhập
Đưa ra lời kêu gọi hành động rõ ràng trên thẻ thông tin đăng nhập.
Hiển thị các hoạt động đang diễn ra
Khi thực hiện một hoạt động diễn ra trong thời gian dài (chẳng hạn như theo dõi bài tập thể dục hoặc phát nhạc), ứng dụng đó sẽ hiện tiến trình của hoạt động đang diễn ra ở một trong nhiều thẻ thông tin.
Nếu ứng dụng của bạn cũng hỗ trợ thẻ thông tin cho phép người dùng bắt đầu các hoạt động này, hãy làm như sau để giảm thiểu tình trạng nhầm lẫn của người dùng:
- Cho biết một hoạt động đang diễn ra hiện đang diễn ra.
- Nếu người dùng nhấn vào một thẻ thông tin như vậy, hãy mở ứng dụng và hiển thị hoạt động đang diễn ra. Không bắt đầu thực thể mới của hoạt động đang diễn ra.
Phần tử bắt buộc
- Dữ liệu chính: Nội dung chính mô tả hoạt động đó.
- Label (Nhãn): Cho thấy trạng thái của hoạt động.
Phần tử không bắt buộc
- Biểu tượng hoặc đồ hoạ: Có thể là ảnh động hoặc hình ảnh tĩnh.
- Khối thu gọn ở dưới cùng: Chứa lời kêu gọi hành động.
Chuyển động trên thẻ thông tin
Khi bạn thêm ảnh động vào thẻ thông tin, hãy giúp người dùng hiểu được các thay đổi:
Nên
Không nên
Bản xem trước
Hãy thêm bản xem trước thẻ thông tin để giúp người dùng thấy được nội dung xuất hiện trong trình quản lý thẻ thông tin trên thiết bị Wear OS hoặc thiết bị cầm tay của họ. Mỗi thẻ thông tin có thể có một hình ảnh xem trước đại diện. Hình ảnh đó phải đáp ứng các yêu cầu sau:
 |
Yêu cầu
|
 |
 |
| Một bản xem trước thẻ thông tin xuất hiện trong trình quản lý thẻ thông tin trên thiết bị Wear OS. | Một bản xem trước thẻ thông tin xuất hiện trong trình quản lý thẻ thông tin trên điện thoại. |
Nên
Không nên
Kích thước màn hình lớn hơn
Để phù hợp với nhiều kích thước màn hình Wear OS, mẫu bố cục ProtoLayout Material và bố cục thiết kế Figma bao gồm hành vi thích ứng, cho phép các khung tự động điều chỉnh. Các ô được thiết kế để lấp đầy chiều rộng có sẵn. Ô nội dung chính và nhãn phụ sẽ ôm lấy nội dung, nhưng vùng chứa chứa chúng sẽ lấp đầy chiều cao có sẵn. Lề được thiết lập dưới dạng tỷ lệ phần trăm, với lề trong bổ sung được thêm vào các ô ở cuối và trên cùng màn hình, có tính đến sự biến động của đường cong màn hình khi màn hình phóng to.
Để tối đa hoá kích thước màn hình lớn hơn, hãy sử dụng không gian bổ sung để cung cấp thêm giá trị bằng cách cho phép người dùng truy cập vào thông tin hoặc các tuỳ chọn bổ sung. Để đạt được những bố cục này, bạn cần tuỳ chỉnh thêm ngoài hành vi thích ứng tích hợp sẵn, chẳng hạn như bằng cách tạo một bố cục bổ sung có nhiều nội dung hơn hoặc bằng cách hiển thị các vùng bị ẩn trước đó sau điểm ngắt.
Xin lưu ý rằng điểm ngắt đề xuất được đặt ở kích thước màn hình 225 dp.
Ví dụ về cách thiết kế cho kích thước màn hình lớn hơn
Thêm nút
Thêm khung giờ và nội dung
Thêm văn bản
