47
[email protected] CONCEVOIR UNE EXPÉRIENCE UTILISATEURS MULTICANAUX POURQUOI ET COMMENT ? Axel JOHNSTON Designer d’expérience utilisateur Cofondateur d’Akiani [email protected] www.akiani.fr

Comment concevoir une experience utilisateur cross canal

  • Upload
    akiani

  • View
    415

  • Download
    1

Embed Size (px)

Citation preview

Page 1: Comment concevoir une experience utilisateur cross canal

[email protected]

CONCEVOIR UNE EXPÉRIENCE UTILISATEURS MULTICANAUX

POURQUOI ET COMMENT ?

Axel JOHNSTONDesigner d’expérience utilisateur

Cofondateur d’Akiani

[email protected]

www.akiani.fr

Page 2: Comment concevoir une experience utilisateur cross canal

[email protected]

• Sur 6,8 Milliards d’habitants, combien ont accès à un téléphone mobile ?

• Sur 6,8 Milliards d’habitants, combien ont accès à des toilettes saines ?

• Sur 100 transactions commerciales, combien ont commencé sur un appareil pour terminer sur un autre ?

• En moyenne, de combien d’objets connectés disposons-nous ?

• Dans 6 ans, de combien d’objets connectés disposerons-nous ?

• Dans combien de temps existera-t-il plus de tablettes que de PC ?

/ 2

Pour commencer

6 milliards

4,5 Milliards

90

3

6

maintenant

Page 3: Comment concevoir une experience utilisateur cross canal

[email protected] / 3

Pour commencer

Page 4: Comment concevoir une experience utilisateur cross canal

[email protected]

Le poids du m-commerce

Flickr / afagen

Page 5: Comment concevoir une experience utilisateur cross canal

[email protected] / 5

401 429

131

442

11

124

0

200

400

600

800

1000

1200

2010 2013

Tablette

Mobile

PC

Temps passé (US) par plateforme digitale (Milliards de minutes)

comScore Media Metrix Multi-Platform, US, Decembre 2013

Page 6: Comment concevoir une experience utilisateur cross canal

[email protected] / 6

Une croissance exponentielle

Page 7: Comment concevoir une experience utilisateur cross canal

[email protected]

Des essais chez Amazon ont montré

qu’une augmentation du temps de chargement de

100 ms leur faisait perdre 1% du volume de vente

/ 704/09/2014

http://www.websiteoptimization.com/speed/tweak/psychology-web-performance/

Page 8: Comment concevoir une experience utilisateur cross canal

[email protected] / 8

Développement de la part mobile

6%

14%

Proportion des achats depuis un mobile lors du « Black Friday »

américain

2010 2011

24%

40%

2012 2013

Page 9: Comment concevoir une experience utilisateur cross canal

[email protected] / 9

-4.30%

48.80%

Sites web Applications

Fréquentation des sites web et applications – Dec 13 vs Dec 12Etude réalisée du 1er janvier 2012 au 31 Décembre 2013 sur un périmètre de 2 933 sites web et 263

applications auditées par AT Internet

Page 10: Comment concevoir une experience utilisateur cross canal

[email protected]

On compte en moyenne

41téléchargements d’appli par smartphone

/ 1004/09/2014

http://www.websiteoptimization.com/speed/tweak/psychology-web-performance/

Page 11: Comment concevoir une experience utilisateur cross canal

[email protected]

Le phénomène cross-device

Flickr / alexerde

Page 12: Comment concevoir une experience utilisateur cross canal

[email protected] / streamishmc

98 % utilisent

+ de 1 device par jour

Page 13: Comment concevoir une experience utilisateur cross canal

[email protected]

90 % des tâches sont commencées sur un

écran puis terminées sur un autre

/ 13

Une expérience multi device …

Page 14: Comment concevoir une experience utilisateur cross canal

[email protected]

66% utilisent 2

appareils ou plus

en même temps

/ 14

…. multi-tâche …

81%lorsque c’est

devant une télévision

Page 15: Comment concevoir une experience utilisateur cross canal

[email protected] / 15

… avec un impact sur l’engagement utilisateur

1x

3,4x

1x

Taux d’engagement moyen Taux de conversion moyen

5,4x

Mono device Cross device Mono device Cross device

Page 16: Comment concevoir une experience utilisateur cross canal

[email protected]

Chez Ebay les visiteurs multi-devices

