MockupBuilder — アプリストア申請用スクリーンショット作成ツール

---

MockupBuilder — アプリストア申請用スクリーンショット作成ツール

アプリのスクリーンショットに端末フレーム・テキスト・背景を合成して、ストア申請用の画像を一括生成できるブラウザツールです。

---

仕様

- 対応OS: Windows / Mac / Linux（Chrome・Edge・Firefox 最新版）

- 入力形式: PNG / JPG

- 推奨入力サイズ: 1242×2688px 以上（小さい画像はフレーム内で引き延ばされ画質が荒れます）

- 動作方式: HTMLファイルをブラウザで開くだけ。インストール不要・完全オフライン

---

起動時の注意

初回起動時に「このファイルの種類はコンピューターに損害を与える可能性があります」という警告が表示される場合があります。これはローカルHTMLファイルに表示されるブラウザの仕様です。「保存」→ダウンロードした MockupBuilder.html をダブルクリックして開いてください。

---

機能

書き出し

- スクリーンショットを最大8枚ドロップ → 全サイズを一括で高解像度PNG / ZIP ダウンロード

- App Store（iPhone / iPad）・Google Play の申請サイズをすべてカバー

- 出力サイズをチェックボックスで個別に選択可能

端末フレーム

- Dynamic Island / ノッチ / パンチホール / ホームボタン / フレームなし から選択

- カラー: black・silver・gold・purple・カスタムカラー

- サイズ・上マージン・シャドウを調整可能

テキスト

- キャッチコピー・サブテキスト・追加テキストをそれぞれ独立して設定

- フォントサイズ・色・太字・配置・位置（XY）を個別に調整

- 背景ピル・縁取り・シャドウを追加可能

- カスタムフォント（.ttf / .otf）を複数登録してラジオボタンで切り替え可能

背景

- 単色 / グラデーション（縦・横・斜め）/ ぼかし / 画像 から選択

その他

- スクリーンショットの明るさ・コントラスト・彩度を補正

- ロゴ・アイコン画像をオーバーレイ（サイズ・角丸・位置を調整可能）

- テキスト・ロゴの位置はプレビュー上でドラッグして調整可能

- 設定をテンプレートとして保存・読み込み可能

- 設定をJSONファイルでエクスポート / インポート可能

- Undo / Redo（Ctrl+Z / Ctrl+Y）対応

- 画像データの外部送信なし

---

対応出力サイズ

┌─────────────┬───────────┬─────────────┐

│ サイズ │ 解像度 │ ストア │

├─────────────┼───────────┼─────────────┤

│ iPhone 6.7" │ 1290×2796 │ App Store │

├─────────────┼───────────┼─────────────┤

│ iPhone 6.5" │ 1242×2688 │ App Store │

├─────────────┼───────────┼─────────────┤

│ iPhone 5.5" │ 1242×2208 │ App Store │

├─────────────┼───────────┼─────────────┤

│ iPad 12.9" │ 2048×2732 │ App Store │

├─────────────┼───────────┼─────────────┤

│ iPad 11" │ 1668×2388 │ App Store │

├─────────────┼───────────┼─────────────┤

│ Android │ 1080×1920 │ Google Play │

└─────────────┴───────────┴─────────────┘

---

同梱物

- MockupBuilder.html（ツール本体）

- README.txt（使い方ガイド）