Ce diaporama a bien été signalé.
Le téléchargement de votre SlideShare est en cours. ×

Comportements mobiles : vrais challenges & idées reçues

Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Chargement dans…3
×

Consultez-les par la suite

1 sur 96 Publicité

Comportements mobiles : vrais challenges & idées reçues

Télécharger pour lire hors ligne

Présentation donnée au flupa UX Day 2015. Qu'est ce qu'un utilisateur mobile? Comment optimiser la lisibilité sur smartphone? Comment réduire le nombre d'erreurs d'input sur les interfaces tactiles? Comment les utilisateurs tiennent et interagissent-ils avec leur smartphone?

Présentation donnée au flupa UX Day 2015. Qu'est ce qu'un utilisateur mobile? Comment optimiser la lisibilité sur smartphone? Comment réduire le nombre d'erreurs d'input sur les interfaces tactiles? Comment les utilisateurs tiennent et interagissent-ils avec leur smartphone?

Publicité
Publicité

Plus De Contenu Connexe

Similaire à Comportements mobiles : vrais challenges & idées reçues (20)

Publicité

Plus récents (20)

Comportements mobiles : vrais challenges & idées reçues

  1. 1. COMPORTEMENTS MOBILES VRAIS CHALLENGES ET IDÉES REÇUES Flupa UX Day 2015
  2. 2. 2 https://fr.linkedin.com/in/cornelialaros@orsoral http://agency.smile.eu/ http://realites-paralleles.com/
  3. 3. 3 LE MOBILE ENJEUX 61% Possède un smartphone 80% des 15-24 ans 1h Temps passé quotidienne ment sur son smartphone 40% Des utilisateur regardent leur smartphone au réveil
  4. 4. 4 LE MOBILE ENJEUX 34% des achats en ligne sont fait en mobilité 31 B $ CA hors dématérialisé en 2016* 2.200 M $ CA sur le store 2.2% Taux de conversion mobile en France Q1 2015 70% à 114% du panier moyen sur desktop
  5. 5. STRATÉGIE DE CONTENU MOBILE
  6. 6. 6 CONCEPTION MOBILE STRATEGIE DE CONTENUS BORED NOW REPETITIVE NOW URGENT NOW
  7. 7. 7 SOMMAIRE STRATEGIE DE CONTENU MOBILE CATACTÉRISTIQUES DES UTILISATEURS MOBILES TAILLE DU TEXTE & LISIBILITÉ TAILLE DES BOUTONS & CONFORT D’INTERACTION EMPLACEMENT DES BOUTONS PRISE EN MAIN INTERACTIONS MOBILES POSTURE, LIEU, MAIN INTERRUPTIONS DE TÂCHES & MULTI-TÂCHE UN PHÉNOMÈNE ÉTRANGE CONNEXION INTERNET 1 2 3 4 5 6 7 8
  8. 8. 8
  9. 9. 9 CARACTÉRISTIQUES DES UTILISATEURS MOBILE TOUS DES PIRATES!
  10. 10. 10 CARACTÉRISTIQUES DES UTILISATEURS MOBILE UN POUCE ET UN ŒIL: BUSY AND DISTRACTED
  11. 11. TAILLE DU TEXTE & LISIBILITÉ
  12. 12. 12 TAILLE DU TEXTE & LISIBILITÉ UN ŒIL Vision très nette Vision moins nette Vision floue
  13. 13. 13 TAILLE DU TEXTE & LISIBILITÉ UN ŒIL
  14. 14. 14 TAILLE DU TEXTE & LISIBILITÉ UN ŒIL
  15. 15. 15 TAILLE DU TEXTE & LISIBILITÉ Excel des familles Merci à Ira Glickstein  [Retired] Senior System Engineer (Advanced Avionics and Visionics, Route Planning, Decision Aiding, Five Patents ... at IBM Multi fonctions  Panneaux routiers  Sites internet  Smartwatch A télécharger gratuitement VISUAL ACUITY AI ADVISOR
  16. 16. TAILLE DES BOUTONS
  17. 17. 17 TAILLE DES BOUTONS TAILLE RECOMMANDÉE
  18. 18. 44px minimum Pourquoi pas?
  19. 19. 19 TAILLE DES BOUTONS Classe ! TAILLE RECOMMANÉE Pas classe !
  20. 20. 44px minimum Pourquoi ?
  21. 21. 21 TAILLE DES BOUTONS ISO 9241–9 : taille des boutons = au minimum la largeur maximum de la dernière phalange de l’index de 95% de la population mâle, soit environ 22mm 1 pouce = 25,4 mm UN POUCE
  22. 22. 22 TAILLE DES BOUTONS UN POUCE
  23. 23. 23 TAILLE DES BOUTONS Barycentre de la zone de contact L’interaction se fait au niveau d’un « point » et non d’une surface FONCTIONNEMENT DU TACTILE
  24. 24. 24 TAILLE DES BOUTONS “Based on our findings, we recommend that target sizes should be at least 9.2 mm for single-target tasks and 9.6 mm for multi- target tasks in order to keep the dimensions of the targets as small as possible without decreasing performance and user preference.” ETUDE DE MICROSOFT
  25. 25. 25 TAILLE DES BOUTONS “Figure 5. The actual tap locations for target s sized 3.8, 5.8, 7.7, and 9.6 mm from left to right. White blocks indicate the true targets with black crosshairs at the centers. Gray dots indicate succe ssful hits, black dots indicate unsuccessful hits, and gray bounding boxes indicate hits that fall within 2 standard deviations of the tap means in the X and Y directions.” ETUDE DE MICROSOFT
  26. 26. 26 TAILLE DES BOUTONS « Figure 6. Subjective ratings for interacting with dicrete targets in 9 regions of the device. Mean comfort rating (1-7; 7=most comfortable) is shown in the upper left corner of each region, and depth of background color indicates more comfort. White blocs in each cell indicate the mean size, in mm, of the smallest comfortable target in the region. » ETUDE DE MICROSOFT
  27. 27. 27 TAILLE DES BOUTONS Immobile, attentif, gestes ralentis En mouvement, peu attentif Fonction de la distance  Visibilité  Confort  Erreurs Aucun bénéfice supplémentaire CONCLUSIONS
  28. 28. 28 TAILLE DES BOUTONS CONCLUSIONS
  29. 29. 29 TAILLE DES BOUTONS CONCLUSIONS
  30. 30. EMPLACEMENT DES BOUTONS
  31. 31. 31 EMPLACEMENT DES BOUTONS ACCESSIBILITÉ – VISIBILITÉ – PRÉFÉRENCE Accessible Visible Préféré Aie Effort Naturel
  32. 32. Interactions mobiles
  33. 33. 33 EMPLACEMENT DES BOUTONS INTERACTIONS MOBILES
  34. 34. 34 INTERACTIONS MOBILES
  35. 35. 35 INTERACTIONS MOBILES
  36. 36. 36 INTERACTIONS MOBILES
  37. 37. 37 INTERACTIONS MOBILES ETUDES Data 1 - Steven Hoober 2 - Cornelia Laros 3 - Cornelia Laros 4 - Cornelia Laros User action (iddle, talking, interacting Yes Interacting only Interacting only Partial: when not intrusive User position (sitting, standing, walking) Yes Yes Yes Yes Orientation (Horizontal or vertical ?) Partial : not explicit on all entries Yes Yes Yes Holding position (1 hand, 2 hands, craddle) Yes Yes Yes Yes left/ right hand Partial : not explicit on all entries Not recorded Yes Yes Low or high position Not recorded Partial: too difficult to tell Not recorded Not recorded Thumb, index Yes Yes Not recorded Yes Location Airport, bus, train, commute, station, street, mall, voting line Subway, train, station, commute, street, mall, café Subway, train, station, commute, street, mall, café Subway, train, station, commute, street, mall, café Sample size 780 825 618 110 Observation Discrete Discrete Discrete Time tracking Data date January 2013 December 2013 February 2014 August 2014
  38. 38. 38 INTERACTIONS MOBILES COMPARAISON DES RÉSULTATS
  39. 39. 39 INTERACTIONS MOBILES L’utilisateur mobile, c’est un pouce et un œil index POUCE VS. INDEX
  40. 40. 40 INTERACTIONS MOBILES 50% 15% 15% 20% ZONES D'ACCESSIBILITÉ
  41. 41. 41 INTERACTIONS MOBILES 3 PERSONNES SUR 4 ONT UN ÉTUI
  42. 42. 42 INTERACTIONS MOBILES 50% 15% 15% 20% ZONES D'ACCESSIBILITÉ
  43. 43. PORTRAIT OU PAYSAGE ?
  44. 44. 44 INTERACTIONS MOBILES 3% des observations PORTRAIT OU PAYSAGE ?
  45. 45. 45 INTERACTIONS MOBILES PORTRAIT OU PAYSAGE ?
  46. 46. UTILISATION EN SITUATION DE MOBILITÉ
  47. 47. 47 INTERACTIONS MOBILES En fonction de la posture….? En fonction du lieu….? En fonction de l’activité….? … UTILISATION EN SITUATION DE MOBILITÉ
  48. 48. 48 INTERACTIONS MOBILES En fonction de la posture….? En fonction du lieu….? En fonction de l’activité….? … UTILISATION EN SITUATION DE MOBILITÉ
  49. 49. 49 INTERACTIONS MOBILES Différence statistiquement significative, relation faible EN FONCTION DE LA POSTURE Sitting Standing Walking 1 hand 34.62% 53.68% 71.05% Cradled 48.85% 29.41% 17.11% 2 hands 16.54% 16.91% 11.84%
  50. 50. 50 INTERACTIONS MOBILES Différence statistiquement significative, relation faible EN FONCTION DE LA POSTURE Sitting Standing Walking Thumb 60.27% 81.89% 93.04% Finger 39.73% 18.11% 6.96%
  51. 51. 51 INTERACTIONS MOBILES 35% 17% 8% 40% ASSIS
  52. 52. 52 INTERACTIONS MOBILES 54% 17% 11% 18% DEBOUT
  53. 53. 53 INTERACTIONS MOBILES 71% 12% 11% 6% EN MARCHANT
  54. 54. 54 INTERACTIONS MOBILES En fonction de la posture….? En fonction du lieu….? En fonction de l’activité….? … UTILISATION EN SITUATION DE MOBILITÉ
  55. 55. Assis en différents endroits
  56. 56. 56 INTERACTIONS MOBILES 30% à 35% 17% 8% à 13% 40% ASSIS - EN FONCTION DU LIEU
  57. 57. 57 INTERACTIONS MOBILES A approfondir avec une plus grande variété de lieux ASSIS - EN FONCTION DU LIEU
  58. 58. En marchant en différents endroits
  59. 59. 59 INTERACTIONS MOBILES 71% 12% 11% 6% EN MARCHANT – N’IMPORTE OÙ
  60. 60. 60 INTERACTIONS MOBILES 17% 34% 43% 6% EN MARCHANT – DANS LE MÉTRO
  61. 61. Debout en différents endroits
  62. 62. 62 INTERACTIONS MOBILES 16% 53% 26% 5% DEBOUT – DANS LE MÉTRO
  63. 63. 63 INTERACTIONS MOBILES 51% 32% 9% 6% DEBOUT – EN GARE
  64. 64. 64 INTERACTIONS MOBILES 25% 37% 31% 6% DEBOUT – EN GALLERIE MARCHANDE
  65. 65. 65 INTERACTIONS MOBILES Non significatif EN FONCTION DU LIEU
  66. 66. Main droite ou main gauche ?
  67. 67. 67 INTERACTIONS MOBILES Je tiens mon téléphone de la main ________ et j’interagis avec la _________. Une étude déclarative de Ben Schwarz. MAIN DROITE OU MAIN GAUCHE ?
  68. 68. 68 INTERACTIONS MOBILES Entre 40% et 50% des utilisateurs Utilise sa main gauche pour tenir son smartphone MAIN DROITE OU MAIN GAUCHE ?
  69. 69. 69 INTERACTIONS MOBILES Entre 17% et 35% des utilisateurs Utilise sa main gauche pour interagir avec son smartphone MAIN DROITE OU MAIN GAUCHE ?
  70. 70. 70 INTERACTIONS MOBILES En moyenne MAIN DROITE OU MAIN GAUCHE ? 12% de la population est composée de gauchers 50% Utilise sa main gauche pour tenir son smartphone 28% Utilise sa main gauche pour interagir avec son smartphone
  71. 71. 71 INTERACTIONS MOBILES MAIN DROITE OU MAIN GAUCHE ?
  72. 72. Changement de modalités d’interactions
  73. 73. 73 INTERACTIONS MOBILES CHANGEMENT D'INTERACTIONS
  74. 74. INTERRUPTIONS DE TÂCHES & MULTI-TÂCHES
  75. 75. 76 INTERRUPTIONS DE TÂCHES Lecture ou appli debout 60s Tâche 7s Interruption Vidéo ou jeu assis 80s Tâche 16s Interruption Alterne SMS et jeu debout 50s Tâche SMS 80S Tâche Jeu MODÉLISATION DES ACTIVITÉS OBSERVÉES
  76. 76. UN PHÉNOMÈNE ÉTRANGE …
  77. 77. 78 INTERACTIONS MOBILES UN PHÉNOMÈNE ÉTRANGE 0s 5s Au bout de 5s d’attente, un site consulté sur mobile perd 74% des ses visiteurs
  78. 78. 79 INTERACTIONS MOBILES BORED NOW REPETITIVE NOW URGENT NOW UN PHÉNOMÈNE ÉTRANGE
  79. 79. 80 INTERACTIONS MOBILES BORED NOW REPETITIVE NOW URGENT NOW UN PHÉNOMÈNE ÉTRANGE
  80. 80. Connexion internet (DATA)
  81. 81. 82 INTERACTIONS MOBILES Que cherche à faire l’utilisateur ? 1. Accéder à ses e-mails 2. Echanger des SMS / téléphoner 3. Aller sur internet 4. Aller sur les réseaux sociaux 5. Recevoir des actualités 6. Jouer 7. Ecouter de la musique 8. Lire 9. Regarder des vidéos / films 10. Trouver son chemin 11. Lampe de poche CONNEXION INTERNET
  82. 82. 83 INTERACTIONS MOBILES Que cherche à faire l’utilisateur ? 1. Accéder à ses e-mails 2. Echanger des SMS / téléphoner 3. Aller sur internet 4. Aller sur les réseaux sociaux 5. Recevoir des actualités 6. Jouer 7. Ecouter de la musique 8. Lire 9. Regarder des vidéos / films 10. Trouver son chemin 11. Lampe de poche CONNEXION INTERNET
  83. 83. 84 INTERACTIONS MOBILES CONNEXION INTERNET Allo ? Oui, attend, je capte pas bien là, je suis dans le métro… Tu peux me rappeler sur mon fixe plus tard? Ma torche n’a bientôt plus de batterie…
  84. 84. 85 INTERACTIONS MOBILES CONNEXION INTERNET
  85. 85. Offline, c’est la règle Online, c’est l’exception
  86. 86. CONCLUSION & SYNTHÈSE
  87. 87. 88 CONCLUSION & SYNTHÈSE Ajuster la taille du texte à la distance de lecture AJUSTEZ LA TAILLE DU TEXTE ET DES BOUTONS
  88. 88. 89 CONCLUSION & SYNTHÈSE Dé-correller la zone visible et la zone interactive des boutons AJUSTEZ LA TAILLE DU TEXTE ET DES BOUTONS
  89. 89. 90 CONCLUSION & SYNTHÈSE IL N'Y A PAS QU'UNE MODALITÉ D'INTERACTION
  90. 90. 91 CONCLUSION & SYNTHÈSE NE PAS FORCER LE MODE PAYSAGE
  91. 91. 92 CONCLUSION & SYNTHÈSE PENSER AUX GAUCHERS
  92. 92. 93 CONCLUSION & SYNTHÈSE Patience : 5’’ Attention : 1’ à 1’30’’ Offline, c’est la règle L’UTILISATEUR MOBILE EST IMPATIENT
  93. 93. VOUS POUVEZ NOUS FAIRE UNE APPLI D’ORIENTATION PROFESSIONNELLE POUR LES ÉTUDIANTS ?
  94. 94. MERCI !
  95. 95. 96 RÉFÉRENCES Etudes http://www.insee.fr/fr/themes/document.asp?ref_id=ip1452#inter4 http://www.zdnet.fr/actualites/les-francais-toujours-plus-equipes-en-smartphones-et-tablettes-39807091.htm http://www2.deloitte.com/fr/fr/pages/presse/2014/usages-mobiles-2014.html http://fr.slideshare.net/dmolsenwvu/developing-a-progressive-mobile-strategy http://www.criteo.com/resources/mobile-commerce-q1-2015/ http://research.microsoft.com/pubs/75812/parhi-mobileHCI06.pdf Usages http://www.agence-csv.com/blog/etude-comportement-mobinautes/ http://fr.slideshare.net/agencedagobert/etat-des-lieux-du-mobile-en-france-mai-2012-13015076 http://www.mediametrie.fr/internet/solutions/l-audience-de-l-internet-mobile.php?id=93 http://www.audiencelemag.com/?article=70 http://insights.mobify.com/understanding-mobile-user-experience-the-3-modes-of-mobile-usage/ http://www.informationweek.com/mobile/google-lays-out-its-mobile-user-experience-strategy/d/d-id/1053921 http://www.smashingmagazine.com/2013/02/25/there-is-no-mobile-internet/ http://alistapart.com/article/organizing-mobile/ Interactions & accessibilité tactile http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobile-devices.php http://fr.slideshare.net/shoobe01/40min-how-peopleholdtouchconveys-30874671 http://realites-paralleles.com/tag/mobile-devices/ http://www.lukew.com/ff/entry.asp?1085 http://sebastien-gabriel.com/designers-guide-to-dpi/ http://www.pompage.net/traduction/ecrans-tactiles-mort-aux-mythes https://msdn.microsoft.com/en-us/library/bb158589.aspx http://www.uxmatters.com/mt/archives/2013/11/design-for-fingers-and-thumbs-instead-of-touch.php http://www.uxmatters.com/mt/archives/2013/03/common-misconceptions-about-touch.php http://germanforblack.com/post/39814923293/phone-in-hand SOURCES
  96. 96. 97 RÉFÉRENCES Sur le contexte d’utilisation: http://www.journaldunet.com/ebusiness/expert/50961/l-usage- local-des-tablettes--c-est-au-chaud-et-chez-moi.shtml http://adage.com/article/digital/study-consumers-shop-mobile- pcs/243843/ Sur la conception des interactions http://www.smashingmagazine.com/2012/02/21/finger-friendly- design-ideal-mobile-touchscreen-target-sizes/ http://fr.slideshare.net/henkenbean/principles-of-onboarding Outils: Visual Acuity AI Advisor https://sites.google.com/site/bigira/stuff-ira-knows POUR ALLER PLUS LOIN

×