Chrome ウェブストアで使用する画像の種類をいくつか指定する必要があります。
拡張機能アイコン、小さいプロモーション画像、スクリーンショットのみが必須です。ただし、必須とオプションの魅力的な画像の両方を用意すると、拡張機能に気づかれる可能性が高くなります。たとえば、マーキーのプロモーション画像を提供しない限り、マーキーに拡張機能を表示することはできません。
画像やその他のリスティング情報に関するおすすめの方法に従うことで、Chrome ウェブストアでのアイテムのパフォーマンスを向上させることができます。詳細については、魅力的なリスティング ページの作成をご覧ください。
拡張機能のアイコン
拡張機能の ZIP ファイルに 128x128 ピクセルの拡張機能アイコン画像を指定する必要があります。画像の要件は次のとおりです。
- 実際のアイコンサイズは 96x96(正方形のアイコンの場合)とし、一辺を 16 ピクセル追加して透明なパディングにします。合計で最大 128x128 の画像サイズになります。詳しくは、アイコンのサイズをご覧ください。
- 画像は PNG 形式にする必要があります。
- 画像は、明るい背景と暗い背景のどちらでも適切に表示される必要があります。
アイコンをデザインする際は、次の点に注意してください。
- 128x128 の画像の周囲に端を配置しないでください。UI で端が追加される場合があります。
- アイコンのほとんどが暗い場合は、暗い背景でも見やすくなるよう、外側の白色の薄いグローを追加することを検討してください。
- 大きなドロップ シャドウは避けてください。UI にシャドウが追加されます。コントラストのために小さなシャドウを使用しても問題ありません。
- アイコンの下部にベベルがある場合は、深さを 4 ピクセルにすることをおすすめします。
- アイコンは、組み込みの遠近法ではなく、閲覧者の正面を向くようにしてください。詳しくは、Perspective をご覧ください。
このガイドラインに準拠しているアイコンの一部を以下に示します。
アイコンのサイズ
拡張機能のアイコンは、アイコンの見た目もほぼ同じにして、ほぼ同じ大きさにする必要があります。次の図に示すように、アイコンのサイズを利用可能な領域いっぱいにすると、正方形と円形のアイコンは他の形状のアイコンと比較して、実際よりも大幅に大きくなります。
次の図に示すように、アイコンサイズを正規化すると、アイコンの面積と視覚的な重みがほぼ均一になります。
次のテンプレート画像を使用すると、画像のアートワークのサイズを判断できます。テンプレートには正方形と円の適切なサイズが示されていますが、これらはあくまでもガイドであり、とがったビットを含むアイコンはこれらの領域の外側に紛れ込んでしまう可能性があります。不規則な形のアイコンが占める領域が非常に小さく、そのほとんどがネガティブなスペースである場合は、128x128 の領域全体を使用しても問題ないでしょう。
アートワークのサイズについては、いくつかの目安があります。正方形のアイコンの場合、アートワークを 96x96 ピクセルにします。その他の正方形のアイコンの場合は、アートワークの幅を画像全体の幅の 75 ~ 80% にします。円形のアイコンは、直径が約 112 ピクセル、または画像の幅の 85 ~ 90% にする必要があります。不規則な形状を持つアイコンは、同様の重みを持つ必要があります。
次の図は、正方形と円形のアイコンをテンプレートと比較したものです。
次は、不規則な形のアイコンの例です。この場合、アイコンは正方形と円形のどちらのガイドラインにも従いませんが、どちらのガイドラインにも沿うように配置されます。
視点
柔軟性と一貫性を保つため、拡張機能のアイコンは正面を向いたものにします。遠近感を演出するような遠近感の微調整は問題ありませんが、激しい角度は避けます。
良質のアイコン(正面向き) | 悪いアイコン(遠近法が強すぎる) |
---|---|
プロモーション画像
440×280 ピクセルの小さいプロモーション画像を 1 枚提供する必要があります。ストアが拡張機能の宣伝に使用できる他の画像を指定することもできます。
注: 画像で Google ブランドを参照している場合は、ブランディング ガイドラインを遵守してください。
必要なプロモーション画像は小さいサイズのみですが、Chrome ウェブストアで拡張機能を目立たせる場合は、大きいプロモーション画像を指定することもできます。次のいずれかを指定できます。
- 小: 440x280 ピクセル(必須)
- マーキー: 1400x560 ピクセル
プロモーション画像は、ユーザーの注意を引き、詳しい情報を求めるチャンスです。スクリーンショットだけを使用するのではなく、主にブランドを伝える画像を使用してください。画像を設計する際のルールは次のとおりです。
- 文字のない画像を使用する:
- 半分のサイズに縮小しても、画像が機能することを確認してください。
- 画像の背景が薄いグレーであると仮定します。
- 可能であれば、彩度の高い色を使用します。色鮮やかなものが効果的です。
- 白と薄いグレーを多用しないでください。
- 領域全体を入力します。
- 端が明確に定義されていることを確認します。
次の画像は、拡張機能のプロモーション画像の例です。
審査ステータスの説明は次のとおりです。
- Pending Review ステータス: 画像がまだ審査されておらず、ストアに表示されていません。画像は、送信から 1 週間以内に審査されます。
- ステータスなし: 画像が承認され、ストアに表示されています。[*「下書き」または「Trusted Tester」アイテムの画像には、画像ステータスは表示されません。プロモーション画像の承認を受けるには、アイテムを公開する必要があります。]
- 不承認: 画像は審査で不承認となり、ストアには表示されていません。不承認の理由は、アイテムの編集ページの [プロモーション画像] セクションに表示されます。改善された新しい画像を再アップロードする前に、その理由を確認し、必要な変更を行うことをおすすめします。新しくアップロードされた画像は、直ちに [Pending Review] ステータスになります。
プロモーション画像を置き換えるには、画像にカーソルを合わせて、画像削除コントロールを表示します。
スクリーンショット
スクリーンショットを使用して、拡張機能の機能、デザイン、エクスペリエンスをユーザーに伝えます。拡張機能のストアの掲載情報に表示する拡張機能のスクリーンショットを 1 枚以上(できれば最大 5 枚)提供する必要があります。スクリーンショットは、拡張機能のエクスペリエンスがどのようなものになるかをユーザーが予測できるように、主要な機能とコンテンツに焦点を当てて、実際のユーザー エクスペリエンスを示す必要があります。
拡張機能が複数の言語 / 地域に対応している場合は、ストアの掲載情報をローカライズするの説明に沿って、地域ごとのスクリーンショットを提供できます。
拡張機能の一覧を編集する際、スクリーンショットのサムネイルにカーソルを合わせると、スクリーンショットの削除や位置の変更ができるコントロールが表示されます。
各スクリーンショットは次のとおりです。
- 角が直角、パディングなし(余白なし)
- 1280x800 または 640x400 ピクセル
例として、次の 2 つの拡張機能のスクリーンショット画像を示します。
次のステップ
次に、拡張機能を公開するために送信するをご覧ください。