ergonomia e commercio: ultimo treno

74
KnowCamp 2011 Ergonomia e commercio: lʼultimo treno Nicola Bonora

Upload: mentine

Post on 14-Dec-2014

5.208 views

Category:

Technology


2 download

DESCRIPTION

eCommerce checkout usability: i problemi correlati alla progettazione del processo di checkout. Il caso Trenitalia al KnowCamp (Modena, 8-9 Ottobre 2011).

TRANSCRIPT

Page 1: Ergonomia e Commercio: ultimo treno

KnowCamp 2011

Ergonomia e commercio:lʼultimo treno

Nicola Bonora

Page 2: Ergonomia e Commercio: ultimo treno

Nicola BonoraMENTINE.NET

@nicbonora@mentinet

#kc2011

Page 3: Ergonomia e Commercio: ultimo treno

Romagna miaRomagna in fioreTu sei la terraDel bloggatoreQuanto ti pensoVorrei ceccareOgni tua veniuDentro forsquare

Page 4: Ergonomia e Commercio: ultimo treno

Ergonomia e commercio

Page 5: Ergonomia e Commercio: ultimo treno

Italia 201014,357 mld € e-commerce

+43%

fonte: Casaleggio Associati 2011

Page 6: Ergonomia e Commercio: ultimo treno

E-commerce checkout usabilityBaymard Institute

60% of all e-commerce visitorsabandon their shopping cart. Why?

Page 7: Ergonomia e Commercio: ultimo treno

2010-2011 CC MENTINEse proprio ne volete parlare,

citate la fonte! :D

La clessidra della user experience

Page 8: Ergonomia e Commercio: ultimo treno

explorechoose

decide

purchase

verify

spread TW

satisfyfidelize

2010-2011 CC MENTINEse proprio ne volete parlare,

citate la fonte! :D

Page 9: Ergonomia e Commercio: ultimo treno

2010-2011 CC MENTINEse proprio ne volete parlare,

citate la fonte! :D

La piramide della billing experience

Page 10: Ergonomia e Commercio: ultimo treno

USER EXPERIENCE

BILLING EXPERIENCE

PROSPECT EXPERIENCE

CUSTOMER EXPERIENCE

2010-2011 CC MENTINEse proprio ne volete parlare,

citate la fonte! :D

Page 11: Ergonomia e Commercio: ultimo treno

E-commerce checkout usabilityBaymard Institute

Page 12: Ergonomia e Commercio: ultimo treno

5 uomini

5 donne

20-58 yrs

E-commerce checkout usabilityBaymard Institute

UTENTI10

Page 13: Ergonomia e Commercio: ultimo treno

Data input

Copywriting

Layout

Navigation

Flow

FocusE-commerce checkout usability

Baymard Institute

ASPETTI6

Page 14: Ergonomia e Commercio: ultimo treno

Che compogono una Checkout usability checklist.

3 livelli di gravità (dal warning al fatal)

E-commerce checkout usabilityBaymard Institute

CHECK63POINT

Page 15: Ergonomia e Commercio: ultimo treno

1-800-Flowers, AllPosters, American Apparel, Amnesty Shop, Leviʼs, Walmart, Zappos...

E-commerce checkout usabilityBaymard Institute

SITI WEB15

Page 16: Ergonomia e Commercio: ultimo treno

Problemi correlati alla progettazione del processo di checkout

E-commerce checkout usabilityBaymard Institute

ISSUES520

Page 17: Ergonomia e Commercio: ultimo treno

fonte: Casaleggio Associati 2011

Page 18: Ergonomia e Commercio: ultimo treno
Page 19: Ergonomia e Commercio: ultimo treno

Riscontrati con un test a zero attendibilità.

Quale capitale sta disperdendo questo merchant?

ERORI14

Page 21: Ergonomia e Commercio: ultimo treno
Page 22: Ergonomia e Commercio: ultimo treno

Parental controlEXPLICIT LYRICS!

Page 23: Ergonomia e Commercio: ultimo treno

http://yfrog.com/z/ny94ggtj

Love brand...

Page 24: Ergonomia e Commercio: ultimo treno

Organico.

Page 25: Ergonomia e Commercio: ultimo treno

Organico motivato.

Page 26: Ergonomia e Commercio: ultimo treno

Responsabilità sociale

Page 27: Ergonomia e Commercio: ultimo treno

Ti odio poi ti odio poi ti odio

Page 28: Ergonomia e Commercio: ultimo treno

Sodomia binaria

Page 29: Ergonomia e Commercio: ultimo treno

Augh.

Page 30: Ergonomia e Commercio: ultimo treno

Moretti, fallo per i nostri figli

Page 31: Ergonomia e Commercio: ultimo treno

Internescional!

Page 32: Ergonomia e Commercio: ultimo treno

Guarda cosa dicono in Giappone

Page 33: Ergonomia e Commercio: ultimo treno

Rimango.

Page 34: Ergonomia e Commercio: ultimo treno

