Kaleidoscope Srl
Kaleidoscope Srl
Design / UX / UI

Toni di voce e toni di colore: progettare un’esperienza è come scrivere un discorso

Kaleidoscope / 08 March 2017

“Cosa sono tutti questi rettangoli grigi? dove sono le mie foto?”

Alzi la mano chi si è trovato in questa situazione, da una parte o dall’altra del punto di domanda…

Una parte controversa nel confronto con il cliente durante la progettazione di un sito o di un’applicazione è una: la progettazione dell’esperienza utente.

Fin troppo spesso capita che per “i non addetti ai lavori” questa parte sia superficiale e si preferisca sorvolarla per concentrarsi sulla progettazione grafica.

Questo è come cercare di dire qualcosa senza preoccuparsi del tono di voce che si utilizza.

Per questo che abbiamo deciso di fare un parallelismo tra la progettazione dell’esperienza utente di un sito e una parte molto importante del nostro modo di comunicare con il prossimo: la comunicazione non verbale.

Ma prima, un po’ di introduzione (saremo veloci, promesso):

La User Experience

“Se vogliamo che agli utenti piaccia il nostro software, dobbiamo progettarlo per comportarsi come una persona piacevole”
Alan Cooper

Ci sono tanti mezzi e metodologie per progettare l’esperienza utente, ma quella che prenderemo ad esempio oggi è quella dell’utilizzo dei wireframe.

Ma cosa sono i wireframe?
I Wireframe sono il “progetto” di un design.
 Il loro compito è quello di connettere la struttura concettuale (o architettura dell’informazione) alla superficie (il design grafico) di un sito o di un’applicazione in modo rapido e facilmente modificabile.

Nello specifico sono la rappresentazione prototipale e visiva di un’interfaccia, usata per comunicare i seguenti dettagli:

  • Struttura (Come si mettono insieme i pezzi di questo sito?)
  • Contenuto (Cosa verrà mostrato sul sito?)
  • Gerarchia delle informazioni (Come verranno organizzate e mostrate
  • queste informazioni?)
  • Funzionalità (Come funziona questa interfaccia?)
  • Comportamento (Come interagisce con l’utente? E lui come reagirà?)

La comunicazione non verbale

”Ciò che fai parla talmente forte che non riesco a sentire ciò che stai dicendo”
Ralph Waldo Emerson

Il senso comune considera la comunicazione non verbale come qualcosa di più spontaneo e in questo articolo la divideremo in 3 sistemi: paralinguistico, cinesico e prossemica.

Sistema paralinguistico
Ovvero la parte vocale non verbale e sono i suoni che emettiamo a prescindere dal loro signifcato.

Sistema cinesico
Sistema che si basa sulla nostra corporalità, come la nostra mimica facciale e la nostra gestualità.

Prossemica
È la gestione dello spazio e del territorio, ovvero come noi gestiamo lo spazio con gli altri sulla base di elementi come conoscenza, intimità e gerarchia.

“Ok, è tutto molto interessante, ma non ho capito cosa c’entra se arrossisco o meno con la progettazione di un sito internet”

Bene, qui ti volevevamo: non è forse importante allo stesso modo lo spazio che teniamo tra noi e gli altri quanto quello che ci deve essere tra un elemento e un’altro? Non è la stessa cosa tra le pause, i silenzi e i ritmi in un discorso e il “temutissimo” spazio bianco e i ritmi visivi di un sito? Ed è simile anche come la struttura degli elementi acquisiscano un significato sulla base del contesto e della cultura del fruitore, nello stesso modo con cui vengono interpretati i gesti e le espressioni.

wireframe
wireframe

È solo qualche esempio, ma possiamo già creare un parallelismo tra questi metodi di comunicazione, in quanto entrambi si distribuiscono in una fascia istintiva, ovvero senza che debba essere filtrata da concetti preesistenti, una razionale, soggetta al contesto e alla cultura del fruitore, e una semantica, ovvero la parte intelligibile del messaggio che si cerca di comunicare.

Quindi, com’è distribuita la comunicazione verbale in queste fasce?

  • Linguaggio non verbale (fascia istintiva)
  • Linguaggio vocale (fascia razionale)
  • Linguaggio verbale (fascia semantica)

Proviamo a distribuire in questo modo anche la comunicazione di un sito web?

  • Elementi strutturali (fascia istintiva)
  • Grafica (fascia razionale)
  • Verbale (fascia semantica)

“E come facciamo per capire e unire questi linguaggi?”

Per decifrare questo linguaggio James Borg ed Allan Pease hanno proposto la “regola delle tre C”:

Complesso
I gesti vanno letti combinandoli in gruppi o insiemi, in quanto un solo gesto non può rispecchiare l’atteggiamento generale.

Coerenza
Tra il messaggio verbale e quello non verbale deve esserci coerenza. Tuttavia se ci troviamo di fronte ad una discordanza tra quello che sentiamo e quello che vediamo, tendiamo a fare affidamento a quest’ultimo.

Contesto
Se un uomo siede con le gambe incrociate, il viso rivolto verso il basso con le braccia conserte (tipico atteggiamento difensivo) in una notte fredda, potrebbe soltanto significare che si vuole riscaldare.

Nello stesso modo possiamo declinare questa regola all’interno della progettazione di un sito

Complesso (content type) 
Un elemento da solo non è autoesplicativo se non è messo in relazione con gli altri.

Coerenza (call to action)
Elementi con funzionalità simili devono avere una resa grafica uniforme, altrimenti si cade in incomprensioni riguardo ai ruoli degli elementi.

Contesto
Se generalmente un link è sottolineato e io trovo un paragrafo sottolineato in un testo tecnico di un sito, probabilmente potrebbe essere solo un’enfasi del paragrafo invece che un link.

La comunicazione va intesa quindi come un flusso generato di codici dove un sorriso, una parola, un gesto si influenzano a vicenda e prendono vita in modo sinergico, venendo letti e interpretati non sulla base di un dizionario, ma grazie ad una costruzione condivisa del significato che è in mano a tutti i partecipanti della comunicazione e che è immersa in uno specifico e complesso contesto sociale.
Allo stesso modo la progettazione di un sito sottosta alle stesse regole, dove gli elementi interagiscono tra loro e con l’utente, che attraverso la sua esperienza è in grado di utilizzare un determinato prodotto.

 

CREIAMO VALORE

Aiutiamo le aziende nei processi di comunicazione digitale.

Scrivici
 

Iscriviti alla newsletter

I cookies ci permettono di migliorare la tua esperienza utente. Continuando a navigare su questo sito accetti il loro impiego. OK MAGGIORI INFO