Affichage des progrès de l'activité sur une longue période

Question

Contexte

Je fais une application mobile, où les utilisateurs doivent effectuer une tâche N fois par jour. Le public cible est les femmes, intéressées par un mode de vie sain (donc pas les ingénieurs qui sont à l'aise avec beaucoup de données, de graphiques, etc.).

Chaque journée peut être classée comme réussie (la tâche a été accomplie au moins N fois), presque réussie (par exemple, la tâche a été accomplie entre N-1 et N-3 fois), ou infructueuse (tout le reste). Cependant, je ne veux pas qu'il soit porteur de négativité avec des jours infructueux (donc les choses rouges vives criant ÉCHEC sont un non).

Le problème

Ce qui me pose problème, c'est d'afficher les progrès réalisés au cours des 7 et 30 derniers jours. J'essaie de trouver quelque chose de simple à comprendre en un coup d'œil et la haute précision n'est pas vraiment importante. Cela signifie que l'utilisateur final ne se soucie pas vraiment si elle a réussi 10 jours sur 30 ou 11. Le codage couleur est donc une solution potentielle car il donne une bonne idée, brièvement, sans mettre l'accent sur la précision.

Solutions que j'ai trouvées

1. Informations textuelles. Par exemple: vous avez atteint votre objectif 10 jours consécutifs! Cela pourrait être un ajout à d'autres solutions, plutôt que la seule solution. Pro: sans ambiguïté. Con: fournit beaucoup de texte et n'est pas clairement évident qu'il soit bon ou mauvais. L'utilisateur doit le lire à chaque fois.
2. Calendrier à code couleur. Similaire à github:  Avantages: le codage couleur le rend facile à comprendre rapidement, simple pour un suivi de 7 jours car seulement 7 carrés. Inconvénients: délicat pour une période plus longue (30 jours), pas évident à première vue que c'est un calendrier.
3. Graphiques. On dirait que c'est une mauvaise solution car elle met l'accent sur la précision et les valeurs absolues plutôt que sur l'un des 3 états. Les utilisateurs peuvent ne pas être très à l'aise avec les graphiques.

Je cherche à utiliser la même solution pour une visualisation de 7 et 30 jours pour garder la cohérence. Mais peut-être que la différence entre 7 et 30 États est trop grande pour utiliser la même solution (par exemple, le calendrier à code couleur est moins convivial pour 30 États par rapport à 7).

Answer 1

Je pense que la solution 2 est la meilleure option pour commencer, uniquement parce que les couleurs et les calendriers correspondent à la façon naturelle dont nous pourrions penser les périodes et les statuts dans le contexte de ce que vous avez décrit.

Je pense qu'il y a trop de différence entre les plages de 7 et 30 jours pour les présenter en même temps, et vous devez donc vous en tenir à la conception normale permettant à l'utilisateur de basculer entre ces deux vues (par exemple, le calendrier Microsoft Outlook).

Le calendrier github est légèrement plus difficile à lire entre il est affiché de haut en bas et non horizontalement comme il le fait normalement, donc si vous prenez un calendrier standard avec les dates affichées et le code couleur comme vous l'avez conçu, il devrait fonctionner correctement pour le Vue de 30 jours.

Answer 2

Cela peut vous donner quelques idées: https://github.com/mbostock/d3/wiki/Gallery

Pourrait également essayer quelque chose comme ceux-ci: