Refonte du e-commerce Tisséo avec Sylius

Son objectif ? Améliorer l'expérience utilisateur en facilitant l'achat et le rechargement des titres de transport tout en automatisant certaines opérations pour soulager les équipes SAV.

Découvrez dans cette étude de cas comment nous avons répondu aux enjeux de Tisséo, tout en proposant la solution e-commerce Sylius adaptée aux besoins des voyageurs.

" Côté Emagma, sont ressortis de vrais points forts : une excellente gestion du projet (planification, suivi, engagement, écoute client, compréhension fonctionnelle), une excellente maîtrise de l’outil Sylius et de ses capacités, une couverture globale des compétences nécessaires pour un projet de boutique en ligne et une bonne capacité à adapter la charge au cours du projet. "

Olivier Guillory, Direction des Systèmes d’Information et de l’Innovation - Tisséo

Tisséo choisi Sylius pour son e-commerce

Qui est Tisséo voyageurs ?

En 2022, la régie de transports Tisséo a assuré 125,7 millions de déplacements grâce à son réseau qui comprend 2 lignes de métro, une ligne de tramway, et plusieurs lignes de bus. Une troisième ligne de métro est actuellement en construction pour faire face à la demande croissante et devrait être mise en service fin 2028. Les services de Tisséo s’adressent à tous les publics : étudiants, familles, seniors, personnes à mobilité réduite, demandeurs d'emploi, touristes de passage et globalement tous les habitants de la métropole toulousaine 🙂

Tisséo en quelques chiffres

Tisséo c’est :

• le 2ème réseau français en termes de fréquentation (hors Ile-de-France)
• 125,7 millions de déplacements (180,8 millions de voyages) en 2022
• 2724 collaborateurs
• Près de 100 titres de transport à destination de tous les publics

Voyons maintenant les motivations de Tisséo à disposer d’un nouveau e-commerce.

Les enjeux de Tisséo

Le projet de refonte a débuté à l’été 2023 avec une mise en ligne prévue pour juin 2024.

Une échéance clé qui coïncide avec la période de renouvellement des cartes de transport, le moment le plus critique pour Tisséo en termes de flux d’usagers sur sa plateforme d’achat en ligne.

Cette refonte avec des délais exigeants doit répondre à plusieurs enjeux.

" Courant 2022, Tisséo a souhaité améliorer son système de demande de cartes de transport et leur rechargement, en l'intégrant dans un vrai outil de commerce et surtout en l'associant à une nouvelle gestion de compte client. Assez rapidement, il ressort que les logiciels standards majeurs du domaine ne sont pas adaptés à la gestion complexe des produits de transport, à la fois concernant la prise en compte de la tarification solidaire en place sur la Métropole Toulousaine, mais également sur des interfaces fines avec les systèmes billettiques et back-office complexes."

Olivier Guillory, Direction des Systèmes d’Information et de l’Innovation - Tisséo

Améliorer l’expérience utilisateur

Le principal objectif de Tisséo était de moderniser sa boutique en ligne en vue de simplifier le parcours d'achat de titres de transport et de réduire les interventions manuelles du SAV.

Avec une clientèle aux besoins variés, nous avons pu intégrer un système tarifaire avancé, avec des règles spécifiques selon le profil de chaque usager (étudiants, seniors, etc.), tout en garantissant une expérience d’achat optimale.

Comment a t-on procédé pour obtenir cette expérience utilisateur optimale ?

En premier lieu, Emagma propose de façon systématique de réunir les acteurs du projet autour d’ateliers UX qui sont un préalable pour recueillir l’ensemble des besoins, des contraintes et des objectifs à atteindre.

La diversité des acteurs est un plus dans le sens où notre phase d’étude doit aboutir à un compromis réalisable et compatible avec tous les métiers concernés.

À titre d’exemple, nous avons conçu les schémas d'acquisition et de renouvellement des titres de transport, qu'il s'agisse d'abonnements ou de tickets à l'unité, et mis en place un panier adapté à chaque cas. Prenons le cas de l'ajout d'une carte d'abonnement : cette action requiert une adresse de livraison. Par contre, pour le simple renouvellement d'un abonnement Tisséo, cette adresse n'est pas nécessaire, ce qui permet de simplifier le parcours client.

