Pedoman brand

Panduan ini membantu Anda menerapkan Google Pay dalam aplikasi Anda.

Tombol pembayaran Google Pay

Tombol pembayaran Google Pay memanggil Google Pay API. Google Pay API menampilkan lembar pembayaran tempat pengguna dapat memilih metode pembayaran mereka.

Aset

Google Pay menyediakan PayButton API yang memungkinkan Anda menyesuaikan tema, bentuk, dan kecekungan sudut tombol pembayaran Google Pay agar sesuai dengan desain UI Anda.

Saat menggunakan PayButton API, Anda akan mendapatkan:

  • Kepatuhan Merek: Integrasikan tombol pembayaran Google Pay dengan lancar yang secara otomatis mematuhi pedoman branding Google Pay terbaru sekaligus menawarkan opsi yang dapat disesuaikan agar sesuai dengan desain UI Anda dengan sedikit upaya.
  • Bentuk yang Dapat Disesuaikan: Sesuaikan kebulatan sudut tombol agar sesuai dengan estetika desain yang ada.
  • Pengalaman yang Dilokalkan: Teks tombol otomatis diterjemahkan ke bahasa perangkat pengguna, sehingga meningkatkan aksesibilitas.
  • Dipersonalisasi untuk Pengguna: Membantu pengguna menemukan metode pembayaran yang tersedia di dompet Google Pay mereka untuk proses checkout yang lebih cepat.

Jika metode praktis ini atau bahasa yang didukung tidak sesuai dengan kebutuhan Anda, hubungi kami.

Gaya

Tombol pembayaran Google Pay tersedia dalam dua variasi: gelap dan terang. Setiap variasi dilengkapi dengan dan tanpa teks "Beli dengan". Tombol pembayaran dengan versi teks "Beli dengan" yang dilokalkan disediakan, tetapi merek Google Pay tidak pernah diterjemahkan. Jangan membuat tombol dengan teks yang dilokalkan sendiri.

Jenis Tombol Gelap Cahaya
buku Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
buy Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
checkout Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
berdonasi Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
pesanan Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
pay Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
polos Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang
subscribe Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang

Gunakan kata-kata jenis tombol yang paling sesuai dengan halaman checkout Anda.

Gunakan tombol gelap pada latar belakang terang untuk memberikan kontras.

Gunakan tombol terang dengan latar belakang gelap atau berwarna.

Personalisasi

Jika pengguna memiliki kartu yang memenuhi syarat di akun Google Pay mereka, tombol pembayaran "Beli" dan "Bayar" akan menampilkan jaringan kartu dan empat digit terakhir nomor kartu. Jaringan kartu akan ditampilkan di posisi yang sama dengan teks "Beli dengan" atau "Bayar dengan".

Jenis Tombol Gelap Cahaya
membeli dan membayar Tombol pembayaran Google Pay gelap Tombol pembayaran Google Pay terang

Gunakan jenis tombol beli atau bayar untuk mengaktifkan personalisasi.

Gunakan tombol gelap pada latar belakang terang untuk memberikan kontras.

Gunakan tombol terang dengan latar belakang gelap atau berwarna.

Mengosongkan ruang penyimpanan

Selalu pertahankan ruang kosong minimum 8 dp di semua sisi tombol pembayaran. Pastikan ruang kosong tidak pernah terganggu oleh grafis atau teks. Ini adalah pedoman desain umum, bukan spesifikasi PayButton API.

Contoh ruang kosong tombol pembayaran Google Pay untuk Android

Lebar minimum

Tombol Google Pay harus memiliki lebar minimum 90 dp. Semua tombol pembayaran "Beli dengan Google Pay" harus memiliki lebar minimum 152 dp.

Ilustrasi lebar minimum tombol pembayaran Google Pay

Anjuran dan Larangan

