Diretrizes de interface

Para que todos os elementos da interface gráfica sejam coerentes e o usuário possa compreender instintivamente os diálogos, é importante que as seguintes diretrizes sejam seguidas no layout e design de GUIs.

  1. Agrupe elementos relacionados usando caixas: Tente identificar elementos que podem ser agrupados em conjunto e, em seguida, use caixas com um rótulo para identificar o tópico desse grupo. Evite o uso de caixas com apenas um item dentro.
  2. Capitalize a primeira letra apenas em rótulos: Rótulos devem ser escritos como uma frase com letra maiúscula à esquerda, e todas as palavras restantes devem ser escritas com letras minúsculas.
  3. Não termine etiquetas de itens ou rótulos de caixas com dois pontos: Adicionar dois pontos provoca ruído visual e não confere significado adicional, por isso não se deve usá-los. Uma exceção a esta regra é quando você tem dois rótulos um ao lado do outro Ex: Rótulo1 Plugin (Caminho:) Rótulo2 [/ caminho / para / plugins]
  4. Mantenha ações prejudiciais longe das inofensivas: Se você tem ações para ‘eliminar’, ‘remover’ etc, tente impor um espaço adequado entre a ação prejudicial e ações inócuas para que os usuários sejam menos propensos a clicar inadvertidamente sobre a ação prejudicial.
  5. Sempre use um QButtonBox para botões como ‘OK’, ‘Cancelar’ etc : Usando uma caixa de botão você garante que a ordem dos botões ‘OK’ e ‘Cancelar’ etc, seja coerente com a localidade/ambiente de trabalho /sistema operacional do usuário.
  6. Abas não devem ser justapostas. Se você usar guias, siga o estilo das tags usadas em QgsVectorLayerProperties / QgsProjectProperties etc. ou seja, na parte superior com ícones em 22x22.
  7. Pilhas de elementos devem ser evitadas sempre que possível. Eles causam problemas com layouts e redimensionamento inexplicável (para o usuário) de diálogos para acomodar elementos que não são visíveis.
  8. Tente evitar termos técnicos e use o equivalente a um leigo, por ex. use a palavra ‘Transparency’ em vez de ‘Alpha Channel’ (exemplo artificial), ‘Text’ em vez de ‘String’ e assim por diante.
  9. Use iconografia consistente. Se você precisar de um ícone ou elementos de ícone, entre em contato com Robert Szczepanek na lista de discussão para obter assistência.
  10. Coloque longas listas de widgets em caixas de rolagem. Nenhum diálogo deve exceder 580 pixels de altura e 1000 pixels de largura.
  11. Opções avançadas separadas das básicas. Os usuários iniciantes devem poder acessar rapidamente os itens necessários para atividades básicas sem precisar se preocupar com a complexidade dos recursos avançados. Os recursos avançados devem estar localizados abaixo de uma linha divisória ou colocados em uma guia separada.
  12. Não adicione opções para ter muitas opções. Esforce-se para manter a interface do usuário minimalista e usar padrões sensatos.
  13. Se clicar em um botão gerará um novo diálogo, as reticências (…) deverão ser sufixadas ao texto do botão.

Autores

  • Tim Sutton (autor e editor)
  • Gary Sherman
  • Marco Hugentobler
  • Matthias Kuhn