Quelle interface utilisateur est plus conviviale et efficace: onglets ou panneaux pliables?
Je ne sais pas si les panneaux pliables ont un nom différent, mais je les ai vus appelés déploiements. J'ai utilisé de nombreuses applications qui utilisent l'une ou l'autre ou les deux, mais je me demande s'il existe des ressources qui parlent de l'efficacité de chacune et qui sont plus rapides à utiliser et plus conviviales?
Onglets:
Panneaux pliants:
Ou les deux (ignorez les reflets rouges - la capture d'écran était à l'origine dans un but différent):
Je respecte toujours la règle le chapitre est à l'onglet. Le paragraphe est au panneau pliable.
Lorsque vous avez 2 hiérarchies, le plus large des deux niveaux sont des onglets et l'autre devrait être pour les panneaux pliables.
Pour les applications complexes, il existe plus de 3 niveaux. Quoi que vous fassiez, n'implémentez pas la même division d'interface utilisateur à la prochaine génération immédiate. Cela signifie que si le niveau 1 est des onglets, le niveau 2 (ses enfants immédiats) ne devrait pas être des onglets mais quelque chose d'autre. Je vois que la première capture d'écran a violé cette "règle". Rappelez-vous le bon vieux contour:
I. Main Point 1
A. Section 1
B. Section 2
II. Main Point 2
A. Section 1
B. Section 2
1. Part 1
2. Part 2
Sinon, trois niveaux implémentés par la même interface utilisateur ressembleront à
I. Main Point 1
I. Section 1
II. Section 2
II. Main Point 2
I. Section 1
II. Section 2
I. Part 1
II. Part 2
Tu ne veux pas ça.
Mais que faire s'il n'y a qu'un seul niveau? Quel est le meilleur? Gardez à l'esprit que vous ne pouvez voir qu'un seul contenu d'onglet à la fois pendant que vous pouvez développer/réduire plusieurs panneaux.
J'ai tendance à utiliser des panneaux pliables lorsque je travaille avec une entité avec de nombreuses propriétés que je peux classer. Par exemple, lorsque vous travaillez avec un patient (dans un logiciel de facturation médicale), le nom, l'adresse, le SSN et les coordonnées seront regroupés sous un même panneau, et leur couverture d'assurance sera dans un autre panneau. Le personnel médical veut souvent voir tous les panneaux ouverts la plupart du temps et les réduire (pour moins de contenu) lorsqu'ils sont fatigués.
Pour les onglets, vous devez répondre "oui" à la question "L'utilisateur peut-il travailler dans un onglet sans avoir besoin de voir les informations dans un autre onglet?" Un "non" signifie définitivement que vous n'utilisez pas d'onglets. Un "oui" signifie des onglets possibles, mais vous devrez vérifier bien d'autres choses.
Les onglets et les panneaux pliables sont des moyens de regrouper les contrôles. Les deux ont des avantages et des inconvénients.
Avantages des onglets
- Facile à comprendre, facilement détectable, répandu et donc susceptible d'être reconnu par les utilisateurs d'autres produits
- Moins d'encombrement car seul le contenu d'un onglet est visible à tout moment, séparant visuellement chaque groupe de contrôles
Avantages des panneaux pliables
- Le contenu de deux ou plusieurs groupes peut être visible en même temps
- Facilement personnalisable pour répondre aux besoins des utilisateurs et/ou à l'espace d'écran disponible
- Peut facilement être mélangé avec la mécanique d'amarrage
En bref, la plupart des utilisateurs novices auront plus de facilité à travailler avec des onglets. Moins d'encombrement signifie moins de distraction. Les utilisateurs experts n'aimeront pas le manque de personnalisation et davantage de clics de souris impliqués si ces contrôles sont souvent consultés. Cela est particulièrement vrai lorsque les contrôles ne sont utilisés que pour afficher un état plutôt que sa modification: les onglets nécessiteraient alors des clics de souris pour afficher différents contrôles tandis que les panneaux pliables n'en nécessitent aucun.
Cela explique pourquoi les panneaux pliables (et ceux qui peuvent être ancrés) se trouvent principalement dans les produits conçus pour les utilisateurs experts, tels que les outils de développement (IDE) et les logiciels graphiques haut de gamme, et principalement utilisés pour les groupes de contrôles qui sont très susceptibles d'être utilisés à plusieurs reprises et en combinaison.
Les logiciels conçus pour les utilisateurs novices ou les zones d'un produit qui ne sont probablement pas réutilisées (telles que les préférences de programme) utilisent principalement des onglets.
Si vous avez une hiérarchie de contrôles groupés, c'est généralement une bonne idée d'utiliser des contrôles différents pour chaque niveau de hiérarchie - évitez donc les onglets à l'intérieur des onglets ou les zones de groupe à l'intérieur des zones de groupe. Votre première image montre trois niveaux d'onglets imbriqués (Guides -> Multi -> Fumée), ce qui rend difficile de dire quel contrôle dépend de quel sélecteur d'onglets.
Sur la base des captures d'écran, je suppose que lorsque vous parlez de panneaux pliables, vous entendez des listes déroulantes ou des listes déroulantes.
Voici un article de recherche sur les onglets de NNGroup: http://www.nngroup.com/articles/tabs-used-right/
Résumé: 13 directives de conception pour les contrôles d'onglets sont toutes suivies par Yahoo Finance, mais la convivialité souffre de AJAX overkill et personnalisation difficile.
Voici un article de recherche sur les listes déroulantes de NNGroup: http://www.nngroup.com/articles/drop-down-menus-use-sparingly/
Résumé: Les menus déroulants posent souvent plus de problèmes qu'ils n'en valent et peuvent être déroutants car les concepteurs Web les utilisent à différentes fins. De plus, les menus déroulants réduisent la convivialité lorsqu'ils empêchent les utilisateurs de voir toutes leurs options en un seul coup d'œil.
Les panneaux pliants sont plus utiles lorsque les combinaisons de paramètres de différents panneaux sont importantes.
Si les paramètres sont totalement orthogonaux ou indépendants - c'est-à-dire que les paramètres d'un groupe n'affectent pas les paramètres d'un autre groupe - alors les onglets sont corrects (tout comme les autres façons d'afficher/masquer des groupes de paramètres).
Si les paramètres de différents groupes do interagissent, et surtout si les paramètres de chaque groupe affectent les paramètres de nombreux autres groupes, les panneaux pliables sont bien meilleurs, car diverses combinaisons de groupes peuvent être affichées et manipulées à en même temps, selon ce qui intéresse l'utilisateur.
Que ce soit pour utiliser des onglets ou des panneaux pliables, cela dépend de la façon dont les gens utilisent votre logiciel ou de la façon dont vous souhaitez qu'ils l'utilisent. Si vous pouvez comprendre les flux de travail probables et que vous pouvez regrouper vos fonctions intelligemment, vous pouvez maximiser la convivialité en utilisant une combinaison bien placée d'onglets et de panneaux pliables.
Les panneaux pliants sont parfaits lorsque vous pouvez les utiliser pour configurer votre interface pour une productivité maximale. Je les utilise dans Lightroom tout le temps - à différentes étapes du traitement des photos, j'ai différents outils exposés, je n'ai donc pas à parcourir les choses dont je n'ai pas besoin pour arriver à ce que je veux.
Cependant, le modèle de panneau pliable tombe en panne lorsque je montre/masque souvent les panneaux. Ma carte cognitive de l'emplacement de chaque contrôle à l'écran est constamment incorrecte et je dois rechercher activement chaque section pour déterminer où se trouve le contrôle que je veux. Le modèle fonctionne mieux lorsque j'ai des besoins de flux de travail clairs qui permettent à certains panneaux de rester effondrés.
Si, cependant, le flux de travail probable ne suit aucun modèle particulier (les gens pourraient avoir besoin d'un contrôle à partir d'un large éventail de sections à tout moment de leur flux de travail), alors je recommanderais des onglets - le placement des contrôles de catégorie est prévisible, donc vous ne le faites pas '' t besoin de chercher le contrôle que vous voulez à chaque fois.
En conclusion, les interfaces sont une terre de contrastes.