Your SlideShare is downloading. ×
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

L’expérience utilisateur, 
plus importante que jamais: le cas STM.info

826

Published on

Alors que tablettes et téléphones intelligents s’imposent comme les nouveaux écrans de référence pour beaucoup de consommateurs, comment penser l’interface et l’expérience utilisateur? Comment …

Alors que tablettes et téléphones intelligents s’imposent comme les nouveaux écrans de référence pour beaucoup de consommateurs, comment penser l’interface et l’expérience utilisateur? Comment s’assurer que les efforts déployés seront durables, et que les résultats seront au rendez-vous?

Lors de cette présentation, Jan-Nicolas Vanderveken de TP1 et Nicole Gruslin de la STM détailleront l’exercice stratégique derrière le projet stm.info, partageront leurs analyses sur l’impératif mobile, en plus de démontrer les leçons retenues de ce redesign d’envergure.

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
826
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
20
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. L’expérience utilisateur, 
 plus importante que jamais: le cas STM.info Boomerang la conférence, 1er mai 2014
  • 2. Bonjour ! Jan-Nicolas Vanderveken
 Associé fondateur, TP1
 @nvanderv, @TP1 Nicole Gruslin
 Conseillère corporative web, STM
 @ngruslin #BoomConfSTM 2
  • 3. Aujourd’hui Contexte App ou site? La carte Mobilité Tests Résultats Questions ? 3
  • 4. Contexte 4
  • 5. Des utilisateurs satisfaits Site développé en 1996 - 1997 En ligne depuis 1997 90 % de satisfaction STM.info doit avant tout faciliter les déplacements des usagers et être disponible en tout temps, même dans les périodes de pointe et de crise. 5
  • 6. Dans ce contexte, pourquoi créer un nouveau site? 6
  • 7. App ou site? 7
  • 8. IMAGE EN-TÊTE - Facultative. Utiliser le gabarit prévu (voir détails plus bas). ANCRES - Possibilité d’ajouter une ancre pour chaque TITRE H2 présent dans la page. TITRE H2 - Préconiser les titres courts. titre et une ancre en haut de page. SOUS-TITRE H3 PARAGRAPHE Possibilité de mettre des mots en gras ou en italique. Les différents liens sont listés plus bas. Possibilité de centrer le texte. BOUTON Privilégier des boutons avec des textes courts. Ajouter un sous-titre au bouton pour indiquer une information secondaire. les différents styles graphiques 690 x 200 px
  • 9. Ce qu’on a appris Le choix entre une approche applicative ou plus traditionnelle se fait en fonction de la nature du contenu. Le transfert de l’environnement applicatif à l’environnement informatif doit être fluide pour le client. Il faut développer des outils de gestion efficaces pour maintenir l’intégrité du site après le lancement. Nous avons, tout au long du projet, considéré STM.info comme un service, et non comme un site web. 17
  • 10. La carte 18
  • 11. Google Map vs OpenStreetMap 19
  • 12. Ce qu’on a appris Les solutions open source présentent un haut niveau de flexibilité et de personnalisation et un coût moindre. Faire appel à des experts (Mapgears, dans ce cas). OpenStreetMap nous a permis de créer une carte designée à l’image de la STM et respectant les codes graphiques auxquels sont habitués les usagers. 21
  • 13. Mobilité 22
  • 14. Les grands objectifs Optimiser les activités de déplacement pour les téléphones intelligents (itinéraires, horaires, tarifs et état du service métro et autobus). Obtenir un design de marque cohérent, pour les trois environnements ciblés par la STM : ordinateurs, tablettes 
 et téléphones intelligents. Rendre la carte disponible sur les téléphones intelligents. Créer une solution évolutive tenant compte des grandes tendances du marché et pouvant s’adapter. 23
  • 15. La solution Optimisation mobile, en mode adaptatif, pour les sections informationnelles du site. Développer une application mobile web optimisée pour le plus d’appareils mobiles intelligents possible. Mettre à profit les API et le CMS développés à ce jour. Offrir à la clientèle une expérience optimisée et unifiée pour les téléphones intelligents sur l’ensemble du site. 24
  • 16. ACCUEIL ET THÈMES DE DÉPLACEMENT (ADAPTATIF) ordinateur + tablette PAGES DE CONTENU (ADAPTATIF) ordinateur + tablette + téléphone intelligent ACCUEIL ET THÈMES DE DÉPLACEMENT téléphone intelligent
  • 17. Ce qu’on a appris Il faut faire des compromis : tout n’est pas noir ou blanc / adaptatif ou optimisé mobile. Une solution hybride peut s’avérer un choix judicieux. Une app web mobile doit être ultra-légère : la performance est primordiale dans un contexte de mobilité et les impacts ne touchent pas que le UX, le code est aussi impacté. Chaque fois que c’est possible, effectuer les opérations au niveau du serveur, et non du client. Prendre les décisions importantes comportant un haut niveau d’incertitude le plus tard possible dans le projet. 40
  • 18. Tests 41
  • 19. 42 Tests utilisateurssur maquettes fonctionnelles YuCentrik Betapanel clients(8000) TP1 Beta public TP1 Tests utilisateurssur versionalpha YuCentrik Tests d’accessibilité AccessibilitéW eb Yu C entrik Focus group 
 surle design C allosum B eta panel em ployés (2000) STM Tride cartes TP1 /Adviso
  • 20. Tests utilisateurs surm aquettes fonctionnelles Yu C entrik B eta public TP1 Tests ’accessibilité ccessibilitéWeb YuCentrik Focusgroup
 surledesign Callosum Tri de cartes TP1 / Adviso
  • 21. Tests utilisateurs sur maquettes fonctionnelles Yu Centrik Betapublic TP1 Tests utilisateurssur versionalpha YuCentrik Focus group 
 surle design C allosum Tride cartes TP1 /Adviso
  • 22. Tests utilisateurs surm aquettes fonctionnelles Yu C entrik Tests utilisateurs sur version alpha Yu C entrik Focus group 
 sur le design Callosum Betapanel employés (2000) STM Tridecartes TP1/Adviso
  • 23. Tests utilisateurs urmaquettes onctionnelles YuCentrik Betapanel clients(8000) TP1 Tests utilisateurs sur version alpha Yu CentrikFocus group 
 surle design C allosum B eta panel em ployés (2000) STM
  • 24. B eta panel clients (8000) TP1 Tests utilisateurs sur version alpha Yu C entrik Tests d’accessibilité AccessibilitéWeb YuCentrik Focusgroup
 surledesign Callosum Beta panel employés (2000) STM
  • 25. Beta panel clients (8000) TP1 Betapublic TP1 Tests tilisateurssur versionalpha YuCentrik Tests d’accessibilité AccessibilitéW eb Yu C entrik B eta panel em ployés (2000) STM
  • 26. Beta panel clients (8000) TP1 Betapublic TP1 ur ha rik Tests d’accessibilité AccessibilitéWeb Yu Centrik Betapanel employés(2000)STM Tr TP
  • 27. B eta panel clients (8000) TP1 B eta public TP1 Tests d’accessibilité AccessibilitéWeb Yu Centrik Betapanel employés (2000) STM Tridecartes TP1/Adviso
  • 28. Tests utilisateurs surmaquettes fonctionnelles YuCentrik Betapanel clients(8000) TP1 Beta public TP1 Tests d’accessibilité AccessibilitéW eb Yu C entrik Tride cartes TP1 /Adviso
  • 29. Ce qu’on a appris Privilégier des tests sur des composantes fonctionnelles (mais ce n’est pas toujours possible!) Faire appel à des experts des tests. Mettre à profit le personnel de la STM, ce qui a aussi eu comme bénéfice de les mobiliser et de créer un buzz dans l’entreprise. Miser sur une stratégie de déploiement graduelle. Impliquer chaque fois que possible les utilisateurs afin d’obtenir leurs commentaires, mais aussi pour faciliter l’acceptation de la nouvelle plateforme lors de son déploiement. 52
  • 30. Résultats 53
  • 31. Déplacement du trafic 54 2011 2012 2013 2014* 0% 25% 50% 75% 100% Site web Site mobile Téléphone et SMS * Valeurs projetées pour 2014
  • 32. Applications natives téléchargées 55 * Valeurs projetées pour 2014 0 250000 500000 750000 1000000 2011 2012 2013 2014 * iOS Android
  • 33. Satisfaction de la clientèle ! Printemps 2013 (ancien site) : 94 % Été 2013 (déploiement) : 94 % Automne 2013 (nouveau site) : 96 % 56
  • 34. Merci ! 57

×