Accessibilità in team di prodotto: analisi di un caso reale
Nel precedente articolo abbiamo spiegato cosa significa accessibilità nella realizzazione di siti e applicazioni, sottolineando che non è un “accessorio”, per quanto importante, ma un elemento integrato nel prodotto e nel processo di sviluppo fin dalle prime fasi.
In questo articolo, che prende spunto da un nostro pezzo pubblicato su MokaByte, raccontiamo come questo tema si sia inserito nel nostro percorso progettuale, presentando un caso di studio particolarmente significativo e sfidante: il sito uni.com.
Chi è UNI
UNI (Ente Italiano di Normazione) è l’organismo di riferimento in Italia per la definizione di norme tecniche.
Il suo ruolo è mettere in contatto esperti di diversi settori per definire standard di qualità e sicurezza applicabili ai prodotti e servizi che utilizziamo quotidianamente.
Anche la norma UNI CEI EN 301549:2021, fondamentale per la normativa sull’accessibilità, è nata seguendo questo processo.
Il progetto
Siamo stati coinvolti da UNI tra il 2022 e il 2023 per ripensare l’esperienza utente e l’interfaccia del portale uni.com.
La sfida principale è stata integrare le due anime del portale — quella istituzionale e quella e-commerce — garantendo un’esperienza unica, coerente e accessibile in tutto il sito.
Le persone coinvolte
Oltre al team di Thanks Design, è stato fondamentale coinvolgere fin dalle fasi iniziali i referenti dei vari dipartimenti UNI, ciascuno con esigenze e obiettivi specifici.
Abbiamo lavorato a stretto contatto anche con i due team di sviluppo e con i consulenti esterni specializzati in accessibilità, per definire un approccio condiviso.
Fasi e tempi
In sei mesi, dal primo wireframe al go-live, abbiamo attraversato una fase di analisi e ricerca iniziale.
Di seguito, descriviamo le varie fasi e i passaggi che ci hanno accompagnato in questo percorso.
Starting: gettare le basi per l’accessibilità
Il primo passo fondamentale per ogni prodotto digitale è costruire una base solida; questo vale ancora di più quando l’accessibilità è un obiettivo.
La fase di “starting” serve ad allineare il team, definire gli obiettivi e individuare le prime linee guida da seguire.
1. Product envisioning e obiettivo di accessibilità
Inizialmente abbiamo organizzato un workshop per definire le ipotesi sugli utenti, le loro necessità e le funzionalità chiave del prodotto.
L’obiettivo era allineare il team su un framework condiviso, chiarendo fin da subito le aspettative e gli obiettivi di accessibilità.
2. User & Experience mapping e analisi accessibilità
Abbiamo dedicato tempo a mappare gli utenti e i loro journey, analizzando come interagivano con il sito esistente e individuando le barriere.
L’analisi approfondita dell’accessibilità del sito ha permesso di identificare le aree più critiche da migliorare.
3. UX report con pain point e opportunità
Al termine della mappatura e analisi, abbiamo redatto un report UX che riassumeva i principali pain point e le opportunità per migliorare l’esperienza utente.
Questo documento, contenente criticità e possibili soluzioni, è stato fondamentale per guidare le scelte progettuali nelle fasi successive.
4. Definizione wireframe e architettura dell’informazione
Abbiamo progettato il nuovo sito attraverso una serie di wireframe, ipotizzando e validando le prime strutture e layout.
In questa fase abbiamo definito anche l’architettura dell’informazione, per assicurare contenuti facilmente fruibili e comprensibili.
5. Definizione del look & feel delle pagine principali
Parallelamente alla progettazione della struttura, abbiamo iniziato a definire l’aspetto visivo delle pagine principali.
Abbiamo lavorato sul look & feel del portale per garantire un design moderno, funzionale e accessibile.
Questa fase ha incluso la scelta di colori, tipografia e stili visivi pensati per soddisfare i requisiti di accessibilità.
6. Validazione accessibilità delle UI
Abbiamo effettuato una prima verifica dell’accessibilità sui mockup grafici, valutando come i vari componenti UI rispettassero i principi delle WCAG (Web Content Accessibility Guidelines).
Questo controllo ha permesso al team di correggere eventuali problemi prima di passare alla fase di sviluppo.
Design e sviluppo: implementazione dell’accessibilità
In questa fase ci siamo concentrati sull’attuazione pratica dell’accessibilità, collaborando strettamente con il team di sviluppo per trasformare i concetti progettuali in un prodotto realmente accessibile.
1. Formare il team e concordare un approccio condiviso
Il primo passo è stato formare il team sulle specificità dell’accessibilità, garantendo che tutti conoscessero le best practice e gli standard da seguire.
Abbiamo inoltre definito un approccio condiviso, con iterazioni settimanali per monitorare e testare i progressi.
2. Costruire un design system accessibile
Abbiamo creato una libreria di componenti accessibili, sia dal punto di vista del design sia dello sviluppo, per assicurare interfacce fruibili da tutti gli utenti.
Questo design system include componenti riutilizzabili, come pulsanti, moduli e menu di navigazione, progettati per rispettare i requisiti di accessibilità.
3. Validare l’accessibilità del frontend il prima possibile
Durante lo sviluppo abbiamo validato continuamente l’accessibilità, controllando le porzioni di codice man mano sviluppate.
Questo approccio ha permesso di individuare e correggere rapidamente eventuali problemi, integrando l’accessibilità in ogni fase.
4. Formare il personale di UNI su accessibilità e utilizzo del CMS
Abbiamo organizzato sessioni di formazione specifiche per il team UNI, con focus sull’accessibilità e l’uso corretto del CMS.
Abbiamo fornito indicazioni pratiche per creare contenuti accessibili, tra cui:
- strutturare i contenuti in modo semantico;
- evitare testi incorporati nelle immagini;
- fornire descrizioni alternative per immagini e contenuti multimediali;
- mantenere contenuti chiari e concisi;
- assicurare che istruzioni e messaggi di errore siano facilmente comprensibili.
5. Rilascio in preproduzione e validazione finale
Prima del lancio in produzione, abbiamo svolto un’ultima fase di validazione, verificando ogni dettaglio.
Abbiamo identificato la figura responsabile dell’accessibilità e definito un workflow per monitorare e gestire eventuali problemi post-lancio.
Inoltre, abbiamo redatto la dichiarazione di accessibilità, un documento presente sul sito che garantisce trasparenza agli utenti.
Rilascio in produzione: monitoraggio e ottimizzazione continua
L’ultima fase è quella in cui il sito diventa operativo; questa non si conclude con la messa online, ma include controllo post-lancio e ottimizzazione continua.
Il sito viene messo in produzione
Dopo aver validato ogni aspetto e ottenuto l’approvazione finale, il sito è stato lanciato ufficialmente.
In questa fase, abbiamo monitorato le performance, intervenendo tempestivamente su eventuali problemi di accessibilità.
Monitoraggio delle segnalazioni e presa in carico
Una volta online, è fondamentale che l’azienda ascolti le segnalazioni degli utenti.
Abbiamo implementato un sistema per raccogliere e gestire le problematiche, così da garantire un sito sempre accessibile.
Conclusione
La trasformazione verso l’accessibilità è un percorso accessibile a ogni azienda. Non va sottovalutata né temuta, ma vista come una grande opportunità per migliorare prodotti e servizi.
Siamo certi che, con il tempo, l’accessibilità diventerà un tema consolidato nei flussi di lavoro dei team, come è successo in passato con l’esperienza responsive.
Come per l’approccio “mobile first”, mettere l’accessibilità al centro della progettazione “by design” migliorerà l’esperienza non solo delle persone con disabilità, ma di tutti gli utenti.