Différences
Ci-dessous, les différences entre deux révisions de la page.
| Les deux révisions précédentes Révision précédente Prochaine révision | Révision précédente | ||
|
ergonomie_de_gnome [Le 23/07/2017, 14:21] Roschan [Principes de conception (pour le développement)] traduction bancale |
ergonomie_de_gnome [Le 11/02/2023, 23:30] (Version actuelle) spnux Enlevé le paragraphe "Voir aussi" car hyperlien mort |
||
|---|---|---|---|
| Ligne 74: | Ligne 74: | ||
| Quelques captures d'écran : | Quelques captures d'écran : | ||
| - | | {{http://i.imgur.com/OPlDL5S.png?300|Gnome Photos}} | {{http://i.imgur.com/uABy2BZ.png?300|Gedit}} | | + | | {{https://i.imgur.com/OPlDL5S.png?300|Gnome Photos}} | {{http://i.imgur.com/uABy2BZ.png?300|Gedit}} | |
| ^ GNOME Photos ^ [[Gedit]] ^ | ^ GNOME Photos ^ [[Gedit]] ^ | ||
| Ligne 85: | Ligne 85: | ||
| Exemples : | Exemples : | ||
| ^ [[Gnome Web]] ^ [[Gnome Builder]] ^ [[Rhythmbox]] ^ [[gedit]] ^ [[Nautilus]] ^ | ^ [[Gnome Web]] ^ [[Gnome Builder]] ^ [[Rhythmbox]] ^ [[gedit]] ^ [[Nautilus]] ^ | ||
| - | | Nouvelle fenêtre \\ Nouvelle fenêtre privée \\ Rouvrir l'onglet fermé \\ Historique \\ Préférences \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | Nouveau projet \\ Ouvrir un projet \\ Préférences \\ Générer le journal de support \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | Ajouter de la musique \\ Affichage (sous-menu) \\ Outils (sous-menu) \\ Greffons \\ Préférences \\ Aide \\ À propos \\ Quitter | Nouvelle fenêtre \\ Préférences \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | Nouvelle fenêtre \\ Panneau latéral \\ Préférences \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | | + | | Nouvelle fenêtre \\ Nouvelle fenêtre privée \\ Rouvrir l'onglet fermé \\ Historique \\ Préférences \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | Nouveau projet \\ Ouvrir un projet \\ Préférences \\ Générer le journal de support \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | Ajouter de la musique \\ Affichage (sous-menu) \\ Outils (sous-menu) \\ Greffons \\ Préférences \\ Aide \\ À propos \\ Quitter | Nouvelle fenêtre \\ Préférences \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | Nouvelle fenêtre \\ Panneau latéral \\ Préférences \\ Raccourcis claviers \\ Aide \\ À propos \\ Quitter | |
| ==== La "headerbar" (2) ==== | ==== La "headerbar" (2) ==== | ||
| Ligne 127: | Ligne 127: | ||
| <note>Ces principes théoriques sont assez libres d'interprétation et ne sont donc pas toujours parfaitement respectés, y compris par les développeurs internes aux projets GNOME.</note> | <note>Ces principes théoriques sont assez libres d'interprétation et ne sont donc pas toujours parfaitement respectés, y compris par les développeurs internes aux projets GNOME.</note> | ||
| - | === Une application = un objectif clair === | + | ==== Une application = un objectif clair ==== |
| Des buts clairs et bien définis dès le départ sont la clé d'un bon design. Les applications doivent fournir un ensemble clair et conceptuellement cohérent de fonctionnalités à fournir, attention à ne pas en dériver. Une application qui tente de faire plein de choses disparates finira par être complexe et source de confusion chez l'utilisateur. | Des buts clairs et bien définis dès le départ sont la clé d'un bon design. Les applications doivent fournir un ensemble clair et conceptuellement cohérent de fonctionnalités à fournir, attention à ne pas en dériver. Une application qui tente de faire plein de choses disparates finira par être complexe et source de confusion chez l'utilisateur. | ||
| Ligne 133: | Ligne 133: | ||
| Les meilleures applications fournissent une solution élégante dans un domaine spécifique. | Les meilleures applications fournissent une solution élégante dans un domaine spécifique. | ||
| - | === Gardez la complexité de l'interface utilisateur à son minimum === | + | ==== Gardez la complexité de l'interface utilisateur à son minimum ==== |
| Chaque contrôle ou information ajoutée à l'interface de l'application génère un travail d'apprentissage ou de compréhension supplémentaire pour les utilisateurs, augmentant la complexité de l'interface -- la rendant potentiellement moins plaisante voire plus difficile à utiliser. | Chaque contrôle ou information ajoutée à l'interface de l'application génère un travail d'apprentissage ou de compréhension supplémentaire pour les utilisateurs, augmentant la complexité de l'interface -- la rendant potentiellement moins plaisante voire plus difficile à utiliser. | ||
| Ligne 139: | Ligne 139: | ||
| Par ailleurs, n'incluez que les contrôles et informations essentiels dans votre interface : en ajoutant quelque chose, demandez-vous toujours si c'est vraiment nécessaire. | Par ailleurs, n'incluez que les contrôles et informations essentiels dans votre interface : en ajoutant quelque chose, demandez-vous toujours si c'est vraiment nécessaire. | ||
| - | === Divulguez progressivement les contrôles qui ne sont requis que dans certaines situations === | + | ==== Divulguez progressivement les contrôles qui ne sont requis que dans certaines situations ==== |
| Cela évite que l'utilisateur ait à naviguer parmi des contrôles qui ne peuvent pas lui servir. Montrer les contrôles lorsqu'ils sont requis rend l'application plus simple, tout en proposant la même quantité de fonctionnalités. | Cela évite que l'utilisateur ait à naviguer parmi des contrôles qui ne peuvent pas lui servir. Montrer les contrôles lorsqu'ils sont requis rend l'application plus simple, tout en proposant la même quantité de fonctionnalités. | ||
| Il y a plusieurs moyens de faire ça, par exemple avec différentes vues, différents modes, ou en montrant des contrôles flottants ou transitoire lorsque du contenu ou un item est sélectionné. | Il y a plusieurs moyens de faire ça, par exemple avec différentes vues, différents modes, ou en montrant des contrôles flottants ou transitoire lorsque du contenu ou un item est sélectionné. | ||
| - | === N'exigez que le minimum de la part de l'utilisateur === | + | ==== N'exigez que le minimum de la part de l'utilisateur ==== |
| Une application laborieuse à utiliser peut devenir source d'irritation, donc efforcez-vous de faire marcher votre logiciel pour les utilisateurs (plutôt que ce soient les utilisateurs qui le fasse marcher pour vous). | Une application laborieuse à utiliser peut devenir source d'irritation, donc efforcez-vous de faire marcher votre logiciel pour les utilisateurs (plutôt que ce soient les utilisateurs qui le fasse marcher pour vous). | ||
| À chaque fois que l'application requiert une entrée de la part des utilisateurs (utiliser un contrôle ou fournir une information), il faut se demander si on peut le faire pour eux : essayer d'éviter les écrans de réglages manuels ou les assistants, et rendre facile le retour aux contenus récemment utilisés. | À chaque fois que l'application requiert une entrée de la part des utilisateurs (utiliser un contrôle ou fournir une information), il faut se demander si on peut le faire pour eux : essayer d'éviter les écrans de réglages manuels ou les assistants, et rendre facile le retour aux contenus récemment utilisés. | ||
| - | === Créez une hiérarchie claire === | + | ==== Créez une hiérarchie claire ==== |
| Les gens ont tendance à "lire" l'interface de gauche à droite, et de haut en bas. Les items rencontrés en premier sont perçus comme dominants par rapport à ceux qui viennent ensuite. Utilisez cette hiérarchie implicite pour communiquer quelles parties et fonctionnalités de votre application sont les plus importantes. | Les gens ont tendance à "lire" l'interface de gauche à droite, et de haut en bas. Les items rencontrés en premier sont perçus comme dominants par rapport à ceux qui viennent ensuite. Utilisez cette hiérarchie implicite pour communiquer quelles parties et fonctionnalités de votre application sont les plus importantes. | ||
| Positionner les contrôles les plus importants est vers le coin supérieur-gauche de la fenêtre, et placer les contrôles dominants avant les autres qu'ils affectent. Voir [[https://developer.gnome.org/hig/stable/visual-layout.html.en|ici pour plus de détails]]. | Positionner les contrôles les plus importants est vers le coin supérieur-gauche de la fenêtre, et placer les contrôles dominants avant les autres qu'ils affectent. Voir [[https://developer.gnome.org/hig/stable/visual-layout.html.en|ici pour plus de détails]]. | ||
| - | === Priorisez le contenu === | + | ==== Priorisez le contenu ==== |
| Une application présente généralement un contenu (images, texte, messages, ou des données plus complexes). C'est ce contenu qui intéresse l'utilisateur, et trop de contrôles, donc des éléments d'interface envahissants, distraient l'utilisateur de l'objet de son attention. | Une application présente généralement un contenu (images, texte, messages, ou des données plus complexes). C'est ce contenu qui intéresse l'utilisateur, et trop de contrôles, donc des éléments d'interface envahissants, distraient l'utilisateur de l'objet de son attention. | ||
| Donner au contenu le maximum d'espace possible dans l'interface, en réduisant le bombre de contrôles affichés. | Donner au contenu le maximum d'espace possible dans l'interface, en réduisant le bombre de contrôles affichés. | ||
| - | === Anticipez les erreurs === | + | ==== Anticipez les erreurs ==== |
| Les gens font des erreurs. Les anticiper va prévenir des conséquences désastreuses, et rendra l'application davantage plaisante et satisfaisante à utiliser. La première ligne de défense ici, est de concevoir l'application de telle sorte que les erreurs ne puissent pas être faites. Deuxièmement, si une erreur est faite, il faut qu'elle soit facile à rattraper. | Les gens font des erreurs. Les anticiper va prévenir des conséquences désastreuses, et rendra l'application davantage plaisante et satisfaisante à utiliser. La première ligne de défense ici, est de concevoir l'application de telle sorte que les erreurs ne puissent pas être faites. Deuxièmement, si une erreur est faite, il faut qu'elle soit facile à rattraper. | ||
| Il faut automatiquement corriger les entrées potentiellement invalides, et toujours rendre possible l'annulation des opérations destructives. | Il faut automatiquement corriger les entrées potentiellement invalides, et toujours rendre possible l'annulation des opérations destructives. | ||
| - | === Évitez les interruptions === | + | ==== Évitez les interruptions ==== |
| - | + | Les interruptions causent de la frustration et de l'irritation, et empêchent les gens de se concentrer. Concevoir les applications telles qu'elles n’interrompent pas l'utilisateur lorsqu'elles sont inutilisées. | |
| - | Les interruptions causent de la frustration et de l'irritation, et empêchent les gens de se concentrer. Concevoir les applications telles qu'elles n’interrompent pas l'utilisateur lorsqu'elles sont inutilisées. | + | |
| Utiliser les notifications avec modération, et toujours éviter les fenêtres de dialogue surgissant spontanément sans que ce ne fut l'intention de l'utilisateur. De manière générale, minimiser les mécanismes de feedback gênants comme les boîtes de dialogue. | Utiliser les notifications avec modération, et toujours éviter les fenêtres de dialogue surgissant spontanément sans que ce ne fut l'intention de l'utilisateur. De manière générale, minimiser les mécanismes de feedback gênants comme les boîtes de dialogue. | ||
| - | === Fournissez une recherche rapide et efficace === | + | ==== Fournissez une recherche rapide et efficace ==== |
| La recherche est un mécanisme puissant pour trouver rapidement du contenu. Il faut en proposer dès qu'on a une grande quantité de contenu, que ce soit sous forme de liste ou de grille. Il est vital que cette recherche soit aussi immédiate que possible, et retourne des résultats visibles par l'utilisateur. | La recherche est un mécanisme puissant pour trouver rapidement du contenu. Il faut en proposer dès qu'on a une grande quantité de contenu, que ce soit sous forme de liste ou de grille. Il est vital que cette recherche soit aussi immédiate que possible, et retourne des résultats visibles par l'utilisateur. | ||
| Gnome Shell propose un moyen de faire des recherches intégrées. Intégrer la recherche de l'application à Gnome Shell donne aux utilisateurs un moyen rapide et simple d'accéder au contenu proposé par l'application. | Gnome Shell propose un moyen de faire des recherches intégrées. Intégrer la recherche de l'application à Gnome Shell donne aux utilisateurs un moyen rapide et simple d'accéder au contenu proposé par l'application. | ||
| - | === Utilisez les options de configuration avec parcimonie === | + | ==== Utilisez les options de configuration avec parcimonie ==== |
| La plupart des gens ne verront jamais ces options de configuration. Ajouter des options ressemble souvent à une rustine : plutôt que d'ajouter des options, il faut faire en sorte que le comportement par défaut de l'application satisfasse autant de personnes que possible. | La plupart des gens ne verront jamais ces options de configuration. Ajouter des options ressemble souvent à une rustine : plutôt que d'ajouter des options, il faut faire en sorte que le comportement par défaut de l'application satisfasse autant de personnes que possible. | ||
| - | === Un nom instructif et une icône attractive === | + | ==== Un nom instructif et une icône attractive ==== |
| Le nom et l'icône sont les 2 aspects les plus expressifs de l'application, ils doivent communiquer sa fonction et son identité. | Le nom et l'icône sont les 2 aspects les plus expressifs de l'application, ils doivent communiquer sa fonction et son identité. | ||
| Les gens devraient pouvoir comprendre le but de l'application à partir de son nom, et la reconnaître à partir de son icône, qui fait partie de l'identité visuelle de l'application : belle, distincte, attractive. | Les gens devraient pouvoir comprendre le but de l'application à partir de son nom, et la reconnaître à partir de son icône, qui fait partie de l'identité visuelle de l'application : belle, distincte, attractive. | ||
| - | === Utilisez (avec parcimonie) l'émotion voire l'humour === | + | ==== Utilisez (avec parcimonie) l'émotion voire l'humour ==== |
| - | + | Utilisé pertinemment, cela peut épicer l'expérience fournie par l'application, et aider à établir une relation positive avec l'utilisateur. Il ne faut pas abuser de ces techniques, bien entendu : souhaiter la bienvenue dans l'application la première fois, ou dédramatiser la situation quand il y a un problème, peuvent être de bonnes idées. | |
| - | Utilisé pertinemment, cela peut épicer l'expérience fournie par l'application, et aider à établir une relation positive avec l'utilisateur. Il ne faut pas abuser de ces techniques, bien entendu : souhaiter la bienvenue dans l'application la premire fois, ou dédramatiser la situation quand il y a un problème, peuvent être de bonnes idées. | + | |
| - | ===== Voir aussi ===== | ||
| - | [[https://developer.gnome.org/hig/stable/|Les "guidelines" de développement complètes]]. | ||
| ----- | ----- | ||