Figma Config 2026: tutte le novità e cosa cambiano per chi fa siti web

Di Daniele Forciniti

Indice del Contenuto

Figma Config 2026 è l’evento annuale di Figma, andato in scena il 24 giugno 2026 a San Francisco, e quest’anno ha portato una svolta: codice, animazioni e intelligenza artificiale entrano direttamente nel canvas, cioè nell’area dove si disegna. Le sei novità principali sono i code layers (il codice trattato come un materiale del progetto), Figma Motion (le animazioni native), gli shader generati descrivendoli a parole, i plugin generativi, i Weave tools e il Figma agent, l’assistente AI. In due parole: disegnare un’interfaccia e costruirla smettono di essere due mondi separati.

Da oltre 10 anni lavoro con siti web, SEO e contenuti, e Figma è lo strumento con cui progetto la maggior parte dei siti prima di svilupparli. Per questo ho seguito Config con attenzione: non è la solita lista di funzioni per addetti ai lavori, è un cambio di direzione che tocca anche chi un sito lo commissiona e basta. Qui ti spiego ogni novità con parole semplici, cosa fa davvero, e — cosa che gli altri articoli non dicono — perché dovrebbe interessarti anche se non aprirai mai Figma in vita tua.

Le sei novità di Figma Config 2026 in sintesi

Se hai fretta, ecco tutto in una tabella. Più sotto trovi ogni punto spiegato con calma e in parole semplici.

Novità	Cosa fa, in una riga
Code layers	Trasforma un elemento disegnato in codice funzionante con un clic
Figma Motion	Crea le animazioni con una timeline dentro Figma, esportabile in codice
Shader	Genera effetti materici e texture descrivendoli a parole
Plugin generativi	Ti costruisci strumenti su misura senza saper programmare
Weave tools	Monti flussi di immagini AI collegando più modelli fra loro
Figma agent	L’assistente AI che costruisce il resto e impara il tuo stile

Cos’è Config e perché quest’anno pesa di più

Config è la conferenza che Figma organizza una volta l’anno per annunciare dove sta andando. Figma, se non lo conosci, è il programma con cui oggi si progetta la stragrande maggioranza dei siti e delle app del mondo: ci disegni le pagine, i pulsanti, i colori, prima ancora di scrivere una riga di codice. È diventato lo standard perché lavora nel browser e più persone possono stare sullo stesso file contemporaneamente, come si fa con un documento condiviso.

Il filo conduttore di quest’anno lo ha riassunto il fondatore Dylan Field con una frase: fin qui l’AI ha “abbassato il pavimento” — ha reso più facile iniziare — ma non ha “alzato il soffitto”, cioè non ha spinto più in alto quello che si può creare. Config 2026 prova a farlo mettendo sullo stesso tavolo materiali che prima vivevano in programmi diversi: il codice, il movimento, gli effetti visivi. Tutto nello stesso posto in cui già si disegna.

Code layers: il codice diventa un materiale come gli altri

È la novità che mi ha colpito di più. Da sempre nel nostro mestiere si parla di “design contro codice”, come se fossero due squadre avversarie: prima il designer disegna, poi lo sviluppatore ricostruisce tutto da capo scrivendo codice. Un doppio lavoro, con l’immancabile “ma non era così nel disegno” a fine giro.

Con i code layers trasformi un elemento disegnato in un elemento di codice funzionante con un clic (o descrivendolo a parole). Da lì lo puoi duplicare per provare più strade affiancate, commentarlo col team, e — comodità non scontata — tornare indietro al disegno modificabile quando serve. Il codice smette di essere una fase separata e diventa un materiale del progetto, come lo sono un’immagine o un colore. La lista d’attesa è aperta su figma.com/config-betas e il rilascio è partito a luglio 2026.

Code layers di Figma: design e codice affiancati sullo stesso canvas — Fonte: Figma

Figma Motion: le animazioni entrano nel disegno

Le animazioni — un pulsante che reagisce, un menu che scorre morbido, un elemento che compare con grazia — sono quelle che fanno sembrare un sito “vivo” invece che una cartolina ferma. Il problema è che finora, per farle, bisognava uscire da Figma e passare ad altri programmi.

Con Figma Motion arriva una timeline dentro Figma — la stessa barra temporale con cui si montano i video — con fotogrammi chiave e preset già pronti. Puoi animare da zero o chiedere al Figma agent di prepararti un punto di partenza. Tre cose la rendono seria per chi poi il sito lo costruisce davvero:

