iPhone Duoのスクリーンショットテンプレート:スタジオが折りたたみ画面に完全対応

Store Connect Studio ·

iPhone Duoは「1枚の画面」を「2枚の画面」に変えました。App Storeのスクリーンショットでは、用意すべきサイズが1セット増えるということです。スタジオは折りたたみと展開をテンプレート体系に組み込み、内蔵テンプレートからそのまま書き出せます。実機フレームも公式デザインに沿って描き直しました。

2つのデバイスクラスを追加:折りたたみと展開

スタジオは従来のiPhone / iPad / Macに加え、「iPhone Duo 折りたたみ」(外側ディスプレイ 1398 × 2034)と「iPhone Duo 展開」(内側ディスプレイ 2007 × 2853)の2クラスを追加しました。それぞれ独立したキャンバスで、テキスト・スロット・素材の位置を個別に調整できます。

内蔵46種類のテンプレートすべてに両クラスのページデータを用意しました。iPhoneのキャンバスから等比で換算済みのため、開いてすぐ書き出せます。手作業での組み直しは不要です。

実機フレームもiPhone Duoの実デザインに沿って描き直しました。展開時はインカメラが画面下に隠れ、Dynamic Islandはありません。ヒンジ側の2角は直角で、左右の縁中央にはヒンジの折り目による内側の凹みがあります。折りたたみ時は外側ディスプレイ右上にパンチホールカメラが1つ。

折りたたみがスクリーンショットにもたらす変化

iPhone Duoの内側と外側の画面は同じ比率なので内容は等比で拡大縮小できますが、ピクセル寸法は別です:外側 1398 × 2034、内側 2007 × 2853。App Store Connectでは別々のデバイスクラスとして扱われ、それぞれアップロードが必要で、片方が他方を代用することはできません。

内側の画面はより広く、同じテキストでも展開時のほうが余裕があります。逆に、内側向けに詰め込んだレイアウトをそのまま外側に載せると窮屈に見えます。スタジオでは2つのキャンバスを個別に微調整でき、1つのレイアウトを両方に押し込まずに済みます。

スタジオでDuo用の一式を書き出す

流れはiPhoneと同じです。テンプレート(システムまたは「マイテンプレート」)を選び、「iPhone Duo 折りたたみ」/「iPhone Duo 展開」のタブに切り替え、スクリーンショットライブラリからワンタップで適用し、書き出します。縦画面テンプレートには横画面版が自動で用意され、それぞれ独立して編集・書き出しできます。

書き出し後は、自分のAPIキーでアプリから直接App Store Connectへ同期できます。折りたたみ・展開の各セットはそれぞれの配置先に書き込まれ、ブラウザでフォルダごとにアップロードする必要はありません。

実例:自社アプリもDuo用を書き出し済み

自社アプリ「テスト用紙消し(AI Worksheet Cleaner)」はApp Storeのスクリーンショットを更新し、iPhone Duo対応を完了しました。同じテンプレート一式から折りたたみ・展開の両キャンバスを書き出し、iPhone Duoのユーザーには大画面向けのレイアウトが表示されます。

下の2枚は、同じテンプレートを2つのキャンバスで描画した結果です(システムテンプレート「テスト用紙消し」を使用し、スロットはプレースホルダー表示)。展開した内側は文字組みの余白が広く、折りたたんだ外側は狭い筐体に要点を収めています。

iPhone Duo 折りたたみ(外側ディスプレイ 1398 × 2034)
iPhone Duo 折りたたみ(外側ディスプレイ 1398 × 2034)
iPhone Duo 展開(内側ディスプレイ 2007 × 2853)
iPhone Duo 展開(内側ディスプレイ 2007 × 2853)

実践のヒント

まず2種類のレイアウトが本当に必要かを確認します。両方の形態でUIが同一なら同じデザインをそれぞれ書き出せますが、ピクセル寸法は各クラスに合わせる必要があります。

セーフエリアに注意しましょう。展開時は外側が丸角、ヒンジ側が直角なので、重要な情報をいちばん端に置かないこと。折りたたみ時の外側ディスプレイは狭いので、テキストは短くして折り返しや見切れを避けます。

FAQ

既存のiPhone用スクリーンショットをDuo用に流用できますか?

そのままでは使えません。ピクセル寸法が異なり(外側 1398 × 2034、内側 2007 × 2853)、App Store Connectはピクセル単位で検証します。ただしテンプレートデータはDuoのキャンバス用に用意済みなので、書き出し直すだけです。

折りたたみと展開の両方が必要ですか?

App Store Connectでは2つのデバイスクラスとして扱われるため、通常はそれぞれのスクリーンショットが必要です。片方だけではもう片方は自動生成されません。

横画面も別途必要ですか?

縦画面テンプレートからは横画面版が自動生成され、独立して編集・書き出しできます。必要なときに使ってください。

Store Connect Studio

iPhone Duo用のスクリーンショットを用意する

スクリーンショットスタジオには46種類のテンプレートが内蔵され、iPhone Duoの折りたたみ / 展開の両キャンバスに対応。編集後はワンタップでApp Store Connectへ同期できます。

App Store ↗

← Store Connect Studio