Guía de estilo de la IU para complementos de Google Workspace

Los complementos de Google Workspace deben ser coherentes con el estilo y el diseño de la aplicación host que extienden. Deben extender la IU de forma natural con controles y comportamientos conocidos. Los lineamientos que se presentan aquí describen formas de manejar el texto, las imágenes, los controles y el desarrollo de la marca que promueven una experiencia del usuario de alta calidad.

Si el complemento abre páginas web separadas que forman parte integral del funcionamiento del complemento (como una página de configuración del complemento), asegúrate de que esas páginas web también sigan estos lineamientos de estilo.

Imágenes y texto

En esta sección, se explica cómo usar correctamente el texto y las imágenes en el complemento.

Nombre del complemento

Debes establecer el nombre de tu complemento en el manifiesto del proyecto y cuando configures el complemento para su publicación. El nombre aparece en muchos lugares, como en la ficha de Google Workspace Marketplace y dentro de los menús. Cuando elijas un nombre, ten en cuenta lo siguiente:

  • Usa mayúsculas de título.
  • Evita los signos de puntuación, especialmente los paréntesis, a menos que sea parte de tu marca.
  • Sea breve; es mejor usar 15 caracteres o menos. Es posible que los nombres largos se trunquen automáticamente en la ficha de Google Workspace Marketplace y en otros lugares.
  • No incluyas las palabras “Google”, “Gmail” ni otros nombres de productos de Google en el nombre del complemento.
  • No incluyas la palabra "complemento" en el nombre del complemento.
  • No incluyas la información de la versión.

Estilo de escritura

No deberías tener que escribir mucho. La mayoría de las acciones deben aclararse mediante la iconografía, el diseño y las etiquetas cortas. Si crees que una parte de tu complemento necesita una explicación más extensa que las que ofrecen las etiquetas cortas, se recomienda crear una página web independiente que describa tu complemento y agregar un vínculo a él.

Cuando escribas texto de la IU:

  • Usa mayúscula inicial (especialmente para botones, etiquetas y acciones de tarjetas).
  • Prefiere un texto breve y simple sin jerga ni acrónimos.

Acciones universales y de tarjetas

Si usas acciones universales o acciones de tarjetas en tu complemento, aparecen como elementos de menú en las tarjetas que definas. Puedes elegir el texto que se usará en estos menús para estas acciones. Cuando elijas el texto a usar, ten en cuenta lo siguiente:

  • Evita texto del menú que simplemente repita el nombre de tu complemento.
  • Inicia cada elemento del menú con una palabra de acción como "Ejecutar", "Configurar" o "Crear".
  • Describe la tarea, no el componente de la IU que muestra la acción.
  • Si tu acción inicia un flujo de trabajo y no hay ningún verbo único que describa lo que hace, llámalo "Iniciar".
  • Mantén una pequeña cantidad de elementos de menú para evitar que el usuario se desplace por una lista grande. Si tienes que implementar más acciones, considera usar varias tarjetas con diferentes acciones en cada una.

Mensajes de error

Cuando algo sale mal, es importante usar un lenguaje sencillo. Explica el problema desde el punto de vista del usuario y sugiere cómo solucionarlo.

  • No permitas que el usuario vea ninguna excepción que arroja tu código. En su lugar, usa declaraciones try...catch para interceptar excepciones y, luego, mostrar un mensaje de error fácil de usar.
  • Antes de publicar, comprueba que tu complemento no muestre información de depuración en la IU.

Contenido de ayuda

Es posible que quieras diseñar tarjetas que muestren información de ayuda o expliquen el funcionamiento del complemento al usuario. Si creas contenido de ayuda para tu complemento, recuerda lo siguiente:

  • Cuando sea posible, muestra las instrucciones en una lista numerada o con viñetas. Guía a los usuarios hasta el resultado final con referencias claras a los elementos con nombre de la IU.
  • Asegúrate de que tus instrucciones expliquen claramente cualquier requisito, como configurar una hoja de cálculo de cierta manera.
  • No dudes en incluir vínculos a contenido de ayuda externo, como páginas web de respaldo.

