Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

30
Mobile UX WEB vs MOBILE: due esperienze d’uso a confronto

Transcript of Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Page 1: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Mobile UX �WEB vs MOBILE:�due esperienze d’uso a confronto �

Page 2: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

UX per mobile �

ü  Utile �ü  Facile da usare �ü  Desiderabile �

Page 3: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

UTILE: �Che risponda alle esigenze e ai desideri “on the go” di chi lo utilizza.�

COME? OSSERVO LE

PERSONE IN MOBILITA’ PER CAPIRE I LORO

BISOGNI.

Page 4: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

FACILE DA USARE: �Che consenta alle persone di raggiungere i propri obiettivi in modo rapido e immediato.�

COME? PROGETTO PENSANDO

ALLE PERSONE E CONSIDERANDO LE

SPECIFICITA’ DEL MEZZO.

Page 5: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

COME? CREO UN’ESPERIENZA

CONTESTUALE COINVOLGENTE.

DESIDERABILE: �Che l’esperienza offerta generi un effetto positivo in chi la vive, che riesca ad emozionare.�

Page 6: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

… in particolar modo per il MOBILE ...�

FACCIAMO�INNAMORARE LE PERSONE! �

*Osservatorio Mobile Marketing & Service della School of Management del Politecnico di Milano �

1/3 delle app scaricate viene usato per più di

2 volte.*

Page 7: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Web vs Mobile �Le cose cambiano! �

Page 8: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

IL CONTESTO D’USO �E’ differente e variabile nel tempo ...�

Il contesto influenza in

modo significativo i bisogni degli

utenti.

IN ATTESA ALLA FERMATA DELL’AUTOBUS ...

CAMMINANDO VERSO L’UFFICIO ...

FACENDO JOGGING AL PARCO ...

SDRIATO SUL DIVANO DI CASA ...

Page 9: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

IL DEVICE �La modalità d’interazione con l’oggetto.�

UTILIZZO PRINCIPALE “ONE HAND”

DIMENSIONI DELLO SCHERMO RIDOTTE

INTERAZIONE TOUCH

MOLTEPLICI SENSORI E SISTEMI DI INPUT

Page 10: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

LA RELAZIONE �Il rapporto e la vicinanza fisica ed emotiva. �

E’ UN OGGETTO MOLTO PERSONALE

MI IDENTIFICA E MI LOCALIZZA

MI TIENE SEMPRE COLLEGATO

E’ SEMPRE CON ME 24H

Page 11: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

TEMPI D’USO �Durata e continuità nell’utilizzo dell’oggetto.�

Tempo di navigazione

medio via mobile:

UTILIZZO SPOT

ATTIVITA’ DI BREVE DURATA MA FREQUENTI

USO VARIABILE NELL’ARCO DELLA GIORNATA

30 min/dì circa 3 sessioni da 9 min*

*Osservatorio Mobile Marketing & Service della School of Management del Politecnico di Milano �

Page 12: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Discovermobilelife.com�

Page 13: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Cosa significa progettare per il mobile? �

Page 14: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

1.�Osservare i Mobile

users�Imparare a conoscere le persone per cui si sta progettando e coinvolgerle in più momenti nelle fasi di progetto.�

Page 15: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

BEST CASE �Progetto pilota di

Mobile Shopping aSitges (Spagna).�

Sistema di pagamento tramite tecnologia NFC.�sono state raccolte le

opinioni dei clienti dei negozi, tramite questionari e focus

group.

Nei 3 mesi di progetto

Page 16: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

2.�Pensa in grande! �

Gli smartphone attualmente in commercio hanno potenzialità tecniche e prestazionali che consentono davvero di innovare. �

Durante il brainstorming non dar freno

alle idee, anche le più

bizzarre ...

Page 17: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Soffiando nel microfono dell'iPhone e picchiettando sui fori simulati sullo schermo, lo

smartphone diventa sorprendentemente uno

strumento a fiato. ��

1 milione di utenti nel mondo, che condividono

online e con l’iPhone le proprie interpretazioni

musicali.�

Page 18: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

3.�Focalizzati�

Non cercare di fare tutto ... Scegli poche funzionalità e falle bene! �

Img  da  sos:tuire  Centro  del  bersaglio.  

Less is more Non significa impoverire

l’interfaccia ma esaltare le funzioni

chiave.

Page 19: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

SHAZAM �Più di 125 milioni di utilizzatori

al mondo.��

“Shazam believes in creating a magical experience” �

From Shazam website �

BEST CASES�

FOURSQUARE �Oltre 2,5 milioni di check-

in al giorno. �

�Quasi 10 milioni di utenti

iscritti�

Page 20: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

4.�Aiutati con

un user journey�

Descrivi il tuo servizio rispondendo a queste domande: �•  Chi? �•  Dove? �•  Come? �•  Quando? �•  Perchè?�

Page 21: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Tempo e Spazio Introduci queste componenti per

descrivere il funzionamento del

tuo servizio.

Ore 8:30�

Ore 10:30� Ore 13:30�

...�

A casa: �

Arrivato al parcheggio: � Nel suo profilo FB: �

Con l’app: �

Page 22: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

5.�

Il contesto può essere fonte d’informazione rispetto alle esigenze dell’utente, ma anche ambito l’interazione col servizio offerto.�

Pensa al contesto � Img  da  trovare  

Page 23: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

BEST CASES�

Raccogli le informazioni dal contesto in cui si

trova l’utente.�Wordlens. �

Traduttore in tempo reale.�

Offri informazioni che consentano d’interagire con

la realtà.�

Wikitude - Drive. �Navigatore per auto in

realtà aumentata.�

Page 24: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

BEST CASES�

“Indossa” le scarpe prima di acquistarle.�

The Sampler - Converse.�Catalogo in realtà aumentata.�

Page 25: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

6.�

Semplifica le attività richieste all’utente facendo lavorare la tecnologia al suo posto. �

Videocamera, microfono, ma anche bussola o GPS, consentono un dialogo con il dispositivo più semplice, più veloce e che non implichi un'eccessiva attenzione da parte dell’utilizzatore.��

Sfrutta le capacità

del device �

Page 26: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

7.�

L’interaction design di un dispositivo mobile è direttamente legato alla gestualità che si applica all’oggetto.�

Progetta per un device

fisico �

Page 27: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

•  Design Finger Friendly�Gli elementi attivi devono avere una dimensione che si adatti all’interazione touch. �

•  Possibilità d’utilizzo con una o due mani.�A seconda della modalità varia l’area più facilmente “tappabile”. �

Page 28: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

•  Interfaccia touch: l’interazione copre il contenuto! �

a)  Navigazione preferibilmente in basso.�

b)  In alto a destra: azioni che agiscono sulla schermata.�

c)  In alto a sinistra: azioni secondarie non legate al contenuto.�

b�

a�

•  Priorità al contenuto rispetto alla navigazione.�a)  Alberatura piatta. �b)  Contenuti in primo piano.�

c �

Page 29: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

Cosa tenere a mente? �

Page 30: Mobile UX - Web vs. Mobile due esperienze d'uso a confronto

ü Offrire un’esperienza memorabile e contestuale.�

ü Osservare gli utenti in azione. �ü Pensare “in grande”.�ü Focalizzarsi e semplificare.�ü Progettare per un device fisico.