成果につながるGoogle Playフィーチャーグラフィックのデザイン
Playリスティングでは、他のすべての要素より上に横長のバナーが一つ表示されます。スマートフォンのブラウザでもPlayアプリ内でも、スクリーンショットや説明文より前、多くの場合ファーストビュー内で全幅表示されます。ほとんどのユーザーが最初に目にするパーツであり、多くの開発者がテンプレートからそのまま書き出してしまうパーツでもあります。だからこそ、きちんと考え抜かれた一枚が際立つのです。
この記事はデザインとポリシーに焦点を当てています。正確なサイズやファイル形式、表示位置については別記事で解説していますが、要点だけ言えば1024×500px、JPEGまたはアルファチャンネルなしの24ビットPNGで保存する必要があります。Playは1ピクセルでもずれていると却下し、透過部分は黒として表示されます。以下では、すでにそのキャンバスがある前提で、タップされるための工夫を解説します。
伝えることは一つに絞る
フィーチャーグラフィックは機能を詰め込むポスターではありません。実際に表示されるサイズ(スマートフォンではわずか数百ピクセル幅)では、伝えられるアイデアは一つ、伝わらなければゼロです。ユーザーがインストールする唯一の理由を選び、フレーム全体をそれに合わせて構成しましょう。瞑想アプリなら機能一覧ではなく「穏やかさ」を見せる。家計簿アプリなら5つのアイコンではなく、すっきりと伸びていく数字を見せる、という具合です。
最も手早いテスト方法は、グラフィックをサムネイルサイズに縮小し、1秒だけ眺めてみることです。アプリのカテゴリと主なメリットが分かれば合格です。目が情報を探してしまうなら、詰め込みすぎです。
再生ボタンのセーフゾーンに注意する
リスティングにプロモ動画を添付すると、Playはフィーチャーグラフィックの上に再生ボタンを重ねて表示し、タップすると視聴できるようにします。このボタンはバナーの中央に配置され、さらにグラフィックは表示面やデバイスによってフレーミングやクロップが異なる場合があります。レイアウト上、考慮すべき点は2つです。
- ロゴや文字を厳密な中央には置かない。 ワードマークの上に再生ボタンが乗ると、ミスのように見えてしまいます。重要な要素は中央からずらし、左3分の1やバナー下部に寄せることで、オーバーレイと衝突しないようにしましょう。
- 端に十分な余白を残す。 文字やロゴを境界ぎりぎりに配置しないこと。表示面によってフレームがクロップされる場合、真っ先に失われるのは端の要素です。外側の余白は使えるスペースではなく、裁ち落としと考えましょう。
現時点で動画がなくても、再生ボタンが表示される可能性を前提にデザインしておくと選択肢が広がり、より堅牢な構成になります。
Playが越えさせないライン
Google Playのコンテンツ品質ポリシーでは、ストアのグラフィック素材は広告ではなく編集コンテンツとして扱われます。フィーチャーグラフィック(そしてタイトルや簡単な説明も)には、宣伝的・実績訴求的な表現を含めてはいけません。これらに抵触すると、審査でフラグが立つか却下されます。禁止カテゴリは次のとおりです。
- 実績・ランキングの主張：「最高」「1位」「トップ」「今年のアプリ」「人気」「Playのベスト」など。
- 受賞歴・称賛・推薦文：トロフィーバッジ、「〜で紹介されました」、引用、星評価、5つ星のビジュアル。
- ダウンロード数やユーザー数：「100万ダウンロード以上」「100万人のユーザーに参加」など。
- 価格・プロモーション：「無料」「50%オフ」「セール」「期間限定」「50ドルキャッシュバック」など。
- 行動喚起(CTA)：「今すぐダウンロード」「今すぐインストール」「今すぐプレイ」「今すぐ試す」など。
- Playのバッジやストア要素：「Google Playで手に入れよう」バッジやPlayのUIコントロールを模したもの、さらに偽のボタン・トグル・タップ領域をデザイン内に組み込むこと。
安全に保つための言い換え方は、アプリが何位か、いくらするかではなく、アプリが何であるかを伝えることです。「サブスクリプションをすべて一箇所で管理」はOKですが、「1位のサブスク管理アプリ、しかも無料！」は1文で2つの違反を犯しています。
実際の表示サイズで読みやすくする
デザインは1024×500で行いますが、判断はサムネイルサイズで行いましょう。バナーが縮小されて初めて表面化する失敗はこちらです。
- コントラスト不足。 ごちゃついた写真の上の淡い文字は、縮小した瞬間に見えなくなります。文字は単色またはゆるやかなグラデーションの背景に置き、文字と背景の明度差をしっかり確保しましょう。
- 文字が小さすぎる、または細すぎる。 細い書体や長い文章はつぶれてぼやけます。文字を使うなら、大きく太いものを少数に絞りましょう。
- フルサイズでしか読み取れない細部。 細かいUI、小さな製品写真、密なパターンはすべて崩れます。大胆な形と明確な視線誘導ポイントを優先しましょう。
そしてもう一つの落とし穴。バナーでアプリ名を繰り返すのはもったいない使い方です。タイトルはすでにすぐ隣に表示されています。2センチ先で読めるテキストにグラフィックの見出しを使うのは無駄なメッセージです。代わりにメリットや製品そのものを見せましょう。
リスティング全体と統一感を持たせる
フィーチャーグラフィックは単独の作品ではなく、一連のセットの先頭です。その下にアイコンがあり、さらにその下にスクリーンショットが続きます。色、書体、雰囲気がバナーからアイコン、スクリーンショットまで一貫していると、リスティング全体が一つの製品として、丁寧に作られた印象を与えます。逆にフィーチャーグラフィックがスクリーンショットと何の共通点もないストックのグラデーションだと、後付けのように見え、信頼を静かに損ないます。
パレットはアイコンやアプリの実際のUIから抽出しましょう。スクリーンショットのキャプションに使っているアクセントカラーを再利用します。書体ファミリーは全体を通して一つに統一しましょう。ここでの一貫性は装飾ではなく、リスティング全体が意図を持ってデザインされたことを示すシグナルです。
Mokbiでできること
Mokbiは、スクリーンショットセットと合わせて1024×500のフィーチャーグラフィックをデザインします。バナー、パネル、キャプションが最初から一つのパレット、一つの書体、一つのメッセージを共有するので、別ツールでの手作業による色合わせは不要です。仕様どおり(JPEGまたはアルファチャンネルなしの24ビットPNG)に書き出し、重要な要素を中央や端から離して配置し、グラフィックを50言語でローカライズします。どの市場でも、切り抜かれた英語版ではなく、ちゃんとフィットしたバナーが届きます。
メッセージやアートディレクションの判断は変わりません。このツールは、フィーチャーグラフィックを含むリスティング全体が統一感を持って見えるようにするだけです。