9-10.30 - UX, tendances et réflexions

861 vues

Publié le

Comment prendre en compte les besoins de l'utilisateur pour mieux faire comprendre les messages de l'entreprise ?

Publié dans : Design
0 commentaire
1 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
861
Sur SlideShare
0
Issues des intégrations
0
Intégrations
2
Actions
Partages
0
Téléchargements
36
Commentaires
0
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

9-10.30 - UX, tendances et réflexions

  1. 1. UX DESIGN TENDANCES & REFLEXIONS www.publicorp.fr 13 rue Rosenwald 75015 paris Contact : Céline Le Bail celine.lebail@publicorp.fr
  2. 2. MAIS AU FAIT, C’EST QUOI L’UX ? QUI SONT CES GENS QUE L’ON APPELLE UTILISATEURS ? LES TENDANCES DE l’UX GOOD & BAD UX LE FUTUR DE L’UX LE SOMMAIRE
  3. 3. MAIS AU FAIT, C’EST QUOI L’UX ?
  4. 4. Pour le savoir revenons en 1580…
  5. 5. Salut, moi c’est Montaigne
  6. 6. Et ça, c‘est mon best-seller
  7. 7. La parole est moitié à celui qui parle, moitié à celui qui l’écoute Eh ouais, c‘est moi qui l’ai dit
  8. 8. Le message émis est aussi important que l’expérience de celui qui le reçoit
  9. 9. Et voici Montaigne penseur de l’UX design… Merci, restez assis
  10. 10. UX User eXperience eXpérience Utilisateur
  11. 11. Besoins de l’entreprise Besoins de l’utilisateur UXdesign
  12. 12. Sur internet l’UX design doit permettre à l’entreprise de délivrer clairement son message tout en donnant la possibilité à l’utilisateur de concrétiser son action sans effort, dans un environnement fiable
  13. 13. QUI SONT CES GENS QUE L’ON APPELLE UTILISATEURS ?
  14. 14. Vous, moi, nous…
  15. 15. Alexandre, 19 ans, IDF Étudiant IUT TC
  16. 16. “ Dans mon téléphone, il y a toute ma vie ! ”
  17. 17. “ Je crois que je n’arriverais pas à me couper du monde plus d’une journée ! ”
  18. 18. “ Dès le matin, j’ai plein de notifications ”
  19. 19. “ Quand je ne suis pas satisfait d’une marque, je n’hésite pas à le lui faire savoir ”
  20. 20. Florence, 49 ans Vendeuse, Bordeaux
  21. 21. “ Ce que j’attends de mon téléphone ? Surtout qu’il appelle ! ”
  22. 22. “ J’ai l’impression d’être parfois larguée face à la technologie, mais heureusement mes enfants prennent le temps de m’expliquer ”
  23. 23. “ Le plus important pour moi c’est de garder contact avec mes proches, peu importe où ils se trouvent ”
  24. 24. “ J’aime bien partager mes photos, vidéos sur les réseaux sociaux, comme ça les choses restent ”
  25. 25. Martine, 81 ans Retraitée, Metz
  26. 26. “ Depuis qu’internet est là, je trouve que l’on perd de plus en plus le contact physique et le lien commercial ”
  27. 27. “ Envoyer un sms, je trouve ça plus compliqué que de faire une recherche sur un iPad ”
  28. 28. “ J’ai l’impression qu’internet à ouvert le champ de la connaissance ”
  29. 29. Dominique, 53 ans Commercial, Grenoble
  30. 30. “ Je suis un peu devenu un geek malgré moi ”
  31. 31. “ J’ai l’impression que la frontière entre mes vies pro et perso est de plus en plus fine ”
  32. 32. “ Pendant mes vacances j’essaie toujours de me déconnecter à fond ”
  33. 33. “ Je surveille tout le temps mes performances sportives via des applis ”
  34. 34. TENDANCES UX
  35. 35. L’infobésité peut être un atout
  36. 36. L’expérience commence toujours par le menu
  37. 37. LA NAVIGATION PAR MENU Les mégas-menus factuels Site marchand - Adidas
  38. 38. LA NAVIGATION PAR MENU Les mégas-menus factuels Site marchand – Hello Bank !
  39. 39. LA NAVIGATION PAR MENU Les menus expliqués Site média – Veolia
  40. 40. Les mégas-menus chronologiques LA NAVIGATION PAR MENU Site média – The Verge
  41. 41. Double méga-menu LA NAVIGATION PAR MENU Site marchand – Lexus
  42. 42. LA NAVIGATION PAR MENU Les mégas-menus pictographiques Site événementiel – Skoda
  43. 43. Les méga-menus serviciels LA NAVIGATION PAR MENU Site institutionnel – St Gobain
  44. 44. LA NAVIGATION PAR MENU Les méga-menu éditorialisés Site institutionnel – Groupe Adidas
  45. 45. LA NAVIGATION PAR MENU Les méga-menus profilés Site marchand – Billabong
  46. 46. LA NAVIGATION PAR MENU Les doubles-menu Site média – Cosmopolitan
  47. 47. LA NAVIGATION PAR MENU Les doubles-menu iOS - Apple
  48. 48. LA NAVIGATION PAR MENU Les onglets de chapitrage Site média – Alstom Grid
  49. 49. LA NAVIGATION PAR MENU Les onglets revus par le mobile Application Google Chrome
  50. 50. LA NAVIGATION PAR MENU Des menus dynamiques Application Wikipedia
  51. 51. LA NAVIGATION PAR MENU La navigation chronologique et thématique Application media – Le Monde
  52. 52. La recherche se fait réflexe
  53. 53. LA RECHERCHE Transformer son site en moteur de recherche
  54. 54. LA RECHERCHE Transformer son site en moteur de recherche Site média – Cosmopolitan
  55. 55. LA RECHERCHE Offrir de meilleures suggestions Site institutionnel – Boeing
  56. 56. Remplacer la recherche par la suggestion LA RECHERCHE Site grand public – Mairie de Sydney
  57. 57. Un référentiel unique et universel pour les contenus, le grid design
  58. 58. Le grid design interactif LE GRID DESIGN Site événementiel – Oreo
  59. 59. Le grid interactif LE GRID DESIGN Site institutionnel – United Technologies
  60. 60. Le grid slider LE GRID DESIGN Site conseil fitness – Reebok
  61. 61. Grid Design thématique LE GRID DESIGN Site marchand – Uniqlo
  62. 62. Le grid design ajustable LE GRID DESIGN Site marchand – Uniqlo
  63. 63. Le grid design personnalisable LE GRID DESIGN Application institutionnelle– Airbus Group
  64. 64. L’instantanéité dynamise la marque
  65. 65. Rendre lisible les flux, source infinie de contenus
  66. 66. Par défaut FILTRER TOUS LES FLUX Appli RH – GDF Suez
  67. 67. Par des sous-menus cachés FILTRER TOUS LES FLUX Site événementiel – Doritos
  68. 68. Par des sous-menus cachés FILTRER TOUS LES FLUX Site institutionnel – BASF
  69. 69. Par un simple clic FILTRER TOUS LES FLUX Agrégateur de flux - Feedly
  70. 70. Par un simple « swipe » FILTRER TOUS LES FLUX Application message - iOS
  71. 71. Excel c’est fini !
  72. 72. Des tableaux personnalisables LA DATA Site Institutionnel - BASF
  73. 73. Rendre l’information visuelle LA DATA Site ville – Transit Time NYC
  74. 74. Classer les données LA DATA Site évènementiel – Formule 1
  75. 75. Mettre en lumière une information LA DATA Site média – Le Décodeur (Le Monde)
  76. 76. Exploiter les données en temps réel LA DATA Site évènementiel – Ubisoft
  77. 77. Capter une cible volatile
  78. 78. L’immersion pour ressentir l’univers de la marque
  79. 79. L’IMMERSION Méga header vidéo Site marchand – FIVE GUYS
  80. 80. L’IMMERSION Un site en mouvement perpétuel Site marchand – FIVE GUYS
  81. 81. L’IMMERSION Réduire le menu au scroll Site évènementiel – Oreo
  82. 82. Le scrollytelling vertical L’APPROCHE PARCOURS Site marchand – AIR Amsterdam (club)
  83. 83. Le scrollytelling horizontal L’APPROCHE PARCOURS Site événementiel – Reebok
  84. 84. Le triple scroll L’APPROCHE PARCOURS Site média – Le Monde
  85. 85. Le scrollytelling cyclique L’APPROCHE PARCOURS Site marchand – Trippeo
  86. 86. Le scrollytelling cinématique L’APPROCHE PARCOURS Site événementiel – Mercedes Benz
  87. 87. Le scrollytelling animé L’APPROCHE PARCOURS Site événementiel – WWF
  88. 88. Des parcours sur-mesure pour garder l’utilisateur plus longtemps
  89. 89. Les suggestions pendant la lecture L’APPROCHE PARCOURS Application Institutionnelle – Crédit Agricole
  90. 90. Les suggestions pendant la lecture L’APPROCHE PARCOURS Site média – New York Times
  91. 91. Les suggestions pendant la lecture L’APPROCHE PARCOURS Site média – New York Times
  92. 92. Les suggestions pendant la lecture L’APPROCHE PARCOURS Site média – Cosmopolitan - VICE news
  93. 93. Les suggestions pendant la lecture L’APPROCHE PARCOURS Site média – Le Monde & Genius
  94. 94. Un menu disponible en permanence L’APPROCHE PARCOURS Blog – The cultureist
  95. 95. Garder le contact pour conserver son audience
  96. 96. Les pop-in intempestives L’ENGAGEMENT Incitation au partage Incitation à l’abonnement
  97. 97. L’incitation subtile à l’abonnement L’ENGAGEMENT Site institutionnel - Peugeot
  98. 98. Les modules conversationnels L’ENGAGEMENT Site commercial – searchforenergy
  99. 99. L’intégration des réseaux sociaux L’ENGAGEMENT Site media – Cosmopolitan
  100. 100. L’intégration des réseaux sociaux L’ENGAGEMENT Site évènementiel – Skoda
  101. 101. L’intégration des réseaux sociaux L’ENGAGEMENT Site évènementiel – Peugeot RCZ
  102. 102. Géolocaliser les contenus et les services pour afficher sa proximité
  103. 103. Cartes de suggestions LA GEOLOCALISATION Site touristique – Manchester
  104. 104. Géolocaliser ses articles LA GEOLOCALISATION Site média – Le Monde
  105. 105. Adapter son contenu en fonction des lieux LA GEOLOCALISATION Yahoo météo – Uber - RATP
  106. 106. SERVICE 24/7 Application musique - Bandsintown Adapter son contenu en fonction des lieux
  107. 107. Imaginer de nouvelles solutions face aux impatiences
  108. 108. Ne jamais laisser ses utilisateurs dans une impasse
  109. 109. La contextualisation LES SALLES D’ATTENTES 2.0 Site événementiel – Mac Donald’s
  110. 110. La customisation LES SALLES D’ATTENTES 2.0 Site marchand – Reebok
  111. 111. L’humour à la rescousse LES SALLES D’ATTENTES 2.0 Site institutionnel - SSII
  112. 112. Le retour « IRL » LES SALLES D’ATTENTES 2.0 Réseau social - Twitter
  113. 113. Le gaming LES SALLES D’ATTENTES 2.0 Navigateur – Google Chrome
  114. 114. La marque doit offrir du service
  115. 115. Des modules persistants SERVICE 24/7 Site marchand – Bouygues Telecom
  116. 116. Des modules personnalisables SERVICE 24/7 Site touristique – Istanbul
  117. 117. Des modules personnalisables SERVICE 24/7 Site marchand - Adidas
  118. 118. Démocratiser l’information pour parler à tous
  119. 119. Se réapproprier les codes universels de lecture
  120. 120. Des contenus écrits noir sur blanc HABITUDES > WEB Site évenementiel - Reebok
  121. 121. Des « Unes » magazinées HABITUDES > WEB Site touristique – NYC The Official Guide
  122. 122. Des pages stylisées en fonction des formats HABITUDES > WEB Site média – Vice News
  123. 123. Livre interactif HABITUDES > WEB Site événementiel – Land Rover
  124. 124. Revisiter des classiques du jeu-vidéo HABITUDES > WEB Site événementiel - BCE
  125. 125. Guider l’utilisateur grâce aux « coach marks » HABITUDES > WEB Application Tempo Smart Calendar
  126. 126. GOOD and BAD UX
  127. 127. DEVANCER LES ATTENTES Mac OS X - Apple
  128. 128. DU RESPONSIVE INTELLIGENT Application - Evernote
  129. 129. DES DEVICES LIES Messagerie – Whatsapp sur le web
  130. 130. DE LA SYMPATHIE  Site marchand - ASOS
  131. 131. DE L’INTEGRATION TOTALE Moteur de recherche - Google
  132. 132. ON PENSE A TOUS ! Application de jeu – Two Dots
  133. 133. Des sites customisables HOME SWEET HOME Site serviciel - Transfers
  134. 134. UNE PAGE INNOVATION PAS INNOVANTE Site institutionnel - ALSTOM
  135. 135. LE FAMEUX PRIX CACHE Site marchand – American Golf
  136. 136. LES ASTERISQUES TROMPEURS Site marchand – Perfect Compliance
  137. 137. NE PAS DONNER LA BONNE INFO Site créatif – Dribble
  138. 138. BOUSCULER LES HABITUDES Application mobile - Snapchat
  139. 139. ET DEMAIN ?
  140. 140. L’enrichissement des vidéos
  141. 141. LES EXEMPLES IKEA ET ONLY
  142. 142. L’approche « mobile first »
  143. 143. L’EXEMPLE AIRBUS
  144. 144. Le responsive design 2.0
  145. 145. LE RESPONSIVE C’EST DÉJÀ VIEUX !
  146. 146. La réalité augmentée
  147. 147. LA CONCEPT-CAR JAGUAR
  148. 148. L’eye-tracking
  149. 149. L’EXEMPLE SKODA
  150. 150. Les objets connectés
  151. 151. LES OBJETS CONNECTES
  152. 152. <quit> MERCI </quit> www.publicorp.fr 13 rue Rosenwald 75015 paris Contact : Céline Le Bail celine.lebail@publicorp.fr

×