Modelli e stili di interazione
Transcript
Modelli e stili di interazione
Tecnologie per il Web e lo Sviluppo Multimediale Modelli e stili di interazione Luca Pulina Corso di Laurea in Scienze della Comunicazione Università degli Studi di Sassari A.A. 2015/2016 Luca Pulina (UNISS) L’Interazione 1 / 60 Outline 1 I modelli per l’interazione 2 Modelli concettuali di interazione 3 Stili di Interazione Luca Pulina (UNISS) L’Interazione 2 / 60 Outline 1 I modelli per l’interazione 2 Modelli concettuali di interazione 3 Stili di Interazione Luca Pulina (UNISS) L’Interazione 3 / 60 Interazione Ingredienti base: I I L’utente La macchina Interazione: ogni comunicazione tra utente e computer, diretta o indiretta. La comunicazione avviene attraverso l’interfaccia. Poichè la comunicazione possa avere successo, l’interfaccia deve tradurre i concetti dell’utente in quelli della sistema (macchina). Luca Pulina (UNISS) L’Interazione 4 / 60 Terminologia dell’interazione L’utente usa il sistema interattivo per raggiungere i suoi obiettivi, nell’ambito di un certo dominio applicativo. Obiettivo: quello che l’utente vuole raggiungere Dominio: area applicativa oggetto dello studio I descrive concetti, competenze e conoscenze Intenzione: sequenza di azioni generiche che portano al raggiungimento dell’obiettivo Compito o azione: traduzione dell’intenzione in azioni specifiche Luca Pulina (UNISS) L’Interazione 5 / 60 Modello di Norman In questo modello l’attenzione è incentrata maggiormente sulla visione che l’utente ha della interazione. È basato su di un ciclo di esecuzione/valutazione. Luca Pulina (UNISS) L’Interazione 6 / 60 Ciclo di esecuzione/valutazione Esecuzione: l’utente ha un obiettivo, formula un piano d’azione e lo esegue mediante l’interfaccia. Valutazione: l’utente osserva l’interfaccia per valutare, rispetto all’obiettivo, il risultato dell’esecuzione e determina le azioni successive. Luca Pulina (UNISS) L’Interazione 7 / 60 Ciclo di esecuzione/valutazione – Obiettivo L’utente stabilisce l’obiettivo Formula l’intenzione Specifica la sequenza di azioni Esegue le azioni Percepisce lo stato del sistema Interpreta lo stato del sistema Valuta lo stato del sisterma in relazione all’obiettivo Luca Pulina (UNISS) L’Interazione 8 / 60 Ciclo di esecuzione/valutazione – Esecuzione L’utente stabilisce l’obiettivo Formula l’intenzione Specifica la sequenza di azioni Esegue le azioni Percepisce lo stato del sistema Interpreta lo stato del sistema Valuta lo stato del sisterma in relazione all’obiettivo Luca Pulina (UNISS) L’Interazione 9 / 60 Ciclo di esecuzione/valutazione – Valutazione L’utente stabilisce l’obiettivo Formula l’intenzione Specifica la sequenza di azioni Esegue le azioni Percepisce lo stato del sistema Interpreta lo stato del sistema Valuta lo stato del sisterma in relazione all’obiettivo Luca Pulina (UNISS) L’Interazione 10 / 60 Interfaccia come traduttore L’interfaccia esegue “traduzioni” tra due linguaggi: Linguaggio dei compiti (task): usato per descrivere l’utente, i suoi obiettivi, le sue azioni, ... Linguaggio di base (core): usato per descrivere il sistema, il suo stato, le sue capacità, ... Luca Pulina (UNISS) L’Interazione 11 / 60 Usare il modello di Norman – I Golfi Golfo dell’esecuzione: differenza tra le azioni formulate dall’ utente per raggiungere l’obiettivo e le azioni permesse dal sistema. Golfo della valutazione: differenza tra la presentazione dello stato del sistema e le aspettative dell’utente. L’interfaccia è un ponte gettato sul golfo. Luca Pulina (UNISS) L’Interazione 12 / 60 Errori: sviste e sbagli Svista (slip) I I I Corretta formulazione dell’obiettivo Corretta formulazione dell’intenzione Azione sbagliata Sbaglio (mistake) I Obiettivo o intenzione errata Come rimediare? I I Svista: migliorare interfaccia Errore: bisogna fornire all’utente una migliore comprensione del sistema; riprogettazione radicale dell’interfaccia. Luca Pulina (UNISS) L’Interazione 13 / 60 Limiti del modello di Norman Il modello di Norman serve a mettere in evidenza difficoltà di comunicazione tra utente e sistema+interfaccia. Non analizza la comunicazione tra sistema e interfaccia. I Estensione di Abowd e Beale. Luca Pulina (UNISS) L’Interazione 14 / 60 Modello di Abowd e Beale Interaction Framework Quattro componenti: 1 Utente (U) 2 Sistema (S) 3 Input (I) 4 Output (O) Luca Pulina (UNISS) L’Interazione 15 / 60 Interaction Framework Ogni componente ha il suo linguaggio Utente: linguaggio del compito (task) Sistema: linguaggio di base (core) Input: linguaggio di input Output: linguaggio di output Interazione: traduzione tra linguaggi Problemi di interazione = problemi di traduzione Luca Pulina (UNISS) L’Interazione 16 / 60 Interaction Framework – Utente L’utente ha un obiettivo che è: Tradotto in azioni attraverso l’input dell’interfaccia (articolazione). Tradotto in operazioni sul sistema, che cambia stato (prestazione). Tradotto nell’output dell’interfaccia (presentazione). Interpretato dall’utente (osservazione). Luca Pulina (UNISS) L’Interazione 17 / 60 Esempio Luca Pulina (UNISS) L’Interazione 18 / 60 Modello di Abowd & Beale Il modello di Abowd & Beale fornisce una cornice generale per la comprensione dell’interazione Non è ristretto ai sistemi computerizzati. Identifica i maggiori componenti coinvolti nell’interazione Permette valutazioni comparative dei sistemi Luca Pulina (UNISS) L’Interazione 19 / 60 Outline 1 I modelli per l’interazione 2 Modelli concettuali di interazione 3 Stili di Interazione Luca Pulina (UNISS) L’Interazione 20 / 60 Interazione Paradigmi: Particolare filosofia o modo di pensare l’interazione. Modelli concettuali: Descrizione del sistema in termini di idee e concetti integrati sul suo funzionamento, comportamento e modo di presentarsi (es. metafora). Stili: Modalità concreta attraverso la quali l’utente può comunicare o interagire con il sistema. Luca Pulina (UNISS) L’Interazione 21 / 60 Modello concettuale Descrizione del sistema in termini di idee e concetti integrati sul suo funzionamento, comportamento e modo di presentarsi. L’elenco dei modelli non è esaustivo, nè i modelli sono tra loro mutuamente esclusivi. Tre modelli concettuali: I I I quello del progettista quello implementato dal sistema quello che si forma l’utente I tre modelli devono coincidere! Luca Pulina (UNISS) L’Interazione 22 / 60 Modelli basati sull’attività Fornire istruzioni (comandi) I I Utente fornisce istruzioni al sistema su cosa fare Es: Videoregistratore, HiFi, computer Unix o DOS Conversare I I Il sistema si comporta come un interlocutore di una conversazione Es: Sistemi di prenotazione telefonica Manipolare e navigare I Manipolazione di oggetti virtuali e navigazione in spazi virtuali ⇒ manipolazione diretta Esplorare e sfogliare I L’utente può esplorare e “sfogliare” l’informazione ⇒ ipertesto Luca Pulina (UNISS) L’Interazione 23 / 60 Manipolazione diretta (1/2) Gli oggetti di interesse sono rappresentati nella UI (es. i file) e l’utente li manipola (compie azioni su di essi) in modo diretto (trascino con il mouse) Principi (Schneiderman 1982): I I I Visibilità dell’oggetto di interesse Azioni incrementali, reversibili, con feedback immediato Sostituzione di comandi dalla sintassi complicata con azioni Luca Pulina (UNISS) L’Interazione 24 / 60 Manipolazione diretta (2/2) Vantaggi: Facile da apprendere Evita errori Incoraggia esplorazione Punta sul riconoscimento (invece che sul ricordo) Svantaggi: Gli utenti esperti possono preferire metodi più snelli Non tutte le operazione si possono rendere in termini di manipolaione di oggetti Luca Pulina (UNISS) L’Interazione 25 / 60 Manipolazione diretta e indiretta – Esempi Ufficio: manipolazione diretta I L’utente interagisce con un mondo artificiale Industria: manipolazione indiretta I I L’utente interagisce con il mondo reale attraverso l’interfaccia Problemi: feedback, ritardi Luca Pulina (UNISS) L’Interazione 26 / 60 Modelli basati su oggetti Modulo da riempire I L’interfaccia è un modulo che l’utente deve compilare Agente I I I L’interfaccia è un agente che esegue compiti stabiliti dall’utente È l’opposto della manipolazione diretta Esempi: filtro anti-spam, assistente di Office, ... Luca Pulina (UNISS) L’Interazione 27 / 60 Interfaccie basate su agenti Caratteristiche dei compiti adatti per agenti (Beale & Wood, 1994): Adattamento: il compito richiede adattabilità, come apprendere ad evitare errori ed adattarsi alle preferenze dell’utente. Ricerca: il compito non è ben definito e dunque il software deve tentare varie opzioni. Dimostrazione: il compito comporta l’insegnamento su come fare qualcosa. Guida: il compito richiede co-operazione tra umano e agente. Autonomia: il task richiede di essere seguito, ma non richiede input dall’utente, per cui ha senso delegare. Asincronia: il compito presenta un ritardo significativo tra il suo inizio e la fine. Luca Pulina (UNISS) L’Interazione 28 / 60 Metafore L’essenza della metafora è comprendere ed avere esperienza di una cosa in termini di un’altra. Producono modelli concettuali (basati sull’attività o sull’oggetto o altro). Forniscono all’utente analogie ⇒ aiutano il problem solving. Rendono l’interfaccia familiare e facilitano l’apprendimento. Può essere fuorviante: gli utenti potrebbero prendere la metafora alla lettera e farsi un modello concettuale sbagliato del sistema. Luca Pulina (UNISS) L’Interazione 29 / 60 La metafora del Desktop Il video “è” la scrivania dell’utente Documenti, cartelle Disordine! Luca Pulina (UNISS) L’Interazione 30 / 60 Critiche all’uso di metafore Comporta sempre delle forzature (il cestino non è sopra la scrivania...) La metafora potrebbe entrare in conflitto con principi di progetto (v. più avanti). Incapacità di comprendere il funzionamento del sistema oltre alla metafora. Limita l’immaginazione del progettista nell’escogitare nuovi modelli concettuali. Luca Pulina (UNISS) L’Interazione 31 / 60 Outline 1 I modelli per l’interazione 2 Modelli concettuali di interazione 3 Stili di Interazione Luca Pulina (UNISS) L’Interazione 32 / 60 Gli Stili (1/2) Sono le modalità concrete attraverso le quali l’utente può comunicare o interagire con il sistema Interfaccia a linea di comando (fornire istruzioni) Interrogazione (fornire istruzioni) Selezione in un menu (fornire istruzioni) Linguaggio naturale Domanda/risposta (dialogare) Compilazione di moduli (modulo) Fogli elettronico (modulo) Point & click (esplorare e sfogliare) WIMP (manipolazione diretta) Luca Pulina (UNISS) L’Interazione 33 / 60 Gli Stili (2/2) Gli stili di interazione si possono inquadrare in uno (o più) modelli concettuali. Tutti questi stili non sono fra loro mutuamente esclusivi ma possono essere combinati a seconda delle applicazioni. Lo stile più adatto dipende anche dal profilo dell’utente e dal compito. Luca Pulina (UNISS) L’Interazione 34 / 60 Interfaccia a linea di comando (1/2) Comunica istruzioni direttamente al computer. Parole chiave, combinazioni di tasti. Adatto per compiti ripetitivi e utenti esperti. Accesso diretto alle funzionalità del sistema. Si basa sul ricordo. Elevato sforzo cognitivo per l’utente. Luca Pulina (UNISS) L’Interazione 35 / 60 Interfaccia a linea di comando (2/2) Vantaggi: Flessibile Iniziativa di dialogo all’utente Piace agli utenti esperti Supporta la creazione di script o macro Pemette l’interazione con computer remoti anche con rete lenta Svantaggi: Difficile da ricordare Difficile da imparare Errori di battitura Cambiamento di stato non visibile Inadatto a non esperti Luca Pulina (UNISS) L’Interazione 36 / 60 Interfacce di interrogazione (query) L’utente deve specificare un’interrogazione (query) Sono usate principalmente nelle basi di dati e nei sistemi di recupero delle informazioni. La query viene espressa in un linguaggio di interrogazione (ad es., SQL). Richiede la conoscenza della struttura del database e della sintassi del linguaggio di interrogazione. Sono adatte per utenti esperti Luca Pulina (UNISS) L’Interazione 37 / 60 Menu (1/3) Luca Pulina (UNISS) L’Interazione 38 / 60 Menu (2/3) L’interazione avviene mediante selezione, da parte dell’utente, di una o più opzioni tra l’elenco di quelle visualizzate. Le opzioni sono visibili: si basa più sul riconoscimento che sul ricordo (minor sforzo cognitivo). Può essere di solo testo oppure grafico. La scelta può avvenire per mezzo di numeri, lettere, tasti cursore o del mouse. Spesso sono organizzati per raggruppamenti gerarchici. Adatto ad utenti con bassa conoscenza del sistema ed a compiti strutturati. Luca Pulina (UNISS) L’Interazione 39 / 60 Menu (3/3) Vantaggi: Ideale per i novizi o utenti occasionali Incoraggia l’esplorazione Mostra tutte le funzionalità Non richiede abilità di battitura Svantaggi: Occupa spazio video Troppi menu fanno confusione, sovraccarico informativo. Non adatto a compiti ripetitivi Luca Pulina (UNISS) L’Interazione 40 / 60 Linguaggio Naturale Sistemi per il riconoscimento automatico del linguaggio Vantaggi: Familiare all’utente Svantaggi: Ambiguità Difficile da realizzare in maniera completa Luca Pulina (UNISS) L’Interazione 41 / 60 Domanda/Risposta (1/2) L’interazione avviene attraverso risposte fornite dall’utente a domande formulate dal sistema. Adatto a sistemi con funzionalità ristrette. Adatto ad utenti con poca esperienza del compito e scarsa del sistema. Luca Pulina (UNISS) L’Interazione 42 / 60 Domanda/Risposta (2/2) Vantaggi: Facile da imparare Semplice da usare Svantaggi: Iniziativa di dialogo del sistema Poca flessibilità Limitata potenza Luca Pulina (UNISS) L’Interazione 43 / 60 Compilazione di moduli (1/3) Luca Pulina (UNISS) L’Interazione 44 / 60 Compilazione di moduli (2/3) L’interazione avviene mediante compilazione, da parte dell’utente, di moduli simili ai documenti cartacei. Adatte per compiti d’ufficio I I inseririmento dati recupero dell’informazione (es. Biblioteca) Stile familiare anche ad utenti inesperti grazie alla metafora del modulo cartaceo. Luca Pulina (UNISS) L’Interazione 45 / 60 Compilazione di moduli (3/3) Vantaggi: Facile da apprendere Poco carico cognitivo Facilita l’inserimento dati Aggiornamento visibile Svantaggi: Richiede abilità di battitura Poco flessibile Luca Pulina (UNISS) L’Interazione 46 / 60 Foglio elettronico (1/2) Luca Pulina (UNISS) L’Interazione 47 / 60 Foglio elettronico (2/2) L’interazione avviene tramite inserimento dati, da parte dell’utente, in una griglia di celle predefinita. Variante sofisticata della compilazione di moduli. È programmabile. Le celle possono contenere valori o formule. Le formule fanno riferimento a valori contenuti in altre celle. Quando un dato viene modificato dall’utente, automaticamente si modificano tutti quelli che dipendono da questo. Ogni cella può essere un input o un output. Adatto ad utenti con sufficiente conoscenza sia del compito che del sistema. Luca Pulina (UNISS) L’Interazione 48 / 60 Point & Click (1/2) Luca Pulina (UNISS) L’Interazione 49 / 60 Point & Click (2/2) L’utente deve semplicemente “cliccare” sull’elemento di interesse: I I I Icona Hyperlink Locazione su una mappa Si può usare in I I Applicazioni multimediali e/o ipertestuali (es: web browser) Biglietterie automatiche o punti di informazione La digitazione è ridotta al minimo Luca Pulina (UNISS) L’Interazione 50 / 60 Interfaccia WIMP (1/3) Luca Pulina (UNISS) L’Interazione 51 / 60 Interfaccia WIMP (2/3) WIMP = Windows, Icons, Menus, Pointers È lo stile della maggioranza degli attuali PC (MS Windows, Apple Mac OS, ...). L’ interazione avviene mediante operazioni (puntamenti, trascinamenti, etc...) effettuate dall’utente su oggetti virtuali (bottoni, icone,etc.). Adatto ad utenti con scarse conoscenze del sistema e una discreta conoscenza del compito. Incarna il modello della manipolazione diretta. Luca Pulina (UNISS) L’Interazione 52 / 60 Interfaccia WIMP (3/3) Vantaggi: Facile da imparare Le operazioni sono spesso reversibli Flessibile Feedback istantaneo Intuitivo Svantaggi: Può essere inefficiente Occupazione di spazio video Più costoso da programmare Luca Pulina (UNISS) L’Interazione 53 / 60 Elementi della WIMP Gli elementi di una GUI si chiamamo widget (window gadget) Yahoo! widgets Luca Pulina (UNISS) L’Interazione 54 / 60 Elementi della WIMP – Finestre Aree dello schermo che si comportano come se fossero indipendenti Possono contenere testo o oggetti grafici. Possono essere spostate o ridimensionate. Possono affiancarsi o sovrapporsi ed oscurarsi a vicenda. Barra di scorrimento (scrollbar): permette di muovere il contenuto della finestra sopra e sotto o da un lato all’altro. Barra del titolo (title bar): descrive il nome della finestra. Luca Pulina (UNISS) L’Interazione 55 / 60 Elementi della WIMP – Icone e Puntatori Icone (Icons) Sono piccole immagini o figure usate per rappresentare alcuni oggetti dell’interfaccia o un’azione. Le finestre possono essere chiuse (iconificate), ovvero rappresentate da una icona. Puntatori (Pointers) Identifica una corrispondenza spaziale fra lo schermo e la posizione fisica del mouse. Tipicamente una piccola freccia, ma può cambiare (es. mano o clessidra). Luca Pulina (UNISS) L’Interazione 56 / 60 Elementi della WIMP – Menu Scelta (tramite il puntatore) di operazioni elencate sul display. Alleggeriscono il compito della memoria a breve termine. Non bisogna mettere troppe voci, meglio usare menu a cascata (cascading menu) I la selezione di un menu apre un altro menu adiacente. Menu principale visibile sempre come barra dei menu. Varie tipologie di menu: I I I Menu a tendina (pull-down) Menu fall-down: simili ai menu a tendina, ma non serve fare click Menu a comparsa (pop-up), appaiono dove si clicca Luca Pulina (UNISS) L’Interazione 57 / 60 Elementi della WIMP – Pulsanti Singole regioni di uno schermo che se selezionate invocano un’azione. Altri tipo di pulsanti: I I Radio button: se la scelta è mutuamente esclusiva Check box: se permette scelte non esclusive Luca Pulina (UNISS) L’Interazione 58 / 60 Elementi della WIMP – Barra degli strumenti Serie di piccoli pulsanti, simile alla barra dei menu Contiene funzionalità usate di frequente, o raggruppate per categoria Personalizzabili Luca Pulina (UNISS) L’Interazione 59 / 60 Elementi della WIMP – Finestre di dialogo Finestre di informazione che appaiono per segnalare eventi importanti o per richiedere alcuni dati. Esempio: quando si sta salvando un file, appare una finestra di dialogo che richiede all’utente di specificare il nome del file e la locazione. Quando il file è stato salvato la finestra sparisce. Modali: bloccano l’applicazione finchè non vengono chiuse I Serve per garantire che gli errori vengano corretti al momento giusto o che tutte le informazione per completare un compito essenziale siano disponibili. Luca Pulina (UNISS) L’Interazione 60 / 60