アスペクト比とセーフエリア。

iPhoneのアスペクト比

最新のiPhoneクラス別の実際のアスペクト比：

• 6.9" (16 Pro Max): 1320 × 2868 = 2.173 (≈ 19.5:9)
• 6.7" (15 Pro Max, 15 Plus, 14 Plus, 13 Pro Max, 12 Pro Max): 1290 × 2796 = 2.167
• 6.1" (16, 15, 14, 13, 12, 11): 1170 × 2532 = 2.164
• 5.5" (8 Plus, 7 Plus, 6s Plus): 1242 × 2208 = 1.778 (16:9)

5.5"クラスは例外的な存在で、旧デバイスは16:9を採用していました。両方のアスペクト比に対応してデザインする場合は、どちらの比率でも表示される中央の縦帯に重要なコンテンツを配置してください。

セーフエリア

App Storeはスクリーンショットをデバイスフレームに合わせた角丸で表示し、カルーセルの位置によってはアプリのメタデータをオーバーレイ表示することがあります。実測値に基づくガイドラインは次のとおりです：

• 上端80 pxはステータスバーのオーバーレイや角丸によってクリップされる可能性があります。
• 左右60 pxが現実的なセーフゾーンの余白です。
• 下端100 pxは小型の端末では「さらにスクロール」表示に隠れることがあります。

キャプションとCTAはデザインの上端から80〜600 pxの範囲に配置してください — サムネイルサイズでも視認でき、フルサイズでもクリップされません。

視線が最初に向かう場所

App Store カルーセルのアイトラッキング調査（複数のASO企業の分析、2024〜2026年で共通した結果）によると、各パネルの左上の象限に最も強く注目が集まります。重要なキャプションテキストは、パネルの上4分の1にわたって配置し、背景とのコントラストを高くすると最も効果的です。デバイスの見せ方は正面からより、Y軸まわりに8-15°傾けると視覚的な訴求力が高まります。

実用的なセーフゾーンオーバーレイ

Figma または Photoshop でデザインする場合、次のガイドをキャンバスに追加してください（6.9"を基準とし、他のクラスには比例してスケールしてください）：

• 上余白：80 px
• 下余白：100 px
• 左右余白：各60 px
• キャプションゾーン：上端から80〜600 px
• デバイスゾーン：上端から600〜2400 px

セーフゾーンを考慮してデザインする →