![Page 1: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/1.jpg)
@ippontech#UXImportantePourNous
L'expérience utilisateur est importante pour nous
![Page 2: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/2.jpg)
@ippontech#UXImportantePourNous
Florence Herrou
Ippon Technologies NantesIngénieur Java / nouvelles technologiesAgiliste convaincue
![Page 3: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/3.jpg)
@ippontech#UXImportantePourNous
Sommaire
• Introduction : qu'est-ce que l'UX ?• Exemple concret : un ENT• En quoi ça nous concerne ?• Que faire quand on est dev ?• Connaître l'utilisateur• Comprendre les besoins• L'utilisateur a toujours raison• Tester• Les petits plus
![Page 4: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/4.jpg)
Objectifs
Ce que vous allez apprendre pendant cette présentation
![Page 5: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/5.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Design d'expérience utilisateur
![Page 6: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/6.jpg)
@ippontech#UXImportantePourNous
Expérience utilisateur
• Conception d'un produit centré sur l'utilisateur
• Ne se limite pas à l'ergonomie : le produit ne doit pas seulement être facile à utiliser, il doit également être agréable et répondre à un besoin
• Processus itératif
• Métier lié au design
• Encore émergent en France. Exemple : Décathlon
![Page 7: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/7.jpg)
![Page 8: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/8.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Exemple
![Page 9: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/9.jpg)
@ippontech#UXImportantePourNous
Espace numérique de travail
• Portail d'information d'un établissement scolaire
• Informations sur les emplois du temps, les salles, les activités…
• Relations entre les parents et les enseignants
• Espace d'échanges entre les élèves
• Saisie des absences
• Mise à disposition de ressources pédagogiques
• ...
![Page 10: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/10.jpg)
![Page 11: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/11.jpg)
![Page 12: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/12.jpg)
Création du compte utilisateurCréation du compte utilisateur
![Page 13: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/13.jpg)
Création du compte utilisateurCréation du compte utilisateur Recherche des emplois du tempsRecherche des emplois du temps
![Page 14: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/14.jpg)
Création du compte utilisateurCréation du compte utilisateur
Recherche du prochain coursRecherche du prochain cours
![Page 15: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/15.jpg)
Confirmation de l'adresse mailConfirmation de l'adresse mail Préparation du coursPréparation du cours
![Page 16: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/16.jpg)
ConnexionConnexion Préparation du coursPréparation du cours
![Page 17: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/17.jpg)
Recherche des emplois du tempsRecherche des emplois du temps Préparation du coursPréparation du cours
![Page 18: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/18.jpg)
Recherche des emplois du tempsRecherche des emplois du temps En route vers la salleEn route vers la salle
![Page 19: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/19.jpg)
Recherche du prochain coursOups ! C'est maintenant !
Recherche du prochain coursOups ! C'est maintenant !
Début du coursDébut du cours
![Page 20: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/20.jpg)
Recherche de la salle du prochain coursRecherche de la salle du prochain cours CoursCours
![Page 21: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/21.jpg)
En route vers la salleEn route vers la salle CoursCours
![Page 22: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/22.jpg)
@ippontech#UXImportantePourNous
Espace numérique de travailLes premiers cours se sont déroulés. Obi-Wan et Mace ont donné des devoirs à rendre sur l'ENT à leurs élèves. Ils doivent maintenant se rendre sur le portail pour :
• Lire les copies numériques des élèves
• Attribuer des notes
![Page 23: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/23.jpg)
Pas de bol, il y a un bug pour une copiePas de bol, il y a un bug pour une copie
![Page 24: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/24.jpg)
Consultation des copiesConsultation des copies
![Page 25: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/25.jpg)
Recherche de l'endroitoù on met les notes
Recherche de l'endroitoù on met les notes Notation de la copieNotation de la copie
![Page 26: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/26.jpg)
Consultation d'une nouvelle copieConsultation d'une nouvelle copieNotation de la copieNotation de la copie
![Page 27: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/27.jpg)
5 minutes de clics sur l'icône pour revenir aux copies avant de
comprendre que ce n'est qu'un dessin et que le lien est à côté
5 minutes de clics sur l'icône pour revenir aux copies avant de
comprendre que ce n'est qu'un dessin et que le lien est à côté Notation de la copieNotation de la copie
![Page 28: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/28.jpg)
Noter toutes les copies et profiter du temps libre pour sauver la galaxieNoter toutes les copies et profiter
du temps libre pour sauver la galaxieNoter toutes les copiesNoter toutes les copies
![Page 29: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/29.jpg)
![Page 30: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/30.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
L'échec des projets
![Page 31: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/31.jpg)
Christophe Moustier
![Page 32: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/32.jpg)
![Page 33: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/33.jpg)
Planbox
![Page 34: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/34.jpg)
![Page 35: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/35.jpg)
![Page 36: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/36.jpg)
![Page 37: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/37.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Que faire ?
![Page 38: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/38.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Qui est l'utilisateur ?
![Page 39: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/39.jpg)
![Page 40: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/40.jpg)
@ippontech#UXImportantePourNous
Exemple
• Besoin d'une application de gestion de données naturalistes• L'utilisateur fait des observations de présence d'espèces en un
lieu et à un moment donnés• Entrée de ces données dans la base par l'application
![Page 41: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/41.jpg)
![Page 42: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/42.jpg)
@ippontech#UXImportantePourNous
Deux profils
• Naturaliste « expert » : besoin d'entrer des données en masse sans perte de temps
• Grand public dans le cadre de la science participative : besoin d'être guidé et cadré tout le long du processus
• Deux applications différentes !
![Page 43: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/43.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Répondre au besoin, pas aux demandes
![Page 44: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/44.jpg)
Si j’avais demandé à mes clients ce qu’ils attendaient, ils auraient répondu :
Un cheval plus rapide
Henry Ford
![Page 45: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/45.jpg)
J’ai besoin d’un nouvel outil de mailing-list
Lisamarie Babik
![Page 46: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/46.jpg)
@ippontech#UXImportantePourNous
Demandes du client
• Pouvoir gérer plusieurs listes à la fois• Pouvoir lire les échanges sur un site au lieu de recevoir des
mails• Suivre une conversation (des mails qui se répondent)• Si on envoie des documents, ils sont stockés sur le site et pas
envoyés en pièce jointe aux destinataires
![Page 47: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/47.jpg)
Réponse à la demandeRéponse à la demande
![Page 48: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/48.jpg)
Réponse au besoin : le réseau socialRéponse au besoin : le réseau social
![Page 49: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/49.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
L'utilisateur a toujours raison
![Page 50: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/50.jpg)
@ippontech#UXImportantePourNous
L'utilisateur ne comprend pas
• Est-ce que j'ai mal expliqué ?• Est-ce qu'il est idiot ?• Est-ce qu'il est de mauvaise foi ?
![Page 51: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/51.jpg)
@ippontech#UXImportantePourNous
L'utilisateur ne comprend pas
• Est-ce que l'application est trop compliquée ?
![Page 52: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/52.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Tester tout le temps
![Page 53: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/53.jpg)
Avant les développements : le prototype papierAvant les développements : le prototype papier
![Page 54: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/54.jpg)
Tests A/BTests A/B
![Page 55: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/55.jpg)
Interroger les utilisateursInterroger les utilisateurs
![Page 56: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/56.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Les petits plus
![Page 57: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/57.jpg)
@ippontech#UXImportantePourNous
Obtenir le comportement désiré
• Une tâche sera effectuée ou non en fonction de deux critères :• La motivation de l'utilisateur• La facilité de la tâche
• Un déclencheur est également nécessaire• Externe ou interne
![Page 58: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/58.jpg)
![Page 59: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/59.jpg)
![Page 60: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/60.jpg)
![Page 61: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/61.jpg)
@ippontech#UXImportantePourNous
La ludification (gamification)
• Utilisation de techniques issues du jeu vidéo pour :• Créer l'engagement• Faciliter la progression• Favoriser le travail en équipe• Créer de nouvelles habitudes
• Utilisation de quêtes de difficulté progressive et de passages de niveau
• Dimension sociale
![Page 62: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/62.jpg)
Exemple : habitRPGExemple : habitRPG
![Page 63: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/63.jpg)
Exemple : Stack OverflowExemple : Stack Overflow
![Page 64: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/64.jpg)
@ippontech#UXImportantePourNous
Le storytelling
• Présenter son application sous la forme d'une histoire• Goût naturel pour les histoires• Suscite des émotions et améliore la mémorisation
• Plutôt une technique marketing
• Ce que j'ai tenté de faire en première partie
![Page 65: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/65.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Conclusion
![Page 66: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/66.jpg)
@ippontech#UXImportantePourNous
Remerciements
• Georges Lucas, un excellent storytelleur • Images de la première partie issues des films Star Wars
• BJ Fogg pour m'avoir autorisée à utiliser son modèle• http://www.behaviormodele.org
![Page 67: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/67.jpg)
@ippontech#UXImportantePourNous
Contact
• Adresse mail : [email protected]
• LinkedIn : https://www.linkedin.com/in/florenceherrou
• Blog : http://blog.ippon.fr/
![Page 68: L'expérience Utilisateur est impotante pour nous (Devoxx)](https://reader030.vdocuments.site/reader030/viewer/2022020208/55a8fffe1a28ab3a7c8b45d5/html5/thumbnails/68.jpg)
@YourTwitterHandle@YourTwitterHandle @ippontech#UXImportantePourNous
Q & A