Anjuran Larangan
  • Hanya gunakan tombol Google Pay yang disediakan oleh Google.
  • Gunakan tombol Google Pay untuk memulai alur pembayaran.
  • Gunakan gaya tombol yang sama di seluruh situs Anda.
  • Pastikan ukuran tombol Google Pay tetap sama dengan atau lebih besar daripada tombol lainnya.
  • Pastikan Anda memilih warna tombol yang kontras dengan latar belakang.
  • Membuat tombol Google Pay Anda sendiri atau mengubah font, warna, radius tombol, atau padding dalam tombol dengan cara apa pun.
  • Gunakan tombol pembayaran Google Pay untuk memulai tindakan apa pun selain alur pembayaran.
  • Beralih di antara variasi atau versi warna dengan atau tanpa teks.
  • Buat tombol Google Pay lebih kecil daripada tombol lainnya.
  • Gunakan warna tombol yang mirip dengan latar belakang. Misalnya, jangan gunakan tombol terang pada latar belakang terang.

Tanda Google Pay

Gunakan hanya tanda Google Pay yang disediakan di bawah saat Anda menampilkan Google Pay sebagai opsi pembayaran dalam alur pembayaran.

Aset

Download tanda Google Pay sebagai file SVG:

Download Aset

Tandai

Gunakan tanda Google Pay berikut saat Anda menampilkan Google Pay sebagai opsi pembayaran:

Tanda Google Pay

Tampilkan "Google Pay" dalam teks di samping tanda jika Anda melakukannya untuk merek lain. Jangan mengubah warna atau ketebalan garis batas merek atau mengubah merek dengan cara apa pun. Hanya gunakan tanda yang disediakan oleh Google.

Mengosongkan ruang penyimpanan

Selalu pertahankan setidaknya setengah (0,5x) tinggi G super di semua sisi tanda penerimaan Google Pay. Pastikan ruang kosong sama dengan identitas merek lain yang Anda tampilkan.

Contoh ruang kosong merek Google Pay

Ukuran

Sesuaikan tinggi agar sesuai dengan identitas merek lain yang ditampilkan dalam alur pembayaran Anda. Jangan membuat tanda Google Pay lebih kecil daripada identitas merek lainnya.

Gunakan tanda Google Pay untuk merepresentasikan Google Pay sebagai opsi pembayaran, dan terus gunakan di seluruh alur pembelian Anda.

Anjuran dan Larangan

Anjuran Larangan
  • Hanya gunakan tanda Google Pay yang disediakan oleh Google.
  • Gunakan tanda Google Pay untuk menunjukkan Google Pay sebagai opsi pembayaran dalam alur pembayaran.
  • Membuat tanda Anda sendiri atau mengubah tanda Google Pay dengan cara apa pun.
  • Terjemahkan kata "Bayar".
  • Menampilkan tanda Google Pay dalam ukuran yang berbeda atau lebih kecil daripada opsi pembayaran lainnya.

Google Pay dalam teks

Anda dapat menggunakan teks untuk menunjukkan Google Pay sebagai opsi pembayaran dan mempromosikan Google Pay dalam komunikasi pemasaran Anda.

Gunakan huruf kapital untuk huruf "G" dan "P"

Selalu gunakan "G" huruf besar dan "P" huruf besar yang diikuti dengan huruf kecil. Jangan menggunakan huruf kapital untuk nama lengkap "GOOGLE PAY", kecuali jika untuk menyesuaikan gaya tipografi di UI Anda. Jangan pernah menggunakan "GOOGLE PAY" huruf besar dalam komunikasi pemasaran Anda.

Jangan menyingkat Google Pay

Selalu tulis kata "Google" dan "Pay".

Mencocokkan gaya di UI Anda

Tetapkan "Google Pay" dalam font dan gaya tipografi yang sama dengan teks lainnya di UI Anda. Jangan meniru gaya tipografi Google.

Jangan terjemahkan Google Pay

Selalu tulis "Google Pay" dalam bahasa Inggris. Jangan terjemahkan ke bahasa lain.

Gunakan simbol merek dagang saat "Google Pay" pertama kali muncul dalam komunikasi pemasaran

Saat Anda menggunakan "Google Pay" dalam komunikasi pemasaran, tunjukkan simbol merek dagang, ™, pada kemunculan pertama atau yang paling menonjol. Jangan gunakan simbol merek dagang untuk menunjukkan Google Pay sebagai opsi pembayaran di UI Anda.

Jika logo untuk opsi pembayaran lain tidak ditampilkan, tampilkan "Google Pay" dengan teks.

Tetapkan "Google Pay" dalam font dan gaya tipografi yang sama dengan teks lainnya di UI Anda.

