Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Dai Canali al web: progettare interfacce efficaci per Wii

Migliorare la user experience di chi naviga sulla nuova e rivoluzionaria console di Nintendo
Migliorare la user experience di chi naviga sulla nuova e rivoluzionaria console di Nintendo
Link copiato negli appunti

Il successo planetario di Nintendo Wii e le previsioni di diffusione inducono tutti i progettisti di servizi web ad affrontare con impegno la progettazione di siti Wii compatibili. Per quanto le esperienze di progetti web per Wii siano in aumento esponenziale e si possano identificare già delle best practises in tale senso, è lo stesso software della console e la GUI dei canali tematici che danno ai progettisti web le migliori indicazioni su come realizzare interfacce usabili in grado di garantire un'ottima user experience. Vediamo, analizzando alcuni canali Wii e il Browser Opera, quali linee guida di web e Interaction Design si possono trarre.

L'interazione prima di tutto

La prima impressione che chiunque utilizzi i canali Wii o il Browser Opera ha è di estrema semplicità di utilizzo delle funzioni dei software impiegati. L'utilizzo di una simbologia grafica decisamente intuitiva e la presenza di elementi dell'interfaccia che, per quanto possano sembrare a volte talmente semplici da risultare quasi infantili, rendono praticamente impossibile "perdersi" nella navigazione, sono tra gli elementi che devono essere mantenuti anche quando si accede ai siti web ottimizzati per Wii.

La maggiore attenzione prestata all'interazione con l'utente piuttosto che alla grafica fine a se stessa, permette infatti di realizzare sistemi di comunicazione e servizi che vengono utilizzati "senza pensare", rendendo così estremamente piacevole l'esplorazione delle pagine web o dei canali tematici e facendo passare quasi inosservata la bassa risoluzione del video.

Figura 1 - Schermata dal Canale Sondaggi
Canale sondaggi

L'immagine aiuta a individuare alcuni degli accorgimenti che permettono di ottenere un effetto così naturale e piacevole durante la navigazione all'interno del canale dei sondaggi via internet di Wii. Innanzi tutto, la leggibilità dei contenuti, che adottano caratteri cromaticamente contrastanti e hanno font di dimensioni molto più grandi rispetto a quelli a cui siamo abituati su PC o palmari, rendono molto semplice la percezione dei contenuti testuali, anche a grande distanza dalla TV. La presenza di pochissimi oggetti di interazione e la chiusura grafica degli spazi nei quali sono raccolti (per esempio, l'elenco dei sondaggi e i tasti per scorrere tra le pagine dell'elenco stesso sono collocati su una superficie di un colore definito che permette di percepirli come un aggregato omogeneo di contenuti e funzioni) fanno sì che l'utente sappia sempre come agire e attivare le funzionalità di navigazione.

L'impiego, per finire, di una simbologia davvero elementare che rappresenta un codice linguistico che, se non si può considerare totalmente autoesplicativo, si rivela nella sua semplicità dopo pochi clic, permette di ottenere una user experience di straordinaria efficacia. Non bisogna inoltre dimenticare che l'impiego di animazioni rapide e di grafica basata su transizioni e scorrimenti molto fluidi supportati, per di più, da effetti sonori sempre discreti e dalla leggera vibrazione del WiiMote attivata dallo spostamento del cursore sui tasti, fanno parte integrante di un'esperienza di navigazione che deve considerarsi a tutti gli effetti multisensoriale.

Veicolare i contenuti

Altro elemento fortemente distintivo delle interfacce pensate da Nintendo per i canali tematici è la forma grafica adottata per presentare i contenuti. Vista la difficoltà di visualizzare testi lunghi, l'impiego di sistemi grafici che consentono di veicolare grandi quantità di informazioni in poco tempo e, per di più, occupando anche spazi sullo schermo ben inferiori a quelli richiesti dal testo, è un'ottima soluzione in termini sia di immediatezza della comunicazione sia per quanto concerne l'impatto emotivo.

Figura 2 - Schermata dal Canale Sondaggi
Canale sondaggi

Una semplice considerazione relativa alla ripartizione degli spazi di questa schermata aiuta a comprendere quanta importanza venga riservata all'interazione con l'utente rispetto alla quantità dei contenuti visualizzabili. La pagina è divisa in due parti di proporzioni quasi equivalenti: a sinistra vi è il sistema di "navigazione emotiva" (costituito dai personaggi del quale stiamo visualizzando il profilo) e sulla destra vi è il pannello che riporta il profilo del personaggio selezionato.

