Passi avanti per i kit di design e sviluppo di .italia

Il miglioramento del design system del Paese continua

Notizia

Metadati e link per approfondire

Fornire a tutti gli enti e fornitori della Pubblica Amministrazione un design system coerente, completo, accessibile by default e facile da usare è un lavoro che richiede cura costante. Come tutti gli ecosistemi, i suoi diversi elementi vanno manutenuti e migliorati in maniera sistematica e coerente, e con una particolare attenzione alla sostenibilità tecnica del progetto, anche grazie al contributo degli addetti ai lavori e ai feedback di chi lo usa.

Nel corso degli ultimi mesi, seguendo un essenziale approccio iterativo e di revisione, stiamo infatti rilasciando una serie di migliorie del design system e delle sue risorse: nuovi componenti, fix, versioni, e rilasci dei kit di design e sviluppo. Il tutto è il risultato dell’esperienza maturata sul campo, raccogliendo feedback costante da tutte le figure coinvolte, in maniera diretta e indiretta.

La nuova versione del componente card

Costruendo sull’esperienza acquisita nella progettazione del componente card per i diversi modelli e per il sito di Designers Italia, abbiamo avviato un’attività di redesign del componente card di .italia. Il processo ha richiesto la messa in pratica di tutto ciò che abbiamo imparato su ciascuna soluzione realizzata e testata precedentemente, e ha permesso di generare una versione completamente nuova del componente, già disponibile lato design nella versione 3.7.0 di UI Kit Italia, e lato sviluppo in Bootstrap Italia v2.16.0, e presto disponibile nei kit Angular e React.

I principali vantaggi della nuova card sono le molteplici varianti cucite su diversi contesti d’uso, realizzate con particolare attenzione all’accessibilità e alla loro facilità d’uso: da una parte, grazie a un'impostazione grafica più efficace e una nuova struttura semantica, e dall’altra, alla validazione con utenti ed esperti sul campo. Le card precedenti sono deprecate, ma è prevista una migrazione graduale ai nuovi componenti, con la documentazione e gli stili tuttora mantenuti in Bootstrap Italia e fino al prossimo rilascio maggiore in un’ottica di sostenibilità tecnica dei progetti.

Sempre più accessibilità e usabilità

Il continuo miglioramento delle risorse messe a disposizione da Designers Italia è sostenuto in primo luogo dal contributo della community e tutti coloro che giornalmente ci segnalano problemi e suggeriscono correzioni. Il mese scorso ci sono state due occasioni di confronto importanti con esperti e utenti che, con i loro feedback, hanno stimolato nuove lavorazioni che ci permettono oggi di presentare risorse più accessibili e robuste.

Durante gli Accessibility Days 2025 abbiamo organizzato un workshop con esperti di accessibilità per verificare la qualità delle novità del design system .italia, tra cui il nuovo componente card, un importante fix per risolvere un problema alla barra di navigazione mobile navigando con lettori di schermo (segnalato proprio dalla community), e il nuovo indicatore focus bicolore quando si naviga con la tastiera. A Forum PA 2025, abbiamo svolto test con persone con disabilità per valutare usabilità e accessibilità di una delle piattaforme gestite dal Dipartimento per la trasformazione digitale, realizzata usando il design system .italia: un’altra occasione per testarne i componenti, con particolare focus sulle nuove card, tramite varie tecnologie assistive.

La maggiore coerenza tra i kit di sviluppo

Infine, un altro importante lavoro realizzato con il supporto della community è l’allineamento dei kit Angular e React a Bootstrap Italia. L’aggiornamento rende tutte e tre le risorse di sviluppo più complete e coerenti, facilita l’operato degli addetti ai lavori e soddisfa le esigenze di chi usa i diversi framework in egual misura. Lavorare costantemente per la coerenza tra risorse di sviluppo significa avere un impatto più ampio possibile sull’ecosistema dei servizi pubblici digitali, con un design system coerente, solido e credibile anche tecnicamente in tutti i contesti.

La sfida è stata allineare tutti i kit agli standard di qualità richiesti, sia a livello di design che di sviluppo. Ora, chi già usa o vuole iniziare a usare i kit Angular e React può facilmente sfruttare questi aggiornamenti per migliorare il livello di usabilità e accessibilità del proprio sito, ed essere sicuro di usare le migliori risorse possibili del design system .italia.

Il principale intervento previsto per il prossimo periodo è il completamento dell’allineamento al nuovo componente card, sia nei kit React che Angular.