Saat Anda menampilkan informasi pembayaran di halaman konfirmasi dan tanda terima email, pastikan Anda menunjukkan bahwa pelanggan telah membayar dengan Google Pay.

Praktik terbaik Google Pay

Maksimalkan konversi Anda dengan alur checkout dan lembar pembayaran yang memungkinkan pelanggan meninjau informasi pembayaran mereka dengan cepat dan mudah, serta mengonfirmasi pembelian mereka.

Berikut adalah praktik terbaiknya:

Menjadikan Google Pay sebagai opsi pembayaran utama

Jika memungkinkan, tampilkan tombol Google Pay secara jelas, dan pertimbangkan untuk menjadikannya opsi pembayaran default atau satu-satunya.

Memungkinkan pelanggan melakukan pembelian tanpa akun

Pembuatan akun memperlambat proses checkout dan dapat menyebabkan keranjang ditinggalkan. Gunakan Google Pay untuk mengaktifkan checkout tamu yang lebih cepat. Jika Anda ingin pelanggan membuat akun, izinkan mereka melakukannya setelah menyelesaikan pembelian.

Menggunakan Google Pay untuk memulai pembayaran saat checkout keranjang

Tombol Google Pay akan memunculkan halaman pembayaran. Di halaman pembayaran, pelanggan hanya dapat memilih dan mengonfirmasi satu metode pembayaran. Pastikan Anda mendapatkan semua informasi lain yang diperlukan sebelum memberi pelanggan opsi untuk memilih tombol Google Pay. Informasi tersebut dapat mencakup:

  • Ukuran, warna, dan jumlah item
  • Pesan hadiah yang ditambahkan, jika ada
  • Kode promo, jika ada
  • Kecepatan pengiriman pilihan
  • Tujuan untuk setiap item

Jika pelanggan tidak memberikan informasi yang diperlukan, berikan masukan real-time untuk memberi tahu mereka informasi yang belum diberikan sebelum Anda menampilkan halaman pembayaran.

Tambahkan tombol Google Pay ke halaman detail produk selain checkout keranjang

Untuk mempercepat checkout satu item, izinkan pelanggan melakukan pembelian satu per satu langsung dari halaman detail produk Anda. Jika pelanggan memilih opsi ini, pastikan untuk mengecualikan item lain yang ada di keranjang belanjanya, karena halaman pembayaran hanya memungkinkan mereka mengonfirmasi informasi pembayaran dan pengiriman.

Menyertakan Google Pay di halaman konfirmasi dan tanda terima

Saat Anda menampilkan informasi pembayaran di halaman konfirmasi dan tanda terima email, pastikan Anda menunjukkan bahwa pelanggan telah membayar dengan Google Pay dan pastikan Google Pay ditampilkan secara konsisten dengan cara metode pembayaran lain ditampilkan. Jangan pernah menampilkan nomor rekening lengkap, tanggal habis masa berlaku, atau detail metode pembayaran lainnya kepada pengguna. Selalu gunakan teks deskriptif yang ditampilkan oleh Google Pay API untuk mengidentifikasi metode pembayaran.

Berikut beberapa contohnya:

  • "Network •••• 1234 dengan Google Pay"
  • "Network •••• 1234 (Google Pay)"
  • "Google Pay (Jaringan •••• 1234)"
  • "Paypal abc...d@gmail.com dengan Google Pay"
  • "Metode pembayaran: Google Pay"
  • "Dibayar dengan Google Pay"

Menyatukan semuanya

Screenshot integrasi yang telah selesai akan terlihat seperti gambar berikut. Integrasi ini juga mencakup langkah Pemilihan item/Pra-pembelian, langkah Transaksi, langkah Pemilih Google Pay, dan langkah Pasca-pembelian.

Layar ini menampilkan alur pembelian Google Pay yang direkomendasikan untuk pengalaman keranjang belanja.

Mendapatkan persetujuan

Setelah mengintegrasikan Google Pay API, Anda harus mendapatkan persetujuan untuk semua tempat yang menampilkan atau mereferensikan Google Pay dalam UI Anda untuk mendapatkan akses produksi.

Selesaikan Daftar periksa integrasi kami untuk mengirimkan integrasi aplikasi Anda agar ditinjau. Anda akan menerima persetujuan atau masukan dalam waktu satu hari kerja.