Hướng dẫn định kiểu giao diện người dùng cho Tiện ích bổ sung của Google Workspace

Tiện ích bổ sung của Google Workspace phải nhất quán với kiểu và bố cục của ứng dụng lưu trữ chúng mở rộng. Họ nên mở rộng giao diện người dùng một cách tự nhiên bằng cách dùng các hành vi và điều khiển quen thuộc. Các nguyên tắc được trình bày ở đây mô tả cách xử lý văn bản, hình ảnh, điều khiển và thương hiệu giúp quảng bá trải nghiệm người dùng chất lượng cao.

Nếu tiện ích bổ sung của bạn mở ra các trang web riêng biệt là một phần không thể thiếu trong tiện ích bổ sung hoạt động (chẳng hạn như trang cài đặt cho tiện ích bổ sung), hãy đảm bảo các trang web đó cũng tuân theo các nguyên tắc về phong cách này.

Văn bản và hình ảnh

Phần này hướng dẫn bạn cách sử dụng văn bản và hình ảnh đúng cách trong tiện ích bổ sung.

Tên tiện ích bổ sung

Bạn phải đặt tên cho tiện ích bổ sung trong dự án của tiện ích đó tệp kê khai và khi bạn định cấu hình tiện ích bổ sung cho ấn phẩm. Tên này xuất hiện ở nhiều nơi, chẳng hạn như Google Workspace Marketplace và trong trình đơn. Khi chọn một tên:

  • Sử dụng viết hoa chữ cái đầu.
  • Tránh dùng dấu câu, đặc biệt là dấu ngoặc đơn, trừ phi đó là một phần của thương hiệu.
  • Ngắn gọn – tốt nhất là 15 ký tự trở xuống. Tên dài có thể là tự động bị cắt bớt trong trang thông tin trên Google Workspace Marketplace và những nơi khác.
  • Đừng thêm các từ "Google", "Gmail" hoặc tên sản phẩm khác của Google trong tên tiện ích bổ sung.
  • Đừng thêm từ "tiện ích bổ sung" trong tên tiện ích bổ sung.
  • Bỏ qua thông tin phiên bản.

Phong cách viết

Bạn không cần phải viết nhiều. Bạn phải làm rõ hầu hết các hành động thông qua hình tượng học, bố cục và nhãn ngắn. Nếu bạn thấy một phần tiện ích bổ sung của mình cần nhiều lời giải thích hơn những nhãn ngắn có thể cung cấp, tốt nhất là bạn có thể tạo một trang web riêng mô tả tiện ích bổ sung của mình và liên kết đến tiện ích bổ sung đó.

Khi viết văn bản giao diện người dùng:

  • Sử dụng cách viết hoa đầu câu (đặc biệt là đối với nút, nhãn và thao tác với thẻ).
  • Ưu tiên văn bản ngắn, đơn giản, không có biệt ngữ hoặc từ viết tắt.

Thao tác chung và thao tác trên thẻ

Nếu bạn sử dụng các thao tác chung hoặc hành động đối với thẻ trong tiện ích bổ sung, chúng xuất hiện dưới dạng mục trong trình đơn trong thẻ bạn xác định. Bạn có thể chọn văn bản được dùng trong các trình đơn này cho những yêu cầu này hành động. Khi chọn văn bản để sử dụng:

  • Tránh dùng văn bản trên trình đơn chỉ lặp lại tên của tiện ích bổ sung.
  • Bắt đầu mỗi mục trong trình đơn bằng một từ hành động như "Run", "Configure" (Định cấu hình) hoặc "Tạo".
  • Mô tả tác vụ, không phải thành phần giao diện người dùng mà thao tác hiển thị.
  • Nếu hành động của bạn bắt đầu một luồng công việc và không có một động từ nào mô tả chức năng của chương trình, hãy gọi nó là "Bắt đầu".
  • Giữ số lượng mục nhỏ trong trình đơn để tránh buộc người dùng phải cuộn thông qua một danh sách lớn. Nếu bạn cần triển khai thêm nhiều hành động, hãy cân nhắc sử dụng nhiều thẻ với các thao tác khác nhau trên mỗi thẻ.

Thông báo lỗi

Khi có vấn đề xảy ra, bạn cần sử dụng ngôn từ đơn giản. Giải thích vấn đề từ quan điểm của người dùng và đề xuất cách khắc phục.

  • Không cho phép người dùng xem bất kỳ trường hợp ngoại lệ nào mà mã của bạn gửi ra. Thay vào đó, sử dụng câu lệnh try...catch để chặn các ngoại lệ, sau đó hiển thị thân thiện với người dùng.
  • Trước khi xuất bản, hãy kiểm tra để đảm bảo tiện ích bổ sung của bạn không hiển thị thông tin gỡ lỗi trong giao diện người dùng.

Nội dung trợ giúp

Có thể bạn muốn thiết kế thẻ hiển thị thông tin trợ giúp hoặc giải thích hoạt động của tiện ích bổ sung cho người dùng. Nếu bạn xây dựng nội dung trợ giúp cho hãy nhớ:

  • Nếu có thể, hãy trình bày hướng dẫn dưới dạng danh sách có dấu đầu dòng hoặc được đánh số. Người dùng đi bộ đến kết quả cuối cùng, với thông tin tham chiếu rõ ràng đến các thành phần được đặt tên trên giao diện người dùng.
  • Đảm bảo rằng các hướng dẫn của bạn giải thích rõ ràng mọi yêu cầu, chẳng hạn như thiết lập vào bảng tính theo một cách nhất định.
  • Vui lòng liên kết tới nội dung trợ giúp bên ngoài, chẳng hạn như các trang web hỗ trợ.

