スプライトシートジェネレーター
画像をスプライトシートに結合、ドラッグで並べ替え、グリッドレイアウト、パディング、スケールモード。PNG/WebP/JPGとJSONアトラスデータでエクスポート、ゲームエンジンやCSSスプライトに最適。
スプライトシートとは何ですか?なぜ使うのですか?
スプライトシートは、グリッドに配置された複数の小さな画像(スプライト)を含む単一の画像ファイルです。HTTPリクエストを削減し、ページ読み込みパフォーマンスを向上させ、ドローコールをバッチ処理してゲームレンダリングをより効率的にします。
どの画像形式がサポートされていますか?
PNG、JPG、GIF、SVG、WebP画像をアップロードできます。ツールはバッチアップロードとクリップボードからの貼り付け(Ctrl+V)をサポートし、迅速なワークフローを実現します。
どのエクスポート形式が利用できますか?
スプライトシートをPNG(透明度あり)、WebP(ファイルサイズが小さい現代的な形式)、またはJPG(透明度なしの写真に最適)としてエクスポートできます。ターゲットプラットフォームの要件に応じて選択してください。
スプライトシートで画像を並べ替えるには?
画像サムネイルをドラッグアンドドロップして、スプライトシートでの位置を並べ替えます。Ctrl+Vを使用してクリップボードから直接画像を貼り付けることもできます。
JSONアトラスデータとは何ですか?どのエンジンがサポートしていますか?
JSONアトラスデータは、各スプライトの位置、サイズ、フレーム情報を含みます。Phaser、PixiJS、Unity、Cocos2dなどの人気のあるゲームエンジンと互換性があり、自動スプライト抽出が可能です。
異なるスケールモードには何がありますか?
フィットモードはアスペクト比を維持して画像をスケーリングします。フィルモードは全体を覆い、はみ出しを切り取り。ストレッチモードは縦横比を無視して引き伸ばし。
ツールは透明度をサポートしていますか?
はい、PNGとWebPのエクスポートは元の画像の透明度を保持します。スプライトシートのカスタム背景色を設定することもでき、透明度をサポートしないJPGエクスポートに役立ちます。
パディングはスプライトシートにどのように影響しますか?
パディングは、シート内の個々のスプライト間にスペースを追加し、テクスチャがサンプリングされる際の視覚的な bleeding を防ぎます。これは、線形フィルタリングを使用するゲームエンジンや、スプライトに透明なエッジがある場合に特に重要です。
CSSにスプライトシートを使用できますか?
はい、スプライトシートはCSSイメージスプライトに最適です。JSONアトラスデータを使用してCSS background-positionルールを生成でき、HTTPリクエストを削減し、アイコンセットやUI要素のページ読み込みパフォーマンスを向上させます。
スプライトシート寸法のベストプラクティスは何ですか?
最適なGPUテクスチャ処理のために、寸法を2の累乗(256x256、512x512、1024x1024)に保ちます。ほとんどのゲームエンジンは、より良いパフォーマンスと互換性のためにこれらの寸数を好みます。
スプライトシートはゲームパフォーマンスをどのように向上させますか?
スプライトシートは、複数のスプライトを単一のテクスチャにバッチ処理することでドローコールを削減します。これにより、GPU状態の変更が最小限になり、メモリオバーヘッドが削減され、より効率的なレンダリングが可能になります。
スプライトシートとテクスチャアトラスの違いは何ですか?
スプライトシートは通常、フレームを均一なグリッドに配置しますが、テクスチャアトラスはbin packingなどのアルゴリズムを使用して不規則な形状のスプライトをより効率的にパックできます。