Comment présenter une course pour le score le plus bas
Nous avons un tableau de bord énergétique dans une école primaire STEM. L'une des pages est un concours pour le bâtiment le plus efficace qui commence à 8 h 00 le lundi et se termine à 2 h 45 le vendredi.
Nous montrons actuellement une course où la distance parcourue par chaque bâtiment est calculée comme décrit ci-dessous. Cela permet à toutes les équipes de commencer sur une ligne de départ au début de la semaine/course, pour que le bâtiment le plus efficace atteigne la ligne d'arrivée à l'heure de fin de la compétition prévue, et pour chaque bâtiment d'être positionné en fonction de son efficacité actuelle.
(TimeElapsed/CompetitionDuration) * MIN( EnergyUse(i)/SqFt(i) ) * ( SqFt(i)/EnergyUse(i) )
Cette approche, cependant, n'est pas très intuitive puisque le gagnant est l'équipe avec le score le plus bas (consommation d'énergie par pied carré). De plus, une course typique a une distance définie à parcourir mais pas un temps défini à terminer, ce qui la rend encore moins intuitive. Nous avons également envisagé de dicter le score de chaque équipe en fonction de leur consommation d'énergie par rapport à une consommation d'énergie de base, mais cela peut entraîner une marche arrière de l'équipe qui pourrait être difficile à comprendre.
Comment présenter un concours où le gagnant est l'équipe qui utilise le moins d'énergie?
Je pense que la solution la meilleure et la plus simple est de mettre le score le plus bas (gagnant) en haut et le reste en dessous. Puisque les gens ont tendance à penser que celui qui est en haut de la liste est le meilleur. Comme un classement.
Réfléchissez et faites également des recherches sur l'analyse comparative des ordinateurs. Parfois, ils ont des graphiques avec un sous-titre "Moins c'est mieux". 
J'espère que je vous ai aidé.
Votre approche n'est pas intuitive car vous présentez un score proportionnel à la consommation d'énergie mais vous marquez joueurs selon l'inverse de ça. Calculez un score pour les participants qui correspond au modèle mental intuitif d'un enfant du primaire (plus grand/plus haut est meilleur) et tracez cette valeur. En termes simples ... inversez le score que vous utilisez dans votre graphique.
Une règle d'or UX est de concevoir avec le persona à l'esprit. Ce qui est parfaitement clair pour un adulte éduqué peut encore être incompréhensible pour un élève du primaire .
Maartinus dans sa réponse a fait un très bon point: dans les jeux, le mot "score" a le sens de "plus c'est mieux" (à quelques exceptions près comme Golf et Ramino).
Avertissement
Je ne suis pas un éducateur, le jeu est une partie importante du développement des enfants mais la compétition doit être traitée avec attention. Considérez cette réponse comme un point de départ pour approfondir votre enquête avec l'aide d'un éducateur professionnel .
J'ai marqué certains points avec †, je vous recommande fortement de discuter de ces suggestions avec les éducateurs des enfants: ils peuvent être d'opinion, ils peuvent avoir besoin d'un fond d'études psychologiques pour les soutenir (ce que je n'ai pas) ou ils peuvent être liés à la culture et au niveau d'éducation des enfants .
Cette réponse ne concerne que la moitié de la conception de l'interface utilisateur (comment présenter les données), la partie la plus importante de l'OMI est le expérience globale pour rendre ce jeu agréable et éducatif tout en en gardant à l'esprit le public visé.
Les formules, les valeurs et les noms sont purement illustratifs, connaissant votre domaine, je suis sûr que vous pouvez faire beaucoup mieux que moi.
Préparer
Compte tenu de ces données:
Équipe 1:34 Équipe 2:22 Équipe 3: 56 Équipe 4:16
Nous n'avons pas de valeur de référence absolue (si vous aviez alors simplement inverser les axes X pourrait vous donner le résultat souhaité) alors nous devons normaliser le champ efficacité énergétique. J'ai simplement utilisé 100 - Value / Maximum * 100.
Est-ce que ça fait du sens? Jetons un coup d'œil rapide en ajoutant des barres de données:
Pour une consommation d'énergie croissante (quel que soit le mode de calcul), nous avons maintenant un indice normalisé inversé pour montrer le efficacité énergétique.
J'utilise 100% comme je le meilleur et 0% comme le pire. Certains élèves du primaire peuvent avoir plus de difficultés avec des nombres plus importants ou avec des décimales † (les tronquer lors de la présentation des données.) Si la précision n'est pas votre priorité absolue, vous pouvez utiliser l'échelle [1..10] qui devrait être encore plus intuitive †.
Je ne sais pas † si kBTU/ft2/ an est une unité de mesure appropriée à utiliser pour cibler les jeunes enfants. C'est pourquoi je parle ici d '"indice d'efficacité énergétique", un nombre pur que tout le monde peut comprendre.
Présent
Comment présenter ces informations? Si vous souhaitez utiliser des barres maintenant, cela devrait être facile:
Désormais, les équipes qui obtiennent de meilleurs résultats ont intuitivement un score plus élevé. Vous pouvez comparer la consommation d'énergie sur le même graphique. Parce que efficacité est l'inverse de utilisation et que nous travaillons avec des données normalisées, le tout est toujours à 100%.
Améliorer
Nous avons une équipe avec un score de 0, ce n'est pas visuellement attrayant mais, plus important encore, cette valeur ne changera jamais et le moins performant l'équipe aura toujours un score de 0. Les concurrents sont des enfants alors nous pourrions vous voulez faire part de leurs progrès † (ou du moins montrer que quelque chose se passe). Cela peut aider le moral et l'estime de soi †.
Pour résoudre ce problème, nous pouvons normaliser en utilisant la somme au lieu de la valeur maximale:
Et:
Si les valeurs sont assez élevées, vous pouvez démarrer les axes X à partir d'une valeur non nulle. Il a pour effet positif d'exagérer les différences et peut-être de stimuler un comportement légèrement compétitif †:
Notez qu'il s'agit d'une frontière avec triche avec les données, incluez toujours les valeurs des axes: les enfants doivent s'habituer aux graphiques bien même lorsqu'ils favorisent l'attrait visuel. Cela peut même être un petit point de discussion (s'ils sont assez vieux) pour illustrer à quel point les graphiques mal conçus sont trompeurs (et pour rechercher rapidement les signes de ceux qui sont intentionnellement trompeurs †.)
Je ne peux pas honnêtement comprendre de votre graphique ce que sont les axes X. Temps? Usage? Temps d'utilisation? De plus, si vous travaillez avec un axe temporel, les barres IMO ne sont pas le meilleur choix. Je calculerais un indice et le représenterais sous forme de graphique linéaire.
Faire
Je ne l'ai pas fait dans ces exemples mais vous devez ordonner les équipes en fonction de leur score †. ne autre réponse a déjà répondu à cela. Votre public est composé d'enfants, alors n'hésitez pas à ajouter décorations et couleurs selon le cas † (sans cacher les données, bien sûr).
Acrcturus, dans sa réponse , suggère d'ajouter un marqueur pour le vainqueur. Je pense que c'est une bonne recommandation, mais j'ajouterais mentions spéciales pour tous les autres † (même les moins performants): tendance en constante amélioration, meilleure performance au dernier trimestre, indice le plus stable, etc. . Idéalement, chaque équipe devrait avoir une mention pour quelque chose.
Il y a beaucoup plus de choses à dire à ce sujet (surtout en vue d'une leçon rétrospective †) pour les aider à comprendre comment les pièces contribuent à l'ensemble (imaginons un bâtiment très efficace dans a = monde de très inefficaces). C'est un sujet stimulant mais en dehors de la portée de cette question ...
Triez le graphique en plaçant une barre avec un plus petit nombre (ce qui est bien) en haut et une barre avec un plus grand nombre (ce qui est mauvais) en bas.
Définir la couleur pour la barre avec un nombre plus petit comme vert (ou toute couleur à représentation positive) et la barre avec un nombre plus grand (ou toute couleur à représentation négative)
La métaphore Fuel peut probablement vous convenir le mieux. Donc, votre objectif de course sera
Étant donné 100 KW de soi-disant carburant, parcourez la distance avec une perte de carburant minimale.
Mais vous ne devenez pas négatif. Vous pouvez parcourir la distance, mais si vous avez utilisé tout votre carburant - votre problème, pas de points.
À la fin, vous comptez la quantité de carburant restante et pouvez la convertir en points (si nécessaire). Et cela est 100% clair car tout le monde comprend le carburant et le réservoir de carburant et que "plus de carburant reste - meilleure" efficacité énergétique, etc.
Finalement. Vous pouvez dessiner votre graphique comme vous le souhaitez. Lignes plus grandes (plus de carburant restant) en haut, plus petites (plus de carburant utilisé) - jusqu'en bas.
Vous pouvez aller encore plus loin et composer une belle histoire, vraie de fiction: vous avez un carburant très spécial, chaque gramme contient 1 kW d'énergie. Ou utilisez le nom régulier "essence" :)
afin que vous puissiez enfin dire.
Étant donné 100 grammes d'Elerium-115 complètent la distance avec une perte de carburant minimale.
(en supposant que 1 gramme d'Elerium contient 1kw)
Maintenant, vos courses doivent faire des calculs en cours de route. Pourquoi pas? :)
Ce que vous appelez score n'est pas un score comme il est généralement compris - un plus grand score est généralement compris comme étant meilleur. La Parole semble positive, tout comme progrès . C'est presque comme une vitesse plus élevée signifie aller plus vite, pas plus lentement.
Si vous voulez conserver la valeur de l'énergie par pied carré, alors trouvez un mot différent pour lui, quelque chose qui sonne négatif, comme "perte" ou "coût". Mais il est toujours préférable de s'en tenir à un terme à consonance positive comme score. Tout ce dont vous avez besoin est une meilleure formule.
Comme déjà proposé, l'énergie économisée (calculée par rapport à une limite fixe) ferait l'affaire. La réciproque, c'est-à-dire pieds carrés par kilowatt peut être encore meilleure car elle n'a pas besoin de limite artificielle. Ou pensez grand et comptez le nombre de maisons par plante de chaleur -, ce qui peut vous donner de meilleurs graphismes.
Afficher une barre plus grande pour le gagnant est à mon humble avis mieux que l'inverse. Il vous permet également de commander les équipes comme vous le souhaitez (ce qui n'a pas vraiment d'importance avec seulement quatre équipes).
Tout d'abord, vous devez changer le mot "Terminer" avec quelque chose comme "Max" ou "100KW". La raison en est que si quelqu'un voit Terminer , la première impression est qu'il doit atteindre cette finition , exactement le contraire de ce que vous voulez. Je voudrais également retirer le badge pour la même raison.
Je voudrais:
- ajoutez le nom du bâtiment à côté de sa barre de progression correspondante.
- réorganiser constamment [en temps réel] dans l'ordre croissant le bâtiment dans le graphique [du plus bas au plus haut]
- clipser un dégradé bleu-vert-orange-rouge sur toutes les barres de progression
- changer la couleur jaune de la dernière barre au même rouge à partir des barres de progression
- ajouter deux balises à la fin des deux premières barres de progression avec "gagnant" et "suivi"
À ce résultat
Il a été suggéré par Diogo Belém et Ahmad Naim Muzammil to trie les résultats des scores les plus bas aux plus élevés , en plaçant les gagnants (c.-à-d. des scores plus bas) en haut et les perdants (c.-à-d. des scores plus élevés) en bas du tableau.
Ceci, avec les autres suggestions de ces deux réponses, aide beaucoup. Cependant, cela ne vous permet toujours pas de trouver le gagnant en un coup d'œil et sans aucun doute .
Pour résoudre ce problème, vous pouvez ajouter une étiquette "gagnant" à votre tableau (éventuellement avec une icône). Ceci, avec la commande, permet d'obtenir immédiatement l'intuition que des valeurs plus basses = un meilleur résultat.
Que diriez-vous d'utiliser un graphique linéaire à la place?
Pour moi, cela semble indiquer que la course est basée sur le temps (se termine tous les vendredis), et il est également plus facile de comprendre que plus c'est bas, mieux c'est. Comme autre avantage, on peut voir visuellement quelle équipe a fait des progrès au cours de la semaine, au lieu de simplement voir l'état actuel.
Allez avec des barres verticales vers le bas. De cette façon, les barres les plus longues descendront le plus, ce qui est assez intuitif, car le bord d'attaque des barres sera la caractéristique différente (et donc perçue) des barres, et donc la caractéristique perçue de l'équipe avec moins de dépenses énergétiques sera être supérieur . En outre, ces barres sont généralement utilisées pour la dette ou les résultats négatifs (généralement en conjonction avec un certain bénéfice ou résultat positif, mais de toute façon), de sorte que les téléspectateurs sont habitués à assimiler mieux les petites barres dans ce contexte.
Gardez les mêmes axes, mais dessinez les barres de la droite, venant bas de "100" à la valeur actuelle. Cela fait de la barre la plus longue le favori actuel. Cela capture la sémantique de la consommation - une consommation d'énergie plus faible "consomme" moins de la barre.
Si vous souhaitez indiquer une ligne de base, superposez une ligne verticale étiquetée indiquant cette valeur.
Commentaires annexes
- Sur la base de l'étiquette sur l'axe vertical, vous mesurez apparemment les bâtiments en unités de "KW", qui n'est pas une unité SI. Si vous voulez dire kilowatts, c'est "kW".
- Il est étrange de mesurer des bâtiments en kilowatts. Les bâtiments ont généralement des noms, dont aucun ne semble être indiqué sur l'axe des bâtiments.
- Les bâtiments ne sont normalement pas un ensemble ordonné. Dans l'exemple, il existe un ordre alphabétique naturel. Cela plaide fortement contre réorganisant les barres en fonction du classement actuel.
- Vous semblez utiliser la couleur comme discriminateur de construction. Cela pourrait être mieux indiqué en supprimant l'axe vertical (gauche) et son étiquette et en modifiant la légende en "Bâtiments: [couleur d'accompagnement] A [couleur d'accompagnement] B ...", ce qui pourrait permettre de remplacer le texte absurdement minuscule par le texte de une taille lisible.
- L'axe horizontal est sans étiquette et manque d'unités. Je soupçonne que c'est l'axe qui devrait être mesuré en kW.
- Il semble y avoir deux choses indiquant "Terminer", mais il n'est pas clair comment l'un ou l'autre indique la distance ou le temps entre ici et maintenant et l'arrivée. Une meilleure façon peut-être d'indiquer qu'il s'agirait d'une autre barre horizontale, "Temps restant", dans un groupe de barres distinct (c'est-à-dire avec une séparation verticale plus grande qu'entre les barres des bâtiments) qui diminue à zéro au fur et à mesure que la compétition de la semaine progresse.
Une autre réponse a donné plusieurs façons de renormaliser une mesure "plus petite est meilleure" existante en une mesure où les barres plus longues sont meilleures. Moi, par contre, je n'ai qu'un seul moyen très simple.
Votre valeur actuelle de mérite est "consommation d'énergie par pied carré", sans préciser dans quelles unités la "consommation d'énergie" est mesurée. Pour les besoins de l'argument, je suppose que c'est kilojoules, c'est-à-dire. kilowatt-secondes.
Pour inverser votre graphique afin que "plus grand soit meilleur", il suffit de calculer l'inverse - c'est-à-dire de faire votre chiffre de mérite "pieds carrés par énergie utilisée". Pour rendre les nombres impliqués intuitifs, vous devrez peut-être alors redimensionner les unités (peut-être en kilowattheures ou en mégajoules au lieu de kilojoules, ou en utilisant des mètres carrés au lieu de pieds carrés), mais cela n'affectera pas les longueurs relatives des barres.
Comme autre exemple que j'ai préconisé dans le passé, en utilisant la même technique: au lieu d'exprimer des retards Internet en millisecondes (où plus petit est mieux), faites-le en Hertz (où plus grand est mieux). Un délai transcontinental typique de 100 ms devient une réponse de 10 Hz, ce qui peut très facilement être comparé au framerate d'un jeu. Les LAN Ethernet câblés ont généralement des retards inférieurs à la milliseconde, ou une réponse supérieure à 1000 Hz.
Par votre description, vous avez une valeur statique de time (1 semaine) et une valeur variable de energy (avec les calculs d'accompagnement pour Sqr ft, etc.).
Je le retournerais donc l'heure est variable et à la place énergie est statique.
Par exemple, donnez-leur x energy units/sqrft et avoir le time this energy would last for us en tant que variable.
Allouer une "quantité d'énergie" inférieure à l'efficacité initiale requise
Il s'agit d'une compétition pour atteindre une meilleure efficacité . Alors, donnez-leur (dans le graphique ...) moins d'énergie que ce dont ils ont besoin actuellement.
En tant que tel, lorsque vous créez un graphique initial pour lancer la compétition, vous avez quelque chose où aucune des barres horizontales portée une semaine pour le moment.
Mais ce serait le réel (ou imaginaire) objectif final: atteindre suffisamment d'efficacité pour que l'énergie allouée dure une semaine, voire plus.
Ce paramètre vous permettrait de voir le gagnant d'un coup d'œil, car ce serait le groupe avec la barre la plus longue.
[Edit 4-28-18: J'ai réalisé que je répondais en mode développeur sur le forum UX. Cette équation m'a déclenché. J'ai supprimé tous les détails et explications de l'équation.]
Vous pouvez certainement faire cet affichage. Cet affichage est un graphique à barres commun affichant des pourcentages. Cet affichage devrait simplement communiquer qui remporte le concours et non toutes les équations qui y entrent.
Un problème est le libellé. L'exemple l'appelle une "compétition énergétique" quand il s'agit d'une "compétition d'économie d'énergie". L'économie et l'économie d'énergie sont des concepts très courants. L'écran affiche donc les économies, pas la consommation.
Cet exemple affiche des nombres réels. Cela fonctionne avec n'importe quel nombre de candidats. Le temps d'affichage en haut peut être un contrôle.
L'affichage peut être de n'importe quelle taille. La largeur de la course en pixels est utilisée pour créer les barres. Les seules données nécessaires sont un ensemble de chiffres de consommation (voir ci-dessous). Cette équation renvoie la largeur en pixels de la barre d'un concurrent.
Voici l'équation pour créer les barres:
Largeur de barre = largeur de temps - (((unités utilisées - unités les plus petites)/la plupart des unités)/largeur de temps);
Voici les chiffres utilisés dans l'exemple (numéros de consommation): A: 184, B: 361, C: 120, D: 408, ligne de base: 392
Je pense que la façon dont les informations sont présentées ne semble pas correspondre à l'objectif et cela se produit à deux niveaux différents. La première consiste à faire correspondre une race au modèle mental de la façon dont les gens perçoivent les économies d'énergie, et vous pouvez le faire en reformulant ou en restructurant les données afin qu'elles représentent la quantité relative d'énergie économisée (qui augmente progressivement) au lieu de la quantité de la consommation d'énergie (qui diminue quand ils sont plus efficaces). Je ne sais pas à quel point il est logique de comparer la consommation d'énergie absolue, car cela signifie que les bâtiments devraient avoir le même nombre d'exigences énergétiques dans des conditions similaires (par exemple, les bâtiments plus anciens qui sont moins économes en énergie), sinon vous ne seriez pas faire une comparaison équitable.
Le deuxième aspect est d'essayer de visualiser les informations d'une manière qui encourage le comportement que vous essayez d'influencer. Une course est importante mais alors qu'une course n'a qu'un seul gagnant, vous devez récompenser/encourager le comportement, qu'ils soient gagnants ou non, tant qu'ils présentent le comportement préféré. Donc, quelque chose comme un graphique à puces où vous pouvez également afficher une comparaison avec leurs efforts précédents vous permet de montrer des bâtiments qui ont également amélioré leurs efforts précédents serait mieux que d'avoir simplement un gagnant contre les autres.
Voici quelques explications sur le fonctionnement des graphiques à puces: https://en.wikipedia.org/wiki/Bullet_graph