achètent 2x plus que les autres utilisateurs

/ 1604/09/2014

http://www.websiteoptimization.com/speed/tweak/psychology-web-performance/

Page 17: Comment concevoir une experience utilisateur cross canal

[email protected] / 1704/09/2014

Concevoir une expérience utilisateur multi-

canal

Flickr / yourdon

Page 18: Comment concevoir une experience utilisateur cross canal

[email protected]

• Complémentarité– Comment ne pas faire doublon et apporter une nouvelle expérience

encore plus innovante pour mes utilisateurs ?

• Continuité– Comment créer une expérience « sans couture » ?

• Fonctionnalités– Quelles sont les fonctionnalités propres au device qui pourraient

apporter une valeur ajoutée ?

• Le contexte d’utilisation– Quel est le contexte d’utilisation ?

• Spécificité des interactions

• Lieux, interruption de tâches et multi-tâches

• Respect des usages de la plateforme (Guidelines)

/ 18

Concevoir une expérience utilisateur multi-

canal

Page 19: Comment concevoir une experience utilisateur cross canal

[email protected]

• Complémentarité– Comment ne pas faire doublon et apporter une nouvelle expérience

encore plus innovante pour mes utilisateurs ?

• Continuité– Comment créer une expérience « sans couture » ?

• Fonctionnalités– Quelles sont les fonctionnalités propres au device qui pourraient

apporter une valeur ajoutée ?

• Le contexte d’utilisation– Quel est le contexte d’utilisation ?

• Spécificité des interactions

• Lieux, interruption de tâches et multi-tâches

• Respect des usages de la plateforme (Guidelines)

/ 19

Concevoir une expérience utilisateur multi-

canal

Page 20: Comment concevoir une experience utilisateur cross canal

[email protected] / 20

Complémentarité

Page 21: Comment concevoir une experience utilisateur cross canal

[email protected]

• Complémentarité– Comment ne pas faire doublon et apporter une nouvelle expérience

encore plus innovante pour mes utilisateurs ?

• Continuité– Comment créer une expérience « sans couture » ?

• Fonctionnalités– Quelles sont les fonctionnalités propres au device qui pourraient

apporter une valeur ajoutée ?

• Le contexte d’utilisation– Quel est le contexte d’utilisation ?

• Spécificité des interactions

• Lieux, interruption de tâches et multi-tâches

• Respect des usages de la plateforme (Guidelines)

/ 21

Concevoir une expérience utilisateur multi-

canal

Page 22: Comment concevoir une experience utilisateur cross canal

[email protected] / 22

Continuité

Page 23: Comment concevoir une experience utilisateur cross canal

[email protected]

• Complémentarité– Comment ne pas faire doublon et apporter une nouvelle expérience

encore plus innovante pour mes utilisateurs ?

• Continuité– Comment créer une expérience « sans couture » ?

• Fonctionnalités– Quelles sont les fonctionnalités propres au device qui pourraient

apporter une valeur ajoutée ?

• Le contexte d’utilisation– Quel est le contexte d’utilisation ?

• Spécificité des interactions

• Lieux, interruption de tâches et multi-tâches

• Respect des usages de la plateforme (Guidelines)

/ 23

Concevoir une expérience utilisateur multi-

canal

Page 24: Comment concevoir une experience utilisateur cross canal

[email protected]

Desktop Tablette Smartphone Smartwatch

Géolocalisation - + +++ +++

Accéléromètre ++ +++ +++

Gyroscope ++ +++ +++

Carte graphique +++ ++ + ---

Surface

d’affichage

+++ ++ + -

Interaction Souris / clavier Tactile Tactile / voix Tactile / voix

/ 24

Fonctionnalités

Page 25: Comment concevoir une experience utilisateur cross canal

[email protected]

• Complémentarité– Comment ne pas faire doublon et apporter une nouvelle expérience

encore plus innovante pour mes utilisateurs ?

• Continuité– Comment créer une expérience « sans couture » ?

• Fonctionnalités– Quelles sont les fonctionnalités propres au device qui pourraient

apporter une valeur ajoutée ?

• Le contexte d’utilisation– Quel est le contexte d’utilisation ?

• Spécificité des interactions

• Lieux, interruption de tâches et multi-tâches

• Respect des usages de la plateforme (Guidelines)

/ 25

Contexte d’utilisation

