Oggi, disegnare per il web richiede la conoscenza e la capacità di sfruttare i principi di information design sperimentati, incrementando al contempo la quantità di componenti interattivi e sociali offerti ai fruitori del nostro sito.

Don't Make Me Think - Copertina del libro editata da Robin Good - Photo credit del Libro: Steve Krug - Amazon

L'onda del Web 2.0 ha portato innovazioni apparentemente significative sottoforma di angoli smussati, colori pastello, spettacolari pulsanti 3D, effetti riflesso, caption di testo e molti altri elementi che i designer hanno rapidamente adottato e fatto propri, dando così al web 2.0 un miglior impatto grafico ed una maggiore leggibilità.

Ma la linea di demarcazione fra questi piccoli elementi 2.0 e le vere innovazioni in termini di design, è la capacità degli architetti dell'informazione e dei web designer di orchestrare con sapienza le molteplici forme di interazione che le tecnologie e i servizi web 2.0 sono oggi in grado di offrire; navigazione multi dimensionale, social bookmarking, ricerche di comunità, raccomandazioni dei lettori e commenti, contenuto generato dagli utenti, video, chat, news grassroots e via dicendo.

E proprio in questa direzione che gli information designer devono guardare in futuro: nel momento in cui si deve andare al di là dell'organizzazione visuale base degli elementi si approda in un contesto di semplicità e socialità dove le sinergie tra elementi contribuiscono a rendere più semplice lo scambio di informazioni e di contributi.
Introduzione di Robin Good

Principi Di Information Design Per Il Web 2.0

di Ellyssa Kroski

L'information design per il web è ormai cambiato.

Le persone hanno cambiato il loro modo di consumare informazioni online, così come le loro aspettative su come ricevono queste informazioni. La natura sociale del Web porta con se un'aspettativa di interazione con l'informazione e il Web design moderno riflette tale aspettativa.

Oggi abbiamo alternative disponibili che cambiano le modalità di navigazione, permettendoti di navigare per utente, tramite tag cloud o tab ecc. I miglioramenti tecnologici assieme a questi mutamenti nelle aspettative degli utenti sta influenzando il modo con il quale le informazioni sono presentate all'interno delle pagine web.

I siti web di oggi stanno puntando su interfacce intuitive ed usabili che continuano a sviluppare rispondendo alle necessità degli utenti. I designer iniziano ad approcciare i design in maniera differente e a disegnare siti semplici e interattivi, in grado di incorporare i miglioramenti nell'interface design e nelle necessità degli utenti.

L'information design per il web 2.0 è semplice, è sociale, e sfrutta forme di navigazione alternative.

Semplicità

La Semplicità delle Web Application

Nel suo Paradosso della scelta, Barry Schwarz discute a proposito della tirannia delle piccole decisioni e di come l'incremento delle scelte nella nostra società, faccia in modo che dedichiamo grandi quantità di tempo, ansia, dubbi e paure per fare scelte banali.

Si interroga sul perché oggi ti serva un intero giorno per comprarti un paio di jeans?

E quindi evidenzia come questo sovraccarico di scelta non porti solo frustrazione, ma ci faccia diventare da persone in grado di fare scelte, in esseri che scelgono quasi casualmente immersi a gran velocità in questo vortice. Ognuno di noi ha provato questa sensazione sia con il web, sia con le applicazioni per computer, come nella vita di tutti i giorni.

Il design web 2.0 delle applicazioni di oggi è guidato principalmente dalla semplicità.

Gli sviluppatori stanno creando software con meno funzionalità e una minore curva di apprendimento per gli utenti finali. Le funzionalità incluse sono quelle necessarie, niente di più. I siti web di social networking includono funzioni come il profilo utente che sono essenziali - non includono il tempo ne le quotazioni azionarie.

Il periodo della applicazioni piene di funzioni appartiene al passato. I programmi software di oggi stanno dando più potere agli utenti perché non c'è più bisogno di nessun manuale, sono semplici ed intuitive. Nessun software da installare, e con così tanti utenti a disposizione, puoi evitare di fare registrare le persone e convertirli in utenti pilota per vedere se il sito funziona. Si tratta di un modello di servizio do it yourlself che regala alle persone gli strumenti di cui hanno bisogno per avere successo e nient'altro.

Questa filosofia del perché avere meno è avere di più possiamo vederla negli strumenti di oggi per la produttività come Google Docs e Spreadsheets (prima Writely), e le 37 Signals' Writeboard in aggiunta ad altre Web application. I nuovi motori di ricerca verticali come Healia, cercano solo una parte del Web, diventando semanticamente superiori in piccole nicchie, mentre applicazioni come social bookmarking, photo sharing, e video sharing tool hanno raggiunto l'eccellenza fornendo servizi focalizzati agli utenti finali. Questi nuovi siti web hanno in comune un singolare scopo, ossia porre maggior semplicità nelle funzionalità offerte.

