*Ma mère s'achète un ordinateur!* J'ai récemment aidé ma mère à acheter un ordinateur sur le site web d'Apple. L'expérience d’achat était presque parfaite. Le site est organisé et il y a tous les renseignements nécessaires pour comparer les ordinateurs entre eux. On y trouve de grandes images de produits accompagnées d'informations complètes pour l'aider à choisir ce qui correspond le plus à ses besoins. En plus de ça, l'outil de configuration de l’ordinateur est excellent, car chacune des options est expliquée de façon claire. Ce qui est un excellent exemple de design poli! Ma mère n'avait finalement pas tant besoin de moi! *Apple a du travail à faire* Vous aurez noté, je dis que l'expérience était «presque» parfaite. Prête à payer, la facture ne lui indiquait aucun total incluant les taxes. Ma mère allait donc autoriser un achat d'un montant inconnu, ce qui équivaut à la signature d’un chèque en blanc! Elle m'a demandé pourquoi ça fonctionnait comme ça. Ayant travaillé chez Apple quelque temps, j'ai eu à répondre des dizaines de fois à cette question: «Parce que le système fonctionne comme ça» Ma mère, l'utilisatrice du site, celle qui pèse sur le bouton « acheter », elle s'en fout du système! S'il y a une contrainte technique, elle n’en a aucune idée, ne le comprend pas et, très honnêtement, elle ne veut pas le savoir. Elle souhaite simplement obtenir le prix total de son achat avant d'en autoriser la transaction. *Les erreurs à ne pas commettre* Cette situation illustre parfaitement trois des sept erreurs majeures qui peuvent être commises sur un site de commerce électronique. En voici la liste : - Sentiment d'insécurité lors du processus d'achat. - Les buts et tâches peu explicites. - Démarche transactionnelle complexe. - Défaillance de l'architecture d'information. - Incohérence dans les différentes parties du site. - Manque d'information pour compléter l'achat. - Gestion des erreurs déficiente. Il est important de mentionner que ces erreurs pourraient pratiquement toutes être évitées si l'utilisateur était considéré comme un être humain et non pas comme un robot. Vous croyez savoir faire la différence? Et vous, avez-vous des exemples de sites de commerce électronique qui commettent une de ces sept erreurs? Voici une présentation que j'ai donnée sur le sujet lors du Montréal eCommerce Meetup du 28 février 2013 à la Maison Notman

1. SatisfactionLa différence entre
les Robots et les Humains.
@CynthiaSavard
CYNTHIA SAVARD SAUCIER
Designer d’expérience utilisateur
@TP1

2. Quelle est la différence
entre les Robots et les
Humains?

3. Robotsaiment l’efficacité,
Humains
préfèrent la politesse.
Différence n° 1
Les
les

4. La politesse dans le design?
Mr. Clippy

5. - Clippy croyait savoir ce que vous vouliez faire;
- il surveillait vos actions, mais ne se souvenait pas de vos préférences;
- même si vous lui disiez de partir, il revenait sans cesse.
Clippy n’était pas poli :

6. Mr.Clippyétaitunteléchecqueson
retraitfaisaitpartiedu
PITCH DE VENTE
Malgré
de Microsoft XP.
25 000 heures
de test utilisateurs,
Whitworth, B., 2005

7. 1. Demander la permission avant de réaliser une tâche;
2. Offrir des choix aux utilisateurs;
3. Expliquer ces options;
4. Respecter le choix final de l’utilisateur.
Ce qu’il faut plutôt faire :

8. Robotsn’en ont pas.
Humains
ont des genres,
Différence n° 2
Les
les

9. design pour les femmes.
Vous devriez donc considérer le

10. Parce que la femme est la CEO de sa famille.
Pourquoi?

11. Elle est responsable de 58 % des achats en ligne et de
80 % des achats de produits.
En tant que CEO,
She-conomy.com 2009

12. Malgré cela...
des femmes disent que les manufacturiers de biens
électroniques les avaient en tête lors de la conception.1 %
croient que les marques les considèrent seulement
pour les produits de beauté et de nettoyage.
Consumer Electronics Association (CEA)
71 %

13. D’où certaines
catastrophes :
Un crayon pour les femmes, enfin!

14. Et en technologies :

15. Tech tips?
- Trouver des recettes;
- compter mes calories;
- guider ma méditation...
Wow! ils ont si bien compris!

