Gestalt
Tra la fine dell'ottocento ed i primi anni del novecento si svilupparono in Germania le teorie sulla percezione visiva; il primo a compiere studi su come la disposizione degli oggetti nello spazio ed il loro movimento influenza la nostra percezione visiva, fu Max Wertheimer. Mentre con il treno si dirigeva verso una località dove avrebbe trascorso un periodo di vacanza, ad un passaggio a livello fu attratto dall’alternanza delle luci rosse di segnalazione; abbandonò immediatamente l’idea del soggiorno fuori porta, acquistò uno Zoetrope, strumento per animare immagini, e iniziò le sue sperimentazioni. Oggi il dirompente prolificare di Internet e degli applicativi informatici in genere, ci ha portato ad un grande aumento della produzione di interfacce, per i più svariati utilizzi. E’ chiaro ormai, che per poter rendere fruibili da parte degli utenti le pagine di un sito o le schermate di un applicativo informatico, è necessario organizzare gli elementi che debbono comparire all’interno del campo visibile secondo poche e semplici regole, che aiutano il designer a distribuire adeguatamente gli elementi nello spazio e coloro che leggono o guardano a comprendere il messaggio che gli si vorrebbe passare. Dopo moltissimi anni dalla loro nascita e sviluppo, le teorie della Gestalt o teoria della percezione visiva, trovano nella nuova era della comunicazione visiva una loro applicazione.
Prima che il designer si dedichi allo sviluppo dell’interfaccia sono già state affrontate le problematiche relative all’usabilità del prodotto, è già stato stabilito quali e quanti dovranno essere i contenuti e molte volte i programmatori hanno già messo mano al codice e sono pronti a fornire i contenuti necessari per riempire quelle pagine. Esiste lo scheletro dell’applicazione: può essere un sito Internet o un software, non fa differenza. Il compito del designer a questo punto è quello di vestire l’applicativo, dunque una volta considerato lo spazio a sua disposizione deve disegnare una scatola in grado di soddisfare principalmente due aspetti: il contenitore deve dare un immagine al suo contenuto, studiata in base al target di riferimento e all’argomento trattato, e allo stesso tempo deve presentare chiaramente i contenuti facilitando il più possibile all’utente la comprensione di questi ultimi, in pratica deve essere usabile ed accessibile.
Partendo dal presupposto che l’immagine che l’interfaccia dà a chi guarda è molto importante, soprattutto per noi che ci occupiamo di webdesign, ed è legata a molteplici aspetti emozionali, di mercato e mirati verso il prodotto che si vuole presentare, le leggi della Gestalt ci aiutano nella distribuzione spaziale degli elementi, sono semplici, e si basano sull’interpretazioni che il nostro cervello dà alle immagini che l’occhio gli invia.
Avendo a disposizione uno spazio finito, come quello che sempre ci si trova a dover riempire quando è richiesto lo sviluppo di una nuova interfaccia, gli elementi che debbono essere inseriti in quella schermata non sono tutti importanti allo stesso modo, non trattano tutti lo stesso argomento e per questo bisognerà organizzarli facendo in modo che si distinguano bene uno dall’altro e che permettano all’utente di fruire delle informazioni contenute in quella pagina più facilmente possibile. Per porre in essere queste condizioni sarà necessario operare seguendo alcune piccole attenzioni che le leggi della Gestalt ci propongono.
Ad esempio avvicinando elementi gemelli, si tenderà a dare l’impressione che questi elementi servano da delimitatori di uno spazio; immaginiamo di avere una serie di barrette tutte uguali e parallele, se avvicinate tra di loro a coppie daranno l’impressione di essere dei bordi di zone delimitate da loro stesse. Più semplicemente se volessimo costruire un separatore per dividere ad esempio la parte superiore da quella inferiore di una pagina web potremo usare una serie di pallini, allineati su due file disposte in orizzontale; sparsi nello spazio sarebbero solo dei pallini dispersi su un fondo colorato, mentre raggruppati in questo modo costituiscono un oggetto con una precisa funzione.
Per facilitare la comprensione di chi si trova a dover leggere dei dati contenuti in una pagina web spesso è necessario organizzali in modo da renderli più facilmente accessibili. Pensiamo ad esempio ai nuovi servizi on line delle banche che ci permettono di controllare in ogni momento il conto corrente. Tutte le operazioni sono disposte in ordine cronologico, in alto l’ultima effettuata e in fondo la prima del periodo visualizzato. Il saldo è sempre terribilmente contrassegnato dalla riga rossa ed è in alto ben visibile, anche se noi non vorremmo mai vederlo dopo il 27 del mese, mentre tutte le righe che recano dati di pagamenti effettuati con carta di credito sono contrassegnate da un certo colore, quelle con i pagamenti via bancomat con un altro colore, i bonifici un altro ancora, e siccome si tratta di uscite sono sempre colori che tendono verso il rosso, mentre lo stipendio, la voce più gradevole del conto corrente è uno degli emolumenti a vostro favore ed è dunque contrassegnato da un bel colore vivace solitamente tendente al verde. Solitamente le righe tendenti al rosso sono sempre in numero spropositatamente maggiore rispetto a quelle verdi, ma in questo modo sono tutte facilmente individuabili. Colori uguali portano dati uguali, e il nostro cervello tende automaticamente a raggruppare gli elementi simili. Sempre di più il designer si trova a dover vestire pagine con molti contenuti ed è quindi necessario usare altri stratagemmi per distribuirli al meglio. Spargendo le immagini, le parti di testo e il link in giro per lo spazio a disposizione anche se contrassegnati da colori uguali non sarà semplice per l’utente raggrupparli e capirli, meglio dunque racchiudere gruppi di informazioni dentro veri e propri recinti. Subito il pensiero va ai grandi portali, quelli delle grosse compagnie della new economy, quelli dove si può trovare di tutto dalla mail gratuita alle ricette della nonna, dai percorsi per la gita della domenica alle ultime notizie, senza dimenticare i blog e naturalmente la pubblicità. E’ qui che troviamo la massima espressione del raggruppamento per argomenti: in alto il box con l’accesso alla mail o la ricerca, poi appena sotto un altro box con le notizie, a destra un altro con l’elenco dei blog più ciccati e così via…
Di seguito due esempi:
* L’ultima release di www.libero.it che sfrutta in pieno il sistema del raggruppamento per argomento.
* Piemonte Emozioni (www.piemonte-emozioni.it) il sito della regione Piemonte per la promozione turistica e culturale. Il sito è sviluppato dal CSI-Piemonte in collaborazione con lo Studio Livio di Torino che ha curato la grafica; anche in questo caso sono sono stati creati degli spazi finiti all’interno dei quali gli argomenti sono trattati singolarmente in modo che ci sia netta distinzione tra di loro; inoltre su questo sito le zone dedicate agli argomenti sono colorate diversamente in modo da rendere ancora più evidente la distinzione.
A poco a poco stiamo entrando dentro l’essenza dei principi fondamentale della Gestalt o meglio dei principi della Gestalt che possono applicarsi alla costruzione di interfacce; l’ormai famoso “utente” ha sviluppato durante gli anni di navigazione sul web o di utilizzo dei più diffusi applicativi delle abitudini, che probabilmente sono state indotte da coloro che fin dalla nascita delle interfacce hanno studiato il comportamento dell’utente stesso e creato situazioni congeniali all’utilizzo delle interfacce. Detto così sembra un concetto tanto astratto quanto incomprensibile, ma effettivamente a mezzo di un semplice esempio penso che sia facilmente interpretabile.
L’immaginazione va subito al “cerca”. Quel remoto campo di inserimento testo che tante volte cerchiamo disperatamente in una pagina Internet e che nel peggiore dei casi non troviamo, molto utile a patto che funzioni correttamente, e che per convenzione non scritta oggi i designer tendono a piazzare in alto a destra nella pagina, una posizione gerarchica appena inferiore a quella del logo o titolo del sito. Ognuno di noi tende a riconoscere quello che ha già visto, e quindi nel caso di un interfaccia ad andarlo a cercare con lo sguardo, nel posto e con la forma in cui è abituato a vederlo.
Prima che il designer si dedichi allo sviluppo dell’interfaccia sono già state affrontate le problematiche relative all’usabilità del prodotto, è già stato stabilito quali e quanti dovranno essere i contenuti e molte volte i programmatori hanno già messo mano al codice e sono pronti a fornire i contenuti necessari per riempire quelle pagine. Esiste lo scheletro dell’applicazione: può essere un sito Internet o un software, non fa differenza. Il compito del designer a questo punto è quello di vestire l’applicativo, dunque una volta considerato lo spazio a sua disposizione deve disegnare una scatola in grado di soddisfare principalmente due aspetti: il contenitore deve dare un immagine al suo contenuto, studiata in base al target di riferimento e all’argomento trattato, e allo stesso tempo deve presentare chiaramente i contenuti facilitando il più possibile all’utente la comprensione di questi ultimi, in pratica deve essere usabile ed accessibile.
Partendo dal presupposto che l’immagine che l’interfaccia dà a chi guarda è molto importante, soprattutto per noi che ci occupiamo di webdesign, ed è legata a molteplici aspetti emozionali, di mercato e mirati verso il prodotto che si vuole presentare, le leggi della Gestalt ci aiutano nella distribuzione spaziale degli elementi, sono semplici, e si basano sull’interpretazioni che il nostro cervello dà alle immagini che l’occhio gli invia.
Avendo a disposizione uno spazio finito, come quello che sempre ci si trova a dover riempire quando è richiesto lo sviluppo di una nuova interfaccia, gli elementi che debbono essere inseriti in quella schermata non sono tutti importanti allo stesso modo, non trattano tutti lo stesso argomento e per questo bisognerà organizzarli facendo in modo che si distinguano bene uno dall’altro e che permettano all’utente di fruire delle informazioni contenute in quella pagina più facilmente possibile. Per porre in essere queste condizioni sarà necessario operare seguendo alcune piccole attenzioni che le leggi della Gestalt ci propongono.
Ad esempio avvicinando elementi gemelli, si tenderà a dare l’impressione che questi elementi servano da delimitatori di uno spazio; immaginiamo di avere una serie di barrette tutte uguali e parallele, se avvicinate tra di loro a coppie daranno l’impressione di essere dei bordi di zone delimitate da loro stesse. Più semplicemente se volessimo costruire un separatore per dividere ad esempio la parte superiore da quella inferiore di una pagina web potremo usare una serie di pallini, allineati su due file disposte in orizzontale; sparsi nello spazio sarebbero solo dei pallini dispersi su un fondo colorato, mentre raggruppati in questo modo costituiscono un oggetto con una precisa funzione.
Per facilitare la comprensione di chi si trova a dover leggere dei dati contenuti in una pagina web spesso è necessario organizzali in modo da renderli più facilmente accessibili. Pensiamo ad esempio ai nuovi servizi on line delle banche che ci permettono di controllare in ogni momento il conto corrente. Tutte le operazioni sono disposte in ordine cronologico, in alto l’ultima effettuata e in fondo la prima del periodo visualizzato. Il saldo è sempre terribilmente contrassegnato dalla riga rossa ed è in alto ben visibile, anche se noi non vorremmo mai vederlo dopo il 27 del mese, mentre tutte le righe che recano dati di pagamenti effettuati con carta di credito sono contrassegnate da un certo colore, quelle con i pagamenti via bancomat con un altro colore, i bonifici un altro ancora, e siccome si tratta di uscite sono sempre colori che tendono verso il rosso, mentre lo stipendio, la voce più gradevole del conto corrente è uno degli emolumenti a vostro favore ed è dunque contrassegnato da un bel colore vivace solitamente tendente al verde. Solitamente le righe tendenti al rosso sono sempre in numero spropositatamente maggiore rispetto a quelle verdi, ma in questo modo sono tutte facilmente individuabili. Colori uguali portano dati uguali, e il nostro cervello tende automaticamente a raggruppare gli elementi simili. Sempre di più il designer si trova a dover vestire pagine con molti contenuti ed è quindi necessario usare altri stratagemmi per distribuirli al meglio. Spargendo le immagini, le parti di testo e il link in giro per lo spazio a disposizione anche se contrassegnati da colori uguali non sarà semplice per l’utente raggrupparli e capirli, meglio dunque racchiudere gruppi di informazioni dentro veri e propri recinti. Subito il pensiero va ai grandi portali, quelli delle grosse compagnie della new economy, quelli dove si può trovare di tutto dalla mail gratuita alle ricette della nonna, dai percorsi per la gita della domenica alle ultime notizie, senza dimenticare i blog e naturalmente la pubblicità. E’ qui che troviamo la massima espressione del raggruppamento per argomenti: in alto il box con l’accesso alla mail o la ricerca, poi appena sotto un altro box con le notizie, a destra un altro con l’elenco dei blog più ciccati e così via…
Di seguito due esempi:
* L’ultima release di www.libero.it che sfrutta in pieno il sistema del raggruppamento per argomento.
* Piemonte Emozioni (www.piemonte-emozioni.it) il sito della regione Piemonte per la promozione turistica e culturale. Il sito è sviluppato dal CSI-Piemonte in collaborazione con lo Studio Livio di Torino che ha curato la grafica; anche in questo caso sono sono stati creati degli spazi finiti all’interno dei quali gli argomenti sono trattati singolarmente in modo che ci sia netta distinzione tra di loro; inoltre su questo sito le zone dedicate agli argomenti sono colorate diversamente in modo da rendere ancora più evidente la distinzione.
A poco a poco stiamo entrando dentro l’essenza dei principi fondamentale della Gestalt o meglio dei principi della Gestalt che possono applicarsi alla costruzione di interfacce; l’ormai famoso “utente” ha sviluppato durante gli anni di navigazione sul web o di utilizzo dei più diffusi applicativi delle abitudini, che probabilmente sono state indotte da coloro che fin dalla nascita delle interfacce hanno studiato il comportamento dell’utente stesso e creato situazioni congeniali all’utilizzo delle interfacce. Detto così sembra un concetto tanto astratto quanto incomprensibile, ma effettivamente a mezzo di un semplice esempio penso che sia facilmente interpretabile.
L’immaginazione va subito al “cerca”. Quel remoto campo di inserimento testo che tante volte cerchiamo disperatamente in una pagina Internet e che nel peggiore dei casi non troviamo, molto utile a patto che funzioni correttamente, e che per convenzione non scritta oggi i designer tendono a piazzare in alto a destra nella pagina, una posizione gerarchica appena inferiore a quella del logo o titolo del sito. Ognuno di noi tende a riconoscere quello che ha già visto, e quindi nel caso di un interfaccia ad andarlo a cercare con lo sguardo, nel posto e con la forma in cui è abituato a vederlo.
0 Comments:
Posta un commento
<< Home