Semplicità Del Design

Questo nuovo trend della semplificazione delle funzionalità delle applicazioni web 2.0 rispecchia il design e lo stile delle pagine web attuali. Un tempo eravamo soliti avere a disposizione moltissime opzioni tutte in una pagina, molto evidenti, mentre i webdesigner di oggi hanno deciso di offrire interfacce semplici e pulite. Solo le cose necessarie, non tutte le funzioni esistenti.

Molti dei cambiamenti sono influenzati dal design delle interfacce di casa Apple e del suo Mac OSX. Un lessico moderno che ha dato al design uno scopo, non si tratta più solo di design punto e basta.

• Design Diretto - Dal momento che non ci preoccupiamo più di riempire la pagina con elementi poco utili, possiamo dare le nostre informazioni in maniera chiara e personalizzata sull'utente. La scelta di design è pratica perché è più compatibile con i vari schermi e risoluzioni.





• Angoli Arrotondati - Tutto è smussato, ammorbidito; nulla mostra stacchi decisi. Questo riflette un'attitudine informale ed un tono casual del web 2.0 di oggi.





• Font San Serif e Lower Case - In armonia con il tono casual web 2.0, e la tendenza degli angoli, ci sono molti font san serif. Allo stesso modo i font lower case sono spesso nei loghi per offrire all'utente un rapporto casual e simpatico.





• Font Grandi - Vengono utilizzati nel web 2.0 per concettualizzare elementi chiave, o mettere in risalto il messaggio che il sito vuole trasmettere o lo slogan.





• Navigazione Sempre Semplice - Navigare nelle pagine diventa intuitivo ed ovvio, abbiamo superato le pagine piene di contenuti. Molto spesso si tratta di una barra di navigazione posta in alto che rimane al suo posto in ogni pagina.





• Loghi In Grassetto - Le nuove applicazioni web 2.0 sono grassettate e danno fiducia, così come i loghi delle aziende che rappresentano i loro brand.





• Colori Decisi - Usati per enfatizzare concetti, oppure per creare parti di pagine distinte.
  





• Colori Complementari - I siti web moderni non sono monocromatici, ma pieni di colori. Molte pagine sfruttano la complementarietà dei colori, come blu e arancione, o giallo e viola per arricchire i loro design.





• Sfumature 3D - Non sto parlando di effetti banali 3D o illusioni ottiche; si usano ombre, gradienti e superfici riflesse per aggiungere bordi realistici all'interfaccia.





• Superfici Riflesse - Questo trend per la creazione di effetti riflessi o a specchio la troviamo in vari siti, spesso utilizzati nel logo.





• Icone Semplici - La natura genuina del web 2.0 lascia poco spazio a fotografie in questo senso. Al loro posto ecco delle semplici ed intuitive icone con cui l'utente potrà interagire.





• Spazi Bianchi - I designer di siti web hanno un approccio più pulito e Zen, aumentando la distanza tra le linee e iniziando a dare importanza al bianco. Si focalizzano sull'essenziale producendo pagine molto accattivanti.





• Stelle Infuocate - Queste forme esplosive sono molto in voga nel web 2.0. Possono essere utilizzate per promuovere qualcosa o per evidenziare un'offerta o un servizio.

Miglioramenti Nelle User Interface

Oltre allo stile, vi sono stati molti miglioramenti che hanno reso il web 2.0 un posto più semplice di quanto non fosse il web 1.0.

AJAX - è stata una tecnologia estremamente efficace perchè permette di aggiornare i contenuti di una pagina senza doverla ricaricare. Questo miglioramento ha reso possibili nuovi sviluppi nel design delle pagine web.

Grandi Tab - Dato che la navigazione può avvenire anche fra i tab senza ricaricare tutta la pagina, i web designer iniziano a sfruttare queste tecnologie.

Drag & Drop - Con la funzionalità drag and drop su AJAX l'interattività fornita agli utenti è incedibile. Molte delle start page esistenti sfruttano questo principio, permettendo agli utenti di trascinare nei loro spazi personalizzati widget e gadget.

AutoCompletamento - La funzione AJAX AutoComplete permette di riempire form in maniera più veloce ed efficace sfruttando i suggerimenti quando l'utente inizia a digitare.

Mappe - Fino a qualche anno fa era impensabile pensare di collegare ad una cartina geografica qualsiasi tipologia di dati volessi combinarvi, oppure permettere di vedere le strade dal satellite e magari fare anche una foto di un'area. Stanno diventando una parte ormai abituale della user experience ed è qualcosa che gli utenti si aspetteranno in futuro.

