スプライトシート作成

順序・列数・余白を指定し、PNGと座標JSONを作成。

スプライトシートは多数のフレームを1枚の画像にまとめ、ゲームがテクスチャを何十枚も読まずに済むようにします。詰めてパックしたアトラスには、フレームごとの名前と矩形を書いたデータファイルが付きます。連番PNG、GIF、.asepriteファイルを入れてエンジンのプリセットを選ぶと、Nerulioがブラウザ内でパックし（既定：MaxRects、トリムあり、間隔2px）、そのエンジンが読むデータファイルと一緒にPNGを書き出します。セルがすべて同じ大きさの単純なグリッドシートは、下にリンクした従来の作成ツールを使ってください。

画像をここにドロップ複数のファイルをまとめて処理できます

アップロードなし · この端末で処理

グリッドシートとパック済みアトラス

グリッドシートは全フレームに同じ大きさのセルを割り当てます。そのためエンジンは計算だけでn番目のフレームを見つけられます。列 = n mod 列数、行 = n ÷ 列数（切り捨て）。データファイルは不要ですが、どのセルも一番大きなフレームの大きさになり、透明な余白もそのまま保存されます。

パック済みアトラスは各フレームを見えるピクセルだけに切り詰め、空いた場所に詰め込みます。位置を計算では求められないので、パッカーがデータファイルを書きます。フレーム名、ページ上の保存位置（frame）、元のキャンバス上の位置（spriteSourceSize）、元のキャンバスの大きさ（sourceSize）、90度回して保存したか（rotated）です。エンジンはこの数値で元の大きさの枠内に描くので、トリムしたフレームも位置がずれません。

縁を守る設定が2つあります。シェイプ間隔はフレームの間に透明ピクセルを空け、押し出し（extrude）はフレームの最も外側のピクセルを周りに複製します。テクスチャフィルターが縁のすぐ外を読んでも、隣のフレームではなく同じ色を読むようになります。回転は面積を少し減らしますが、回転したフレームを戻して描けるエンジンは一部だけです。Nerulioのプリセットは、エンジン検証で正しく描かれたPixiJSとSpineでのみ回転を許可します。

ページ: アトラス画像1枚。最大サイズに収まらないフレームは次のページへ（最大64枚）。
トリム: フレームの透明な余白を切り取り、オフセットを記録すること。元の位置に描かれます。
シェイプ間隔（shape padding）: フレーム間の透明ピクセル。既定は2px。
押し出し（extrude）: フレームの縁のピクセルを外側に複製した帯。既定は0、LÖVEプリセットは1。
エイリアス: 見えるピクセルが同一のフレームは、保存領域を1つ共有します。

例：40 × 29の走りフレーム6枚

CC0の忍者の走りモーション6フレーム（各40 × 29px、大半が透明）を、NerulioのPhaserプリセット（トリムあり、間隔2、回転なし）でパックし、ほかの並べ方と比べました。

並べ方                           ページ      面積        横一列比
横一列、6 × 40px                 240 × 29    6,960 px²   100 %
パック、トリムなし、間隔2          82 × 91    7,462 px²   107 %
パック、トリムあり、間隔2          38 × 50    1,900 px²    27 %
パック、トリムあり、回転あり       33 × 57    1,881 px²    27 %

見えるピクセル（バウンディングボックス6個の合計） 1,591 px²
トリム版ページの使用率           1,591 / 1,900 = 0.84

"run_0": { "frame": {"x":0,"y":34,"w":18,"h":15},
           "spriteSourceSize": {"x":10,"y":10,"w":18,"h":15},
           "sourceSize": {"w":40,"h":29}, "rotated": false, "trimmed": true }

run_0は18 × 15ピクセルだけが保存されます。エンジンはこの断片を40 × 29の枠の中で右へ10px、下へ10pxずらし、元の位置に描きます。節約できたのはトリムのおかげです。トリムなしでパックすると、フレーム間の間隔のぶん横一列より少し大きくなります。

エンジンごとに受け取るファイルと、シートの読み込み方

PNGは必ずデータファイルの隣に置いてください。データ側が画像名を持っています（JSONのmeta.image、XMLのimagePath、Spine .atlasのページ行）。

