スプライトシートジェネレーター
ゲーム開発用にスプライト画像を最適化されたシートに結合します。ゲームエンジンとの統合を容易にするための座標付きJSONメタデータを生成します。
スプライト画像をアップロード
画像をここにドラッグ&ドロップするか、クリックして参照
PNG、JPG、WebP、GIF形式に対応
Related Tools
スプライトシートジェネレーターについて
仕組み
- ドラッグ&ドロップまたはファイル選択で複数のスプライト画像をアップロード
- スプライトを最適なグリッドレイアウトに自動的に配置
- JSONメタデータを含む単一のスプライトシート画像を生成
- 2の累乗サイズでPNGとWebP出力形式をサポート
- ゲームエンジンとの簡単な統合のための座標データを提供
主な用途
- 2Dゲーム開発のための個別スプライトの結合
- レンダリングパフォーマンス向上のためのテクスチャアトラス作成
- ウェブゲームのスプライト読み込み最適化
- ウェブ開発のためのCSSスプライトシート生成
- アニメーションフレームを単一画像に整理
- モバイルゲーム開発でのドローコール削減
Frequently Asked Questions
スプライトシートとは何ですか?なぜ使うべきですか?
スプライトシート(またはテクスチャアトラス)は、グリッドに並べられた複数の小さな画像(スプライト)を含む単一の画像です。スプライトシートを使用すると、テクスチャバインディングの数を減らし、メモリ使用量を減らし、効率的なバッチレンダリングを可能にすることでゲームのパフォーマンスが向上します。
どのような画像形式をアップロード・エクスポートできますか?
PNG、JPG、WebP、GIF形式のスプライトをアップロードできます。このツールはPNG形式(透明度サポート付き)またはWebP形式(ファイルサイズが小さく品質が良い)でスプライトシートをエクスポートします。
自動グリッドレイアウトはどのように機能しますか?
このツールはアップロードされたスプライトを分析し、スプライト数の平方根に基づいて最適なグリッドレイアウトを計算します。列と行を手動で調整することもできます。
JSONメタデータファイルとは何ですか?どのように使いますか?
JSONメタデータには、生成されたスプライトシート内の各スプライトの正確なピクセル座標、幅、高さが含まれています。ほとんどのゲームフレームワークはこのメタデータを直接インポートできます。
'2の累乗サイズ'とは何ですか?有効にすべきですか?
2の累乗サイズにより、最終的なスプライトシートの寸法が2の累乗(256x256、512x512、1024x1024など)になります。これは古いグラフィックカードや2の累乗テクスチャを必要とするゲームエンジンにとって重要です。
スプライトのサイズが異なる場合、スケーリングはどのように機能しますか?
ツールは大きなスプライトを「最大スプライトサイズ」設定に合わせて自動的に縮小し、アスペクト比を維持します。小さなスプライトは元のサイズのままです。
シート内のスプライト間隔を制御できますか?
はい、「パディング」設定を使用して各スプライトの周囲にピクセルスペーシングを追加します。これにより、スプライトが直接隣接して配置された場合に発生するアーティファクトを防ぎます。
グリッドセルよりも多くのスプライトがある場合はどうなりますか?
現在のグリッド(列×行)に収まる以上のスプライトをアップロードした場合、余分なスプライトは無視されます。グリッドサイズを増やすか、スプライト数を減らしてください。
生成されたスプライトシートをゲームエンジンでどのように使用しますか?
スプライトシート画像とJSONメタデータの両方をゲームエンジンにインポートします。UnityはSprite Atlasを使用し、GodotはTexturePackerのJSON形式をサポートし、Phaser.jsはJSONアトラスを直接読み込めます。
含めるスプライトの数に制限はありますか?
ツールは数十のスプライトを扱えますが、実際の制限はブラウザのメモリと最終的な画像サイズによって異なります。非常に大きなスプライトシート(4096x4096ピクセル超)は古いグラフィックカードでサポートされない場合があります。
このツールでアニメーションシーケンスを作成できますか?
このツールはスプライトをシートに整理しますが、アニメーションを直接作成しません。ただし、アニメーションフレームをシーケンスでアップロードし、グリッド設定を使用して行や列に配置できます。
透明な背景と色付きの背景の違いは何ですか?
透明な背景(デフォルト)はスプライトのアルファチャンネルを保持し、スプライトが他のグラフィックに重なるゲームには必須です。白または黒の背景は透明な領域を単色で埋めます。