ブランドガイドライン

プッシュプロビジョニング用の Google Pay API は、アプリ内に Google Pay の機能を表示したいカード発行会社向けに設計されています。API と統合する際には、次のガイドラインに従ってください。

[Google Pay に追加] ボタン

[Google Pay に追加] ボタンは、カード発行会社のアプリから Google Pay のカードプロビジョニングフローを開始するための専用のボタンです。

サイズ

プッシュプロビジョニングのボタンの高さと幅をレイアウトに合わせて調整します。ページに他のボタンがある場合は、Google Pay のプッシュプロビジョニングのボタンはそれらのボタン以上の大きさにする必要があります。Google Pay のボタンを他のボタンよりも小さくしないでください。

スタイル

Google Pay のプッシュプロビジョニングのボタンには黒と白があります。「Add to」のテキストをローカライズしたプッシュプロビジョニングのボタンも用意されています。独自にローカライズしたテキストのボタンを作成しないでください。

黒	白	白（輪郭付き）

黒いボタンは、白い背景や明るい背景でコントラストをつけるときに使用します。暗い色の背景では黒いボタンを使わず、代わりに白いボタンを使ってください。	暗い色の背景やカラフルな背景の場合は、白いボタンを使用します。白い背景や明るい色の背景では白いボタンを使わず、代わりに黒いボタンを使ってください。	輪郭付きの白いボタンは、白い背景や明るい色の背景の場合の黒いボタンの代替となります。暗い色の背景やカラフルな背景の場合は輪郭付きの白いボタンを使わず、代わりに白いボタンを使ってください。

クリアスペース

Google Pay ボタンの上下左右には、常に 8 dp 以上のクリアスペースを確保する必要があります。クリアスペースにはグラフィックスやテキストが入らないようにしてください。

プッシュプロビジョニングのクリアスペース

最小の幅

すべての Google Pay プッシュプロビジョニングのボタンには、最低限 139 dp の幅が必要です。

プッシュプロビジョニングの最低限の幅

アセット

[Google Pay に追加] ボタンは、サイズ変更が可能なビットマップ（NinePatch ファイル）として利用できるため、レイアウトに含めるのに最適です。

アセットをダウンロードする



Google Pay のボタンは背景に合ったものを使用し、画面上部付近に配置してください。	ボタンとユーザーのクレジットカードまたはデビットカードを明確に関連付けてください。	Google Pay のボタンをトラフィックの多い画面で目立つように表示してください。

Google Pay の文中での使用

文章の中で Google Pay を支払い方法として説明したり、マーケティングコミュニケーションで Google Pay を宣伝したりできます。

「Google Pay」をテキストで使用して、カードを追加するようユーザーに促します。

「G」と「P」を大文字にする

「G」と「P」は必ず大文字にし、それに続く文字は小文字にしてください。UI の字体に合わせる場合を除き、「GOOGLE PAY」のようにすべてを大文字にしないでください。マーケティングコミュニケーションでは、すべて大文字の「GOOGLE PAY」は決して使用しないでください。

Google Pay を略さない

「Google」と「Pay」の語は必ず略さずに書きます。

UI の字体に合わせる

「Google Pay」のフォントと字体は、UI の他のテキストと同じにする必要があります。Google の字体は模倣しないでください。

Google Pay を翻訳しない

「Google Pay」は必ず英語で記述する必要があります。他の言語に翻訳しないでください。

マーケティングコミュニケーションでは最初に出現する「Google Pay」に商標マークを使用する

マーケティングコミュニケーションで「Google Pay」を使用する場合、最初に出現する箇所または最も目立つ箇所に商標マーク ™ を表示する必要があります。UI で支払い方法として Google Pay を説明する場合は、商標マークを使用しないでください。

ベストプラクティス

[Google Pay に追加] プッシュプロビジョニングのボタンをアプリ内で目立つように表示することで、プロビジョニングされるカードの数を最大限に増やすことができます。Google からブランド承認を受けるには、以下のベストプラクティスを実践する必要があります。

Google Pay のボタンをトラフィックの多い画面で目立つように表示する

ユーザーに Google Pay ボタンが見えるように、既存のユーザーフロー内の画面に追加します。ボタンとユーザーのクレジットカードまたはデビットカードを明確に関連付けてください。カードが表示されていない画面に Google Pay ボタンを表示しないでください。

Google Pay のボタンをアクセスしやすい画面で使用する

頻繁にアクセスのある画面でのみ Google Pay ボタンを使用してください。可能な場合は、ログイン後に初めてユーザーに表示される画面に Google Pay ボタンを表示します。ホーム画面に Google Pay ボタンを表示できない場合は、1 クリックで移動できる画面（クレジットカードまたはデビットカードのアカウントの詳細画面など）にボタンを追加するようにしてください。

Google Pay ボタンを画面上部付近に配置する

アカウントの詳細画面や多くの情報を含むほかの画面に Google Pay ボタンを表示する場合、ユーザーが見つけやすいように、Google Pay ボタンを必ず画面上部付近に配置するようにしてください。

プロモーションコールアウトを使用してユーザーにカードのプロビジョニングを促す

プロモーションコールアウトを使用すると、ユーザーが初めてログインしたときや特定の日付に Google Pay にカードを追加するようにユーザーに働きかけることができます。また、トラフィックの多い画面に Google Pay を表示しない場合は、プロモーションコールアウトを使用してください。

Google Pay ボタンを明確に特定できるようにする

複数のモバイルウォレットのプロビジョニングをサポートする場合は、Google Pay が常に独自のボタンや有効な要素を持つようにします。Google Pay のボタンは他のモバイルウォレットのボタンや有効な要素の横に配置できますが、Google Pay を別のモバイルウォレットのボタンや有効な要素の中で使用することはできません。

最適なプッシュプロビジョニングフロー

上記の画面は、推奨される Google Pay のプッシュプロビジョニングフローを表します。

「Add to Google Pay」の翻訳

次の表に、「Add to Google Pay」の正式な翻訳を示します。

言語	Add to Google Pay
ブルガリア語	Добавяне към Google Pay
中国語	添加到 Google Pay
クロアチア語	Dodaj u Google Pay
チェコ語	Přidat do Google Pay
デンマーク語	Føj til Google Pay
オランダ語	Toevoegen aan Google Pay
英語	Add to Google Pay
エストニア語	Lisage Google Pay'sse
フィンランド語	Lisää Google Payhin
フランス語	Ajouter à Google Pay
ドイツ語	Zu Google Pay hinzufügen
ギリシャ語	Προσθήκη στο Google Pay
ハンガリー語	Adja hozzá: Google Pay
イタリア語	Aggiungi a Google Pay
日本語	Google Pay に追加
韓国語	Google Pay 에 추가
ラトビア語	Pievienot Google Pay
リトアニア語	Pridėkite prie Google Pay
マレー語	Sambungkan ke Google Pay
ノルウェー語	Legg til i Google Pay
ポーランド語	Dodaj do Google Pay
ポルトガル語	Adicionar ao Google Pay
ルーマニア語	Adaugă în Google Pay
ロシア語	Добавить в Google Pay
セルビア語	Додај у Google Pay
スロバキア語	Pridať do Google Pay
スペイン語	Agregar a Google Pay
スウェーデン語	Lägg till i Google Pay
ウクライナ語	Додати в Google Pay
タイ語	บันทึกเข้า Google Pay
トルコ語	Google Pay için tanımla

お使いの言語がこの表にない場合は、Google Pay チームにお問い合わせください。

Flutter に関するベストプラクティス

Flutter を使用して Android アプリを開発している場合は、上述のローカライズされた Android アセットを使用できません。代わりに、別のロケールをサポート対象として指定してから現在のロケールを取得し、それを使用して適切なアセットを取得する必要があります。

下のリンクからアセットをダウンロードして、アセットディレクトリ内に googlepay フォルダを置きます。次のようなコードを使用して適切なアセットを取得します。

Image.asset('assets/googlepay/${Localizations.localeOf(context).languageCode}/button.png'));

これらのアセットは、別のクロスプラットフォーム開発フレームワークを使用して Android アプリを開発する場合にも使用できます。

Flutter 用アセットをダウンロードする