CLIENT Compass Group France
ANNÉE 2021 - 2022 (alternance)
RÔLE UX/UI Design
OBJECTIF Refonte UX/UI du site et de l'application Foodi et création du design system.
Refonte de la plateforme de restauration Foodi
Compass Group France regroupe plusieurs marques spécialisées dans l'univers de la restauration collective.
Lancé fin 2018, avec un site web et une application mobile Foodi permet aux utilisateurs de consulter leur offre de restauration, de commander et payer en tout securité...
Depuis, l'application mobile a évoluée mais pas le site, créant un décalage entre les expériences Mobile et Web.
Foodi fait peau neuve !
Pour enrichir l’expérience consommateur, le but du projet lors de sa refonte est de proposer une expérience identique à l’application en terme de fonctionnalités. (Réservation, Click&Collect….)
- Conception des parcours pour les fonctionnalités priorisées
- Réalisation du design et de l'ergonomie des interfaces digitales
- Design d’Interface mobile iOS/Android et Web.
- Mise en place du Design System
- Recettes UI.
Nouvelle Direction Artistique et UX
Retravail des parcours UX et de l’univers graphique de Foodi.
Accueil personnalisé
Choix du restaurant simplifié : Une sélection rapide du point de vente avec un filtre direct pour choisir entre "Sur place" ou "À emporter".
Navigation plus fluide : Création d'une nouvelle barre de menu avec un accès rapide au module « À Venir ». Suppression de l'ancienne page « Manger »pour aller droit au but.
Adaptation visuelle par marque : Le site s'adapte désormais aux couleurs et au logo de chaque enseigne (personnalisation des bannières et de la charte graphique).
Ancien
Nouveau
Customisation par marque
Une expérience homogène
Foodi offre une expérience plus fluide et plus innovante à tous les clients de ses locaux.
Ils peuvent accéder à tous les services disponibles autour d'eux, gérer leur compte et leur solde, commander, acheter et réserver depuis n'importe quel restaurant ou café.
Création de compte
Barre de navigation : Module à venir
Page restaurant
Ce que ça change concrètement
La version web de Foodi a été intégralement repensée. Le site proposera les mêmes fonctionnalités que l’application et bénéficie d’un nouveau design et d’une navigation adaptée à la consultation depuis un ordinateur.
Couleurs vives, design sobre et clair, interface intuitive et interactive, le nouveau site foodi.fr a été conçu dans le but d’améliorer l’expérience convive et de répondre au mieux aux attentes des utilisateurs.
Création du Design system sur Invision
En parallèle de la refonte, nous avons mis en place un Design System sur Invision pour unifier l'expérience entre le site web et l'application.
Le design system est devenu indispensable pour collaborer plus facilement et mettre en place la nouvelle charte graphique du site Web et de l’application.
Au départ, il y avait une bibliothèque pour le web et une pour l’application, ce qui perturbé la continuité de l’expérience. Les utilisateurs avaient du mal à apprendre plusieurs modèles d'interface pour effectuer la même tâche.
Ce qui a été construit
En collaboration avec la lead designer, nous avons audité les composants existants puis créé une bibliothèque unique sur Sketch couvrant toutes les plateformes (desktop, mobile, app), organisée par catégorie : couleurs, typographie, icônes, boutons, navigation, formulaires, cartes et blocs d'interface.
La nomenclature a été établie en anglais pour faciliter la collaboration avec les équipes de développement à l'étranger.
Une fois synchronisée vers Invision, la bibliothèque était accessible à l'ensemble de l'équipe produit, les développeurs pouvaient inspecter et télécharger les composants directement.
Des templates d'écrans ont également été créés pour illustrer l'assemblage des composants selon les cas d'usage, accélérant le développement.
S'approprier les nouveaux process
Pour collaborer plus facilement et être sur la même longueur d’onde, il est important d'encourager les équipes digitales à utiliser le système de conception.
J'ai pu animé quelques ateliers pour familiariser les développeurs et les product owners à l'utilisation du système de conception. Une mission autant pédagogique que technique.
Nouveau visuel Foodi sur le store
Pour une meilleure expérience digitale, nous avons mise à jour les visuels du store afin de mettre en avant des repas plus représentatif du quotidien de la restauration collective.
Constat
Le visuel était peu représentatif de la cantine classique, l’utilisateur peut être déçu par la suite.
Amélioration
Mise en avant d’un repas du quotidien d’une cantine/cafétéria avec le classique formule entrée/plat/dessert/boisson.
Et mise à jour des nouvelles fonctionnalités : actualités , moyen de paiement, menu de la semaine...
