Les graphiques permettent de représenter des données de manière visuelle. Le choix du type de graphique est important, car il détermine la qualité de restitution des données.
Bonnes pratiques pour tous les graphiques
Choix du graphique en fonction de l’objectif
Le type de graphique restitue les infos de la manière la plus pertinente et lisible pour l’utilisateur.
Quel est le meilleur graphique à utiliser pour…
est défini en fonction de ce qu’on veut montrer à l’utilisateur. :
Usage | Type de graphique | Illustration |
|---|---|---|
Pour |
-
comparer des valeurs indépendantes | Histogramme |  |
Pour comparer les compositions de plusieurs valeurs | Histogramme empilé |  |
Pour comparer les valeurs d’un tout (composition, répartition) |  | |
Pour montrer une évolution continue dans le temps |  | |
Histogramme ou histogramme empilé | | |
Pour comparer / analyser des données plus |
complexse (montrer une évolution de valeurs dans le temps et indiquer une moyenne, un min, un max, …) | Graphique combiné (courbe / histogramme) |
Bonnes pratiques pour tous les graphiques
Cohérence du type de graphique utilisé et de la manière dont il est utilisé (couleurs, titre, …) entre les différentes vues.
...
Taille minimum du graphique
Définir une taille minimum pour le graphique afin de faciliter la lecture du graphique au moment où l’utilisateur l’insère dans un tableau de bord.
Titre
Ne pas indiquer le type de graphique dans le titre (
donut/graphique/courbe/histogramme/ …)Indiquer la donnée temporelle entre parenthèse dans le titre
Exemple : à faire ce qu’on veut et ce qu’on ne veut pas
CA par collaborateur (mois)
...
Afficher les libellés plutôt que les codes, sauf s’il est plus pertinent d'afficher les codes.
Exemple :
Cas où il est plus pertinent d’indiquer le code + libellé : Compte comptable : 60600000 - Achats non stockés de matières et fourn.
étiquette de donnée : ne pas afficher la donnée chiffrée entre parenthèse dans la légende. Laisser cette info au survol du graphique.
Hover
La valeur doit s’afficher au rollover sur la partie graphique
Intéressant de mettre aussi le contenu de la légende au hover ?
Contenu de graphique
Utiliser les couleurs de la charte
Garder un maximum de cohérence au niveau des couleurs d’une vue à l’autre (exemple .
Exemple :
si je fais un graph sur un chiffre d’affaire sur la fiche client, avoir une couleur identique que celle qui représente le chiffre d’affaire sur l’interface d’accueil)
Hover
La valeur doit s’afficher au rollover sur la partie graphique
Intéressant de mettre aussi le contenu de la légende au hover ?