Imágenes

Las imágenes que se usan en tu complemento pueden ser de uno de los tipos de íconos integrados o de una imagen alojada de forma pública que se especifica mediante una URL. Cuando uses imágenes alojadas, asegúrate de que todas las personas que puedan usar el complemento puedan acceder a ellas.

Controles

En esta sección, se proporcionan lineamientos sobre la experiencia del usuario para widgets interactivos.

Botones

Usa botones para controlar las acciones principales de la interfaz de usuario en lugar de otros widgets.

  • La mayoría de las etiquetas de los botones de texto deben comenzar con un verbo.
  • En la mayoría de los casos, las filas de botones deben limitarse a tres o menos botones.

TextoDecorado

Los widgets DecoratedText te permiten presentar contenido de texto con íconos, botones o interruptores.

  • Usa mayúscula inicial en la oración para el contenido de texto.
  • El texto de un widget de DecoratedText se trunca si no puede caber en el espacio disponible. Por este motivo, siempre intenta que el contenido de texto sea lo más breve posible.

Entradas de selección

Puedes usar una variedad de widgets de entrada de selección en tu complemento, como cuadros de selección desplegables, casillas de verificación y botones de selección.

  • Usa casillas de verificación cuando las personas puedan seleccionar varias opciones o ninguna. Usa botones de selección (o un menú de selección) cuando debas seleccionar solo una opción. Usa menús desplegables cuando proporciones una lista corta de alternativas y, a la vez, intentes ahorrar espacio en la IU.
  • Usa mayúscula inicial en el texto asignado a cada opción.
  • Evita usar cambios de selección para activar acciones importantes y difíciles de revertir, ya que las personas a menudo cometen errores cuando se hacen selecciones. En su lugar, considera agregar un botón que lea los valores de selección actuales y, luego, active la acción.
  • En el caso de los menús desplegables, ordena las opciones alfabéticamente o por un esquema lógico que todos los usuarios puedan comprender (por ejemplo, presentar los días de la semana en orden, a partir del domingo o el lunes).
  • Restringe la cantidad de opciones en un widget de entrada de selección determinado a un número razonable. Si hay demasiadas opciones, los usuarios pueden tener dificultades para usar el widget. En esos casos, considera dividir la opción en diferentes categorías y varios widgets.

Entradas de texto

Las entradas de texto proporcionan un lugar para que los usuarios ingresen datos de cadenas.

  • No uses una entrada de texto para que el usuario sea uno de un conjunto específico de entradas posibles. En su lugar, usa una selección desplegable.
  • Usa sugerencias para ayudar al usuario a ingresar texto con el formato y el contenido correctos.
  • Usa entradas de texto de varias líneas si el texto que se ingresará tiene más de unas pocas palabras.

Desarrollo de la marca

En esta sección, se proporcionan lineamientos de la experiencia del usuario para agregar elementos de marca a la interfaz de tu complemento.

En tu complemento

Si deseas incluir elementos de desarrollo de la marca en tu IU complementaria, hazlo breve y claro. Esto ayuda a las personas a enfocarse en la funcionalidad del complemento.

  • Todos los aspectos de tu complemento deben seguir los lineamientos para el desarrollo de la marca.
  • No incluyas la palabra "Google", "Gmail" ni otros nombres de productos de Google.
  • No incluyas íconos de productos de Google, incluso si se modificaron.
  • No incluyas la palabra "complemento" en el texto de tu marca.
  • El texto de desarrollo de la marca debe contener solo unas pocas palabras.

En Google Workspace Marketplace

Cuando configuras tu complemento para su publicación, proporcionas una serie de recursos gráficos y de texto a fin de compilar la ficha de Google Workspace Marketplace.

Todos los aspectos de la ficha de Play Store y estos elementos deben cumplir con los lineamientos para el desarrollo de la marca.