INTRODUZIONE ALLE INTERFACCE UTENTE

Che cosa e' un'interfaccia

Interazione Uomo Macchina ha come scopo la collaborazione fra utente e computer per svolgere un certo lavoro.

• il computer mette hardware (device), software (programmi applicativi), dati (file)
• l'utente mette il controllo (la decisione di che cosa fare)

Interfaccia utente o Graphical User Interface (GUI): strumento attraverso il quale il computer comunica con l'utente e viceversa, per realizzare (facilitare) questa collaborazione.

• "inter" = si pone "tra" l'utente e la macchina (intesa come insieme di hardware e di software)
• "faccia" = e' la "facciata" che la macchina mostra all'utente. Offre accesso alle funzionalita' in modo facile e intuitivo, nasconde la complessita' del funzionamento interno.

In generale interfaccia e' anche fra due strati software: da strato di basso livello verso strato di alto livello. Infatti occorre specificare: interfaccia "utente".

Per interfacce utente distinguere tra:

• Interfaccia dell'intero sistema (es. di Windows), definisce l'ambiente di lavoro su una certa macchina. Vedremo come funzionano.
• Intefaccia della singola applicazione (es. di Word). Impareremo anche a costruirle (con progetto di laboratorio).

Look and feel di un'interfaccia

Come l'interfaccia si presenta visivamente e come si lascia usare dall'utente.

• Look = guardare = aspetto grafico = come l'interfaccia e' disegnata: elementi che la compongono, loro disposizione, forma, dimensione, colore...
• Feel = sentire (essere vivo, rispondere alle sollecitazioni) = comportamento = come utente ed interfaccia interagiscono: con quali azioni sui dispositivi (mouse, tastiera...) l'utente puo' invocare operazioni ed ottenere risultati

Interazione con l'utente

Attraverso l'interazione l'utente controlla il sistema o l'applicazione sottostante l'interfaccia.

L'interazione consiste in azioni dell'utente che provocano reazioni da parte dell'interfaccia.

Le azioni avvengono tramite i dispositivi di input:

• tastiera
• pointing device (puntatore) -- mouse, schermo sensibile al tatto...
• altro (che qui non consideriamo) -- comandi vocali, dispositivi in grado di cogliere movimento 3D...

Le reazioni avvengono internamente, e sono manifestate all'utente tramite i dispositivi di output (schermo, altoparlante).

Il comportamento di un programma dotato di interfaccia utente grafica e' di tipo inter-attivo.

Sono le azioni compiute dell'utente sui dispositivi di input a determinare il flusso di esecuzione del programma. Contrariamente ai programmi batch in cui il flusso e' predefinito nel codice.
Compito dell'interfaccia e' raccogliere le azioni e scatenare le reazioni corrispondenti.

+------+         azione su                        +------------+     +--------+
|      |--(1)--> dispositivo --(2)-->  evento --->|    (3)     |     | (3bis) |
|      |         di input                         |interfaccia |     |        |
|utente|                                          |della       |<--->|appli-  |
|      |         feedback su          reazione    |applicazione|     |cazione |
|      |<--(5)-- dispositivi <--(4)-- (cambio <---|            |     |        |
+------+         di output            di stato)   +------------+     +--------+

(1) L'utente compie azioni sui dispositivi di input (mouse, tastiera).

(2) Le azioni sono tradotte in eventi. Evento = pacchetto di informazioni che descrive che cosa e' avvenuto.

(3) L'evento viene elaborato dal codice dell'interfaccia, per decidere che cosa fare (come reagire).
La reazione cambia lo stato dell'interfaccia (es. aumenta lo zoom con cui viene mostrato un testo che sto editando) e/o del programma applicativo sottostante (es. modifica il testo).

(4) La reazione (avvenuto cambio di stato) viene comunicata all'utente come feedback sui disposiviti di output (schermo, altoparlante).

(5) L'utente riceve il feedback e in base a questo decidera' la prossima azione...
Il feedback e' molto importante!

Stili di interazione

Lo stile di interazione riguarda il modo in cui l'interfaccia

• organizza e presenta all'utente le funzionalita' disponibili
• raccoglie le azioni (input) dall'utente
• presenta il feedback (output) all'utente

Stili fondamentali:

1. linguistico
2. a menu'
3. a scheda
4. per manipolazione diretta

Stile di interazione linguistico

Tipico delle interfacce NON grafiche. Interazione da command-line.

Input dell'utente consiste in comandi alfanumerici. Output consiste in messaggi alfanumerici.