WYSIWYG - Non c'è più bisogno di conoscere il codice HTML per creare contenuto online. I Blog, gli wiki, i sistemi per la gestione dei contenuti (CMS / content management system), e altre applicazioni offrono interfacce "Quello che vedi è quello che stai creando" che ricalcano un tradizionale editor di testi e ti permettono di creare contenuto immediatamente.

Anteprime - Gli utenti non hanno più bisogno di cliccare per vedere cosa c'è dentro ad un link. Pensate a Snap che vi permette di avere un'anteprima del link di una pagina.

Sociale

Ci sono almeno due trend emergenti che tendono sempre più a sovrapporsi.

Le Socializzazione dei Media e delle Applicazioni

C'è la tendenza a socializzare in una maniera nuova che permette di condividere libri, foto, video, e testi come articoli, paper accademici e post. Questo trend fa sfruttare le applicazioni web per realizzare e condividere progetti come BaseCamp, o condivisione di documenti come Google-Docs & Spreadsheets, e potrei fare altri esempi. Così si crea una nuova aspettativa; gli utenti vogliono ora interagire con le informazioni che scoprono sul web. Questi trend e aspettative richiedono che le interfacce di oggi incorporino elementi e funzionalità sociali.

Commenti - I lettori dei siti web non sono più passivi, ma possono unirsi alla conversazione o aggiungere giusto un loro personale riflessione.

Possibilità di Recensire e Votare - Possibilità di recensire prodotti e dare voti sta diventando una cosa sempre più diffusa soprattutto per siti media o di prodotti.

Send to a Friend - I siti web sviluppate da persone sagge permettono ai loro membri di fare marketing di ciò che scoprono permettendo di inviare ai loro amici articoli, video, foto e prodotti.

Condividere - Il web di oggi è collaborativo con documenti, calendari e tool di creazione che possono essere condivisi all'interno di un team.

Subscribe - Quando gli utenti scoprono qualcosa che li interessa, vogliono ricevere gli aggiornamenti.

Save - Gli utenti web 2.0 sono multitasking, e si aspettano di poter salvare un articolo, un video e altri contenuti, semplicemente con un click.

I siti web non possono più essere isole - I visitatori vogliono ponti di collegamento. Non è più sufficiente avere contenuto di qualità, ma bisogna che il sito si integri con la comunità globale di cui entra a fare parte.

Cosa stanno dicendo gli altri? - Quando gli utenti trovano un argomento interessante su un sito, vogliono sapere tutto quello che si dice su quel tema. Ed ecco che servizi come SphereIt permettono di sapere cosa si dice.

Condividere le scoperte - Quando qualcuno scova qualcosa di interessante come una classifica o un post su un tema scottante, vuole condividere con tutto il mondo quello che ha trovato e che sia accreditato per questa scoperta; sto pensando a siti di social news come digg.

Creare Cose Nuove - Vi sono migliaia di mashup sul web 2.0 perchè gli utenti esperti vogliono remixare i loro siti sfruttando le API o i feed RSS.

Il design di questi tool deve essere semplice ed accessibile. Gli utenti non vogliono più salvare le pagine tramite il sito di del.icio.us, ma vogliono farlo direttamente nelle pagine che gradiscono. Non deve essere più necessario cliccare per vedere i commenti in risposta ad un articolo. Insomma, un po' come avere sempre la propria cassetta degli attrezzi.

Sociale fine a Se Stesso

Oltre a siti che socializzano media e applicazioni, ci sono siti nei quali la socialità è l'elemento principale. Questi siti permettono alle persone di connettersi e di costruire delle comunità. Sono siti di social networking come MySpace, Gather, Facebook, e Ning. Il componente principale è il profilo dell'utente attorno al quale ruotano tutte le attività. Anche questi siti hanno bisogno di un'interfaccia che sfrutta le funzionalità sociali.

Profilo Utente - L'ingrediente principale di ogni sito di social networking è il profilo utente che solitamente ricalca la personalità dell'utente.

Lista Amici - Che senso avrebbe entrare in una comunità dove non si possono fare amici? La lista amici permette alle persone di generare la loro propria rete di collegamenti sociali, visualizzarla e condividerla con gli altri.

Commenti - Sono i pensieri che lasciano gli utenti agli utenti. Sono come scritte lasciate sul tuo muro.

Comunicazione - E' parte integrante di ogni social network la possibilità di connetterti e comunicare con gli altri utenti con mail, messaggi, email, chat o a viva voce.

Subscribe - Come per i siti social media, i membri dei social network vogliono strumenti che gli permettano di trovare persone interessanti.

Gruppi - Le sotto-comunità in questo ecosistema sociale permettono agli utenti di entrare a far parte di particolari gruppi che condividono un interesse, una passione o una caratteristica.

