Densité de l'information dans le SaaS B2B : conception de tableaux de bord pour les utilisateurs expérimentés et les novices
Comment concevoir des tableaux de bord et des tableaux B2B denses que les experts peuvent analyser rapidement sans surcharger les nouveaux utilisateurs : modes de densité, hiérarchie, divulgation progressive.
À retenir
Les interfaces denses ne sont pas le problème ; les désorganisés le sont. Les experts veulent plus d'informations par écran, alors fournissez-leur une hiérarchie solide, un alignement cohérent et des graphiques utilisant la position et la longueur. Protégez les novices avec des valeurs par défaut raisonnables et une divulgation progressive, et laissez les gens choisir un niveau de densité, comme le font les systèmes de conception tels que Carbon pour les tables.
La densité est une fonctionnalité réservée aux experts
Les personnes qui utilisent un outil B2B toute la journée, comme les analystes, les agents de support et les opérateurs, préfèrent souvent en voir plus d'un coup, car faire défiler et changer d'onglet leur coûte du temps. Rendre tout spacieux pour une capture d'écran nette peut ralentir leur travail. L’objectif est une information dense mais facile à numériser.
Laissez les gens choisir la densité
Les systèmes de conception intègrent désormais de la densité dans les composants. La table de données Carbon d'IBM, par exemple, propose cinq hauteurs de lignes, de très petite (24 px) pour les mises en page très denses à très grande (64 px) pour une numérisation plus facile, avec moyenne (40 px) par défaut.
- Offrez deux ou trois réglages de densité, mémorisés par utilisateur.
- Modifiez l'espacement et la hauteur des lignes, pas la taille de la police ou le contraste.
- Gardez les cibles tactiles suffisamment grandes sur les appareils tactiles, quelle que soit leur densité.
La hiérarchie rend la densité lisible
Nielsen Norman Group définit les tableaux de bord comme des visualisations qui donnent en un coup d'œil des informations sur lesquelles les gens peuvent agir rapidement, et recommande de coder les quantités avec la longueur et la position 2D, que les gens lisent le plus rapidement. En pratique : placez les quelques chiffres qui déterminent les décisions en haut, alignez le tout sur une grille, utilisez la couleur uniquement pour la signification (statut, alertes) et alignez les chiffres à droite pour qu'ils puissent être comparés.
Protégez les novices sans ralentir les experts
La divulgation progressive maintient les options avancées disponibles, mais à l’écart. Démarrez les nouveaux utilisateurs avec une vue par défaut ciblée, laissez-les ajouter des colonnes, des filtres et des widgets selon leurs besoins, et enregistrez les vues afin que les experts puissent revenir instantanément à leur configuration dense.
Mouvement dans des interfaces denses
Sur les écrans riches en données, le mouvement doit expliquer le changement, pas décorer : mettez en surbrillance une valeur qui vient d'être mise à jour, animez une ligne dans sa nouvelle position triée ou affichez une transition dans un graphique afin que les utilisateurs puissent suivre ce qui a bougé. Soyez bref et évitez les animations continues qui entrent en concurrence avec les données.
Principes clés à retenir
- Les experts bénéficient d'écrans denses ; la désorganisation est le vrai problème
- Proposez des paramètres de densité en modifiant l'espacement, et non la taille des caractères ou le contraste.
- Utilisez la longueur et la position pour les nombres ; couleur uniquement pour le sens
- La divulgation progressive protège les novices
- Utilisez le mouvement pour expliquer les changements dans les données, pas pour décorer
Questions fréquentes
Sources
- Data table usage — Système de conception en carbone (IBM)
- Dashboards: Making Charts and Graphs Easier to Understand — Nielsen Norman Group
- Progressive Disclosure — Nielsen Norman Group