B2C · Mobilité
Design system
Projet d'école

Rendre comparable le coût d'un voyage, en euros et en CO₂

Un test d'itinéraire qui débouche sur le coût réel d'un voyage en train, face à la voiture et à l'avion. Projet d'école, concept non affilié à SNCF Connect ni à InterRail.

Mon rôle
Designer UX/UI · projet mené à quatre
Contexte
Projet d'école · sujet posé par SNCF Connect
Secteur
Mobilité / Transport ferroviaire
Outils
Figma, Webflow, tests d'utilisabilité
Page de résultats InterRail : l'itinéraire Zurich – Vienne – Prague – Berlin, avec ses onglets par ville et par type d'impact
InterRail · concept
Le challenge

Un pass qui coche toutes les cases, et que personne n'utilise

Contexte & problématique

SNCF Connect posait trois enjeux : doubler la part modale du train d'ici 2030, réduire l'autosolisme, diminuer l'empreinte carbone du transport, qui pèse 30 % des émissions françaises. Le produit qui y répond existe déjà : le Pass InterRail, un billet unique pour cinquante pays. Mais peu de jeunes le connaissent, et ceux qui le découvrent renoncent devant l'organisation d'un voyage d'étape en étape.

L'objectif

Faire connaître : sortir le Pass de l'angle mort, sans en faire une campagne de plus.
Faire décider : donner le coût réel d'un trajet, en euros et en CO₂, au moment où le choix se fait.
Faire partir : transformer une envie vague en itinéraire concret, exportable vers InterRail.
Recherche

Pourquoi le train perd contre l'avion

01

Le prix d'abord

Le coût du trajet passe devant le temps de parcours, la disponibilité de trajets directs et même le confort. C'est ce qui maintient l'avion en tête sur les longues distances, y compris chez ceux qui préféreraient le train.

02

L'organisation ensuite

Les jeunes voyageurs préparent leur voyage depuis leur téléphone et cherchent des solutions rapides. Beaucoup se rabattent sur des destinations familières pour réduire la charge de préparation.

03

Et le paradoxe

Ils déclarent vouloir voyager moins en avion, et reprennent l'avion au moment de partir. Deux explications ressortent : le manque d'information sur la pollution d'un vol, et le manque de compétitivité perçue du train.

« Sur le papier, les jeunes s'accordent sur la nécessité de voyager moins en avion, mais ces intentions s'envolent en partie au moment de partir en vacances. »
Tests

Trois profils, et une page à réorganiser

Méthode

Trois profils utilisateurs, en fin de projet, sous contrainte de délai : passage sur le flow complet, corrections, puis nouvelle repasse avec les mêmes personnes. Retours qualitatifs, sans mesure.

Ce que les tests ont changé

Chaque profil hiérarchisait la page de résultats à sa façon : deux voulaient l'impact environnemental en premier, le troisième les destinations. Nous avons cessé de trancher à leur place et mis les quatre entrées au même niveau, navigables par onglets. Les éléments de guidage ont aussi été agrandis.

Ce qu'il faut en retenir

Trois personnes ne valident pas un parcours. Elles suffisent en revanche à montrer qu'imposer un ordre unique à tout le monde était le mauvais choix.

Ce que disent les testeurs

« Une expérience qui change pour préparer son voyage — si on est encore dans la phase de réflexion, ça fait gagner du temps. »
« C'est très pertinent d'avoir l'impact environnemental comparé à la voiture ou l'avion. Ça permet de se poser les bonnes questions sur notre façon de voyager. »
« Je ne connaissais pas l'InterRail, et je prévoyais justement un road trip en Europe avec des amis. »
Défis & décisions

Cinq décisions de conception

Le Pass existe depuis des années et reste inconnu. Écran par écran, ce que nous avons changé pour qu'il devienne choisissable.

1

Un test, pas un moteur de recherche

Un champ de recherche suppose qu'on sache où l'on va. Notre utilisateur ne le sait pas : c'est précisément son problème. Lui demander une destination, c'est lui demander de résoudre seul ce qui le bloque.

L'entrée dans l'expérience est donc un questionnaire qui produit un itinéraire, et non un formulaire. L'utilisateur répond sur ses goûts ; le système en déduit des villes étapes, une durée et un prix de pass.

Première question du test : quatre cartes de profil de voyageur à sélectionner
Étape 1 sur 3 : on choisit un profil de voyageur, pas une destination.
Écran d'entrée du test annonçant une durée approximative de deux minutes
Entrée du test : la durée est annoncée avant la première question.
2

Annoncer le coût avant de le demander

Répondre à un questionnaire est un engagement à l'aveugle : on ignore combien de questions restent et ce qu'on obtiendra au bout. C'est la première raison d'abandon.

L'écran d'entrée annonce donc la durée approximative, deux minutes, et ce que le test produit en sortie. Trois étapes numérotées, avec une sortie possible à chaque écran.

3

