Sprite Sheet Generator
Combineer afbeeldingen tot sprite sheet met slepen om te herschikken, rasterlay-out, padding, schaalmodi. Exporteer PNG/WebP/JPG met JSON-atlasgegevens voor game-engines en CSS.
Wat is een sprite sheet en waarom zou je er een gebruiken?
Een sprite sheet is een enkel afbeeldingsbestand dat meerdere kleinere afbeeldingen (sprites) bevat die in een raster zijn gerangschikt. Het gebruik van sprite sheets vermindert HTTP-verzoeken, verbetert de paginalaadprestaties en maakt game-rendering efficiënter.
Welke afbeeldingsformaten worden ondersteund?
Je kunt PNG-, JPG-, GIF-, SVG- en WebP-afbeeldingen uploaden. De tool ondersteunt batch-upload en plakken vanuit klembord (Ctrl+V) voor een snelle workflow.
Welke exportformaten zijn beschikbaar?
Exporteer sprite sheets als PNG (met transparantie), WebP (modern formaat met kleinere bestandsgrootte) of JPG (beste voor foto's zonder transparantie). Kies op basis van je platformvereisten.
Hoe herschik ik afbeeldingen in de sprite sheet?
Sleep afbeeldingsminiaturen om hun positie in de sprite sheet te herschikken. Je kunt ook afbeeldingen rechtstreeks vanuit het klembord plakken met Ctrl+V.
Wat zijn JSON-atlasgegevens en welke engines ondersteunen ze?
JSON-atlasgegevens bevatten positie, grootte en frame-informatie voor elke sprite. Ze zijn compatibel met populaire game-engines zoals Phaser, PixiJS, Unity, Cocos2d en vele andere voor automatische sprite-extractie.
Wat zijn de verschillende schaalmodi?
Passend behoudt verhoudingen. Vullen bedekt de cel en snijdt bij. Uitrekken vervormt om te vullen.
Ondersteunt de tool transparantie?
Ja, PNG en WebP behouden transparantie. Je kunt ook een aangepaste achtergrondkleur instellen, wat handig is voor JPG-exports die geen transparantie ondersteunen.
Hoe beïnvloedt padding de sprite sheet?
Padding voegt ruimte toe tussen individuele sprites in het sheet, wat visueel bloeden voorkomt bij het samplen van texturen. Dit is vooral belangrijk voor game-engines die lineaire filtering gebruiken.
Kan ik sprite sheets gebruiken voor CSS?
Ja, sprite sheets werken geweldig voor CSS-sprites. JSON-atlasgegevens kunnen worden gebruikt om CSS background-position-regels te genereren, wat HTTP-verzoeken vermindert en de paginalaadprestaties verbetert.
Wat zijn best practices voor sprite sheet-afmetingen?
Houd afmetingen als machten van 2 (256x256, 512x512, 1024x1024) voor optimale GPU-textuurverwerking. De meeste game-engines geven de voorkeur aan deze afmetingen voor betere prestaties en compatibiliteit.
Hoe verbeteren sprite sheets game-prestaties?
Sprite sheets verminderen draw calls door meerdere sprites te groeperen in een enkele textuur. Dit minimaliseert GPU-statuswijzigingen, vermindert geheugen-overhead en ermöglicht efficiëntere rendering.
Wat is het verschil tussen sprite sheets en texture atlases?
Sprite sheets rangschikken frames typisch in een uniform raster, terwijl texture atlases onregelmatig gevormde sprites efficiënter kunnen inpakken met algoritmen zoals bin packing.