Stile di interazione a menu'

Puo' essere realizzato sia da un'interfaccia grafica che da una non grafica.

In ogni momento l'utente puo' immettere una scelta in una lista che gli viene proposta. In base alla scelta dell'utente, l'interfaccia compie un'operazione oppure propone un'altra lista di scelte (serie di menu' gerarchici, cioe' in cascata).

Stile di interazione a scheda

Puo' essere realizzato sia da un'interfaccia grafica che da una non grafica. Nelle interfacce grafiche di solito reso con finestre di dialogo.

All'utente si chiede di compilare dei campi con informazioni di tipo vario (una scelta fra alternative, un valore numerico, una stringa, un booleano...). Idea del modulo da compilare. Alcune parti possono essere pre-compilate con valori di default.

Sopperisce alla carenza dei menu' (che non sono in grado, per esempio, di richiedere dati in input).
Spesso abbiamo voci di menu' che, se scelte, portano a una finestra di dialogo (es. impostazioni di stampa).

Stile di interazione per manipolazione diretta

Tipico delle interfacce grafiche.

Mostra un insieme di oggetti grafici sullo schermo e l'utente puo' interagire con ciascuno di essi. L'utente agisce direttamente su un oggetto attraverso il mouse. Gli oggetti sono reattivi: il loro aspetto, posizione... cambia a seconda delle azioni dell'utente.

Usabilita' di un'interfaccia

L'interfaccia non solo deve rendere possibile all'utente utilizzare il programma sottostante, ma deve anche far si' che utilizzarlo risulti facile, efficiente e gratificante.

Esistono vari aspetti che saranno trattati fra poche lezioni dalla dott.ssa Papaleo, fra cui:

• Estetica (aspetto gradevole dell'interfaccia)
• Facilita' di apprendimento (quanto ci mette un utente "nuovo" ad imparare)
• Comodita' d'uso (per l'utente che ha gia' imparato)
• Prevenzione/ricovero degli errori
• Tipo di utenti a cui il programma e' destinato (livello di conoscenza informatica, eta', ecc.)
• Campo di applicazione (professionale, didattico, intrattenimento, ecc.)
• Non ultimo il fattore economico e limitazioni dell'hw su cui dovra' girare

Vediamo l'usabilita' degli stili di interazione

Esempio: cancellare un file.

• stile linguistico: shell di comandi (Unix: rm..., Dos: del...)
• stile per manipolazione diretta: trascino l'icona del file nel cestino
• stile a menu': seleziono il file (ed e' manipolazione diretta), apro il menu' associato al file e scelgo funzione per cancellare

Ogni stile ha pro e contro:

• Linguistico:
  Difficile da imparare (bisogna apprendere il linguaggio -- sintassi/semantica).
  Ma molto veloce da usare per l'utente esperto, e richiede pochissime risorse hw.
• A menu':
  Adatto a utente "nuovo" (l'interfaccia guida l'utente passo-passo nelle funzionalita' dell'applicazione, previene errori non presentando le operazioni non valide).
  Ma interazione e' lenta, non comodo per l'utente esperto (per questo esistono le shortcut = scorciatoie mediante combinazioni di tasti, che sono interazione linguistica).
• A scheda:
  L'utente inesperto puo' essere disorientato (si sente "interrogato" dalla macchina).
  
• Manipolazione diretta:
  Intuitivo perche' ricalca il modo naturale di interagire con gli oggetti nel mondo reale, veloce, fornisce all'utente risultati visibili ed immediati (es. animazione).
  Ma un utente "nuovo" puo' non capire quali azioni puo' compiere e quali conseguenze si deve aspettare.

Per venire incontro alle diverse esigenze, gli stili si possono combinare tra loro.

Consistenza (o coerenza)

Alcuni obiettivi di usabilita' sono raggiunti mediante consistenza (o coerenza):

• Elementi che svolgono funzione simile in interfacce diverse sono collocati nello stesso posto, hanno aspetto simile (es. menu' "File" sulla barra in alto a sinistra con le voci "open", "save", ecc.)
• Elementi di interfaccia sono classificati in tipi, ciascun tipo si aziona sempre nello stesso modo (es. tutti i bottoni si azionano con lo stesso tasto del mouse)

Vantaggi della consistenza:

• riusabilita' delle componenti di interfaccia (esistono librerie di componenti di interfaccia con aspetto e comportamento predefiniti)
• facilita' di apprendimento per l'utente