Raster o vettoriale: quale formato per le illustrazioni?

Il PNG dello stato vuoto sembrava a posto a 1x. L'ho messo in una sezione hero a 2x e i bordi si sono impastati. Poi dal brand è arrivata la richiesta: blu navy al posto del senape. E Figma vedeva il file come un'unica immagine bloccata.

Per chi lavora con le illustrazioni, la differenza tra immagini raster e vettoriali è tutta qui. Niente lezioni di informatica: la domanda è se martedì prossimo potrai ancora cambiare un colore.

Le illustrazioni per i prodotti che seguo le preparo in Illustro. Per quelle che vanno dentro l'interfaccia apro il generatore SVG con AI, imposto Stile su Flat ed esporto in SVG. Per il 3D in plastilina e le pagine da fiaba resto di proposito sul PNG o sul JPEG. È il lavoro a decidere il formato.

Raster e vettoriale: cosa cambia per le illustrazioni

Un'immagine raster è una griglia di pixel colorati: PNG, JPEG, GIF, TIFF, WEBP. Se zoomi vedi i quadratini, e se la ingrandisci oltre le sue dimensioni si sgrana.

Il confronto tra raster e vettoriale di Adobe fa la stessa distinzione. Le foto e i dettagli dipinti stanno da questa parte, perché il file memorizza il colore di ogni singolo punto.

Un'illustrazione vettoriale invece è fatta di forme, linee e curve descritte con formule matematiche, e sul web il suo formato è l'SVG. Che tu la riduca a un'icona da 24px o la allarghi a tutta pagina in una sezione hero, il bordo resta una linea netta.

La prova che faccio davvero parte dalla panoramica di MDN sull'SVG: apri il file. Se trovi codice XML che descrive un tracciato, hai un vettoriale. Se c'è una bitmap infilata dentro un contenitore, è ancora un raster, e l'estensione ti ha mentito.

Con le illustrazioni, di solito le strade sono due: ricolorare e ridimensionare una grafica che sta accanto all'interfaccia, oppure conservare la morbidezza della pittura, della plastilina e della luce. Scegli il formato che fa quel lavoro, non quello che suona più «professionale».

Vettoriale e raster a confronto

Per la grafica raster e vettoriale in generale vale la stessa tabella. La riga che molti team saltano è quella dedicata alle illustrazioni: un bel PNG di una volpe resta un raster, mentre una volpe in stile flat che puoi ricolorare con Colori è un vettoriale.

Quando il vettoriale è il formato giusto per le illustrazioni

Stati vuoti, la sezione delle funzionalità, una grafica che deve stare a 24px nel menu e a 1600px su una landing page. Lì voglio l'SVG.

Anche Figma va più d'accordo con i vettoriali: ottieni forme, non un unico livello appiattito. La guida di Figma all'esportazione spiega Copy as SVG per quando fai il percorso inverso.

Se la posa è già giusta e a non andare è solo il giallo, con un vettoriale basta cambiare il riempimento. In Illustro lo fai con Colori, gratis, purché il file contenga codice SVG vero.

Come spiego in cos'è una flat illustration, il flat riguarda l'aspetto: forme piene, pochi colori, di solito uno sfondo crema. Il vettoriale è il file che c'è sotto. Anche il disegno al tratto è vettoriale, solo che ricorda la china più che le forme piene.

Chiedi una grafica, non una fotografia. Indica il soggetto, la posa e due o tre colori, e lascia fuori «cinematografico» e «8k». È la stessa regola che trovi in come creare un file SVG con l'AI che puoi ancora ricolorare.

I loghi sono un altro discorso. Le piccole forme flat possono essere leggibili, ma Illustro non è un programma per creare loghi. Un marchio da stampare su mille gadget richiede comunque un designer con lo strumento penna in mano.

Quando il raster è il formato giusto per le illustrazioni

Il 3D in plastilina ha l'aspetto di un piccolo oggetto fotografato in studio: opaco, tondeggiante, illuminato. Quella luce è fatta di pixel, e in Illustro nessun SVG potrebbe restituirla davvero. Scarica il PNG se ti serve la trasparenza, il JPEG se lo sfondo bianco va bene.

Una volta ho provato a «vettorializzare» una figurina di plastilina: ne sono uscite macchie piatte, e si è perso proprio il motivo per cui avevo scelto il 3D. Se il lavoro è quello, leggi come creare una mascotte 3D senza Blender e tieniti il raster.

Lo stile Libro per bambini ricorda la gouache, ed è voluto: il punto è proprio il colore morbido. Ricalcarlo in tracciati netti rovina la pagina, quindi PNG o JPEG. Rimuovi sfondo costa 1 credito con gli stili Libro per bambini e 3D, mentre con flat e line art non è disponibile.

Le foto restano raster. Un programma di ricalco può simulare un logo vettoriale, ma la grana fotografica non la conserva. Se ti serve solo la posa, trasforma la foto in un cartoon in stile flat (3 crediti). È una conversione di stile, non un ricalco fedele della foto originale: dopo puoi esportare in SVG (1 credito).

Qui raster o vettoriale è una scelta di stile, non una classifica di qualità. Le immagini morbide vogliono i pixel, le forme nette vogliono i tracciati.

SVG, PNG o JPEG