Ensuite, nous avons optimisé les maquettes du site pour alléger les interfaces et d'offrir une navigation réactive.

Un pari réussi étant donné les retours positifs des usagers suite à la mise en ligne des nouvelles interfaces et des performances affichées dans Google Lighthouse.

Source : Google Lighthouse en version mobile sur la page “jeunes”

Enfin, un effort particulier a été porté sur l'accessibilité a11y, avec des interfaces claires, lisibles et bien contrastées.

L’intégration du e-commerce au système d’information

Nous avons également pris en compte la connexion de la boutique avec le système d’information de Tisséo, toujours dans l’objectif d’améliorer l’expérience des usagers d’une part, et celle du personnel de Tisséo d’autre part.

Ce système d'information correspond à l'ensemble des services informatiques qui permettent à Tisséo d’exercer sa mission.

Le principal défi technique est de créer une connexion solide et fiable entre les deux systèmes pour éviter les erreurs de synchronisation.

Nous pouvons garantir que la boutique en ligne communique bien avec le système de Tisséo pour créer les cartes d'abonnement et traiter les commandes de tickets ou abonnements.

Cette communication prend en compte les différents tarifs applicables à chacun des profils : étudiants, seniors, demandeurs d'emploi, etc.

Dans les optimisations que nous avons apportées à l’intégration de Sylius dans le système d’information de Tisséo, notons la vitesse de traitement des commandes qui permet aux usagers d’avoir plus rapidement leurs titres de transport.

Pourquoi Tisséo a choisi Sylius pour son e-commerce ?

Pourquoi Sylius est la solution la plus adaptée pour la nouvelle eboutique de Tisséo ?

• Parce que Sylius est flexible et permet d’offrir une expérience utilisateur optimale tout en adaptant la plateforme aux exigences variées ! Tisséo est connecté à un SI complexe, intégrant de nombreuses API et un système tarifaire sophistiqué avec des règles spécifiques selon le profil des usagers.
• Parce que Sylius est fiable et propose des outils pour suivre les incidents lorsqu’ils surviennent, nous avons par exemple pu centraliser les logs d’erreur dans un outils d’analyse basé sur ElasticSearch.
• Parce que Sylius est sécurisé avec sa brique sécurité qui vient de Symfony et qui a été audité contre la présence de failles de sécurité.

Sylius a permis de répondre efficacement à ces enjeux essentiels pour Tisséo.

" La solution Sylius est apparue comme une réponse possible à notre problématique fonctionnelle et technique, évitant d'avoir à tordre lourdement un logiciel standard, ou de tomber dans un développement complètement spécifique. Par ailleurs, le modèle financier, qui évite les facturations potentiellement explosives du type SaaS au pourcentage de vente, et permet ainsi de maitriser ses coûts répond à une autre de nos attentes. "

Olivier Guillory, Direction des Systèmes d’Information et de l’Innovation - Tisséo

Réussites de la refonte Sylius

L’approche UX Design pour une expérience fluide

L’un des besoins clés de la refonte du e-commerce Tisseo est la vente d’abonnements qui sont des produits dématérialisés, mais aussi de produits physiques livrables à domicile.

Le e-commerce doit s’adapter aux différents profils d’utilisateurs qui n’ont pas tous accès à la même gamme de produits, certains étant réservés à des conditions d’âge, d’emploi, de localisation etc.

Pour bien comprendre l’impact de ces spécificités sur la navigation, nous avons organisé plusieurs ateliers de conception UX et d’analyse fonctionnelle afin de modéliser le parcours d’achat des usagers, et de s’assurer qu’il soit fluide et naturel pour chacun des profils.

L’étude technique et fonctionnelle

Nous avons également travaillé avec les équipes techniques, marketing et SAV de Tisséo pour spécifier les parcours utilisateurs, anticiper les blocages potentiels et proposer un prototype Sylius fonctionnel des fonctionnalités clé.

L’idée de cette phase de prototypage est d’illustrer la faisabilité des fonctionnalités qui présentent un risque de par leur complexité et leur interconnexion avec d’autres briques techniques.

