STIB

Un site web e-commerce et inclusif pour une mobilité accessible à tous

STIB-site_banner_top
LE BESOIN

Un site web repensé pour une expérience inclusive et optimisée

La STIB souhaitait créer un nouveau site web avec plusieurs objectifs clés :

  • Rendre le site accessible à tous les types de voyageurs.
  • Répondre aux attentes des clients et augmenter la satisfaction des voyageurs en quête d’une expérience utilisateur fluide, intuitive, performante et attrayante.
  • Intégrer un parcours d’achat en ligne, offrant un service supplémentaire comparé à l’ancien site.
STIB-site_besoin
STIB-site_banner_middle
LE CHALLENGE

Relever les défis d’un opérateur de transport public

Le projet présentait des défis majeurs :

  • Accessibilité : Répondre aux obligations légales en termes d’accessibilité WCAG AA
  • Temps réel et planificateur d’itinéraire : Offrir des informations actualisées sur les horaires, itinéraires et les éventuelles perturbations pour répondre aux attentes des utilisateurs en mobilité.
  • Complexité transactionnelle d’un site de transport public : Intégrer des flux e-commerce complexes liés à la diversité des cartes Mobib (Perso, Basic), des réductions, des tarifs préférentiels (BIM, RIS) et différents comportements d'achat, tels que le renouvellement de cartes de transport, les duplicatas, les recharges ou la gestion des commandes.
  • Cohérence multiplateforme : Assurer une expérience utilisateur homogène entre le site web et l'application mobile, tout en développant une approche "mobile first".
  • Multiples parties prenantes : Collaborer efficacement avec un grand nombre d’acteurs internes et externes.

La création du nouveau site web est le fruit des équipes de la STIB et de plusieurs partenaires dont Anysurfer et Smile. Elle a été guidée par trois piliers fondamentaux : l’accessibilité, l’efficacité e-commerce et la collaboration agile, qui ont façonné chaque étape du projet pour offrir une plateforme inclusive et performante.

STIB-site_col_big
STIB-site_col_min
STIB-site_realisation
NOTRE APPROCHE

L’accessibilité prise en compte dès le départ

Dès le début du projet, une approche “Accessibility by Design” a été adoptée, permettant d'intégrer l’accessibilité à chaque étape de la conception. Les prototypes d’écrans ont été conçus pour garantir une navigation claire et intuitive, en appliquant les guidelines WCAG 2.2 (contrastes adaptés, interlignes optimisées, espaces clairs, double validation, contenus clairs, etc). Dans le code, l’accessibilité a aussi été appliquée afin de rendre le contenu visuel compréhensible et accessible aux personnes avec un handicap.

Les tests utilisateurs ont joué un rôle clé, avec un large panel représentatif, incluant des personnes en situation de handicap. Ces retours ont permis d’affiner chaque détail du design pour répondre aux besoins de tous. 

La création d’un design system accessible dès le départ a également constitué un élément important de l’accessibilité du site web et a permis de garantir la cohérence et la simplicité d’utilisation à long terme. Chaque composant y est pensé pour être modulable et conforme aux standards d’accessibilité, favorisant une expérience fluide pour tous les utilisateurs.

Afin de répondre aux normes d’accessibilité WCAG , la STIB et les partenaires ont été accompagnés étroitement par Anysurfer, un organisme spécialisé dans la certification de l’accessibilité numérique. Ils ont testé rigoureusement chaque nouvelle fonctionnalité, permettant d’identifier et d’ajuster rapidement les points à améliorer, mais aussi de garantir que chaque écran, interface ou fonctionnalité était optimisé pour une accessibilité maximale. Le design system lui-même a été soumis à un audit approfondi, obtenant des excellents résultats. 

Une expérience e-commerce optimisée

Pour répondre aux besoins des voyageurs, les flux e-commerce ont été simplifiés et harmonisés avec ceux de l’application mobile.  Ce processus a nécessité une compréhension approfondie des spécificités du métier de ticketing et une collaboration étroite avec les équipes de la STIB pour garantir une parfaite adéquation entre la technique et les exigences opérationnelles.

 

Collaboration continue

Le projet s’est construit grâce à une collaboration agile entre toutes les parties prenantes sous forme de sprint de 3 semaines. Chaque fonctionnalité a été rigoureusement pensée, testée, ajustée et développée pour atteindre une qualité optimale.

STIB-site_realisation
STIB-site_resultat
LE RESULTAT

Un site véritablement inclusif

Cette collaboration a permis de construire un site offrant : 

  • Une expérience accessible à tous les voyageurs. Le site de la STIB est entièrement certifié accessible avec le label Anysurfer et conforme WCAG 2.2 AA ! Une première pour un acteur des transports publics en Belgique !
  • Une navigation intuitive et simple avec des parcours cohérents et adaptés entre les plateformes web et mobile
  • Intégration réussie des fonctionnalités e-commerce en simplifiant la complexité des flux
  • Architecture simplifiée, pérenne, plus moderne et sécurisée.

Obtenir le label Anysurfer est un accomplissement et une reconnaissance précieuse de notre engagement à concevoir un site véritablement accessible à tous les voyageurs. Ce label certifie que notre travail en matière d’accessibilité répond aux standards les plus exigeants et contribue à faire du site un outil inclusif et performant.

Jérémy Gabriel

Front-End Designer, Smile

Perspectives

Nos dernières réalisations

En voir plus
Strategie_Top_Banner

Reconstruire l’écosystème digital et les parcours proposés sur le site de Stratégies

  • Digital eXpérience
  • UX/UI et performance
CCIHautsdeFrance-TopBanner

Cataloguer et valoriser le patrimoine de données du réseau CCI Hauts-de-France

  • Data
  • Consulting