Rencontres entre grenouilles

Formation : DPNUX 2023
Durée du projet : 3 mois
L’équipe : Mehdi, Étienne, Florian, Romain, Camille
Pitch : Frog Paradise, le jeu pour ceux qui ont toujours rêvé de rencontrer de nouveaux amis avec qui vivre de petites aventures dans un monde de grenouilles mignon et coloré.

L’équipe

  • Équipe recherches : Florian, Étienne
  • Équipe conception : Mehdi, Camille, Romain
  • Équipe Test : Romain, Étienne 

Nous sommes tous issus d’horizons assez divers, Camille venant du marketing, Romain du graphisme, Mehdi du design d’interfaces, Florian de la direction de projets et de la sociologie, et Étienne du développement logiciel, compétences qui ont été mises à profit au cours de ce projet. 

Un jeu vidéo historique

Frog Paradise est un jeu vidéo social dans un univers coloré de batraciens et de marécages. Le joueur incarne une mignonne petite grenouille portant sa couleur préférée, allant d’un lieu à l’autre pour tchatter avec des amis, jouer et vivre des aventures seul ou à plusieurs.

Frog Paradise est une reprise d’un jeu flash existant : Club Penguin, qui a été créé par New Horizon Interactive en 2005, racheté par Disney puis fermé 13 ans plus tard, car ne rapportant pas assez de millions aux yeux de la multinationale. Depuis, le jeu fait l’objet d’un jeu de chat et de la souris (d’autres animaux…) entre les fans qui ouvrent des serveurs hébergeant le jeu, et le détenteur de la licence qui les fait fermer. Un marché existe donc pour permettre aux nostalgiques de retrouver les sensations de leur enfance, dans un produit ne présentant pas les limites du jeu initial à la technologie vieillissante.

Un développeur de jeu indépendant, Marco, connu sous le nom d’Arkansio et lui-même passionné par le jeu original a formé équipe avec Nico, joueur au profil plus commercial, afin de lancer Frog Paradise. Les manchots de l’époque ont fait place à de mignonnes petites grenouilles, un graphiste londonien se chargeant de la partie artistique du jeu.

Frog Paradise, année zéro

Nous intervenons au début du projet, alors que seules les fonctionnalités vitales ont été développées : à ce stage, nous pouvons créer un compte, donner un nom à une grenouille, entrer dans une taverne, ouvrir une carte où se trouvent les quelques lieux disponibles, s’équiper d’une épée et envoyer des messages sous forme de bulle flottante.

Une communauté dynamique existe déjà ; plus de 600 personnes s’enthousiasment sur Discord à propos des premiers visuels, ou expriment leurs attentes pour le jeu. Quelques dizaines de joueurs ont accès à la version alpha et participent à des tests.

Nos commanditaires nous ont proposé de manière assez libre de travailler sur le design d’éléments d’interface, ainsi que sur tout élément que nous jugerions propice à améliorer l’expérience de jeu.

Notre mission

Au terme d’une réunion de lancement, nous avons arrêté avec le commanditaire les sujets suivants : 

  • Recherche utilisateur sur l’écosystème dans lequel s’inscrit le jeu ;
  • Boutons de l’écran principal (envoyer un message, utiliser un objet…) ; 
  • Inventaire (stocker les collectables…) ;
  • Design system (unifier le design d’interface du jeu).

La recherche devant être livrée sous forme d’une synthèse d’étude sur le jeu et son écosystème, et le reste sous forme de prototypes Figma à implémenter par le développeur.

Les utilisateurs potentiels étant soit les enfants susceptibles comme à l’époque d’être intéressés par Frog Paradise soit les nostalgiques du jeu précédent, il a fallu faire un choix. Le commanditaire nous a demandé de nous centrer sur cette dernière catégorie, constituant la communauté actuelle.

La recherche

La recherche a été menée en mettant les testeurs de la bêta à contribution via des entretiens visant à comprendre leur perception de Frog Paradise et leur profil de joueur. Nous avons aussi eu recours à des questionnaires auprès de la communauté afin d’obtenir des résultats plus quantitatifs sur la cible du jeu. 

