スプライトシート作成ツール比較 · サイズ・正確さ・重複を実測
スプライトシートを無料で作る4つの方法を、実在のCC0フレームセット5つにトリムあり・余白2の同じ条件で実行しました。CodeAndWebの無料Webパッカー、GAPToolsのテクスチャパッカー、free-tex-packerのnpmコア0.3.9、そしてStudioのPack & Exportです。どれもフレームをPNGとデータファイルにまとめますが、シートの大きさ、フレームがピクセル単位でそのまま戻るか、重複フレームの扱い、ページサイズの上限を守るかが違います。
- Godot 4検証済み· Godot 4.7.2
- Phaser 3 / 4検証済み· Phaser 3.90 + 4.2
- PixiJS 8検証済み· PixiJS 8.21
- Unity 6検証済み· Unity 6000.5.3f1
- Aseprite JSON検証済み· Phaser load.aseprite · PixiJS 8.21
- .aseprite検証済み· Aseprite 1.3.18
- Spine / libGDX検証済み· spine-canvas 4.2
- Starling / Sparrow XML検証済み· Phaser 4.2
- LÖVE検証済み· LÖVE 11.5
- Defoldビルド確認· Defold bob.jar 1.13.1
- GameMaker未検証
- CSS sprites検証済み· Chromium
- GIF / APNGデコード確認· Pillow
できること
- 回転ありなら5セットすべて、回転なしでも5セット中4つで最小のシート。例外のarcherではfree-tex-packerが3037×540の細長い形で0.3%小さくなりました。
- PNGはキャンバスを通さずJavaScriptでデコードするため、gAMA/cHRMの色情報を持つPNGや半透明の縁も変わりません。5セットの全フレームが正確に復元できました。
- 同一フレームはバイト単位で確かめてから1回だけ保存（ninjaの18フレーム→6枚）。最大ページサイズを超える分は最大64ページに分割。
- 書き出し先が別の設定を必要とするとき（Godotは回転なし、Aseprite JSONは1ページ）は、その書き出し用に詰め直し、変更点をボタンの横に表示。
CC0フレームセット5つで比べた無料パッカー4つ
各ツールが作ったシート1枚の幅×高さです。トリムあり、余白2、最大4096。Studioの欄は回転なしの結果を先に、回転ありの結果を後に書いています。
| Nerulio Studio | CodeAndWeb 無料Webパッカー | GAPTools | free-tex-packer-core 0.3.9 | |
|---|---|---|---|---|
| ninja（6フレーム） | 38×50、回転ありで33×57 | 126×62（トリムなし） | 64×36 | 129×20 |
| archer（10フレーム） | 1543×1066、回転ありで1071×1526 | 1532×1668 | 1936×872 | 3037×540（細長い帯） |
| samurai（60フレーム） | 275×248、回転ありで313×216 | 400×400 | 292×256 | 276×300 |
| toon（45フレーム） | 631×591、回転ありで587×592 | 784×780 | 760×496 | 3560×105（細長い帯） |
| spaceshooter（294フレーム） | 966×977、回転ありで944×996 | 1158×1051 | 1024×1024 | 1003×1003 |
| ピクセル単位で復元できたセット | 5つ中5つ | samuraiのみ | samuraiのみ | 5つ中5つ |
| ninja ×3（18フレーム、異なるもの6） | 6枚保存、38×50 | 18枚保存、168×155 | 18枚保存、120×52 | 6枚保存 |
| archer ×8、最大2048 | 5ページ、12,841,021px²。重複除去ありで10枚保存、1543×1066の1ページ | 4213×4448のシート1枚（上限を無視） | 5枚、13,253,792px² | — |
| トリムと回転 | なし・トリム・位置保持クロップ・クロップ、エンジンごとに回転 | どちらもなし（有料のPro機能） | トリム、回転 | トリム、回転 |
| 動作形態 | ブラウザ、ローカル | ブラウザ、ローカル | ブラウザ、ローカル | npmパッケージ（Webアプリは消滅） |
| エンジンが実際に読み込んだ出力 | Godot・Unity・Phaser 3/4・PixiJS 8・Spine・LÖVE・Aseprite、Defoldはビルドで確認 | — | — | — |
この数値の出典: docs/STUDIO-PACK-H2H.md (2026-09-23)
free-tex-packer / GAPTools / CodeAndWebのほうが向いている場合
- free-tex-packerのコアはコマンドライン付きのnpmパッケージなので、ビルドスクリプトの中で動かせます。Studioにはコマンドラインがありません。回転なしのarcherでは、このコアのシートが0.3%小さくなりました（細長い形）。
- GAPToolsとCodeAndWebの無料パッカーはWebページ1つで完結。フレームを入れてボタンを押すだけなので、一度きりのシートならこちらが手早い。
- CodeAndWebの有料版TexturePacker Proは、ここにある無料ツールのどれよりも多機能です。ポリゴンパッキング、GPUテクスチャ形式、スマートフォルダ付きのコマンドライン。Studioは矩形のパッキングのみです。
使い方
- 連番PNG、フォルダ、GIF、.asepriteのどれかをこのページにドロップ。Spriteを経てPack & Exportが開きます。
- トリムあり・余白2・最大サイズを合わせ、自分の素材で同じ比較をしてみる。
- 処理の強さをbestに上げ、使用率とページのタブを今のツールの結果と見比べる。
- エンジン向けに書き出すか、TexturePacker形式のhashであるGeneric JSONで書き出し。
エンジン別の書き出しと検証方法
「検証済み」は、実際のCC0アセットから書き出したファイルを本物のエンジン・ツールで読み込み、元データと比較したという意味です。読み込んでいない形式はそのように表示します。
| 書き出し先 | ファイル | 検証 |
|---|---|---|
| Godot 4 | .tres SpriteFrames · .tscn AnimatedSprite2D · .png.import | 検証済み Godot 4.7.2Godotで読み込み、全アニメーションフレームを描画して元ファイルと比較。シーンはNearestフィルターで、回転は使いません。 |
| Unity 6 | .unity.json · Editor/NerulioSpriteImporter.cs · AnimationClip | 検証済み Unity 6000.5.3f1バッチモードでスプライト範囲・ピボット・ピクセル・クリップのキーと長さを確認。 |
| Phaser 3 / 4 | atlas JSON (multiatlas) · .anims.json | 検証済み Phaser 3.90 + 4.2両バージョンでフレームとアニメーションを描画。 |
| PixiJS 8 | spritesheet JSON · animations · anchor · meta.scale | 検証済み PixiJS 8.21回転・複数ページのアトラスも確認。 |
| Aseprite JSON | hash / array · frameTags · slices | 検証済み Phaser load.aseprite · PixiJS 8.21タグの方向と繰り返し回数を保持。 |
| .aseprite | layers · tags · durations · slices | 検証済み Aseprite 1.3.18Asepriteのコマンドラインで開いて描画。 |
| Spine / libGDX | .atlas | 検証済み spine-canvas 4.2Spineランタイムで回転・トリム領域をすべて描画。libGDX本体は未実行。 |
| Starling / Sparrow XML | XML per page | 検証済み Phaser 4.2Phaser 3.90はトリムされたXMLフレームを誤って描画します（Phaser側の不具合）。「Sparrow XML (Phaser 3)」プリセットはトリムを切り、3.90・4.2とも合格。 |
| LÖVE | Lua quads · nerulio_atlas.lua · main.lua | 検証済み LÖVE 11.5同梱ヘルパーで全フレームを描画し、全アニメーションを再生。 |
| Defold | .atlas · .tilesource | ビルド確認 Defold bob.jar 1.13.1Defoldのコマンドラインビルダーでビルドし、生成テクスチャのUVを読み戻して確認。 |
| GameMaker | spr_<name>_stripN.png · gamemaker.json | 未検証GameMakerでは読み込んでいません（ヘッドレス実行不可）。ストリップはGameMakerの取り込み方式どおりに切ります。 |
| CSS sprites | .css · preview .html | 検証済み Chromium同梱スタイルシートで全クラスを描画。 |
| GIF / APNG | one file per animation | デコード確認 Pillow書き出し後に全フレームと遅延を再デコード。APNGは完全一致。 |
検証の根拠
書き出し：実在のCC0アセットで実際のエンジンを49回実行し47回合格。失敗2回はPhaser 3.90のトリムXMLの不具合で、Phaser 3プリセットで回避。実在の5フレームセットでパッカー比較（CodeAndWeb無料Webパッカー、GAPTools、free-tex-packer）：回転ありで5つすべて最小、回転なしで5つ中4つ。全フレームがピクセル単位で復元できます。
制限
- ポリゴン（メッシュ）パッキングはありません。検証したエンジンのどれも、書き出しデータからメッシュアトラスを描画しないためです。
- GameMakerのストリップはGameMaker本体では未検証です。
- 拡大縮小バリエーション（@0.5x〜@4x）はニアレストネイバーのみです。
- トリムしたStarling XMLはPhaser 3.90で正しく描画されないため、「Sparrow XML (Phaser 3)」プリセットを使ってください。
よくある質問
Webのパッカーでフレームの色が変わるのはなぜ？
今回比べたブラウザツールは<img>と2Dキャンバスを通してPNGをデコードします。そのためgAMA/cHRMを含むninjaのフレームではカラーマネジメントで灰色(50,50,50)が(46,46,46)になり、spaceshooterでは乗算済みアルファにより半透明の縁が最大10段階ずれました。
free-tex-packerはもう使えませんか？
Webアプリのドメインではアプリが提供されていません。npmのコア（0.3.9）はまだ動き、今回測ったのもこのコアです。フレームは正確、重複は1回だけ保存、そしてStudioより小さいシートを作った唯一のケース（回転なしのarcher）もこのコアでした。
「正確に復元」はどう確かめましたか？
アトラスからデータファイル（トリムのオフセット、回転）に従い、TexturePacker JSONの規則で各フレームを切り出し直し、完全に透明なピクセルの色を除いて元のファイルとピクセル単位で比べました。
無料ですか？アカウントは必要ですか？
このページの機能はすべて無料で、アカウントなしで使えます。透かしや制限された書き出しはありません。
スプライトはアップロードされますか？
いいえ。Studioはこのブラウザのタブ内でデコード・パック・書き出しを行います。プロジェクトはブラウザ（IndexedDB）に自動保存され、.nerulioファイルとして保存できます。
Asepriteやエンジンのプラグインは必要ですか？
いいえ。.asepriteファイルはブラウザで読み書きします。エンジン別のバンドルには必要なものが入っています（Godotはインポート設定とシーン、UnityとGodotのタイルセットは小さなエディタースクリプト）。