Chi cerca «PNG o SVG» di solito vuole sapere se gli serve un raster o un vettoriale. Ecco cosa c'è davvero nel menu di download.

SVG. Vettoriale vero: ricolori un riempimento, ingrandisci senza impastare. Esporta in SVG costa 1 credito sulle immagini generate o convertite, ed è gratis se hai caricato un tuo SVG. Con gli stili Libro per bambini e 3D non compare.

PNG. Raster, gratis, conserva la trasparenza. Va bene per un'immagine statica che non dovrai ricolorare tracciato per tracciato. Illustro può convertire un SVG in un PNG ad alta risoluzione direttamente nel browser, ma una volta scaricato quel PNG hai di nuovo dei pixel.

JPEG. Raster, gratis, con sfondo bianco. Comodo per le email, le presentazioni e i programmi che vanno in crisi con la trasparenza.

L'SVG non è sempre la scelta migliore. Lo è quando ti servono i tracciati. Il PNG è meglio quando l'aspetto dell'immagine è già quello giusto e ricalcarla servirebbe solo a rovinarla.

Come scelgo tra vettoriale e raster in Illustro

1. Parti dal lavoro da fare. Interfaccia e landing page: Flat o Line art. Mascotte giocattolo: Illustrazione 3D. Albo illustrato: Libro per bambini.
2. Controlla la modalità. Illustro Light per esplorare (1 credito con flat o line art, 2 con 3D o Libro per bambini), Illustro MAX per la versione da pubblicare (2 / 4). L'editor parte da Light, quindi guarda il selettore prima di premere Genera.
3. Scrivi il soggetto. Per uno stato vuoto vettoriale incollo qualcosa come: «Persona senza volto che innaffia una pianta appesa, vista di lato, maglione terracotta, pantaloni blu navy, sfondo crema, forme geometriche semplici, senza tratti del viso, senza sfumature».
4. Premi Genera e controlla la posa.
5. Stili vettoriali: apri Colori se la palette è sbagliata, Modifica con l'AI (3 crediti) se ti serve un oggetto in più. Colori non sa disegnare un oggetto nuovo.
6. Stili raster: Modifica con l'AI oppure rigenera. Rimuovi sfondo se ti serve il soggetto scontornato.
7. Scarica PNG o JPEG gratis. Esporta in SVG (1 credito) solo quando lo stile lo prevede.

Faccio questo giro nel generatore SVG con AI quando il file deve restare una grafica. Poi inserisco l'SVG con il plugin Figma di Illustro, oppure lo esporto e lo trascino sul canvas.

Non forzare in SVG un'illustrazione 3D o una tavola da libro per bambini: resteresti ad aspettare un pulsante che non c'è. Nel dubbio, vale la regola di prima: flat e line art si esportano in SVG, 3D e Libro per bambini restano PNG o JPEG.

Domande frequenti

Il JPEG è raster o vettoriale?

Il JPEG è un file raster. Memorizza una griglia di pixel, di solito con una compressione che sacrifica parte dei dettagli di colore. In un JPEG non puoi ricolorare un tracciato come faresti in un SVG. Usalo per foto, 3D in plastilina e immagini da fiaba che non dovrai ingrandire molto oltre la loro misura in pixel.

L'SVG è vettoriale o raster?

L'SVG è un formato vettoriale quando contiene tracciati veri: è XML che descrive forme, non una griglia di quadratini. Alcuni programmi infilano un PNG dentro un file con estensione .svg. Aprilo: se non riesci a selezionare un riempimento, hai ancora un raster.

Il PNG è vettoriale o raster?

Il PNG è raster. È utile perché conserva la trasparenza e non aggiunge gli artefatti di compressione del JPEG. In Illustro scaricare il PNG è gratis con tutti gli stili. È l'esportazione giusta per il 3D e per Libro per bambini, mentre per flat e line art è un formato da anteprima, che basta se in seguito non dovrai ricolorare nulla.

Posso trasformare un PNG in un file vettoriale?

Puoi vettorializzarlo con un ricalco, che costruisce forme nuove per approssimare i pixel. Ma un disegno che non è mai stato un tracciato non lo recuperi. Con Vettorializza immagini di Illustro carichi un PNG, un JPG o un WEBP e, per 1 credito, ottieni un SVG che segue le forme e i colori del file. Se invece parti da una foto e vuoi cambiarle stile, lo strumento «Trasforma una foto in cartoon» la rende un'immagine in stile flat (3 crediti), poi l'esportazione in SVG costa 1 credito.

L'SVG è meglio del PNG?

Per le illustrazioni di interfaccia sì, se devi ridimensionarle o ricolorarle. Per il 3D in plastilina e le illustrazioni da fiaba no: quelle immagini sono fatte di luce e di morbidezza, e l'SVG le appiattirebbe. Lì scegli PNG o JPEG, e tieni l'SVG per flat e line art.

Il PDF è vettoriale?

Un PDF può contenere vettoriali, raster o entrambi. Il PDF di una pagina con un logo potrebbe essere fatto di tracciati, quello di una fotografia resta fatto di pixel. Non fidarti dell'estensione: controlla se riesci a selezionare una forma. Per le illustrazioni web io continuo a esportare da Illustro in SVG o PNG, non in PDF. Raster o vettoriale non dipende dal nome del file, ma dai dati che ci sono dentro.