Pour la recherche secondaire, nous avons eu recours à la littérature issue de la foisonnante recherche académique et de la presse spécialisée sur les joueurs. 

Quelques exemples de résultats marquants : 

  • Le jeu social est le genre le plus pratiqué par les jeunes joueurs (10-17 ans) ;
  • La communauté de Frog aimerait retrouver le système d’animaux de compagnies qu’il y avait dans Club Penguin
  • L’interface actuelle est assez peu appréciée ; 
  • La dimension exploratoire du jeu est à étendre. 

Ce qui nous donne plusieurs directions à creuser pour l’avenir de ce jeu. 

La solution

Après plusieurs itérations issues d’une recherche sur l’implémentation de ces éléments d’interface dans l’industrie et des retours du commanditaire, nous avons testé un prototype au laboratoire d’ergo-design du campus Saint-Marcel des Gobelins. 

Au programme, scénarios proposés aux testeurs nécessitant d’interagir avec l’interface, enregistrement de leurs réactions et de leur regard via des mesures oculométriques, écoute de leurs sensations, le tout dans une ambiance d’empathie et de bonne humeur où nous avons pu mettre à l’épreuve notre conception. 

Certains éléments ont été gardés, tels que la barre de messages ou le bouton d’inventaire, d’autres ont dû être modifiés, comme la collection d’objets trouvés dans le jeu. 

Cette journée de tests nous a aussi permis de mieux faire la connaissance de notre commanditaire et de lui proposer une séance de co-conception, où de nombreuses idées ont émergé pour améliorer la dimension interactive du jeu.

Le design system

La difficulté pour nous lors de la conception de ce design system est venue de la technologie sous-jacente : à la différence du monde des interfaces en HTML-CSS, les éléments d’interface sous Unity sont composés en utilisant un système de calques. Pour un bouton, par exemple, il y aura un calque pour le fond, puis un deuxième de contour sur lequel est appliqué un calque de label. 

L’équipe de Frog Paradise dispose à présent d’une première version de Nénuphar, le nom que nous avons donné à ce design système, autour de laquelle construire les premiers blocs d’éléments d’interface. 

Art Consortium

  • Formation : DPNUX, Directeur de projet digital et UX manager – 2022/2023
  • Durée du projet : 3 mois
  • Dossier de conception : lien ici
  • Les logiciels : Miro, Figma, Notion, Google Form, Google drive
  • Prototype : lien ici

Contexte commanditaire :

Créée en 2022, Art Consortium est une startup incubée à Station F (Paris) qui souhaite proposer aux musées et galeries d’art une nouvelle solution de mécénat pour les aider à se financer.

Quand un musée souhaite, par exemple, acquérir une nouvelle œuvre, la valeur financière du tableau sera alors mise en vente, en ligne, directement depuis le site du musée.

Cette valeur sera proposée à l’achat sous forme d’action numérique : les Art Share Token (AST). Les AST sont inscrits de façon sécurisée sur une blockchain et sont liés à un certificat d’authenticité. Lorsque la valeur du tableau est, par exemple, fixée à 300 000 €, 300 000 AST sont à vendre (donc 1 AST égal à 1 €).

Plusieurs acheteurs pourront acquérir les AST d’un même tableau, ils deviendront co-collectionneurs de la valeur financière de l’œuvre, mais pas de l’œuvre physique car l’œuvre restera toujours la propriété du musée. Si le musée revend un jour l’œuvre physique, alors les co-collectionneurs de la valeur financière de l’œuvre seront remboursés à hauteur de leur achat.

Notre mission :

Mener une recherche utilisateur dans le but de créer une marketplace d’achat et de revente d’AST tout en identifiant et définissant la cible.

Notre problématique :

Qui pourraient être les utilisateurs d’Art Consortium, quels sont leurs profils et leurs besoins ?

Notre recherche et l’analyse :

