mcpField
L
layer-sprite-animation

layer-sprite-animation

github.com/layeraiその他70 回インストール今日更新
リポジトリ

layer-sprite-animation について

一貫したキャラクターデザインから、HDゲーム用スプライトシートを作るワークフローガイドです。複数方向とアニメーションサイクルが必要なゲームアーティスト向けに、カメラ移動と動画で同一性を保ってからフレームを切り出します。

主な機能

  1. 01承認済みデザインから複数方向を生成
  2. 02カメラとスプライトの位置を統一
  3. 03動画クリップからサイクルを作成
  4. 04指定時刻のフレームを抽出
  5. 05スプライトシートをパックまたは分割

活用シーン

  1. 01複数方向のキャラクタースプライトを制作
  2. 02その場で歩く、または待機するサイクルを作成
  3. 03フレームを抽出してシートに配置

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/layerai/skills --skill layer-sprite-animation

インストール後、Claude Code で/layer-sprite-animationを入力して読み込まれたか確認します。

詳細

レイヤースプライトアニメーション

概要

スプライトセットは、複数の方向を向き、さまざまな動作をする1人のキャラクターをフレームごとに描いたものです。すべてのフレームで、同じキャラクターが同じ位置に立っていなければなりません。フレームを1枚ずつ描いていては、HDアートでこの一貫性を保つのは困難です。細部が多すぎて、モデルの外観を維持できないからです。確実な方法は、カメラを動かして方向を変えるときと、ビデオクリップで時間を進めるときに、モデルにキャラクターの同一性を保たせてから、フレームを切り出すことです。

ピクセルアートは異なります。layer-pixel-artでは、短いサイクルをフレームごとに描きます。リグを使ったスケルタルアニメーション(Spine)では、キャラクターをパーツに分割します。詳しくはlayer-game-assetsを参照してください。生成の仕組みと利用料金の確認はlayerスキルに、動きのプロンプトはlayer-videoにあります。

pack_sprite_sheetとsplit_sprite_sheetは、Layerの決定論的なシートユーティリティで、モデルではなくツールであり、代替手段を探す必要がないため、以下では名前を明記しています。

ここに記載されている関連スキルが利用可能なスキルにない場合は、ユーザーにインストールを依頼してください(npx skills add layerai/skills --skill <name>)。ユーザーの対応を待たずに進める場合は、ツールのスキーマに基づいて作業し、不足している点を伝えてください。

クイックリファレンス

ステップツールまたは入力
承認済みデザインを1つ用意text_to_image、ニュートラルな立ち姿、単体、ゲームのカメラアングルに合わせる
各方向multi_angleのユースケース、承認済みデザインをソースにして、camera.yaw_degreesを指定
各方向でサイズを統一output_fit:FIXEDキャンバス、anchor: "BOTTOM_CENTER"、すべての実行で同じ値にする
方向ごとのサイクルimage_to_video、その方向の静止画をfirst_frameに指定(ループではlast_frameにも指定)
フレームクリップのfile_idを画像スロットでvideo_frame_secondsに指定し、batch_size: 1にする
シートpack_sprite_sheet、方向ごとに1行にする
既存のシート作成時と同じグリッドを指定してsplit_sprite_sheetを実行し、trim_transparentはオフにする

1つのデザインから各方向を作成する

最初にデザインを1つ生成して承認し、ゲームのカメラアングルで描きます。プラットフォーマーなら側面、RPGなら斜め上から見た視点です。その後、キャラクターを説明し直すのではなく、カメラを動かしてほかのすべての方向を作成します。

execute_forgeは、get_base_modelの機能情報でcamera_transformが報告されるモデルに対して、構造化されたcameraを受け取ります。filter.use_case: "multi_angle"でlist_base_modelsを絞り込み、対応モデルを探してください。モデルが対応するスロット(init_imageまたはreference_image)に承認済みデザインを添付し、yaw_degreesを設定します。90は右側面、180は背面、270は左側面です。8方向の場合は45度刻みです。見下ろし型のゲームでは、すべての方向で同じpitch_degreesを維持し、カメラを統一してください。

各方向は、前の方向からではなく、常に元の正面図から生成してください。そうすることで、誤差の蓄積を防げます。対称的なキャラクターでは、エンジンが左向きの画像を反転することが多いため、8方向中5方向だけで済む場合があります。8方向すべてに費用をかける前に、ゲームが反転に対応しているか確認してください。

