App Storeスクショの作り方｜デザインと最新仕様

アイコンがタップを獲得し、スクリーンショットがインストールを獲得します。App StoreでもGoogle Playでも、誰かがあなたのストアページに着いた瞬間から、スクリーンショットのギャラリーはページ上で最も大きく、最も声の大きい要素です。そして訪問者の多くは、スクロールせずに見えた範囲だけでインストールするか離脱するかを決めます。

つまり、スクリーンショットは説明書ではありません。広告です。太いキャッチコピー、ブランドカラー、1枚につき1つの主張――スクリーンショットを看板広告として扱うチームは、生のUIキャプチャをアップロードして終わりにするチームより、一貫して高いコンバージョンを出します。

ここでは、インストールにつながるアプリのスクリーンショットの設計方法、2026年7月時点で各ストアが実際に求めている仕様、そしてランキング上位のアプリが使うヒーロー画像を組み立てる、実践的な切り抜きワークフローを扱います。

スクリーンショットがインストールを決める理由

ストアの閲覧は容赦がありません。App Storeでは、縦向きのスクリーンショットの最初の数枚が検索結果にそのまま表示されます。訪問者は、あなたのプロダクトページにたどり着く前に判断を下しているのです。ページ上でも、多くの端末でファーストビューに収まるのは1枚目か2枚目までです。

だから最初の2枚の法則です。最も強いベネフィットと、最も明確な差別化要因を1枚目と2枚目に置きます。ログイン画面ではありません。設定画面でもありません。「これが欲しい」と思わせるもの――説明ではなく、見せることです。

3枚目以降は、スクロールする少数派のためのものです。役には立ちますが、あくまで脇役です。

いま主流のスクリーンショットの型

上位チャートを眺めていくと、どこでも同じビジュアル言語に出会います。効果があるからです。

• 色付き背景の上の端末フレーム — UIは画面いっぱいに広がるのではなく、スマートフォンのモックアップの中に収まり、大胆なブランドカラーのキャンバスの上に浮かびます。
• 上部にベネフィットのキャッチコピー — 短く、大きく、サムネイルサイズでも読めること。「ダッシュボード画面」より「支出を自動でまるごと記録」が勝ちます。
• 1枚につき1つのメッセージ — 各スクリーンショットは、ちょうど1つの主張だけをします。3つの機能を1枚に詰め込むことは、何も伝えないことと同じです。
• 物語になっている並び — フレームはピッチデッキのように左から右へ読まれます。全フレームにまたがるパノラマ背景を敷いて、ギャラリーの奥まで視線を引っ張るアプリもあります。
• 現実の被写体 — 人物、商品、ペットを切り抜いて端末フレームの隣に合成すると、平坦なUIには出せない生気が加わります。

2026年7月時点で確認した仕様

どちらのストアも、寸法が違えばアップロードの時点で弾きます。一括書き出しの前に、ここを正確に押さえておきましょう。

Apple App Store

• iPhone — 6.9インチのディスプレイ区分向けのセットが1つ必須です。小さい端末にはAppleが縮小して表示します。標準の縦向きサイズは1320×2868pxです（この区分は1290×2796と1260×2736も受け付けます）。
• iPad — アプリがiPadで動くなら、13インチのディスプレイ区分のセットが必須です。縦向きで2064×2752px。
• 枚数と形式 — 端末サイズごとに1〜10枚、JPEGまたはPNGのみ、アルファチャンネルは不可です。アップロードの前にすべて統合してください。

Google Play

• 枚数 — 端末タイプごとに最大8枚。公開するには最低2枚必要です。
• 寸法 — 各辺は320〜3,840pxの範囲で、長辺は短辺の2倍を超えられません。
• 形式 — JPEGまたはアルファなしの24ビットPNG。加えて1024×500pxのフィーチャーグラフィックも必要です。
• 注目掲載の条件 — 大型のおすすめ枠に掲載される資格を得るには、1080px以上のスクリーンショットを4枚以上用意することをGoogleは求めています。

新しいハードウェアが出るたびに仕様は動きますので、大きなリリースの前にはApp Store ConnectとPlay Consoleのドキュメントを必ず確認してください。

ヒーロー画像を作る切り抜きワークフロー

あの作り込まれたヒーロー画像――フィットネスアプリの端末フレームから飛び出すランナー、リセールアプリのUIの横に浮かぶスニーカー――は、切り抜きから組み立てられています。手順は見た目より単純です。

1. きれいなUI画面をキャプチャする — 実機かシミュレーターで撮ります。
2. 被写体のライフスタイル写真を撮る、または調達する — ユーザー、商品、料理、ペットなど。
3. 被写体を切り抜く — remover.bgの背景削除なら、髪、毛、細かいエッジもそのまま残ります。被写体が大胆な背景色に重なるときほど、ここが効いてきます。
4. 背景を透過したPNGで書き出す — ブランドカラーのキャンバスの上にきれいに重ねられます。形式の詳細は透過PNGガイドにまとめました。
5. デザインツールで組む — 端末フレーム、切り抜き、キャッチコピーを配置し、被写体の下にやわらかい影を足します。すると浮いているのではなく、シーンの中にいるように見えます。奥行きが合成を説得力あるものにする仕組みは自然な影の付け方をご覧ください。

プレゼン資料の画像切り抜きを支えているのと同じレイヤーの考え方が、ここでも通用します。手前に被写体、その上にメッセージ、背後に清潔な背景です。繰り返しておく価値のある注意点がひとつ。透過は素材であって、納品物ではありません。どちらのストアもアルファチャンネル付きのファイルを弾きますので、最終の書き出しは必ず統合してください。

勘を信じる前に、ローカライズとテストを

多くのチームが飛ばしてしまう、効果の大きい2つの打ち手です。

• ローカライズ — どちらのコンソールも、言語ごとに別のスクリーンショットのセットを受け付けます。デザインファイルではキャッチコピーを独立したレイヤーに置いておけば、言語の差し替えは作り直しではなく数分の作業で済みます。英語圏以外の市場では、翻訳したキャッチコピーが英語のままのものを上回るのが常です。
• A/Bテスト — Appleのプロダクトページ最適化では、現在のページに対して最大3種類の別案をテストできます。Google Playにはストアの掲載情報テストがあります。変えるのは一度に1つの変数だけ――キャッチコピーの文言、1枚目の順番、背景色――でなければ、何が効いたのか分かりません。

まとめ

1枚目と2枚目には、最も強いベネフィットを置いてください。端末フレーム、太いキャッチコピー、そしてブランドカラーの背景に載せた切り抜きの被写体を使いましょう。ピクセル仕様は正確に合わせ、透過は統合し、自分の意見よりA/Bテストの結果を優先します。スクリーンショットは、インストールボタンの手前であなたのアプリが打つ最後の広告です。その一押しになるよう作り込んでください。