AsepriteをGameMakerへ · タグごとにストリップ
AsepriteのアニメーションをGameMakerへ持っていくには、タグ1つを1スプライトにする必要があり、ファイル名末尾の_stripNが何コマに分けるかを伝えます。ファイルをドロップしてGameMaker向けに書き出すと、タグ別の横長の帯画像と、原点・再生速度・ミリ秒を記したgamemaker.jsonができます。ただしGameMaker上では未検証です。動かせるGameMakerがなく、帯画像をデコードして元のフレームと照合するところまでしか確かめていません。
GameMakerは.asepriteファイルを開けず、画像を取り込みます。名前が…_stripNのPNGはNフレームのスプライトになります。ファイルをNerulioに入れてタグを確認し、GameMaker向けに書き出すと、タグごとに帯画像1枚(spr_hero_attack_strip4.png)ができます。逆再生・ピンポンは展開し、全フレームをピボットにそろえて原点1つで足りるようにし、原点・速度・フレームごとのミリ秒をgamemaker.jsonに書きます。GameMakerのスプライトは速度が1つなので、不ぞろいな時間はデータとしてだけ残ります。GameMaker上では未検証です。帯をデコードして元と比べただけで、GameMakerで読み込んだことはありません。

- GameMaker未検証
- Godot 4検証済み· Godot 4.7.2
- Unity 6検証済み· Unity 6000.5.3f1
- Phaser 3 / 4検証済み· Phaser 3.90 + 4.2
- PixiJS 8検証済み· PixiJS 8.21
- 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
- CSS sprites検証済み· Chromium
- GIF / APNGデコード確認· Pillow
時間を持つタグから、速度が1つのスプライトへ
Asepriteはキャラクター全体を1ファイルに持ちます。長さがばらばらのフレーム、方向と繰り返し回数を持つ動作ごとのタグ、レイヤー、ピボットを持てるスライスです。GameMakerは動作ごとに別のスプライトアセットにフレーム、原点1つ、再生速度1つを持ち、マニュアルの帯の決まりによってPNG 1枚にそのスプライトの全フレームを入れられます。
Nerulioはフレームごとに表示中のレイヤーを合成し、タグを再生順にたどります。逆再生のタグは逆順に書き、3フレームのピンポンのタグは0-1-2-1になるので、Nは1周のステップ数です。1つのタグの全フレームは、ピボットが同じピクセルに来るよう共通のセル1つに描かれ、そのピクセルが原点です。ファイル名は小文字になり、英字・数字・アンダースコア以外は_になります。
2つの形式がいちばん違うのは時間です。タグの全フレームが同じ長さなら、速度はちょうど毎秒 1000 ÷ ms フレームです。違えば帯にはタグの速度(Studioのタグは10 FPS)を書いて警告し、実際のミリ秒はdurationsMsに残ります。繰り返し回数はJSONのloopになり、帯そのものには時間もループの設定もありません。
- タグ
- Asepriteで方向と繰り返し回数を持つ、名前付きのフレーム範囲。
- 帯(Strip)
- スプライトの全フレームを並べた横長のPNG 1枚。名前は
…_stripN。 - 共通のセル
- 1本の帯の全フレームが共有するセル。全ピボットが1点に来るように大きさを決める。
- durationsMs
- フレームごとの正確なミリ秒。gamemaker.jsonに残る。
例:32 × 32のキャラクターのタグ3つ
idle 4 × 125 ms、∞ → spr_hero_idle_strip4.png 速度 1000 / 125 = 8、loop true
jump 3 × 80 ms、ピンポン → 順序0-1-2-1 → spr_hero_jump_strip4.png 速度 12.5
attack 100, 100, 150, 250 ms → spr_hero_attack_strip4.png 速度 10 +警告、loop false
attackの32 × 32フレームのピボット:x = 16, 16, 20, 12(突き)、y = 31
セルの幅 = 左の最大 20 + 右の最大 (32 − 12) 20 = 40
セルの高さ = 31 + (32 − 31) = 32 原点 x 20、y 31
帯 = 4 × 40 = 160 × 32 px絵の中でピボットが動くため、attackのセルは32pxのフレームより広くなります。全ピボットをx 20に置くからこそ、腕が突き出る間も体がその場にとどまります。
変換後に残るもの
| Aseprite | NerulioのGameMaker用ファイル | GameMaker |
|---|---|---|
| タグ | タグごとに帯1本(例:spr_hero_attack_strip4.png) | 取り込み時にNフレームに切られるスプライト1つ |
| 方向:逆方向・ピンポン | フレーム順を展開。N = 1周のステップ数 | その順のNフレーム |
| フレームの長さがすべて同じ | playbackSpeed = 1000 ÷ ms | Frames per second単位の速度 |
| フレームの長さが混在 | タグの速度+警告、実際のmsはdurationsMs | 速度は1つ。フレームごとの時間はコードでのみ |
| ピボットスライスかPのピボット | 全フレームを共通のセルに配置、xorigin・yorigin | 任意指定の原点 |
| 繰り返し ∞ / 回数 | JSONのloop: true / loop: false | 取り込みでは設定されない。1回再生のスプライトはコードで止める |
| 表示中のレイヤー | 合成、非表示のレイヤーは除外 | 統合されたフレーム |
| hit / hurtのスライス | 書かない(汎用JSONの書き出しを使う) | コリジョンマスクはGameMakerで設定 |
できること
- タグ1つに帯画像1枚、名前はspr_<ファイル>_<タグ>_stripN.png。Nは逆再生・ピンポンを展開した再生順のコマ数。
- コマの大きさがすべて同じで基準点も各コマの同じ位置なので、GameMakerの原点1つで全フレームが定位置に。
- スプライト単位のgamemaker.json:xorigin・yorigin、毎秒のコマ数で書いたplaybackSpeed、loop、各コマのdurationsMs。
- 見えているレイヤーだけを重ねて描き、非表示のレイヤーは入れません。
- READMEにGameMaker側の手順を記載:Create Sprite › Import(またはPNGをAsset Browserへドラッグ)のあとOriginとSpeedを入力。
使い方
- .asepriteをドロップして、タイムラインでタグを見ておく。
- Pツールで基準点を打つか、ファイルにあったpivotスライスを使う。GameMakerの原点はこの点。
- パック&書き出しで書き出し先をGameMakerにして書き出し。
- GameMakerに帯画像を1枚ずつ取り込み、gamemaker.jsonかREADMEにある原点と速度を入れる。
- ドット絵なら対象プラットフォームのGame OptionsのGraphicsでInterpolate colours between pixelsを切っておく。
出力されるファイル
| ファイル | 用途 |
|---|---|
spr_hero_attack_strip4.png | タグごとの帯1本。セルの大きさがそろい、ピボットが1点にある。 |
gamemaker.json | スプライトごとにファイル、フレーム数、セルの大きさ、原点、毎秒フレーム単位の速度、ループ、durationsMs、uniformTiming、verified: false。 |
README-GAMEMAKER.md | 取り込み手順と、帯ごとの原点・速度。 |
帯をGameMakerに取り込む(マニュアルに基づく。ここでは未実行)
- バンドルを展開します。タグごとにPNGが1枚あります。それぞれを名前を変えずに、Sprite EditorのImportボタンかIDEへのドラッグで別々のスプライトに取り込みます。
- コードから呼べるよう、スプライトアセットの名前を接尾辞を除いたファイル名(
spr_hero_attack)にします。 - 原点をREADMEのx・yで直接指定します。上のattackならx 20、y 31です。
- 速度の方式をFrames per secondにし、READMEの値を入れます。idleは8、jumpは12.5、attackは10です。
- 1回だけ再生するタグ(
loop: false)は、最後のフレームのあとにコードでidleのスプライトに戻します。 - ドット絵なら、対象プラットフォームのGame Options › GraphicsでInterpolate colours between pixelsを切ります。
結果の確認
spr_hero_jumpは0-1-2-1の順の4フレーム、spr_hero_attackは40 × 32のフレーム4枚のはずです。- attackの全フレームで原点の十字が足元にとどまるはずです。
- idleの1周は4 × 125 = 500msで、Asepriteのプレビューと同じはずです。
.asepriteからGameMakerのファイルへ
| .asepriteの情報 | GameMaker向け書き出し |
|---|---|
| 8コマのタグ「run」 | spr_hero_run_strip8.png |
| 全コマ同じ長さ(例:100ms) | playbackSpeed=毎秒10コマ |
| 長さが混ざったコマ | playbackSpeedはタグのfps、実際のmsはdurationsMs、警告あり |
| pivotスライスかPで打った基準点 | xorigin / yorigin、全コマで同じ位置 |
| 繰り返し0(ずっとループ) | loop: true |
| 逆再生・ピンポン | 帯画像のコマ順として展開して記録 |
| hit・hurtのスライス | このファイルには入らない(汎用JSONにある) |
| 検証 | GameMaker上では未検証、デコードして元のフレームと照合 |
トラブルシューティング
| 症状 | 考えられる原因 | 確認方法 | 対処 |
|---|---|---|---|
| 攻撃がAsepriteより速く再生される | 長さが混在しているのにスプライトの速度は1つ(10)なので、150・250msのフレームも100msになる | uniformTiming: falseと書き出しの警告 | コードでdurationsMsに従ってフレームの時間を合わせるか、Asepriteでタグの長さをそろえる |
| ピンポンのスプライトのフレームがタグより多い | 往復の順序を帯に展開して書いたため(3フレーム → 4) | フレーム順0-1-2-1 | 正常です。順方向に再生し、さらに反転させないでください |
| idleとattackで原点が違う | 帯ごとにセルが別なので、絵の上では同じ基準点でも数値が違う | READMEの帯ごとの値を比べる | スプライトごとにそれぞれの原点を入れる。1つの原点を全部にコピーしない |
| レイヤーが欠ける、非表示のはずのレイヤーが見える | ファイルで表示中のレイヤーだけを合成する | Asepriteのレイヤーの表示状態 | Aseprite(またはNerulioのタイムライン)でレイヤーの表示を切り替えて書き出し直す |
| ファイル名がタグ名と違う | 名前は小文字にし、空白や記号は_にする("Attack 2" → attack_2) | READMEに全ファイルが載っている | 書かれたファイル名を使うか、Asepriteでタグ名を変える |
| GameMakerの中で何かがおかしい | この書き出しはGameMakerで読み込んだことがない | — | NerulioはGameMakerの動作を確認できません。マニュアルと照らし合わせ、直せるよう事例を知らせてください |
ほかの方法
| 方法 | こんなときに向いています |
|---|---|
AsepriteのFile › Export Sprite Sheetでタグごとに横長の帯を書き出し、_stripNに改名 | すでにAsepriteがあり、タグのピボットが1つで時間が均一なとき。原点と速度は手で入れます。 |
| 手元にあるスプライトシート | スプライトシートからGameMakerの帯を作る。 |
| フレームごとの時間を持てる別のエンジン | AsepriteをGodotへはフレームごとの長さを保ちます。 |
エンジン別の書き出しと検証方法
「検証済み」は、実際の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では未検証:帯をデコードして元のフレームと比べただけです。
- スプライトごとに速度は1つなので、不ぞろいな時間はgamemaker.jsonにだけ残ります。
- GameMaker用のファイルにはヒットボックスも当たり判定の形もありません。
- ポリゴン(メッシュ)パッキングはありません。検証したエンジンのどれも、書き出しデータからメッシュアトラスを描画しないためです。
- GameMakerのストリップはGameMaker本体では未検証です。
- 拡大縮小バリエーション(@0.5x〜@4x)はニアレストネイバーのみです。
- トリムしたStarling XMLはPhaser 3.90で正しく描画されないため、「Sparrow XML (Phaser 3)」プリセットを使ってください。
バージョンと出典
確認したこと:GameMaker用の帯がPillowでデコードでき、全セルが元のフレームと一致すること。.asepriteの読み込みは、実在の231ファイルがAseprite 1.3.18で同じタグ・長さ・ピクセルのまま開き直せることで確認しました。確認していないこと:GameMakerで何かを読み込むこと。検証環境にヘッドレスのGameMakerはありません。帯の命名、取り込み方法、原点、速度の方式、補間のオプションはGameMakerのマニュアルに基づきます。
参照した公式ドキュメント
よくある質問
GameMakerで実際に開いて確かめましたか?
私たちの確認には含まれていません。動かせるヘッドレスのGameMakerがないので、この書き出し先には未検証の表示を付けています。確かめたのは、帯画像がPillowでデコードでき、各コマが元のフレームと同じであることまでで、ファイル名はGameMakerマニュアルのsprite stripの決まりに合わせています。
1つのタグの中でコマの長さが違うときは?
GameMakerのスプライトは再生速度を1つしか持てません。長さが混ざっていればタグのfpsを使って警告を出し、コードでコマごとに合わせられるよう、実際のミリ秒はdurationsMsにそのまま残します。
攻撃判定のボックスも移りますか?
GameMaker用のファイルに入るのは絵・原点・時間だけです。ボックスやコリジョンポリゴンが必要なら汎用JSONで書き出してください。
無料ですか?アカウントは必要ですか?
このページの機能はすべて無料で、アカウントなしで使えます。透かしや制限された書き出しはありません。
スプライトはアップロードされますか?
いいえ。Studioはこのブラウザのタブ内でデコード・パック・書き出しを行います。プロジェクトはブラウザ(IndexedDB)に自動保存され、.nerulioファイルとして保存できます。
Asepriteやエンジンのプラグインは必要ですか?
いいえ。.asepriteファイルはブラウザで読み書きします。エンジン別のバンドルには必要なものが入っています(Godotはインポート設定とシーン、UnityとGodotのタイルセットは小さなエディタースクリプト)。