Designers Italia
Il Design System della Pubblica Amministrazione Italiana
Designers Italia è il punto di riferimento per la progettazione dei servizi della Pubblica Amministrazione: linee guida, strumenti, un design system e una community di designer per favorire la collaborazione e promuovere il ruolo dello human-centered design nello sviluppo dei servizi pubblici.
Intro
In questa pagina presentiamo il design system realizzato per la Pubblica Amministrazione italiana e gli strumenti di Designers Italia a disposizione degli sviluppatori.
L’obiettivo è fornire dei kit (documenti, guide, o software) che facciano risparmiare tempo e denaro alla Pubblica Amministrazione e che costituiscano una solida base di partenza per la progettazione e lo sviluppo di app e siti web moderni, inclusivi e manutenibili. Alcuni di questi progetti sono già attivi, altri sono invece previsti dalla roadmap. Per restare aggiornati sull’evoluzione dei progetti consigliamo di iscriversi alla newsletter di Designers Italia.
Il sito designers.italia.it contiene:
- I riferimenti alla versione corrente delle Linee Guida di Design
- Una serie di kit per il design dei servizi della Pubblica Amministrazione
- Il blog con case histories di utilizzo dei kit
Il codice sorgente del sito stesso si trova in un repository GitHub aperto ad ogni tipo di contributo.
UI Kit
Lo UI Kit è un set di componenti visive già pronte per assemblare l’interfaccia di un sito o di un app, seguendo le linee guida per i servizi digitali della Pubblica Amministrazione. Il Kit è costruito con Sketch e definito in maniera aperta e collaborativa su GitHub insieme alla community dei designer. Lo UI Kit è il punto di riferimento per i componenti e i pattern di UI destinati ad essere implementati con l’utilizzo dei Web Development Kit, mostrati di seguito.
Molti progetti della Pubblica Amministrazione stanno già utilizzando lo UI Kit per definire le proprie interfacce, tra cui i modelli per i siti dei comuni e i siti delle scuole.
Per domande e discussioni sullo UI Kit, sullo Slack di Developers Italia è disponibile e aperto a tutti il canale #design-ui.
Web Development Kit
I Web Development Kit sono un insieme di strumenti per lo sviluppo front end di siti e applicazioni web. Sono librerie HTML, CSS e Javascript che permettono di realizzare siti conformi alle Linee Guida di Design e realizzano in codice quanto previsto dallo UI Kit. Allo stato attuale, il kit per lo sviluppo web più stabile, aggiornato e maturo è Bootstrap Italia, basato sulla libreria open-source Bootstrap 4.
Bootstrap Italia
Il kit basato su Bootstrap 4 è il punto di riferimento per lo sviluppo dei progetti della Pubblica Amministrazione. Lo scopo principale è mettere a disposizione della comunità di sviluppatori, coerentemente con le Linee Guida di Design, la sintassi, gli strumenti, il parco di plugin e le convenzioni tipiche di uno strumento da molti già conosciuto ed utilizzato, quale appunto Bootstrap 4.
Bootstrap Italia è già utilizzato su alcuni progetti con successo, come il prototipo del sito del Comune di Cagliari e il sito Docs Italia.
Altri progetti, come i siti per le scuole e i temi per i principali CMS (Wordpress, Drupal, Joomla, Plone, Entando, ecc.) e generatori di siti statici (Hugo, Jekyll, ecc.), sono in fase di valutazione o pianificazione. L’unico attualmente disponibile, per quanto ancora in lavorazione, è il Tema Wordpress.
Per segnalare un sito, una app o un tema realizzato con Bootstrap Italia, puoi aprire una issue sul repository di Bootstrap Italia o scrivere un post sul forum!
Web Toolkit
Il Web Toolkit è stato il primo progetto concreto per aiutare la realizzazione di siti web per la PA; esso è già usato da molti siti web, in particolare alcuni comuni e ministeri. I feedback ricevuti sull’utilizzo del Web Toolkit da parte di enti e fornitori hanno contribuito alla definizione e alla creazione del kit di riferimento Bootstrap Italia.
Per questo, il Web Toolkit non è più oggetto di significativi aggiornamenti dal 2017.
Design React Kit
Il progetto ha come obiettivo quello di costruire un set di componenti ed un layer di presentazione comune basato su React. Il focus del progetto sono state, almeno in questa fase iniziale, le web app e/o le applicazioni mobile ibride basate su React Native. Il React Kit non è ancora completo in quanto molti dei componenti presenti su Bootstrap Italia non sono ancora stati convertiti per l’utilizzo come componenti React.
Design Angular Kit
Il progetto ha come obiettivo quello di costruire un set di componenti ed un layer di presentazione comune basato su Angular. Il kit non è ancora completo.
Le contribuzioni sui kit sono molto importanti, per cui se pensi di poter dare una mano con feedback, informazioni utili, segnalazioni di bug o codice, fatti avanti!
Per domande e discussioni sui Web Development Kit, sullo Slack di Developers Italia è disponibile il canale #design-devel.
Altri kit utili per la progettazione
Lo sviluppo web è soltanto parte del ciclo di lavorazione di un servizio secondo le Linee Guida di Design. Designers Italia mette a disposizione Kit che coprono tutto il ciclo di progettazione di un servizio, dalla ricerca all’architettura dell’informazione, passando per i test con gli utenti. Per maggiori informazioni, puoi iniziare dalla pagina dei Kit sul sito di Designers Italia.
Per domande e discussioni su questi kit di design, sullo Slack di Developers Italia è disponibile il canale #design-service.
