Tra fine settembre e inizio ottobre Figma ha rilasciato una serie di aggiornamenti che avvicinano prototipi e prodotto finale: nuove funzioni di animazione con esportazione in Lottie, uno spazio per condividere esperimenti di motion design e il wrap verticale nell'auto layout.

Motion: stili, audio e testo

Le funzioni di animazione si arricchiscono di stili di animazione personalizzati, della possibilità di sovrapporre tracce audio e di animazioni dedicate al testo. La novità più interessante per chi lavora con gli sviluppatori è l'esportazione in formato Lottie, disponibile in beta aperta: le animazioni progettate in Figma possono essere integrate in siti e app senza doverle ricostruire a mano.

Community riffs

Con i «riffs» la Community di Figma accoglie animazioni, prototipi ed esperimenti, pensati per essere condivisi e rielaborati. È uno spazio utile per studiare soluzioni di interazione e per trovare spunti da adattare ai propri progetti.

Auto layout con wrap verticale

Dal 25 settembre l'auto layout supporta il flusso verticale con ritorno a capo, che permette di costruire layout responsive a più colonne. Il comportamento è vicino a quello di flexbox e delle griglie CSS: i contenuti si distribuiscono e si riorganizzano in base allo spazio disponibile, riducendo la distanza tra ciò che si progetta e ciò che verrà sviluppato.

App mobile

Anche l'app mobile si aggiorna con il menu a tendina delle pagine, uno slider per l'anteprima dei frame e link di condivisione dedicati ai singoli frame, comodi per revisioni rapide con clienti e colleghi.

Come sfruttarli nel lavoro

  • Usare l'esportazione Lottie per micro-animazioni di interfaccia, come stati di caricamento, conferme e icone animate, verificando sempre il peso del file
  • Progettare griglie di card e contenuti con il wrap verticale, controllando il comportamento a diverse larghezze prima della consegna
  • Concordare con gli sviluppatori quali animazioni passare in Lottie e quali realizzare direttamente in CSS

Questi aggiornamenti riducono le traduzioni manuali tra design e sviluppo. Per i team significa meno tempo speso a ricostruire ciò che è già stato progettato e più attenzione alla qualità dell'esperienza finale.