La discussione su design system ai ruota quasi sempre attorno a una domanda: come usare l'intelligenza artificiale per costruire un design system più in fretta. È una domanda legittima e ha già molte risposte. Questo articolo ne pone un'altra, che riguarda chi risponde della coerenza di un sito: come si costruisce un design system che l'AI rispetta quando genera.
La differenza fra le due formulazioni non è retorica. Nella prima l'AI è uno strumento di produzione; nella seconda è un attore che compone pagine e asset, e ha bisogno di vincoli scritti in una forma che possa leggere e applicare.
Key takeaways
- Le brand guidelines sono scritte per un lettore umano: nessun sistema può verificarle.
- Un design system leggibile dalle macchine ha tre livelli: token, componenti, regole di composizione.
- I design token hanno una specifica aperta pubblicata dal W3C: conviene adottarla invece di inventare un formato.
- Una regola che un sistema non può controllare non è una regola, è un'intenzione.
- Il ritorno non è estetico: è la velocità con cui il sito può cambiare senza rompersi.
Perché le brand guidelines non reggono la produzione generativa
Un manuale di identità visiva è un documento scritto perché una persona lo interpreti. Contiene frasi come "il titolo deve avere respiro" o "le immagini devono trasmettere concretezza": indicazioni utili a un designer, che possiede il contesto per applicarle, e inservibili per un sistema, che non lo possiede.
Finché la produzione di pagine è lenta, l'interpretazione umana è sufficiente: c'è tempo per rivedere. Quando la produzione accelera, il collo di bottiglia si sposta sulla revisione, e la revisione è esattamente ciò che l'accelerazione doveva ridurre. Il documento non diventa sbagliato: diventa non applicabile alla frequenza a cui si lavora.
Conviene anche distinguere due oggetti che vengono confusi. Un brand kit è l'insieme degli asset finiti: logotipi, palette, caratteri, immagini approvate. Il tema è trattato nella guida su come costruire un brand kit coerente. Un design system è l'insieme dei componenti e delle regole che generano asset nuovi rispettando quell'identità. Il primo risponde alla domanda "com'è fatto il logo", il secondo a "come si costruisce una pagina che non ho ancora visto".
I tre livelli di un design system ai-aware
| Livello | Che cosa contiene | Forma in cui va scritto | Che cosa impedisce all'AI di sbagliare |
|---|---|---|---|
| Token | Valori atomici: colore, spaziatura, dimensioni tipografiche, raggi, ombre | Formato dichiarativo standard, con nomi semantici e non descrittivi | Usare un colore o una spaziatura fuori scala |
| Componenti | Blocchi con varianti, stati e proprietà ammesse | Definizione con elenco chiuso di varianti e stati | Inventare una variante che non esiste |
| Regole di composizione | Quali componenti convivono, in quale ordine, con quale gerarchia | Vincoli espressi come condizioni verificabili | Comporre una pagina formalmente valida ma incoerente |
Il livello più trascurato è il terzo. Molte organizzazioni hanno token e componenti curati e nessuna regola su come si mettono insieme: il risultato è una libreria ordinata da cui si possono comporre pagine che rispettano ogni singolo elemento e nessuna logica d'insieme.
I design token hanno una specifica standard, e conviene usarla
Il Design Tokens Community Group del W3C riunisce designer, sviluppatori e produttori di strumenti per standardizzare il modo in cui i token vengono definiti e scambiati, con l'obiettivo dichiarato di fornire una tecnologia su cui prodotti e strumenti di design possano contare per condividere su larga scala gli elementi stilistici di un design system (Fonte). Il 28 ottobre 2025 il gruppo ha pubblicato tre moduli finali della specifica, dedicati al formato, al colore e alla risoluzione dei riferimenti, in una forma dichiarata pronta per la produzione e indipendente dal fornitore.
La conseguenza pratica riguarda la portabilità. Un formato proprietario lega il design system allo strumento che lo ha prodotto; un formato standard permette di cambiare strumento senza riscrivere le fondamenta, ed è la condizione che rende il sistema leggibile anche da componenti generativi che non conoscono quello strumento.
Vale anche una nota sui nomi. Un token chiamato "blu scuro" descrive un valore; un token chiamato "colore di superficie primaria" descrive una funzione. Solo il secondo permette a un sistema di scegliere correttamente in un contesto che nessuno aveva previsto, ed è anche il solo che sopravvive a un cambio di identità.
Le regole che un sistema può verificare
Il criterio che distingue un design system utile alla produzione generativa da uno che resta documentazione è la verificabilità. Una regola verificabile ha una condizione controllabile e un esito binario.
"I titoli devono avere respiro" non è verificabile. "Il margine superiore di un titolo di primo livello usa il token di spaziatura più ampio disponibile nella scala" lo è. "Le immagini devono trasmettere concretezza" non è verificabile. "Le immagini di intestazione hanno proporzione 16:9 e non contengono testo" lo è. La riscrittura non impoverisce l'intenzione: la rende applicabile e, soprattutto, controllabile prima della pubblicazione e non dopo.
Restano fuori dal perimetro delle regole alcune scelte che è giusto restino umane: la metafora visiva di una campagna, la priorità editoriale fra due messaggi, il tono di una pagina che tratta un argomento delicato. Non è una limitazione del metodo, è la sua divisione del lavoro. I componenti riusabili e i vincoli coprono la coerenza; le persone coprono il significato. La stessa distinzione vale nel rapporto fra struttura e contenuto descritto negli elementi di un moderno web design.
Come si introduce senza fermare la produzione
Il modo più rapido di non arrivare mai a un design system è decidere di partire dalla copertura completa. La sequenza che funziona è opposta e comincia da un censimento: quali componenti compaiono più spesso nelle pagine esistenti e in quante varianti diverse. Il risultato è quasi sempre sorprendente, perché lo stesso elemento esiste in sei versioni che nessuno aveva deciso di creare.
Da lì si procede per priorità: si consolidano i cinque o sei componenti più usati, si scrivono i token che li governano, si dichiarano le varianti ammesse e si deprecano le altre con una data. Le pagine esistenti si allineano quando vengono toccate per altri motivi, non in una campagna dedicata.
Servono poi tre decisioni di governo. Chi possiede il sistema, cioè chi può aggiungere un componente e chi può solo proporlo. Come si versiona, perché una modifica a un token si propaga ovunque e va tracciata. Dove sta il punto di controllo umano prima della pubblicazione, che con la produzione assistita diventa il presidio che decide la coerenza generativa. La progettazione centrata sull'utilizzo, descritta nella guida allo user centered design, resta il criterio che orienta queste scelte.
Che cosa si misura
Cinque indicatori dicono se il sistema sta funzionando. La quota di pagine composte esclusivamente da componenti del sistema, che misura l'adozione reale. Il tempo dalla richiesta alla pubblicazione di una pagina nuova, che misura il ritorno operativo. Il numero di varianti fuori sistema create nell'ultimo periodo, che misura la tenuta delle regole. Gli interventi di correzione dopo la pubblicazione, che misurano la qualità dei vincoli. Il costo di propagazione di un cambio di identità su tutto il sito, che è la prova definitiva.
L'ultimo merita una riga. In un sito senza design system, cambiare un colore istituzionale significa aprire ogni pagina; con i token significa modificare un valore e verificare il risultato. La differenza si misura in settimane di lavoro, e si presenta ogni volta che l'identità evolve.
Non esistono benchmark pubblici affidabili su questi indicatori: le percentuali che circolano provengono da fornitori di strumenti e non hanno metodologia dichiarata. L'unico confronto utile è con la baseline dello stesso sito prima dell'intervento. Digital360 Connect costruisce i design system dei propri progetti web partendo dal censimento delle varianti esistenti, perché il numero di duplicati è la misura più onesta di quanto il sistema serva.
Conclusione
Un design system pensato per l'era generativa non è un manuale più dettagliato. È lo stesso insieme di decisioni, scritto in una forma che una macchina può applicare e verificare. Ciò che resta umano non diminuisce: cambia soltanto di livello, dalla correzione dei dettagli alla definizione dei vincoli.
FAQ: design system ai
Che cos'è un AI design system?
È un design system i cui token, componenti e regole di composizione sono scritti in una forma leggibile e verificabile da un sistema automatico, così che anche la produzione assistita rispetti l'identità.
Qual è la differenza fra design system e brand guidelines?
Le brand guidelines descrivono l'identità per un lettore umano che la interpreta. Un design system fornisce componenti e vincoli con cui si generano asset nuovi, ed è applicabile anche senza interpretazione.
Che cosa sono i design token?
Sono i valori atomici di un sistema visivo, come colori, spaziature e dimensioni tipografiche, espressi con nomi che ne descrivono la funzione. Il Design Tokens Community Group del W3C ne ha pubblicato una specifica aperta.
Un design system serve anche a un sito di poche pagine?
Serve in proporzione alla frequenza con cui il sito cambia, non al numero di pagine. Un sito piccolo che viene aggiornato ogni settimana ne trae più beneficio di un sito grande che resta fermo.