Pour la conception du projet, nous nous sommes basés sur une démarche centrée utilisateur, c’est-à-dire que nous avons souhaité impliquer l’utilisateur tout au long de notre processus de recherche et de conception. Pour cela, nous avons appliqué la méthode du double diamant.

Cette méthode s’articule autour de quatre phases principales :

  • Phase d’exploration : Afin de répondre à notre problématique, nous avons décidé de mener deux phases de recherche en parallèle :
    • des interviews quantitatifs menées grâce à un questionnaire et proposé à des visiteurs de musées parisiens. Nous avons également partagé ce questionnaire sur les réseaux sociaux, dans des groupes dédiés à l’art, au Web3 ou à l’investissement (54 répondants).
    • des interviews qualitatifs en proposant un entretien de 30min (7 participants).
  • Phase de définition : Dans cette phase, nous avons entamé l’analyse thématique et statistique. Pour chaque participant interviewé, nous avons réalisé une empathy map individuelle nous permettant de créer, par la suite, des personae en se basant sur des éléments communs :
    • un persona primaire, représentant un investisseur attentif à l’art et à la préservation des musées, également connaisseur du Web3, des NFT et de la Blockchain.
    • deux personae secondaires, comprenant un profil investisseur et profil donateur.
    • un anti-persona, qui adopte un point de vue critique et sceptique sur le sujet des AST et de la Blockchain.
Persona primaire et persona secondaire n°1. (© Gobelins.)
Persona secondaire n°2 et anti-persona (© Gobelins.)
  • Phase d’idéation : Nous avons réalisé un atelier de conception dans le but de définir le parcours utilisateur convenant le plus à notre cible, en prenant en compte de 3 points importants :
    • Mettre en avant la notion de “Soutien aux musées” ;
    • Vulgariser et démocratiser les AST ;
    • Simplifier le parcours d’achat et de revente d’AST.
    L’objectif de cette conception était de pouvoir tester un prototype des parcours d’achat et de revente d’AST, auprès de 5 participants au sein de labo Ergo-Design Lutins-Gobelins au campus de Saint-Marcel (Paris XIIIe). Pour ce faire, nous avons établi un protocole de test avant de réaliser des prototypes, dans le but d’avoir une vision claire sur les objectifs à atteindre et les hypothèses à valider.
Home page (© Gobelins.)
Page de l’œuvre et Dashboard (© Gobelins.)
  • Phase de livraison : Suite à notre test utilisateur, nous avons analysé les réponses pré-tests, la grille d’observation “rainbow spread sheet” accompagnée d’enregistrements oculométrique ainsi que tous les commentaires exprimés lors de l’entretien et relevés sous forme de verbatims.

Nos recommandations

Nous avons récoltés des retours assez positifs, les utilisateurs ont bien compris le concept et réussi à réaliser les parcours d’achat et de revente d’AST sans difficulté : aucun élément n’a été ignoré ou est resté invisible durant le parcours. De plus, l’aspect épuré et moderne de notre prototype a été beaucoup apprécié. En revanche, pour aller plus loin et améliorer les maquettes, nous avons retenu quelques points de friction importants à traiter, tel que :

  • Les utilisateurs s’intéressent aux contenus et en prennent connaissance. Cependant, des éléments gênent la compréhension de l’achat.
  • Les utilisateurs n’ont pas bien compris le fait qu’ils doivent sélectionner un co-propriétaire pour pouvoir réaliser l’achat.
  • Le contenu aide grandement à la compréhension du projet. Cependant, certaines informations ne sont pas bien placées (ex : FAQ)
  • Les utilisateurs ont mis en moyenne 1 minute 41 pour acheter leurs premiers AST.
  • Les utilisateurs ont tous trouvé l’interface clair. Cependant, ils aimeraient avoir accès à plus d’informations sur l’œuvre dans le but de créer un lien émotionnel lors de leur achat.

Notre affiche :

Affiche présentant notre recherche utilisateur. (© Gobelins.)

