Fixed Readability by Prioritizing the Right InformationCorrigé la lisibilité d’un jeu en priorisant la bonne information

The Relationship system encodes the main information through colors, meaning the first information you get from the interface is the relationship type (friend, family, sweethearts...). However, this information rarely changes, compared to the intensity of the relationship that changes up to several times a day, and represents the most important information for the player.

Le système de relations encode l’information principale via la couleur : la première information lue est le type de relation (ami, famille, amoureux...). Or, cette information change rarement, contrairement à l’intensité de la relation, qui peut changer plusieurs fois par jour et qui représente l’information la plus importante pour le joueur.

When two characters know each other, one might be satisfied with the relationship while the other is dissatisfied. In the game, the only differentiation for these opposite states is through text. The player can not see the difference easily at a glance.

Lorsque deux personnages se connaissent, l’un peut être satisfait de la relation tandis que l’autre ne l’est pas. Dans le jeu, seule la définition de la relation différencie ces états. Le joueur ne peut pas voir la différence facilement en un coup d’œil.

Instead of encoding the relationship type's color as the main information, I switched the design to encode the relationship intensity. Colors now represent the intensities of the relationship, and the relationship type is still visible for players to make sure of them.

→ That way, players can recognize more quickly strong and weak relationships, as well as asymmetrical ones.

Au lieu d’encoder le type de relation par la couleur, j’ai encodé l’intensité de la relation. Les couleurs représentent désormais les intensités, le type de relation restant visible pour confirmation.

→ Les joueurs identifient ainsi plus vite les relations fortes, faibles, et asymétriques.

Putting the emphasis on the relationship intensity means that we now need to represent the relationship intensity with 7 colors, from the most positive one to the most negative one. Despite color psychology, I noticed that my testers related to have different classification of these 7 colors, especially when asked to choose 7 different colors (and not nuances of green or red).

→ Allowing for color personalization allows them to map intensities in their own intuitive color language, but also allow more possibilities for colorblind people.

Mettre l’accent sur l’intensité implique de la représenter avec 7 couleurs, de la plus positive à la plus négative. Malgré la psychologie des couleurs, mes testeurs classaient ces 7 couleurs différemment, surtout quand on leur demandait de choisir 7 couleurs distinctes (et non des nuances de vert ou de rouge).

→ Autoriser la personnalisation des couleurs leur permet d’utiliser leur propre langage colorimétrique intuitif, et ouvre aussi plus de possibilités pour les personnes avec des troubles visuels.

Tomodachi Life's original art direction is vibrant and colorful, but relying only on color to communicate information excludes players with color blindness. The secondary information, the relationship type, also needs to be recognizable at glance.

→ I introduced simple icons to differentiate them easily, so that players can first perceive the relationship intensity through visual dominance, and then recognize the relationship type immediately.

La direction artistique originale de Tomodachi Life est vive et colorée, mais ne se fier qu’à la couleur exclut les joueurs avec des troubles visuels. L’information secondaire, le type de relation, doit elle aussi être reconnaissable en un coup d’œil.

→ J’ai introduit des icônes simples pour les différencier facilement, afin que les joueurs perçoivent d’abord l’intensité par dominance visuelle, puis puissent reconnaître immédiatement le type de relation.

The original DS version of the game also centers on relationships. Compared to the new Switch version, the DS version does prioritize the relationship intensity over the relationship type.

→ This information appears through text like on the new Switch version, but also through colors, and these colors make the information stand out as main information.

La version DS originale se concentre également sur les relations. Contrairement à la nouvelle version Switch, la version DS priorise l’intensité de la relation sur son type.

→ Cette information apparaît par le texte comme sur la nouvelle version Switch, mais aussi par la couleur, ce qui la fait ressortir comme information principale.

To build my audit, I gathered feedback from Tomodachi Life players. I asked them to tell me about their experience with the game, more precisely their experience with the relationship system.

→ Around 70% of players said to like the readability of the interface, and said the first information they read is the relation type.

→ When asked to compare their experience with the previous game on DS, 85% of these players precised that the readability is better on the DS version, but the interface is more agreeable on the new Switch version.

Pour construire mon audit, j’ai recueilli les retours de joueurs de Tomodachi Life sur leur expérience du jeu, en particulier du système de relations.

→ Environ 70% des joueurs ont dit apprécier la lisibilité de l’interface, et disent que la première information qu’ils lisent est le type de relation.

→ Interrogés sur la comparaison avec l’opus DS, 85% de ces joueurs ont précisé que la lisibilité était meilleure sur DS, mais que l’interface était plus agréable sur la nouvelle version Switch.

I also analyzed how other life simulator games handle their relationship systems.

→ The Sims 3, The Sims 4 and Inzoi use colors, text labels and icons, and are the reference games in life simulators.

→ Paralives uses text labels and levels, but the game is still in early access.

→ Stardew Valley uses heart gauges, but the relationship system is not complex. In general, the games with most developed relationship systems encode the relationships through 3 different channels: colors, labels and icons.

