Interazione Avanzata: introduzione Stefano Levialdi 9 marzo, 2010 definizione studia la relazione tra le persone (utenti) e computer (programmi) per la progettazione e lo sviluppo di sistemi interattivi che siano usabili ed accessibili, affidabili e che supportino e facilitino le attività� umane utilizzando informatica, psicologia, scienze cognitive, ergonomia, design, teorie della comunicazione 2 interazione fra umani: casuale fra umani e macchine: deterministica comunicativa multimodale monomodale ripetuta (-) multimediale (+) 3 CS vs WS: informatica vs scienza della rete I Metrica Legge di Moore Viste di pagine Ordine (n) algor. Visitatore/mese Gygabytes N° canzoni/video (Sir Tim Berners-Lee - 2007) 4 CS vs WS: informatica vs scienza della Argomenti rete II Reti calcolatori Reti sociali Commut- pachetti Voce su IP, condiv. musicale Informazione Relazioni Linguaggi prog. Wikis, blogs,tags Basi dati, sistemi operativi, e-government, e-learning, Compilatori info medica, finanziaria Grafica 3-D, algo di rendering, Creazione e condivisione, Mappe, geometria computazionale Animazione, musica, foto,video 5 clips. CS vs WS: informatica vs scienza della rete III Fuoco Tecnologia Applicazioni Calcolatori Utenti Supercalcolatori Dispositivi mobili Programmatori efficaci Usabilità universale 6 i “soci” 7 i 5 (?) sensi umani elemento base è il sensore ogni sensore è mirato ad una specifica sensazione gli occhi per il rilevamento della luce nelle orecchie abbiamo sensori che rivelano l’orientamento sulla lingua abbiamo ricettori per il gusto nei muscoli abbiamo sensori che rivelano il movimento e tensione relativi nella vescica abbiamo sensori che indicano il bisogno di urinare ecc. ecc. sommando tutti riusciamo ad elencare fra 14 e 20 sensi diversi ! 8 i sensi e l’interazione la vista: il tatto: mouse - tastiera - guanto - abito gesti - sensori di superficie l’udito/parlato: GUI - linguaggi visivi - frasi visive sguardo - movimenti oculari risposte vocali/comandi vocali il gusto - l’olfatto: nulla per ora... 9 quale è il “nocciolo duro” della interazione? sostenere e facilitare le diverse attività umane in situazioni di elevato numero di dati - anche multimediali utilizzare sensori di varia natura sviluppare nuovi paradigmi per consentire la ricerca, l’organizzazione, l’integrazione dell’informazione e l’apprendimento in breve: lavorare, comunicare, prendere cura, giocare, apprendere, monitorare... 10 i seminari Casi di studio - 1 - e-learning Casi di studio - 2 - sup. all’hand. Casi di studio - 3 - gener. artefatti Interazione avanzata su Web: dai plugin ad AJAX Metodi formali nel progetto di modelli di utente Progettazione di sistemi collaborativi Progettazione di sistemi contextaware: gestione di contesti culturali, geografici, di dispositivo Sistemi di progettazione di contenuti informativi e multimediali Sistemi di gestione di contenuti informativi e multimediali Realtà virtuale, realtà aumentata e realtà interpretata Progettazione di strumenti virtuali e performance artistiche Metodi formali nel progetto dell'interazione Progettazione di Sistemi Interattivi relativamente al Contesto ed al Tempo Rappresentazione e accesso a grandi quantità di dati/visualizzazione Usabilità per i sistemi mobili prove studenti 11 umano vs calcolatore influenza comportam. conoscenza memoria terminazione modi stato mutua non preved. irreversibile non codificata distribuita associativa con decadim. da ogni uomo mutua preved. (fortunatamente) reversible codificata distribuita indirizzi logici cancellab. impossibile a meno di crash! amodale generalmente modale storia passata classe di prog. equival. scopo programmi 12 di cosa si occupa l’interazione avanzata? l’interazione mira a sfruttare i contenuti esistenti in diverse discipline, necessari per la progettazione di sistemi e ad implementare sistemi di calcolo che possano sostenere le diverse attività degli utenti in particolare, l’interazione uomo-macchina, tende ad integrare diverse discipline: sociali, cognitive, percettive informatiche, elaborazione di segnali, apprendimento delle macchine 13 il ruolo dell’interazione nuovi paradigmi computazionali per progettare e costruire sistemi che sostengono ed arrichiscono la vita delle persone: lavorativa, ludica, sportiva alcuni temi rilevanti: interazione multimodale: corporale, gestuale, orale, verbale, oculare interazione fra umano e calcolatore e quella fra umani via calcolatore in modo naturale e flessibile basi di dati di immagini per facilitare l’organizzazione, indicizzazione e recupero di elementi della base attività sperimentali, emotive, culturali e sociali durante la computazione ricerca interattiva, interfacce ad agenti collaborazione via computer, calcolo ubiquo contesto dell’utente, modellazione del compito modellazione rispetto alle dinamiche sociali, etnocomputing 14 com. interattiva ed i media Gesso e lavagna Lucidi e lavagna luminosa Diapositive e videoproiezione 1) Acqua 2) Aria Gesso e lavagna Lucidi e lavagna luminosa Diapositive Pagine e videoproiezione web, documenti multimediali Pagine web, documenti multimediali 15 obiettivi della progettazione della interazione I Usabilità facilità di apprendimento efficacia efficienza d’uso sicurezza d’uso utilità coerenza facilità di rammentazione Regola dei 10 minuti (Nelson 1980) 16 obiettivi della progettazione della interazione II Esperienza d’uso sistemi in grado di dare soddisfazione all’utente piacevoli da usare - divertenti - utili capaci di sostenere le motivazioni capaci di alimentare la creatività gratificanti che soddisfino i bisogni emotivi 17 usabilità ed esperienza d’uso divertimento soddisfazione bisogni emotivi efficienza godibilità gratificazione + ricordo efficacia usabilità + apprendim. + intrattenere sicurezza + creatività utilità + aiuto + estetica + motivazione non tutti i requisiti sono sempre compatibili: bisognerà trovare compromessi... 18 concettualizzando l’interazione comprensione dello spazio del problema i modelli concettuali: il sistema, come insieme di idee e concetti integrati su ciò che esso deve fare e come esso viene visualizzato in modo tale da essere compreso dall’utente i diversi modelli concettuali: basati su attività basati su oggetti 19 modelli basati su attività attività: istruire conversare manipolare e navigare esplorare e sfogliare non sono mutuamente esclusive esempio dell’assistente turistico 20 istruire l’interazione si basa su comandi, istruzioni precise che ottengono effetti prevedibili adeguata per compiti ripetitivi è veloce ed efficiente esempio: VCR, HiFi, etc. 21 conversare analogo ad una interazione fra umani il sistema risponde come se...fosse un altro individuo esempio: sistemi di assistenza, motori di ricerca, supporto alle decisioni può basarsi sul riconoscimento del parlato, su interrogazioni è sicuramente semplice per non esperti può risultare lento e tedioso (automated call centers) sono anche stati introdotti agenti animati per 22 creare l’illusione di avere un interlocutore umano manipolare e navigare rappresentazione continua degli oggetti ed azioni rilevanti azioni rapidamente reversibili azioni fisiche ed impiego di tasti invece della sottomissione di comandi in sintesi: manipolazione diretta: m.d. 23 vantaggi della m.d. 1. 2. 3. 4. 5. 6. aiuta i principianti ad apprendere le azioni elementari gli utenti esperti possono lavorare velocemente gli utenti casuali possono ricordare le azioni senza oblio gli utenti vedono inmediatamente i risultati gli utenti soffrono di minore ansietà gli utenti rapidamente diventano pratici e si sentono padroni delle applicazioni 24 Apple Computer © (1987) metafore visive della scrivania uice kT im F e™ euncom p cces omsprares sQor (N o so node e n iper visTIua lizzar enqu est r'imess mo g)ine. a metafore auditive della scrivania shhhlicc - per “aprire”i files crouik - per “chiudere” i files m.d. anche in videogiochi, strumenti per la visualizzazione, e sistemi CAD 25 esplorare e sfogliare consentire agli utenti di esplorare e sfogliare come se si trovassero nel mondo reale su media fisici i media fisici: biblioteche, depliants, riviste, libri... esempi: portali, siti web, CDRoms, DVD...vengono concettualizzati come se fossero fisicamente esistenti 26 modelli basati su oggetti come viene impiegato un oggetto in un particolare contesto esempio: il foglio elettronico (Bricklin) esso simula un rapporto aggiornabile di movimenti finanziari (mirato ai contabili) creare un foglio analogo al “movimento di cassa” renderlo interattivo, consentendo all’utente di inserire dati e modificare i calcoli a volontà per potere osservare i risultati fare eseguire i calcoli “necessari” 27 acquisti su web le modalità interattive sono diverse: esplorazione su web conversazione con un agente commerciale istruzioni di completamento del modulo di pagamento con carta di credito i modelli concettuali d’interazione sono ibridi e dipendono fortemente dall’applicazione 28 personalizzando un avatar amichevole 29 Price Wormer 30 metafore per l’interfaccia basate sulla combinazione di conoscenza famigliare con nuovi concetti pro: files gomma... facili da capire ed usare uso di “pipe” in Unix contro: dalla emulazione alla simulazione (le cose funzionano in modo diverso nel mondo reale) contradizioni logiche e culurali (cestino sotto la scrivania) troppo vincolanti (eccessivi annidamenti) 31 ...ancora contro impediscono di comprendere il vero meccanismo del sistema al di là della metafora (la metafora limita la comprensione alle azioni elementari) ereditano sistemi mal progettati (calcolatori da tavolo) limita la fantasia del progettista alle metafore (anelli di catena per rappresentare connessione) Le metafore vanno usate con criterio, in genere sono utili e valide ma non possono essere l’unica forma di concettualizzazione 32 interagire con il Titanic 747 Jumbo:70.683 m (Boeing 747) RMS Titanic:268.986 m 33 ≠ realtà... ≠ interazioni real objects canale ottico telepresence canale tattile virtual reality canale visuale enacted reality canale presenziale 34 paradigmi di interazione inizialmente si pensava: singolo utente una sola unità centrale di elaborazione un monitor una tastiera un mouse ora le tecnologie senza fili, mobili, pervasive, ubique, indossabili, ... hanno modificato radicalmente i paradigmi di interazione 35 calcolo ubiquo I la prima generazione era quella dei grossi calcolatori degli anni ’50 – a valvole – la seconda è stata quella dei personal computers o PC – anni 70-80 e la terza è quella attuale, detta di calcolo ubiquo, anche chiamata della tecnologia morbida Alan Kay, della Apple, ha chiamato il calcolo ubiquo il “Terzo Paradigma”. la computazione viene integrata con l’ambiente 36 calcolo ubiquo II gli utenti sfruttano le potenze di calcolo (e di comunicazione) presenti su sistemi integrati ad edifici, pareti, mobili, etc. interagiscono con essi attraverso gesti, parole, sguardi o movimenti corporali i sistemi integrati nell’ambiente dovranno essere sensibili ai cambiamenti del loro habitat adeguandosi ad esso automaticamente agiscono sulla base del fabbisogno dell’utente e delle sue preferenze. esempi di applicazioni: 1. sistema GPS collegato ad un navigatore in un automobile fornendo le indicazioni necessarie per arrivare a destinazione, 37 2. un lettore di codice a barre di prodotti di un supermercato evoluzione della computazione Mark Weiser, Mediated Spaces, http://www.research.ibm.com/journal/sj/384/mark.html 38 calcolo affettivo I L’affetto include il modo, l’emozione ed i sentimenti: caratteristiche fondamentali dell’umano che influenzano notevolmente i suoi riflessi, la sua percezione, la sua conoscenza ed il suo comportamento Il sistema affettivo è: giudicante, assegna in modo veloce ed efficiente valenze positive e negative all’ambiente mentre il sistema cognitivo: interpreta tali valenze e fornisce un significato al mondo circostante. 39 calcolo affettivo II La qualità affettiva: abilità di un oggetto o stimolo a modificare l’attaccamento di una persona a quell’oggetto. I dati sperimentali ottenuti sulla interazione uomo-macchina: la qualità affettiva o edonistica di una interfaccia ha un impatto positivo sulla usabilità percepita dall’utente rispetto a tale interfaccia. Stato di una persona (affettivo, sentimentale, modale): di natura fisiologica, consciamente accessibile e semplice, non riflessivo: una miscela, a livello sentimentale di piacere/dispiacere avendo quindi valori buoni/cattivi che generano interesse/repulsione in misura proporzionale all’impegno che la persona ritiene di volere assumere. Questo stato è: di natura primitiva, universale, ubiqua ed è il cuore di ogni tipo di evento portatore di emozioni. 40 calcolo indossabile Calcolatore assorbito nello spazio personale dell’utente operatività, interattività, sempre accesibile ed utilizzabile. Uno (o più) dispositivi sempre in grado di ricevere ed eseguire i comandi che ricevono in qualunque situazione il calcolatore indossabile (WearComp) ha tutte le funzionalità di un sistema programmabile: valido per applicazioni generali riconfigurabile essendo però anche intimamente legato a chi lo indossa. Tre modalità operative: 1) costanza (constancy) 2) magnificazione (augmentation) 3) mediazione (mediation) 41 criteri di usabilità rendere le cose visibili fornire controreazione fornire vincoli fornire una applicazione naturale fornire affordance 42 interazione nel contesto interazione “ricca” - reale contesto fisico e sociale dell’interazione analisi posizione-evento (semi-formale) uno strato del sistema a tutti i livelli di astrazione aspetti del lavoro catturati da una rigorosa analisi dei compiti nella collaborazione: chi fa che cosa, cosa dobbiamo sapere e quando, eventi: iniziano attività, modelli degli artefatti e segnaposti per mantenere la traccia 43 della evoluzione. notazioni orientate alle posizioni select ‘graphics” pop-up graphics submenu Main menu orientate agli eventi select ‘text” pop-up text submenu Graphics submenu Text submenu select ‘paint” Paint submenu pop-up paint submenu action: user-event x (current/history of) input-status x state response-event x (new) state interstitial behaviour: (current history of) input-status x state output-status 44 status ed event l’interazione deve potere rappresentare sia le posizioni che gli eventi (situazioni) posizioni* stati ad esempio: posizione del mouse, contenuti dello schermo e anche stato del sistema posizione essere evento fare si può sempre interrogare “la posizione” ma l’evento avviene e...ci si chiede “quando” l’approccio situazione-evento si basa su: 1) modello semi-formale di interazione 2) previsioni psicologiche sulla reazione dell’utente * con valore persistente 45 diversi livelli... astrazione a diversi livelli 1. 2. 3. 4. di utente schermo dialogo applicazione eventi percepiti ad ogni livello e le relative modifiche di posizione + le risposte psicologiche dell’utente evidenziano eventuali eccezioni fra schermo ed utente quindi da evitarsi nel progetto 46 Giovanni e Laura Giovanni ha un appuntamento con Laura ogni pochi minuti G. guarda l’orologio e vede che si avvicina l’ora dell’appuntamento Laura deve fare un regalo a Giovanni L. vede sul suo calendario che fra pochi giorni G. compie gli anni e decide di fargli un regalo 47 esempi applicativi posizione: data dall’orologio di G. che fornisce sempre il tempo (analogico) - data dal calendario che fornisce sempre la data (discreta) eventi: superata la soglia temporale per andare all’appuntamento, G. esce - se avesse usato la sveglia, l’orologio ha sia posizione che evento (suona) - L. va ad acquistare il regalo, il giorno del compleanno polling: G. guardava periodicamente il suo orologio. E’ un modo standard per trasformare una posizione in un evento. reale vs. percepito: vi sono spesso intervalli fra gli eventi accaduti e quelli percepiti (G. ha visto l’orologio prima e...qualche minuto dopo la sua soglia) granularità: l’appuntamento e la data di compleanno hanno scale temporali molto diverse - cambia l’interpretazione di48 eventi e posizioni in funzione della scala temporale. implicazioni progettuali le applicazioni devono generare eventi per gli utenti, impiegando rappresentazioni bisogna tenere conto della scala dei tempi non generando eventi troppo velocemente o lentamente G. può semplicemente usare un “tempo max”(sveglia) L. non può trovare il “momento giusto” per la sua sveglia 49 percezioni... analisi e previsione di stimoli per catturare l’attenzione dell’utente dove guarda? spostando il mouse guarderà al bersaglio tipicamente, ma non sempre, sul punto di inserimento nel testo ad intervalli, sullo schermo, l’apparizione di un messaggio garantirà necessariamente l’attenzione bisogna mettere le informazioni dove esse siano visibili eventi non previsti devono catturare l’attenzione via suoni, campanelli, etc. la visione periferica nota rapidamente eventuali spostamenti anche cambiamenti repentini di colore sono facilmente 50 visibili cambiamento di posizione evento-posizione: e-mail evento G. invia un messaggio a L. il messaggio è ricevuto polling vede se il file è cambiato cambia icona polls evento percepito dall’utente file system applicazione e-mail schermo utente tempo 51 analisi vari agenti attivi (G., l’applic. e-mail, ed L.) generano eventi mediati da elementi di posizione (il deposito di files e lo schermo) vi sono anche sistemi con connessioni dirette: eventi-eventi o anche posizioni-posizioni - x esempio: mouse-cursore su schermo vediamo il fuzionamento: se il messaggio era “Fuoco: scappate!” allora la scala dei tempi lo rendeva poco utilizzabile (il polling della applic. e-mail è ciclico ad intervalli) è possibile cambiare gli intervalli: minuti, quarto d’ora, ora... 52 interfacce x e-mail esame esplicito suoneria udibile appena arriva il messaggio di posta facce animate polling a scala ridotta secondo chi scrive, esiste un volto animato che lo rappresenta, la posta ricevuta viene così identificata ciò che si vuole è: un evento garantito in una scala temmporale di minuti 53 evento-posizione: tasto tasto: widget standard l’interazione è determinata dall’ambiente di widgets disponibili problema: l’utente pensa di avere attivato il tasto...ed invece NO esempio: cancellazione di testo 54 cancellazione I L. seleziona del testo (mouse down) L. sposta il mouse (mouse up) fino al tasto “delete” L. preme (mouse down) sul tasto “delete” Il testo selezionato non viene eliminato delete dall’applicazione Il tasto funziona solamente per mouse up Non vi è feedback per l’utente sull’azione compiuta 55 cancellazione II - nil mouse “down” su delete evidenzia delete spostamento da delete elimina evidenzia nessun feedback applicazione dialogo mouse “up” schermo utente 56 cancellazione II - ok mouse “down” su delete esegui delete evidenzia delete mouse “up” elimina evidenzia modifica il testo applicazione dialogo chiusura non si percepisce feedback schermo utente 57 soluzioni il dialogo deve fornire un evento: flash suono un utente esperto può ignorare il risultato di errare l’azione sul tasto un utente principiante controllerà ogni passo e quindi scorgerà se il “delete” ha funzionato valutazioni di usabilità con utenti “non esperti” potrebbero fornire dati invalidi... 58 conclusioni l’interazione avviene fra due soci: l’utente/i ed il programma il primo non è prevedibile - il secondo lo deve essere gli strumenti ed i metodi che descrivono l’interazione, dipendono dalla tecnologia scelta, dalla applicazione e dalla classe di utenti i modelli formali, l’analisi dei requisiti, ed il modello dell’utente, sono i ferri del mestiere dell’informatico esperto nella Interazione 59 bibliografia I Suggested Readings in Human Computer Interaction (HCI), User Interface (UI) Development, & Human Factors (HF) Gary Perlman http://hcibib.org/readings.html Designing Web Usability Jakob Nielsen, MacMillan Computer Publishing, New York, 2000 Jared Spool sito commerciale www.useit.com Human-Computer Interaction, A. Dix, J. Finlay, G. Abowd, R. Beale, 3rd edition, 2004 Prentice Hall, www.hiraeth.com/books/hci Designing the User Interface Ben Shneiderman, AddisonWesley, New York, 1998, 3rd Edition http://www.aw.com/DTUI Interaction Design Preece, Rogers, Sharp, John Wiley & Sons, New York, 2002 60 bibliografia II IADIS International Conference Interfaces and Human Computer Interaction 2010. 28 Jul 2010 → 30 Jul 2010; Freiburg, Germany, www.ihci-conf.org/ and part of IFIP, www.wcc2010.com/HCI2010/ CHI (ACM Conference on Human Factors in Computing Systems) 28th Conference http://chi2010.org/ Atlanta USA Oct 3, 2010 - Oct 6, 2010, New York City, Apr 2, 2010. HCI-Aero 2010, International Conference on Human-Computer Interaction in Aeronautics, http://www.interaction-design.org/ 2010-09-07 2010-09-10, Mobile HCI 2010, 12th International Conference on Human-Computer Interaction with Mobile Devices and Services, Lisbon, Portugal, http://mobilehci2010.di.fc.ul.pt/ HCI 2010 conference details for the World Computer Congress 2010, Brisbane, Australia, IHCI 2010 has a wide scope covering various facets of HCI. Allahabad, India, http://hci.iiita.ac.in/ Designing Interactive Systems Conference 2010 16 Aug 2010 → 20 Aug 2010, Aarhus, Denmark http://www.dis2010.org NordiCHI 2010 October 16-20 Reykjavic, Iceland www.nordichi2010.org 61 HCI Topics @ Interfaces & HCI 2010 in Freiburg - Affective User-centred analysis, design and evaluation - The value of Affective Interfaces/ Systems/Application/ Interaction - Generational differences and technology design - Measurement of success of emotional technology/interfaces - Supporting user populations from difference generations - Supporting user populations with Physical Disabilities - Supporting user populations with Intellectual Disabilities - Creativity Support Systems - Emotional Design issues/methods/experiences for novel interfaces including tangible, mixed reality interfaces and multi-modal interfaces - Emotional Design issues/methods/experiences for mobile and ubiquitous computing - Usability - User studies and fieldwork - Methodological implications of emotional user studies. - Participatory design and cooperative design techniques - Ethical issues in emotional design - HCI education and design education 62 - Eliciting User Requirements 63