Conception de tableau de bord - Considérations et bonnes pratiques

Publié: 2022-03-11

Écoutez la version audio de cet article

Les tableaux de bord sont un moyen unique et puissant de présenter des renseignements basés sur des données à l'aide de techniques de visualisation de données qui affichent des données pertinentes et exploitables ainsi que des statistiques de suivi et des indicateurs de performance clés (KPI). Les tableaux de bord doivent présenter ces données dans un format rapide et facile à parcourir avec les informations les plus pertinentes compréhensibles en un coup d'œil.

Le terme est né du tableau de bord automobile traditionnel, et ils ont évolué pour remplir la même fonction dans le monde numérique. Dans son livre, Stephen Few l'a bien dit :

Un tableau de bord est un affichage visuel des informations les plus importantes nécessaires pour atteindre un ou plusieurs objectifs ; consolidés et organisés sur un seul écran afin que les informations puissent être suivies d'un coup d'œil.

Conception de tableau de bord mobile
Conception de tableau de bord mobile par Mason Yarnell pour Mixpanel

Dans cet article, nous décrivons des exemples stratégiques, analytiques, opérationnels et informationnels ainsi que les principes fondamentaux qui sont au cœur de toute conception de tableau de bord réussie, quel que soit son type.

Avoir la bonne approche de la visualisation des données est un élément clé pour jeter les bases d'un tableau de bord réussi. La visualisation des données est la présentation des données via des graphiques et des images. Son objectif principal est d'aider les décideurs à identifier des modèles ou à comprendre des concepts difficiles qui peuvent passer inaperçus dans les applications textuelles.

Dans leur livre, Data Visualization , Noah Iliinsky et Julie Steele déclarent :

Le but du concepteur dans la conception d'une visualisation de données est de créer un livrable qui sera bien reçu et facilement compris par le lecteur. Tous les choix de conception et les implémentations particulières doivent servir cet objectif.

Principales caractéristiques des grands tableaux de bord

Un tableau de bord efficace affiche des informations exploitables et utiles en un coup d'œil. Il simplifie la représentation visuelle de données complexes et aide les parties prenantes à comprendre, analyser et présenter des informations clés.

Éléments dans une conception de tableau de bord
Tableau de bord de Contractbook par Toptal Designer Wojciech Dobry

Les grands tableaux de bord sont clairs, intuitifs et personnalisables.

  • Ils communiquent rapidement les informations.
  • Ils affichent les informations de manière claire et efficace.
  • Ils montrent les tendances et les changements dans les données au fil du temps.
  • Ils sont facilement personnalisables.
  • Les widgets et composants de données les plus importants sont effectivement présentés dans un espace limité.

Une personnalisation initiale des données visuelles et des informations en fonction des besoins des utilisateurs clés contribuera à améliorer la convivialité et à éliminer le besoin de différentes personnalités d'utilisateurs.

Représentation des éléments de tableau de bord personnalisables
Éléments de tableau de bord personnalisables – Contractbook par Toptal Designer Wojciech Dobry

De grands tableaux de bord fournissent tout en un clic.

  • Toutes les informations essentielles sont immédiatement accessibles.
  • Les données sont prioritaires.
  • Les informations sont affichées clairement dans une hiérarchie visuelle sur un seul écran.
  • La conception fournit une vue d'ensemble cohérente qui comprend des données initiales claires et clairsemées avec des possibilités supplémentaires d'approfondir pour en savoir plus.
  • Les éléments (graphique, tableau, formulaire) sont affichés dans une vue réduite avec la possibilité d'afficher plus de détails dans une fenêtre modale ou d'accéder à une page avec plus de détails.
  • La conception améliore la convivialité avec des filtres permettant aux utilisateurs de personnaliser l'affichage des données et de filtrer le contenu à l'aide d'étiquettes, de catégories et d'indicateurs de performance clés.

Conception de tableau de bord pour ordinateur de bureau
Données détaillées extraites d'un tableau de bord sur un modal, par Toptal Designer Miklos Philips

Une complexité réduite apporte de la clarté