J’ai aussi analysé comment d’autres jeux de simulation de vie gèrent leurs systèmes de relations.

→ The Sims 3, The Sims 4 et Inzoi utilisent couleurs, libellés texte et icônes, et sont les références en termes de jeux de simulation.

→ Paralives utilise des libellés texte et des niveaux, mais le jeu est encore en accès anticipé.

→ Stardew Valley utilise des jauges en cœur, mais son système de relations est peu complexe.

En général, les jeux au système de relations le plus abouti encodent l’information via 3 canaux : couleurs, libellés et icônes.

I went through several iterations to make sure the information was conveyed properly. Most of these iterations were abandoned because they lacked readability, contrast/accessibility, or even consistency. I made the mistake of trying to design for a particular screen and forgot that the relationship feature was present in several parts of the game, so all of them needed to be consistent and considered to reach this goal.

→ I finally came up with two prototypes that seemed to check all my boxes.

J’ai fait plusieurs itérations pour m’assurer que l’information était bien transmise. La plupart ont été abandonnées par manque de lisibilité, de contraste/accessibilité, ou de cohérence. J’ai fait l’erreur de concevoir pour un seul écran et d’oublier que la fonctionnalité de relation apparaît à plusieurs endroits du jeu, et que par conséquent l’interface devait rester cohérente partout.

→ J’ai finalement obtenu deux prototypes qui semblaient cocher toutes les cases.

I then returned to the players I had interviewed in the research process to show them the two prototypes I came up with, asked them to tell me what was the first information they noticed from the prototypes, and then asked them to comment and compare the two.

→ 100% of players noted the relationship intensity being the first thing they notice, 90% of players confirmed the redesign was an improvement over the original interface, and 60% of players said version 2 was too overwhelming because of the colors. These results show improvement, but they have their limits: I tested on the same group, so people already knew I had a certain goal in mind, leading to confirmation bias. Also, players can be ambiguous, or not know what they feel: for example, some players who praised the readability of the original interface then felt Version 2 was too overwhelming, when it was built on the same principle, a colored background.

Je suis revenue vers les joueurs interrogés en recherche pour leur montrer mes deux prototypes, leur demander quelle était la première information remarquée, puis les faire comparer les deux.

→ 100% des joueurs ont remarqué l’intensité de la relation en premier, 90% ont confirmé que la refonte améliorait l’interface originale, et 60% ont trouvé la version 2 trop écrasante à cause des couleurs. Ces résultats montrent une amélioration, mais ont leurs limites : j’ai testé sur le même groupe, qui connaissait déjà mon objectif, entraînant un biais de confirmation. De plus, les joueurs peuvent être ambigus ou ne pas savoir ce qu’ils ressentent : certains qui avaient loué la lisibilité de l’interface originale ont trouvé la version 2 trop écrasante, alors qu’elle reposait sur le même principe, un fond coloré.

While designing, especially towards the end when I fixed the biggest issues, I often find myself overthinking if an element would serve its purpose better here or there... In reality, there is never one single good answer. The same element can serve its purpose equally well in two different location!

En concevant, surtout vers la fin quand les plus gros problèmes étaient réglés, je me surprends souvent à trop réfléchir à la meilleure place pour un élément... En réalité, il n’existe jamais une seule bonne réponse. Le même élément peut très bien remplir son rôle à deux endroits différents !

Asking a user “Does this work?” while showing them your redesign only leads to “Yes”. In his book The Mom Test, Rob Fitzpatrick explains it perfectly: to understand what users really think, you need to ask indirect questions, analyse their behavior, and be insensitive to any validation. I was well aware of this, but the confirmation bias is something I faced in the User Testing phase of this audit.

Demander à un utilisateur « Est-ce que ça fonctionne ? » en lui montrant votre refonte mène systématiquement à « Oui ». Dans son livre The Mom Test, Rob Fitzpatrick l’explique parfaitement : pour comprendre ce que les utilisateurs pensent vraiment, il faut poser des questions indirectes, analyser leur comportement, et rester insensible à toute validation. J’en étais consciente, mais le biais de confirmation est quelque chose auquel j’ai été confrontée durant la phase de tests de cet audit.

As a UX Researcher, you can not only rely on what users tell you they expect from your designs. The reason for this is that users do not know what they want, and sometimes do not know what they need. They will discover what they want through action, not conversation. Users also do not have the precise vocabulary to describe what they would like, and it is important to know how to decode what they mean without overanalyzing.

En tant que UX researcher, on ne peut pas se fier uniquement à ce que les utilisateurs disent attendre de nos designs. En effet, les utilisateurs ne savent pas toujours ce qu’ils veulent, et parfois même pas ce dont ils ont besoin. Ils découvriront ce qu’ils veulent par l’action, pas par la conversation. Les utilisateurs n’ont aussi pas le vocabulaire précis pour décrire ce qu’ils voudraient, et il est important de savoir décrypter ce qu’ils veulent dire sans trop analyser.