Việc tạo kiểu cho các tiện ích một cách hiệu quả là điều quan trọng để mang lại trải nghiệm người dùng nhất quán và bắt mắt. Phần này đi sâu vào các khái niệm và kỹ thuật chính để xác định màu sắc và kiểu chữ nhằm tạo ra các tiện ích Android hữu ích và hấp dẫn nhất.
Màu
Sử dụng màu sắc để thể hiện phong cách và truyền tải ý nghĩa. Việc đặt màu sắc phù hợp cho các tiện ích là điều quan trọng để đảm bảo khả năng đọc, cá nhân hoá và tất nhiên là thể hiện bản sắc thương hiệu của ứng dụng.
Sử dụng các vai trò và mã hiệu màu Material để đáp ứng các nguyên tắc về độ tương phản hỗ trợ tiếp cận và hỗ trợ các tính năng màu động, chẳng hạn như màu do người dùng tạo và các giao diện tối hoặc sáng.
Khám phá hệ thống phân cấp trực quan thông qua các vai trò nhấn mạnh để tạo độ tương phản sống động trong các phần tử hoặc khám phá một giao diện tuỳ chỉnh thú vị hơn thể hiện thương hiệu của bạn.
Hãy tham khảo hướng dẫn về màu sắc trong Material Design để tìm hiểu thêm về vai trò của màu sắc.
Hình dạng
Hình dạng của tiện ích sẽ tạo nên cảm xúc cho tiện ích. Đối với các tiện ích hình chữ nhật, hãy sử dụng thuộc tính bán kính góc hệ thống. Thuộc tính này tạo ra sự nhất quán trên nhiều thiết bị và giúp ngăn nội dung tiện ích bị cắt.
Nếu tiện ích của bạn hiển thị nội dung dữ liệu tối thiểu, chẳng hạn như ảnh, thời tiết hoặc bài hát đang phát, hãy thử tạo cho toàn bộ tiện ích một hình dạng biểu cảm để mang đến một luồng năng lượng thú vị cho màn hình chính của người dùng. Nếu bạn có bố cục và dữ liệu phức tạp hơn, hãy cân nhắc sử dụng các hình dạng biểu cảm cho hệ thống phân cấp trực quan, làm nổi bật nội dung mới hoặc lời kêu gọi hành động.
Để tìm hiểu thêm, hãy xem phần Triển khai các góc bo tròn.
Giao diện động
Kể từ Android 12, một tiện ích có thể sử dụng màu giao diện của thiết bị cho các nút, nền và các thành phần khác. Điều này giúp đảm bảo tính nhất quán về mặt hình ảnh giữa các tiện ích, biểu tượng trên màn hình chính và hình nền, mang đến cho người dùng Android trải nghiệm nhất quán hơn. Việc sử dụng các mã thông báo màu được cung cấp sẽ giúp tiện ích của bạn trông được tích hợp trên các giao diện thiết bị do nhiều nhà sản xuất thiết bị cung cấp và các giao diện động do người dùng đặt.
Giao diện sáng và tối
Giao diện tối là phiên bản ánh sáng yếu của giao diện người dùng trên thiết bị, hiển thị hầu hết các màu bề mặt tối. Ngày càng có nhiều người dùng chuyển sang giao diện tối để cải thiện thời lượng pin và giảm mỏi mắt. Nếu không thích ứng với giao diện tối, thì tiện ích của bạn sẽ xuất hiện không đúng chỗ và có thể khiến người dùng khó chịu.
Kiểu chữ
Kiểu chữ giúp nội dung trở nên dễ đọc và đẹp mắt. Sử dụng cỡ chữ và độ đậm của chữ để thiết lập một hệ thống phân cấp rõ ràng, hướng mắt người dùng đến các phần tử quan trọng nhất. Chú ý đến khoảng cách dòng và khoảng cách chữ (kerning) để cải thiện khả năng đọc, đặc biệt là đối với những màn hình hiển thị văn bản nhỏ trong không gian hạn chế của một tiện ích.
Hệ phân cấp
Hệ thống phân cấp (hierarchy) được thể hiện thông qua mức chênh lệch về độ dày phông chữ, kích thước, chiều cao dòng và khoảng cách giữa các chữ cái. Thang kiểu chữ được cập nhật sẽ sắp xếp các kiểu văn bản thành 5 vai trò với tên gọi mô tả mục đích của vai trò đó. Năm kiểu văn bản là hiển thị, dòng tiêu đề, tiêu đề, phụ đề và nội dung. Các vai trò mới không phụ thuộc vào thiết bị, giúp áp dụng dễ dàng hơn trong nhiều trường hợp sử dụng.
Mặc dù các tiện ích dùng phông chữ hệ thống, nhưng bạn vẫn có thể thêm các chi tiết biểu cảm bằng thang kiểu chữ ấn tượng: trở nên nổi bật hơn với tiêu đề, nhãn và dữ liệu.