Course Syllabus
Area di apprendimento
1: Studio delle modalità mediante le quali si attua la comunicazione.
Obiettivi formativi
Conoscenza e comprensione
Gli studenti apprenderanno metodi teorici relativi alla progettazione, prototipazione e valutazione di interfacce web. Acquisiranno competenze di base nella codifica in HTML/CSS e otterranno conoscenze pratiche sugli strumenti di prototipazione ampiamente adottati per le applicazioni web. Inoltre, gli studenti svilupperanno un atteggiamento critico verso l'intero processo di sviluppo delle applicazioni web e comprenderanno i principi fondamentali del Design User-Centered, che considera i bisogni e i requisiti degli utenti come centrali per l'intero processo.
Capacità di applicare conoscenza e comprensione
Al termine di questo corso, gli studenti saranno in grado di applicare le conoscenze, la comprensione e le competenze pratiche acquisite per valutare l'usabilità delle interfacce web. Saranno in grado di progettare e prototipare applicazioni web usabili seguendo un approccio sistematico centrato sull'utente.
Contenuti sintetici
Il corso coprirà sia i metodi teorici sia gli strumenti pratici relativi alla progettazione, prototipazione e valutazione delle applicazioni web.
Programma esteso
• Usabilità web: principi e metodi di valutazione (ispezione euristica e test con gli utenti)
• Interazione utente e design dell'esperienza utente (UX/UI): metodi e modelli concettuali
• Elementi di base della programmazione in HTML/CSS
• Strumenti tecnologici per la progettazione e prototipazione di interfacce web (ad es., Adobe Photoshop, Figma, AI generativa)
Prerequisiti
Conoscenze di base sull’uso di un computer (creazione e gestione file, uso di browser e email).
Metodi didattici
I metodi didattici prevedono:
- Lezioni ex-cathedra
- Discussioni e workshop in classe
- Attivita’ pratiche sull’uso di HTML e CSS
- Attivita’ di progetto supervisionate, focalizzate sulla valutazione di usabilita’ di siti web e sul design di interfacce web
Tutte le lezioni sono tenute in inglese.
Modalità di verifica dell'apprendimento
L'esame mira a verificare che gli studenti abbiano compreso i metodi e gli strumenti presentati nel corso e abbiano imparato ad applicarli.
La valutazione si basa sul risultato di due attività progettuali e sulla loro discussione orale.
• Attività 1: Valutazione dell'usabilità di un sito web esistente assegnato dal docente mediante ispezione euristica e user testing. La valutazione si baserà sull'accuratezza e la completezza del report di valutazione dell'usabilità. Il report può essere consegnato in itinere (non obbligatoriamente) o in una qualsiasi data ufficiale d'esame.
• Attività 2: Modellazione dei requisiti, progettazione concettuale e prototipazione di un sito web su un argomento assegnato dal docente. I criteri di valutazione sono la correttezza e la completezza del report di progettazione e del prototipo. Questi due elaborati possono essere consegnati in una qualsiasi data ufficiale d'esame.
La lingua dei report e della discussione può essere l'italiano o l'inglese.
Testi di riferimento
-
Materiali didattici resi disponibile dal docente per tutti gli studenti iscritti al corso ((slides e codice HTML e CSS)
-
Manuali di riferimento su HTML & CSS disponibili online, ad esempio:
HTML: http://www.w3schools.com/html/
CSS: http://www.w3schools.com/css/; https://www.codeschool.com/learn/html-css
Ulteriori letture:
- Jennifer Robbins (2018). Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics. 5th Edition, O'Reilly Ed.
- Beaird J. Walker A. George J. (2021). Web design per creativi, grafici, sviluppatori. Apogeo.
- Beaird J. Walker A. George J. (2020). The Principles of Beautiful Web Design. Sitepoint Ed.
Sustainable Development Goals
Learning area
1: Study of the means by which communication takes place.
Learning objectives
Knowledge and understanding
Students will learn theoretical methods concerning the design, prototyping, and evaluation of web interfaces. They will acquire basic coding skills in HTML/CSS and gain practical knowledge of widely adopted prototyping tools for web applications. Additionally, students will develop a critical attitude towards the entire development process of web applications and understand the main principles of User-Centered Design, which considers user needs and requirements as central to the whole process
Applying knowledge and understanding
Upon completing this course, students will be able to apply the knowledge, understanding, and practical skills acquired to evaluate the usability of web interfaces. They will be able to design and prototype usable web applications following a user-centered systematic approach.
Contents
The course will cover both theoretical methods and practical tools concerning the design, prototyping, and evaluation of web applications.
Detailed program
• Web usability: principles and evaluation methods (heuristic inspection and user testing)
• User interaction and user experience (UX / UI) design: methods and conceptual models.
• Basic HTML / CSS programming.
• Technological tools for the design and prototyping of web interfaces (e.g., Adobe Photoshop, Figma, Generative AI)
Prerequisites
Basic knowledge of computer use (file creation, folders, file extensions, browser, email).
Teaching methods
Teaching methods include:
- Ex-cathedra lectures
- Classroom discussions and mini-workshops
- Hands-on activities on HTML and CSS coding
- Supervised project activities focused on the usability evaluation of an existing web site and the design a new web site
The lessons are held in English.
Assessment methods
The exam aims to verify that students have understood the methods and tools presented in the course and have learned how to apply them. The assessment is based on the outcome of two project-based activities and their oral discussion.
-
Activity 1: Usability evaluation (using heuristic inspection and user testing) of an existing website assigned by the teacher. The assessment will be based on the accuracy and thoroughness of the usability evaluation report. The report can be submitted either at mid-term (optional) or on any official exam date.
-
Activity 2: Requirements modeling, conceptual design, and prototyping of a website on a topic assigned by the teacher. The assessment criteria are the correctness and completeness of the design report and the prototype. These two deliverables can be submitted on any exam official date.
The reporting and discussion language can be Italian or English.
Textbooks and Reading Materials
Course material (e.g., slides, HTML and CSS code) - available to all students enrolled in the course
Any HTML & CSS reference guide or online resource. For example:
HTML: http://www.w3schools.com/html/
CSS: http://www.w3schools.com/css/; https://www.codeschool.com/learn/html-css
Additional readings:
- Jennifer Robbins (2018). Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics. 5th Edition, O'Reilly Ed.
- Beaird J. Walker A. George J. (2021). Web design per creativi, grafici, sviluppatori. Apogeo.
- Beaird J. Walker A. George J. (2020). The Principles of Beautiful Web Design. Sitepoint Ed.
Sustainable Development Goals
Staff
-
Franca Garzotto
