「App Store スクリーンショットジェネレーター」や「AI ストアスクリーンショットツール」を探しているなら、画像をスマートフォンのフレームに収める以上のものが必要なはずです。求めているのは、アプリの価値が伝わり、サイズ要件を満たし、更新しやすいマーケティング素材でしょう。オープンソースプロジェクトの ParthJadhav/app-store-screenshots は、この一連の作業のために設計されています。
App Store Screenshots Skill とは？
App Store Screenshots Skill は、Claude Code、Cursor、Windsurf、OpenCode、Codex などの AI コーディングエージェント向けに公開されているオープンソースのスキルです。インストールすると、エージェントが Next.js、React、TypeScript を使い、プロジェクト内にストア用スクリーンショットのエディタを生成します。簡単に修正できない静止画像ではなく、編集可能なツールが手に入ります。
エディタには、iPhone、iPad、Android スマートフォン、Android タブレット、Google Play Feature Graphic 用のキャンバスが個別に用意されています。デバイス、テキスト、装飾要素をドラッグし、テーマや言語を切り替え、必要なすべてのサイズを PNG ファイル一式として書き出せます。
「スクリーンショットは広告であり、説明書ではありません。」
App Store Screenshots Skill の基本原則
この原則から、一般的なモックアップツールとの違いがわかります。ストア用スクリーンショットは、まず一瞬でユーザーにとっての利点を伝え、その後に画面を見せるものです。画像 1 枚につき訴求点を 1 つに絞り、検索結果のサムネイルサイズでも見出しを読めるようにします。
AI に画像を数枚頼むより実用的なのはなぜ？
画像生成ツールは、ビジュアルの方向性を探るのに便利です。ストア用素材には、正確な UI とテキスト、安定した寸法、新しいリリースや言語に合わせた継続的な更新も必要です。このスキルは、エージェントに適した役割を与えます。制作ツールの構築、素材の整理、デザイン案の提案を AI が担い、最終的な調整はビジュアルエディタで行えます。
- 通常は 1 枚の静止画像が完成品になる
- サイズや言語ごとに手作業を繰り返す必要がある
- 変更履歴を追いにくい
- 完成した Next.js エディタを生成
- デバイスと言語をまとめて管理
- プロジェクトの状態を Git にコミットできる JSON として保存
役立つ 6 つの機能
Connected Canvas
一連のスクリーンショットを横に並べてデザインできます。スマートフォン、パス、装飾を隣の画面までまたいで配置し、書き出すときに正確に切り出せます。
Visual Inspector
ページのコードを手作業で編集せず、右側のパネルで見出し、ラベル、レイアウト、レイヤー、回転、縮尺、スクリーンショットの参照元を調整できます。
複数プラットフォーム向けキャンバス
ひとつのワークフローで、iPhone、iPad、Android スマートフォン、7 インチと 10 インチのタブレット、Feature Graphic に対応します。
ローカライズと RTL
ロケールごとにコピーと画面を保存し、アラビア語やヘブライ語など、右から左に書く言語のレイアウトを確認できます。
プロジェクトの状態を永続化
app-store-screenshots.json は、人が読んでレビューできる信頼できる情報源です。別のコンピュータに移っても作業を続けられます。
一括書き出し
プラットフォーム、デバイス、解像度、言語ごとに整理してファイルを書き出し、提出前のサイズ変更やファイル名変更の手間を減らします。
元のスクリーンショットからストア掲載用素材まで
作業は 6 つの手順で進みます。実機のスクリーンショットとアプリアイコンを用意し、スキルをインストールします。エージェントにエディタの生成または移行を依頼し、Connected Canvas 上で構成と見た目を整えます。各ロケールを仕上げ、ストアが求める画像一式を書き出します。
インストールして使い始めるには？
最も手早い方法は skills CLI を使うことです。このプロジェクトには Node.js 18 以降が必要で、bun、pnpm、yarn、npm に対応しています。
npx skills add ParthJadhav/app-store-screenshots
インストール後は、「スクリーンショットを数枚作って」とだけ指示するのでは不十分です。プロダクトの価値、機能の優先順位、対象デバイス、言語、スタイル、画面数をまとめた概要を渡すと、最初の案から質が大きく上がります。
おすすめのプロンプトテンプレート
習慣記録アプリの App Store 用スクリーンショットを作成してください。このアプリでは、シンプルな毎日の計画を使って習慣を継続できます。重要な機能は、優先度の高い順にすばやいチェックイン、傾向の確認、ホーム画面ウィジェットです。iPhone 向けに英語版と簡体字中国語版の 2 セットが必要で、それぞれ 6 枚ずつ作成してください。ビジュアルは、すっきりとして温かみがあり、細部まで整ったスタイルにしてください。実際のスクリーンショットは ./marketing/screenshots、アイコンは ./AppIcon.png にあります。
事前に用意する素材
- シミュレータ、エミュレータ、実機のいずれかで撮影した実際のアプリ画面
- 背景が透明なアプリアイコン、または高解像度のアプリアイコン
- 1 文のプロダクト説明と 3 から 5 個の主な訴求点
- 対象ストア、デバイス、言語、画面数
- ブランドカラー、フォント、参考にするアプリ
どの App Store と Google Play のサイズに書き出せる？
このスキルは、各プラットフォームが対応する最大サイズでデザインし、そこから小さいサイズを生成します。下の表は、プロジェクトに組み込まれている一般的な書き出しプリセットです。提出前に、最新の Apple のスクリーンショット仕様と Google Play のプレビュー素材の要件を確認してください。
| ストア | デバイス / 素材 | 書き出し解像度 |
|---|---|---|
| Apple App Store | 6.9 インチ iPhone | 1320 × 2868 |
| 6.5 インチ iPhone | 1284 × 2778 | |
| 6.3 インチ iPhone | 1206 × 2622 | |
| 6.1 インチ iPhone | 1125 × 2436 | |
| Google Play | スマートフォン、縦向き | 1080 × 1920 |
| 7 インチタブレット | 1200 × 1920 / 1920 × 1200 | |
| 10 インチタブレット | 1600 × 2560 / 2560 × 1600 | |
| Feature Graphic | 1024 × 500 |
注：Google Play には、Wear OS や Android Automotive OS など、特定のフォームファクタに関する追加ルールがあります。スクリーンショットは、アプリに実装済みの機能を正確に示す必要があります。誤解を招く画像やマーケティング表現は避けてください。
どんな人に向いていて、どんな制約がある？
向いているケース
- 個人開発者や小規模なプロダクトチーム
- iOS と Android の両方で公開するアプリ
- 機能紹介のスクリーンショットを頻繁に更新するプロジェクト
- 複数言語のストア用素材を管理するチーム
留意点
- 実際のプロダクトを写した高品質なスクリーンショットは別途必要
- コピーの初稿にはプロダクトに関する判断と人のレビューが必要
- 複雑なブランド表現にはテーマコードの拡張が必要な場合がある
- 書き出した画像は 1 枚ずつサムネイル表示と規定への適合を確認する必要がある
繰り返し作業とツール構築のコストは減らせますが、プロダクトの位置づけ、ブランド戦略、最終レビューの代わりにはなりません。エージェントにはワークスペースの構築と選択肢の提案を任せ、デザイナーや開発者が判断して結果を確認する使い方が適しています。
よくある質問
生成できるのは iOS の App Store 用スクリーンショットだけですか？
いいえ。このプロジェクトは、iPhone、iPad、Android スマートフォン、Android タブレット、1024 × 500 の Google Play Feature Graphic に対応しています。
デザイン経験がなくても使えますか？
はい。このスキルにはテーマ、レイアウト、コピーライティングの原則が用意され、エディタではドラッグ＆ドロップで調整できます。アプリに厳密なブランドガイドラインがある場合は、最終結果をデザイナーが確認してください。
スクリーンショットのプロジェクトをチームに引き継げますか？
はい。画像素材と app-store-screenshots.json は、どちらも Git にコミットできます。チームメンバーはプロジェクトをクローンし、依存関係をインストールして、編集を続けられます。
アプリ内のすべての画面を自動で撮影できますか？
いいえ。このスキルが担うのは、ストア用マーケティングスクリーンショットのデザイン、配置、書き出しです。iOS プロジェクトでは、作者の ios-marketing-capture スキルを使って、元になるスクリーンショットの撮影を自動化できます。それ以外の技術構成では、先に素材を手作業で用意してください。
リリースのワークフローに加えるべき？
リリースのたびに、同じサイズ変更、デバイスフレームへの配置、コピーの配置、言語別フォルダの整理を繰り返しているなら、検討する価値があります。App Store Screenshots Skill の主な価値は、ばらばらだったマーケティング素材の制作工程を、編集、再利用、レビュー、引き継ぎができるプロジェクトへ変えることです。