Esse documento estabelece os padrões e fornece um guia para a definição do layout e da interface com o usuário do sistema.
A maneira como você expressa uma mensagem de erro, como escreve a documentação de ajuda e até o texto escolhido para um botão têm grandes impactos na usabilidade do software. O estilo de escrita pode fazer uma grande diferença entre uma experiência ruim para o usuário e uma melhor.
De maneira geral, todos os textos deve ser iniciados com letra maiúscula e as demais palavras devem ser grafadas em letras minúsculas. Em casos específicos, quando um nome próprio surgir no meio de uma mensagem, por exemplo, esse também deve começar com letras maiúsculas. Textos escritos todos em letras maiúsculas devem ser evitados tanto quanto possível. Em alguns casos, entretanto, esse tipo de escrita pode ser necessário (com em siglas, por exemplo).
| Ruim | Melhor |
|---|---|
| salvar | Salvar |
| Enviar E-mail | Enviar e-mail |
| DATA DO CADASTRO | Data do cadastro |
| Coordenadas Utm | Coordenadas UTM |
Abreviações podem ser úteis para economizar espaço ou para que o texto pareça mais natural, mas devem ser utilizadas com cuidado. É importante que o usuário entenda a mensagem que está sendo passada. Caso um texto seja muito grande, considere uma mudança no layout da página ou componente antes de abreviar o texto.
| Ruim | Melhor |
|---|---|
| Data cadastro | Data de cadastro |
| Conf. impressão | Configurações de impressão |
| Exib. dados mapa | Exibir dados no mapa |
Terminar um texto com ponto final implica que o texto é uma sentença completa. Use ponto final apenas para grandes blocos de texto, e evite-os para textos mais curtos que uma sentença completa. Em grandes blocos de texto, utilize sempre as regras de pontuação da língua portuguesa.
A acentuação e a grafia correta das palavras deve sempre ser respeitada, independente de onde o texto será exibido. Mesmo que internamente, por questões tecnológicas ou por simplificação, acentos, espaços e caracteres especiais sejam omitidos, o texto visível ao usuário deve sempre ser grafado corretamente.
| Ruim | Melhor |
|---|---|
| Não foi possível estabelecer uma conexão com o servidor | Não foi possível estabelecer uma conexão com o servidor. |
| Cancelar. | Cancelar |
| Razao Social | Razão social |
| CoordenadasUTM | Coordenadas UTM |
O texto nos botões precisa ser conciso o suficiente para que os usuários possam ler tudo de uma vez e claro o suficiente para que a função do botão seja imediatamente óbvia. O mais longo que o texto de um botão deve ser são poucas palavras curtas. Ao escrever o texto de um botão, lembre-se de que cada botão representa uma ação. Certifique-se de usar a voz ativa no texto do botão para usar palavras que representam ações em vez de reações.
| Ruim | Melhor |
|---|---|
| Gravar informações | Salvar |
| Clique aqui para voltar | Voltar |
| Imprime | Imprimir |
Botões sem texto e com o ícone de pesquisa (search) devem conter o hint “Pesquisar”, como exemplificado abaixo:
Botões sem texto e com o ícone de X (times) devem conter o hint “Remover”, como exemplificado abaixo:
Botões sem texto e com o ícone de cruz (add/plus) devem conter o hint “Incluir”, como exemplificado abaixo:
Botões sem texto e com o ícone de lápis (edit) devem conter o hint “Editar”, como exemplificado abaixo:
Botões sem texto e com o ícone de lixeira (trash) devem conter o hint “Excluir”, como exemplificado abaixo:
As páginas principais, carregadas quando o usuário acessa o módulo, devem trazer em destaque o nome do módulo, sempre no plural. As ações principais do módulo, que não dependem de um registro de dados específico, devem ser posicionadas logo abaixo do nome do módulo.
Em seguida, a lista de registros deve ser exibida e, à direita de cada registro, devem ser exibidas as ações que podem ser realizadas especificamente com o registro em questão. Os nomes das colunas da lista de registros devem estar sempre em negrito.
Ao executar uma ação, o sistema deve exibir uma página específica para que o usuário complete a ação que deseja executar. Essa página deve exibir, em destaque, o nome do módulo, sempre no plural. Abaixo do módulo, o sistema deve exibir a ação que está sendo executada e, em seguida, os dados do registro ou os campos para a inserção de dados.
Abaixo dos campos ou dados do registro, o sistema deve exibir links ou botões para que o usuário possa confirmar ou cancelar a ação.
A página de exclusão de registros, ao invés de exibir a descrição da ação, deve exibir uma pergunta ao usuário: “Tem certeza que deseja excluir esse [nome da entidade]?”.
Os dados inseridos ou exibidos pelo sistema não devem ser tratados em relação a sua capitalização, ou seja, o uso de letras maiúsculas ou minúsculas deve ser uma decisão do usuário.
Os controles utilizados para a inserção de dados devem sempre simplificar o preenchimento dos campos. Para isso, deve-se buscar o controle mais adequado para o tipo de informação que está sendo manipulada. Entretanto, a frequência ou a forma de preenchimento do campo deve ser sempre considerada na escolha do tipo de controle a ser usado. Por exemplo, um campo de data pode permitir a escolha da data em um calendário, mas a digitação da data através do teclado não pode ser bloqueada.
Com relação à tabulação dos campos, apenas os mecanismos padrão de tabulação definidos pelo sistema operacional devem ser utilizados. A implementação de outros métodos de tabulação, como a mudança de campos através do pressionamento da tecla ENTER, devem ser usados apenas em situações muito específicas, que devem ser estudadas caso a caso. Também não serão implementados mecanismos próprios para o destaque dos campos em foco. Hoje, os principais navegadores já implementam alguma forma de destaque nativamente.
As etiquetas (labels) dos campos, quando presentes, devem ser exibidas em negrito e devem exibir um asterisco (*) caso o campo seja obrigatório.
Ainda não definido.
Nenhuma.