Google | 2025
Application et site web d’une solution pour l’apprentissage des émotions à l’usage des enfants*
Rôle
- • Product Designer
Responsabilités
- • Recherche utilisateur
- • Ux mapping
- • Wireframes papier/digital
- • Prototypes low/hight-fidelity
- • Itérer sur les designs
Information
Contexte
Emoti est un projet relevant de la conception pour le bien commun. Il s’agit d’une application (IOS) d’apprentissage des émotions pour les enfants. En plus de l’application, un site web a été conçu pour la présentation du projet à destination cette fois-ci des parents et/ou écoles.
Challenge
Les émotions à l’instar du langage s’apprennent dès le plus jeune âge de manière « naturelle» cependant les composantes sociales et culturelles sont importantes et jouent un rôle essentiel dans l’apprentissage. C’est pourquoi, il est important de proposer des outils qui s’adressent à tous les enfants, avec particularités cognitives ou non.
Objectif
Permettre aux enfants d’apprendre de manière ludique les émotions par le biais d’une application dédiée sans la notion de notation ou d’évaluation.
Méthodologie
Comprendre l'utilisateur
Recherche utilisateur
Résumé
J'ai mené des entretiens et analyser / synthétiser ces résultats en cartographiant l'expérience utilisateur via l’ux mapping (carte d’empathie, user journey, experience map) Les deux principaux groupes d'utilisateurs identifiés par la recherche est celui des parents d’enfants de 4 à 8 ans sans particularités cognitives et celui des parents d’enfants de 4 à 8 ans avec particularités cognitives.
« Je veux donner à ma fille de 4 ans une éducation complète et chercher à l'éveiller. »
« Donner aux enfants avec particularités toutes les chances de vivre leur différence non comme un fardeau mais comme une opportunité »
Personas
Énoncé de problème
Samia est une mère au foyer qui souhaite passer du temps avec sa fille pour l’éveiller afin de l’aider à bien grandir et lui donner une éducation complète.
Énoncé de problème
Pierre est un père de famille engagé pour la reconnaissance des enfants autistes qui veut aider son enfant et d’autres à apprendre l’empathie et la reconnaissance des émotions pour que tous les enfants puissent vivre au milieu de tous à la fois à l’école mais aussi en société avec leurs particularités.
Audit concurrentiel
Ces 3 acteurs sont très différents autant sur le plan du produit que du type de structure. Chacun avec leurs forces et faiblesses sur leur proposition de valeur, leur identité visuelle ou encore la nature de leur offre applicative.
Idéation
Pour cette phase je me suis beaucoup appuyé et inspiré de l'audit concurrentiel notamment pour proposer des parcours ludiques.
Commencer la conception
Wireframes digitaux
Comme l’application est à destination des enfants entre 4 et 8 ans, je me suis appuyé sur des interfaces essentiellement visuelles du fait que la lecture est pour certains en cours d’apprentissage ou peu aisée. La 1e étude a révélé que certaines actions peuvent être signifiées à l’aide d’icône + label
Prototype basse-fidélité
Un parcours simple pour jouer rapidement depuis l’écran d’accueil via un bouton « Jouer ». Ensuite pour chaque écran des consignes simples pour débuter l’apprentissage des émotions.
Étude d’utilisabilité
Critères
- Type, Étude modérée
- Ville, Lyon
- Participants, 5
- Durée, 20 à 30'
Conclusion
- Trop d'animations au clic
- Manque de clarté
- Difficulté de lecture
« Parfois j'ai besoin qu’un adulte m’aide à faire les choses »
Peaufiner la conception
Maquettes
Les enfants ont indiqué qu’il y avait trop d’animation sur le site et la visite guidée sous forme de fenêtre pop-up semblait trop intrusive et générait de la confusion. Celle-ci a été remplacée par des pages Comment jouer ? avec un fonctionnement plus classique et simple avec la suppression d’actions comme « Ignorer la visite » et « Ne plus afficher ce message »
En posant la question Comment pourrions-nous nous déplacer dans l’application si on ne lit pas bien ? La plupart ont répondu « avec des images ». Aussi, j'ai ajouté des icônes sur chaque bouton.
Prototype haute-fidélité
Création d’un parcours complet avec le choix du monde, les étapes pour compléter un chapitre, comment jouer ? et enfin des animations (petites alertes en bas de l’écran lorsque l’on active/désactive audio/musique). Certaines parties du prototype comprennent des conditions (par ex. Bouton Visiter le monde)
Accessibilité
- Contraste de couleur qui répond aux normes. Les textes et leur arrière plan ont un contraste minimum de 4,5:1.
La couleur n’est pas seul véhicule de l’information. - Les liens sont courts et explicites.
Hiérarchie de titres. - Limiter les animations et les distraction visuelles ou éléments qui viennent perturber le parcours utilisateur.
Zones d’interaction espacées et facilement atteignable.
Responsive Design
Sitemap
Permettre aux utilisateurs (plutôt des adultes ou parents) de consulter les rubriques les plus importantes du site vitrine avec une navigation prédictive et explicite
Responsive
Permettre aux utilisateurs quel que soit le périphérique de consulter les informations essentielles autour de l’application. Proposition de valeur, les bénéfices, qui sommes-nous, télécharge l’application, etc.
À venir
L’impact
Rendre les parcours ludiques sans être intrusif et limiter la charge de travail pour que l’enfant puisse rapidement accomplir sa tâche
Ce que j'ai appris
Les tâches que doivent effectuer les enfants doivent être comprises rapidement avec des consignes explicites et un vocabulaire adapté.
Adapter le message que l’on soit parent ou enfant, notamment entre le site vitrine de l’application et l’application ou chacune à des finalités très différentes.