Dans un monde submergé de données, fournir des informations claires est l'une des choses les plus difficiles à accomplir. Présenter uniquement les données les plus pertinentes sur les tableaux de bord est essentiel : plus nous affichons d'informations, plus il est difficile pour les utilisateurs de trouver ce dont ils ont besoin.

Lorsqu'ils sont confrontés à trop de données parmi lesquelles choisir, les concepteurs doivent afficher uniquement le sous-ensemble le plus pertinent. Nous devons hiérarchiser et supprimer soigneusement les mesures trompeuses et peu claires.

Les décisions de conception de tableau de bord efficaces doivent être guidées par :

  • les objectifs du projet
  • la nature des données
  • les besoins des utilisateurs

Éléments de conception du tableau de bord
Conception du tableau de bord par Toptal Designer Stelian Subotin

Lors de la lecture d'une visualisation (ou de tout autre type de communication), votre lecteur a une quantité limitée d'intelligence à consacrer au problème. Une partie de cette matière grise sera consacrée au décodage de la visualisation ; toute matière grise qui reste peut alors être utilisée pour comprendre le message (si le lecteur n'a pas encore renoncé à la frustration). Noah Iliinsky et Julie Steele (visualisation des données)

L'objectif principal d'un tableau de bord est de rendre les informations complexes accessibles et faciles à assimiler. Par conséquent, l'interface présentant les données doit être claire et simple afin de minimiser la charge cognitive des utilisateurs et le temps passé à chercher.

L'architecture de l'information doit présenter les données essentielles en premier tout en permettant l'accès aux métriques de support ou secondaires. Un système d'exploration progressive doit être conçu, qui commence par une vue d'ensemble générale, puis entre plus en détail. Il facilite la hiérarchisation des données et crée de la clarté.

Conception de tableau de bord mobile pour iOS
Conception du tableau de bord mobile par Jan Losert

Déterminer les objectifs du tableau de bord et afficher les données appropriées

Lors de la conception de tableaux de bord, les concepteurs de tableaux de bord qui réussissent commencent par un ensemble d'objectifs bien définis se concentrant sur le problème à résoudre et les informations clés et exploitables que les gens doivent retirer des données.

De bons objectifs de conception favorisent une exécution efficace et précise. L'utilisation du cadre SMART pour l'établissement d'objectifs met l'accent sur des objectifs spécifiques , mesurables , réalisables , réalistes et temporels .

Designers UX indépendants à temps plein basés aux États-Unis recherchés

Quelques questions clés à se poser lors de la détermination des objectifs de conception du tableau de bord :

  • Combien d'étapes les utilisateurs doivent-ils franchir pour atteindre un objectif spécifique ?
  • L'interface est-elle suffisamment intuitive pour que l'utilisateur atteigne son objectif par lui-même ?
  • De quelles informations l'utilisateur a-t-il besoin pour atteindre son objectif avec succès ?

Pour déterminer quel peut être l'objectif d'une conception de tableau de bord spécifique, définissez-le en demandant : "Quel problème spécifique cette conception va-t-elle résoudre pour l'utilisateur ?" La réponse fournira des informations sur les métriques, les propriétés, les valeurs, les visuels et les données qui ont une conséquence.

Utilisation de graphiques en anneau dans une conception de tableau de bord
Conception du tableau de bord par Toptal Designer Miklos Philips

La conception centrée sur les objectifs se concentre sur les solutions aux problèmes réels et constitue la base de toute conception de tableau de bord de qualité. Commencez par une compréhension claire des objectifs commerciaux, tenez compte des objectifs des utilisateurs, puis transmettez les informations clés qui doivent être communiquées.

Contexte dans la conception de tableau de bord

L'un des plus grands défis de la conception de tableaux de bord est de servir plusieurs personnes. Une fois chaque rôle d'utilisateur défini, il devient essentiel de comprendre où leurs besoins se chevauchent et où ils divergent.

Une communication efficace est le principe sous-jacent de toute conception de tableau de bord réussie. Prévoir les scénarios potentiels dans lesquels les utilisateurs peuvent se trouver contribuera à une meilleure compréhension de la situation de l'utilisateur.

Gardez toujours à l'esprit le contexte des utilisateurs lors de la conception : identifiez leurs connaissances techniques, leur familiarité avec le système dans son ensemble, leurs objectifs, etc.

Éléments contextuels dans une conception de tableau de bord
Conception du tableau de bord par Toptal Designer Miklos Philips

Assurez-vous de poser les questions suivantes lorsque vous essayez de déterminer le comportement et le contexte de l'utilisateur :

  • La conception tient-elle compte de la direction dans laquelle le visiteur a l'habitude de lire ?
  • L'interaction avec le tableau de bord nécessite-t-elle des connaissances techniques ?
  • Les utilisateurs parviendront-ils à accomplir la plupart des actions en quelques clics ?
  • La conception s'aligne-t-elle sur le contexte de l'utilisateur en créant des menus déroulants ? utilise-t-il une iconographie suggestive et des palettes de couleurs ?

La palette de couleurs utilisée dans la conception d'un tableau de bord doit également être considérée comme un contexte. De nombreux tableaux de bord de produits SaaS interentreprises sont conçus dans une interface utilisateur à thème sombre, car ils sont utilisés pendant plusieurs heures d'affilée.

Les interfaces utilisateur à thème sombre peuvent aider à réduire la fatigue oculaire et à favoriser la clarté visuelle dans l'interface. Cependant, adopter cette approche nécessite une évaluation minutieuse de l'orientation de la conception - les avantages, les inconvénients et les pièges potentiels, comme indiqué dans un précédent article de blog de conception : Dos and Don'ts de l'interface utilisateur sombre.

Conception de l'interface utilisateur du tableau de bord Analytics
Les conceptions, les analyses et les infographies de l'interface utilisateur du tableau de bord fonctionnent bien sur une interface utilisateur sombre, mais doivent toujours être "manipulées avec soin" pour assurer un contraste suffisant (par Alex Gilev).

Meilleure conception de tableau de bord avec la recherche d'utilisateurs

La recherche sur les utilisateurs aide à créer un environnement dans lequel les utilisateurs reçoivent des données pertinentes, claires et concises. Cela les aide à réfléchir au contenu et aux données qu'ils recherchent, plutôt qu'à la manière de les utiliser et d'y accéder.

Certains tableaux de bord doivent fonctionner ou être personnalisables sans effort pour les utilisateurs de différents rôles qui consultent le même tableau de bord de base. La recherche sur les utilisateurs est importante car elle aide à déterminer les objectifs, les modèles mentaux, le contexte environnemental et les points douloureux de l'utilisateur. Ce sont des facteurs qui influencent grandement la conception finale du tableau de bord.

Présentation de la conception d'un tableau de bord
Conception du tableau de bord par Toptal Designer Stelian Subotin

Le concepteur d'expérience utilisateur, chercheur et auteur Mike Kuniavsky note qu'il s'agit « du processus de compréhension de l'impact du design sur un public ».

Un concepteur doit définir les différents types d'utilisateurs et comprendre où leurs objectifs sont les mêmes et où ils diffèrent. Quelles informations sont les plus exploitables pour un type d'utilisateur plutôt qu'un autre ? Ils doivent déterminer s'il doit y avoir une disposition différente d'un type d'utilisateur à un autre, ou s'il existe une solution pour un cas d'utilisation plus général.

En gardant cela à l'esprit, il est judicieux de commencer par des wireframes rudimentaires et de passer à des prototypes pouvant être testés avec des utilisateurs réels lors d'une phase de recherche d'utilisateurs. Des informations vraiment précieuses peuvent sortir d'une courte phase de recherche d'utilisateurs avec seulement cinq utilisateurs, et cela fera gagner énormément de temps sur toute la ligne.

Conception de tableau de bord filaire basse fidélité
Wireframe du tableau de bord par Aaron Sananes

Divulgation progressive dans la conception de tableaux de bord

La divulgation progressive est une technique utilisée pour maintenir l'attention d'un utilisateur en réduisant l'encombrement. La création d'un système de divulgation progressive aide à créer un environnement centré sur l'utilisateur, ce qui permet de prioriser l'attention de l'utilisateur, d'éviter les erreurs et de gagner du temps. Cela permet également aux utilisateurs de se concentrer sur les fonctionnalités clés qui les intéressent et de ne pas être obligés de parcourir toutes les fonctionnalités, y compris celles dont ils n'ont pas besoin ou qui ne les intéressent pas.

La divulgation progressive est une pratique exemplaire en matière de conception de tableaux de bord qui réduira également considérablement les taux d'erreur ; cela améliorera l'efficacité et aidera les utilisateurs à améliorer leur compréhension des tableaux de bord lorsqu'un système est basé sur la hiérarchisation des fonctionnalités.

Conception de l'interface utilisateur du tableau de bord et visualisation des données
Conception du tableau de bord par Jan Losert

La divulgation progressive reporte les fonctionnalités avancées ou rarement utilisées sur un écran secondaire, ce qui rend les applications plus faciles à apprendre et moins sujettes aux erreurs. – Jacob Nielsen

L'animation est un excellent moyen de satisfaire une variété de besoins des utilisateurs tout en remplissant de multiples fonctions. C'est une excellente option à utiliser pendant le chargement des données et des visuels et c'est une solution de divulgation progressive avancée.

L'animation est le processus de création de l'illusion de mouvement ; c'est une dynamique qui crée un sentiment de progrès et de rétroaction constante, réduisant ainsi l'incertitude de l'utilisateur et augmentant la performance perçue.

Animation de l'interface utilisateur du tableau de bord
Tableau de bord par Virgil Pana

Avantages de l'utilisation de la divulgation progressive dans les tableaux de bord :

  • Réduire l'incertitude et l'anxiété des utilisateurs (en affichant des signes de progrès, les utilisateurs sont assurés que tout fonctionne comme prévu)
  • Offrir aux utilisateurs quelque chose à regarder (affichage partiel des données) plutôt que de les faire attendre
  • Fournir aux utilisateurs une attente claire des étapes à venir et créer une compréhension de la manière dont les informations sont présentées hiérarchiquement

Les problèmes potentiels liés aux divulgations progressives et au chargement des données incluent :

  • Utiliser les indicateurs et les informations de manière inappropriée. Des temps de chargement courts et des étapes inutiles créeront une distraction et vont à l'encontre des principes d'utilisabilité.
  • Un retard dans la récupération des données sans indicateur clair de progression peut entraîner une incertitude pour les utilisateurs et des taux de rebond plus élevés.
  • L'utilisation d'indicateurs de progression statiques est une solution peu significative et n'offre pas suffisamment d'informations sur la progression, ce qui peut également entraîner une incertitude de l'utilisateur et des taux de rebond plus élevés.

Conception de l'interface utilisateur et de l'expérience utilisateur du tableau de bord
Conception du tableau de bord par Mason Yarnell

Sommaire

Les tableaux de bord sont un moyen puissant de communiquer des données et d'autres informations, en particulier avec une conception centrée sur l'utilisateur et axée sur les objectifs qui suit les meilleures pratiques de conception de tableaux de bord et une visualisation appropriée des données. Bien que chaque tableau de bord soit différent et ait ses propres objectifs, exigences et limites, le respect de ces principes fondamentaux vous aidera à créer des conceptions exceptionnelles, quelles que soient les spécificités :

  • Tout d'abord, sympathisez avec vos types d'utilisateurs et comprenez leurs objectifs.
  • Transmettez une histoire claire aux utilisateurs en utilisant des visuels suggestifs, des étiquettes, des techniques de divulgation progressive et des animations.
  • Facilitez les choses complexes en appliquant des techniques de recherche d'utilisateurs.
  • Révélez les données et les informations au moment opportun, dans un système d'exploration.
  • Utilisez la visualisation des données pour exprimer des informations de manière significative.

• • •

Pour en savoir plus sur le blog Toptal Design :

  • eCommerce UX - Un aperçu des meilleures pratiques (avec infographie)
  • L'importance de la conception centrée sur l'humain dans la conception de produits
  • Les meilleurs portefeuilles de concepteurs UX - Études de cas et exemples inspirants
  • Principes heuristiques pour les interfaces mobiles
  • Conception anticipative : comment créer des expériences utilisateur magiques