Generatore di Sprite Sheet
Combina immagini in sprite sheet con drag-to-reorder, layout a griglia, padding, modalità scala. Esporta PNG/WebP/JPG con dati JSON atlas per motori di gioco e CSS.
Cos'è un foglio sprite e perché usarne uno?
Un foglio sprite è un singolo file immagine contenente multiple immagini più piccole (sprite) disposte in una griglia. L'uso di fogli sprite riduce le richieste HTTP, migliora le prestazioni di caricamento della pagina e rende il rendering dei giochi più efficiente.
Quali formati di immagine sono supportati?
Puoi caricare immagini PNG, JPG, GIF, SVG e WebP. Lo strumento supporta il caricamento batch e l'incolla dagli appunti (Ctrl+V) per un flusso di lavoro rapido.
Quali formati di esportazione sono disponibili?
Esporta fogli sprite come PNG (con trasparenza), WebP (formato moderno con dimensioni file più piccole) o JPG (migliore per foto senza trasparenza). Scegli in base ai requisiti della tua piattaforma.
Come riordino le immagini nel foglio sprite?
Trascina e rilascia le miniature delle immagini per riordinare la loro posizione nel foglio sprite. Puoi anche incollare immagini direttamente dagli appunti usando Ctrl+V.
Cosa sono i dati JSON atlas e quali engine li supportano?
I dati JSON atlas contengono posizione, dimensione e informazioni sul frame per ogni sprite. Sono compatibili con engine di gioco popolari come Phaser, PixiJS, Unity, Cocos2d e molti altri per l'estrazione automatica degli sprite.
Quali sono le diverse modalità di scala?
Adatta mantiene le proporzioni. Riempi copre la cella e ritaglia. Allunga deforma per riempire.
Lo strumento supporta la trasparenza?
Sì, PNG e WebP preservano la trasparenza. Puoi anche impostare un colore di sfondo personalizzato, utile per le esportazioni JPG che non supportano la trasparenza.
Come il padding influisce sul foglio sprite?
Il padding aggiunge spazio tra i singoli sprite nel foglio, prevenendo sbavature visive quando le texture vengono campionate. Questo è particolarmente importante per gli engine di gioco che usano il filtraggio lineare.
Posso usare i fogli sprite per CSS?
Sì, i fogli sprite funzionano benissimo per gli sprite CSS. I dati JSON atlas possono essere usati per generare regole CSS background-position, riducendo le richieste HTTP e migliorando le prestazioni di caricamento della pagina.
Quali sono le migliori pratiche per le dimensioni dei fogli sprite?
Mantieni le dimensioni come potenze di 2 (256x256, 512x512, 1024x1024) per una gestione ottimale delle texture GPU. La maggior parte degli engine di gioco preferisce queste dimensioni per migliori prestazioni e compatibilità.
Come i fogli sprite migliorano le prestazioni dei giochi?
I fogli sprite riducono le chiamate di disegno raggruppando più sprite in una singola texture. Questo minimizza i cambiamenti di stato GPU, riduce l'overhead della memoria e consente un rendering più efficiente.
Qual è la differenza tra fogli sprite e atlas di texture?
I fogli sprite tipicamente dispongono i frame in una griglia uniforme, mentre gli atlas di texture possono impacchettare sprite di forme irregolari in modo più efficiente usando algoritmi come il bin packing.
Come usare Generatore di Sprite Sheet
Unisci più immagini in un'unica sprite sheet direttamente nel browser. Trascina per riordinare i fotogrammi, regola con precisione griglia e spaziatura, quindi esporta un atlas PNG/WebP/JPG con dati JSON per game engine e sprite CSS. Tutto viene elaborato in locale.
- Aggiungi le tue immagini e usa i pulsanti + e − per impostare Columns e Rows della griglia.
- Imposta Padding (px) per creare spazio tra gli sprite ed evitare il bleeding delle texture.
- Lascia Sprite Size su Auto per adattarti al fotogramma più grande, oppure digita dimensioni fisse per celle uniformi.
- Scegli uno Scale Mode — Fit, Fill o Stretch — per controllare come ogni immagine occupa la sua cella.
- Seleziona un Background (Transparent, White, Black o Custom), imposta il Format su PNG, WebP o JPG e assegna il nome del file in Filename.
- Trascina le miniature per riordinare i fotogrammi — le coordinate dell'atlas si aggiornano da sole — poi esporta il foglio insieme al JSON.
Usa almeno 2 px di spaziatura così gli sprite vicini non si fondono quando le texture vengono ridimensionate o filtrate nel tuo engine.
Strumenti correlati
- Calcolatrice Chmod Calcolatrice chmod online gratuita per visualizzare e calcolare i permessi dei file Linux con caselle di controllo. Converti istantaneamente tra notazione numerica (755, 644) e simbolica (rwxr-xr-x). Supporta permessi speciali come setuid, setgid, sticky bit.
- Tabella ASCII Riferimento completo per la codifica dei caratteri ASCII con codici decimali, esadecimali, ottali, binari, entità HTML e descrizioni. Ricerca e filtro istantanei.
- Tester di Richieste HTTP Testa le API REST direttamente nel browser. Invia richieste GET, POST, PUT, DELETE con header, body e parametri personalizzati. Visualizza stato, header e corpo JSON della risposta istantaneamente.
- Generatore .htaccess Genera regole .htaccess Apache per reindirizzamenti, riscritture, header di sicurezza, caching e altro.
- Generatore Robots.txt Generatore gratuito di robots.txt online. Crea e personalizza file robots.txt per controllare la scansione dei motori di ricerca, gestire l'accesso dei crawler e ottimizzare il SEO del tuo sito.
- Generatore di Sitemap Generatore gratuito di sitemap XML online. Aggiungi URL, imposta priorità e frequenze, crea sitemap SEO istantaneamente.
- GIF Estrai Fotogrammi Estrai e scarica fotogrammi singoli da animazioni GIF come PNG o sprite sheet. Strumento online gratuito con anteprima ed esportazione ZIP.
- GIF Inverso Inverti l'ordine di riproduzione delle animazioni GIF online gratis. Carica, visualizza in anteprima e scarica istantaneamente.