Tecnologia · 3a Scuola Media

Idee di apprendimento attivo

Principi di Web Design e Usabilità

Gli studenti imparano meglio quando toccano con mano i principi di usabilità. Simulare situazioni reali permette loro di sperimentare perché un design efficace risponde ai bisogni umani, non solo alle preferenze estetiche. Attraverso attività pratiche, vedono direttamente come la progettazione influenzi le loro azioni online ogni giorno.

• Traguardi per lo Sviluppo delle Competenze
• MIUR: Sec. I grado - Linguaggi multimediali
• MIUR: Sec. I grado - Progettazione

• 45–60 min
• Coppie → Intera classe
• 3 attività

Attività 01

• Simulazione
• 45 min · Coppie

Simulazione: Test di Usabilità 'a freddo'

Uno studente disegna su carta l'interfaccia di un'app. Un compagno deve 'usarla' per compiere un'azione (es. comprare un biglietto) mentre il progettista osserva in silenzio dove l'utente si blocca.

Cosa rende un sito web facile da navigare per un utente inesperto?

Suggerimento per la facilitazione

Durante il test di usabilità 'a freddo', assicurati che gli studenti non abbiano accesso preventivo all'interfaccia testata per evitare bias da familiarità pregressa.

Cosa osservare

Gli studenti, divisi in coppie, scambiano un prototipo di interfaccia web (anche solo su carta) che hanno progettato. Ogni studente valuta il lavoro del compagno rispondendo a queste domande: 1. È facile trovare le informazioni principali? 2. I pulsanti sono chiari e facili da cliccare? 3. Ci sono elementi che distraggono o confondono? Ogni studente scrive un suggerimento specifico per migliorare il prototipo.

• Applicare
• Analizzare
• Valutare
• Creare
• Consapevolezza Sociale
• Processo Decisionale

Attività 02

• Circolo di indagine
• 50 min · Piccoli gruppi

Circolo di indagine: Caccia ai Dark Patterns

I gruppi navigano su siti popolari alla ricerca di elementi di design ingannevoli (es. tasti 'cancella' nascosti, timer di finta urgenza). Devono documentarli e spiegare perché sono eticamente discutibili.

Perché l'accessibilità è un requisito fondamentale nella progettazione digitale?

Suggerimento per la facilitazione

Per la caccia ai Dark Patterns, fornisci agli studenti una checklist strutturata da compilare mentre navigano, così da guidare la loro osservazione senza limitare la scoperta autonoma.

Cosa osservare

Distribuisci agli studenti un foglio con lo screenshot di una pagina web (es. una pagina di notizie o un sito di un negozio). Chiedi loro di identificare e scrivere: 1. Un elemento che rende la pagina facile da usare. 2. Un elemento che potrebbe essere migliorato per renderla più accessibile. 3. Un esempio di come i colori o la dimensione del testo guidano la loro attenzione.

• Analizzare
• Valutare
• Creare
• Autogestione
• Autoconsapevolezza

Attività 03

• Rotazione a stazioni
• 60 min · Piccoli gruppi

Rotazione a stazioni: I Pilastri del Design

Tre stazioni: una sulla psicologia dei colori, una sulla gerarchia visiva (font e spazi) e una sull'accessibilità (contrasto e lettori di schermo). In ogni stazione si modifica un design esistente per migliorarlo.

In che modo i colori e la disposizione degli elementi influenzano le nostre scelte?

Suggerimento per la facilitazione

Alle stazioni di rotazione, assegna ruoli specifici ai gruppi (es. cronometrista, annotatore) per garantire che tutti partecipino attivamente all'analisi dei pilastri del design.

Cosa osservare

Durante la lezione, mostra agli studenti due diverse opzioni di layout per la stessa funzionalità (es. menu di navigazione). Chiedi loro di alzare la mano per indicare quale preferiscono e di spiegare brevemente il motivo basandosi sui concetti di usabilità discussi (es. 'preferisco la prima perché il menu è più visibile').

• Ricordare
• Comprendere
• Applicare
• Analizzare
• Autogestione
• Abilità Relazionali

Alcune note per insegnare questa unità

Insegnare il web design significa partire dall'osservazione diretta di come gli studenti interagiscono con le tecnologie che usano quotidianamente. Evita di presentare le regole come dogmi: invece, usa esempi concreti tratti da siti o app che loro conoscono bene. Incoraggia il dialogo critico chiedendo loro di difendere le proprie scelte progettuali con argomenti basati sull'esperienza utente, non sull'estetica. La ricerca mostra che gli studenti apprendono meglio quando collegano i concetti teorici a problemi reali che hanno già incontrato.

Gli studenti dimostrano di aver compreso i principi di usabilità quando analizzano criticamente un'interfaccia, identificano elementi che facilitano o ostacolano la navigazione, e propongono miglioramenti concreti. Sanno spiegare perché alcune scelte progettuali funzionano meglio di altre in contesti diversi.

---

Attenzione a questi errori comuni

• Durante il test di usabilità 'a freddo', alcuni studenti potrebbero dire: 'Il design riguarda solo rendere un sito bello'.

  Durante il test di usabilità 'a freddo', mostra agli studenti che un sito bellissimo diventa inutile se gli utenti non riescono a trovare le informazioni in meno di 10 secondi. Fai loro notare come la loro frustrazione durante il test riveli l'importanza della funzionalità rispetto all'estetica.

• Durante la caccia ai Dark Patterns, alcuni studenti potrebbero affermare: 'L'accessibilità serve solo a una piccola minoranza di persone'.

  Durante la caccia ai Dark Patterns, usa lo screenshot di un sito che include sottotitoli video o contrasto dei colori elevato. Chiedi agli studenti di simulare situazioni quotidiane (es. guardare un video in un luogo rumoroso) per dimostrare come l'accessibilità migliori l'esperienza per tutti.

---

Metodologie usate in questo brief

• Simulazione
• Circolo di indagine
• Rotazione a stazioni