Yesstyle

(A propos)

Projet :

UX/UI

Type :

Projet personnel

Création :

Refonte du site

Année :

2024

YesStyle est une plateforme e-commerce spécialisée dans la mode asiatique, proposant une large sélection de vêtements, accessoires et produits lifestyle. Le site s’adresse principalement à une cible jeune, entre 18 et 25 ans, à la recherche de tendances actuelles et d’inspirations issues de la culture asiatique. Ce projet consistait à réaliser un audit UX/UI du site existant afin d’identifier les points de friction dans le parcours utilisateur et les axes d’amélioration. À partir de cette analyse, j’ai proposé une refonte visuelle visant à moderniser l’interface et à mieux répondre aux attentes de la cible. Le nouveau design conserve les codes graphiques de la marque, tout en apportant plus de clarté, de dynamisme et de cohérence dans l’expérience utilisateur.

Point de départ

YesStyle est une plateforme e-commerce spécialisée dans la mode asiatique, principalement destinée à une cible jeune (18–25 ans). L’analyse du site actuel met en évidence plusieurs points de friction impactant l’expérience utilisateur :

• Une interface visuelle datée, peu adaptée à la cible.
• Un manque de cohérence globale, avec une accumulation de styles graphiques, typographiques et coloriels.
• Des éléments secondaires trop présents et mal hiérarchisés, qui nuisent à la lisibilité.
• Une palette de couleurs peu attractive et insuffisamment alignée avec l’identité de marque.

• Une architecture de navigation confuse, notamment un menu surchargé avec des catégories redondantes ou peu pertinentes.
• Une page d’accueil centrée sur des promotions, au détriment d’une vision claire de l’offre globale.

Nouveau design

La refonte propose une interface plus moderne, cohérente et centrée sur l’utilisateur, alliant simplicité, lisibilité et efficacité.

• La page d’accueil met en avant les grandes catégories de produits, accompagnées de leurs sous-catégories principales, offrant une vision claire et immédiate de l’offre.

L’architecture de l’information est repensée avec des catégories mieux structurées, plus lisibles et hiérarchisées.
L’utilisation des couleurs, inspirées du logotype (verts et noir), est rationalisée afin de renforcer la cohérence visuelle et guider l’attention.

#5BB93C

R:91   V:185   B:61

#D2F9A4

R:210   V:249   B:164

#F4F8EA

R:244   V:248   B:234

#111111

R : 17 V : 17 B : 17

Aa

Aa

Nunito

Nunito

REGULAR:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

REGULAR:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

REGULAR:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

EXTRA BOLD:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

EXTRA BOLD:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

EXTRA BOLD:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

Aa

Aa

Fraunces

Fraunces

REGULAR:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

REGULAR:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

REGULAR:
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rs Ss Tt Uu Vv Ww Xx Yy Zz

• Les choix typographiques et graphiques ont été harmonisés pour proposer une identité visuelle plus contemporaine et alignée avec l’image de marque.
• Un travail sur les espacements et la mise en page permet d’aérer les contenus et d’améliorer la lecture.

Wireframes

Wireframes