All'interno del profilo, vi è un schematizzazione grafica della personalità. Il pannello del profilo riporta in grande evidenza anche elementi di interazione (tasti di scorrimento) e una titolazione che, nel complesso, portano via circa un terzo dello spazio del pannello. In totale, quindi, alle informazioni è riservata una porzione di schermo di circa un quarto della superficie totale, con una quantità di testo che probabilmente non supera gli 80 caratteri complessivi e che, a ben vedere, utilizza solo parole solo nei casi in cui una simbologia grafica alternativa sarebbe stata poco intuitiva. Navigando nel pannello e visualizzando le altre schermate del profilo si possono tuttavia accedere a numerose informazioni, facilmente accessibili e comprensibili.

Il browser Opera

Possibilità di impiegare un solo tasto per volta, spazio di visualizzazione dei contenuti molto ristretto, risoluzione così bassa da rendere impossibile nella pratica l'inserimento di testi ed elementi grafici di piccoli dimensioni nonostante in sistema di zoom. Insomma, sembrerebbe che date queste limitazioni, progettare un servizio web fruibile attraverso il browser Opera della Wii sia una missione impossibile. In realtà se si applicano ai siti web le stesse linee guida indicate nelle righe precedenti e già adottate dai designer dei canali tematici di Wii, si possono ottenere risultati di grande efficacia. Vediamo, per esempio, come siti appositamente pensati per la navigazione tramite il browser Opera per Wii come FineTune e WiiMinder riescano a sfruttare al meglio le potenzialità del sistema grazie a un'interfaccia in perfetto stile Wii.

Figura 3 - Schermata dal sito FineTune
Schermata dal sito FineTune

La scelta di FineTune di avvalersi di un'interfaccia realizzata totalmente in Flash sembra particolarmente felice, proprio perché in questo modo si riescono a ottenere quelle transizioni fluide e scorrevoli che contraddistinguono le interfacce dei canali Wii e, data la natura vettoriale dei filmati Flash, è anche automaticamente adattabile ai formati TV 4/3 o 16/9 a fronte di una deformazione che risulta quasi sempre accettabile quando si utilizzano elementi grafici di grandi dimensioni.

È subito evidente come l'intero schermo sia occupato da un sistema totalmente grafico per la navigazione tra i brani musicali ascoltabili, mentre le informazioni testuali presenti - altro ottimo esempio di utilizzo di font e colori per gli elementi testuali – non sono legate alla navigazione ma sono solo riferimenti di supporto da leggere come didascalie della grafica. In alto a destra sono sempre presenti i tasti per saltare tra le diverse funzionalità del sito che, come codici linguistici iconici decisamente intuitivi, sembrano incarnare perfettamente lo stile Wii.

Figura 4 - Schermata dal sito Wiiminder
Schermata dal sito Wiiminder

Tra le numerose soluzioni intelligenti adottate da WiiMinder, portale che nasce appositamente per superare alcuni limiti funzionali del browser Opera per Wii, spicca per efficacia l'utilizzo di un sistema di scorrimento testuale che sfrutta il pratico scroll del browser Opera attivabile utilizzando il tasto B (il "grilletto") del WiiMote e trascinando il cursore. La soluzione impiegata è molto interessante per due motivi: da un lato i testi sono scritti con un carattere talmente grande da rendere non indispensabile l'impiego dello zoom che, se è spesso utilissimo per leggere testi dei siti standard, risulta tuttavia pesante da usare in fase di navigazione delle pagine. Dall'altro lo scroll è limitato al movimento verticale, eliminando spostamenti laterali che riducono la visualizzazione delle pagine a qualcosa di paragonabile alla continua ricerca dei pezzi di un puzzle.

A differenza dei siti tradizionali provvisti di barra di scorrimento verticale che risulta molto difficile da utilizzare con il puntatore del WiiMote, l'elenco dei siti preferiti reso disponibile da WiiMinder è facilissimo da scorrere e i link, per la loro grandezza, cliccabili senza errori al primo tentativo. L'esempio dello scroll verticale a pieno schermo è facilmente replicabile anche per la visualizzazione di testi lunghi, anche qualora si decida di realizzare un sito con normale HTML e fogli di stile e non in Flash.

Gli spunti che si possono trarre dalla navigazione e dallo studio dei diversi canali già presenti nella console di Nintendo e da quelli che, verosimilmente, verranno aggiunti nei prossimi mesi, permettono al progettista di servizi on-line di realizzare applicazioni o sistemi di comunicazione via internet che, forse per la prima volta, possono considerarsi accessibili a tutti, anche a chi non ha mai acceso un computer o aperto un browser. Dedicando la necessaria attenzione alle interfacce e allo studio dell'interazione con l'utente, con competenze tecniche del tutto analoghe a quelle necessarie per realizzare un normale sito web si possono così creare delle vere e proprie applicazioni web per la TV.

Daniele Cerra è giornalista pubblicista, Content Manager, Progettista e-learning e Concept Designer. Il suo sito personale è http://www.danielecerra.it

Ti consigliamo anche