Come trasformare un foglio di sprite in un GIF a ciclo continuo pulito

Controlla la griglia prima di caricare

Per un foglio di 256 × 128 pixel con quattro colonne e due righe, ogni cella misura 64 × 64 pixel. ImageMint legge le celle da sinistra a destra, poi dall’alto in basso. Se il foglio contiene margini, celle irregolari o una riga finale con spazio vuoto, un taglio diretto per righe e colonne può includere parte di un vicino o una posa vuota. Ritaglia prima quei fotogrammi con Ritagliatore di fogli di sprite e usa invece l’opzione delle immagini separate.

Assegna a ogni posa le stesse dimensioni della tela e lo stesso ancoraggio. Un personaggio che cammina non dovrebbe spostarsi di un pixel in alto perché un fotogramma è stato rifilato più strettamente. Il disallineamento appare come un saltello nell’anteprima; cambiare la velocità non lo corregge.

Crea e prova un ciclo di otto fotogrammi

1. Scegli Opzione B per un unico foglio con celle uguali. Inserisci due righe e quattro colonne prima di caricare. Se hai già otto PNG numerati, usa Opzione A invece.
2. Apri la striscia Ordine dei fotogrammi e scorri tutte le otto pose. Usa le frecce per anticipare o posticipare una posa fuori posto. L’ultima deve tornare naturalmente alla prima; evita un duplicato della prima alla fine salvo una pausa intenzionale.
3. Riproduci a 8 FPS come prova iniziale. Otto fotogrammi a 8 FPS durano un secondo per ciclo; a 16 FPS gli stessi disegni finiscono in mezzo secondo. Valuta piedi e centro di massa invece di considerare un FPS universalmente corretto.
4. Usa Ripeti se si tratta di un’animazione di attesa o camminata. Disattivalo per un effetto singolo, come una reazione a un colpo. Esporta solo quando l’anteprima nel browser presenta l’ordine e il ritmo previsti.

Scopri cosa cambia GIF

GIF ha una tavolozza limitata e una trasparenza sostanzialmente attiva/disattiva, mentre PNG e WebP possono conservare bordi semitrasparenti più uniformi. Ombre sottili o antialiasing morbido possono apparire più duri dopo l’esportazione. Si nota soprattutto negli sprite con bagliori, fumo traslucido o gradazioni cromatiche sottili. Confronta il GIF scaricato con l’anteprima PNG su sfondi chiari e scuri.

L’esportatore usa un ritardo per ogni fotogramma basato sugli FPS, arrotondato a 10 ms. Non memorizza una durata speciale per una posa. Per una pausa più lunga, duplica intenzionalmente un fotogramma oppure modifica i tempi dopo in un editor dedicato. Conserva gli originali per risorse senza perdita.

L’esportazione GIF è limitata a 1024 pixel per lato e 20 milioni di pixel totali dei fotogrammi. Se un foglio valido supera il limite, riducilo o esporta meno fotogrammi. L’anteprima aiuta comunque a diagnosticare i tempi prima di scegliere un output minore.

Prova l’allineamento con un riferimento fisso

Prima di esportare, scegli un punto che deve rimanere stabile: il piede appoggiato in un’animazione di riposo, il centro di un’icona rotante o l’impugnatura di un oggetto oscillante. Scorri le miniature e confronta quel punto con il bordo del fotogramma. Se carichi immagini di dimensioni diverse, l’esportatore GIF le centra nella tela più grande; non allinea il piede o l’impugnatura scelti. Riporta i ritagli più piccoli su una tela comune prima di importarli.

Per un ciclo di camminata, distingui il movimento intenzionale del corpo da un errore di ritaglio. La testa può salire e scendere mentre un piede appoggiato rimane sul pavimento. Spostare ogni posa per allinearne il bordo superiore eliminerebbe questa distinzione e creerebbe un piede scorrevole. Usa la linea di base prevista dalla grafica, non il riquadro più stretto.

Verifica il ciclo scaricato, non solo l’anteprima nel browser

Un ciclo di otto fotogrammi a 8 FPS viene mostrato in anteprima con 125 ms per posa. L’esportatore GIF arrotonda a 130 ms, quindi il ciclo nel file dura 1.04 secondi. A 16 FPS scrive 60 ms, portando il ciclo a 0.48 secondi. Queste differenze possono contare quando confronti un’animazione con musica o altri effetti temporizzati. Un GIF non è un file master con temporizzazione precisa.

1. Riapri il GIF e guarda diversi cicli completi. Un salto dall’ultimo al primo è più facile da notare con la ripetizione.
2. Controlla lo stesso output su sfondi chiari e scuri, soprattutto intorno ai bordi parzialmente trasparenti.
3. Conserva il foglio originale, le impostazioni di righe/colonne e gli FPS scelti in una nota del progetto. Il solo GIF non è un progetto di animazione modificabile.