Hướng dẫn về 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ữ mà 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 sử dụng các chế độ kiểm soát và hành vi 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, chế độ kiểm soát và hoạt động xây dựng thương hiệu nhằm mang lại trải nghiệm chất lượng cao cho người dùng.

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

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

Phần này hướng dẫ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 tệp kê khai dự án và khi định cấu hình tiện ích bổ sung để xuất bản. Tên này xuất hiện ở nhiều nơi, chẳng hạn như trang thông tin trên Google Workspace Marketplace và trong các trình đơn. Khi chọn tên:

  • Sử dụng cách viết hoa chữ cái đầu.
  • Tránh dùng dấu chấm câu, đặc biệt là dấu ngoặc đơn, trừ phi đó là một phần trong thương hiệu của bạn.
  • Hãy giữ cho tên ngắn gọn (tốt nhất là không quá 15 ký tự). Tên dài có thể 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 vào tên tiện ích bổ sung.
  • Đừng thêm từ "tiện ích bổ sung" vào tên tiện ích bổ sung.
  • Không đưa thông tin phiên bản vào.

Phong cách viết

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

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

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

Thao tác chung và thao tác với thẻ

Nếu bạn sử dụng thao tác chung hoặc thao tác trên thẻ trong tiện ích bổ sung, thì các thao tác này sẽ xuất hiện dưới dạng mục trong trình đơn trong thẻ mà 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 thao tác này. Khi chọn văn bản để sử dụng:

  • Tránh văn bản trong 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, chẳng hạn như "Chạy", "Định cấu hình" hoặc "Tạo".
  • Mô tả việc cần làm, chứ không phải thành phần giao diện người dùng mà thao tác hiển thị.
  • Nếu thao tác của bạn bắt đầu một quy trình và không có động từ nào mô tả những gì thao tác đó làm, hãy gọi thao tác đó là "Bắt đầu".
  • Giữ số lượng mục trong trình đơn ở mức thấp để tránh buộc người dùng phải cuộn qua một danh sách lớn. Nếu bạn có nhiều thao tác cần triển khai, 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 xảy ra sự cố, bạn cần sử dụng ngôn ngữ đơn giản. Giải thích vấn đề theo 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 nhìn thấy bất kỳ trường hợp ngoại lệ nào mà mã của bạn đưa ra. Thay vào đó, hãy dùng câu lệnh try...catch để chặn các trường hợp ngoại lệ, sau đó hiển thị thông báo lỗi 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 rằng 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

Bạn có thể muốn thiết kế các 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 tạo nội dung trợ giúp cho tiện ích bổ sung, 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 danh sách được đánh số. Hướng dẫn người dùng đến kết quả cuối cùng, có tham chiếu rõ ràng đến các phần tử được đặt tên trên giao diện người dùng.
  • Đảm bảo hướng dẫn của bạn giải thích rõ mọi yêu cầu, chẳng hạn như cách thiết lập bảng tính.
  • Bạn có thể liên kết đến 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 được 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 một URL chỉ định. Khi sử dụng hình ảnh được lưu trữ, hãy đảm bảo rằng mọi người có thể truy cập vào những hình ảnh đó khi sử dụng tiện ích bổ sung của bạn.

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 tiện ích tương tác.

Nút

Sử dụng các nút để kiểm soát các thao tác chính của giao diện người dùng thay vì các tiện ích khác.

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

DecoratedText

Tiện ích DecoratedText 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 công tắc.

  • 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 DecoratedText sẽ bị cắt bớt nếu không vừa với không gian có sẵn. Vì vậy, hãy luôn cố gắng giữ nội dung văn bản ngắn gọn nhất có thể.

Đầu vào lựa chọn

Bạn có thể sử dụng nhiều tiện ích đầu vào lựa chọn trong tiện ích bổ sung của mình: hộp lựa 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 lựa chọn hoặc không chọn lựa chọn nào. Sử dụng nút chọn (hoặc một trình đơn chọn) khi người dùng phải chọn chính xác 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 chỉ định cho từng lựa chọn.
  • Tránh dùng các thay đổi về lựa chọn để kích hoạt những hành động lớn, khó đảo ngược, vì mọi người thường mắc lỗi khi lựa chọn. Thay vào đó, hãy cân nhắc việc thêm một nút đọc các giá trị lựa chọn hiện tại rồi kích hoạt hành động.
  • Đối với trình đơn thả xuống, hãy sắp xếp các lựa chọn theo bảng chữ cái hoặc theo một sơ đồ hợp lý mà tất cả người dùng đều có thể 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 lựa chọn trong một tiện ích đầu vào lựa chọn nhất định ở một số lượng hợp lý. Nếu có quá nhiều lựa chọn, người dùng có thể gặp khó khăn khi sử dụng tiện ích này. Trong những trường hợp đó, hãy cân nhắc chia lựa chọn thành nhiều danh mục và nhiều tiện ích.

Nhập văn bản

Đầu vào văn bản là nơi để người dùng nhập dữ liệu chuỗi.

  • Không dùng phương thức nhập văn bản để yêu cầu người dùng nhập một trong số các mục nhập có thể có trong một nhóm cụ thể. Thay vào đó, hãy sử dụng một trình đơn thả xuống.
  • Sử dụng gợi ý và đề xuất để giúp người dùng nhập văn bản có định dạng và nội dung chính xác.
  • Sử dụng chế độ nhập văn bản nhiều dòng nếu văn bản cần nhập dài hơn vài 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 của tiện ích bổ sung.

Trong tiện ích bổ sung

Nếu bạn muốn đưa thương hiệu vào giao diện người dùng của tiện ích bổ sung, hãy giữ cho thương hiệu xuất hiện 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 đều phải tuân thủ nguyên tắc sử dụng thương hiệu.
  • Không thêm từ "Google", "Gmail" hoặc tên của các sản phẩm khác của Google.
  • Đừng thêm biểu tượng sản phẩm của Google, ngay cả khi bạn đã chỉnh sửa.
  • Đừng thêm từ "tiện ích bổ sung" vào văn bản thương hiệu.
  • Văn bản thương hiệu không được dài quá vài từ.

Trong Google Workspace Marketplace

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

Tất cả các 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 sử dụng thương hiệu.