- Martedì (12:00-13:30) lezione frontale Aula 13
- Mercoledì (14:00-15:30) lezione frontale Aula 13
- Venerdì (12:00-13:30) laboratorio aula 13
Contatto: vocca@unitus.it
Ricevimento:
- Su appuntamento all’indirizzo di posta elettronica
- Il mercoledì dalle 11:00 alle 12:00 in studio;
- Dopo la lezione per domande brevi .
Obiettivi
Il corso consentirà di ottenere conoscenze riguardo alle principali tecniche sviluppate in relazione alle tematiche d’interazione persona-macchina. Lo studente riceverà nozioni relative alle principali tecniche di analisi dell’usabilità e dell’accessibilità di interfacce utente, alla progettazione del dialogo e di sistemi interattivi in generale e alla modellazione di sistemi.
Al termine del corso, lo studente sarà in grado di definire i passi necessari per ideare, progettare e valutare interfacce utente in relazione alla loro usabilità, a costruire un modello degli utenti di un’applicazione interattiva, considerando diverse piattaforme di utilizzo, inclusi dispositivi mobili e browser Web.
Prerequisiti
- Conoscenze di base della struttura e del funzionamento di un personal computer, delle reti informatiche, impatto di queste tecnologie sulla società e la vita di tutti i giorni.
- Funzionamento di Internet e le tecniche di costruzione di siti Web.
- Realizzazione di pagine nei linguaggi HTML e Javascript.
- Cenni di elaborazione lato server.
Articolazione
Sono previste lezioni frontali ed esercitazioni di laboratorio. Nelle lezioni saranno presentate le nozioni strettamente necessarie all’uso dei prodotti informatici (cosa si può fare e perché). Nelle esercitazioni di laboratorio gli studenti potranno apprendere la tecnica fine dell’uso dei prodotti (come si può fare). Nei limiti delle possibilità ed in rapporto al numero degli studenti frequentanti si cercherà di mantyenere il rapporto uno ad uno studente-calcolatore.
Frequenza
Per questo insegnamento la frequenza non è obbligatoria ma fortemente consigliata. Non saranno fatte distinzioni in sede di esame tra studenti frequentanti e non frequentanti. Tuttavia, gli studenti che non frequentano devono prevedere di dedicare del tempo individuale per le indispensabili esercitazioni pratiche, o con un proprio calcolatore, o nelle aule informatiche del Dipartimento, in presenza del Docente e compatibilmente con le attività didattiche.
Modalità d’esame
La prova d’esame consiste nella discussione e valutazione di un progetto realizzato dallo studente. Il progetto dovrà essere corredato di una tesina con la documentazione del progetto e la valutazione di usabilità. La èrova orale comprende anche una valutazione delle conoscenze acquisite durante il corso
Scricare il programma in formato .pdf
Argomenti
Il corso affronta i problemi relativi alla progettazione, analisi e realizzazione di sistemi interattivi usabili, dal punto di vista metodologico. In particolare si considereranno le seguenti tematiche:
- un panorama generale delle questioni che influenzano l’interazione fra umani e computer;
- l’importanza dell’interfaccia utente;
- l’esistenza di diverse classi di utenti e di applicazioni, e il loro impatto sul progetto di interfacce utente;
- la necessità del lavoro di gruppo, e della collaborazione di figure con competenze diverse nel progetto di sistemi interattivi;
- un approccio alla progettazione di interfacce guidata da modelli;
- la rilevanza della valutazione dell’usabilità del sistema,
- regole per l’accessibilità;
- ambienti di prototipazione e progettazione grafica (si utilizzerà un sistema per la grafica)
Programma dettagliato
Interazione, interfaccia persona-macchina, Ergonomia Complessità dell’interazione.
Problemi relativi all’HCI. Comoscere ilWEb: Le radici del Web: Ipertesti; le reti e i browser. Architetture, indirizzi Web.
Interfacce Persona-macchina. Competenze necessarie per lo sviluppo di un sistema Web. Separazione contenuto presentazione e funzionalità. Necessità degli standard di progettazione. Definizione del modello d’interazione. Interfaccia. Esempi di nterfacce Livelli di complessità dell’interazione.
Usabilità: definizione, esempi, Affordance e feedback. Definizione di usabilità. Misure di valutazione dell’usabilità Learnability e memorabilility. Manuali d’uso. Progettazione Human centered. Progettazione vs realizzazione. Use cases.
Progettazione utente: progettazione dell’interazione, casi d’uso, scenari, attori, Accessibilità, Esempi di progettazione.
Progettazione interefacce web: legge di Fitts, navigazione, accessibilità, tipologia di interazione, problematiche e specificità, Small World assumption, Oggetti interattivi, Prototipazione.
Valutazione Usabilità: Criteri e metriche Criteri euristici di Nielsen, Norman. Test di usabilità: metodologie ed esempi.
Conoscere l’utente: Attenzione: attenzione selettiva e divisa. Memoria: memoria e breve termine e a lungo termine. Guidelines di progettazione in considerazione dei limiti della memoria e dell’attenzione. La visione Anatomia dell’occhio,La visione Acuità, proprietà della visione, illusioni ottiche.
Progettazione grafica. Caratteristiche: Chiarezza, Discriminabilità, Chiarezza, Concisione, Consistenza, Scopribilità, Leggibilità, Comprensibilità. Minimalismo vs. massimalità. Ruolo delle immagini. Griglie e allineamenti. Percorsi visivi. Teoria della Gestalt. Legge della continuità di direzione, Legge della buona forma, Legge dell’esperienza passata, Legge della vicinanza, Legge della somiglianza, Legge della chiusura. Uso dei colori.
Progettare il testo: font; print font e screen font; Il processo di lettura; Misurare la legibility; allineamenti; Colori e polarità; L’indice Gulpease; Il testo nel web; Leggibilità e readability. Linee guida.
Conoscere L’utente: Il sistema motorio. Feedback, La legge di Fitts, legge esponenziale della pratica,
Progettazione dell’errore e linee guida
Studio di un ambiente grafico e presentazione del progetto d’esame.
- R. Polillo. Facile da usare. Una moderna introduzione alla ingegneria della usabilità, Milano: Apogeo 2010
- David Benyon. Progettare l’interazione. Metodi e tecniche per il design di media interattivi, Pearson, 2012.
- A. Dix, J. Finlay, G. Abowd, R. Beale.Human Computer Interaction, Terza edizione, Prentice Hall, 2004.
- J. Preece, Y. Rogers, H. Sharp. Interaction Design, Apogeo 2004.
- Jakob Nielsen. Web Usability, Apogeo, 2000.
- Lezione 0: Presentazione del corso
Lezione0 Presentazione2015 (568.1 KiB)
- Lezione 1: Conoscere il web. La nascita di Internet. Html. Reti
Lezione-1-ConoscereWeb2015 (1.6 MiB)
- Lezione 2: Interazione. Interazione uomo-macchina. Interfacce. Interdisciplinarietà
Lezione-2-Interazione2015 (1.7 MiB)
- Lezione 3: Usabilità. Modello di Norman. Affordamce e Feedback
Lezione-3-Usabilità2015 (3.5 MiB)
- Lezione 4: Accessibilità. Definizione e requisiti di conformità. Usabilità e accessibilità
Lezione-4-Accessibilità2015 (1.3 MiB)
- Lezione 5: Progettazione Utente. Definizione HCI. casi d’uso. Utenti. Scenari
Lezione-5-ProgettazioneUtente2015 (4.7 MiB)
- Esercitazione 1: Progettazione di una app.
Esercitazione 1-progettazione Di Un Applicativo Interattivo (474.9 KiB)
- Lezione 6: Ingegneria e creatività
Lezione-6-Ingegneria E Creatività2015 (4.5 MiB)
- Lezione 7: Progetto d’esame
Lezione-7-Progetto Di Esame2015 (1.4 MiB)
- Lezione 8: Interfaccia web e mobile
Lezione-8-InterfacceWEB-mobile2015 (3.2 MiB)
- Lezione 9: Prototipazione
Lezione-9-prototipazione2015 (2.1 MiB)
- Lezione 10: Valutazione dell’usabilità
Lezione-10-Valutazione Usabilità2015 (3.0 MiB)
- Lezione 11: GIMP
Lezione-11-GIMP2015 (1.6 MiB)
- Lezione 12: Conoscere l’utente: attenzione e memoria
Lezione-12-ConoscereUtenteMemoria2015 (2.8 MiB)
- Lezione 13: Conoscere l’utente: visione
Lezione-13-Visione2015 (3.0 MiB)
- Lezione 14: Progettazione grafica
Lezione-14-ProgettareLaGrafica2015 (11.5 MiB)
- Lezione 15: GIMP: Creazione di un’interfaccia Web
Lezione-15-InterfacciaWebGIMP2015 (1.4 MiB)
- Lezione 16: Conoscere L’utente: il sistema motorio
Lezione-16-SistemaMotorio2015 (2.6 MiB)
- Lezione 17: Progettare il testo
Lezione-17-Progettare Il Testo2015 (3.9 MiB)
- Lezione 18: Progettare l’errore
Lezione-18-ProgettareErrore2015 (2.2 MiB)
- Lezione 19: Linee guida
Lezione-19-Lineeguida2015 (4.6 MiB)
- Lezione 20: Considerazioni sulle Gui per app Android e iPhone
Lezione-20-Considerazionisulle GUIperApp (1.3 MiB)
- Lezione 21: Progettazione di un’interfaccia di una App lettore musicale in GIMP
Lezione-21-InterfacciaAppGIMP2015 (2.9 MiB)
Materiale per il progetto Progetto (100.8 KiB)