Un’identità per la scuola italiana

Il design per un modello web delle scuole

Gianni Sinni
Nov 14, 2019 · 11 min read

Alessandro Pollini e Gianni Sinni

1_Una premessa

La scuola è nell’esperienza di ciascuno di noi. Dai primi passi mossi da studenti nelle aule della scuola, fino al momento in cui da cittadini responsabili contribuiamo a rinnovare e migliorare le regole del vivere comune. La scuola è nel passato, nel presente e nel futuro di tutti noi.

I progetti per l’innovazione della scuola sono soprattutto azioni culturali, che partono da una visione di scuola intesa come spazio aperto per l’apprendimento e come piattaforma che metta gli studenti nelle condizioni di sviluppare le competenze per la vita.

La scuola è un mondo complesso che riguarda diversi milioni di persone a vario titolo coinvolte — gli studenti, i genitori, i docenti, il personale amministrativo — e rappresenta, lo sappiamo, un mondo nel quale esperienze di eccellenza convivono insieme a grandi criticità. Fra quest’ultime possiamo senz’altro annoverare, come evidenziato a suo tempo dalla Commissione Parlamentare d’inchiesta sulla digitalizzazione in Italia, il livello di digitalizzazione del sistema scolastico.

E in effetti, il livello di interazione dei siti web delle scuole è generalmente molto limitato, con ridotti servizi digitali. I contenuti presenti sono estremamente difformi, così come la struttura di navigazione dei siti, con un più o meno macchinoso collegamento al Registro Elettronico (un servizio fornito alle scuole da numerosi fornitori esterni). Nella scuola, insomma, non difficile riscontrare come il cartaceo la faccia ancora da padrone pressoché ovunque. La digitalizzazione procede con lentezza, con una scarsa connettività e con quasi tutta la gestione della comunicazione online demandata alla figura dell’animatore digitale.

Il progetto che raccontiamo qui di seguito vuole essere un piccolo ma concreto contributo al processo di digitalizzazione della scuola.

Image for post
Image for post
UX design del prototipo completo navigabile

2_Il progetto

L’inizio del progetto risale al 2018 quando, come gruppo di lavoro formato da Lcd, studio specializzato in design della comunicazione, e da BSD, studio specializzato in interaction design, abbiamo vinto la gara indetta dalla Presidenza del Consiglio dei Ministri, in collaborazione con il Ministero dell’istruzione, dell’Università e della Ricerca (Miur) e iniziato un percorso per la progettazione di​ ​un​ ​modello​ per i ​siti​ ​web​ delle​ ​scuole​ ​italiane.

Si tratta di un progetto nato nell’ambito di Designers Italia, la piattaforma creata dal Team per la Trasformazione Digitale per il design dei servizi pubblici, e teso alla creazione di uno standard per i siti web delle scuole allo scopo di permettere un accesso uniforme e coerente ai servizi digitali offerti ai genitori, agli studenti e all’intera comunità scolastica.

Come capita raramente nei rapporti tra PA e designer (ed è uno dei motivi di scarsa collaborazione tra i due universi), lo stesso capitolato del bando di gara redatto dal Team per la Trasformazione Digitale ha risposto in pieno alle istanze, ai metodi e ai tempi del progetto di user-centred design, proponendo un processo iterativo di valutazione da parte di utenti e stakeholder (per inciso, tutta la documentazione del progetto, inclusi capitolati e contratti, è disponibile su Docs Italia).

Il progetto si inserisce nel percorso di attivazione degli ecosistemi abilitanti previsto dal ​Piano triennale per l’informatica nella pubblica amministrazione, in coerenza con gli obiettivi strategici e le linee di azione​ ​dell’ecosistema​ ​scuola.

3_In contatto con la scuola italiana

A marzo 2018 il progetto è diventato operativo, con il coinvolgimento degli stakeholder coinvolti in interviste, focus group e workshop di co-design, tutte attività di alto valore in un mondo di complesse interazioni come la scuola.

Image for post
Image for post
Workshop di co-progettazione

Affinché il risultato non fosse percepito come un’imposizione dall’alto, ma piuttosto come un percorso di co-progettazione, il progetto ha tenuto tra gli obiettivi la partecipazione e l’ingaggio degli utenti, a tutti i livelli. Il portale scolastico è infatti un aggregatore di servizi per tutta la comunità scolastica.

Il contatto con la scuola italiana ci ha portato a incontrare direttamente docenti, dirigenti e personale tecnico-amministrativo, oltre che genitori e studenti in un’età compresa tra i 15 e i 18 anni, sia nei momenti di intervista individuale che nei focus group che hanno coinvolto oltre 70 persone. Queste attività di ricerca qualitativa sono state ulteriormente arricchite dall’analisi quantitativa che ha raggiunto un campione di oltre 2000 persone rappresentative di tutta la comunità scolastica italiana.

Da Milano a Scandicci, da Massa a Napoli, da Ancona a Monselice, fino a Belluno, Frosinone, Torino, Roma, Bologna e Priverno, il contatto con la scuola italiana ci ha aiutato a trasferire all’interno del progetto esigenze, emozioni, entusiasmo.