Cette phase du projet est l’occasion de collaborer avec les fournisseurs de services destinés aux usagers : au delà de disposer d’une boutique fonctionnelle, la chaine de réalisation des services aux usagers doit être complète et repose sur une intégration de Syilus au SI.

Développement agile avec Sylius

Nous avons organisé le développement du projet en suivant un cycle agile, basé sur des sprints de 3 semaines.

Chaque sprint permet de bien définir les objectifs à atteindre et comprends 3 étapes clés :

• Le développement des fonctionnalités
• La démo de restitution
• L’organisation des retours qui deviennent des tâches pour les prochains sprint

Cette approche a réellement porté ses fruits dans le cadre de cette refonte car nous avons pu ajuster la cible et la chronologie des développements tout au long du projet.

Elle permet aux équipes de Tisséo d’avoir des démonstrations régulières de son nouveau e-commerce et de le tester au fil de l’eau.

Enfin, elle est confortable pour les développeurs qui peuvent se concentrer sur un périmètre limité de l’application : focus sur les fonctionnalités !

" L’équipe de Tisséo s’est montrée très disponible pour les spécifications techniques, elle nous a accordé beaucoup de temps pour faire avancer le projet. Nous avions mis en place un système de réunions hebdomadaires pour éviter les blocages et valider un par un, les développements mis en place. La communication était agréable, fluide. Le projet s’est fait étape par étape avec un processus de validation structuré. "

Témoignage de Joris, développeur chez Emagma

Recettage, mise en service et TMA

Une attention particulière a été accordée à la phase de test et de recettage, étape essentielle avant la mise en production de la boutique en ligne.

À cette étape, les équipes de Tisséo ainsi que nos propres équipes se sont mobilisées pour valider chaque scénario et ajuster ou corriger ceux qui le nécessitent.

Après la mise en production, nous assurons un suivi post-production ainsi qu'une maintenance corrective, tout en développant de nouvelles fonctionnalités à la demande pour amélioreren continu la plateforme.

Les prochaines actions prévues par Tisséo et Emagma portent sur de nouveles fonctionnalité, notamment le module d’aide au choix, qui vise à simplifier encore davantage la sélection des moyens de transport grâce à une interface dynamique.

Focus sur l’espace utilisateur

Les services digitaux de Tisséo reposent sur plusieurs applications et sites web. L’approche traditionnelle d’utiliser le compte client de Sylius pour héberger les données personnelles n’a pas été retenue dans ce cas.

En effet, le couplage de l’espace utilisateur et du e-commerce crée des contraintes pour qu’un utilisateur accède et gère ses informations, ses réclamations et ses alertes - par exemple le renouvellement d’un abonnement - où qu’il soit.

La solution retenue repose sur un espace utilisateur parfaitement indépendant : une application Symfony connectée au SSO - Single Sign On assure un passage fluide du e-commerce à l’espace utilisateur et vice versa. En pratique, cela signifie qu'un usager peut se connecter avec les mêmes identifiants sur la boutique et sur son espace personnel.

De plus, si l'utilisateur modifie son mot de passe sur l'une des applications, le changement sera automatiquement pris en compte pour les autres.

La mise en oeuvre d’un SSO Keycloack dans ce cas est une solution de plus en plus répandue qui offre l’avantage de mieux séparer les applications. En conséquence, la maintenance des applications est facilitée.

Tisséo, un projet réussi, et une belle collaboration

Le projet a été une véritable réussite sur plusieurs aspects, parmi lesquels :

• La digitalisation du processus d’achat : L'autonomie des usagers a été améliorée, réduisant ainsi les interventions du SAV.
• Le respect des délais : La plateforme a été livrée dans les temps, malgré des ajustements réguliers au périmètre du projet.
• Une collaboration fluide : Les équipes d’Emagma et de Tisséo ont su travailler ensemble de manière efficace, favorisant une communication transparente et productive tout au long du projet.

Nous sommes fiers d’avoir contribué au succès de la refonte de la boutique en ligne de Tisséo. Ce projet, mené avec rigueur et expertise, a permis à Tisséo de répondre aux attentes de ses usagers tout en simplifiant ses opérations internes.

Nous remercions chaleureusement les équipes de Tisséo pour leur collaboration et leur confiance tout au long de cette aventure !