Os complementos do Google Workspace precisam ser consistentes com o estilo e o layout do host aplicativo que eles estendem. Eles precisam estender a interface de maneira natural usando controles e comportamentos familiares. As diretrizes apresentadas aqui descrevem maneiras de lidar com texto, imagens, controles e branding que promovem uma experiência do usuário de alta qualidade.
Se o complemento abrir páginas da Web separadas que são parte integrante da operação dele (como uma página de configurações), essas páginas também precisam seguir estas diretrizes de estilo.
Texto e imagens
Esta seção explica como usar texto e imagens no complemento.
Nome do complemento
Você precisa definir o nome do complemento no manifesto do projeto e ao configurar o complemento para publicação. O nome aparece em muitos lugares, como na página "Detalhes do app" do Google Workspace Marketplace e nos menus. Ao escolher um nome:
- Use letras maiúsculas no título.
- Evite pontuação, principalmente parênteses, a menos que faça parte da sua marca.
- Mantenha o nome curto: o ideal é ter 15 caracteres ou menos. Nomes longos podem ser truncados automaticamente na página do Google Workspace Marketplace e em outros lugares.
- Não inclua as palavras "Google", "Gmail" ou outros nomes de produtos do Google no nome do complemento.
- Não inclua a palavra "complemento" no nome do complemento.
- Não inclua informações de versão.
Estilo de escrita
Não é necessário escrever muito. A maioria das ações precisa ser clara por meio de iconografia, layout e rótulos curtos. Se você achar que uma parte do complemento precisa de uma explicação mais detalhada do que os rótulos curtos podem oferecer, é recomendável criar uma página da Web separada descrevendo o complemento e criar um link para ela.
Ao escrever texto da interface:
- Use letras maiúsculas (especialmente para botões, rótulos e ações de card).
- Prefira textos curtos e claros, sem jargões ou acrônimos.
Ações universais e de card
Se você usar ações universais ou ações de card no complemento, elas vão aparecer como itens de menu nos cards definidos. Você pode escolher o texto usado nesses menus para essas ações. Ao escolher o texto a ser usado:
- Evite texto de menu que repita o nome do complemento.
- Comece cada item de menu com uma palavra de ação, como "Executar", "Configurar" ou "Criar".
- Descreva a tarefa, não o componente da interface que a ação mostra.
- Se a ação iniciar um fluxo de trabalho e não houver um único verbo que descreva o que ela faz, chame-a de "Iniciar".
- Mantenha o número de itens de menu pequeno para evitar que o usuário precise rolar uma lista grande. Se você tiver mais ações para implementar, considere usar vários cards com ações diferentes em cada um.
Mensagens de erro
Quando algo dá errado, é importante usar linguagem simples. Explique o problema do ponto de vista do usuário e sugira como corrigi-lo.
- Não permita que o usuário veja exceções geradas pelo código. Em vez disso, use instruções
try...catchpara interceptar exceções e mostrar uma mensagem de erro fácil de usar. - Antes de publicar, verifique se o complemento não mostra informações de depuração na interface.
Conteúdo Help
Talvez você queira ou precise criar cards que mostrem informações de ajuda ou expliquem a operação do complemento ao usuário. Se você criar conteúdo de ajuda para o complemento, lembre-se de:
- Quando possível, mostre instruções em uma lista numerada ou com marcadores. Oriente os usuários até o resultado final, com referências claras a elementos de interface nomeados.
- Verifique se as instruções explicam claramente todos os requisitos, como configurar uma planilha de uma determinada maneira.
- Você pode criar links para conteúdo de ajuda externo, como páginas da Web de suporte.
Imagens
As imagens usadas no complemento são um dos tipos de ícones integrados ou uma imagem hospedada publicamente especificada por um URL. Ao usar imagens hospedadas, verifique se elas estão acessíveis a todos que podem usar o complemento.
Controles
Esta seção fornece diretrizes de experiência do usuário para widgets interativos.
Botões
Use botões para controlar as principais ações da interface do usuário, em vez de outros widgets.
- A maioria dos rótulos de botões de texto precisa começar com um verbo.
- As linhas de botões precisam ser limitadas a três ou menos botões na maioria dos casos.
DecoratedText
Os widgets DecoratedText permitem apresentar conteúdo de texto com ícones, botões ou interruptores.
- Use letras maiúsculas para o conteúdo de texto.
- O texto de um widget DecoratedText é truncado se não couber no espaço disponível. Por esse motivo, sempre tente manter o conteúdo de texto o mais curto possível.
Entradas de seleção
Você pode usar uma variedade de widgets de entrada de seleção no complemento: caixas de seleção suspensas, caixas de seleção, e botões de opção.
- Use caixas de seleção quando as pessoas puderem selecionar várias opções ou nenhuma. Use botões de opção (ou um menu de seleção) quando exatamente uma opção precisar ser selecionada. Use listas suspensas ao fornecer uma lista curta de alternativas ao tentar economizar espaço na interface.
- Use letras maiúsculas para o texto atribuído a cada opção.
- Evite usar mudanças de seleção para acionar ações importantes e difíceis de reverter, porque as pessoas costumam cometer erros ao fazer seleções. Em vez disso, considere adicionar um botão que leia os valores de seleção atuais e acione a ação.
- Para listas suspensas, classifique as opções em ordem alfabética ou por um esquema lógico que todos os usuários possam entender (como apresentar os dias da semana em ordem, começando pelo domingo ou pela segunda-feira).
- Restrinja o número de opções em um determinado widget de entrada de seleção a um número razoável. Se houver muitas opções, os usuários podem ter dificuldade para usar o widget. Nesses casos, considere dividir a opção em diferentes categorias e vários widgets.
Entradas de texto
As entradas de texto oferecem um lugar para os usuários inserirem dados de string.
- Não use uma entrada de texto para que o usuário digite uma de um conjunto específico de entradas possíveis. Use uma seleção suspensa.
- Use dicas e sugestões para ajudar o usuário a inserir texto com o formato e o conteúdo corretos.
- Use entradas de texto de várias linhas se o texto a ser inserido tiver mais de algumas palavras.
Branding
Esta seção fornece diretrizes de experiência do usuário para adicionar elementos de branding à interface do complemento.
No complemento
Se você quiser incluir branding na interface do complemento, mantenha-o breve e leve. Isso ajuda as pessoas a se concentrarem na funcionalidade do complemento.
- Todos os aspectos do complemento precisam seguir as diretrizes de branding.
- Não inclua as palavras "Google", "Gmail" ou outros nomes de produtos do Google.
- Não inclua ícones de produtos do Google, mesmo que eles sejam alterados.
- Não inclua a palavra "complemento" no texto de branding.
- O texto de branding não pode ter mais de algumas palavras.
No Google Workspace Marketplace
Ao configurar o complemento para publicação, você fornece vários recursos gráficos e de texto para criar a página "Detalhes do app" do Google Workspace Marketplace.
Todos os aspectos da página de detalhes do app e desses recursos precisam seguir as diretrizes de branding.