Interazione Avanzata: introduzione Stefano Levialdi 9 marzo, 2010.

Presentazione sul tema: "Interazione Avanzata: introduzione Stefano Levialdi 9 marzo, 2010."— Transcript della presentazione:

1

2 Interazione Avanzata: introduzione Stefano Levialdi 9 marzo, 2010

3 2 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

4 3 interazione fra umani: casuale fra umani e macchine: deterministica comunicativa multimodale monomodale ripetuta (-) multimediale (+)

5 4 CS vs WS: informatica vs scienza della rete I Metrica Legge di MooreViste di pagine Ordine (n) algor.Visitatore/mese GygabytesN° canzoni/video (Sir Tim Berners-Lee - 2007)

6 5 CS vs WS: informatica vs scienza della rete II Argomenti Reti calcolatoriReti sociali Commut- pachettiVoce su IP, condiv. musicale InformazioneRelazioni Linguaggi prog.Wikis, blogs,tags Basi dati, sistemi operativi,e-government, e-learning, Compilatoriinfo medica, finanziaria Grafica 3-D, algo di rendering, Creazione e condivisione, Mappe, geometria computazionale Animazione, musica, foto,video clips.

7 6 CS vs WS: informatica vs scienza della rete III Fuoco TecnologiaApplicazioni CalcolatoriUtenti SupercalcolatoriDispositivi mobili Programmatori efficaciUsabilità universale

8 7 i soci

9 8 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 lorientamento 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 !

10 9 i sensi e linterazione la vista: GUI - linguaggi visivi - frasi visive sguardo - movimenti oculari il tatto: mouse - tastiera - guanto - abito gesti - sensori di superficie ludito/parlato: risposte vocali/comandi vocali il gusto - lolfatto: nulla per ora...

11 10 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, lorganizzazione, lintegrazione dellinformazione e lapprendimento in breve: lavorare, comunicare, prendere cura, giocare, apprendere, monitorare...

12 11 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 context- aware: 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

13 12 umano vs calcolatore influenzamutuamutua comportam.non preved.preved. (fortunatamente) irreversibilereversible conoscenzanon codificata codificatadistribuita memoriaassociativa indirizzi logici con decadim. cancellab. terminazioneda ogni uomoimpossibile - a meno di crash! modiamodalegeneralmente modale statostoria passata classe di prog. equival. scopo programmi

14 13 di cosa si occupa linterazione avanzata? linterazione 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, linterazione uomo-macchina, tende ad integrare diverse discipline: sociali, cognitive, percettive informatiche, elaborazione di segnali, apprendimento delle macchine

15 14 il ruolo dellinterazione 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 lorganizzazione, 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 dellutente, modellazione del compito modellazione rispetto alle dinamiche sociali, etnocomputing

16 15 com. interattiva ed i media Gesso e lavagna Lucidi e lavagna luminosa Diapositive e videoproiezione Pagine web, documenti multimediali 1)Acqua 2)Aria Gesso e lavagna Lucidi e lavagna luminosa Diapositive e videoproiezione Pagine web, documenti multimediali

17 16 obiettivi della progettazione della interazione I Usabilità facilità di apprendimento efficacia efficienza duso sicurezza duso utilità coerenza facilità di rammentazione Regola dei 10 minuti (Nelson 1980)

18 17 obiettivi della progettazione della interazione II Esperienza duso sistemi in grado di dare soddisfazione allutente piacevoli da usare - divertenti - utili capaci di sostenere le motivazioni capaci di alimentare la creatività gratificanti che soddisfino i bisogni emotivi

19 18 divertimento soddisfazione + motivazione usabilità bisogni emotivi godibilità + creatività gratificazione + intrattenere + aiuto+ estetica efficienza utilità efficacia+ ricordo sicurezza+ apprendim. usabilità ed esperienza duso non tutti i requisiti sono sempre compatibili: bisognerà trovare compromessi...

20 19 concettualizzando linterazione 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 dallutente i diversi modelli concettuali: basati su attività basati su oggetti

