Spritesheet atlas packing
Skill 0xheycat/isometric-game-skills/skills/spritesheet-atlas-packing
Agent-ready toolkit for isometric games: ComfyUI art pipelines, seamless terrain, sprites, grid math, Canvas2D rendering, pathfinding, and asset automation.
npx -y skills add 0xheycat/isometric-game-skills --skill spritesheet-atlas-packingAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 5 stars5 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Use when packing many isometric sprites into a texture atlas with a JSON map so the engine draws from one image with correct frame coordinates.
The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.
SKILL.md
1.9 KB, as published. Nobody here has run it
Spritesheet & Atlas Packing
Overview
Drawing 200 separate images means 200 texture binds and slow load. An atlas packs sprites into one image plus a JSON of frame rects. This skill produces an atlas the renderer can index by name.
When to Use
- You have many individual sprite PNGs to ship.
- Load times or draw calls are high because of separate images.
- The renderer needs named frame lookups.
Process
- Collect all cleaned, transparent sprites into one folder.
- Pad each frame by 1-2px to prevent texture bleeding between neighbors.
- Pack into a power-of-two atlas (e.g. 2048x2048) using a bin-packer.
- Emit a JSON map: name -> {x, y, w, h, anchorX, anchorY}.
- Keep anchors from the source sprites so placement stays correct.
- Verify every sprite is found by name and renders at the right anchor.
- Regenerate the atlas automatically in the build (see
asset-pipeline-automation).
{ "tree_oak": { "x": 0, "y": 0, "w": 128, "h": 160, "anchorX": 64, "anchorY": 150 } }
Rationalizations (Stop Lying to Yourself)
| Excuse | Reality |
|---|---|
| "I will just load images individually" | Hundreds of texture binds kill performance. Pack an atlas. |
| "Padding is unnecessary" | Without padding, neighbors bleed at non-integer zoom. Always pad. |
Red Flags - STOP if you catch yourself:
- No padding between packed frames (texture bleeding).
- Atlas not power-of-two.
- Anchors lost during packing so placement breaks.
Verification
You are NOT done until every box is checked:
- All sprites packed into a power-of-two atlas with padding.
- JSON map resolves every sprite by name with correct anchor.
- No texture bleeding at fractional zoom.