Pour en savoir plus, n’hésitez pas à jeter un coup d’œil sur notre dossier de conception !

Panic Market

Jeu multi-joueur sur le thème de la pénurie en supermarchés lors des confinements forcés par le covid. Il faut récolter le maximum de ressources le plus rapidement possible, les plus rares valent plus de points !
Réalisé en novembre 2022 par Lucas Gousserey, Robin Moncho, Antoine Tardivel, Alexandre Gattefosse et Thoma Lecornu en 5 jours. DMII 1ère année.
En cours de finalisation.

Workshop WebGL(5 jrs)

Good News Around the World

Le sujet : Centré autour de la technologie WebGL et des média 2D/3D, le workshop consiste à réaliser une cartographie dynamique des évènements qui ont marqués les années 2020 -2022.

Le pitch : La pandémie de COVID-19 nous a apporté son lot de mauvaises nouvelles. Nous avons donc décidé de créer Good News Around The World, un projet consistant à compiler le plus de bonnes nouvelles dans le monde depuis le début de la pandémie de COVID-19 pour ré-enchanter le quotidien.

Site web
Présentation

L’équipe :
Développeurs : Arthur Chevalier, Benoît Petit, Rama Herbin
Designers : Elie Nissen, Ludwig Pilicer, Emilie Kim

Just Reav’île

Le sujet : Centré autour de la technologie WebGL et des média 2D/3D, le workshop consiste à réaliser une cartographie dynamique des évènements qui ont marqués les années 2020 -2022.

Le pitch : Just Reav’île est une expérience web représentant tous les mois de l’année 2020 sous forme d’îles. La taille de ces dernières varie en fonction de l’intensité de l’épidémie de Covid durant le mois en question. À droite de l’écran, des cartes viennent présenter la bonne nouvelle par mois pour mettre l’épidémie en perspective avec des éléments plus positifs.

Équipe : Yacine Bigot (designer), Léa Kovarski (designer), Enzo Cailleton (développeur), Elsa Delmas (développeur)

Lien : https://reav-ile.vercel.app

Trinity Laylow concert experiment – démo

Le pitch : connecter de l’audio et du visuel en WebGL.

Pour ce projet, j’ai choisi de recréer l’un des derniers concerts ayant eu lieu avant le premier confinement en mars 2020. Ce concert avait une scénographie particulière avec plusieurs écrans disposés sur la scène.

Technologies utilisées : Nuxt 3 / Three.js / Howler.js / Theatre.js.

Gestion de projet : Linear

Design : Blender / Figma

Durée du projet : 3.5 jours.

Pierre-Alexis Maldera – (DMII 1, 2024)

Le diagnostic de peau facilité par la recherche utilisateur

Auteur : Quentin Habert

Formation : Certification UX 2022

Durée du projet : 4 mois

Introduction

La peau est probablement l’un des organes les plus importants du corps, et ceci est encore plus significatif concernant notre visage. En effet son apparence peut être la traduction d’une multitude d’indicateurs cliniques sur l’état de santé d’un individu, ses habitudes de consommation, ou encore son environnement. Elle est également largement corrélée avec la possibilité d’en déduire l’age d’une personne.

Par conséquent pour comprendre les enjeux liés aux problèmes de peau il est nécessaire d’avoir une approche scientifique.

Le fonctionnement de l’analyse de la peau

Le visage d’un utilisateur va être analysé sur un l’ensemble de critères appelés signes cliniques. Un signe clinique est un état de la peau résultant de son vieillissement, ou d’autres facteurs tels que présentés en introduction. Chaque signe clinique va être mesuré sur une échelle de 0 à 10. 0 étant son pire état et 10 le meilleur état. C’est grâce à cette mesure que nous sommes ensuite capables d’identifier les priorités sur lesquelles le consommateur devra se concentrer pour prendre soin de sa peau et/ou soigner d’éventuels soucis de peau.

Enjeux pour l’utilisateur