L’animazione entra nel design system: la crei una volta su un componente e viaggia su ogni schermata e su ogni file del team, esattamente come fanno colori e caratteri.
In modalità sviluppo ogni valore è leggibile e si può copiare direttamente il codice dell’animazione in CSS, JSON o React, senza interpretazioni a occhio.
Puoi esportare in MP4, WebM, SVG animata o GIF.

È disponibile con rilascio graduale dal 24 giugno. Questa è la novità che, secondo me, avrà l’impatto più concreto sui siti che vedremo nei prossimi mesi.

Figma Motion: la timeline per animare direttamente in Figma — Fonte: Figma

Shader: effetti materici descritti a parole

Gli shader sono gli effetti che danno “materia” a una superficie: sfumature complesse, texture, luci che si muovono, quell’aspetto tridimensionale e vivo che vedi in certe grafiche curate. Finora crearli era roba da specialisti e difficile da condividere col resto del team.

Adesso descrivi l’effetto che vuoi, o carichi un’immagine di riferimento, e ci pensa il Figma agent a costruirlo. Il risultato arriva già “smontabile”: i parametri diventano comandi sul canvas, così lo regoli come vuoi, lo impili con altri effetti e lo converti in codice quando serve. Gli shader interattivi, dicono da Figma, arriveranno un po’ più avanti — stanno ancora sistemando le prestazioni, e lo scrivono onestamente invece di promettere tutto subito.

Plugin generativi: costruisci i tuoi strumenti parlando

Ogni professionista ha i suoi automatismi, quei micro-strumenti che gli farebbero risparmiare ore. Fino a ieri, per costruirseli in Figma, serviva saper programmare un plugin. Con i plugin generativi descrivi lo strumento che ti serve — cosa deve fare, quali comandi avere — e Figma te lo crea, senza ambiente di sviluppo né conoscenze tecniche. Lo tieni per te o lo condividi con chi lavora sul tuo file, e presto si potrà pubblicarli per tutto il team o per la community.

Figma Weave: i flussi creativi diventano visivi

I Weave tools portano dentro Figma un modo diverso di lavorare con le immagini generate dall’AI. Weave è una tela fatta a “nodi”: invece di scrivere un comando e sperare in un buon risultato, colleghi più modelli tra loro, trasformi gli elementi passo dopo passo e confronti le versioni. In pratica invece di chiedere un singolo risultato modelli un processo intero, visibile e riutilizzabile. Puoi costruire un flusso e pubblicarlo come modello perché altri lo riusino o lo modifichino.

Figma Weave: lo strumento Transfer style applica uno stile a un'altra immagine — Fonte: Figma

Figma agent: l’assistente che impara come lavori

Il Figma agent è l’assistente AI che tiene insieme tutto il resto: è lui che costruisce gli shader, che genera i plugin, che prepara un’animazione di partenza. La novità di quest’anno è che ora si può personalizzare con strumenti e istruzioni proprie, così quello che produce assomiglia davvero al tuo stile invece di essere un risultato anonimo. È l’AI applicata al design con giudizio: fa il lavoro ripetitivo, la direzione la dai tu.

Se il tema dell’AI che entra negli strumenti di lavoro ti interessa, ne ho parlato anche a proposito dei modelli che uso ogni giorno nell’articolo su quanto stai pagando l’AI.

Figma agent mentre esegue piu attivita: crea plugin, applica stili, genera shader — Fonte: Figma

Cosa cambia davvero per chi fa (o commissiona) un sito

Qui arriva la parte che gli articoli scritti da designer per designer si dimenticano. Perché queste novità dovrebbero interessarti se un sito lo vuoi e basta, o se lo costruisci ma non vivi dentro Figma?

Il divario disegno-realtà si stringe. Con code layers e con l’animazione che porta con sé il proprio codice, quello che vedi in fase di progetto assomiglia molto di più al sito finito. Meno sorprese del tipo “in anteprima era diverso”.
I siti diventeranno più animati. Con Figma Motion il movimento smette di essere un lusso da grande budget. Aspettati micro-animazioni curate anche su siti di piccole attività — con il rischio, per chi esagera, di appesantirli: un sito lento non lo salva nessuna animazione.
La velocità di lavoro sale, i costi possono scendere. Se una parte del lavoro manuale sparisce, un progetto ben impostato può costare meno o essere pronto prima. Non è una promessa automatica, ma la direzione è quella.
La differenza la farà sempre di più il gusto, non lo strumento. Se tutti hanno l’AI che genera effetti e animazioni, a distinguere un sito bello da uno anonimo resterà chi sa scegliere. Lo strumento si è alzato, il criterio no.

