AsepriteをUnity 6へ · スプライトとアニメーションクリップ
.asepriteをドロップしてUnityバンドルで書き出し。アトラス、JSON、スプライトを切り(Point・無圧縮)タグごとにフレーム時間入りのAnimationClipを作る小さなエディタースクリプトが入っています。
Unityは.asepriteファイルをそのまま再生できず、テクスチャ上のスプライトとアニメーションごとのAnimationClipが必要です。ファイルをNerulioに入れてタグを確認し、Unity 6向けに書き出すと、パック済みPNG、JSON、エディタースクリプトが得られます。Tools › Nerulio › Import Studio JSONを実行すると、スクリプトがテクスチャを切り(Point・無圧縮・ピボットスライスのピボット)、タグごとにフレームごとの長さそのままの.animを書きます。逆再生・ピンポンのタグはフレーム単位で展開します。Unity 6000.5.3f1で確認済みで、Unity自体の2D Aseprite Importerパッケージが代替手段です。

- Unity 6検証済み· Unity 6000.5.3f1
- .aseprite検証済み· Aseprite 1.3.18
- Godot 4検証済み· Godot 4.7.2
- Phaser 3 / 4検証済み· Phaser 3.90 + 4.2
- PixiJS 8検証済み· PixiJS 8.21
- Aseprite JSON検証済み· Phaser load.aseprite · PixiJS 8.21
- 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
AsepriteのタグからUnityのクリップへ
.asepriteファイルには、フレームごとのミリ秒の長さ、方向(順・逆・ピンポン)と繰り返し回数を持つタグ、レイヤー、ピボットを持てるスライスが入っています。Unityでこれに当たるのは、Sprite Mode Multipleのテクスチャ、正規化したピボットを持つフレームごとのスプライト、そして決まった時刻にSpriteRendererのスプライトを切り替えるキーを持つAnimationClipです。
Nerulioはフレームごとに表示中のレイヤーを合成してパックし、範囲をUnityの左下基準の座標で書きます。タグ1つがクリップ1つになり、キーはフレームの長さの累計の位置に置かれ、最後のフレームも自分の長さを保つよう締めのキーが付きます。無限に繰り返すタグはLoop Timeオン、回数のあるタグはLoop Timeオフです。クリップには繰り返し回数がないためです。
Unity自体の2D Aseprite Importer(4.xはUnity 6.4以降が必要)はファイルを直接取り込み、保存のたびに再インポートします。ドキュメントによればフレームごとの時間に対応し、∞をループするクリップにしますが、方向はForwardのみ対応で、スライスは取り込みません。
- タグ
- Asepriteで方向と繰り返し回数を持つ、名前付きのフレーム範囲。
- ピボットスライス
- ピボット点を持つAsepriteのスライス。Nerulioはこれをフレームのピボットに使います。
- Loop Time
- クリップを繰り返させるAnimationClipの設定。
- 締めのキー
- 最後のスプライトをもう一度置き、その長さを保つための最後のキー。
例:タグが3つある32 × 32のキャラクター
Aseprite Unity 6 AnimationClip(キーの時刻、秒)
idle 4フレーム × 125 ms、∞ idle.anim 0, 0.125, 0.25, 0.375 | 終了 0.5 loop on
attack 100, 100, 150, 250 ms、×1 attack.anim 0, 0.1, 0.2, 0.35 | 終了 0.6 loop off
jump 3フレーム × 80 ms、ピンポン jump.anim フレーム0-1-2-1:0, 0.08, 0.16, 0.24 | 終了 0.32
32 × 32のキャンバスの(16, 31)にピボットスライス、トリムなしのフレーム
Unityのピボット = (16 / 32, (32 − 31) / 32) = (0.5, 0.03125) (yは上向き)ピンポンのタグは0-1-2-1の順に展開して書くので、Unityで方向の設定に頼らなくても同じように再生されます。
変換後に残るもの
| Aseprite | Nerulio | Unity 6 |
|---|---|---|
| フレームのピクセル(表示中のレイヤー) | 合成したフレームをPNGにパック | そのテクスチャのスプライト範囲1つ |
| フレームの長さ(ms) | フレームごとに保持 | キーの時刻:各フレームは前のフレームの長さの合計から始まる |
| タグ | 同じ名前のアニメーション1つ | 同じ名前の.animクリップ1つ |
| 方向:逆方向・ピンポン | 再生順を展開して記録 | その順に並んだキー |
| 繰り返し ∞ | ループ | Loop Timeオン |
| 繰り返し 1、2、3… | プレビューではその回数再生 | Loop Timeオフ:1回再生 |
| ピボットスライス(またはPで打ったピボット) | フレームのピボット(既定は下中央) | スプライトのピボット、Customの配置、yは上向き |
| hit / hurtのスライス | フレームごとのボックス | Unity向けには書かない(汎用JSONにある) |
| レイヤー | 合成 | フレームごとにスプライト1つ、レイヤー別のスプライトはなし |
できること
- タグはフレームごとの長さを持つAnimationClipに。ピボットはAsepriteのスライスかStudioのピボットツールから。
- Sprite Mode Multiple、Pointフィルター、圧縮なし — ドット絵に必要な設定です。
- 範囲・ピボット・ピクセル・クリップのキーと長さをUnity 6000.5.3f1のバッチモードで確認。
- Unityパッケージやインポーターは不要です。
使い方
- .asepriteをドロップしてタグを確認。
- パック&書き出しでUnity 6を選ぶ。
- バンドルをAssets/にコピー(Editorフォルダーごと)。
- Nerulioのメニューから取り込みを実行し、スプライトとクリップを作成。
出力されるファイル
| ファイル | 用途 |
|---|---|
hero.png | パックしたフレーム(トリム、2px間隔、回転なし)。 |
hero.unity.json | Unity座標のスプライト範囲、正規化したピボット、タグごとにフレームごとのミリ秒とループの有無を持つクリップ情報。 |
Editor/NerulioSpriteImporter.cs | エディタースクリプト:テクスチャの設定、スプライト範囲、.animクリップ。 |
README-UNITY.md | このバンドルの取り込み手順。 |
Unity 6に取り込む
- バンドルのフォルダーを
EditorサブフォルダーごとAssets/にコピーし、PNGはJSONの隣に置きます。Unityがスクリプトをコンパイルします。2D Spriteパッケージが必要です(どの2Dテンプレートにも入っています)。 - Tools › Nerulio › Import Studio JSONを実行し、
hero.unity.jsonを選びます。 - テクスチャがSprite (2D and UI)、Multiple、Point (no filter)、Compression None、PPU 100になっているか確認します。Sprite Editorにはフレームごとにピボット付きの範囲が見えます。
- JSONの隣の
idle.anim・attack.anim・jump.animをAnimationウィンドウで開いてキーを確認します。 - SpriteRendererを持つゲームオブジェクトのAnimator Controllerにクリップを入れます。
attackのような1回きりのタグには、終わったらidleに戻る遷移を加えます。 - UnityのAseprite Importerパッケージが入っているなら、
.asepriteファイル自体はAssets/に置かないでください。Unityが独自の方法でもう一度取り込みます。
結果の確認
attack.animのキーが0・0.1・0.2・0.35秒にあり、Asepriteのタグ全体の長さである0.6秒で終わるはずです。idleはLoop Timeオン、attackはオフのはずです。jumpをAsepriteのプレビューと並べて再生します。0-1-2-1の順序と80ms刻みが一致するはずです。- クリップを切り替えても足がピボットの位置にとどまるはずです。
トラブルシューティング
| 症状 | 考えられる原因 | 確認方法 | 対処 |
|---|---|---|---|
| クリップがループせず1回だけ再生される | Asepriteでタグに繰り返し回数(∞以外)が設定されている | クリップのインスペクターのLoop Time | タグを∞にして書き出し直すか、UnityでLoop Timeにチェック |
| コンソールに「clip … names a missing sprite」 | 取り込む前にPNGの名前を変えたか、JSONから離した | PNGが書き出したときの名前のままJSONの隣にあるか | ファイルを一緒に置いて取り込み直す |
| スプライトがぼやける | 取り込み後にFilter Modeや圧縮の設定を変えた | テクスチャのインスペクター | Point (no filter)とCompression None。Unityのドット絵のぼやけを参照 |
| フレームごとにキャラクターが跳ねる | ピボットスライスがなく既定の下中央を使っている、またはフレームごとにピボットが違う | Sprite Editorでフレームごとのピボットの印を比べる | Asepriteにピボットスライスを1つ置くか、NerulioでPを使ってピボットを指定。ピボットエディターを参照 |
| スプライトが2組できる | Assets/に置いた.asepriteをUnityのAseprite Importerも取り込んだ | プロジェクトウィンドウで.asepriteアセットが展開されている | 方法を1つに絞る:Assets/から.asepriteを外すか、このバンドルを使わない |
| ピンポンのタグが順方向にしか再生されない | Unity自体のインポーター(順方向のみ対応)の結果で、このバンドルではない | Animatorがどのアセットのクリップを使っているか | 順序を展開したこのバンドルの.animを使う |
ほかの方法
| 方法 | こんなときに向いています |
|---|---|
| Unityの2D Aseprite Importerパッケージ | 一日中Asepriteで描き、保存のたびにUnityに再インポートさせ、レイヤーごとに取り込みたいとき。タグは順方向のみ、スライスは非対応という点を受け入れる必要があります。 |
| AsepriteからPNGシートを書き出してSprite Editorで切る | アニメーションが1〜2個でフレームレートが一定のとき。Unityでスプライトシートを切るを参照。 |
| 同じファイルを別のエンジンで | AsepriteをGodotへ、AsepriteをPhaserへ。 |
エンジン別の書き出しと検証方法
「検証済み」は、実際の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は完全一致。 |
検証の根拠
GIFデコーダー:実在のGIF 29本で408/408フレームがPillowと一致、APNG 16本で132/132。.aseprite:コーパス231ファイルを読み込み・書き直し、Aseprite 1.3.18で開いてタグ・長さ・ピクセルが231/231一致。書き出し:実在のCC0アセットで実際のエンジンを49回実行し47回合格。失敗2回はPhaser 3.90のトリムXMLの不具合で、Phaser 3プリセットで回避できます。
制限
- レイヤーはフレームごとに1つのスプライトへ統合されます。
- 2回以上の繰り返し回数は保たれず、クリップは1回再生になります。
- ヒット・ハートボックスはUnity向けには書き出しません。
- グリッド・島の推定は信頼度つきのプレビューで、「適用」を押すまで何も切りません。すべての選択に代替案があり、ワンクリックで切り替えられます。
- レイヤーが正確に合成できない.asepriteファイル(グループの不透明度など)は統合して読み込み、理由を読み込みパネルに表示します。
- 読み込んだアトラス内の回転フレームは回転したままで、その書き出しは未検証です。
- 画像は一辺32,768px(2億6,800万ピクセル)まで。ブラウザのメモリにも依存します。
バージョンと出典
NerulioのUnityバンドルはUnity 6000.5.3f1のバッチモードで確認しました(スプライト範囲、ピボット、ピクセル、Point・無圧縮・Multiple、クリップのキーと時間)。実行時にAnimatorでクリップが再生されるかは確認していません。.asepriteの読み込みは、実在の231ファイルがAseprite 1.3.18で同じタグ・長さ・ピクセルのまま開き直せることで確認しました。Unity自体のAseprite Importerについての記述は、そのバージョン4.0のドキュメントに基づきます。
参照した公式ドキュメント
よくある質問
Unity純正のAsepriteインポーターとの違いは?
そちらを使っても構いません。この方法は同じタイミングでパック済みアトラスとクリップを作り、インポーターパッケージがない環境でも動きます。
フレームごとのピボットは保たれますか?
はい。各スプライト範囲にそのフレームのピボットが入ります(共通の基準点なら共通)。
無料ですか?アカウントは必要ですか?
このページの機能はすべて無料で、アカウントなしで使えます。透かしや制限された書き出しはありません。
スプライトはアップロードされますか?
いいえ。Studioはこのブラウザのタブ内でデコード・パック・書き出しを行います。プロジェクトはブラウザ(IndexedDB)に自動保存され、.nerulioファイルとして保存できます。
Asepriteやエンジンのプラグインは必要ですか?
いいえ。.asepriteファイルはブラウザで読み書きします。エンジン別のバンドルには必要なものが入っています(Godotはインポート設定とシーン、UnityとGodotのタイルセットは小さなエディタースクリプト)。