如果 Google 錢包尚未在這些國家/地區提供服務，請使用 [儲存至手機] 按鈕。請參閱 相關素材資源和規範。如果您要為俄羅斯境外的使用者開發應用程式，請下載下列資產，更新「新增至 Google 錢包」按鈕。
本節旨在協助您建立圖片和其他使用者介面元素，以便在 Google 錢包應用程式中呈現良好效果。
資產
「新增至 Google 錢包」按鈕
每當使用者藉由「新增至 Google 錢包」按鈕，將應用程式或網站中的票證或卡片儲存至錢包時，系統會使用「新增至 Google 錢包」按鈕。「新增至 Google 錢包」按鈕必須呼叫其中一個 Google Wallet API 流程。這些流程會顯示 Google 錢包應用程式，使用者可以按照操作說明將票證儲存到 Android 裝置和 Google 帳戶。這個按鈕可用於應用程式、網站或電子郵件。
「新增至 Google 錢包」按鈕支援 Android XML、SVG 和 PNG 格式。
下載素材資源 - Android XML 下載素材資源 - SVG 下載素材資源 - PNG在 Google 錢包中查看按鈕
「在 Google 錢包中查看」按鈕的用途，是讓使用者透過深層連結前往錢包，查看先前儲存的票證或卡片。您可以在應用程式、網站或電子郵件中使用這個按鈕。
「在 Google 錢包中查看」按鈕支援 SVG 和 PNG 格式。
下載素材資源 - SVG 下載素材資源 - PNG網站、應用程式或電子郵件通訊中顯示的所有按鈕，都必須符合本頁列出的品牌規範。這些規範的例子包括但不限於：
- 依據其他類似的按鈕或頁面元素設定按鈕大小
- 不得變更按鈕的形狀和顏色
- 周圍留空
本地化按鈕
只要是可以使用 Google 錢包的市場，都能使用本地化的 Google 錢包按鈕。如果您要為這些市場的使用者開發應用程式，請一律使用上方連結的按鈕。請不要自行建立版本按鈕。如果您所在的市場沒有本地化版本的按鈕，請使用英文版按鈕。
新增至 Google 錢包按鈕支援下列語言：阿爾巴尼亞文、阿拉伯文、亞美尼亞文、亞塞拜然文、西班牙文、印尼文、菲律賓文、印尼文、烏克蘭文、西班牙文、加泰文、中文 (香港)、中文 (繁體)、克羅埃西亞文、捷克、丹麥文、荷蘭文、英文 (印度、英國、新加坡、南非)
本地化名稱
為求明確起見，Google 錢包產品名稱會在特定市場中本地化。如果您為這些國家/地區的使用者開發應用程式，請一律使用下方的本地化名稱進行網頁、電子郵件和列印。請勿自行建立本地化版本的「Google 錢包」。如果下方未列出您所在的市場，請使用英文的「Google 錢包」。
| 國家/地區 | 名稱 |
|---|---|
| 白俄羅斯 | Google Кошелек |
| 巴西 | Carteira do Google |
| 智利 | Billetera de Google |
| 捷克 | 潘婷卡 Google |
| 希臘 | Πホ🇪?🇸? 其中產品或服務 Google |
| 香港 | Google AP |
| 立陶宛 | Google Pinigin 在 |
| 波蘭 | Portfel Google |
| 葡萄牙 | Carteira da Google |
| 羅馬尼亞 | Portofel Google |
| 斯洛伐克 | Google 新聞 |
| 臺灣 | Google AP |
| 土耳其 | Google 庫茲丹 |
| 阿拉伯聯合大公國 | ممحف لة Google |
| 烏克蘭 | Google 達尼泊爾王國 |
|
美國 (西班牙文)
*如果您的使用者介面是西班牙文，請使用美國的名稱 |
Billetera de Google |
大小
依據版面配置調整「新增至 Google 錢包」按鈕的高度和寬度。如果頁面上還有其他按鈕，「新增至 Google 錢包」按鈕的大小必須大於或等於「新增至 Google 錢包」。請勿將「新增至 Google 錢包」按鈕小於其他按鈕。
樣式
「新增至 Google 錢包」按鈕有兩種樣式：主要樣式和精簡版本。「新增至 Google 錢包」按鈕只有黑色提供。提供的按鈕經過本地化。請勿以自行翻譯的文字建立按鈕。
| 主要 | Condensed |
|---|---|
|
|
| 在白色和淺色背景上使用主要按鈕。 | 如果主要或完整寬度空間不足，則使用壓縮按鈕。 |
周圍留空
「新增至 Google 錢包」按鈕周圍一律應至少留空 8 dp。不得有圖像或文字出現在周圍留空的區域。
高度下限
所有「新增至 Google 錢包」按鈕的高度下限均為 48 dp。
建議做法
| 建議做法 | 不建議的做法 |
|---|---|
| 正確：一律使用 Google 提供的「新增至 Google 錢包」按鈕。 | 錯誤：自行建立「新增至 Google 錢包」按鈕，或是以任何方式變更按鈕內的字型、顏色、按鈕半徑或邊框間距。 |
| 正確：在網站中一律使用相同的按鈕樣式， | 錯誤：將「新增至 Google 錢包」按鈕小於其他按鈕。 |
| 正確：確保「新增至 Google 錢包」按鈕的大小大於或等於其他按鈕。 | 錯誤：調整按鈕顏色。 |
| 正確：調整「新增至 Google 錢包」按鈕的大小時，保持按鈕比例相同。 | 錯誤：任意縮放按鈕。 |
| 正確：使用提供的本地化版本按鈕。 | 錯誤做法：自行建立本地化按鈕版本。 |
按鈕位置的最佳做法
在應用程式的確認畫面、網頁或電子郵件中顯示「新增至 Google 錢包」按鈕。請參閱下列最佳做法來引導 UI 設計。
大眾運輸票證
在應用程式的確認畫面、網頁或電子郵件中顯示「新增至 Google 錢包」按鈕。建議您將「新增至 Google 錢包」按鈕放在應用程式或網站中，使用者存取大眾運輸票證。
在文字中使用 Google 錢包產品名稱
您可以使用文字，向使用者說明大眾運輸票證已儲存至裝置。
「G」和「W」字母大寫
提及 Google 錢包時，請一律使用大寫字母「G」與小寫「W」，後接小寫英文字母。除非必須配合 UI 字體樣式，否則請勿使用「Google 錢包」全名大寫。
不得縮寫 Google 錢包
「Google」與「錢包」字樣一律必須明確填寫。
配合 UI 的樣式
設定「Google 錢包」的字型與字體樣式，與 UI 中其餘文字相同。不要模仿 Google 的字體樣式。
一律使用本地化版本的「Google 錢包」
請務必在提供的本地化文案中註明「Google 錢包」。
設計
使用 g:savetoandroidpay HTML 標記的 height 和 size 欄位，修改「新增至 Google 錢包」按鈕的高度和寬度。使用 textsize=large 規格，即可針對行動裝置或有特殊 UI 要求的情況，大幅增加文字和按鈕的大小。
請使用 theme 設定按鈕的顏色。下表說明這些設定對「新增至 Google 錢包」按鈕的影響。
標誌
標誌圖片規範
Google 錢包會將您的標誌套用成圓形遮罩。
以下列出有關標誌圖片的使用者介面建議：| 規範 | 說明 |
|---|---|
| 偏好的檔案類型 | PNG |
| 最小尺寸 | 660 x 660 像素 |
| 圖片顯示比例 | 1:1 |
| 圖片顯示比例 | 1:1 |
| 實際像素大小 | 配合裝置大小調整 |
| 標誌圓形遮罩 |
標誌會套用遮罩，以符合圓形設計。請確認您的標誌位於安全區域範圍內。請勿預先為標誌套用遮罩，將標誌保留在含有滿版背景顏色的正方形中。 標誌的邊界必須達 15%，以免套用遮罩時被截斷。 
|
Google 錢包會將您的標誌套用成圓形遮罩。
寬標誌圖片規範
活動票券、登機證、QR code 大眾運輸票證、會員卡、優惠、禮物卡、一般票證和一般私人證件都支援寬版標誌圖片。以下列出有關寬標誌圖片的使用者介面建議：
| 規範 | 說明 |
|---|---|
| 偏好的檔案類型 |
PNG 請使用有背景顏色的圖片以獲得最佳效果 (建議使用與票證背景顏色相同的顏色) |
| 建議大小 | 1280 x 400 像素 |
| 最小尺寸 | 高度為 400 像素，寬度為比例 (建議顯示比例區段中有更多指引)
使用寬的矩形圖片。 |
| 建議長寬比 |
如果圖片未設為建議的長寬比，系統會將圖片調整大小，以符合標頭空間的長寬比。下圖詳細說明圖片素材資源如何根據顯示比例調整大小。 
|
卡片背景顏色
您可以使用 hexBackgroundColor 欄位設定背景顏色。如未設定這個值，演算法會分析標誌、找出主色，並將該值用於背景顏色。
主角圖片
class.heroImage 欄位會在資訊卡內文中顯示完整寬度的橫幅。
主頁橫幅規範
以下列出有關主頁橫幅的使用者介面建議：
| 規範 | 說明 |
|---|---|
| 偏好的檔案類型 | PNG |
| 建議尺寸 |
1032x336 px 使用寬的矩形圖片。 為獲得最佳效果，請使用彩色背景。 |
| 顯示比例 | 3:1 以上 |
| 顯示大小 |
資訊卡的完整寬度與比例高度。 
|
完整寬度圖片
類別或物件的 *.imageModulesData.mainImage 欄位會在票證中以完整寬度圖片顯示。
完整寬度圖片規範
以下列出有關完整寬度圖片的使用者介面建議：
| 規範 | 說明 |
|---|---|
| 偏好的檔案類型 | PNG |
| 最小尺寸 |
寬度為 1860 像素，高度可變。 使用寬的矩形圖片。 為獲得最佳效果，請使用彩色背景。 |
| 顯示比例 | 變數 |
| 顯示大小 |
範本的完整寬度和比例高度。
|
| 請使用與標誌相同的色彩配置。 |
條碼圖片
某些類別允許在條碼上方和下方顯示圖片。
在條碼上方顯示的圖片
以下列出有關條碼上方圖片的使用者介面建議：
| 指南 | 說明 |
|---|---|
| 偏好的檔案類型 | PNG |
| 高度上限 |
20 dp (採用最大長寬比) 如有兩張圖片，建議尺寸的高度為 80 像素，寬度為 80 至 780 像素。以便並排顯示。 如果其中一張圖片是正方形，另一個則是矩形，則圖片大小應為 80x80 和 780x80 像素。 |
| 顯示比例 |
不受限制。如要達到單一圖片的高度與寬度上限 20dp，請使用 20:1 長寬比。 如果您只想在條碼上方顯示一張圖片，請使用完整寬度 (不含邊框間距)。圖片必須為 1600x80 像素。 |
| 最大顯示尺寸 (單一圖片) | 高度 20 dp，寬度 400 dp |
在條碼下方顯示的圖片
以下列出條碼下方圖片的相關使用者介面建議：
| 指南 | 說明 |
|---|---|
| 偏好的檔案類型 | PNG |
| 高度上限 |
20 dp (採用最大長寬比) 建議尺寸的高度為 80 像素，寬度為 80 至 1600 像素。 如果是正方形，則為 80x80 像素。 如果是矩形，1600x80 像素。 |
| 長寬比不受限制。如要達到高度與寬度上限 20dp，請使用 20:1 長寬比。 | 如要以完整寬度圖片 (不含邊框間距)，圖片必須為 1600x80 像素。 |
| 顯示大小上限為高度 20dp，寬度為 400 dp。 |
模組
模組代表範本的特定區段內的一組欄位。下表規範了類別和物件中必須加入的模組數量規範，以確保卡片可在 Google 錢包應用程式中正確顯示。
| 規範 | 說明 |
|---|---|
imageModulesData
|
在您的類別或您建立的物件中只能使用一個 imageModulesData。 |
infoModuleData
|
在您的類別或您建立的物件中使用最多兩個
|
linksModuleData
|
在您的類別或您建立的物件中共使用最多四個
您的類別可能會有兩個 |
textModulesData
|
在類別和您建立的物件之間使用最多兩個
在類別中，您可能有一個用於定義方案詳細資料的 |
infoModuleData
InfoModuleData 包含會員和可自訂的資訊，會在展開的檢視畫面中顯示。請使用這個模組儲存到期日、第二點數餘額或儲值餘額等資訊。
linksModuleData
連結模組包含網頁、電話號碼和電子郵件地址的 URI。以下列出有關連結模組的使用者介面建議：
| 指南 | 範例設定 | 範例圖片 |
|---|---|---|
為網站或 Google 地圖中的地點指派 URI 時，請使用 http: 前置字串。這個前置字串可讓消費者在輕觸連結後前往網站，或在 Google 地圖中查看該地點。此外，加上這個前置字串後，資訊卡說明的前方還會出現連結或地圖的圖示。 |
'uri': 'http://maps.google.com/?q=google'
|
|
'uri': 'http://developer.google.com/wallet/'
|
|
|
定義電話號碼時，請在前方加上 tel:，加上這個前置字串後，消費者就能輕觸連結來撥打號碼。這個前置字串也會在卡片的文字說明前方建立電話圖示。 |
'uri': 'tel:6505555555'
|
|
定義電子郵件地址時，請在前方加上 mailto:。加上這個前置字串後，消費者只要輕觸連結就能傳送電子郵件至該地址。這個前置字串也會在資訊卡的文字說明的前方建立電子郵件圖示。 |
'uri': 'mailto:jonsmith@email.com'
|
|
標題、標籤和名稱
請以首字母大寫格式書寫標題、標籤和名稱，讓每個字詞的開頭都是大寫字母。
內容政策
票證中每個欄位的內容都應符合 Payments 內容政策。您在類別中參照的網站內容也必須符合這些政策。
合作夥伴平台資料位置
為確保使用者能前往與票證相關的多功能應用程式或網站，請務必將應用程式的深層連結或網站整合至票證的類別或物件 linksModuleData.* 屬性。讓使用者透過 Google 錢包中顯示的票證，前往你的平台。如要查看算繪方式，請參閱票證類別的設計部分。