Dimensione mobile

In uno scenario ad alta competitività come quello del mercato digitale, un’applicazione mobile che semplicemente funzioni non è più sufficiente per conquistare il pubblico e mantenerlo. E’ necessario infatti progettare esperienze mobile semplici, veloci, piacevoli e affidabili. Per raggiungere questo obiettivo è indispensabile, oltre la conoscenza e l’applicazione dei principi di design, la comprensione dei seguenti fattori:

• come gli utenti usano lo smartphone da un punto di vista ergonomico,
• per quali attività lo usano,
• in quale contesto,
• quali esperienze considerano positive, soddisfacenti e quali frustranti.

Da qui derivano le best practice e guidelines per realizzare un’applicazione di successo. Vediamone alcune.

Mobile vs desktop

Prima di tutto per una comprensione approfondita di come gli utenti utilizzano lo smartphone, può convenire  fare un confronto con il desktop. Quando utilizziamo il PC, di solito siamo comodamente seduti a una scrivania, davanti ad uno schermo mediamente grande ed interagiamo con la tastiera e il mouse; quindi presumibilmente siamo focalizzati su ciò che stiamo facendo e possiamo navigare senza problemi grazie a una rete e una batteria stabili.

Elaine McVicar

Lo scenario mobile è molto diverso. Prima di tutto è caratterizzato da uno schermo molto più piccolo, “navighiamo” con le dita, la rete può essere discontinua e, come ben sappiamo, la batteria ci può mollare in qualsiasi momento.
Inoltre quando usiamo lo smartphone ci possiamo trovare in qualsiasi contesto, le sessioni  di “navigazione” possono essere brevi, interrotte di frequente: per questo motivo l’attenzione degli utenti è frammentata e le condizioni di visualizzazione e interazione sono più difficili.

Luke W. ha definito questa condizione “one thumb, one eyeball”

In queste condizioni la strategia di design da seguire è la seguente:

• Mostrare solo i dati e le funzionalità essenziali
• Semplificare al massimo tasks e interazioni.
• Predisporre dei sistemi per cui sia facile riprendere le attività dove sono state interrotte
• Possibilità di ritornare su contenuti visualizzati in precedenza (history).

Healthy App: history

Inoltre è necessario trovare il giusto compromesso tra la grande quantità di contenuti che dobbiamo inserire nelle interfacce (si pensi ad esempio agli store Amazon, Yoox ecc… ) e il poco spazio che abbiamo a disposizione sullo schermo dello smartphone.
Una buona strategia sta nell’utilizzo delle “card”: piccoli “contenitori” di informazioni costituiti da un titolo, un’immagine e a volte poche righe di testo che costituiscono i “punti di entrata” (entry point) verso informazioni più dettagliate.
In questo modo l’utente percepisce la qualità e la quantità delle informazioni e al tempo stesso ha la possibilità di visualizzare ulteriori dettagli solo se interessato, il tutto in modo intuitivo e veloce.

Nick Babich

Questione di pollice

Dal modo in cui teniamo in mano lo smartphone e con quali dita interagiamo con esso, derivano le best practices su dove posizionare le call to action più importanti e le indicazioni su quale tipologia di navigazione scegliere.

Luke W.

Una delle tante ricerche condotta ormai qualche anno fa da Steven Hoober che, insieme ad altri ricercatori, osservò all’incirca un migliaio di persone mentre utilizzavano i loro smartphone per strada, negli aeroporti, alle fermate degli autobus, nei bar, sui treni e autobus, emerse che la maggior parte degli utenti utilizza lo smartphone tenendolo con una sola mano e navigando lo schermo con il pollice. (How Do Users Really Hold Mobile Devices?).

Dai risultati  di questa e di altre ricerche simili, emerge quindi che è necessario posizionare le call to action più importanti e frequenti
•    nella parte inferiore dello schermo: tale area è infatti più facilmente raggiungibile con il pollice per utenti che navigano con una sola mano;
•    a sinistra (a favore della maggioranza degli utenti che sono destrorsi)

Luke W.

Il modello di navigazione che rispetta queste linee guida è chiamato combo navigation, esso costituisce un buon compromesso tra l’esigenza di mostrare le voci di menu e la limitata grandezza dello schermo: sono mostrate in modo visibile e permanente le voci di menu principali e le altre, secondarie, sono accessibili tramite un‘icona specifica (come l’hamburger icon).

Facebook Bottom Tab iOS

Touch screen

Infine il Touch screen  comporta un’attenta valutazione e conoscenza dei seguenti elementi:

•    Gesture
•    Touch target area
•    Typing

Gesture
Le gesture costituiscono la modalità di interazione per eccellenza con il touchscreen, permettendo di interagire con gli elementi della interfaccia e sostituendo i classici elementi di UI (user interface) come i pulsanti. Uno dei motivi principali per cui i controlli gestuali sembrano così naturali e intuitivi è perché riproducono l’interazione con un oggetto reale.
Le gesture hanno indubbi vantaggi sull’esperienza d’uso poichè, liberando lo spazio dai pulsanti, permettono di creare delle interfacce più concentrate sui contenuti e rendono l’interazione più intuitiva e divertente. La criticità delle gesture sta nella loro discoverability e learnability: uno dei maggiori svantaggi nell’utilizzo delle gesture risiede nel fatto che le gesture sono “nascoste” e quindi l’utente deve ogni volta “scoprire” quali sono i gesti corretti per navigare i contenuti, ricaricare una pagina, eliminare un elemento ecc…
Per questo motivo quando “disegnamo le gesture” è importante:
•    usare gesture convenzionali cioè già utilizzate in altre app e quindi conosciute come tap, swipe, double tap, pinch.
•    usare walkthrough o animazioni per spiegare quali gesture sono impiegate nella app

Luke W.

Touch target area
Per una corretta interazione con il touchscreen è necessario inoltre creare le aree interattive (touch target area) sufficientemente grandi da essere appunto “attivate” con le dita e lasciare dello spazio tra una touch target area ed un’altra  per non rischiare che utente tocchi più aree sensibili contemporaneamente.
Più le touch target area sono grandi più diminuisce la probabilità che utente commetta un errore navigando l’interfaccia.

Typing

Scrivere sui touch screen è considerato dagli utenti un task fastidioso ed è infatti una delle criticità più grandi dal punto di vista della di usabilità:  poichè i tasti sono piccoli e ravvicinati è molto probabile commettere degli errori di digitazione e la nostra attenzione quando digitiamo si sposta di continuo dalla tastiera allo schermo per controllare se quello che abbiamo scritto è corretto.

Ecco quali linee guida seguire per offrire user experience soddisfacente evitando le frustrazioni:

Nick Babich

• Chiedere solo i dati che effettivamente servono o rimandare al sito sul desktop per inserirli se sono effettivamente necessari
• Memorizzare i dati che l’utente ha già inserito in precedenza per non farli riscrivere ogni volta
• Far apparire la keyboard giusta: alfabetica o numerica a seconda del contesto in cui ci si trova
• Dividere in piu step i form lunghi. É importante che l’utente focalizzi la sua attenzione su uno step alla volta
• Inserire una status bar per comunicare quanto manca al compimento di un task, questo tranquillizza l’utente sul fatto che sta procedendo in modo corretto e gli dà un senso di soddisfazione

**********************

Vuoi migliorare la UX/UI del tuo sito web, ecommerce, app, software?

Costanza Mosi
UX Designer
LinkedIn