Miel de France
Contexte du projet
Projet personnel d’entraînement UI/UX autour d’un site e-commerce fictif dédié au miel. L’objectif était de travailler un univers visuel chaleureux, des messages clairs et un parcours d’ajout au panier simple, en respectant de bonnes pratiques d’accessibilité et de conversion.
Pourquoi ce thème ?
Le miel constitue un terrain pertinent pour expérimenter à la fois des visuels produits attractifs (textures, couleurs chaudes) et des arguments de réassurance (origine, récolte, naturalité).
Objectifs du projet
Clarifier la proposition de valeur dès le hero, réduire le temps jusqu’à l’action (voir produit / ajouter au panier), inspirer confiance grâce à des preuves, des engagements et des informations claires sur la livraison/les retours, et garantir une lisibilité optimale sur mobile avec des contrastes conformes.
Pur · Responsable · Traçable
L’idée était de mettre en valeur des engagements concrets : un miel 100 % pur et brut, issu d’une apiculture responsable et de récoltes respectueuses des saisons, avec traçabilité et contrôles qualité à chaque étape, sans additifs afin de préserver ses qualités naturelles et nutritives.
Les presentations des produits
L’idée était de rendre la lecture des produits immédiate et comparable. Chaque carte reprend le même schéma : un visuel net, un nom clair, un profil de saveur en 2 mots (ex. Doux & floral), puis un court texte qui précise origine, texture et usages possibles. Le prix et le CTA restent visibles sans scroller. Des repères de confiance (pureté, apiculture responsable, traçabilité) sont mis en avant pour rassurer sans alourdir. L’ensemble vise à aider à choisir en quelques secondes, sur desktop comme sur mobile.
FAQ — intention & conception
L’idée était de lever dès la page d’accueil les principales hésitations liées au miel sans alourdir la lecture. Le module adopte un accordéon pour condenser l’information : intitulés sous forme de questions directes, ordre des sujets du plus fréquent au plus rassurant (pureté, conservation, provenance…), une question ouverte par défaut, réponses courtes (2–4 lignes) et lien vers une page détaillée si besoin. L’image latérale sert d’ancrage visuel sans gêner le balayage. Côté accessibilité, chaque item est un bouton avec aria-expanded/aria-controls, navigation clavier et focus visible.
Page avis
Le but : apporter une preuve sociale rapide et chaleureuse. Un témoignage affiché à la fois, texte court, photo, nom et statut pour humaniser sans alourdir la page.
Exemples d’avis
“Saveur nette et texture onctueuse. Mon miel préféré.” — Emma D., cliente
Newsletter
Intention & conception
Objectif : encourager l’inscription sans interrompre la navigation. Une promesse claire, la fréquence annoncée, un seul champ e-mail et un bouton bien visible. Une petite mention de confiance rassure sans prendre de place.
Merci beaucoup