Nel mio lavoro Figma è il primo passo di ogni progetto: disegno lì il sito, lo condivido col cliente e solo dopo lo costruisco, di solito in WordPress o in Wix Studio. Queste novità non cambiano il mestiere, cambiano la velocità: la macchina si prende il lavoro ripetitivo, io mi tengo le decisioni. Ed è esattamente lì che deve stare il confine.

Quando arrivano e su quali piani

Come sempre con questi annunci, “presentato” non vuol dire “già nelle mani di tutti”. Ecco il quadro dei tempi, per non farti trovare aspettative sbagliate:

Novità	Disponibilità
Figma Motion	Rilascio graduale dal 24 giugno 2026
Code layers	Lista d’attesa aperta, rilascio da luglio 2026
Shader, plugin generativi, Weave	Legati al Figma agent, in arrivo a scaglioni
Figma agent	Il cuore AI su cui poggia il resto

Il consiglio pratico: se usi Figma, iscriviti alla lista d’attesa per le beta e prova le funzioni su un progetto vero, non su un esercizio. Si capisce se uno strumento serve solo mettendolo al lavoro. Se invece un sito lo commissioni, la cosa utile da sapere è che il mercato si sta muovendo verso siti più animati e realizzati più in fretta: chiedi al tuo fornitore come li sta usando.

Domande frequenti

Cos’è Figma Config 2026?
È la conferenza annuale di Figma, tenuta il 24 giugno 2026 a San Francisco, in cui l’azienda annuncia le novità dei suoi strumenti. L’edizione 2026 ha portato codice, animazioni e AI direttamente nel canvas di disegno, con sei novità: code layers, Figma Motion, shader, plugin generativi, Weave tools e un Figma agent più potente.

Cosa sono i code layers di Figma?
Sono elementi disegnati che con un clic diventano codice funzionante, direttamente sul canvas. Servono a trattare il codice come un materiale del progetto, esplorare più versioni affiancate e ridurre il divario tra il disegno e il sito finito. Sono in rilascio da luglio 2026 con lista d’attesa.

Figma Motion serve per fare le animazioni dei siti?
Sì. Aggiunge una timeline dentro Figma per creare animazioni, che poi si possono esportare o convertire in codice CSS, JSON o React. È pensata proprio perché il movimento nasca nello stesso file del design e arrivi coerente fino al sito costruito.

Queste novità sono già disponibili per tutti?
No, non tutte. Figma Motion è in rilascio graduale dal 24 giugno 2026, i code layers hanno una lista d’attesa con rilascio da luglio, e le funzioni legate all’AI (shader, plugin generativi, Weave) arrivano a scaglioni. “Annunciato” non significa ancora “attivo sul tuo account”.

Devo saper programmare per usare le novità di Config 2026?
No. Il senso di questi annunci è proprio l’opposto: descrivi a parole quello che vuoi — un effetto, un’animazione, uno strumento — e l’AI di Figma lo costruisce. Serve semmai occhio e gusto per decidere cosa tenere, non competenze di codice.

Figma sostituisce il lavoro del web designer?
No, ne cambia la parte noiosa. L’AI si prende il lavoro ripetitivo — generare varianti, preparare effetti, scrivere il codice di base — mentre le scelte di gusto, gerarchia e strategia restano umane. Se mai, chi sa decidere bene diventa più prezioso, non meno.

Fonti

Daniele Forciniti

Sono Daniele Forciniti, un esperto di web design e SEO con oltre 10 anni di esperienza e diverse certificazioni professionali. Mi specializzo in HTML e CSS, utilizzo CMS come WordPress. Sono il maggior esperto in Italia di WIX e WIX Studio, mi occupo anche di SEO posizionamento web nei motori di ricerca e digital marketing. Sono appassionato del mio lavoro e continuo ad aggiornare le mie competenze per fornire soluzioni innovative e di alta qualità ai miei clienti.