SpritePilot Guides & Tutorials
Step-by-step walkthroughs for every SpritePilot tool — from splitting your first sprite sheet to importing finished atlases into Unity, Godot, or Phaser. Every tool is free to use, with no signup and no installs.
Basics
- How to Draw Your Own Pixel Art Sprite — Create and animate a pixel-art sprite from scratch in the free browser editor: tools, symmetry, onion skin, animation frames, and exporting to GIF or your game engine.
- How to Split a Sprite Sheet into Individual Sprites — Cut any sprite sheet into separate sprite images using automatic alpha detection or exact grid slicing — with the settings explained slider by slider.
- How to Make a Sprite Sheet from Separate Images — Pack any number of individual images into one optimized sprite sheet with bin-packing or grid layout, padding control, and JSON metadata — free and in your browser.
- How to Preview a Sprite Sheet Animation — Load any sprite sheet in the free Sprite Player, line up the frame grid, scrub frames, adjust FPS, and check your animation before it goes anywhere near an engine.
- Sprite Sheet Export Formats Explained — TexturePacker hash vs Phaser array, Godot JSON vs SpriteFrames .tres, Aseprite JSON, CSS sprites, and what padding and extrude actually do — a practical map of every export option.
- How to Batch Scale & Optimize Sprites — Resize every sprite in your session to one shared size, sharpen or denoise them, choose lossless PNG or compressed JPEG — then apply the results to your session for export or download them as a ZIP.
Converters
- How to Convert a GIF to a Sprite Sheet — Turn any animated GIF, APNG, or animated WebP into a game-ready sprite sheet with JSON metadata — decoded frame by frame in your browser.
- How to Convert a Video to a Sprite Sheet — Sample frames from an MP4 or WebM at a rate you choose and pack them into a sprite sheet with JSON metadata — all in your browser, nothing uploaded.
- How to Convert a Sprite Sheet to a GIF — Turn a sprite sheet into a shareable animated GIF or a lossless APNG: set the grid, preview at any FPS, and export — free, private, browser-based.
- How to Remove the Background from a Sprite Sheet — Make solid magenta, green, or white backgrounds transparent with a color picker and tolerance slider — then send the clean sheet straight to sprite detection.
Game Engines
- How to Import a Sprite Sheet into Unity — Two reliable paths from a SpritePilot export to Unity sprites: grid slicing in the Sprite Editor, or TexturePacker JSON with a free importer — plus the settings that keep pixel art crisp.
- How to Import a Sprite Sheet into Godot 4 — Use SpritePilot’s ready-made SpriteFrames .tres with AnimatedSprite2D — or parse the Godot JSON export for AtlasTexture workflows. Both paths, step by step.
- How to Load a Sprite Atlas in Phaser 3 — Export the Phaser 3 JSON array format from SpritePilot and load it with this.load.atlas — including animation setup with generateFrameNames.
Level Design
- How to Build Tile Maps in Your Browser — Paint tile-based game levels with brush, eraser, flood fill, and layers, using your own tiles or detected sprites — then export JSON for your engine.