22 febbraio 2011

Un’interfaccia scalabile - come regolarla ?

In un recente post di JP si era parlato di interfacce web, di scalabilità e di graceful degradation dell’interfaccia utente in base al tipo di dispositivo usato come client.

Di norma questa scalabilità è automatica e viene determinata in base allo user agent e altre caratteristiche del browser usato come client. Ma l’automatismo potrebbe facilmente ‘sbagliare’ target, magari riconoscendo come cellulare un tablet che avrebbe tutte le caratteristiche per poter mostrare un’interfaccia completa.

Di norma molti siti web danno comunque la possibilità di scegliere tra una versione mobile/standard. Ma è sufficiente ?

In un commento al post di cui sopra, pensando alla possibilità di una scelta da parte dell’utente del livello di scaling dell’interfaccia, mi ero arrischiato a pormi la domanda: esiste una UI standard per scegliere il livello di dettaglio dell’interfaccia di un sito ?

1. Un tuning preciso


Oltre alla classica scelta della visione mobile/standard, possiamo prendere ad esempio qualche interfaccia usata per il tuning del livello di dettaglio di una applicazione.

Il target è sicuramente quello dei videogiochi.

userinterfaccia-tuning-ui-4

Beh, non vogliamo proprio una ‘roba’ di questo tipo. Sicuramente ci sono videogiochi che forniscono una buona ‘user experience’ anche quando si va a regolare la risoluzione video e il rendering 3D.

userinterfaccia-tuning-ui-3

Andiamo meglio ? Pagine per separare gli argomenti, lista di opzioni, niente controlli popup ma scelte abbastanza leggibili che possono essere selezionate tramite bottoni DX/SX.

Notare il pulsante ‘Reset to Defaults’, che permette all’utente di tornare ad una situazione normale dopo aver pasticciato troppo con i settaggi.

Ecco un esempio molto simile.

userinterfaccia-tuning-ui-2

I princìpi sono gli stessi. Lista di opzioni, scelte non illimitate ma facili da comprendere.

Queste interfacce permettono un tuning abbastanza preciso del livello di dettaglio di una applicazione grafica. Ma in certi casi sono fin troppo. Un utente smaliziato trova pane per i propri denti, ma l’utente ‘casuale’ non è in grado di fare certe scelte e si trova spaesato.

C’è una alternativa più semplice, anche se meno precisa ?

2. Scalare il livello di dettaglio


E’ possibile semplicemente lasciare all’utente la possibilità di scalare il livello di dettaglio.

Come fanno gli ‘explorer’ di risorse e file di praticamente tutti i sistemi operativi moderni, nei quali è possibile determinare il livello di ‘zoom’ con cui vengono mostrati i file.

userinterfaccia-tuning-ui-1

Questo tipo di interfaccia sicuramente non è dettagliato né preciso, ma è facile da comprendere. Nel nostro caso lo slider si dovrebbe muovere tra ‘light’ (contenuti in solo testo, versione mobile) a ‘detailed’ (sito completo).

userinterfaccia-ui-scaling-schema-2

Peccato che l’uso di uno slide basato puramente su un asse dedicato al ‘livello di dettaglio’ non ci permetta di cambiare alcuni parametri come il tipo di input (touch, mouse, remote control).

3. Scegliere dei set di impostazioni


Per mantenere la scelta semplice e al tempo stesso abbastanza differenziata sul dispositivo, perché non ipotizzare la scelta di ‘set’ di impostazioni dedicate ai dispositivi client più diffusi ?

L’utente, potendo scegliere tra ‘laptop’, ‘smartphone’, ‘tablet’ e ‘tv / media center’ potrebbe non solo scalare il livello di dettaglio grafico, ma anche scegliere il tipo di input. Possibilmente senza addentrarsi nel setup ‘avanzato’.

L’interfaccia può essere rappresentata da banali ‘icone’ da selezionare. Ogni icona rappresenta un insieme di impostazioni predefinite dedicate allo specifico ‘set’, magari modificabile in seguito.

userinterfaccia-ui-scaling-schema


La soluzione ideale ?


Probabilmente la soluzione ideale rappresenta un mix delle tre soluzioni proposte:
  • Setup dettagliato (più controllo, difficile).
  • Slider del dettaglio (meno controllo, facile).
  • Setup predefiniti (meno controllo, facile).
Non è impossibile pensare ad una combinazione dell’interfaccia ‘difficile’ insieme ad una delle due soluzioni ‘facili’.

La vera domanda è: vale la pena investire in un controllo più approfondito da parte dell’utente ? O l’applicazione deve sempre scegliere in automatico ?

Qual è secondo voi, la migliore user experience ?

2 commenti:

  1. Post eccellente!

    Concordo sull'idea delle icone-profilo (__preset__): sono quanto di più semplice un utente medio possa comprendere ed utilizzare. Al massimo, per gli utenti avanzati, si può accedere ad un pannello delle impostazioni dettagliato, ma non troppo. L'utente, smaliziato o meno, non deve perdere più tempo a configurare un programma che ad usarlo davvero. Per quello prediligo le interfacce che scalano e, al massimo, richiedono una personalizzazione fine e successiva da parte dell'utente.

    Ciao! ^^

    JP

    RispondiElimina
  2. Ciao @rejex !

    Quello che dici è molto importante: non si può far perdere troppo tempo all'utente nel configurare la propria applicazione. Meglio usarla. In questo caso occorre che tutto sia molto molto semplice.

    (questo mi fa venire in mente un altro mini post)

    RispondiElimina

Perchè non lasciare un commento intelligente ? Si accetta di tutto a parte lo spam e le volgarità ..