すべての方向の実行で同じoutput_fitを設定します。canvas: "FIXED"、同じwidthとheight、そしてanchor: "BOTTOM_CENTER"を指定すると、すべてのスプライトが同じ位置に立ちます。これを設定しないと、方向ごとに異なるサイズで生成され、キャラクターが向きを変えたときに身長が変わってしまいます。承認済みの正面図も、cameraを省略して同じモデルで1回実行し、同じoutput_fitを指定してください。これにより、正面図も同じキャンバスに収まります。

クリップからサイクルを作成する

承認された各方向を image_to_video でアニメーション化し、first_frame として渡します。繰り返すサイクル(待機、歩行、走行)では、loop と fixed_duration で絞り込み、動きが開始位置に戻るよう、同じ静止画を last_frame としても渡します。1回限りのアクション(攻撃、被弾、死亡)では、first_frame のみを指定します。

プロンプトには3つの役割があります。アクション、「その場で」、そして固定カメラです。「その場で歩き、歩行サイクルを一周します。キャラクターはフレーム内を移動しません。カメラは固定し、背景は無地のフラットなものにします。」フレーム外へ歩いていくキャラクターは、サイクルにはできません。

クリップからフレームを切り出す

どの画像スロットにも動画の file_id を指定でき、video_frame_seconds の位置(または video_frame: first、middle、last)のフレームが使われます。均等な間隔でフレームを切り出します。通常、歩行なら6~8枚です。それぞれを background_removal の実行に渡し、デフォルトは4なので batch_size: 1 にします。

固定カメラで撮影されたクリップのフレームは、すでに互いに位置合わせされています。そのままパックしてください。pack_sprite_sheet は各フレームを拡大縮小せずに1つのセルサイズ内で中央に配置するため、位置合わせされたサイクルがそのまま維持されます。サイクルのフレームを1枚ずつ再調整したりトリミングしたりしないでください。各フレームの下端を基準にするとジャンプが消え、歩行時の上下動もなくなります。同じ理由から、既存のシートを split_sprite_sheet で分割する際は、trim_transparent をオフのままにしてください。

実例

「トップダウンRPG用に、騎士の4方向の歩行を8フレームで作成します。」

  1. 承認済みの斜め前からのビューに file_id があります。
  2. filter.use_case: "multi_angle" を指定して list_base_models を実行し、最初の結果に対して get_base_model を実行して、camera_transform と必要なスロットを確認します。yaw_degrees 90、180、270で3回実行し、pitch_degrees は共通の値にします。output_fit: {canvas: "FIXED", width: 512, height: 512, anchor: "BOTTOM_CENTER"} はすべて同じ値にします。それぞれから1つずつ承認します。
  3. filter.use_case: "image_to_video" と filter.capabilities: {loop: true, fixed_duration: true} を指定して list_base_models を実行します。4つのクリップを作成し、それぞれの方向を first_frame と last_frame の両方に指定して、その場で歩くようプロンプトで指示します。
  4. クリップごとに8フレーム、合計32フレーム分の実行を background_removal モデルで行います。
  5. 最初の実行の前に、すべての費用を見積もります。方向の生成を3回、クリップを4本、フレームの生成を32回、それぞれ実際に行う実行内容で見積もります。合計は20 CUを超えます。確認を取り、明確な承諾を得るまで待ちます。
  6. この順序で実行し、poll_interval_seconds 間隔でポーリングします。各方向のフレームをまとめて確認し、キャラクターがずれたクリップは作り直します。
  7. 32個すべての file_id を方向順に指定し、columns: 8 で pack_sprite_sheet を実行します。

よくある間違い

  • 高解像度のアートのフレームを1枚ずつ描き、キャラクターがずれてしまう。
  • それぞれの方向を、元の画像ではなく直前の方向から生成する。
  • 方向ごとにカメラのピッチを変える。
  • output_fit を指定せず、向きを変えるとキャラクターのサイズが変わってしまう。
  • その場で歩かず、フレーム内を移動する歩行にする。
  • サイクルのフレームを個別にトリミングしたり下端に固定したりして、上下動やジャンプを消してしまう。
  • フレームごとの実行で batch_size を4のままにする。
  • エンジンが3方向を反転して使うのに、8方向分の費用を支払う。

コメント