21 20 modelli basati su attività attività: istruire conversare manipolare e navigare esplorare e sfogliare non sono mutuamente esclusive esempio dellassistente turistico

22 21 istruire linterazione si basa su comandi, istruzioni precise che ottengono effetti prevedibili adeguata per compiti ripetitivi è veloce ed efficiente esempio: VCR, HiFi, etc.

23 22 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 creare lillusione di avere un interlocutore umano

24 23 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.

25 24 vantaggi della m.d. 1. aiuta i principianti ad apprendere le azioni elementari 2. gli utenti esperti possono lavorare velocemente 3. gli utenti casuali possono ricordare le azioni senza oblio 4. gli utenti vedono inmediatamente i risultati 5. gli utenti soffrono di minore ansietà 6. gli utenti rapidamente diventano pratici e si sentono padroni delle applicazioni

26 25 Apple Computer © (1987) metafore visive della scrivania metafore auditive della scrivania shhhlicc - per aprirei files crouik - per chiudere i files m.d. anche in videogiochi, strumenti per la visualizzazione, e sistemi CAD

27 26 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

28 27 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 allutente di inserire dati e modificare i calcoli a volontà per potere osservare i risultati fare eseguire i calcoli necessari

29 28 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 dinterazione sono ibridi e dipendono fortemente dallapplicazione

30 29 personalizzando un avatar amichevole

31 30 Price Wormer

32 31 metafore per linterfaccia basate sulla combinazione di conoscenza famigliare con nuovi concetti files gomma... pro: 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)

33 32...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 lunica forma di concettualizzazione

34 33 interagire con il Titanic 747 Jumbo:70.683 m RMS Titanic:268.986 m (Boeing 747)

35 34 realtà... interazioni real objects canale ottico telepresence canale tattile virtual reality canale visuale enacted reality canale presenziale

36 35 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

37 36 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 lambiente

38 37 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 nellambiente dovranno essere sensibili ai cambiamenti del loro habitat adeguandosi ad esso automaticamente agiscono sulla base del fabbisogno dellutente 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, 2. un lettore di codice a barre di prodotti di un supermercato

39 38 evoluzione della computazione Mark Weiser, Mediated Spaces, http://www.research.ibm.com/journal/sj/384/mark. html

40 39 calcolo affettivo I Laffetto include il modo, lemozione ed i sentimenti: caratteristiche fondamentali dellumano 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 allambiente mentre il sistema cognitivo: interpreta tali valenze e fornisce un significato al mondo circostante.

41 40 calcolo affettivo II La qualità affettiva: abilità di un oggetto o stimolo a modificare lattaccamento di una persona a quelloggetto. I dati sperimentali ottenuti sulla interazione uomo-macchina: la qualità affettiva o edonistica di una interfaccia ha un impatto positivo sulla usabilità percepita dallutente 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 allimpegno 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.

42 41 calcolo indossabile Calcolatore assorbito nello spazio personale dellutente 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)

43 42 criteri di usabilità rendere le cose visibili fornire controreazione fornire vincoli fornire una applicazione naturale fornire affordance

44 43 interazione nel contesto interazione ricca - reale contesto fisico e sociale dellinterazione 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 della evoluzione.

45 44 notazioni orientate alle posizioni orientate agli eventi 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 Paint submenu Text submenu Main menu select graphics pop-up graphics submenu select text pop-up text submenu select paint pop-up paint submenu Graphics submenu

46 45 status ed event linterazione 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 levento avviene e...ci si chiede quando lapproccio situazione-evento si basa su: 1) modello semi-formale di interazione 2) previsioni psicologiche sulla reazione dellutente * con valore persistente

47 46 diversi livelli... astrazione a diversi livelli 1. di utente 2. schermo 3. dialogo 4. applicazione eventi percepiti ad ogni livello e le relative modifiche di posizione + le risposte psicologiche dellutente evidenziano eventuali eccezioni fra schermo ed utente quindi da evitarsi nel progetto

