Accueil
/
Projets
/
Wedressfair

UX/UI designE-commerceMode éthiqueMaquettes desktop et mobile

Refonte Wedressfair, pour une mode plus juste

Refonte du site d’une boutique de mode éthique : un parcours d’achat complet, du choix d’un vêtement au paiement, où chaque engagement de la marque devient visible et utile pour choisir.

Client: Wedressfair
Rôle: UX/UI designer
Contexte: Projet de Master
Livrables: Parcours d’achat, maquettes desktop et mobile

01

Le projet

Dans le cadre de mon Master Expert Transformation Digitale, j’ai mené la refonte du site de Wedressfair, une boutique qui réunit des marques de mode éthique.

Objectif : retravailler l’ergonomie et l’expérience utilisateur pour lever les points de friction pendant la navigation et le processus d’achat, sans diluer l’identité engagée de la marque.

02

Trois valeurs à rendre visibles

TRANSPARENCE

Tout savoir sur le produit

Matière et lieu de fabrication réunis dans la rubrique « Transparence » de chaque fiche.

ÉQUITÉ

Des conditions justes

Mettre en avant les marques qui rémunèrent correctement leurs équipes.

ÉCO-RESPONSABILITÉ

Moins d’impact

Matières biologiques, recyclées ou upcyclées, repérables d’un coup d’œil grâce aux étiquettes.

03

Le parcours d’achat

Six écrans, de l’inspiration au paiement. Faites défiler chaque écran pour voir la page entière.

Maquette Wedressfair, page d’accueil (version ordinateur) — Écran 1AccueilLe message de la marque en premier, puis les trois engagements, les deux entrées Femme et Homme et une sélection de looks.

Maquette Wedressfair, catalogue Femme avec filtres (version ordinateur) — Écran 2Catalogue avec filtresDes filtres par type, matière et fabrication ; chaque carte affiche ses engagements en étiquettes.

Maquette Wedressfair, fiche produit du pantalon Sixtine (version ordinateur) — Écran 3Fiche produitLe choix de la taille est guidé, et la rubrique « Transparence » détaille la matière et le lieu de fabrication.

Maquette Wedressfair, panier (version ordinateur) — Écran 4PanierQuantités modifiables, récapitulatif toujours visible et commande possible sans créer de compte.

Maquette Wedressfair, page livraison et paiement (version ordinateur) — Écran 5Livraison et paiement sur une seule pageCoordonnées, livraison et paiement en trois blocs numérotés : moins d’étapes, moins d’abandons.

Maquette Wedressfair, page Notre mission (version ordinateur) — Écran 6Notre missionLe texte de la marque, illustré par la boutique, pour donner envie de s’engager.

Les visuels de mailles et de pièces homme illustrent la maquette : leurs noms et prix sont fictifs.

04

Version mobile

Maquette Wedressfair, page d’accueil (version mobile) — Accueil

Maquette Wedressfair, fiche produit du pantalon Sixtine (version mobile) — Fiche produit

Maquette Wedressfair, page livraison et paiement (version mobile) — Paiement

05

Une charte affinée

Le vert et le logo de la marque sont conservés ; la palette s’enrichit pour l’interface.

#2F4A2EVert forêt, actions

#4F6E4CVert de la marque

#F7F3ECCrème, fonds

#A8402ABrique, marques et Made in France

#1E241DTexte

AaPoppinsTitres et boutons

AaDM SansTextes et formulaires

WEZilla SlabLogo uniquement

06

Ma démarche

De l’identité à l’interface

Analyse du parcours d’achat : repérer les points de friction
Logo et moodboard conservés : un univers naturel, chaleureux et engagé
Charte affinée : palette d’interface, typographies et composants
Maquettes desktop et mobile des six écrans clés

07

La page d’accueil complète

La maquette desktop de la page d’accueil, du bandeau au pied de page.

Maquette complète de la page d’accueil Wedressfair : bandeau, trois valeurs, entrées Femme et Homme, looks du moment, bandeau mission et pied de page