Hình ảnh

Hình ảnh sử dụng trong tiện ích bổ sung của bạn là một trong những loại biểu tượng tích hợp sẵn hoặc hình ảnh được lưu trữ công khai do URL chỉ định. Khi sử dụng hình ảnh được lưu trữ, đảm bảo rằng tất cả những người sử dụng tiện ích bổ sung của bạn đều có thể truy cập vào các tệp này.

Các chế độ kiểm soát

Phần này cung cấp các nguyên tắc về trải nghiệm người dùng cho các tiện ích tương tác.

Nút

Dùng các nút để kiểm soát các thao tác chính trên giao diện người dùng thay vì các tiện ích khác.

  • Hầu hết các nhãn nút văn bản phải bắt đầu bằng một động từ.
  • Trong hầu hết các trường hợp, các hàng nút chỉ nên có tối đa 3 nút.

DecoratedText

Tiện ích trang trí (decorationText) cho phép bạn trình bày nội dung văn bản bằng biểu tượng, nút hoặc nút chuyển.

  • Sử dụng cách viết hoa đầu câu cho nội dung văn bản.
  • Văn bản của tiện ích decorationdText bị cắt ngắn nếu không vừa với dung lượng còn trống. Vì lý do này, hãy luôn cố gắng giữ nội dung văn bản ngắn gọn nhất có thể.

Mục nhập lựa chọn

Bạn có thể sử dụng nhiều tiện ích nhập lựa chọn trong tiện ích bổ sung: hộp chọn thả xuống, hộp đánh dấu và nút chọn.

  • Sử dụng hộp đánh dấu khi mọi người có thể chọn nhiều mục hoặc hoàn toàn không chọn mục nào. Sử dụng nút chọn (hoặc trình đơn chọn) khi phải chọn đúng một lựa chọn. Sử dụng trình đơn thả xuống khi cung cấp một danh sách ngắn các lựa chọn thay thế trong khi cố gắng tiết kiệm không gian trong giao diện người dùng.
  • Sử dụng cách viết hoa đầu câu cho văn bản được gán cho mỗi phương án.
  • Tránh sử dụng các thay đổi lựa chọn để kích hoạt các hành động lớn, khó đảo ngược, bởi vì mọi người thường mắc sai lầm khi đưa ra lựa chọn. Thay vào đó, hãy cân nhắc thêm một nút đọc các giá trị lựa chọn hiện tại, sau đó kích hoạt hành động.
  • Đối với trình đơn thả xuống, hãy sắp xếp các mục theo thứ tự bảng chữ cái hoặc theo lược đồ logic mà tất cả người dùng đều hiểu được (chẳng hạn như trình bày các ngày trong tuần theo thứ tự, bắt đầu từ Chủ Nhật hoặc thứ Hai).
  • Giới hạn số lượng tuỳ chọn trong một giá trị nhập cho trước thành một con số hợp lý. Nếu có quá nhiều lựa chọn, người dùng có thể thấy khó sử dụng tiện ích. Trong những trường hợp đó, hãy cân nhắc phá vỡ tuỳ chọn thành các danh mục khác nhau và nhiều tiện ích.

Mục nhập văn bản

Mục nhập văn bản cho phép người dùng nhập dữ liệu chuỗi.

  • Không sử dụng phương thức nhập văn bản để khiến người dùng nhập một trong các các mục nhập có thể có. Thay vào đó, hãy sử dụng lựa chọn thả xuống.
  • Sử dụng các gợi ý và đề xuất để giúp người dùng nhập văn bản chính xác và nội dung.
  • Sử dụng mục nhập văn bản nhiều dòng nếu văn bản cần nhập nhiều hơn một vài các từ.

Xây dựng thương hiệu

Phần này cung cấp các nguyên tắc về trải nghiệm người dùng để thêm các thành phần thương hiệu vào giao diện tiện ích bổ sung của bạn.

Trong tiện ích bổ sung của bạn

Nếu bạn muốn đưa thương hiệu vào giao diện người dùng tiện ích bổ sung của mình, hãy tạo giao diện người dùng ngắn gọn và đơn giản. Điều này giúp mọi người tập trung vào chức năng của tiện ích bổ sung.

  • Tất cả các khía cạnh của tiện ích bổ sung phải tuân thủ nguyên tắc ghi nhãn.
  • Đừng thêm từ “Google”, "Gmail" hoặc tên sản phẩm khác của Google.
  • Đừng dùng biểu tượng sản phẩm của Google, ngay cả khi chúng đã được chỉnh sửa.
  • Đừng thêm từ "tiện ích bổ sung" trong văn bản thương hiệu.
  • Văn bản thương hiệu không nên dài quá vài từ.

Trong Google Workspace Marketplace

Khi bạn định cấu hình tiện ích bổ sung cho ấn bản, bạn cung cấp một số thành phần đồ hoạ và nội dung văn bản để tạo Trang thông tin trên Google Workspace Marketplace.

Mọi khía cạnh của trang thông tin trên Cửa hàng Play và những thành phần này đều phải tuân thủ nguyên tắc ghi nhãn.