Contexte
VNF gère 8 500 km de voies navigables en France, l'un des plus grands réseaux d'Europe. Avisbat est le service d'alertes navigables : un système qui informe les navigants professionnels et de plaisance des incidents pouvant affecter leur trajet. Les navigants pouvaient rechercher des alertes et s'abonner à des notifications. Mais le service était organisé selon la logique de publication de VNF, pas selon les besoins des usagers. Les résultats étaient des PDF à télécharger, avec différentes localisations et différents incidents.
Problématique
Challenger la perspective
Le brief est arrivé avec des retours utilisateurs déjà collectés : les navigants voulaient gérer leurs abonnements plus facilement et localiser les incidents sur une carte. La demande était claire : moderniser le service, introduire une expérience cartographique, mettre à jour avec le nouveau design system.
Mais le vrai problème était caché …
Le service existant était organisé autour de la logique de publication interne de VNF. Chaque publication peut contenir plusieurs incidents, répartis sur différentes localisations et périodes. Or un navigant ne vient pas consulter des publications — il arrive avec une question précise : il y a-t-il des incidents sur mon trajet, pendant mon voyage ?
Le système ne répondait pas à cette question. L'utilisateur devait télécharger de nombreux documents et chercher la bonne information. Ce qui pouvait générer de la frustration et faire rater des informations importantes.
Avant la refonte
Défis clés
Afficher les bonnes informations sur la carte
Un avis peut contenir plusieurs incidents, sur plusieurs localisations et périodes. Un navigant qui consulte son trajet a besoin de voir des incidents, pas des publications. Convaincre l'équipe de faire cette distinction dans l'interface a nécessité un effort soutenu sur de nombreuses itérations.
Multi-sélection complexe sur mobile
Le système ne permettait qu'un seul abonnement par utilisateur. Cela signifiait que l'ensemble de la sélection des voies d'eau (7 bassins, jusqu'à 30 voies chacun) devait se faire en un seul parcours, sur mobile, sans surcharger l'utilisateur. Et comme la plupart des navigants ne connaissent pas les noms des voies par cœur, la carte devait rester accessible tout au long du processus de sélection.
Process
N'est jamais linéaire et doit s'adapter au contexte
Le projet s'est déroulé sur deux ans. Le brief a évolué, des contraintes techniques sont apparues tardivement, et les délais ont glissé.
La plupart des sessions étaient des réunions de travail plutôt que des ateliers formels : présentation d'hypothèses, revue de wireframes, résolution de questions ouvertes en temps réel. Mon objectif était toujours de remonter les désalignements le plus tôt possible.
Les tests utilisateurs ont confirmé certains détails d'interaction. Ils ont également mis en lumière un besoin réel concernant les avis publiés avant la création d'un abonnement.
Le projet s'est conclu avec une documentation de design complète (hand-off) et une recette menée aux côtés de l'équipe de développement à chaque sprint.
Décision de design 01
Recherche : trouver des incidents, pas des avis
Le changement fondamental a été de faire remonter les incidents sur la carte plutôt que les avis. Un navigant sélectionne une voie d'eau, une période et un type d'incident. Il voit exactement ce qui affecte son trajet, localisé spatialement. En cliquant sur un incident, il accède à sa localisation précise sur la carte, au tronçon concerné et à un lien de téléchargement de l'avis correspondant. La carte devient la couche de navigation principale, pas une décoration secondaire.
Décision de design 02
Abonnement Desktop : rendre la multi-sélection complexe intuitive
Le parcours d'abonnement a été repensé autour de la sélection spatiale. Les utilisateurs choisissent des bassins sur une carte illustrée de France, puis affinent leur sélection par voies d'eau via une interface de recherche et de multi-sélection.
Le volet gauche affiche les voies d'eau du bassin sélectionné, mais un navigant a souvent besoin de s'abonner sur plusieurs bassins.
Le volet "Ma sélection" à droite résout deux problèmes à la fois : il récapitule toutes les voies sélectionnées entre les bassins, et joue le rôle de filtre, n'affichant que ce qui a été choisi, pour couper à travers des listes pouvant atteindre 30 voies par bassin.
Sur mobile, la même logique fonctionne via un volet tiroir avec la carte visible au-dessus.
Décision de design 03
Abonnement mobile : multi-sélection sur petit écran
Sur mobile, la carte passe au second plan pendant la sélection. Afficher simultanément une carte interactive et une liste scrollable sur un petit écran rendrait les deux inutilisables. La première étape est uniquement en liste : les voies d'eau sont affichées avec suffisamment d'espace pour être lisibles et cliquables. Une fois les sélections faites, un volet tiroir remonte en affichant le récapitulatif des voies sélectionnées organisées par bassin, avec une liste horizontale scrollable. En abaissant le volet, la carte réapparaît. Choisir une voie dans la liste horizontale la met en surbrillance sur la carte, permettant au navigant de confirmer visuellement ses choix avant de valider.
J'ai conçu pour une largeur d'écran de 320px, le plus petit viewport courant, pour m'assurer que l'interface fonctionne sur tous les appareils. Un choix délibéré, aligné avec l'approche écoconception du projet.
Décision de design 04
Combler le manque : les avis publiés avant votre abonnement
Les tests utilisateurs ont révélé un besoin réel : les navigants voulaient accéder aux avis déjà actifs au moment de la création de leur abonnement pour ne rater aucune information importante. Nous avons ajouté dans l'email de confirmation un bouton "Consulter les avis déjà parus" qui ouvre une vue cartographique pré-filtrée affichant uniquement les avis actifs pertinents. Le navigant télécharge ce dont il a besoin, rien de plus.
Écran de confirmation
Résultats
Statut
En ligne depuis mai 2026. Le service est livré sprint par sprint, et j’accompagne l’équipe de développement pendant la recette.
Ce qui change pour l’usager
Avant, il fallait télécharger les avis publiés et chercher soi-même ceux qui concernaient sa voie. Maintenant, on voit directement sur la carte les incidents de son trajet. Avant, plusieurs avis à ouvrir et à lire, maintenant aucun téléchargement nécessaire pour savoir si son trajet est concerné
Comment mesurer l'impact ?
La mesure de l'impact est malheureusement décidé par le client, mais voici les critères que je me mesurerais si cette partie faisait partie du scope :
- La part des utilisateurs qui suppriment leur abonnement, avant et après la refonte
- La part des utilisateurs qui choisissent la pause plutôt que la suppression
- Le nombre de mails reçus par abonné et par mois
Rétrospective
Une implication plus précoce dans la phase de cadrage
Le brief est arrivé avec des décisions déjà prises. Être dans la pièce lors du cadrage initial aurait changé la qualité des questions que nous traitions — et probablement réduit des mois de désalignement avec l'équipe métier.
Un processus d'alignement des parties prenantes plus structuré
Trop de personnes sont entrées et sorties de la boucle de feedback à différentes étapes — donnant leur avis, disparaissant, puis réapparaissant avec de nouvelles orientations. Un processus de validation plus structuré dès le départ, avec des décideurs identifiés et des étapes de validation formalisées, aurait considérablement réduit les allers-retours et préservé le fil directeur du design sur deux ans.
