Jeśli tworzysz aplikację dla użytkowników z Rosji i Japonii, użyj przycisków „Zapisz w telefonie”, ponieważ Portfel Google nie jest dostępny w tych krajach. Zapoznaj się z odpowiednimi zasobami i wytycznymi. Jeśli tworzysz treści dla użytkowników spoza Rosji i Japonii, zaktualizuj swój przycisk Dodaj do Portfela Google, pobierając poniższe zasoby.
Ta sekcja dokumentacji ma na celu ułatwienie tworzenia obrazów i innych elementów interfejsu użytkownika, dzięki czemu wyglądają świetnie w aplikacji Portfel Google.
Przycisk Dodaj do Portfela Google
Przycisk Dodaj do Portfela Google jest przydatny za każdym razem, gdy prosisz użytkowników o zapisanie karty lub karty z aplikacji lub witryny w portfelu. Przycisk Dodaj do Portfela Google musi wywoływać jeden z procesów interfejsu API Portfela Google. Dzięki tym procesom można zobaczyć aplikację Portfel Google, w której użytkownicy mogą zapisać karty na urządzeniu z Androidem i na koncie Google. Tego przycisku można używać w aplikacjach, witrynach i e-mailach.
Komponenty
Przyciski Dodaj do Portfela Google są dostępne w formacie XML, SVG i PNG na Androidzie.
Pobierz zasoby – Android XML Pobierz zasoby – SVG Pobierz zasoby – PNGWszystkie przyciski Dodaj do Portfela Google wyświetlane w witrynie, aplikacji lub e-mailach muszą być zgodne z wytycznymi dotyczącymi marki opisanymi na tej stronie. Oto kilka przykładów:
- rozmiar względem innych podobnych przycisków lub elementów na stronie;
- Nie można zmieniać kształtu ani kolorów przycisków
- Pusty obszar
Zlokalizowane przyciski
Zlokalizowane przyciski Portfela Google są dostępne na wszystkich rynkach, na których można korzystać z Portfela. Jeśli tworzysz treści dla użytkowników na tych rynkach, zawsze używaj przycisków dostępnych powyżej. Nie twórz własnej wersji przycisku Dodaj do Portfela Google. Jeśli Twoja wersja przycisku nie jest dostępna na Twoim rynku, użyj angielskiej wersji przycisku.
Przyciski dodawania we Francji, w języku francuskim, francuskim, francuskim, francuskim i francuskim, francuskim, francuskim, francuskim, francuskim, francuskim, francuskim, francuskim, francuskim, francuskim, francuskim, francuski, francuski, angielski, francuski, angielski, francuski, angielski, francuski, angielski
Nazwa zlokalizowana
Nazwa usługi Portfel Google jest zlokalizowana na wybranych rynkach. Jeśli tworzysz aplikacje dla użytkowników w tych krajach, zawsze używaj przetłumaczonej nazwy poniżej w przypadku stron internetowych, e-maili i druków. Nie twórz własnej przetłumaczonej wersji „Portfela Google”. Jeśli Twojego rynku nie ma na liście, użyj „Portfela Google” w języku angielskim.
| Kraj | Nazwa |
|---|---|
| Białoruś | Котелек w Google |
| Brazylia | Carteira do Google |
| Chile | Wyszukiwarka Google |
| Czechy | Penzeženka Google |
| Grecja | |
| Hongkong | Google 錢包 |
| Litwa | Google Pinigině |
| Polska | Portfel Google |
| Portugalia | Carteira da Google |
| Rumunia | Portofel Google |
| Słowacja | |
| Tajwan | Google 錢包 |
| Turcja | Google Turcja |
| Zjednoczone Emiraty Arabskie | |
| Ukraina | Google Юаманець |
|
Stany Zjednoczone (hiszpański)
*Użyj tej nazwy w Stanach Zjednoczonych, jeśli Twój interfejs jest po hiszpańsku |
Wyszukiwarka Google |
Rozmiar
Dostosuj wysokość i szerokość przycisku Dodaj do Portfela Google, by pasował do układu graficznego. Jeśli na stronie znajdują się inne przyciski, przycisk Dodaj do Portfela Google musi mieć taki sam lub większy rozmiar. Przycisk Dodaj do Portfela Google nie może być mniejszy niż inne przyciski.
Niech nic
Przyciski Dodaj do Portfela Google są dostępne w dwóch wersjach: głównej i skondensowanej. Przycisk Dodaj do Portfela Google jest tylko czarny. Przetłumaczone wersje przycisku są dostępne. Nie twórz przycisków z własnym tekstem.
| Główna | Wąski |
|---|---|
|
|
| Korzystaj z przycisku głównego na białym i jasnym tle. | Użyj tekstu skondensowanego, jeśli nie ma wystarczająco dużo miejsca na przestrzeń podstawową lub pełną szerokość. |
Pusty obszar
Zawsze zostawiaj pusty obszar o minimalnej szerokości 8 dp wokół przycisku Dodaj do Portfela Google. Zadbaj o to, aby nie nachodziły na niego grafika ani tekst.
Minimalna wysokość
Wysokość wszystkich przycisków Dodaj do Portfela Google musi wynosić co najmniej 48 dp.
Zalecenia i ograniczenia
| Zalecane działania | Nie |
|---|---|
| Tak: korzystaj tylko z przycisków Dodaj do Portfela Google dostarczonych przez Google. | Nie: utwórz własne przyciski Dodaj do Portfela Google lub w inny sposób zmień czcionkę, kolor, promień przycisku lub dopełnienie przycisku. |
| Tak: korzystaj z tego samego stylu przycisków w całej witrynie. | Nie: przyciski Dodaj do Portfela Google muszą być mniejsze niż inne przyciski. |
| Tak: zadbaj o to, by rozmiar przycisków Dodaj do Portfela Google był taki sam jak rozmiar innych przycisków lub większy. | Nie: zmień kolor przycisku. |
| Tak: zmieniając rozmiar przycisku Dodaj do Portfela Google, zachowaj proporcje. | Nie:skaluj przycisku. |
| Tak: korzystaj z udostępnionej zlokalizowanej wersji przycisków. | Nie: utwórz własną zlokalizowaną wersję przycisku. |
Sprawdzone metody umieszczania przycisku
Wyświetlaj przycisk Dodaj do Portfela Google na ekranach aplikacji, stron internetowych i w e-mailach. Projektuj interfejs użytkownika zgodnie z tymi sprawdzonymi metodami.
Programy lojalnościowe, karty podarunkowe i oferty
Wyświetlaj przycisk Dodaj do Portfela Google na ekranach potwierdzenia. Możesz też umieścić przycisk w swojej witrynie lub aplikacji albo umieścić go w odpowiednich e-mailach.
Używanie nazwy usługi Portfel Google w tekście
Możesz wysłać użytkownikowi wiadomość tekstową, by poinformować go, że karta lojalnościowa została zapisana na jego urządzeniu.
Zapisuj wielkie litery &"&&tt;W"
W odniesieniu do Portfela Google zawsze używaj wielkich i małych wielkich liter &wielkich liter, a następnie małych liter. Nie używaj wielkich liter w Portfelu Google, chyba że będzie to zgodne ze stylem typowym w interfejsie użytkownika.
Nie skracaj Portfela Google
Zawsze zapisuj słowa „Google” i „Portfel”."
Dopasuj styl do interfejsu
Ustaw zwykły czcionka i styl typograficzny w Portfelu Google jako pozostałą część tekstu w interfejsie użytkownika. Nie odzwierciedlają stylu typograficznego Google.
Zawsze używaj przetłumaczonej wersji &Portfela
Zawsze zapisuj &Portfel Google w załączonej kopii.
Specjalista ds. projektowania
Aby zmienić wysokość i szerokość przycisków Dodaj do Portfela Google, użyj pól height i size tagu HTML g:savetoandroidpay. Skorzystaj ze specyfikacji textsize=large, by znacznie zwiększyć rozmiar tekstu i przycisków w implementacjach mobilnych lub ze specjalnymi wymaganiami interfejsu.
Użyj theme, aby ustawić kolor przycisków. W tabeli poniżej pokazujemy, jak te ustawienia wpływają na przycisk Dodaj do Portfela Google.
Logo
Portfel Google maskuje logo do kształtu koła.
Wytyczne dotyczące obrazu logo
Poniżej znajdziesz zalecenia dotyczące obrazów logo w interfejsie:
| Wytyczne | Description |
|---|---|
| Preferowany typ pliku | PNG |
| Minimalny rozmiar | 660 x 660 pikseli |
| Współczynnik proporcji obrazu | 1:1 |
| Współczynnik proporcji grafiki | 1:1 |
| Rzeczywisty rozmiar w pikselach | Skaluj do rozmiaru urządzenia |
| Maska okrągłe logo |
Twoje logo jest maskowane, aby dopasować je do okrągłego wzoru. Logo musi mieścić się w bezpiecznym obszarze. Logo nie jest maskowane. Pozostaw logo w kwadratowym polu z pełnym spadem. Logo musi mieć 15-procentowy margines, aby po zamaskowaniu nie zostało przycięte. 
|
Kolor tła karty
Kolor tła możesz ustawić w polu hexBackgroundColor. Jeśli nie ustawisz wartości, algorytm przeanalizuje logo, znajdzie dominujący kolor i użyje go jako koloru tła.
Banery powitalne
Pole class.heroImage wyświetla się jako baner o pełnej szerokości w części głównej karty.
Wytyczne dotyczące banera powitalnego
Oto lista rekomendacji dotyczących banera powitalnego w interfejsie:
| Wytyczne | Description |
|---|---|
| Preferowany typ pliku | PNG |
| Zalecany rozmiar |
1032 x 336 pikseli Używaj szerokich, prostokątnych obrazów. Najlepsze efekty daje obraz na kolorowym tle. |
| Współczynnik proporcji | 3:1 lub szersze |
| Rozmiar wyświetlacza |
Pełna szerokość karty i proporcjonalna wysokość. 
|
Obrazy o pełnej szerokości
Pole *.imageModulesData.mainImage w klasie lub obiekcie wyświetla się jako obraz o pełnej szerokości na karcie.
Wytyczne dotyczące zdjęć o pełnej szerokości
Poniżej znajdziesz zalecenia dotyczące obrazów o pełnej szerokości w interfejsie:
| Wytyczne | Description |
|---|---|
| Preferowany typ pliku | PNG |
| Minimalny rozmiar |
Szerokość 1860 pikseli, zmienna wysokość Używaj szerokich, prostokątnych obrazów. Najlepsze efekty daje obraz na kolorowym tle. |
| Współczynnik proporcji | Zmienna |
| Rozmiar wyświetlacza |
Pełna szerokość szablonu i proporcjonalna wysokość.
|
| Użyj tego samego schematu kolorystycznego, co w przypadku logo. |
Obrazy z kodem kreskowym
Niektóre kategorie umożliwiają wyświetlanie obrazów nad kodem kreskowym i pod nim.
obrazy nad kodem kreskowym;
Poniżej znajdziesz zalecenia dotyczące interfejsu użytkownika w przypadku obrazów nad kodem kreskowym:
| Wytyczne | Opis |
|---|---|
| Preferowany typ pliku | PNG |
| Maksymalna wysokość |
20 dp (przy współczynniku proporcji) Zalecany rozmiar to 80 pikseli (wysokość) i 80–780 pikseli (szerokość), jeśli są 2 obrazy. Dzięki temu mogą one znajdować się obok siebie. Jeśli jeden obraz to kwadrat, a drugi prostokąt, obraz musi mieć rozmiar 80 x 80 i 780 x 80 pikseli. |
| Współczynnik proporcji |
Bez ograniczeń. Maksymalna wysokość i szerokość jednego obrazu to 20:1. Jeśli chcesz wyświetlić tylko jeden obraz nad kodem kreskowym, użyj pełnej szerokości (bez dopełnienia). Wymiary obrazu muszą wynosić 1600 x 80 pikseli. |
| Maksymalny rozmiar wyświetlanego obrazu (pojedynczy obraz) | 20 dp (wysoki) i 400 dp (szerokość) |
Obraz pod kodem kreskowym
Poniżej znajdziesz zalecenia dotyczące obrazu pod kodem kreskowym w interfejsie:
| Wytyczne | Opis |
|---|---|
| Preferowany typ pliku | PNG |
| Maksymalna wysokość |
20 dp (przy współczynniku proporcji) Zalecany rozmiar to 80 pikseli (wysokość) i 80–1600 pikseli (szerokość). Kwadratowy – 80 x 80 pikseli. Prostokątny, 1600 × 80 pikseli. |
| Nieograniczony współczynnik proporcji. Aby uzyskać maksymalną wysokość i szerokość 20 dp, użyj współczynnika proporcji 20:1. | Jeśli chcesz użyć obrazu o pełnej szerokości (bez dopełnienia), musi on mieć rozmiar 1600 x 80 pikseli. |
| Maksymalny rozmiar wyświetlacza to 20 dp (wysokość) i 400 dp (szerokość). |
Moduły
Moduł reprezentuje grupę pól w określonej sekcji szablonu. Poniższa tabela zawiera wytyczne dotyczące liczby modułów, które musisz uwzględnić w klasach i obiektach, aby Twoje karty były wyświetlane prawidłowo w aplikacji Portfel Google.
| Wytyczne | Description |
|---|---|
imageModulesData
|
Użyj tylko jednego typu imageModulesData w klasie lub obiektach, które tworzysz.
|
infoModuleData
|
Użyj maksymalnie dwóch
Właściwość |
linksModuleData
|
Użyj maksymalnie czterech identyfikatorów URI
W swojej klasie możesz mieć 2 identyfikatory URI: |
textModulesData
|
Użyj maksymalnie 2 pól
W swojej klasie możesz mieć jeden identyfikator URI |
infoModuleData
InfoModuleData zawiera informacje o użytkowniku i informacje, które można dostosować. Pojawi się w widoku rozwiniętym. Za pomocą tego modułu możesz przechowywać takie informacje jak daty ważności, salda drugiego punktu czy salda środków przedpłaconych.
linksModuleData
Moduł linków zawiera identyfikatory URI stron internetowych, numerów telefonów i adresów e-mail. Poniżej znajdziesz zalecenia dotyczące modułu linków w interfejsie:
| Wytyczne | Przykładowe ustawienie | Przykładowy obraz |
|---|---|---|
Użyj prefiksu http:, gdy przypisujesz identyfikator URI witryny lub lokalizacji w Mapach Google. Dzięki temu użytkownik może kliknąć link i otworzyć witrynę lub wyświetlić lokalizację w Mapach Google.
Prefiks powoduje też wyświetlenie ikony linku lub mapy przed opisem na karcie.
|
'uri': 'http://maps.google.com/?q=google'
|
|
'uri': 'http://developer.google.com/wallet/'
|
|
|
Aby zdefiniować numer telefonu, użyj prefiksu tel:. Dzięki temu użytkownik może kliknąć link, aby wybrać numer. Prefiks powoduje też utworzenie ikony telefonu przed opisem tekstowym na karcie.
|
'uri': 'tel:6505555555'
|
|
Aby zdefiniować adres e-mail, użyj prefiksu mailto:.
Dzięki temu użytkownik może kliknąć link i wysłać e-maila na adres. Prefiks tworzy też ikonę e-maila przed opisem tekstowym na karcie.
|
'uri': 'mailto:jonsmith@email.com'
|
|
Nagłówki, etykiety i nazwy
W nagłówkach, nazwach i nazwach używaj wielkich liter, tak aby każde słowo zaczynało się wielką literą.
Zasady dotyczące treści
Zawartość każdego pola na karcie musi być zgodna z polityką treści Google Payments. Zawartość witryn, do których odwołuje się klasa, musi być również zgodna z tymi zasadami.
Umieszczanie danych na platformie partnera
Aby mieć pewność, że użytkownicy uzyskają dostęp do Twojej rozbudowanej aplikacji lub witryny dotyczącej karty, uwzględnij precyzyjny link aplikacji lub witrynę we właściwości linksModuleData.* klasy lub obiektu karty. Dzięki temu użytkownik będzie mógł otworzyć Twoją platformę z karty w Portfelu Google. Aby sprawdzić, jak renderuje się zawartość, przejdź do sekcji projektu w kategoriach kart.