🎨 Sprite Studio — pyxel-rust

PNG と .sprite-spec.json をドロップしてスプライトシートを確認・調整

生成コマンド: pyxel-rust sprite_prompt "description" --name mychar

⚠️ このツールはPC（デスクトップ）専用です。スマートフォン・タブレットでは正しく動作しません。

📖 ワークフロー（使い方を確認）

① 準備・ファイル読み込み

AIツール（sprite_prompt）でスプライトシートPNG＋.sprite-spec.jsonを生成
両ファイルをドロップゾーンにまとめてドロップ
検証情報（幅・高さ・フレーム数）を確認

② フレームキャプチャ（1枚目タブ）

シート上でマウスを動かしてフレーム枠をプレビュー確認
余白距離（↑↓←→）でフレーム内の位置をチェック
クリック or Enter でキャプチャ（複数可）
キーボード矢印キーで枠を移動（Shiftで1px精密移動）
「📥 PNG エクスポート」で合成シートを出力（背景はオレンジ #FF8000）

③ 背景除去（2枚目タブ）

「🎨 クロマキー除去」でスポイト→背景色を選択
許容幅スライダーで除去範囲を調整（0〜255）
取れない塊は「🧹 消しゴム」でドラッグ消去
「✨ アルファ精密化」で半透明境界を滑らかに
「📐 正規化エクスポート」で最終PNG出力

④ ヒント

F0（最初のフレーム）の座標が基準として常時表示される
アニメ行は「＋行追加 / －行削除」で管理
クロマキーは後工程なので、キャプチャ段階では除去不要
プレビューの市松模様 = 透明部分

📂 PNG と .sprite-spec.json をここにドロップ

またはクリックして選択（複数可）

アニメーション: FPS: 7 許容幅: 50 サイズ: 12px

🔧 フレームサイズ調整

開始X: 開始Y: 全体フレーム幅(W): 全体フレーム高(H):

📁 出力設定（ファイル名・フォルダー）

assetsフォルダー名: PNG ファイル名: spec.json ファイル名:

          → assets/player/sprite.png  |  assets/player/sprite-spec.json
        

シート全体を表示

キャプチャ幅(W): キャプチャ高(H): ← シートをクリックでフレーム追加

アニメ行:

選択フレーム調整 X: Y: ⌨️ ←→↑↓: 10px移動 | Shift+←→↑↓: 1px移動 W: H:

プレビュー基準F: 透明度: