9ura00

App Store のスクリーンショットを7言語・11言語で作る——検索結果の「最初の2枚」で伝えるための作り方

開発全般2026年10月4日

App Store のスクリーンショットは、アプリのページでいちばん目に入る部分です。対応する言語が増えると、言語の数×枚数ぶんの画像が必要になります。Sheet Widget は7言語×6枚、ToVue は11言語×5枚を iPhone と iPad の両方で用意しているので、手作業ではとても回りません。

どちらもスクリプトで組み立てる形にしたので、作り方と、デザインで決めたことをまとめます。

検索結果では「最初の2〜3枚」しか見えない

App Store の検索結果には、アプリごとに縦長のスクリーンショットが最初の2〜3枚だけ、小さく並びます。説明文はまず読まれません。

そこで Sheet Widget のスクリーンショットを作り直すときは、最初の2枚だけで「何のアプリか」「なぜ欲しいか」が分かることを最優先にしました。

  • 見出しは、横幅いっぱいの大きな文字で2行。1行6文字まで(日本語の場合)
  • 小見出しは1行10文字まで、2行まで
  • 見出しと小見出しの文字の大きさは、全部の枚・全部の行でそろえる(枚ごとにばらつくと、並べたときに雑に見える)
  • 小見出しには、検索で狙う言葉(「スプレッドシート」など)を入れる

文字数を先に決めておくと、ほかの言語に訳したときに収まるかどうかも判断しやすくなります。

Sheet Widget:撮るのは1回、組み立ては言語ごと

Sheet Widget では、次の流れで作っています。

  1. デモ用のスプレッドシートを、Google Apps Script で作る。 「実際に使っている表らしい大きさ」の家計簿や売上表を、スクリプトで自動生成します。毎回同じ表を作れるので、撮り直しても内容がそろいます。
  2. アプリの画面は、1回だけ撮る。 iPhone 18 Pro の英語の画面で撮った素材を、全言語で共通に使っています(ウィジェットに映るのは、デモ用シートの内容が中心のため)。
  3. Python(Pillow)で、言語ごとに組み立てる。 背景、見出し、小見出し、画面の素材を重ねて、1320×2868 の画像を書き出します。
python3 AppStore/make-screenshots-v3.py        # 全言語
python3 AppStore/make-screenshots-v3.py ja en  # 指定した言語だけ

デザインの面で決めたことも、スクリプトの中に書いています。

  • 端末の画面は、ウィジェットの少し下で切って、下端を画像の下に合わせる。空いた上の部分を文字に使う
  • 元のスプレッドシートを並べると同じ情報が2回出るだけなので、使うのは「大きな表の一部だけをウィジェットにできる」ことを示す1枚目だけ
  • iOS 27 の特大ウィジェットの枚だけは、端末を縦に長く見せる必要があるので最後に置く

ToVue:シミュレータの言語を切り替えて、言語ごとに撮る

ToVue は、地図の上に出る地名やメニューの文言が言語ごとに変わるので、言語ごとに実際の画面を撮る必要があります。

撮影は、Xcode の UI テストで自動化しています。シェルスクリプトで、次の手順を言語の数だけ繰り返します。

  1. シミュレータを止めて、システムの言語と地域をその言語に書き換える
  2. シミュレータを起動し直す
  3. アプリを入れ直す(前の言語の設定や、評価のお願いの表示などを持ち越さないため)
  4. UI テストで、決めた5つの場面(飛行、動画の録画、写真、場所の検索、設定)を撮る
plutil -replace AppleLanguages -json "[\"$lang\"]" $prefs
plutil -replace AppleLocale -string $locale $prefs
xcrun simctl boot $sim
xcrun simctl uninstall $sim tovue.com
xcodebuild ... -only-testing:CityTraceUITests/AppStoreScreenshotTests/testSelectedLanguageScreenshots test

撮った画面は、Swift のスクリプトで見出しと組み合わせて、最終的な画像にします。iPhone(1320×2868)と iPad(2064×2752)で、同じ手順を繰り返します。

つまずいたこと

  • 起動直後のシミュレータは、最初の 3D 地図の描画で時間切れになることがある。 そのため、撮影は1回だけやり直すようにしています。
  • シミュレータを2台同時に動かすと、Mac が非常に重くなることがありました。撮影は1台ずつにしています。

アップロードも API で

できた画像は、App Store Connect API でアップロードしています。言語ごとに、古いスクリーンショットを消してから、01.png から順番に登録し、Apple 側の処理が終わったことまで確認するスクリプトです。言語×枚数ぶんを手でドラッグする必要がなくなりました。

注意点として、スクリーンショットを差し替えられるのは、そのバージョンが編集できる状態(審査に出す前など)のときだけです。

まとめ

  • 検索結果で見えるのは最初の2〜3枚。そこで何のアプリか分かるようにする
  • 見出しの文字数と大きさを先に決めて、全枚・全言語でそろえる
  • 言語で画面が変わらないアプリは「1回撮って、言語ごとに組み立てる」
  • 言語で画面が変わるアプリは「シミュレータの言語を切り替えて、UI テストで撮る」
  • アップロードまで API で自動化すると、作り直しが気軽にできる

← ブログの一覧へ