La marque
Fondée en janvier 2021, FRINGUANT révolutionne l’expérience client des consommateurs de mode en ligne.
Leur ambition est de transformer l’industrie de la mode à l’aide d’une technologie innovante de scan corporel intuitive et sécurisée, située directement sur la page produit des marques, le consommateur trouve la taille parfaite pour chaque marque et chaque vêtement.
Cette solution permet aux marques de vêtements de réduire un surcoût logistique lié aux nombreux retours de colis, d’augmenter leur conversion et de diminuer leur empreinte carbone !
Le brief
L’outil et le site web existent déjà. En groupe nous devons proposer une version Desktop du parcours utilisateur qui n’existe pour l’instant que sur mobile.
Il nous est également demandé de travailler sur l’écran de scan de l’utilisateur (design / wording) en prenant en considération les contraintes techniques.
Le contexte
Avec E-artsup Paris nous avons l'occasion de travailler avec des jeunes startups en incubation à Station F.
Fringuant est une d'entre elles. Ce projet a été réalisé en groupe, j'étais avec Hugo Pradel et Eneko Londaitz, deux étudiants designer de ma promo.
Cette collaboration avec Fringuant c'est déroulé en 2 étapes. En premier lieu, la première semaine nous avons proposé une analyse de l'expérience utilisateur de l'existant. C'est ce que vous retrouverez sur cette page. En second lieu, pour une autre semaine nous avons donc proposé une refonte UI de leurs interfaces, vous pouvez retrouver ce projet UI sur cette page
Suite à notre audit UX nous avons relevé pour chaque page les points forts et les points faibles de celle-ci en fonction des 4 points listés ci-dessous.
Lisibilité
Les - Hiérarchisation de la taille des textes et de leur graisse n’aide pas la lecture
Navigation
Les + Dropdown pour présenter les utilités de votre tech
Les - Manque page équipe, notre solution, nous contacter, ect.
Ergonomie
Les + Blocs d’informations sont bien organisés
Les - Pas d’explication de la tech.
Quels produits prennez-vous en compte ?
Actions
Les + Bouton du Dashboard
Les - Bouton «rejoindre notre beta» pas différentiable des inputs
Une journée type sert à illustrer les diverses étapes et interactions que les utilisateurs peuvent avoir avec le produit. Ce modèle aide à comprendre les comportements, les besoins, et les points de friction des utilisateurs.
Ici la journée type est centrée sur l'achat de vêtements en ligne. En premier lieu l'utilisateur trouve un vêtement sur un site de vente en ligne, ensuite il demande à l'intelligence artificielle de Fringuant de l'aide, puis fini par enregistrer le produit dans le panier.
L'impact mapping est une méthode qui permet de clarifier les objectifs, identifier les parties prenantes, les moyens d'atteindre les objectifs, et les mesures de succès. Cette méthode permet de concentrer les efforts sur les actions qui ont le plus grand impact potentiel.
Ici l'objectif est de trouver des vêtements qui correspondent parfaitement à la morphologie des utilisateurs et à leurs préférences de coupe pour éviter les retours aux marques.
Voici comment l'impact mapping aide à structurer cette démarche :
Objectif : Le but principal est de réduire les retours de vêtements en assurant une meilleure adéquation entre les produits et les attentes des clients en termes de taille et de coupe.
Comment ? : Les moyens pour atteindre cet objectif incluent l'utilisation de l'intelligence artificielle pour scanner le corps des utilisateurs, enregistrer leur morphologie, et proposer des vêtements adaptés. Cela peut aussi impliquer de modifier les coupes des vêtements en fonction des données collectées sur les morphologies des clients.
Pour qui ? : Les acteurs principaux identifiés sont les acheteurs en ligne et les marques de vêtements en ligne. Ces deux groupes bénéficieront d'une meilleure expérience d'achat et d'une réduction des coûts liés aux retours.
Fonctionnalité : Les fonctionnalités spécifiques pourraient inclure des applications qui utilisent les données de morphologie pour recommander des vêtements, la possibilité d'essayer virtuellement différentes coupes, et des analyses de données pour ajuster les offres de produits.
Une Experience Map est un outil visuel utilisé pour tracer le parcours complet d'un utilisateur à travers une expérience spécifique, en incluant les différentes étapes, actions, pensées et émotions vécues. Elle permet de comprendre et d'analyser l'expérience vécue par l'utilisateur, et d'identifier les points de friction.
Ici nous pouvons remarquer que les principaux points de frictions sont lors que la demande d'accepter les politiques de confidentialité, lorsque l'on doit comprendre comment marche l'outil Fringuant et lorsque l'on l'utilise. De plus la question du stockage de nos données personnelles est très importante pour cet outil, nous le retrouvons dans les points de friction lors de la capture du coprs.
Une Empathy Map est un outil qui permet de visualiser les attitudes et comportements d'un utilisateur à l'égard d'un produit ou service. Elle aide à se mettre à la place de l'utilisateur en détaillant ce qu'il dit, pense, fait, et ressent. Cela permet de mieux comprendre les besoins, désirs et problèmes des utilisateurs, et de concevoir des solutions plus empathiques et efficaces.
En premier lieu pour la proposition de nouvelle identité visuelle nous proposons de nouvelles typographies.
Pour les titres nous choisissons une Montserrat en Semi-Bold. Cette typographie a été conçue avec une grande attention portée à la lisibilité, en particulier sur les écrans numériques. Ses formes claires et simples rendent le texte facile à lire, même à de petites tailles. Montserrat est appréciée pour son apparence contemporaine et élégante. Elle présente des formes géométriques équilibrées et des lignes épurées, ce qui lui confère un aspect moderne et professionnel.
Pour le logo nous avons sélectionné et modifié la Galins. Par ses formes cette typographie peut facilement être associée à une marque dans le secteur du textile. De plus elle propose une apparence élégante et côté luxe, ce qui est cohérent avec les cibles principales de Fringuant.
Pour le choix des couleurs nous proposons un blanc légèrement grisé pour les fonds et les éléments blancs. Nous proposons par la suite un noir légèrement grisé principalement pour tous les textes hors textes en exergues et quelques fonds. Nous avons également un blanc cassé que l’on conseille d’utiliser en fond pour marquer les différence de sections.
Enfin nous avons sélectionné un bleu pastel. Le but de celui-ci est de rappeler les couleurs d’un outil tech, ce qui est complètement le cas de Fringuant. Celui-ci est légèrement pastel car nous ne souhaitions pas donner à cette identité visuelle un caractère trop présent, Fringuant est une marque blanche et son interface et direction artistique doit pouvoir s’adapter à celles de leurs clients.
La grande problématique de le refonte de cette interface était de la rendre claire et rassurante pour l’utilisateur, vis à vis du type des données qui lui sont demandées.
Pour finir nous avons proposé un Dashboard utilisateur et marque. Ceci à pour but de fidéliser les utilisateurs à cette plateforme.
La plateforme utilisateur client propose de garder en mémoire dans une bibliothèque nos tailles pour toutes les marques et tous les types de produits qui sont proposés par ces marques. Dans ce dashboard client nous proposons également à Fringuant de mettre en avant des marques et des produits qui peuvent intéresser l’utilisateur notamment pour trouver des vêtements ressemblant ou se rapprochant de ses habitudes de consommation.
Dans le dashboard marques nous pouvons retrouver la proportion d’achat de différentes tailles de tous les utilisateurs, et les manières de porter chaque vêtement par leurs utilisateurs. En effet nous pouvons par exemple avoir l’information que pour tel produit les utilisateurs, à un certain pourcentage préfèrent le porter plus ample, ou au contraire plus prés de corps. Ces données peuvent êtres intéressantes pour la conception de nouvelles collections.