Strumenti Per Esprimersi - I social network popolari permettono di creare un giornale o un blog, e anche caricare i propri file, presentazioni, video e widget di tutti i tipi.

Navigazioni Alternative

I designer dei siti web di oggi hanno capito l'importanza dei percorsi alternativi nel ricercare le informazioni. I visitatori non devono più essere limitati da percorsi di navigazione obbligati imposti dagli sviluppatori. Infatti adesso è possibile navigare i contenuti seguendo percorsi casuali ed emotivi. Questi strumenti danno una dimensione visuale delle cose da scoprire, permettendo una ricerca di informazioni multitasking o che interpola i dati degli altri utenti.

Per utente - Non si può solamente trovare una informazione; devi averne varie di fronte per capire quali sono le persone che vuoi contattare.

La Tag Cloud - Si tratta di una tassonomia complementare al vocabolario controllato creato dai siti web. E' intuitiva e facilmente cliccabile; spesso in san serif.

I migliori - Liste delle cose più popolari, più cercate, più recenti, più commentate, più votate, le più inviate via mail; con questi strumenti si possono scoprire gli elementi più interessanti.

Lo Zeitgeist - E' un box che sfrutta sia le cose più viste / votate, ma anche tag cloud, per fare subito una sorta di radiografia alla cultura e alla personalità di una comunità.

Informazioni Correlate - I percorsi per trovare contenuti non possono essere più limitati da un unico sito. La navigazione ora fa scoprire contenuti girando fra vari siti.

Heat Map - Siti web come CrazyEgg e Summize usano le heat map (mappe di fuoco visivo) come tool visuali per aiutare gli utenti nella navigazione e nella ricerca di informazioni.

Mappe Relazionali - Digg Labs sta sperimentando delle rappresentazioni visuali delle informazioni innovative ed interattive con le sue applicazioni Swarm, Stack, e BigSpy.

Strumenti per gestire il tempo - Sui siti di oggi, le persone possono andare indietro nel tempo o navigare le informazioni a livello temporale.

Mappe - La possibilità di associare informazioni alle mappe è fondamentale per Google e Yahoo!; soprattutto importante per siti di e-commerce che spesso hanno sedi in luoghi impossibili da trovare.

Widget- I gadget sono un altro modo per navigare nelle informazioni. Aggregano informazioni in un unico posto e permettono anche di navigarle. I siti web non sono più semplici display di testo, ma applicazioni che contengono a loro volta applicazioni.

Mashup - Gli utenti stanno generando i loro propri modi per navigare le informazioni rimescolando servizi differenti per generare le nuove applicazioni.

Principi Di Information Design Per Il Web 2.0

• Semplicità! - Includi solo le funzionalità necessarie in un design semplice ed efficiente.
• Socialità! - Vieni incontro alle necessità degli utenti permettendo di connettersi con i loro social tool.
• Offri Una Navigazione Alternativa - Sfrutta lo Zeitgeist e permetti agli utenti di navigare su percorsi visuali alternativi.

Filosofie Per Il Nuovo Web

• Evolvere - Gli sviluppatori non hanno paura di sperimentare. Non c'è una risposta giusta perché saranno gli utenti a dirlo.
• Essere Agile - Rispondi con tempestività agli avanzamenti nella tecnologia ed ai cambiamenti nei bisogni del mercato. Sii disposto ad abbandonare le idee difettose
• Essere Aperto - Dai agli utenti API, widget e badge, oppure saranno loro a disegnarli.

Riferimenti

• 37 Signals. Getting Real, 37 Signals LLC, 2006.
• Hunt, Ben. "Current Web Style". Web Design from Scratch.
• Hunt, Ben. "Web 2.0 Design Style Guide". Web Design from Scratch.
• Krug, Steve. Don't Make Me Think: A Common Sense Approach to Web Usability, New Riders, 2005.
• Nicol, Jonathan. The visual design of Web 2.0. Pixel Acres.
• Schwartz, Barry. The Paradox of Choice: Why More is Less, HarperCollins Publishers, 2005.

Articolo originale di Ellyssa Kroski pubblicato per la prima volta il 2 Aprile del 2007 con il titolo "Information Design for the New Web" su InfoTangle. Versione In Lingua Italiana di Mirco Martinelli.

L'autrice

Ellyssa Kroski è un Reference Librarian alla Columbia University ed è anche una Information Consultant indipendente. Sta lavorando con le tecnologie Internet e dell'informazione da oltre 10 anni ed offre servizi training su tecnologie, sviluppo contenuti, scrittura, e accertamenti sulle tecnologie web e sulle biblioteche.

InfoTangle è il suo sito personale dove pubblica e scrive dei suoi interessi; tecnologie emergenti, web 2.0, informazione e librerie.