ファイル	用途
`run.png + run.json (Phaser 3 / 4)`	`this.load.atlas("run", "run.png", "run.json")`のあと`this.add.sprite(x, y, "run", "run_0")`。詳しくはPhaserアトラスのページ。
`run.png + run.json (PixiJS 8)`	`const sheet = await Assets.load("run.json")`のあと`sheet.textures["run_0"]`または`sheet.animations["run"]`。PixiJSのスプライトシートJSONを参照。
`run.tres + run.tscn (Godot 4)`	アトラスの代わりに、そのまま使えるSpriteFramesリソースとシーン。Godotでスプライトシートを参照。
`run.unity.json + importer script (Unity 6)`	エディタースクリプトがテクスチャを切り分け、クリップを作ります。Unityでスプライトシートを参照。
`run.lua, run.atlas, run.xml, run.css`	LÖVEのQuad、Defold・Spineのアトラス、Sparrow XML、CSSクラス：LÖVE、Defold、Spine、CSSスプライト。

結果の確認

パック＆書き出しの使用率を見ます。0.84はページの84%が見えるフレーム面積という意味です。低いときは、たいていトリムがオフか、1枚だけ極端に大きなフレームがあります。
パック済みフレーム一覧の行にカーソルを合わせると、キャンバス → 保存サイズ、ページ、トリム・回転・「同じフレーム」（エイリアス）の印が出ます。
エンジンで、トリムしたフレームをトリムしていない隣のフレームと同じ点に描きます。ずれるならローダーがspriteSourceSizeを無視しています（トラブルシューティング参照）。

トラブルシューティング

症状	考えられる原因	確認方法	対処
アニメーション再生中にフレームが跳ねる・揺れる	トリムしたフレームをオフセットなしで描いている。ローダーやコードが`frame`だけを使い`spriteSourceSize`・`sourceSize`を無視	トリム量の違う2フレームを同じ点に描く。そろえば正常	トリム情報を読むローダーを使うか、トリムなしでパック（ページは大きくなる）。トリム後の揺れを参照
拡大時や小数ピクセルの移動時に、フレームの縁に細い線や色のにじみ	テクスチャフィルターがフレームのすぐ外（隣のフレームか透明な間隔）を読んでいる	縁を拡大し、線が隣の色か、透けているかを見る	シェイプ間隔を2以上に保ち、押し出し1を追加、ドット絵は最近傍フィルター。アトラスの間隔を参照
一部のフレームが横倒し・反転・欠ける	回転したフレームを戻さないエンジンやローダーなのに回転を許可した	その項目に`"rotated": true`がある	回転なしでパック。NerulioのGodot・Unity・Phaser・LÖVE・XML・CSS書き出しは回転したパックを拒否する
スプライトがページに収まらないというエラー	間隔と押し出しを足したフレーム1枚が最大ページより大きい	メッセージにフレーム名とサイズが出る	最大サイズを上げる（最大16384px）、エンジンが読めるなら回転を許可、またはそのフレームを縮小

ほかの方法

方法	こんなときに向いています
単純なグリッドシート（下の従来の作成ツール）	全フレームが同じ大きさで、エンジンがセル単位で切り出すとき。例：GameMakerのストリップ、GodotのAdd Frames from Sprite Sheet。同期させるデータファイルがありません。
Aseprite自体のシート書き出し（コマンドラインの`--sheet-pack`、`--trim`、`--merge-duplicates`）	絵をAsepriteで管理し、タグと長さ入りのJSONだけあればよいとき。Godot SpriteFramesのようなエンジン用バンドルは作りません。
TexturePacker Pro	ポリゴンパッキング、GPUテクスチャ形式、ビルドパイプライン用のコマンドラインが必要なとき。Nerulioとの計測比較はTexturePacker代替のページ。
エンジン自身のパッカー（Defoldアトラス、Spineのテクスチャパッカー）	エンジンがビルドや書き出しの時に個別画像をどのみちパックするとき。フレーム画像だけあれば足ります。シートをPNGフレームに分割を参照。

バージョンと出典

上のサイズは、リポジトリのテスト用コーパスにある忍者6フレームをNerulioのパッカーで処理した実際の出力で、2026-09-23の比較計測と同じ数値です。書き出したファイルはGodot 4.7.2、Unity 6000.5.3f1、Phaser 3.90と4.2、PixiJS 8.21、spine-canvas 4.2、LÖVE 11.5で読み込み、DefoldのファイルはDefoldのbob.jar 1.13.1でビルドしました。ほかのツールのオプション名は各公式ドキュメントに従います。

参照した公式ドキュメント

使用例

元の図形サンプル · 96 × 64

処理後のサンプル · 136 × 40

このツールで作成した例です。ZIPツールはプレビューを表示します。すべてのファイルはダウンロードしたZIPで確認してください。