Image for post
Image for post
La prototipazione mid-fi

4_Il progetto e i metodi

Il progetto per un mondo complesso come la scuola ha richiesto una metodologia di ricerca e di progettazione necessariamente incentrata sull’utente e partecipativa, in altre parole un Participatory and Human-centred Design. L’integrazione di metodi e tecniche proprie degli approcci di progettazione user centred, context-based, inclusive e partecipative ha consentito di strutturare il progetto su una molteplicità di prospettive: muovendo dinamicamente dai bisogni utente alle pratiche, dall’analisi del compito specifico al contesto più generale entro cui l’attività ha luogo e si struttura, fino all’analisi delle procedure, dei flussi e dei processi organizzativi.

Per le attività di ricerca abbiamo utilizzato i template della User Research disponibili in designers.italia.it laddove presenti, come il kit per le Interviste Utente, mentre dove necessario sono stati creati template nuovi ad estensione dei kit esistenti. In particolare si tratta dei template per: la definizione dei Requisiti Utente, la conduzione e il report dei Focus Group, la strutturazione degli Scenari di Attività che descrivono l’AS IS e degli User flow, ma anche strumenti di rilevazione degli interessi degli Stakeholders di progetto (es. Stakeholders interview e Mappa Stakeholders). Tutti i template prodotti, nell’ottica open source che caratterizza il progetto, sono disponibili qui:

Come esito e sintesi delle informazioni raccolte nella User Research sono state definite 7 Personas e 14 Scenari. Le Personas — il Dirigente Scolastico, il Docente, il Genitore, lo Studente, il personale non docente (ATA) e l’Animatore Digitale — hanno collezionato e integrato per ciascuno i bisogni, le richieste, le aspettative e gli obiettivi della comunità scolastica.

Image for post
Image for post
Timeline degli scenari

Le diverse attività che le personas svolgono sul sito della scuola sono descritte nell’insieme degli Scenari futuri che descrivono il ruolo e l’impatto del nuovo sito della scuola. Dagli scenari più tecnici, relativi al pagamento dei servizi, o alla scrittura, pubblicazione e diffusione delle circolari, fino a quelli legati al supporto alla didattica e alla vita di classe, gli user journey descrivono l’esperienza utente nell’arco temporale di un anno scolastico. I journey sono poi stati utilizzati per la definizione dei taskflow e della navigazione del sito della scuola.

5_Progettazione dei servizi del sito: due esempi

La progettazione dei servizi per il nuovo sito della scuola ha visto una sostanziale trasformazione dell’esperienza dell’utente, sia nella ridefinizione del modello dei servizi esistenti, sia nella nuova concezione di funzionalità e opportunità per l’utente. Prendiamo a esempio due dei servizi del sito, a supporto all’operatività del personale ATA e dei docenti il primo, e a supporto della didattica il secondo.

Uno dei servizi così delineati negli user journey riguarda la creazione e pubblicazione di una circolare, servizio completamente digitalizzato nelle sue componenti di creazione, l’invio della circolare da parte del Personale ATA e, infine, la visualizzazione da parte del docente della nuova circolare.

Image for post
Image for post

Il servizio disegna la creazione e la fruizione della circolare a partire dalla scelta della tipologia di comunicazione che si vuole creare fino alla compilazione del relativo form con titolo della circolare, una breve descrizione del contenuto e gli utenti di destinazione. Nella creazione il personale ATA responsabile della creazione della circolare potrà selezionare tag descrittivi da una lista esistente e assegnarli alla circolare stessa, in modo da facilitare la ricerca delle comunicazioni da parte degli utenti. Il personale ATA designato alla firma e pubblicazione della circolare nell’Albo Pretorio, definisce la richiesta di conferma di presa visione e gli eventuali allegati.

I docenti destinatari della circolare possono visualizzare le circolari in evidenza, tramite accesso SPID alla propria area privata, e accedere alla nuova circolare confermando la presa visione. Ulteriori possibilità di azione risiedono nella generazione di un pdf con il testo della circolare, nell’accesso all’archivio delle circolari e nella condivisione. In questo modo il flusso del servizio delineato integra la prospettiva del responsabile del procedimento formale, come le esigenze lavorative di coloro ai quali la comunicazione è destinata.

Image for post
Image for post

Il secondo esempio di servizio, descritto in questa user journey, riguarda la gestione dei materiali didattici, e in particolare la creazione di una scheda didattica, la sua condivisione con la comunità dei docenti e degli studenti e la pubblicazione del materiale.

Il servizio disegna la creazione e la gestione della scheda didattica in maniera da associarla a una materia di riferimento e caratterizzarla nel dettaglio a partire dai tempi di preparazione e di svolgimento delle attività, fino agli obiettivi, ai materiali e alle risorse necessarie per lo svolgimento.

Il docente decide di abilitare i commenti da parte degli studenti e dei docenti ai materiali didattici condivisi, inserisce eventuali test di valutazione da far svolgere opzionalmente agli studenti e sopratutto può definire le opzioni di condivisione e pubblicazione della scheda, con le classi, i colleghi docenti, piuttosto che nell’area pubblica del sito.

