Racl'Eat
- Concevoir, Exprimer, Entreprendre, Comprendre
- Création numérique
- 2ème année BUT MMI
maquette UX/UI · Figma · parcours utilisateur guidé · point de friction · point de satisfaction · zone de livraison · click & collect · identité visuelle · charte graphique · typographie · UX writing · voix de marque · call-to-action · hiérarchie visuelle · architecture de l’information · produit variable · produit additionnel · panier moyen · taux de conversion · mobile first · design d’interface · barre de progression · proposition de valeur
Dans le cadre du BUT MMI à l’IUT de Toulon, j’ai participé à la conception d’une maquette UX/UI mobile pour une enseigne fictive de restauration : Racl’Eat, l’art de la raclette chez vous. Ce projet de web design, réalisé en groupe sur Figma, consistait à concevoir un site de commande en ligne complet, centré sur un parcours utilisateur court et guidé, en format mobile first. Il mobilise des compétences en UX design, UI design et UX writing, trois piliers fondamentaux du design d’interface.
– Définition du concept et de l’identité de l’enseigne
La première étape a été de définir le concept de Racl’Eat : une enseigne conviviale, gourmande et accessible, spécialisée dans la raclette à emporter ou livrée à domicile. Nous avons construit une proposition de valeur claire, commander une raclette de qualité en moins de 5 minutes, et défini les valeurs de la marque : générosité, authenticité, convivialité. Ces choix ont directement orienté l’ensemble des décisions d’identité visuelle : palette noir et or chaud, typographie expressive et chaleureuse, visuels immersifs à l’ambiance montagnarde et feutrée.
– Cartographie du parcours utilisateur et gestion des points de friction
Au cœur de notre approche UX, nous avons soigneusement cartographié le parcours utilisateur en identifiant les points de friction et les points de satisfaction. Le principal point de friction, la zone de livraison, a été traité avec attention : un écran dédié permet à l’utilisateur de saisir son adresse dès le début du parcours, et un message bienveillant le redirige vers le click & collect s’il se trouve hors zone, sans frustration inutile. Les points de satisfaction ont été amplifiés : offre midi à -20%, mise en avant du best-seller, parcours de commande fluide et rassurant.
– Architecture de l’information et structure des gammes
Nous avons structuré l’offre en trois gammes clairement différenciées : les Box Raclette (produits variables, composables étape par étape), les Sandwichs Fondants (produits simples), et les Plats Réconfortants (produits simples). Chaque gamme dispose de sa propre page, avec une hiérarchie visuelle cohérente, visuel appétissant, nom du produit, description courte et prix. Les produits additionnels, boissons et desserts, sont intégrés dans le parcours via des écrans suggestifs (« Une petite soif ? », « Une petite faim ? ») qui permettent d’augmenter le panier moyen sans alourdir l’expérience.
– Conception des écrans et UX Writing
L’ensemble des écrans a été conçu dans Figma en suivant les principes du parcours guidé : chaque action appelle clairement la suivante, les call-to-action sont distincts et engageants (« Allez hop, à table ! », « Miam, suivant ! », « C’est parti !!! »). L’UX writing a été travaillé pour donner à l’interface une voix de marquechaleureuse, complice et légèrement décalée, en parfaite cohérence avec le positionnement convivial de Racl’Eat. La barre de progression lors de la composition de la box rassure l’utilisateur sur l’avancement de sa commande et limite l’abandon.
– Posture réflexive
Ce projet m’a profondément sensibilisée à la notion de parcours utilisateur guidé et à l’importance de chaque micro-décision de design. J’ai compris que le rôle du designer UX ne se limite pas à rendre une interface jolie : il s’agit avant tout de résoudre des problèmes d’usage, d’anticiper les blocages, de rassurer, d’inciter sans manipuler. La gestion du point de friction de la zone de livraison en est un exemple concret : un mauvais placement de cet écran pouvait ruiner l’expérience entière ; bien placé et bien formulé, il devient presque transparent.
J’ai également réfléchi à la puissance de l’UX writing comme outil de construction de la relation client. Les mots choisis pour chaque bouton, chaque message d’erreur, chaque suggestion ne sont pas anodins : ils portent la voix de la marque et influencent directement le taux de conversion. Cette dimension éditoriale du design m’a particulièrement intéressée et c’est une compétence que je souhaite continuer à développer.
Ce projet m’a permis de maîtriser les outils et méthodes du design d’interface mobile, de la conception UX à la réalisation UI en passant par l’UX writing. Il m’a confrontée aux exigences d’une commande réelle avec un brief précis, des contraintes fonctionnelles multiples et un travail en groupe. Le résultat, une maquette mobile complète, cohérente et aboutie pour Racl’Eat, témoigne de ma capacité à co-concevoir un produit numérique en équipe, à défendre des choix de parcours utilisateur argumentés et à produire une identité visuelle forte et adaptée à la cible.
COMPÉTENCES MMI
Co-concevoir une réponse stratégique
Exprimer une identité visuelle et éditoriale transmédia
Comprendre la stratégie de communication et l’expérience utilisateur
Entreprendre un projet au sein d’un écosystème numérique
APPRENTISSAGES CRITIQUES
AC22.01 – Co-concevoir un produit ou un service (proposition de valeur, fonctionnalités…)
AC22.02 – Produire une recommandation ergonomique à partir des tests utilisateurs (sur système fonctionnel, prototype ou maquette interactive)
AC23.03 – Créer et décliner une identité visuelle (charte graphique)
AC21.05 – Cartographier les expériences utilisateur : points de contact, points de friction et de satisfaction, carte d’empathie
AC25.04 – Collaborer au sein des organisations
AC25.05 – Maîtriser les codes des productions écrites et orales professionnelles