Page 26: Comment concevoir une experience utilisateur cross canal

[email protected] / 26

Contexte d’utilisation : Spécificité des

interactions

Zone de confort :

7/8 mm

– Environ 40 px

Page 27: Comment concevoir une experience utilisateur cross canal

[email protected] / 27

Contexte d’utilisation : Spécificité des

interactions

04/09/2014

Page 28: Comment concevoir une experience utilisateur cross canal

[email protected] / 28

Contexte d’utilisation : Spécificité des

interactions

04/09/2014

Page 29: Comment concevoir une experience utilisateur cross canal

[email protected] / 29

Contexte d’utilisation : Spécificité des

interactionsSource : « The new multi-

screen world » (Google, Ipsos,

and Sterling)

Page 30: Comment concevoir une experience utilisateur cross canal

[email protected] / 30

Page 31: Comment concevoir une experience utilisateur cross canal

[email protected] / 31

Contexte d’utilisation : Interruption de tâches

Page 32: Comment concevoir une experience utilisateur cross canal

[email protected]://dribbble.com/shots/527510-another-app?list=searches&offset=9

Page 33: Comment concevoir une experience utilisateur cross canal

[email protected]

Contexte d’utilisation : respect des guidelines

https://dribbble.com/shots/527510-another-app?list=searches&offset=9

Page 34: Comment concevoir une experience utilisateur cross canal

[email protected]

Google : Don’t use bottom tab bars

/ 34

Page 35: Comment concevoir une experience utilisateur cross canal

[email protected]

Google : Don’t hardcode links to other apps

/ 35

Page 36: Comment concevoir une experience utilisateur cross canal

[email protected]

Google : don’t use labeled back buttons

/ 36

Page 37: Comment concevoir une experience utilisateur cross canal

[email protected]

Google : don’t use right-pointing carets on line items

/ 37

Page 38: Comment concevoir une experience utilisateur cross canal

[email protected]

Google : don’t use right-pointing carets on line items

/ 38

Page 39: Comment concevoir une experience utilisateur cross canal

[email protected]

Smartwatch

/ 39

Info coup d’oeil Interactions

minimales

Page 40: Comment concevoir une experience utilisateur cross canal

[email protected] / 40

Avant de conclure

Page 41: Comment concevoir une experience utilisateur cross canal

[email protected] / 41

Avant de conclure

Page 42: Comment concevoir une experience utilisateur cross canal

[email protected] / 42

Logo google : temps fou pour un élément passant sur X device

Page 43: Comment concevoir une experience utilisateur cross canal

[email protected] / 43

1.4

19

0

2

4

6

8

10

12

14

16

18

20

2013 2018

Avant de conclure

Page 44: Comment concevoir une experience utilisateur cross canal

[email protected] / 44

1.4

19

0

2

4

6

8

10

12

14

16

18

20

2013 2018

Avant de conclure

Prévision d’évolution de marché pour les objets connectés

de 2013 à 2018 (Milliards de dollars US)

Page 45: Comment concevoir une experience utilisateur cross canal

[email protected] / 45

Pour conclure

• Pensez déclinaisons sur multiples supports

• Pensez complémentarité, continuité, fonctionnalités et contexte

• Remettez vous en question et n’oubliez pas que vos utilisateurs utilisent votre service sur tous leurs objets connectés

• Respectez les usages

• Respectez les guidelines constructeurs

• Définissez vos cas d’utilisation par device

Page 46: Comment concevoir une experience utilisateur cross canal

[email protected] / 46

Pour conclure

• Si vous faites un site internet, prévoyez le « tablet friendly »

– Pas de survol

– 40px

• Ayez un coup d’avance, n’hésitez pas à investir des nouveaux devices

– L’intertie en entreprise est longue et vous ne savez pas quel sera le

paysage digital dans 1 ans

• Faites du mobile first ou smartwatch first

• Designez à taille réelle

– Faire des sketch d’interface sur papier ou imprimez les à échelle réelle

pour vous rendre compte

• TESTEZ !!

– (gorilla test, tests utilisateurs, …)

Page 47: Comment concevoir une experience utilisateur cross canal

[email protected]

MERCI DE VOTRE ATTENTION

DES QUESTIONS ?

Axel JOHNSTONDesigner d’expérience utilisateur

Cofondateur d’Akiani

[email protected]

www.akiani.fr