Infobulles sur un graphique en anneau à niveaux - quoi afficher?
J'utilise un graphique en demi-anneau pour montrer les progrès d'un utilisateur au fil du temps. Je veux montrer leur score actuel et leur score précédent. Le vert signifie qu'ils s'améliorent. Le bleu et le rouge signifient qu'ils font pire. Je veux aussi montrer comment ils se comparent à la moyenne (c'est le gris).
Je n'arrive pas à comprendre ce que les info-bulles doivent lire. Pour la carte B, j'aimerais que l'infobulle vous indique le score actuel. Cela suggère que l'ensemble de l'anneau vert (à la fois les parties vert clair et vert foncé) correspond à 55%, comme indiqué par l'infobulle.
Cependant, lorsque vous comparez cela au fonctionnement de la carte C, cela n'est pas cohérent. L'info-bulle de la carte C vous indique uniquement la valeur de la partie bleue.
Dans l'ensemble, j'ai l'impression de compliquer les choses. J'ai un demi-esprit pour revenir à un design précédent, dans lequel la partition précédente obtient sa propre bague (veuillez pardonner le travail rapide). Ici, le vert est le score actuel, le bleu est le score précédent et le gris est le score moyen. 
Toute suggestion serait très appréciée.
À la vôtre, Nico
Cela semble assez clair, les couleurs définissant les valeurs et gardant l'affichage graphique que vous visez.
Les cercles que vous utilisez pour comparer les 3 valeurs
- Radius: ne représente rien comme vous l'avez en ce moment
- Arc: valeur entre 0% et 100%
- Couleur: différencier les éléments
Votre approche inférieure est plus claire car chaque arc peut être comparé aux autres. Cependant, comme le rayon est différent, chaque arc a une longueur (périmètre) différente ajoutée à l'épaisseur de la ligne, ce qui peut le rendre un peu déroutant (les extérieurs semblent plus gros que les intérieurs). La réduction de l'épaisseur de la ligne pourrait aider:
Votre approche supérieure n'a pas le problème de différence de longueur que j'ai commenté ci-dessus (en ignorant l'arc gris). Mais comme les arcs ont le même rayon, ils se chevauchent et il est difficile à lire et encore plus à interagir avec.
Dans les deux représentations également, le 50% semble un peu déroutant car il s'agit du 50% du 50% du cercle.
L'utilisation de la ligne pourrait est plus fidèle aux valeurs représentées. Quoi qu'il en soit, voici quelques idées au cas où elles pourraient vous orienter vers une autre direction.
L'interaction avec le graphique peut être complexe avec les figures courbes. Une possibilité est que toutes les interactions se font avec la légende. Par exemple: un survol du score réel de 55% dans la légende afficherait des info-bulles dans le graphique comparant cette valeur aux autres scores.
Utilisez une ligne sur l'image pour indiquer le score précédent. De cette façon, vous pouvez utiliser le même aspect, que le score précédent soit supérieur ou inférieur.
Si vous vous concentrez uniquement sur la visualisation sans tenir compte de la capacité d'apprentissage et des objectifs de l'utilisateur, vous pouvez donc rencontrer des problèmes, par exemple trois barres courbes colorées de tailles différentes sans légende seront difficiles à comprendre.
Votre objectif de concepteur est de créer une visualisation qui communique sa signification efficacement .
Vous mentionnez d'abord que vous souhaitez montrer aux utilisateurs la progression dans le temps (une tendance), puis vous dites que vous souhaitez afficher le score actuel et le score précédent (une comparaison). Vous rendez-vous compte que ce sont deux choses très différentes, qui pourraient nécessiter deux visualisations différentes?
Si vous parlez d'un nombre qui change au fil du temps, c'est-à-dire le score, alors c'est une tendance, et Spark lines est une très bonne métaphore visuelle pour montrer une tendance numérique.
Les données importantes seront toujours le score actuel, donc tout le reste n'est qu'historique et/ou comparaison.