Add-on Google Workspace harus konsisten dengan gaya dan tata letak aplikasi host yang diperluas. Modul tersebut harus memperluas UI secara alami dengan menggunakan kontrol dan perilaku yang sudah dikenal. Pedoman yang disajikan di sini menjelaskan cara menangani teks, gambar, kontrol, dan branding yang mendorong pengalaman pengguna yang berkualitas tinggi.
Jika add-on membuka halaman web terpisah yang merupakan bagian integral dari operasi add-on (seperti halaman setelan untuk add-on), pastikan halaman tersebut juga mengikuti panduan gaya ini.
Teks dan gambar
Bagian ini memberi tahu Anda cara menggunakan teks dan gambar dengan benar di add-on.
Nama add-on
Anda harus menetapkan nama add-on dalam manifes project-nya dan saat mengonfigurasi add-on untuk publikasi. Nama ini muncul di banyak tempat, seperti listingan Google Workspace Marketplace dan dalam menu. Saat memilih nama:
- Gunakan kapitalisasi judul.
- Hindari tanda baca, terutama tanda kurung, kecuali merupakan bagian dari merek Anda.
- Buat judul yang singkat—15 karakter atau kurang adalah pilihan terbaik. Nama panjang dapat otomatis terpotong di listingan Google Workspace Marketplace dan di tempat lain.
- Jangan sertakan kata-kata "Google", "Gmail", atau nama produk Google lainnya dalam nama add-on Anda.
- Jangan menyertakan kata "add-on" dalam nama add-on Anda.
- Tinggalkan informasi versi.
Gaya penulisan
Anda tidak perlu menulis banyak. Sebagian besar tindakan harus dijelaskan melalui ikonografi, tata letak, dan label singkat. Jika Anda merasa sebagian add-on memerlukan penjelasan yang lebih lengkap daripada yang dapat diberikan oleh label singkat, praktik terbaik adalah membuat halaman web terpisah yang mendeskripsikan add-on Anda dan menautkan ke add-on tersebut.
Saat menulis teks UI:
- Gunakan kapitalisasi kalimat (terutama untuk tombol, label, dan tindakan kartu).
- Pilih teks singkat dan sederhana tanpa jargon atau akronim.
Tindakan kartu dan universal
Jika Anda menggunakan tindakan universal atau tindakan kartu di add-on, tindakan tersebut akan muncul sebagai item menu dalam kartu yang Anda tentukan. Anda dapat memilih teks yang digunakan dalam menu tersebut untuk tindakan ini. Saat memilih teks yang akan digunakan:
- Hindari teks menu yang hanya mengulangi nama add-on Anda.
- Mulai setiap item menu dengan kata tindakan seperti "Run", "Configure", atau "Create".
- Jelaskan tugas, bukan komponen UI yang ditampilkan tindakan.
- Jika tindakan Anda memulai alur kerja dan tidak ada kata kerja tunggal yang menjelaskan apa yang dilakukannya, sebut "Start".
- Pertahankan jumlah item menu agar tidak memaksa pengguna untuk men-scroll daftar besar. Jika Anda memiliki tindakan lain untuk diterapkan, sebaiknya gunakan beberapa kartu yang masing-masing berisi tindakan yang berbeda.
Pesan error
Ketika terjadi kesalahan, penting untuk menggunakan bahasa yang sederhana. Jelaskan masalah dari sudut pandang pengguna, dan sarankan cara memperbaikinya.
- Jangan izinkan pengguna melihat pengecualian yang ditampilkan kode Anda. Sebagai gantinya, gunakan pernyataan
try...catchuntuk menangkap pengecualian, lalu tampilkan pesan error yang mudah digunakan. - Sebelum memublikasikan, pastikan add-on Anda tidak menampilkan informasi debug di UI.
Konten Bantuan
Anda dapat mendesain kartu yang menampilkan informasi bantuan atau menjelaskan operasi add-on kepada pengguna. Jika Anda membuat konten bantuan untuk add-on, ingatlah untuk:
- Jika memungkinkan, tampilkan petunjuk dalam daftar berbutir atau bernomor. Memandu pengguna sampai ke hasil akhir, dengan referensi yang jelas ke elemen UI yang diberi nama.
- Pastikan petunjuk Anda menerangkan persyaratan apa pun dengan jelas, seperti menyiapkan spreadsheet dengan cara tertentu.
- Jangan ragu untuk membuat link ke konten bantuan eksternal, seperti halaman web pendukung.
Gambar
Gambar yang digunakan di add-on Anda adalah salah satu dari jenis ikon bawaan atau gambar yang dihosting secara publik yang ditentukan oleh URL. Saat menggunakan gambar yang dihosting, pastikan gambar tersebut dapat diakses oleh semua orang yang mungkin menggunakan add-on Anda.
Kontrol
Bagian ini memberikan panduan pengalaman pengguna untuk widget interaktif.
Tombol
Gunakan tombol untuk mengontrol tindakan utama antarmuka pengguna Anda, bukan widget lainnya.
- Sebagian besar label tombol teks harus diawali dengan kata kerja.
- Baris tombol harus dibatasi hingga tiga tombol atau kurang dalam kebanyakan kasus.
Teks Dekorasi
Widget decorationdText memungkinkan Anda menampilkan konten teks dengan ikon, tombol, atau tombol.
- Gunakan kapitalisasi kalimat untuk konten teks.
- Teks widget decorationdText akan dipotong jika tidak dapat dimuat dengan ruang yang tersedia. Karena itu, selalu berusaha untuk membuat konten teks sesingkat mungkin.
Input pilihan
Anda dapat menggunakan berbagai widget input pemilihan dalam add-on: kotak pilihan drop-down, kotak centang, dan tombol pilihan.
- Gunakan kotak centang ketika orang dapat memilih beberapa opsi, atau tidak ada opsi sama sekali. Gunakan tombol pilihan (atau menu pilihan) saat tepat satu opsi harus dipilih. Gunakan dropdown saat memberikan daftar singkat alternatif saat mencoba menghemat ruang di UI.
- Gunakan kapitalisasi kalimat untuk teks yang ditetapkan pada setiap opsi.
- Hindari penggunaan perubahan pemilihan untuk memicu tindakan besar yang sulit dibatalkan, karena orang sering melakukan kesalahan saat membuat pilihan. Sebagai gantinya, pertimbangkan untuk menambahkan tombol yang membaca nilai pilihan saat ini, lalu memicu tindakan tersebut.
- Untuk menu dropdown, urutkan opsi menurut abjad atau skema logis yang dapat dipahami semua pengguna (seperti menampilkan hari secara berurutan, mulai dari hari Minggu atau Senin).
- Membatasi jumlah opsi dalam widget input pilihan tertentu ke jumlah yang wajar. Jika ada terlalu banyak opsi, pengguna mungkin akan kesulitan menggunakan widget tersebut. Dalam kasus tersebut, pertimbangkan untuk membagi opsi ke dalam berbagai kategori dan beberapa widget.
Input teks
Input teks menyediakan tempat bagi pengguna untuk memasukkan data {i>string<i}.
- Jangan gunakan input teks untuk membuat pengguna mengetik salah satu dari set entri tertentu. Sebagai gantinya, gunakan menu dropdown.
- Gunakan petunjuk dan saran untuk membantu pengguna memasukkan teks dengan format dan konten yang benar.
- Gunakan input teks multibaris jika teks yang akan dimasukkan lebih dari beberapa kata.
Branding
Bagian ini memberikan pedoman pengalaman pengguna untuk menambahkan elemen branding ke antarmuka add-on.
Di add-on Anda
Jika Anda ingin menyertakan branding dalam UI add-on, usahakan agar singkat dan ringan. Hal ini membantu orang fokus pada fungsi add-on Anda.
- Semua aspek add-on Anda harus mengikuti pedoman branding.
- Jangan sertakan kata "Google", "Gmail", atau nama produk Google lainnya.
- Jangan menyertakan ikon produk Google, meskipun ikon tersebut diubah.
- Jangan menyertakan kata "add-on" di teks branding Anda.
- Teks branding tidak boleh lebih dari beberapa kata.
Di Google Workspace Marketplace
Saat mengonfigurasi add-on untuk publikasi, Anda menyediakan sejumlah aset visual dan teks untuk membuat listingan Google Workspace Marketplace.
Semua aspek listingan Play Store dan aset ini harus mengikuti pedoman branding.