Conception application et site web Responsive Bonap
Dans le cadre de la formation UX Design de Google Career Certificates, j’ai réalisé ce projet pour lequel j’ai utilisé le logiciel Figma.
Aperçu du projet
Le produit
Basée à Bordeaux, Bonap se concentre sur l'alimentation et la santé. L'organisation recherche un outil visant à encourager des habitudes alimentaires saines. Principalement destiné aux adultes actifs, ce service vise ceux qui attachent de l'importance à la qualité de leur alimentation mais manquent de temps pour cuisiner. Ces utilisateurs souhaitent des idées de recettes rapides respectant les apports nutritionnels.
Durée du projet
Du 1er au 21 décembre 2023
Le problème
Les gens ne connaissent pas toujours les règles à respecter pour bien se nourrir. De plus, les adultes actifs manquent souvent de temps pour cuisiner des plats sains.
L'objectif
Concevoir une application qui aidera les gens à apprendre à cuisiner sainement et rapidement.
Mon rôle
UX Designer en charge de l'application et du responsive web design de la conception à la livraison.
Responsabilités
Conduite d'entretiens, maquettes fonctionnelles papier et numérique, prototypage basse et haute-fidélité, réalisation d'études d'utilisabilité, prise en compte de l'accessibilité, itération des conceptions, détermination de l'architecture des informations et conception responsive.
Comprendre l'utilisateur
Recherche utilisateur
Résumé
J’ai mené des entretiens avec des utilisateurs. J’ai ensuite réalisé des cartes d’empathie pour définir 2 personas. La plupart des participants aux entretiens ont déclaré vouloir manger sainement mais ne connaissent pas toujours les apports nutritionnels des aliments. De plus, à plusieurs reprises, ils m’ont fait part d’un manque de temps et d’idées pour cuisiner. Les personnes interrogées avaient toutes pour habitude de chercher des recettes sur Internet.
Personas
Énoncés de problème
Jean-Paul est un ingénieur informatique très occupé, qui a besoin de trouver des recettes de cuisine saines nécessitant peu de temps de préparation avec peu d’ingrédients, parce qu’il souhaite préparer des plats plus sains malgré leurs journées bien chargées à sa compagne et lui.
Emilie est une femme soucieuse de l’environnement et de la santé qui a besoin de trouver des solutions pour maintenir une alimentation saine tout en respectant la planète, parce qu’elle souhaite que sa famille puisse bénéficier de repas équilibrés, adaptés à leurs goûts, tout en contribuant à réduire leur empreinte écologique.
Audit concurrentiel
L’analyse de quelques sites concurrents a révélé les points faibles et les possibilités à exploiter pour améliorer l’efficacité de l’application Bonap.
Cliquez pour voir l’audit concurrentiel complet et le rapport d’audit.
Conceptualisation
J’ai effectué une brève session de conceptualisation avec la méthode du Crazy Eights* afin de générer des idées visant à remédier aux lacunes relevées lors de l’audit concurrentiel. Mon attention s’est particulièrement portée sur les fonctionnalités permettant la personnalisation des recettes en fonction de la santé et des préférences alimentaires de l’utilisateur.
* Technique d’idéation collaborative qui vise à proposer, chercher et dessiner autant d’idées divergentes sur des feuilles, concernant une problématique donnée.
Démarrer la conception
Maquettes fonctionnelles numériques
Suite à la conceptualisation et à la création de quelques maquettes fonctionnelles sur papier, j’ai élaboré les premières conceptions de l’application Bonap. Ces conceptions mettaient l’accent sur la nécessité de recueillir des informations sur les utilisateurs afin de leur proposer des recettes de cuisine personnalisées.
Prototype basse-fidelité
Étude d'utilisabilité
Paramètres
Type d'étude
Étude d'utilisabilité modérée
Localisation
France, à distance
Participants
5 participants
Durée
15 à 20 minutes
Conclusions
Voici les principales conclusions révélées par l’étude d’utilisabilité :
But du site
Les gens ne voient pas clairement le besoin de remplir leurs informations pour obtenir des recettes de cuisine personnalisées.
Trop de choix de recettes
Les recettes suggérés sont classées par thème mais les utilisateurs souhaitent un champ de recherche pour trouver encore plus rapidement une recette.
Informations recettes
Les gens ont besoin d’informations complémentaires sur les recettes de cuisine (apports nutritionnels, …).
Affiner la conception
Maquettes
Sur la base des informations tirées des études sur la facilité d’utilisation, j’ai appliqué des modifications de conception en présentant notamment de façon plus claire les photos des recettes par thème et par saison. Pour cela, j’ai décidé de les présenter plutôt en mosaïque qu’en liste.
Les modifications de conception supplémentaires comprenaient le remplacement du premier texte de la page d’accueil par une photo pour que l’utilisateur comprenne immédiatement et de manière visuelle le thème de cette application.
Prototype haute-fidelité
Le prototype haute-fidélité a emprunté le même parcours utilisateur que le prototype basse-fidélité, intégrant les ajustements de conception effectués suite à l’évaluation d’utilisabilité.
Considérations relatives à l’accessibilité
J'ai veillé à ce que le contraste entre le texte et le fond soit suffisant pour une lisibilité optimale.
Les goûts de l’utilisateur regroupés par thèmes facilitent le remplissage des préférences alimentaires.
J'ai ajusté la taille des images en fonction de la mise en page pour qu'elles soient visibles et adaptés au support mobile.
Conception Responsive
Architecture des informations
Après avoir achevé les conceptions de l’application, j’ai entamé la création du site Web responsive.
J’ai utilisé le plan du site Bonap comme guide pour élaborer la structure organisationnelle de chaque écran, assurant ainsi une expérience cohérente sur tous les appareils.
Conception responsive
Les conceptions pour les différentes tailles d’écran englobaient les dispositifs mobiles, les tablettes et les ordinateurs de bureau. J’ai optimisé ces conceptions afin de répondre de manière spécifique aux besoins des utilisateurs de chaque appareil et de chaque taille d’écran.
Site Web mobile
Tablette
Ordinateur de bureau
Pour aller de l'avant
Points à retenir
Incidence
Les utilisateurs ont indiqué que grâce à l’application, ils pouvaient apprendre à cuisiner sainement et ont apprécié les suggestions personnalisées.
Ce que j'ai appris
J’ai compris que, malgré l’importance du problème que je cherchais à résoudre, suivre méthodiquement chaque étape du processus de conception et m’aligner sur les besoins particuliers des utilisateurs m’a aidé à trouver des solutions à la fois exécutables et bénéfiques.
Prochaines étapes
Réaliser des entretiens avec les utilisateurs pour vérifier si l'expérience était à la hauteur de leurs attentes.
Ajouter des objectifs (ex. perte de poids) pour inciter les utilisateurs à utiliser plus régulièrement l’application et/ou le site Web reponsive.
Mesurer l'efficacité en analysant les Indicateurs Clés de Performance (ICP).
Merci d’avoir examiné mon travail sur l’application et le site web Bonap !
Si vous souhaitez en savoir plus, contactez-moi.