スプライトシートとJSONからAsepriteのトリミング済みフレームを復元

同じAsepriteの作業から2つのファイルを書き出す

1. Asepriteでアニメーションを開き、次を使います File → Export Sprite Sheet。PNGシートを書き出し、JSONデータの出力を有効にしてください。ImageMintの展開ツールは、JSONのハッシュ形式と配列形式の両方を受け付けます。
2. シートとJSONを一緒に保持してください。両方の名前が似ていても、以前の書き出しのJSONは、現在のシートと合わない矩形を指す場合があります。
3. トリミングや詰め込み配置を有効にする場合は、JSONを保持してください。同じサイズのセルを切る単純なツールでは、異なる切り抜きのフレームの元位置を、シートだけから推測できません。
4. 書き出したシートとJSONを展開ツールにアップロードします。最初のフレームだけに頼らず、ZIPをダウンロードする前に複数のポーズを確認してください。

3つの矩形、3つの異なる役割

64 × 64のキャンバス上に描いたキャラクターを考えます。トリミングした1つのポーズは22 × 38の矩形を占め、元キャンバスの左から19ピクセル、上から20ピクセルにあります。配置処理により、その切り抜きは書き出したシートのx=128, y=0に置かれる場合があります。JSONには、3種類すべての情報が必要です。

展開ツールは透明な64 × 64フレームを作り、シートから22 × 38の切り抜きをコピーして(19, 20)に描画します。全ポーズで繰り返すことで、キャラクターの基準線を保ちます。各フィールドの役割は次と一致します： Asepriteのシート/JSON書き出しドキュメント；正確な位置は、ご自身のJSONから取得します。

ダウンロードしたZIPで確認すること

復元した各フレームは、番号付きのPNGになります。 manifest.json 元フレーム名、ミリ秒の時間、寸法、フレームタグを一覧にします。待機と最も大きな攻撃ポーズを並べて開き、キャンバスが同じで足や基準点が安定するか確認してください。まだ跳ぶなら、元のAsepriteプロジェクトの絵の位置が不統一な可能性があります。切り抜きオフセットの復元はその絵の問題を直せません。

均等な間隔のセルだけが必要なら、通常の スプライトシートスライサー の方が簡単です。パッキングやトリミングで均等グリッドが崩れた場合はJSON復元を使います。

対応する組み合わせなのに見た目がおかしい場合を診断

ファイル名が一致しても検証にはならず、寸法が一致するだけでも、切り抜き座標がアップロードした画像を表しているとは証明できません。同じ大きさの2つのアトラスでも、ポーズの並びが異なることがあります。ほぼ同じ待機フレームだけで判断せず、武器を伸ばした攻撃など、特徴的なポーズを確認してください。

時間情報とタグを次のアプリケーションへ引き継ぐ

表示時間が200 msのフレームは、80 msのフレームより長く表示される状態を保つべきです。復元されたPNGはピクセルを持ち、manifest.jsonはdurationMsとフレームタグを持ちます。両方を残してください。PNGを均一なFPSのプレイヤーで試すと、配置が完璧でもリズムが変わるのは正常です。

タグはidleやwalkなどの範囲を示しますが、タグを保持することはエンジンのアニメーション状態を設定することとは異なります。受け取り先のアプリで範囲と再生方向を確認してください。ImageMintのプレビューは位置合わせに役立ちますが、エンジンのアニメーションコントローラーを自動で書き出すものではありません。