2. HIG (Human Interface Guidelines)

In order for all graphical user interface elements to appear consistent and to all the user to instinctively use dialogs, it is important that the following guidelines are followed in layout and design of GUIs.

  1. Group related elements using group boxes: Try to identify elements that can be grouped together and then use group boxes with a label to identify the topic of that group. Avoid using group boxes with only a single widget / item inside.

  2. Capitalise first letter only in labels, tool tips, descriptive text, and other non-heading or title text: These should be written as a phrase with leading capital letter, and all remaining words written with lower case first letters, unless they are nouns

  3. Capitalize all words in Titles (group box, tab, list view columns, and so on), Functions (menu items, buttons), and other selectable items (combobox items, listbox items, tree list items, and so on): Capitalize all words, except prepositions that are shorter than five letters (for example, “with” but “Without”), conjunctions (for example, and, or, but), and articles (a, an, the). However, always capitalize the first and last word.

  4. Do not end labels for widgets or group boxes with a colon: Adding a colon causes visual noise and does not impart additional meaning, so don’t use them. An exception to this rule is when you have two labels next to each other e.g.: Label1 Plugin (Path:) Label2 [/path/to/plugins]

  5. Tieni le azioni dannose lontane da quelle innocue: se hai azioni per «elimina», «rimuovi» ecc., cerca di imporre uno spazio adeguato tra l’azione dannosa e le azioni innocue in modo che gli utenti abbiano meno probabilità di fare clic inavvertitamente sull’azione dannosa.

  6. Utilizzare sempre un QButtonBox per i pulsanti “OK”, “Annulla”, ecc.: l’uso di una casella pulsante garantisce che l’ordine dei pulsanti “OK” e “Annulla”, ecc. sia coerente con il sistema operativo/locale/ambiente desktop che l’utente sta utilizzando.

  7. Tabs should not be nested. If you use tabs, follow the style of the tabs used in QgsVectorLayerProperties / QgsProjectProperties etc. i.e. tabs at top with icons at 22x22.

  8. Widget stacks should be avoided if at all possible. They cause problems with layouts and inexplicable (to the user) resizing of dialogs to accommodate widgets that are not visible.

  9. Try to avoid technical terms and rather use a laymans equivalent e.g. use the word “Opacity” rather than “Alpha Channel” (contrived example), “Text” instead of “String” and so on.

  10. Usa un’iconografia coerente. Se hai bisogno di un’icona o di elementi icona, contatta Robert Szczepanek nella mailing list per assistenza.

  11. Posiziona lunghi elenchi di widget all’interno di caselle di scorrimento. Nessuna finestra di dialogo deve superare 580 pixel in altezza e 1000 pixel in larghezza.

  12. Separare le opzioni avanzate da quelle di base. Gli utenti inesperti dovrebbero poter accedere rapidamente agli elementi necessari per le attività di base senza preoccuparsi della complessità delle funzionalità avanzate. Le funzionalità avanzate devono essere posizionate sotto una linea di divisione o posizionate su una scheda separata.

  13. Non aggiungere opzioni per il solo gusto di avere un sacco di opzioni. É bene sforzarsi di mantenere l’interfaccia utente minimalista ed utilizzare impostazioni predefinite sensibili.

  14. If clicking a button will spawn a new dialog, an ellipsis char (…) should be suffixed to the button text. Note, make sure to use the U+2026 Horizontal Ellipsis char instead of three periods.

2.1. Autori

  • Tim Sutton (autore e editore)

  • Gary Sherman

  • Marco Hugentobler

  • Matthias Kuhn