Slides dalle lezioni del corso di Interazione Uomo Macchina per gli studenti del corso di laurea in Informatica - Università di Milano Bicocca - Prof.R.Polillo (a.a.2014-15) - Lezione del 15 aprile 2015
1. Corso di Interazione Uomo Macchina
AA 2014-2015
Roberto Polillo
Corso di laurea in Informatica
Università di Milano Bicocca
Dipartimento di Informatica, Sistemistica e Comunicazione
ANCORA SULLA COMUNICAZIONE
VISIVA
2. Queste slides…
… si basano sul libro “Facile da usare”, dell’autore, dove si trovano
tutte le necessarie spiegazioni. Vedi www.rpolillo.it
Queste slide sono disponibili con licenza Creative Commons
(attribuzione, non commerciale, condividi allo stesso modo) a
chiunque desiderasse utilizzarle, per esempio a scopo didattico,
senza necessità di preventiva autorizzazione:
http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it
La licenza non si estende alle immagini fotografiche e alle screen
shots, i cui diritti restano in capo ai rispettivi proprietari, che sono
stati indicati, ove possibile, nelle didascalie del libro. L’autore si
scusa per eventuali omissioni, e resta a disposizione per
correggerle.
R.Polillo - Aprile 2015
2
3. Comunicazione visiva e interaction design
La comunicazione visiva ha un ruolo preponderante
nell’interazione uomo-macchina: immagini, testo,
animazioni, video
Quindi la cura degli aspetti grafici nell’interaction design
è di grande importanza
Occorre considerare aspetti percettivi, psicologici,
culturali
Grande tradizione e cultura dell’immagine, ma poche
indicazioni scientificamente dimostrabili
E’ utile che anche gli informatici acquisiscano sensibilità
in quest’area.
R.Polillo - Aprile 2015
3
4. Chiarire gli obbiettivi
R.Polillo - Aprile 2015
4
La progettazione grafica di un sistema interattivo può avere
obiettivi diversi, che possono essere fra loro in conflitto:
8. La grafica per la usabilità
“La presentazione dell’informazione visiva dovrebbe
abilitare l’utente ad eseguire i compiti percettivi (per
esempio, la ricerca di informazioni sullo schermo) in
modo efficace, efficiente e con soddisfazione […]
R.Polillo - Aprile 2015
8
Nel progettare l’informazione visiva si devono
considerare le seguenti caratteristiche:
Chiarezza Discriminabilità Concisione
Consistenza
Scopribilità Leggibilità Comprensibilità"
ISO 9241-12, “Presentation of information”
9. Organizzazione delle pagine
Strutturare le pagine in modo facilmente
riconoscibile, semplice, ordinato, suggerendo
percorsi visivi coerenti con i casi d'uso
Usare griglie logiche coerenti
Curare gli allineamenti
Evitare rumore visivo
Evitare le ridondanze
Tenere presenti i principi della teoria della Gestalt
Usare il colore per migliorare la comprensione della pagina
Coerenza, coerenza, coerenza….
R.Polillo - Aprile 2015
9
64. Minimalismo vs massimalismo
"La perfezione si raggiunge non quando non
c'è più niente da aggiungere, ma quando
non c'è più niente da togliere"
Antoine de St-Exupery
R.Polillo - Aprile 2015
64
70. Il ruolo delle immagini
A che cosa serve un'immagine nel contesto
della schermata complessiva?
Come decorazione ?
Come riempitivo?
Per illustrare un contenuto?
Per veicolare un messaggio?
Per dirigere l'attenzione su un contenuto
(es.banner)?
R.Polillo - Aprile 2015
70
81. Coerenza
Utilizzare uno stile e segnali visivi coerenti
all’interno dell’applicazione e fra applicazioni
“della stessa categoria”
R.Polillo - Aprile 2015
81
82. 82
Link interni al sito Link esterni al sito Link alla home page
Search engine interna Banners pubblicitari Login /registrazione
Shopping cart Help Links ai prodotti
Bernard, 2001
Organizzazione abituale
R.Polillo - Aprile 2015