Itch.io ウェブゲームインスペクターとライブ解像度オプティマイザー

HTML5エクスポートファイルまたはZIPアーカイブをアップロードして、ライブでビューポートをテストし、スクロールバーを修正し、GodotおよびUnity WebGLビルドを検査し、Itch.io埋め込み設定を生成します。

ゲームビルドまたはZIPファイルをここにドロップ

.ZIPファイル、エクスポートフォルダー、またはHTML5ビルドファイルをこのエリアにドロップして即座に検査します。

ライブレイアウトとスクロールバーテスト

[Artificial Zoom-Out Active] ビューポートが画面幅を超えています。キャンバス全体が収まるよう人工的なズームアウトが適用されています。実際のレイアウトを確認するには自動スケールを無効にしてください。
Zoom 100%
ユーティリティスタジオ

このユーティリティをあなたのサイトに追加しませんか？

WordPress、Notion、またはご自身のサイト向けに、カラーとダークモードをカスタマイズできます。

さっそく始める

よくある質問

Godot 4のゲームがItch.ioで黒い画面を表示するのはなぜですか？

Godot 4のウェブエクスポートはSharedArrayBufferのサポートを必要とするWebAssemblyマルチスレッディングを使用します。Itch.ioのゲーム編集ページでフレームオプションの"SharedArrayBuffer support"を有効にしてください。

公開前にどの設定を確認すればよいですか？ 1

公開前にサイズ、対象環境、プレビューをまとめて確認してください。

# Itch.io HTML5ゲームエクスポートのフォーマットガイドライン

Itch.ioでHTML5およびWebGLゲームを公開するには、ビューポートのサイズ、アーカイブのファイル構造、クロスオリジンセキュリティヘッダーの正確な設定が必要です。
16:9 横向き 標準ウェブアスペクト比
960 x 540 px クラシックItch解像度
ルートのindex.html 必須エントリーファイル
COOP / COEPヘッダー Godot 4の要件
1280x720のWebGLゲームをItch.ioに埋め込む場合、埋め込みビューポートの寸法を正確に1280x720に設定し、"Embed in page"を有効にしてください。
この項目では、きれいな書き出しと正確なプレビューに必要な確認点をまとめます。 1.この項目では、きれいな書き出しと正確なプレビューに必要な確認点をまとめます。 2.この項目では、きれいな書き出しと正確なプレビューに必要な確認点をまとめます。 3.この項目では、きれいな書き出しと正確なプレビューに必要な確認点をまとめます。 4.この項目では、きれいな書き出しと正確なプレビューに必要な確認点をまとめます。 5.

# Viewport と canvas を公開前に確認する

Itch.ioで予定しているviewportと、実際のcanvasサイズを比較します。16:9の比率だけではスクロールバーを防げません。CSSの余白、最小幅、拡大されないcanvasによって表示がはみ出すことがあります。ビルドごとにレポートを読み直してください。ファイル名、入口となるHTML、エンジンの出力は変わる可能性があります。この検査結果に加えて、複数のブラウザと端末で実際の表示を確認します。

参考文献

同じカテゴリのユーティリティ ゲーム開発のためのツール

Steamカプセル＆アートプレビュージェネレーター

Steamストアおよびライブラリ用の公式カプセル画像をトリミング、プレビュー、フォーマットし、セーフゾーンを検証します。

ツールを使う

スプライトシートパッカー & エクストラクター

個別のアニメーションフレームをテクスチャアトラスにパッキング、または既存のスプライトシートから画像を抽出して2Dゲームの描画負荷を最適化します。

ツールを使う

ゲームオーディオループポイントファインダーおよびメタデータインジェクター

正確なオーディオループポイントを検出し、ゼロクロスにスナップしてノイズを排除し、LOOPSTARTおよびLOOPENDメタデータを埋め込んだWAVファイルをエクスポートします。

ツールを使う

ゲームセーブファイル難読化およびエディタ

ブラウザ内で完全ローカルにBase64、XORマスク、またはプレーンテキストを使用してゲームセーブデータを複合、検査、編集、再暗号化します。

ツールを使う

GodotおよびUnityローカライズCSV整形ツール

翻訳CSVやJSONファイルの空セル、重複キー、壊れた行を検査し、ゲームエンジンに最適化されたクリーンなファイルをエクスポートします。

ツールを使う

Steam BBCode, Markdown, HTML 相互変換ツール

Steam BBCode、Markdown、HTMLを自動判別し、リアルタイムで相互変換・プレビュー表示します。

ツールを使う

ゲーム用レトロ効果音ジェネレーター

ブラウザ上でレトロゲームのサウンドエフェクトを生成。プリセット選択、波形調整、オシロスコープ表示、ワンクリックWAV保存に対応。

ツールを使う

ドット絵パレットスワッパー

スプライトやスプライトシートをクラシックなゲーム機のパレットやカスタムカラーにブラウザ上で変換。

ツールを使う

ゲームUIアクセシビリティストレスチェッカー

ゲームのスクリーンショットをローカルで検査。色覚シミュレーション、HUDコントラスト測定、ぼかし、縮小、エッジヒートマップに対応。

ツールを使う

ヒットボックス・ハートボックス アニメーター

スプライトフレームごとに当たり判定レイヤーを描画。オニオンスキンで動きをプレビューし、ピクセル単位で座標を編集してJSON出力。

ツールを使う

ゲームダメージ計算・TTKシミュレーター

安全な計算式でゲームのダメージ・撃破所要時間(TTK)を比較。リアルタイム曲線、ヒートマップ、端数処理、クリティカルの影響を分析。

ツールを使う

ゲームのデルタ時間と固定タイムステップのラボ

再現可能なフレームスパイク、動きのシミュレーション、追いつきステップ、見える時間差で可変と固定のゲームループを比較します。

ツールを使う