Image for post
Image for post
Wireframe dello scenario di creazione di un scheda didattica

6_Il concept del sito della scuola italiana

Il concept del progetto è quello di definire un framework generale all’interno del quale sviluppare i servizi digitali scolastici. Mentre alcuni di questi servizi saranno rilasciati dal Team digitale già a partire dalla versione 1.0, altri saranno sviluppati come una naturale evoluzione dell’ecosistema scuola.

L’attività di ricerca sviluppata dunque nella prima fase del progetto ha portato a definire una serie di caratteristiche e di principi di base accolti all’interno del modello:

  • Il sito della scuola ne rivela l’identità, ne costituisce un’insegna e ne racconta la vita.
  • Un nuovo approccio alla didattica, con un modello nel quale gli scenari di apprendimento in presenza a scuola sono integrati da servizi digitali a supporto delle attività di studio a distanza.
  • Un focus sulla vita della classe: la quotidianità delle relazioni tra compagni, il rapporto con i docenti, la partecipazione dei genitori.
  • L’integrazione con i servizi del Miur quali la Scuola in Chiaro, Iscrizioni On line, il portale dell’Alternanza Scuola-Lavoro.
  • Un’area personale (con contenuti diversificati per docenti, personale, studenti, genitori) all’interno della quale trovare quanto di proprio interesse riunito in un centro messaggi.
  • Usabilità nell’accesso ai servizi, chiarezza dei contenuti e della navigazione, e responsività nella fruizione da smartphone.
  • L’integrazione con i servizi nazionali della pubblica amministrazione (“le piattaforme abilitanti”) quali PagoPA per i pagamenti e Spid per il login.
  • La continuità di servizio con i software per la scuola attualmente in uso, dal Registro Elettronico all’Albo Pretorio.
  • La scalabilità per scuole dalla diversa identità e struttura, il concept è unico per gli istituti comprensivi e per quelli a più indirizzi. La scalabilità riguarda anche per l’erogazione di servizi verso genitori con più figli nella stessa scuola.

7_La prototipazione

Il design della UX costituisce il cuore del sistema progettato. A questo scopo è stato sviluppato un ampio prototipo in wireframe mid-fi (cioè a “media definizione”) dove la presenza dei soli elementi funzionali della navigazione permette di concentrarsi, nelle “valutazioni esperte” effettuate, sui compiti operativi piuttosto che sulla grafica.

A partire da un’impostazione mobile first e responsiva, sono stati realizzati oltre 800 mockup che hanno permesso di verificare l’efficacia della navigazione degli User Journey individuati durante l’analisi, attraverso un processo iterativo che ha portato progressivamente a mettere a punto la versione finale del modello.

È stata infine realizzata una prototipazione hi-fi, comprensiva cioè dell’interfaccia grafica definitiva, di tutte le pagine necessarie allo sviluppo tecnologico del sito web. Seguendo una logica modulare e improntata all’estrema chiarezza e semplicità nella presentazione dei contenuti si è cercato di dare spazio all’identità dell’istituto con una particolare attenzione a evitare un linguaggio visivo “burocratico”, facendo invece emergere quello spirito di attrattiva e vivacità che l’immagine di una scuola dovrebbe comunicare.

Una piccola nota di metodo torna utile a questo punto. Progettare per la pubblica amministrazione secondo i principi dell’open source significa porsi nella prospettiva ecologica di riutilizzare quanto già prodotto in precedenza e predisporre per il riuso tutti i nuovi elaborati. Così il design dei prototipi wireframe e dell’interfaccia è partito dall’utilizzo delle componenti dei wireframe Kit e UI Kit già disponibili su Designers.italia.it, integrandole e arricchendole dove fosse necessario. Il lavoro ha così anche contribuito a estendere il corpus degli elementi ora a disposizione dei designer per i futuri progetti.

Image for post
Image for post
La prototipazione hi-fi [tutti i contenuti sono utilizzati a solo scopo esemplificativo].

8_Il futuro del modello web per la scuola

Nel corso del 2019 il progetto è stato ulteriormente sviluppato da parte del Team Digitale arrivando al rilascio, in modalità open, dello starter kit per i siti delle scuole (composto da architettura dell’informazione e template) e del tema WordPress. Si è arrivati dunque a rilasciare una prima, importante componente all’interno di quel più ampio framework che riguarda la progettazione delle interazioni digitali all’interno della comunità scolastica.

Abbiamo dunque, da oggi, un’importante risorsa a disposizione del mondo della scuola, delle comunità scolastiche e del Miur, che permette di capitalizzare il lavoro fatto e di disporre di una valida opportunità per migliorare la rappresentazione dei servizi digitali della scuola, adeguare i servizi esistenti e avviare lo sviluppo di una nuova versione dei siti scolastici.

E tutti sappiamo quanto ce ne sarebbe bisogno.

Un sentito ringraziamento a tutto il team che ha contribuito alla realizzazione di questo progetto

Per approfondire: i materiali prodotti durante il progetto sono raggiungibili da qui

Image for post
Image for post

Lcd Firenze + Bsd Milano

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium