· デザイン · 約3分

App Storeロケール全体で通用するスクリーンショット用フォント

App Storeロケール全体で通用するスクリーンショット用フォント
TL;DR. Inter、SF Pro、GT America、Geist、Söhneが安全な選択肢です。ヘッドラインにはウェイト700〜900を使用し、600より細くしないでください。アラビア語・ヘブライ語・ヒンディー語・タイ語・CJKなど非ラテン系ロケールではシステムフォントにフォールバックしてください。ほとんどのマーケティング用書体にはそれらの文字が含まれていません。装飾的なディスプレイフォントは、サムネイルサイズではほぼ必ず機能しません。

App Storeスクリーンショットのフォント選びには、一般的なタイポグラフィの判断にはない3つの制約があります。サムネイルでの可読性、App Storeレンダラーの挙動、そして50ロケールの文字対応です。この3つのいずれかを満たさないフォントを選ぶと、カルーセルのコンバージョンに悪影響を与えます。

サムネイル可読性テスト

App Storeの検索結果では、スクリーンショットがおよそ200〜260ピクセル幅で表示されます。これは元の1320 × 2868の約6分の1です。デザイン上100ピクセルの高さがあるキャプションテキストも、サムネイルでは約15ピクセルになります。このサイズでは、細いストロークのフォント(Helvetica Light、Avenir Next Ultra-Light、Playfair Display Thin)は判別できないぼやけた表示になります。

サムネイルサイズでも崩れないフォントには、いくつかの共通した特徴があります:

  • 広いxハイト(x字高)— 大文字に対して小文字が高い
  • 太いウェイト(700〜900)
  • オープンアパーチャー — 「c」「e」「a」のような文字の内側の空間が小さいサイズでも開いている
  • 一定のストローク幅 — 細い部分と太い部分のコントラストがない

ラテン文字ロケールで使えるフォント

App Storeカルーセルでの使用実績があり、安定しているフォントです:

  • Inter(無料・オープンソース)— Mokbiのデフォルト。Inter BoldとInter Blackはあらゆるサイズで良好にレンダリングされます。ラテン文字・キリル文字・ギリシャ文字・ベトナム語をそのままカバーします。2025〜2026年のインディー開発者エコシステムで最も多く使われているアプリスクリーンショット用フォントです。
  • SF Pro(Appleシステムフォント)— Apple自身の書体です。Appleのフォントライセンスに基づき、iOSアプリのマーケティング素材に無料で使用できます。すべてのiOSデバイスで同一にレンダリングされます。Interと比べると「Appleらしさ」が出やすく、ブランドによってメリットにもデメリットにもなります。
  • Söhne(有料、Klim Type Foundry)— OpenAI・Anthropic時代の定番書体。Linear、OpenAI、Vercelが採用しています。多彩なウェイトを備えますが、ライセンスは高価です。
  • GT America(有料、Grilli Type)— ジオメトリック系サンセリフで豊富なウェイトを持ち、マーケティング素材での発色が良好です。Notion、Stripeなどが採用しています。
  • Geist(無料、Vercel)— 最近オープンソースとして公開されました。サムネイルサイズで良好な表示になります。キリル文字・ギリシャ文字のサポートは限定的です。
  • Roboto / Roboto Flex(Google、無料)— Androidのデフォルトフォントです。iOSカルーセルでの使用例は少ないですが、視認性は問題ありません。

使えないフォント

  • Thin・Ultra-Lightウェイト。ウェイト400未満はサムネイルサイズでぼやけて判読できなくなります。常にウェイト600以上、メインのキャプションには700以上を選んでください。
  • ストロークコントラストが強いディスプレイフォント。ディドーネ系セリフ(Bodoni、Didot)やコンデンスドディスプレイ(Bebas、League Spartan Bold Variable)はエッジがつぶれます。
  • スクリプト・手書き系フォント。サムネイルでは判読不可能です。使わないでください。
  • Comic Sans、Papyrus。今でも使う方がいますが、避けてください。

非ラテン文字のスクリプト

ほとんどのマーケティング用フォントには、アラビア文字・ヘブライ文字・ヒンディー語(デーヴァナーガリー)・タイ文字・CJKのグリフが含まれていません。それらのロケールに翻訳したカルーセルを公開すると、フォントはシステムデフォルトにフォールバックします。現実的な対応策は2つあります:

  • ロケールごとのシステムフォールバックを受け入れる。非ラテン系市場のユーザーはシステムデフォルトのフォントに慣れており、特に違和感を持ちません。失われるブランドの一貫性は、得られるフォント読み込みの複雑さに見合いません。
  • 多言語対応フォントと組み合わせる。Notoファミリー(Noto Sans、Noto Serif)はAppleがサポートするほぼすべての文字をカバーしています。ラテン文字にInterを使いつつ、Noto Sans Arabic・Noto Sans Hebrew・Noto Sans Devanagari・Noto Sans Thai・Noto Sans CJKと組み合わせることで、ロケールをまたいだ視覚的なウェイトを均一に保てます。

App Storeスクリーンショットの制作においては、システムフォールバック方式が現実的な選択です。Noto方式は、ブランドの一貫性が市場をまたいで重要なアプリ(ラグジュアリー、ファッション、デザインツールなど)に適した正解です。

合成ボールドと合成イタリック

どちらも避けてください。多くのデザインツールは、実際のウェイトやイタリック体が存在しない場合に「合成」で太字や斜体を生成します。この結果は小さいサイズで破綻して見え、CJKやアラビア文字では特に品質が低下します。合成バージョンではなく、必ずフォントの実際のウェイトまたはイタリック体を使用してください。

実践的な確認方法:フォントピッカーに「Regular」しかなく、「B」ボタンで太字を適用しているなら、合成ボールドが使われています。実際のBoldウェイトが用意されているフォントに切り替えてください。

ヘッドラインのレタースペーシング

多くのマーケティング用フォントは、本文サイズではちょうど良く見えるレタースペーシングに設定されていますが、見出しサイズでは若干広がりすぎます。スクリーンショット内のヘッドラインテキストは、トラッキングを-2%〜-4%に詰めてください。視覚的なリズムが引き締まり、個々の文字が小さく感じられるサムネイルサイズでも読みやすくなります。

デフォルトの設定

Mokbiは新規テキストレイヤーのデフォルトをInterウェイト700に設定しています。Interは無料・オープンソースで、ラテン文字・キリル文字・ギリシャ文字・ベトナム語をカバーし、ブラウザ間で一貫してレンダリングされます。非ラテン系ロケールでは、エディタがロケールごとのシステムデフォルトに自動的にフォールバックします。これがほとんどのアプリにとって現実的な選択です。

次に読むべき記事

エディタを開く →