Inseguire il tuo profilo con un dito.

Page 35: Ergonomia e Commercio: ultimo treno

Auguri incondizionati.

Page 36: Ergonomia e Commercio: ultimo treno
Page 37: Ergonomia e Commercio: ultimo treno
Page 38: Ergonomia e Commercio: ultimo treno

Identity

Page 39: Ergonomia e Commercio: ultimo treno
Page 40: Ergonomia e Commercio: ultimo treno
Page 41: Ergonomia e Commercio: ultimo treno

Primary action

*

* * * * * *

Page 42: Ergonomia e Commercio: ultimo treno

no link a home...

Error messages

Page 43: Ergonomia e Commercio: ultimo treno

Intermodalità: nel sito di Trenitaliaci puoi parcheggiare un autobus

Layout/readability

Page 44: Ergonomia e Commercio: ultimo treno

sinistra (32)

destra (21)

alto (22)

alto bold (14)http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php

Page 45: Ergonomia e Commercio: ultimo treno

Focus

Page 46: Ergonomia e Commercio: ultimo treno

Flow

Page 47: Ergonomia e Commercio: ultimo treno

I dati mancanti sono sopra la piega.

The fold

Page 48: Ergonomia e Commercio: ultimo treno

e adesso?

Flow

Page 49: Ergonomia e Commercio: ultimo treno
Page 50: Ergonomia e Commercio: ultimo treno

Reinserimento totale

Feedback

Page 51: Ergonomia e Commercio: ultimo treno

Standard

Page 52: Ergonomia e Commercio: ultimo treno
Page 53: Ergonomia e Commercio: ultimo treno

Function

Page 54: Ergonomia e Commercio: ultimo treno

Sempre meglio il software che i binari.

Page 55: Ergonomia e Commercio: ultimo treno
Page 56: Ergonomia e Commercio: ultimo treno
Page 57: Ergonomia e Commercio: ultimo treno
Page 58: Ergonomia e Commercio: ultimo treno

Lʼansia da click è schiacciante: cosa mi aspetta se faccio click?

La sindrome dellʼend user: “Sto sbagliando”.UX fail.

Pain

Page 59: Ergonomia e Commercio: ultimo treno

explorechoose

decide

purchase

verify

spread TW

satisfyfidelize

2010-2011 CC MENTINEse proprio ne volete parlare,

citate la fonte! :D

Page 60: Ergonomia e Commercio: ultimo treno

47 - Your checkout process should be linear

4 - Preserve all customer input despite errors in the form

27 - Use a primary button for the primary action

42 - Process steps should be links

3 indicate required and optional fields

7 Validate form fields inline

24 Use clear error indications

26 Only use one column for form fields

28 Curate the options you present during checkout

30 Reinforce all sensitive fields on the payment page

31 Use font-sizes to indicate the hierarchy in text

32 Have few things surrounding your checkout

33 Show a sensible amount of form fields

35 How and where to place the primary button

36 Hide navigation during checkout

43 Clearly show the different steps during checkout

44 Primary action / input should be above the fold

46 Add visual indicators and feedback to all actionable elements on the page

51 Apply changes immediately and near the input

56 Donʼt require seemingly unnecessary information

57 Only show options that are meaningful to the current

Page 61: Ergonomia e Commercio: ultimo treno

Riscontrati con un test a zero attendibilità.

Quale capitale sta disperdendo questo merchant?

CHKPOINT21

NESSUNO.

Page 62: Ergonomia e Commercio: ultimo treno

PHICO!

Communication...

Page 63: Ergonomia e Commercio: ultimo treno

25% delle voci di menusbagliate...

Page 64: Ergonomia e Commercio: ultimo treno

Learned lessons(tutte twittabili)

Page 65: Ergonomia e Commercio: ultimo treno

Nella Savana del libero mercato, Trenitalia sarebbe una gazzella. Zoppa.

Page 66: Ergonomia e Commercio: ultimo treno

In regime di monopolio, lʼutente paga in termini di qualità del servizio, tempo speso per ottenerlo, prezzo e salute mentale.

Page 67: Ergonomia e Commercio: ultimo treno

“Come può il Web, come fonte di informazione e strumento di partecipazione, renderci più responsabili e consapevoli nella creazione e nella diffusione di notizie ed opinioni?”

(KnowCamp.it)

Page 68: Ergonomia e Commercio: ultimo treno

Condivisione.Informazione.Conversazione.Sputtanamento.

Page 70: Ergonomia e Commercio: ultimo treno

Consiglio a trenitalia.com:

Page 71: Ergonomia e Commercio: ultimo treno
Page 72: Ergonomia e Commercio: ultimo treno
Page 73: Ergonomia e Commercio: ultimo treno

Se vi è piaciuto, ditelo ai vostri

amici!

Se non vi è piaciuto, ditelo a

@mentinet

Page 74: Ergonomia e Commercio: ultimo treno

Nicola Bonora

Quando cʼero io, i treni arrivavano in orario.