16. 1. Utiliser des présences humaines au lieu de textes;
2. Contextualiser le produit dans un scénario au lieu de faire une
liste de caractéristiques;
3. Proposer différents types de navigation
(produits reliés, favoris,sélections, etc.)
Comment parler aux femmes alors?

17. La femme est elle à l’extérieur de la maison?
Joue-t-elle un autre rôle que celui de « maman »?
Est-ce qu’elle ne fait pas de yoga?
Est-ce qu’elle ne mange pas de la salade ou du yogourt?
test Buchannan.
Félicitations!
... et essayer le

18. Attention! Ceci ne représente pas la réalité.
Je ne suis pas capable de faire ça.

19. Robotsaiment les systèmes et les
règles.
Humains
sont irrationnels et ne
comprennent pas les sytèmes.
Différence n° 3
Les
Les

20. le site de commerce électronique
ne comprend pas pourquoi
PARFAIT.
L’utilisateur
n’est pas

21. Les 100 sites les plus
lucratifs
ont été étudiés.
par Smashing Magazine

22. 5 ÉTAPES
dans le processus d’achat.
Enmoyenne, ilya
(mais vous pouvez en avoir de 4 à 8 sans trop affecter l’utilisabilité de votre processus.)

23. des compagnies pensent
que leur infolettre est
Aujourd’hui,
INCONTOURNABLE!
81 %

24. obligent les clients à se
créer un compte.
24%
Pouvez-vous imaginer la serveuse du McDonald
demander votre mot de passe avant de vous donner vos croquettes de poulet?

25. La raison souvent utilisée pour expliquer cela est :
«Parce que le système fonctionne comme ça.»
demandent de remplir
la même information 2 fois.
50%

26. Je viens de vous donner mon courriel!

27. Robotsse contentent
de muffins,
Humainsadorent les
cupcakes.
Différence n° 4
Les
Les

28. connexion émotionnelle.
Ça ne dérange pas
si ça prend plus de temps;
si ça coûte plus cher;
si c’est moins efficace.
Tant et aussi longtemps
que l’expérience crée une

29. 1. La surprise;
2. Les éléments qui captent l’attention;
3. Le divertissement;
4. Le « cute » .
Les connecteurs émotionnels :

30. Comic Sans
n’est pas « divertissant ».
#JeudiConfesison : j’ai toujours rêvé d’utiliser
comic sans dans une conférence

31. designémotionnellement
intelligent
Deux connecteurs émotionnels utilisés =

32. www.apple.com/mac-pro/ Allez l’essayer!

33. http://mv.mu/
Plus d’argent, plus de danse!

34. Jouez au Tic-Tac-Toe
pendant l’attente!

35. Mon préféré, le bonhomme devient triste
quand on change pour comic sans!
Skype

36. Souvenez-vous,
les humains sont des utilisateurs irrationnels et émotifs.

37. Merci!

38. Références
Polite design :
Whitworth,B.,2005,Polite Computing,October,Behaviour & Information
Technology. vol. 24,no. 5,September,p353 – 363 Presentation
Clippy :
http://infinitevishal.wordpress.com/2010/08/06/the-other-side-of-microsoft-clippy/
http://robotzeitgeist.com/tag/clippy
Design pour les femmes :
http://marketingtowomenonline.typepad.com/blog/website-design-for-women/
consumer electronics Association (CEA)
She-conomy.com 2009
Femmes :
http://chapters.aiga.org/resources/content/8/6/3/8/documents/
Erica_Eden_presentation.pdf
Parler aux femmes :
http://marketingtowomenonline.typepad.com/blog/website-design-for-women/
http://scienceatlantic.ca/wp-content/uploads/2012/05/2012-Psychology-
Conference-Program.pdf
http://copernicusconsulting.net/designing-for-women-using-archetypes-not-
stereotypes/
Commerce électronique Smashing magazine :
http://uxdesign.smashingmagazine.com/2012/09/04/
the-state-of-e-commerce-checkout-design-2012/
http://baymard.com/checkout-usability/benchmark
Examples :
Apple http://www.apple.com/mac-pro
Donation Mr Valaire: http://mv.mu/
Tic Tac Toe: http://littlebigdetails.com/
Toutes les images viennent de ces trois merveilleux
films d’animation :
http://vimeo.com/17477384
http://vimeo.com/39864844
http://vimeo.com/34512434