Branding, Design, UI

Charlottine

Project details

Client

Charlottine

Designer

Quentin Duprat

Category

Branding, Design, UI

Sur ce projet, mon objectif principal n’était pas seulement de “faire un beau site”, mais d’améliorer concrètement l’expérience des utilisateurs : clarifier l’offre, fluidifier la navigation et renforcer la perception de la marque La Charlottine.

Compréhension des besoins & cadrage UX

Avant d’ouvrir Figma, j’ai commencé par :

  • Analyser les utilisateurs cibles (attentes, freins, niveaux de familiarité avec le digital) à partir des échanges avec la cliente, des données existantes et des retours terrain.

  • Étudier le contexte concurrentiel pour identifier les bonnes pratiques manquantes sur le marché (clarté des informations, rassurance, hiérarchisation des contenus).

Cette phase m’a permis de formuler des problématiques UX claires : comment rendre l’offre plus lisible, comment guider l’utilisateur plus rapidement vers les informations qui l’intéressent, comment générer plus de confiance.

Architecture de l’information & parcours

À partir de ces constats, j’ai :

  • Reorganisé l’architecture des pages pour réduire la charge cognitive : moins de friction, plus de repères visuels.

  • Travaillé les parcours clés (découverte de la marque, consultation des prestations, prise de contact) pour qu’ils soient plus linéaires et cohérents.

  • Hiérarchisé les contenus (titres, sections, blocs de preuve) afin de rendre la navigation plus intuitive et la proposition de valeur plus immédiatement compréhensible.

Conception UI au service de l’UX

Le design n’a pas été traité comme une simple couche esthétique :

  • J’ai conçu une interface épurée et cohérente avec l’identité de La Charlottine, en utilisant le design pour guider le regard et renforcer la lisibilité.

  • Les choix typographiques, la palette de couleurs et les visuels ont été pensés pour soutenir les parcours (mises en avant, zones de focus, éléments de rassurance).

Implémentation et ajustements front

Pour garantir la fidélité entre ma vision UX/UI et le rendu final :

  • J’ai modifié directement le code HTML/CSS et ajusté le thème natif, afin d’aligner le front sur les maquettes (espacements, styles, interactions).

  • Cette intervention m’a permis d’assurer la cohérence des détails d’interface (états hover, lisibilité, alignements) et donc la qualité globale de l’expérience.

Tests utilisateurs & itérations

Une fois l’interface en place, j’ai :

  • Recueilli des retours utilisateurs (tests informels, retours clients) pour identifier les zones de friction ou d’incompréhension.

  • Itéré sur les écrans : simplification de certains blocs, amélioration de la lisibilité, ajustement des call-to-action, pour aboutir à une expérience plus fluide et rassurante.

Veille UX/UI & amélioration continue

Enfin, je suis resté en veille sur les tendances UX/UI et les bonnes pratiques d’accessibilité, ce qui m’a permis de :

  • Proposer des interfaces actuelles mais pérennes, sans effets gratuits.

  • Maintenir un équilibre entre identité de marque, efficacité des parcours et confort d’utilisation.

01
02
Share on
Next

Wallscript