La complexité de la peau et ses declinaisons variées rendent l’ecosystème complexe à appréhender. De ce fait, d’un point de vue utilisateur les enjeux sont multiples. En effet d’une part il convient de comprendre quelles sont les attentes concernant le diagnostic de peau (besoin d’expertise, de conseils, de précision, etc), et d’autre part, le niveau de confiance que les utilisateurs accordent à la technologie.

Organisation de la recherche

Ce sont ces premiers enseignements ainsi que les travaux menés en amont (persona, consumer journey, analytics) que j’ai choisi d’orienter ma recherche. Compte tenu du temps imparti et des différentes methodologies théoriques apprises j’ai choisi de m’inspirer des methodes présentes dans Design Sprint car elles permettent de mettre en pratique plusieurs ateliers, regrouper des compétences complémentaires et faire tester une solution rapidement.

Conlusion

L’ensemble du processus m’a permis de mettre en pratique un grand nombre d’éléments théoriques appris en cours. C’est grâce à ce type de travail que nous sommes en mesure de mesurer toute la pertinance de ces nouveaux métiers.

Pour résumer nous avons pu confimer d’une part nos premières intuitions issues des retours utilisateurs et définir d’autre part des solutions en nous concentrant sur l’essentiel. Enfin le fait de tester via des entretiens qualitatifs permet de valider l’approche et aussi d’apporter les derniers ajustements nécessaires.

Nous avons ainsi pu voir tout au long de ce travail que la mise en place d’un score pour le peau est complexe mais nécessaire pour éduquer l’utilisateur sur un sujet si complexe et d’une grande importance en terme de santé.

Le fait de présenter un diagnostique à un instant t est une première étape dans la sensibilisation des utilisateurs aux problèmes de peau et aux soins qui doivent être mis en place.

Mais ceci n’est que la première étape d’un changement de plus grande ampleur car au dela de soigner des problèmes suite à un diagnostique il convient de s’assurer que l’utilisateur applique bien l’ensemble des conseils et produits qui lui ont été procurés. C’est tout le sujet relatif à l’adhérence et la regularité.

Ceci ouvre ainsi de nouveaux horizons de recherche sur comprendre quels peuvent être les leviers demotivations pour garantir un comportement de l’utilisateur et le sensibiliser sur ce type de comportement pour l’accomppagner dans l’obtention des meilleurs résultats.

Cette problématique est encore peu connue dans le domaine de le peau mais bien connu dans d’autres domaines tels que le sport et la santé.

Les prochains travaux pourraient donc se concentrer sur les meilleures méthodes pour créer des habitudes saines, sources d’amélioration continues pour la peau des utilisateurs ,et comment la technologie peut jouer un rôle d’accélerateur.

L’autoréparation de l’électroménager pour les particuliers

Auteur : Philippe Muller

Formation : Certification UX 2022

Durée du projet : 4 mois

Selon le rapport GIEC 2022, il ne reste que trois ans pour mettre en place des solutions pour faire face au réchauffement climatique et aux émissions de gaz à effet de serre. Une partie du problème vient de notre modèle d’économie linéaire et de notre surproduction de déchets. 

Il devient nécessaire de passer à l’économie circulaire en intégrant à la chaîne de valeur les étapes suivantes : le réemploi, la réparation, la refabrication et bien évidemment le recyclage pour éviter la production de déchets, notamment ceux issus de l’électroménager.

Lors de ma recherche, j’ai ainsi pu établir que l’autoréparation chez les particuliers est motivée par le double argument économique et écologique et que l’électroménager ressort en premier dans le choix d’objets à réparer.

La phase d’idéation a permis de générer des idées pour aboutir à un prototype d’application mobile voulue rassurante et engageante pour l’utilisateur. Il intègre une aide en réalité augmentée et donne accès aux informations détaillées de l’appareil.

Les résultats des tests montrent un bon niveau de réassurance de l’utilisateur et l’accès au bon niveau d’information. Pour aller plus loin, il convient de retravailler la partie engagement pour s’adapter à une population plus large.