ブランドの取り扱いガイドライン

ロシアのユーザーを対象としている場合は、[スマートフォンに保存] を使用してください。 ボタンが表示されないことがあります。詳しくは、 個の関連性の高いアセットと ガイドラインをご覧ください。ロシア以外のユーザーを対象としている場合は、 アセットをダウンロードして [Google ウォレットに追加] ボタンを更新する ご覧ください

このドキュメントのこのセクションは、イメージとファイルを作成する際に役立ちます。 ユーザー インターフェース要素を変更して、 Google ウォレット アプリ。

アセット

[Google ウォレットに追加] ボタン

[Google ウォレットに追加] ボタンは、 アプリやウェブサイトからウェブサイトに直接パスやカードを保存する 。[Google ウォレットに追加] ボタンは、 Google Wallet API のフロー。このフローにより Google ウォレット アプリが表示され、 手順に沿ってパスを Android デバイスに保存できます 確認します。このボタンは、アプリ、ウェブサイト、 できます。

[Google ウォレットに追加] ボタンは、Android XML、SVG、 PNG 形式でアップロードされます

アセットのダウンロード - Android XML アセットをダウンロードする - SVG をご覧ください。 アセットのダウンロード - PNG

[Google ウォレットで表示] ボタン

[Google ウォレットで表示] ボタンは、ユーザーをディープリンクするために使用されます。 以前に保存したパスやカードを表示する。この ボタンは、アプリ、ウェブサイト、メールで使用できます。

[Google ウォレットで表示] ボタンは、SVG 形式と PNG 形式で提供されています。

アセットをダウンロードする - SVG アセットのダウンロード - PNG をご覧ください。

サイト、アプリ、メールに表示されるボタンはすべて、ブランドに沿ったものでなければなりません このページで概説しているガイドラインです。ガイドラインの例を以下に示しますが、これらに限定されません。 次のとおりです。

• ページの他の類似ボタンや要素と比較したサイズ
• ボタンの形状や色は変更できません
• クリアスペース

ローカライズされたボタン

ウォレットが提供されているすべての市場で、ローカライズされた Google ウォレットのボタンが提供される できます。これらの市場のユーザー向けにアプリを開発する場合は、必ず 上のリンクのボタンです。独自バージョンのボタンを作成しないでください。 対象の市場でローカライズ済みバージョンのボタンが用意されていない場合は、 英語版のボタン。

[Google ウォレットに追加] ボタンは、アルバニア語、 アラビア語、アルメニア語、アゼルバイジャン、ボスニア語、ブルガリア語、カタルーニャ語、中国語 （香港）、中国語（繁体）、クロアチア語、チェコ語、デンマーク語、オランダ語、英語 （インド、シンガポール、南アフリカ、オーストラリア、カナダ、英国、英国） 州）、エストニア語、フィリピン語、フィンランド語、フランス語（カナダ）、フランス語（フランス）、 グルジア語、ドイツ語、ギリシャ語、ヘブライ語、ハンガリー語、アイスランド語、インドネシア語、イタリア語、 日本語、カザフ語、キルギス語、ラトビア語、リトアニア語、マケドニア語、マレー語、ノルウェー語、 ポーランド語、ポルトガル語（ブラジル）、ポルトガル語（ポルトガル）、ルーマニア語、ロシア語 （ベラルーシ）、セルビア語、スロバキア語、スロベニア語、スペイン語（ラテンアメリカ）、スペイン語 （スペイン）、スウェーデン語、タイ語、トルコ語、ウクライナ語、ウズベク語、ベトナム語。

ローカライズされた名前

ユーザーがわかりやすくするため、Google ウォレットのプロダクト名は一部の言語にローカライズされています。 ありますこれらの国のユーザー向けに開発を行う場合は、必ず 以下に、ウェブ、メール、印刷用のローカライズされた名前を示します。独自に作成しない ローカライズ版に移行しました。該当する市場がない場合は、 「Google ウォレット」（英語）。

