Disponible pour de nouvelles opportunités

De la direction artistique à la vision utilisateur

Être le point de continuité d'une refonte à plusieurs mains

Type de projet Refonte complète
Équipe DA freelance + Product Owners + équipe dev
Rôle Product Designer
Durée du projet 2 ans (2023 – 2025)
Stack technique

Nuxt.js, Vue.js, Storybook, Tailwind CSS, Node.js, TypeScript, GraphQL, Express, MongoDB, Drupal

Voir le site

Homair Vacances a engagé une refonte complète de son site, avec un double enjeu : moderniser une direction artistique vieillissante et remettre l'expérience utilisateur au centre d'un site jusque-là piloté par des logiques catalogue. Mon embauche a été initiée en cours de route, après le démarrage du projet.

Dans une entreprise où la recherche utilisateur n'était pas une pratique établie, j'ai porté la dimension produit et UX du projet, en lien avec un directeur artistique freelance déjà en place pour la direction visuelle, les Product Owners et les équipes de développement en interne pour la mise en œuvre.

J'ai traduit la direction artistique du DA freelance en un design system exploitable, conçu la quasi-intégralité des pages en autonomie, et développé un travail sur les animations pour donner au site une identité propre. Sur mon initiative, j'ai ensuite mené une série de tests utilisateurs post-lancement — 19 participants, 6 scénarios — pour faire enfin exister une vision centrée utilisateur, jusque-là absente du cadrage initial.

Résultat — Score d'utilisabilité de 77/100, validation forte de la direction et des utilisateurs testés, cohérence retrouvée entre les pages, et un design system depuis réutilisé pour d'autres productions.

Homair Vacances a engagé une refonte complète de son site web, avec un enjeu double : moderniser une direction artistique vieillissante et remettre l’expérience utilisateur au centre d’un site jusque-là piloté principalement par des logiques marketing et catalogue.

Mon embauche dans l’entreprise fait suite à cette volonté de refonte et a été initiée après le démarrage du projet.

Dans une entreprise où la recherche utilisateur n’était pas une pratique établie, j’ai porté la dimension produit et UX de ce projet, en lien direct avec un directeur artistique freelance pour la direction visuelle (déjà en place à mon arrivée), les Product Owners et les équipes de développement en interne pour la mise en œuvre.

Mon rôle à l’arrivée dans ce projet a été de traduire une vision créative externe en design system exploitable, de rester le garant de la cohérence jusqu’au dernier écran livré, et surtout d’inculquer une logique d’attente et de besoin utilisateur inexistante aux prémices du projet, ou poussée uniquement par de la donnée quantitative.


01 · Cadrer

Ancrer la refonte dans des besoins réels

Le cadrage de l’ensemble du projet s’est initialement axé autour des besoins internes à l’entreprise, des attentes et de la vision de la direction, mais très peu autour des attentes réelles des consommateurs et utilisateurs du site. Cette phase a orienté les priorités de la refonte autour d’un axe business : quelles informations devaient être visibles en priorité sur les pages produit, quels points de friction du site existant devaient être corrigés en premier. La vision utilisateur, absente à mon arrivée, ne sera finalement mise en place, sur mon initiative, qu’à la sortie du site.


02 · Traduire

Transformer une direction artistique en système

La nouvelle direction artistique a été conçue en collaboration avec un directeur artistique freelance. Mon rôle a consisté à traduire cette vision en un design system cohérent, tenant compte à la fois de la fidélité créative et des contraintes réelles : diversité et volume de contenu variable au sein des pages produit, besoins de scalabilité pour les équipes qui produiraient du contenu après le lancement, contraintes SEO multiples sur des pages déjà très fournies.

J’ai ensuite conçu la quasi-intégralité des pages du site en quasi-autonomie à partir de ce système, conçu main dans la main avec les Product Owners.

En parallèle, j’ai défini la charte de sélection des visuels d’introduction pour les pages produit, transmise aux équipes marketing et communication, ainsi que les templates d’emailing en partenariat avec les équipes CRM — deux chantiers annexes qui garantissaient la cohérence de la nouvelle identité au-delà du seul site web.

Je développe actuellement un travail spécifique sur les animations et micro-interactions pour donner au site une identité propre au-delà de la charte graphique statique — un axe qui n’était pas prévu initialement, mais que je porte à la direction et aux parties prenantes comme un marqueur fort de l’identité du nouveau site.

Ce que ça démontre : la capacité à arbitrer entre exigence créative et faisabilité produit, et à étendre un système de design au-delà de l’écran pour en faire un langage de marque cohérent.


03 · Tenir la ligne

Rester garant jusqu’au bout

Une fois les maquettes livrées, je suis resté en lien étroit avec les équipes de développement tout au long de la construction du site, en assurant une revue continue — souvent dans l’urgence — pour répondre à toutes les questions relatives à la création des composants et des pages.

Ce rôle m’a permis d’éviter les dérives d’interprétation habituelles entre design et développement, et de garantir que le site livré corresponde fidèlement à la fois à la vision créative initiale et aux besoins identifiés. J’ai initié la mise en place de tests qualité et de recherche de bugs avant la mise en production finale, via un prestataire externe, NSI France.

Ce que ça démontre : une présence produit continue jusqu’au déploiement, pas seulement jusqu’à la livraison des maquettes.


04

Inculquer une vision utilisateur

La mise en production du site m’a permis de mettre le sujet de la recherche utilisateur et du retour terrain sur le devant de la scène, et de lancer une série de tests utilisateurs sur l’utilisabilité de l’ensemble du site, sur une navigation de bout en bout.

19 utilisateurs finaux (10 en présentiel, 9 à distance) ont été sélectionnés selon plusieurs profils de vacanciers : couple sans enfants, couple avec enfants, retraités, entre amis, avec ou sans animal de compagnie. 6 scénarios de test ont permis de vérifier la bonne compréhension et l’utilisation des différents modules du site, complétés par un questionnaire SUS de fin de test pour donner une donnée quantitative à la direction.

Résultat : des taux de réussite par scénario démontrant des faiblesses au niveau des filtres, une réelle difficulté à comparer les différents campings, et des verbatims démontrant une trop grande rigidité du moteur de recherche. À l’inverse, des points de succès notables — un site jugé attractif et facile à utiliser, un moteur de recherche efficace, une expérience mobile peaufinée. Au final, un score d’utilisabilité de 77/100, dépassant le seuil de 75/100, et menant à une matrice claire des priorités d’amélioration produit : urgentes, nécessaires, optionnelles, mineures.

Ce que ça démontre : ces interviews ont révélé à l’ensemble de l’entreprise l’intérêt et la puissance de cet exercice, permettant de mettre le doigt sur des points de friction jusque-là non identifiés, mais aussi de valoriser le travail accompli par les équipes sur la totalité de la refonte. La vision utilisateur est désormais essentielle pour la direction et l’équipe produit, avec la mise en place d’outils comme Useberry pour tester des prototypes Figma ou déployer des questionnaires SUS.


Résultat

Le site a été lancé avec une identité visuelle et une expérience entièrement renouvelées : validation forte de la direction sur le fonctionnement et le rendu visuel, validation également de la part des utilisateurs testés, cohérence retrouvée entre les pages malgré la diversité des contenus, et une base de design system depuis réutilisée pour les productions ultérieures (emailing, communication produit).

Ce projet illustre ma capacité à porter une refonte de bout en bout — de la recherche à la dernière ligne de code — dans un contexte où je devais être à la fois l’exécutant, le traducteur d’une vision créative externe, le garant de sa bonne exécution, ainsi que le porteur d’une vision centrée utilisateur.