Mettre le coût carbone au même niveau que l'itinéraire

L'information sur l'empreinte carbone d'un vol existe partout : articles, chartes, rapports. Elle n'est jamais là où la décision se prend.

La page de résultats donne donc le trajet chiffré en kilos de CO₂, segment par segment, face au même trajet en voiture et en avion. Et parce qu'un kilo de CO₂ ne parle à personne, la page le traduit : bouteilles d'eau, heures de visioconférence, jours de chauffage.

Onglet impact environnemental : émissions du trajet segment par segment et équivalences en bouteilles d'eau, heures de visioconférence et jours de chauffage
Impact environnemental : 45,9 kg de CO₂ pour Zurich → Berlin en train, contre 273 kg pour le seul Paris–Vienne en avion.
Onglet Mon voyage : prix du pass à 386 €, carte de l'itinéraire et liste des quatre étapes
Mon voyage : prix du pass, étapes, carte, et trois sorties — exporter, acheter, continuer sur InterRail.
4

Laisser partir l'utilisateur sans le perdre

Un parcours qui se termine par « achetez maintenant » perd tous ceux qui ne sont pas prêts. Sur un voyage à plusieurs centaines d'euros, personne ne l'est au bout de deux minutes.

L'itinéraire est donc exportable, et les boutons renvoient vers le site InterRail en conservant les paramètres du voyage. L'achat du pass reste possible depuis l'expérience, pour plus tard.

5

Deux thèmes et deux langues, dès la maquette

Un thème sombre et un changement de langue ajoutés « plus tard » ne sont jamais ajoutés : ils supposent des choix de contraste et des largeurs de texte qu'on ne rattrape pas après coup.

Chaque écran existe donc en clair et en sombre, en français et en anglais, à partir d'un kit de composants commun : boutons, champs radio, filtres, bandeaux, états de chargement.

Page de résultats en thème sombre, onglet impact environnemental
La même page en thème sombre : les contrastes et les couleurs d'accent sont définis dans le kit, pas écran par écran.
Le système d'interface

Le module devait s'insérer dans un site existant, en clair comme en sombre et en deux langues. Les composants ont donc été spécifiés avec leurs états avant d'être posés dans les écrans.

Planche des boutons InterRail : primaires et secondaires, thème clair et thème sombre, états initial, survol, actif et désactivé
Boutons primaires et secondaires, en clair et en sombre, avec leurs états survol, actif et désactivé.
Boutons radio du test InterRail : durée du voyage et budget, avec leurs états sélectionnés
Les réponses du test — durée du voyage, budget — avec l'état sélectionné lisible d'un coup d'œil.
Bibliothèque d'icônes InterRail, chaque icône en version contour et en version pleine
La bibliothèque d'icônes, chacune en version contour et en version pleine pour marquer l'état actif.
Étapes d'animation du bouton de bascule entre thème clair et thème sombre
La bascule clair / sombre, décomposée image par image pour spécifier la transition.
Mesure

Ce que nous aurions regardé

Le module n'a pas été mis en ligne : il n'y a donc aucun chiffre à annoncer. Le plan de mesure faisait partie du travail, et c'est lui qui aurait dit si les décisions ci-dessus tenaient.

Complétion
la part de visiteurs qui vont au bout des trois étapes. Si elle tombe sous la moitié, c'est le test qui est trop long — pas l'offre qui n'intéresse personne.
Clic sortant
les départs vers la page du pass et vers la réservation. C'est la seule action qui compte pour le commanditaire, et la seule que le module ne maîtrise pas.
Retour
les visites qui reviennent consulter un résultat déjà obtenu. Un voyage se décide à plusieurs et sur plusieurs jours, rarement en une seule session.
En conclusion

Ce que j'en retire

Une comparaison ne vaut que si les deux chiffres sont comparables.

Poser un prix en euros à côté d'un coût en CO₂ est facile à dessiner et difficile à justifier : il faut assumer une méthode de calcul, une source et une marge d'erreur. Le travail d'interface ne tient que si cette partie-là tient.

Un dispositif marketing reste un produit.

Le module ne vend rien lui-même : il oriente vers une offre qui vit ailleurs. Concevoir pour ça, c'est accepter que la réussite se mesure au départ de l'utilisateur, pas à son temps passé.

Le thème et la langue se décident au début, pas à la fin.

Clair / sombre et français / anglais ont été posés dès les maquettes. Deux fois plus d'écrans à produire, mais aucune reprise de contraste ni de gabarit une fois le kit figé.

Ce que je referais autrement : une enquête dont je ne peux rien tirer.

Le sondage qui a lancé le projet a circulé sans panel défini, sans date et sans question de contrôle. Les pourcentages qui en sortent ne prouvent donc rien, et c'est pour cette raison qu'ils ne figurent pas sur cette page. Ils ont servi à choisir une direction — ce qu'un sondage approximatif peut faire — et non à valider un besoin, ce que j'ai cru un moment qu'ils faisaient.