Add-on Google Workspace harus konsisten dengan gaya dan tata letak aplikasi host yang diperluasnya. Mereka 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 meningkatkan pengalaman pengguna berkualitas tinggi.
Jika add-on Anda membuka halaman web terpisah yang merupakan bagian integral dari operasi add-on (seperti halaman setelan untuk add-on), pastikan halaman web tersebut juga mengikuti pedoman 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 di manifes project 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 jika merupakan bagian dari merek Anda.
- Buat singkat—15 karakter atau kurang adalah yang terbaik. Nama panjang dapat dipangkas secara otomatis dalam listingan Google Workspace Marketplace dan di tempat lain.
- Jangan sertakan kata "Google", "Gmail", atau nama produk Google lainnya dalam nama add-on Anda.
- Jangan sertakan kata "add-on" dalam nama add-on Anda.
- Tidak menyertakan informasi versi.
Gaya penulisan
Anda tidak perlu menulis banyak. Sebagian besar tindakan harus dijelaskan dengan ikonografi, tata letak, dan label singkat. Jika Anda menemukan bahwa sebagian add-on Anda memerlukan penjelasan yang lebih ekstensif daripada yang dapat diberikan oleh label singkat, sebaiknya buat halaman web terpisah yang menjelaskan add-on Anda dan tautkan ke halaman tersebut.
Saat menulis teks UI:
- Gunakan huruf kapital di awal kalimat (terutama untuk tombol, label, dan tindakan kartu).
- Gunakan teks yang singkat dan sederhana tanpa jargon atau akronim.
Tindakan universal dan kartu
Jika Anda menggunakan tindakan universal atau tindakan kartu di add-on, tindakan tersebut akan muncul sebagai item menu di kartu yang Anda tentukan. Anda dapat memilih teks yang digunakan di menu ini 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 "Jalankan", "Konfigurasi", atau "Buat".
- Jelaskan tugasnya, bukan komponen UI yang ditampilkan oleh tindakan tersebut.
- Jika tindakan Anda memulai alur kerja dan tidak ada satu kata kerja yang menjelaskan apa yang dilakukannya, sebut saja "Mulai".
- Buat jumlah item menu sedikit untuk menghindari pengguna harus men-scroll daftar yang panjang. Jika Anda memiliki lebih banyak tindakan untuk diterapkan, pertimbangkan untuk menggunakan beberapa kartu dengan tindakan yang berbeda di setiap kartu.
Pesan error
Jika terjadi masalah, penting untuk menggunakan bahasa yang sederhana. Jelaskan masalah dari sudut pandang pengguna, dan sarankan cara memperbaikinya.
- Jangan izinkan pengguna melihat pengecualian yang dihasilkan kode Anda. Sebagai gantinya,
gunakan pernyataan
try...catchuntuk mencegat pengecualian, lalu tampilkan pesan error yang mudah dipahami pengguna. - Sebelum memublikasikan, periksa apakah add-on Anda tidak menampilkan informasi debug di UI.
Konten Bantuan
Anda dapat mendesain kartu yang menampilkan informasi bantuan atau menjelaskan pengoperasian add-on kepada pengguna. Jika Anda membuat konten bantuan untuk add-on, jangan lupa untuk:
- Jika memungkinkan, tunjukkan petunjuk dalam daftar berbutir atau bernomor. Mengarahkan pengguna hingga hasil akhir, dengan referensi yang jelas ke elemen UI bernama.
- Pastikan petunjuk Anda menjelaskan persyaratan dengan jelas, seperti menyiapkan spreadsheet dengan cara tertentu.
- Anda dapat menautkan ke konten bantuan eksternal, seperti halaman web pendukung.
Gambar
Gambar yang digunakan dalam 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 dapat menggunakan add-on Anda.
Kontrol
Bagian ini memberikan panduan pengalaman pengguna untuk widget interaktif.
Tombol
Gunakan tombol untuk mengontrol tindakan utama antarmuka pengguna, bukan widget lainnya.
- Sebagian besar label tombol teks harus dimulai dengan kata kerja.
- Baris tombol harus dibatasi hingga tiga tombol atau kurang dalam sebagian besar kasus.
DecoratedText
Widget DecoratedText memungkinkan Anda menampilkan konten teks dengan ikon, tombol, atau tombol geser.
- Gunakan kapitalisasi kalimat untuk konten teks.
- Teks widget DecoratedText dipangkas jika tidak dapat dimuat ke dalam ruang yang tersedia. Oleh karena itu, selalu usahakan agar konten teks sesingkat mungkin.
Input pilihan
Anda dapat menggunakan berbagai widget input pilihan di add-on: kotak pilihan drop-down, kotak centang, dan tombol pilihan.
- Gunakan kotak centang jika pengguna dapat memilih beberapa opsi, atau tidak ada opsi sama sekali. Gunakan tombol pilihan (atau menu pilihan) jika tepat satu opsi harus dipilih. Gunakan menu drop-down saat memberikan daftar singkat alternatif sambil mencoba menghemat ruang di UI.
- Gunakan kapitalisasi kalimat untuk teks yang ditetapkan ke setiap opsi.
- Hindari penggunaan perubahan pilihan 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.
- Untuk dropdown, urutkan opsi menurut abjad atau skema logis yang dapat dipahami semua pengguna (seperti menampilkan hari dalam seminggu secara berurutan, mulai dari Minggu atau Senin).
- Batasi jumlah opsi dalam widget input pilihan tertentu ke jumlah yang wajar. Jika ada terlalu banyak opsi, pengguna mungkin merasa sulit menggunakan widget. 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 string.
- Jangan gunakan input teks untuk membuat pengguna mengetik salah satu dari sekumpulan entri yang mungkin. Gunakan pilihan dropdown sebagai gantinya.
- Gunakan petunjuk dan saran untuk membantu pengguna memasukkan teks dengan format dan konten yang benar.
- Gunakan input teks multiline jika teks yang akan dimasukkan lebih dari beberapa kata.
Branding
Bagian ini memberikan panduan pengalaman pengguna untuk menambahkan elemen branding ke antarmuka add-on Anda.
Di add-on Anda
Jika Anda ingin menyertakan branding di UI add-on, buatlah singkat dan ringan. Hal ini membantu orang-orang berfokus pada fungsi add-on Anda.
- Semua aspek add-on Anda harus mengikuti panduan branding.
- Jangan menyertakan kata “Google”, "Gmail", atau nama produk Google lainnya.
- Jangan sertakan ikon produk Google, meskipun sudah diubah.
- Jangan sertakan kata "add-on" dalam teks branding Anda.
- Teks branding tidak boleh lebih dari beberapa kata.
Di Google Workspace Marketplace
Saat mengonfigurasi add-on untuk publikasi, Anda memberikan sejumlah aset grafis dan teks untuk membuat listingan Google Workspace Marketplace.
Semua aspek listingan Play Store dan aset ini harus mematuhi pedoman branding.