Figma e la gestione delle immagini: cosa sapere per evitare problemi
Anche se sei un fotografo che non lo utilizzerà mai
Figma è il punto di riferimento per il web design, ma grazie alla sua natura collaborativa e basata sul web viene usato anche per moodboard, campagne social, esportazione di grafiche e molto altro. Insomma, comodissimo. Il problema? A volte viene usato un po’ a caso, anche quando non è lo strumento più adatto. Ad esempio, capita che progetti passino da Figma solo per un semplice crop o un’impaginazione, con il rischio di perdere qualità senza accorgersene.
Per questo, non solo i designer, ma anche fotografi e grafici dovrebbero conoscere le dinamiche con cui Figma gestisce le immagini. Anche se non lo usano direttamente, è probabile che le loro foto e grafiche ci finiscano dentro prima di essere pubblicate. Capire come funziona aiuta a prevenire problemi o almeno a capire cosa è andato storto quando qualcosa non torna.
Come Figma gestisce le immagini
Ecco i punti chiave che devi sapere:
🟣 Importazione ed elaborazione
Le immagini vengono incorporate: Figma non mantiene un collegamento con il file originale, quindi una volta caricate vengono elaborate e non si può tornare al sorgente.
Formati supportati: JPG, PNG, HEIC, WebP, GIF, SVG e, solo su Safari, anche TIFF.
Limite dimensioni: il lato lungo non può superare i 4096 px. Se è più grande, l'immagine viene ridimensionata automaticamente.
Compressione inevitabile: non ci sono opzioni per evitare l'elaborazione o la compressione delle immagini, quindi ogni file subirà una perdita di qualità (minima o evidente a seconda dei casi).
🟣 Esportazione
Formati disponibili: JPEG, PNG, SVG, PDF.
WebP e AVIF non nativi: per esportare in questi formati servono plugin di terze parti.
Non si può scaricare il file originale (tranne nel caso dei vettoriali in SVG).
🟣 Problemi con la gestione colore
Figma supporta progetti in sRGB e Display P3, ma la gestione del colore per le immagini è limitata.
Conversione automatica: tutte le immagini vengono convertite in sRGB. Se il progetto è in Display P3, le immagini vengono semplicemente "mappate" nello spazio colore Display P3 (dopo la conversione in sRGB) causando una perdita di fedeltà cromatica.
Attenzione alle immagini wide-gamut: se carichi file in Adobe RGB, Display P3 o altri spazi colore, i colori non saranno accurati, anche se in fase di export delle immagini puoi selezionare Display P3.
⚠️ Cose da tenere a mente
Non usate Figma come repository di immagini: le immagini caricate saranno sempre elaborate e non potrete più recuperare il file originale in alta qualità.
Se il progetto richiede colori wide-gamut, attenzione! Quello che vedete su Figma potrebbe non essere corretto.
Non esportate immagini da Figma per il web o i social: meglio usare software che gestiscono correttamente il colore e l’ottimizzazione.
Per moodboard e progetti web va benissimo, ma se dovete valutare il colore con precisione, Figma non è affidabile fuori dallo spazio sRGB.
Attenzione quando ricevete progetti con annotazioni sui colori: se le modifiche riguardano la cromia, meglio fermarsi subito. Red flag! 🚩
🚨 Figma su Safari ha problemi con le anteprime delle immagini
Se possibile, usate l’app desktop o browser basati su Chromium. Figma su Safari ha problemi con la visualizzazione delle anteprime, e nonostante segnalazioni al supporto (vedi qui), non ci sono ancora miglioramenti. Speriamo che Figma ci metta mano presto.
👉 NOTA IMPORTANTE: questo è lo stato attuale delle cose, ma Figma è in continua evoluzione (e speriamo che migliori!). Alcune di queste limitazioni potrebbero essere risolte in futuro, altre potrebbero cambiare del tutto. Se ci saranno novità importanti, le condividerò. Seguimi per rimanere aggiornato!
✉️ Digital Spectrum è una newsletter gratuita che scrivo dal 2022, dedicata al presente e al futuro della content creation digitale.
💬 Se vuoi contattarmi per una consulenza, organizzare un corso di formazione per la tua azienda o richiedere un preventivo per postproduzione e assistenza sul set, puoi farlo tramite questo form.
📖 Se stai leggendo questo articolo dal sito o lo hai ricevuto via email da un iscritto, puoi scaricare gratuitamente l’estratto semplicemente iscrivendoti alla newsletter.
ℹ️ Per tutte le informazioni manuelbabolin.com
🔗 Mi trovi anche su: Linkedin | Instagram | Threads | Bluesky