Google Workspace 插件的界面样式指南

Google Workspace 插件应该与其扩展的主机应用的样式和布局一致。它们应使用熟悉的控件和行为自然地扩展界面。此处提供的指南介绍了处理提供优质用户体验的文字、图片、控件和品牌信息的方法。

如果您的插件会打开单独的网页,而这些网页是插件运行不可或缺的组成部分(例如该插件的设置页面),请确保这些网页也遵循这些样式指南。

使用 Google Workspace 插件设计套件

为了快速打造顺畅的用户体验,广告设计人员可以使用 Figma 上提供的Google Workspace 插件界面设计套件。您可以创建免费的 Figma 帐号,也可以向组织管理员申请许可。

浏览基于卡片的界面的组件,并使用内置模板来创建和直观呈现插件。

获取设计套件

文字和图片

此部分介绍如何在插件中正确使用文本和图片。

插件名称

您必须在项目清单中以及配置插件以进行发布时设置插件的名称。该名称会显示在许多位置,例如 Google Workspace Marketplace 列表和菜单中。选择名称时:

  • 采用词首字母大写形式。
  • 除非是品牌的一部分,否则避免使用标点符号,尤其是括号。
  • 尽量简短 - 不超过 15 个字符。长名称可能会在 Marketplace 的商品详情和其他地方被自动截断。 Google Workspace
  • 请勿在插件名称中包含“Google”或“Gmail”或其他 Google 产品名称。
  • 请勿在插件名称中包含“插件”一词。
  • 省去版本信息。

写作风格

您无需编写太多内容。大多数操作都应通过图标、布局和短标签来清晰区分。如果您发现某个插件需要比短标签更全面的说明,那么最好创建一个描述该插件的独立网页并链接到该插件。

编写界面文本时:

  • 采用句首字母大写形式(尤其是按钮、标签和卡片操作时)。
  • 首选简短的简短文本,而不是专业术语或首字母缩略词。

通用操作和卡片操作

如果您在插件中使用通用操作卡片操作,它们会在您指定的卡片中显示为菜单项。您可以选择这些菜单中用于执行这些操作的文本。选择要使用的文本时:

  • 避免使用仅重复插件名称的菜单文本。
  • 每个菜单项都以操作字词(例如“运行”、“配置”或“创建”)开头。
  • 描述任务,而不是操作显示的界面组件。
  • 如果您的操作开始了某个工作流,并且没有一个动词描述其作用,请将其命名为“Start”。
  • 尽量减少菜单项的数量,以免强制用户滚动浏览大型列表。如果您要执行更多操作,请考虑使用多张卡片,每张卡片各有不同的操作。

错误消息

出现问题时,请务必使用简单明了的语言。从用户的角度说明问题,并提出如何解决问题的建议。

  • 不允许用户看到您的代码抛出的任何异常。而应使用 try...catch 语句来拦截异常,然后显示方便用户使用的错误消息。
  • 在发布之前,请确认您的插件未在界面中显示调试信息。

帮助内容

您可能需要设计卡片,用于显示帮助信息或向用户说明插件的操作。如果您确实要为插件构建帮助内容,请注意:

  • 请尽可能在项目符号或编号列表中显示说明。引导用户了解最终结果,提供对命名界面元素的明确引用。
  • 请务必按照说明明确说明所有要求,例如以特定方式设置电子表格。
  • 您可以链接到外部帮助内容,例如支持网页。

映像

插件中使用的图片可以是内置图标类型之一,也可以是网址指定的公开托管图片。使用托管图片时,请确保所有可使用该插件的用户都能访问这些图片。

控件

本部分提供了交互式微件的用户体验指南。

按钮

使用按钮(而不是其他微件)来控制界面的主要操作。

  • 大多数文本按钮标签都应以动词开头。
  • 在大多数情况下,按钮行的数量不应超过三个。

装饰文字

DecoratedText 微件可让您使用图标、按钮或开关来呈现文本内容。

  • 为文本内容使用句首字母大写形式。
  • 如果 DecoratedText 微件无法适应可用空间,则其文本会被截断。因此,请始终尝试使文本内容尽可能简短。

选择输入

您可以在插件中使用各种选择输入微件:下拉选择框、复选框和单选按钮。

  • 在用户可选择多个选项或者根本没有选项时,使用复选框。 如果必须只选择一个选项,请使用单选按钮(或选择菜单)。 提供简短的备用列表,同时尝试在界面中节省空间时,请使用下拉菜单。
  • 为分配给每个选项的文本使用句首字母大写形式。
  • 避免使用选择更改来触发难以做出的主要重大操作,因为用户在做出选择时经常会犯错。不妨考虑添加一个按钮,用于读取当前选择值,然后触发操作。
  • 对于下拉菜单,请按字母顺序或按所有用户都能理解的逻辑方案对选项进行排序(例如,按顺序显示星期几,从星期日或星期一开始)。
  • 将给定选择输入微件中的选项数量限制为合理的数字。如果选项太多,用户可能会觉得很难使用该微件。在这些情况下,不妨考虑将此选项拆分为不同的类别和多个微件。

文本输入

文本输入可让用户输入字符串数据。

  • 请勿使用文本输入让用户输入一组特定可能的条目之一。请改用下拉菜单。
  • 使用提示和建议,帮助用户输入正确的格式和内容。
  • 如果要输入的文本超过几个字词,请使用多行文本输入。

品牌标示

本部分将介绍向插件界面添加品牌元素的用户体验指南。

在插件中

如果您希望在插件界面中加入品牌信息,请保持简短。 这有助于用户专注于您的附加功能。

  • 插件的所有方面都必须遵守品牌推广指南
  • 请勿添加“Google”、Gmail 或其他 Google 产品名称。
  • 请勿添加 Google 产品图标,即使图标进行了更改。
  • 请勿在品牌文字中添加“附加”一词。
  • 品牌文字不应超过几个字词。

在 Google Workspace Marketplace 中

配置用于发布的插件时,您需要提供许多图形和文本资源来构建Google Workspace Marketplace 产品详情。

商品详情和这些资源的所有方面都必须遵守品牌推广指南