48 47 Giovanni e Laura Giovanni ha un appuntamento con Laura ogni pochi minuti G. guarda lorologio e vede che si avvicina lora dellappuntamento 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

49 48 esempi applicativi posizione: data dallorologio di G. che fornisce sempre il tempo (analogico) - data dal calendario che fornisce sempre la data (discreta) eventi: superata la soglia temporale per andare allappuntamento, G. esce - se avesse usato la sveglia, lorologio 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 lorologio prima e...qualche minuto dopo la sua soglia) granularità: lappuntamento e la data di compleanno hanno scale temporali molto diverse - cambia linterpretazione di eventi e posizioni in funzione della scala temporale.

50 49 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

51 50 percezioni... analisi e previsione di stimoli per catturare lattenzione dellutente dove guarda? spostando il mouse guarderà al bersaglio tipicamente, ma non sempre, sul punto di inserimento nel testo ad intervalli, sullo schermo, lapparizione di un messaggio garantirà necessariamente lattenzione bisogna mettere le informazioni dove esse siano visibili eventi non previsti devono catturare lattenzione via suoni, campanelli, etc. la visione periferica nota rapidamente eventuali spostamenti anche cambiamenti repentini di colore sono facilmente visibili

52 51 evento-posizione: e-mail G. invia un messaggio a L. tempo il messaggio è ricevuto file system vede se il file è cambiato polling applicazione e-mail cambia icona schermo utente polls evento percepito dallutente evento cambiamento di posizione

53 52 analisi vari agenti attivi (G., lapplic. 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 dora, ora...

54 53 interfacce x e-mail esame esplicito polling a scala ridotta suoneria udibile appena arriva il messaggio di posta facce animate 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

55 54 evento-posizione: tasto tasto: widget standard linterazione è determinata dallambiente di widgets disponibili problema: lutente pensa di avere attivato il tasto...ed invece NO esempio: cancellazione di testo

56 55 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 dallapplicazione Il tasto funziona solamente per mouse up Non vi è feedback per lutente sullazione compiuta delete

57 56 cancellazione II - nil applicazione dialogo schermoutente mouse down su delete evidenzia delete spostamento da delete elimina evidenzia mouse upnessun feedback

58 57 cancellazione II - ok applicazione dialogo schermoutente mouse down su delete evidenzia delete mouse up elimina evidenzia esegui delete modifica il testo chiusura non si percepisce feedback

59 58 soluzioni il dialogo deve fornire un evento: flash suono un utente esperto può ignorare il risultato di errare lazione 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...

60 59 conclusioni linterazione avviene fra due soci: lutente/i ed il programma il primo non è prevedibile - il secondo lo deve essere gli strumenti ed i metodi che descrivono linterazione, dipendono dalla tecnologia scelta, dalla applicazione e dalla classe di utenti i modelli formali, lanalisi dei requisiti, ed il modello dellutente, sono i ferri del mestiere dellinformatico esperto nella Interazione

61 60 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 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, Addison- Wesley, New York, 1998, 3rd Edition http://www.aw.com/DTUI Interaction Design Preece, Rogers, Sharp, John Wiley & Sons, New York, 2002

62 61 bibliografia II IADIS International Conference Interfaces and Human Computer Interaction 2010. 28 Jul 2010 30 Jul 2010; Freiburg, Germany, www.ihci-conf.org/ CHI (ACM Conference on Human Factors in Computing Systems) 28th Conference http://chi2010.org/ Atlanta USA http://chi2010.org/ 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/ 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/http://mobilehci2010.di.fc.ul.pt/ HCI 2010 conference details for the World Computer Congress 2010, Brisbane, Australia, and part of IFIP, www.wcc2010.com/HCI2010/www.wcc2010.com/HCI2010/ IHCI 2010 has a wide scope covering various facets of HCI. Allahabad, India, http://hci.iiita.ac.in/ 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

63 62 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 - Eliciting User Requirements

64 63