国	名前
ベラルーシ	Google Бо voiceелек
ブラジル	カルテイラ ド Google
チリ	Billetera de Google
チェコ	ペンニェゼンカ Google
ギリシャ	Coursera
香港	Google 錢包
リトアニア	Google ピニギネ
ポーランド	Portfel Google
ポルトガル	カルテイラ ダ Google
ルーマニア	Portofel Google
スロバキア	ペニャゼンカ Google
台湾	Google 錢包
トルコ	Google キュズダン
アラブ首長国連邦	محفظة Google
ウクライナ	Google IARC
米国（スペイン語） *米国で UI がスペイン語の場合は、この名前を使用してください	Billetera de Google

サイズ

[Google ウォレットに追加] ボタンの高さと幅を調整する レイアウトに合わせて変更できますページに他のボタンがある場合は、 [Google ウォレットに追加] ボタンは、サイズを同等以上にする必要があります。 [Google ウォレットに追加] ボタンを他よりも小さくしない できます。

スタイル

[Google ウォレットに追加] ボタンには、次の 2 つのバリエーションがあります。 有用です。[Google ウォレットに追加] ボタンのみ 色は黒です。ローカライズ版のボタンが用意されています。作成しない 独自のローカライズしたテキストでボタンを作成します。

プライマリ	Condensed
基本形のボタンは、白い背景と明るい色の背景で使用します。	メインの表示位置に十分なスペースがない場合は、簡易表示のボタンを使用します。 指定することもできます。

クリアスペース

上下左右に常に 8 dp 以上のクリアスペースを確保する必要があります。 [Google ウォレットに追加] ボタン。クリアスペースは、 グラフィックやテキストが途切れることはありません。

最小の高さ

すべての [Google ウォレットに追加] ボタンには、最小の高さが必要です 48 dp とする。

推奨事項と禁止事項

推奨事項	禁止事項
良い例: Google が提供する [Google ウォレットに追加] ボタン。	非推奨: 独自のルールを作成する [Google ウォレットに追加] ボタンを使用するか、フォント、色、 ボタンの半径、ボタン内のパディングなどを指定できます。
推奨: 同じスタイルのボタンを使用する サイト全体でトラッキングします	禁止事項: [Google ウォレットに追加] ボタンが他のボタンよりも小さくなりました。
推奨事項: クリエイティブのサイズを [Google ウォレットに追加] ボタンが同じか大きくなっている 他のボタンと異なります。	不可: ボタンの色を変更しないでください。
推奨事項: ボタンの縦横比を維持したままにする [Google ウォレットに追加] ボタンのサイズ変更時。	非推奨: ボタンを縦横比を変えない。
良い例: 提供されたローカライズ済みの あります。	不可: 独自のローカライズ版を作成する 使用できます。

ボタンの配置に関するベスト プラクティス

確認アプリに [Google ウォレットに追加] ボタンを表示する ウェブページ、メールなどです。UI の指針となる次のベスト プラクティスを参照してください。 考えています

搭乗券

[Google ウォレットに追加] ボタンを 購入フロー、確認アプリの画面、ウェブページ、メールなどでユーザーに表示されます。水 [Google ウォレットに追加] を ] ボタンが表示されていれば、ユーザーはそこからパスにアクセスできます。

   

テキスト内で Google ウォレットのプロダクト名を使用する場合

搭乗券があることをテキストでユーザーに示すことができます ユーザーのデバイスに保存されます

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

常に大文字の「G」を使用するまたは大文字の「W」があります。その後に小文字が続きます Google ウォレットについてご説明します。名前を大文字にしない 「Google ウォレット」UI の字体に合わせる場合は除きます

Google ウォレットを略さない

「Google」という単語は必ず省略せずに書きます。。

UI のスタイルに合わせる

[Google ウォレット] を設定するフォントと字体は 必要がありますGoogle の字体は模倣しないでください。

ローカライズされた「Google ウォレット」を常に使用する

常に「Google ウォレット」と表記します。翻訳する必要があります。

デザイン

次のクラスの height フィールドと size フィールドを使用して、 テキスト ファイルの高さと幅を変更する g:savetoandroidpay HTML タグ [Google ウォレットに追加] ボタン。こちらの textsize=large の仕様で、テキストを大幅に増やし、 モバイルの実装や特別な UI 要件がある場合のボタンのサイズ

theme を使用してボタンの色を設定します。次の 表に、これらの設定が [Google ウォレットに追加] ボタン。

ロゴ

ロゴ画像に関するガイドライン

ロゴが円形にマスクされます。

ユーザー インターフェースで使用するロゴ画像の推奨事項は次のとおりです。

ガイドライン	説明
優先するファイル形式	PNG
最小サイズ	660 x 660 ピクセル
画像のアスペクト比	1:1
アートワークのアスペクト比	1:1
実際のピクセルサイズ	デバイスサイズに合わせたスケーリング
ロゴの円形マスク	ロゴは円形のデザイン内に収まるようにマスキングされます。必ず、 ロゴがセーフエリア内に収まるようにしてください。画像アセットを事前に ロゴ。余白なしの背景色の正方形の中にロゴを配置します。 ロゴの余白は 15% にして、途中で切れないように マスクされます。

ロゴが円形にマスクされます。

ワイドロゴ画像に関するガイドライン

イベント チケット、搭乗券、QR コードによる交通機関のパス、 ポイントカード、クーポン、ギフトカード、汎用パス、汎用プライベート パス。 ユーザー インターフェースで使用するワイドロゴ画像の推奨事項は次のとおりです。

ガイドライン	説明
優先するファイル形式	PNG 最良の結果を得るには、背景色付きの画像を使用してください（同じ色を使用することをおすすめします 使用します）。
推奨されるサイズ	1,280 x 400 ピクセル
最小サイズ	高さは 400 ピクセル、幅は比例（詳しくは推奨アスペクト比のセクションを参照） 幅の広い長方形の画像を使用します。
推奨されるアスペクト比	画像が推奨のアスペクト比に設定されていない場合は、アスペクト比に合わせてサイズが変更されます。 アスペクト比を指定します。次の図では、画像アセットが アスペクト比に基づいてサイズが変更されます。

カードの背景色

背景色はフィールドで設定できます hexBackgroundColor。値を設定しない場合、アルゴリズム ロゴを分析して主要な色を特定して背景に使用 指定します。

メイン画像

class.heroImage フィールドは、全幅のバナーとして表示されます。 渡します。

ヒーロー画像に関するガイドライン

ユーザー インターフェースで使用するヒーロー画像の推奨事項は次のとおりです。

ガイドライン	説明
優先するファイル形式	PNG
推奨サイズ	1,032 x 336 ピクセル 幅の広い長方形の画像を使用します。 最良の結果を得るには、色付きの背景の画像を使用してください。
アスペクト比	3:1 以上
表示サイズ	カードの全幅とそれに比例する高さ。

全幅画像

クラスまたはオブジェクトの *.imageModulesData.mainImage フィールド パスでは全幅画像として表示されます。

全幅画像に関するガイドライン

ユーザー インターフェースの全幅サイズに関する推奨事項は次のとおりです。 images:

ガイドライン	説明
優先するファイル形式	PNG
最小サイズ	幅 1, 860 ピクセル、高さ可変。 幅の広い長方形の画像を使用します。 最良の結果を得るには、色付きの背景の画像を使用してください。
アスペクト比	変数
表示サイズ	テンプレートの全幅とそれに比例する高さ。
ロゴと同じカラーパターンを使用してください。

バーコード画像

一部の業種では、バーコードの上下に画像を表示できます。

バーコードの上の画像

ユーザー インターフェース上の上の画像の推奨事項は次のとおりです。 使用します。

ガイドライン	説明
優先するファイル形式	PNG
最大の高さ	20 dp（最大アスペクト比） 推奨されるサイズは、高さが 80 ピクセル、幅が 80 ～ 780 ピクセルです（2 つの場合）。 画像があります。横に並べて表示できます。 一方の画像が正方形でもう一方が長方形の場合、画像は 80×80 ピクセルと 780×80 ピクセルにする必要があります。
アスペクト比	制約なし。単一の画像の高さと幅が最大 20 dp である アスペクト比 20:1 を使用してください。 バーコードの上に 1 つの画像のみを配置する場合は、全幅を使用します。 （パディングを除く）。画像のサイズは 1,600x80 ピクセルにする必要があります。
最大表示サイズ（単一の画像）	高さ 20 dp、幅 400 dp

バーコードの下の画像

ユーザー インターフェースで使用する下の画像に関する推奨事項は次のとおりです。 使用します。

ガイドライン	説明
優先するファイル形式	PNG
最大の高さ	20 dp（最大アスペクト比） 推奨サイズは、高さ 80 ピクセル、幅 80 ～ 1,600 ピクセルです。 正方形の場合は 80×80 ピクセル。 長方形の場合は、1, 600×80 ピクセル。
アスペクト比の制限なし。高さと幅が最大 20 dp の場合は、次のコマンドを使用します。 アスペクト比 20:1	全幅画像（パディングを除く）が必要な場合は、画像を 1,600×80 ピクセル。
最大表示サイズは、高さ 20 dp、幅 400 dp です。

モジュール

モジュールは、テンプレートの特定のセクションに含まれるフィールドのグループを表します。 次の表に、実施するモジュール数のガイドラインを示します。 カードを表示するには、クラスとオブジェクトに含める必要が Google ウォレット アプリで正しく確認します。

ガイドライン	説明
imageModulesData	クラスまたはクラスで imageModulesData を 1 つだけ使用する 作成されます。
infoModuleData	クラスまたは同じで、infoModuleData を 2 つまで使用できます 作成されます。 infoModuleData では、ユーザー アカウント固有の [メンバー名] などの[メンバーシップ番号]を入力します
linksModuleData	次のどちらかで、合計で最大 4 つの linksModuleData URI を使用します。 オブジェクトで宣言します。 クラスに 2 つの linksModuleData URI があるとします。 1 つはウェブサイトの URI、もう 1 つはウェブサイトの電話番号 ヘルプセンターをご覧くださいオブジェクト内の 2 つの linksModuleData URI は、ユーザー アカウント固有の URI と付近の場所を定義します。
textModulesData	クラス間で最大 2 つの textModulesData フィールドを使用する オブジェクトが含まれます。 クラスに 1 つの textModuleData URI を は、プログラムの詳細と別の textModulesData を定義します。 ユーザー アカウント固有の詳細を定義するオブジェクト。

infoModuleData

InfoModuleData には、メンバーとカスタマイズ可能な情報が含まれています。 が展開されて表示されます。このモジュールを使用して、 有効期限、ポイント残高、ストアド バリュー残高。

linksModuleData

リンク モジュールには、ウェブページ、電話番号、メールアドレスへの URI が含まれる あります。ユーザー インターフェースの推奨事項は次のとおりです。 リンク モジュール:

ガイドライン	設定の例	画像例
ウェブサイトに URI を割り当てる場合は、http: 接頭辞を使用します。または、 Google マップで場所を確認できます。この接頭辞を使用すると、 リンクをクリックしてウェブサイトに移動するか、Google マップで場所を表示します。 また、この接頭辞を使用すると、リンクまたはマップのアイコンが ご確認ください。	'uri': 'http://maps.google.com/?q=google'
	'uri': 'http://developer.google.com/wallet/'
電話番号を定義する場合は、tel: プレフィックスを使用します。この プレフィックスを使用すると、消費者はリンクにタッチして番号を発信できます。この接頭辞 テキストの説明の前に電話のアイコンを作成します。 。	'uri': 'tel:6505555555'
メールアドレスを定義する場合は、mailto: 接頭辞を使用します。 このプレフィックスを使用すると、消費者がリンクをタッチしてメールを送信できます。 あります。このプレフィックスを使用すると、メールのアイコンが カード上の説明テキスト。	'uri': 'mailto:jonsmith@email.com'

見出し、ラベル、名前

見出し、ラベル、名前は語頭を大文字にして記述し、各単語が先頭を 使用します。

コンテンツ ポリシー

パスの各フィールドの内容は、 お支払いに関するコンテンツ ポリシーをご覧ください。参照しているウェブサイトのコンテンツ それらのポリシーに準拠する必要があります。

パートナー プラットフォーム データの配置

さまざまな機能を搭載したアプリやウェブサイトにユーザーが アプリのディープリンクを実装するか、 パスのクラスまたはオブジェクト内のウェブサイト linksModuleData.* プロパティ。これによりユーザーは 表示されます。このパスは、 Google ウォレットどのように表示されるかを確認するには、 カテゴリを渡す。