ECTS - University of Pisa
| Modules | Area | Type | Hours | Teacher(s) | |
| PROGETTAZIONE DI INTERFACCE E VALUTAZIONE DELL'USABILITÀ | INF/01 | LEZIONI | 42 |
|
Lo scopo del corso è di apprendere i concetti di base ed i metodi principali per progettare e valutare interfacce utenti e, più in generale, applicazioni interattive, caratterizzate da usabilità, accessibilità, ed una buona esperienza utente. Verranno considerati anche vari strumenti automatici in grado di supportare i metodi considerati. Alla fine del corso lo studente dovrebbe essere in grado di progettare e valutare autonomamente sistemi interattivi al fine di ottenere applicazioni con buona usabilità e capaci di adattarsi al contesto di uso.
The purpose of the course is to learn the basic concepts and main methods to design and evaluate user interfaces and, more in general, interactive applications characterised by usability, accessibility, and good user experience. Automatic tools to support the methodologies presented will be considered as well. The student who successfully completes the course will have the ability to design and evaluate interactive systems in order to obtain applications with good usability and able to adapt to the context of use.
Le conoscenze degli studenti verranno verificate andando a vedere se hanno appreso i metodi ed i concetti presentati e discussi nel corso e se sono in grado di applicarli a casi concreti
Metodi:
The students will be assessed on their demonstrated knowledge of the methodologies and concepts presented and discusssed in the course and the ability to apply them
Methods:
Non vi sono particolari prerequsiiti, anche se qualche conoscenza di HTML e CSS è utile per la parte pratica del corso
There are no particular prerequisites, even if some basic knowledge of HTML and CSS is useful for the practical part of the course
Delivery: face to face
Learning activities:
Attendance: Advised
Teaching methods:
Illustrazione struttura del Corso. Introduzione allo Human-Computer Interaction. Concetti di base. Le tappe storiche principali nell'interazione con i computer. Evoluzione delle tecnologie e degli utenti. Modello di Norman dell'Interazione. Concetti di base di usabilità ed accessibilità. Importanza della usabilità. Esempi.
Criteri per il design. Tecniche orientate alla comunicazione. Affordance. Metafore. Regolarizzare gli elementi per facilitare la scansione visiva. Le variabili grafiche. I colori ed il loro uso nelle interfacce utenti. Come organizzare una struttura visuale. Errori comuni (frammentazione, effetti inutili, spreco di spazio...). I principi della Gestalt nella percezione delle interfacce grafice. Esempi positivi e negativi. Supporto dei CSS per il visual design.
Visualizzazione dell'informazione. Rappresentare informazione. I task principali nell'accesso a grandi quantità di informazioni. Rappresentazioni dipendenti dai tipi di dati, Accesso e navigazione tra i dati. Overview+Details. Focus+Context. Fisheye. Semantic Zoom. Magic Lens. Tree Maps. Tag Clouds, Applicazioni ai social networks.
Progettazione centrata sull'utente. Requisiti. Scenari. Use Cases. Card Sorting. I prototipi: motivazione e classificazione. Analisi dei compiti. Modellazione delle attività logiche da supportare. ConcurTaskTrees. Esempi. Tool per Progettare ed Analizzare Modelli di Task
Gli aspetti da considerare quando si progettano applicazioni interattive. Dalla Progettazione Concettuale alla Progettazione Concreta. I linguaggi basati su modelli / MARIA. La semantica di alcuni tipici oggetti di interazione. HTML 5. Altri aspetti di progettazione concreta.
Introduzione ai Siti Web. Scopi comunicativi. La Persuasione. La User Experience nel Web. La Home Page. Aspetti da considerare. Esempi. Come stimolare emozioni tramite interfacce Web. Ajax e usabilità. Relazioni tra tasks, interfacce utenti e piattaforme. Adattamento ai dispositivi: possibili approcci e tipi di regole di adattamento. Responsive Design. Media Queries. Layout multi-dispositivi. Bootstrap.
Adattamento agli Utenti. Motivazioni. Adattabilità ed adattatività. Modelli di Utente. Tecniche per l'adattamento della presentazione, della navigazione e dei contenuti. Esempi di interfacce adattabili e/o adattive. Collaborative filtering. La transizione nell'adattamento. Adattamento a parametri fisiologici. Applicazioni nei sistemi di e-learning.
Progettazione Interfacce Multimodali. Definizione e Motivazioni. Come interagiscono con il sistema cognitivo umano. Interazione naturale. Classificazione multimodalità in base ad aspetti temporali ed interpretazione. Interfacce Vocali. Interfacce audio non vocali (auditory icons e earcons). VoiceXML. Come combinare le modalità: Complementarietà, Assegnamento, Ridondanza, Equivalenza. Web Speech API. Esempi. Interfacce Aptiche. Interfacce Gestuali. Schermi multi-tocco. Kinect. Come sfruttare olfatto e gusto in interfacce multimodali
L'accesso Web tramite cellulari. Interazione basata sul tocco. Problemi di usabilità negli smartphones. I Sensori nei Dispositivi Mobili. Le Applicazioni dipendenti dal Contesto di Uso. Gli smartwatches. Interfacce Utenti Multi-dispositivi. Interazione Prossemica. Interfacce Utenti Distribuite. Interfacce Utenti Migratorie
End User Development e sue applicazioni in ambito Web e Internet of Things. Definizione e motivazioni. Primi esempi. Possibili Approcci. Metafore Usate. App Inventor. Web Mashup. IFTTT. Esempi in Ambito Applicazioni Mobili dipendenti dal contesto di uso (Tasker, Atooma, Locaale). Programmazione Trigger-Action. Come specificare regole per modificare il comportamento delle applicazioni dipendenti dal contesto.
Introduzione. Motivazioni. Concetti di base. Caratteristiche a seconda del dominio applicativo. User Experience. I possibili tipi di approcci alla valutazione dell'usabilità. Come organizzare un test di utente. Aspetti da considerare. Le possibili metriche nell'usabilità. I laboratori di usabilità. Fattori sperimentali. Analisi dei dati (correlazione tra variabili, intervallo di confidenza). Statistica descrittiva e statistica inferenziale. Think Aloud. GOMS/KLM.
Tecniche basate su feedback dell'utente: interviste, questionari, focus group. Scale di Likert. Google Forms. System Usability Scale. NASA TLX. Caratteristiche della valutazione analitica. Valutazione euristica. Dimensioni Cognitive (Cognitive Dimensions) Cammini cognitivi (Cognitive Walkthrough). Guidelines. Esempi di applicazione e esercizi. Criteri per la scelta del metodo di valutazione
Analisi dei Video, Valutazione Remota dell'Usabilità, Sistemi di Logging, Analisi dei log. Analisi degli Utenti. Bad Usability Smells. Sistemi di Eye Tracking.
Accessibilità. Tipologie di Disabilità. Tecnologie Assistive. Screen Readers. Esempi di problemi con interazione tramite screen readers. La situazione normativa italiana. Evoluzioni nelle Lineeguida per l'Accessibilità. I validatori di lineeguida. MAUVE. WAI/ARIA.
In the first part of the course, examples of user interfaces difficult to use will be given, followed by basic concepts and aspects to take into account when designing user interfaces are introduced. Then, the focus will shift on how to use such concepts in the concrete design and implementation of dialogues and presentations provided by interactive applications, with additional examples and exercises. Particular attention will be paid on the design of web sites, adaptable and intelligent user interfaces, multimodal applications, interfaces for mobile devices, and environments that allow people without programming experience to create automations with smart objects. The second part of the course will be dedicated to usability evaluation of interactive applications considering various methods ranging from interface inspections based on predefined criteria to the methods that are based on empirical information, including remote techniques where users and evaluators are distant in space and/or time. Lastly, attention will be paid to accessibility, and how technologies support it.
Gamberini, Chittaro, Paternò (eds.), Human-Computer Interaction - I fondamenti dell'interazione tra persone e tecnologie 2012, ISBN 9788871927824.
Lucidi di lezione
Lessons slides
Gamberini, Chittaro, Paternò (eds.), Human-Computer Interaction - I fondamenti dell'interazione tra persone e tecnologie 2012, ISBN 9788871927824.
Vedi modalità d'esame
Look at assessment methods
L'esame consiste nello svolgimento di un progetto ed un orale. Se si frequenta in modo continuativo il corso e si fanno le esercitazioni in modo sufficiente non c’è bisogno di fare il progetto. Le esercitazioni corrette vanno consegnate al docente a lezione e NON per email entro l'esercitazione successiva.
Il tema del progetto va concordato almeno un mese prima, una bozza del progetto va mostrata almeno 15 giorni prima dell’esame. E' fondamentale studiare il materiale del corso eppoi fare il progetto, perché lo scopo del progetto è di applicare i concetti presentati nel corso ad uno specifico caso di studio. L'argomento del progetto non può essere un semplice sito Web per sistema desktop. Lo scopo del progetto è di mostrare di saper applicare i concetti discussi a lezione, quindi i progetti possono essere o un applicazione multi-dispositivi (accedibile sia tramite sistema desktop e mobile) od un applicazione multimodale (che usa sia grafica che voce per l'interazione) od un applicazione per dispositivi mobili dipendente dal contesto od una libreria che usa tecniche di information visualization avanzate
Il progetto deve essere accompagnato da una relazione che deve spiegare le scelte progettuali fatte da parte di ciascun studente secondo i vari aspetti visti a lezione. Essa deve contenere le seguenti informazioni: obiettivi; applicazioni simili; scenari d'uso, analisi dei compiti, spiegazioni delle scelte progettuali e dei criteri applicati per supportare i compiti identificati, dettagli su come si è progettato la presentazione, la navigazione ed i contenuti dell'interfaccia e le caratteristiche dei dispositivi per i quali è stata progettata; se vi sono livelli di adattabilità od adattività (opzionale); se vi sono aspetti di multimodalità o multimedialità (opzionale); tecniche di implementazione usate; valutazione dell'usabilità (spiegare il metodo, il perchè della scelta del metodo, i risultati). Ricordarsi di includere il nome dell'autore nella prima pagina e di numerare le pagine.
Progetto e relazione devono essere inviate al docente almeno una settimana prima dell'orale.
L'orale è diviso in due parti: una discussione sul progetto svolto ed alcune domande relative al programma del corso (per rispondere alle domande è sufficiente studiare i lucidi e gli appunti di lezione). Lo scopo è di verificare l'apprendimento dei concetti principali discussi durante il corso.
The exam consists in carrying out a project and an oral one. If you attend the course on a regular basis and practice sufficiently, there is no need to do the project. The correct exercises must be delivered to the teacher in class and NOT by email within the following lesson.
The theme of the project must be agreed at least a month before, a draft of the project must be shown at least 15 days before the exam. It is essential to study the course material and then do the project because the aim of the project is to apply the concepts presented in the course to a specific case study. The topic of the project cannot be a simple website for desktop system. The aim of the project is to show the ability to apply the concepts discussed in class, so projects can be either a multi-device application (accessible both via desktop and mobile system) or a multimodal application (which uses both graphic and voice for the interaction) or a context-dependent application for mobile devices or a library that uses advanced information visualization techniques
The project must be accompanied by a report that must explain the design choices made by each student according to the various aspects seen in class. It must contain the following information: objectives; similar applications; usage scenarios, analysis of tasks, explanations of design choices and criteria applied to support the identified tasks, details on how the presentation was designed, the navigation and contents of the interface and the characteristics of the devices for which it was designed; if there are levels of adaptability or adaptability (optional); if there are aspects of multimodality or multimedia (optional); implementation techniques used; usability evaluation (explain the method, the reason for the choice of the method, the results). Remember to include the author's name on the first page and to number the pages.
Project and report must be sent to the teacher at least one week before the oral exam.
The oral exam is divided into two parts: a discussion on the project carried out and some questions related to the course program (to answer the questions it is sufficient to study the slides and the lecture notes). The aim is to verify the learning of the main concepts discussed during the course.
Si possono fare tirocini sugli argomenti del corso
Commissione di esame: Maria Simi, supplente Alessio Malizia
Le lezioni si svolgeranno in presenza, verranno anche trasmesse in streaming e registrate, ma si consiglia vivamente di seguirle in presenza.
