Flupa UX Days 2017: "Hacker les outils SEO pour l'UX" par Myriam Jessier
Work n coffee : l'Ux design au service de ma performance
-
Upload
net-design -
Category
Internet
-
view
990 -
download
0
Transcript of Work n coffee : l'Ux design au service de ma performance
Prsentation PowerPoint
Workn Coffee
LUX DESIGN AU SERVICE DE MA PERFORMANCE18/09/2015
2QUEL MOTEUR DE RECHERCHE UTILISEZ-VOUS ?
3
Pourquoi utilisez-vous Google ?Quaimez-vous propos de Google ?
Quest-ce que votre famille ou vos amis aiment sur Google ?
Vous rappelez-vous de votre premire impression ?
Facile utiliser
Rapide
Page daccueil trs simple et agrable
Fait ce que je lui demande
Prcis dans les rsultats
Les rsultats saffichent rapidement
Innovant
3
4Pourquoi utilisez-vous Google ?
4
5QUEST-CE QUE LUX ?
6Dfinition
Laszliro Kovacs User centered design @Dribbble
LUX (user experience)
Concerne toutes les expriences, interactions et mme motions quun utilisateur aura avec un produit, un service et tout ce qui gravite autour : interfaces, service client, communaut, emails
6
7Attention aux mauvaises interprtations
LUX ce nest pas juste des jolies graphismes
Ou suivre les dernires modes
8
Les lments de lexprience utilisateur
STRATGIEStratgieObjectifs du produit/serviceEtudes des besoins utilisateurs
CADREDfinir les fonctionnalits du siteSon contenu
STRUCTUREArchitecture de linformationDfinition des interactions
SQUELETTEConception des interfacesDe la navigationDes lments permettant dutiliser le site
SURFACEDesign visuel.A quoi le produit final ressemble
9
Remettre lutilisateur au centre de la rflexion
LUX cest avant tout remettre lutilisateur au centre de la rflexion.
Les comprendre et rpondre leur besoins.
Rgler leurs problmes.
Designer un produitDesigner lexprience
11
12La conception centre utilisateur : les 3 erreurs viter
123Ne prendre en compte que les demandes du client sans sintresser aux besoins des utilisateurs.Penser que les utilisateurs ont les mmes besoins, comportements et gots que moi.
Vous ntes pas lutilisateurForcer les utilisateurs faire ce que lon veut.
Le seul moyen est de comprendre leurs motivations, leurs problmatiques et leurs besoins.
12
Ne pas confondre ce que lutilisateur veut VS ce dont il a besoin
14LUX ce nest pas seulement lutilisateur UXBesoins UTILISATEURSObjectifsBUSINESSQuelle valeur apporte cette exprience lentreprise ?Quen retire lutilisateur ?
14
15QUEST-CE QUI FAIT UNE BONNE UX ?
Les facettes de lexprience utilisateur16VALEURUTILITDSIRABILITCRDIBILITACCESSIBILITTROUVABILITUTILISABILIT
Les facettes de lexprience utilisateur17VALEURDSIRABILITCRDIBILITACCESSIBILITTROUVABILITUTILISABILIT
UTILITDoit rpondre un besoin et aider lutilisateur accomplir ses objectifs
UTILITLes facettes de lexprience utilisateur18VALEURDSIRABILITCRDIBILITACCESSIBILITTROUVABILIT
Doit tre facile utiliser, et fonctionner correctement (pas de bugs)UTILISABILIT
UTILITLes facettes de lexprience utilisateur19VALEURDSIRABILITCRDIBILITACCESSIBILIT
Les diffrents contenus doivent tre facile trouver pour que lutilisateur accde rapidement ce quil chercheUTILISABILITTROUVABILIT
UTILITLes facettes de lexprience utilisateur20VALEURDSIRABILITACCESSIBILIT
Lutilisateur doit avoir confiance et croire ce quon lui dit UTILISABILITTROUVABILITCRDIBILIT
UTILITLes facettes de lexprience utilisateur21VALEURDSIRABILIT
Les contenus doivent tre accessibles aux personnes souffrant dun handicap UTILISABILITTROUVABILITCRDIBILITACCESSIBILIT
UTILITLes facettes de lexprience utilisateur22VALEUR
Gnrer lmotion et ladhsion grce une identit visuelle forte et uniqueUTILISABILITTROUVABILITCRDIBILITACCESSIBILITDSIRABILIT
ACCESSIBILITUTILITLes facettes de lexprience utilisateur23DSIRABILIT
Crer de la valeur pour les utilisateurs finaux et le clientUTILISABILITTROUVABILITCRDIBILITVALEUR
SATISFAISANT MAIS PAS MMORABLE !
LA MMOIRE DE LEXPRIENCE
Le souvenir est suprieur lexprience elle-mme.
Certains lments bien prcis vont fortement colorer ce souvenir, en particulier le dbut, mais surtout la fin de lexprience, qui va avoir linfluence la plus grande.
Le fait de surpasserles attentes des utilisateurs influe aussi sur la mmoire. Cest cette condition que lon cre la surprise, plus exactement lheureuse surprise, celle qui va rester dans les souvenirs.
25
2626
Pourquoi certaines ides restent dans la mmoire ?
Chip & Dan Heath dfinissent les 6 critres dune exprience mmorable (SUCCES)
Simplicity (Simple)Unexpectedness (Inattendu) Concretness (Concret)Credibility (Crdible)Emotions (Emotionnel)Stories (Scnaris)
26
27SIMPLE27
Lexprience doit toujours sembler simple, mme si le parcours estcomplexe, requrant un enchanement dinteractions.
Cest pourquoi il vaut mieux le dcouper en plusieurs petites oprations faciles raliser isolment.
Lexprience doit toujours sembler simple, mme si le parcours est ncessairementcomplexe, requrant un enchanement dinteractions. Cestpourquoi il vaut mieux le dcouper en plusieurs petites oprations faciles raliser isolment,27
28INATTENDU28
Les surprises heureuses que nous rservent certains systmes marquent durablement lesprit.
Il est donc intressant dintgrer de manire pertinente dans les parcours des lments de surprise.
28
29CONCRET29
Labstraction exige toujours de nous plus de concentration et defforts de comprhension que ce qui est concret.
Tout ce qui rend les choses plusconcrtes et plus proches va allger la charge cognitive des utilisateurs.
29
30CRDIBLE30
Denombreuseschosespeuventdonnerducrditetdelautoritundispositif numrique:destmoignagesvrifiables,laffichagedungrandnombre dutilisateurs,desrfrences,etc.
30
31CRDIBLE31
Denombreuseschosespeuventdonnerducrditetdelautoritundispositif numrique:destmoignagesvrifiables,laffichagedungrandnombre dutilisateurs,desrfrences,etc.
Facilit la vrification de la justesse des informations sur le site (citations, rfrences, tiers de confiance)
Montrer quil y a une vritable organisation derrire le site (adresses physiques, photo de lieux)
Mettre en avant lexpertise de la marque ou des quipes
Montrer quil y a des personnes de confiances (humains) derrire le site
Faciliter la prise de contact Un design professionnel ou en relation avec le propos
Un site utile et utilisable Montrer que le site est souvent mis jour
Limiter les erreurs aussi petites soient elles (typo, liens casss) http://credibility.stanford.edu/guidelines/)
31
32MOTIONNEL32
Toutcequiagitsurnosmotionsaunimpactsurnotremmoire.
Parvenircrerdesmotionsrequierttousles talents de lquipe : lardaction,ledesigngraphiqueetlaqualitdelaralisation ferontladiffrence.
32
33SCNARIS 33Les histoires et anecdotes ont un pouvoir de persuasion plus important que les donnes.
Ecouter une histoire agit comme une sorte de simulateur mental favorisant lengagement et lidentification.
33
34QUELQUES PRINCIPES DUX DESIGN RETENIR POUR VOTRE PROCHAIN PROJET
35PENSER LE CONTENU COMME UNE TCHE35
Cestavanttoutlecontenuquimotivelavisite,rarementlesfonctionnalits oulabeautdelinterface
Onperdsouventdevuequelesutilisateursquiviennentconsulterdes informationslefontrarementpourtresimplementplussavantsouplus cultivs:cestbienplussouventunetapedansunetchepluslarge.
35
36COHRENCE36
36
37FAMILIARIT (SUIVRE LES CONVENTIONS)37
Logo en haut gauche
Au clic, renvoie vers la homeRessemble un bouton, agit comme un bouton Liens visits, dans une couleur diffrenteCouleur des liens diffrente du texte
37
38FEEDBACK38
38
39LE PROCESS DE LUX
4040Audit ergonomiqueAnalyse de la concurrencePersonasArchitecture de linformationSpcificationsWireframesLE PROCESS DE LUX
40
41AUDIT ERGONOMIQUE41
Objectif : dtecter les problmes majeurs dergonomieAnalyse de chaque site suivant une grille ergonomiqueIdentification des problmes dutilisabilit majeursRapport danalyse ergonomiqueLIVRABLE
41
42ANALYSE DE LA CONCURRENCE42Objectif : Dtecter les forces et faiblesses des dispositifs des concurrents.
Faire ressortir des bonnes pratiques dun march
Analyse des sites des concurrents grce une grille prdfinieTests utilisateurs sur les sites concurrentsDfinition des fonctionnalits permettant de se dmarquer
42
43PERSONAS43
Objectif : communiquer et partager une vision commune des utilisateurs au sein de lquipe Dfinition des caractristiques des utilisateursDfinition de leurs tches/besoins principauxCration des scnarios utilisateursPersonasLIVRABLE
43
44ARCHITECTURE DE LINFORMATION & PARCOURS44
Objectif : dfinir la structuration des contenus permettant aux utilisateurs de trouver facilement linformationCration dune arborescenceDfinition des principaux gabarits de pageDfinition dune taxonomie permettant de lier les contenus entre euxArborescenceTaxonomieListe des principaux gabaritsLIVRABLES
44
45WIREFRAMES45
Objectif : matrialiser les contenus, fonctionnalits et parcours utilisateurs du site Intgration de tous les lments dinterfaceDfinition de la hirarchie de linformationDynamisation des fonctionnalits importantesOutil utilis : AxurePrototype HTML gnr par AXURELIVRABLE
45
46SPCIFICATIONS FONCTIONNELLES FINALES46
46
INTGRER LUTILISATEUR DANS LE PROCESS
INTEGRATION DES TESTS UTILISATEURS DANS LA PHASE DE CONCEPTIONPrincipaux bnfices : Se baser sur des mesures empiriques plutt que sur des hypothses.Scuriser chaque tape pour viter de repartir de zro.Justifier les choix par une validation utilisateur pour objectiver les dcisions et favoriser ladhsion en interneAudit ergonomiqueAnalyse de la concurrencePersonasArchitecture de linformationSpcificationsWireframesQuestionnaire en ligne
Tri de carte
Tree Testing
Tests utilisateurs
QUESTIONNAIRE EN LIGNEObjectif : rcolter de la donne relle sur les utilisateurs afin de construire des Personas fiables
laboration du questionnaire en ligneDiffusion du questionnaire sur vos fichiers clients ou sur vos sites actulsAnalyse du questionnaire
Outils: SurveyMonkey, SurveyGizmo, Google Formulaire, Hotjar
TRI DE CARTElaboration du questionnaire en ligneDiffusion du questionnaire sur les fichiers clientsAnalyse du questionnaireDescription : Proposer un ensemble dutilisateurs les contenus sous forme de carte quils doivent classer en catgories quils nomment.
Peut tre utilis pour redesigner larborescence dun site, un catalogue produit
Dmonstration en lignehttps://www.optimalworkshop.com/optimalsort-demoOutil: Optimal Workshop > Optimal Sort
TREE TESTING51Description : le tree testing permet dvaluer la facilit daccs linformation. Le test est effectu sur une arborescence interactive sans biais graphiques. On propose des tches effectuer aux utilisateurs et on value leur taux de russite.Dmonstration en lignehttps://www.optimalworkshop.com/treejack-demo
Objectif : valider larborescence dun point de vue utilisateur.Paramtrage du tree testingDiffusion du test en ligneAnalyse
Outil: Optimal Workshop > Treejack
Objectif : identifier les problmes dutilisabilit majeurs et le niveau de satisfaction des utilisateursA lissue des tests utilisateurs les prototypes seront corrigs si ncessaire.
TESTS UTILISATEURSRdaction dun plan de testRecrutement des participantsPassation des tests distanceAnalyse
52Outils: Skype, join.me, GotoMeetin, Morae
53SUCCESS STORIES
LE BOUTON 300 MILLIONS DE $
+ 300 MILLIONS DE DOLLARS SUR 1 AN (+45%)
60SUCCESS STORIES60
Airbnb : Bienvenue la maison la marque nous parle comme un ami nous fait vivre lexprience avant de vivre lexprience
60
61EXEMPLES CONCRETS61
Wufoo (service de cration de formulaire en ligne)
Envoie de lettres manuscrites de remerciement dinscription au service
61
62EXEMPLES CONCRETS62
Wufoo (service de cration de formulaire en ligne)
Envoie de lettres manuscrites de remerciement dinscription au service
62
BONUS !
Pour maintenir le cap et garder lesprit clair tout au long du projet, posez-vous les bonnes questions Quels sont les objectifs du site ou de la marque ?Qui sont mes utilisateurs ?Do viennent-ils ?Que cherchent-ils ?Quest-ce qui est important pour eux ? Quest-ce qui doit absolument tre mis en avant ?Quelles sont les prochaines tapes de lutilisateur ?
MERCI DES QUESTIONS ?
THANK YOU !ANNECYZAC de Valparc, 74330 PoisyT. : +33 (0)4 50 244 244GENEVEWTC II - route de Pr-Bois 291215 GenveT. : +41 (0) 22 320 75 11
www.agencenetdesign.com