Pengantar
Pada awal tahun 2020, tim Chrome di seluruh perangkat seluler dan desktop membuat rencana untuk meningkatkan visibilitas dan interaksi aplikasi web yang diinstal. Pekerjaan kami menghasilkan peningkatan lebih dari 100% pada penginstalan dan interaksi PWA. Kami melakukannya dengan meneliti fitur yang ada, menjalankan eksperimen pengujian A/B dan wawancara pengguna untuk mendapatkan insight tentang persepsi dan ekspektasi pengguna. Artikel ini membahas bagaimana kita sampai di sana.
Bahasa penginstalan terpadu
Pesan ajakan (CTA) yang memicu penginstalan PWA tidak konsisten di seluruh platform web. Untuk Chrome di Android, kami telah menetapkan Tambahkan ke layar utama, tetapi di Platform Desktop, kami menekan Instal. Alasan perbedaan ini berasal dari studi yang dilakukan tim pada tahun 2016 yang membandingkan {i>string<i} yang berbeda. Tim menemukan bahwa Add to home screen berfungsi lebih baik, walaupun sedikit lebih baik, di perangkat seluler.
Studi lebih lanjut tentang taksonomi pada tahun 2019 tidak menemukan perbedaan, sehingga tim yang ingin menyatukan pengalaman penginstalan PWA, memutuskan untuk memperbarui label menjadi Instal di Android. Sebuah studi lebih lanjut pada tahun 2021 membandingkan bahasa, Install, Get, dan Download, dan kami menemukan bahwa pengguna memahami Install sebagai proses yang sedang terjadi. Pengguna merasa bahwa mengetuk tombol dengan label Get akan mengarahkan pengguna ke situs, dan dengan Download, mereka menganggap sebuah file akan berakhir di folder download atau yang setara.
Dengan mempertimbangkan semua ini, kami menyimpulkan bahwa label Instal paling cocok dengan PWA. Ke depannya, sebaiknya developer di seluruh platform web menggunakan Instal sebagai string pilihan.
Ikon instal di desktop
Pada platform desktop, kami memiliki pola desain yang setiap kali situs memuat PWA, Chrome akan menampilkan pil yang muncul di sisi kanan omnibox yang berisi ikon dan label Instal. Setelah itu, saat pengguna mengunjungi situs, hanya ikon tersebut yang akan muncul. Mengklik pil ini akan memicu penginstalan PWA desktop.
Ikon ini awalnya berupa simbol plus, sebagian karena metafora Add to home screen yang digunakan di perangkat seluler. Namun, seperti yang disebutkan, bahasa yang kami gunakan adalah Install. Masukan yang kami terima dari komunitas pengembang adalah bahwa ikon ini membingungkan. Selain itu, jika pengguna menggunakan fungsi zoom untuk memperbesar teks, ikon untuk zoom tampak sangat mirip, dan akan semakin membingungkan pengguna.
Saya memutuskan untuk menyelidiki persepsi pengguna kami, karena sebagian besar masukan bersifat anekdot. Kami bekerja sama dengan peneliti UX, melakukan studi dengan 10.000 pengguna di AS dan Indonesia untuk menentukan pemahaman pengguna tentang ikon instal. Kami menguji lima desain yang berbeda, termasuk yang sudah ada, dan bertanya kepada pengguna apa arti "Instal". Kita menemukan bahwa ikon saat ini, simbol plus, adalah yang paling membingungkan bagi pengguna. Banyak yang bingung simbol ini dengan "obat", "pertolongan pertama" dan "baterai".
Kami juga mendapati bahwa pengguna biasanya mengaitkan gambar seperti panah dan perangkat dengan penginstalan. Berdasarkan kesimpulan ini, kami menjalankan pengujian A/B/C di Chrome, yang membandingkan desain yang ada dengan dua alternatif. Kami mendarat di panah yang menunjuk ke bawah ke monitor, yang memiliki performa jauh lebih baik dari dua lainnya. Kami juga melihat penurunan penutupan UI penginstalan dengan ikon baru ini.
Hasilnya adalah desain yang Anda lihat saat ini, yang telah meningkatkan rasio penginstalan PWA lebih dari dua kali lipat untuk situs. Kami juga telah menambahkan ikon ini dan versi seluler yang setara dengan kumpulan ikon Desain Material, yang memungkinkan komunitas menggunakan ikonografi yang menurut kami paling menarik.
Tentu saja, satu ikon tidak akan mengubah dunia, yang akan membawa kita ke fitur berikutnya.
Bantuan dalam produk
Bantuan Dalam Produk adalah tooltip balon biru yang memperkenalkan fitur baru yang mungkin menarik bagi pengguna berdasarkan kriteria tertentu. Kami memutuskan untuk meluncurkan pola desain ini untuk memberi tahu pengguna tentang fitur penginstalan dan mendukung lebih lanjut desain ulang ikon baru.
Jika pengguna mengunjungi situs secara rutin, Chrome menggunakan layanan yang dikenal sebagai Engagement Situs.
Bagian ini memberikan informasi tentang seberapa besar tingkat engagement pengguna dengan situs. Dengan
mengunjungi chrome://site-engagement/, Anda dapat melihat situs yang
berinteraksi secara rutin dengan Anda. Dengan menggunakan skor ini, kita bisa menentukan
apakah seorang pengguna tertarik dengan suatu {i>website<i}. Jika situs tersebut adalah PWA dan
pengguna berinteraksi, kami akan menampilkan UI Bantuan dalam Produk instal.
Artinya, kami hanya berfokus pada pengguna yang berinteraksi,
bukan pengguna yang mengganggu yang mengunjungi situs satu kali.
Dengan menggunakan bantuan dalam produk di desktop, kami melihat peningkatan penginstalan PWA lebih dari 100%. Ini menunjukkan bahwa berfokus pada pengguna yang berinteraksi meningkatkan kemampuan penginstalan aplikasi web.
UI Penginstalan yang Lebih Lengkap
Paradigma penginstalan untuk sebagian besar pengguna adalah store. Sejak pertengahan 2000-an, kami telah mengedukasi pengguna bahwa setiap kali mereka menginstal aplikasi, mereka akan melihat deskripsi, screenshot, dan metadata lainnya untuk membantu mereka memutuskan apakah suatu aplikasi adalah sesuatu yang mereka inginkan.
Dengan PWA, UI yang kami tampilkan setelah pengguna memutuskan untuk menginstal aplikasi web relatif sedikit. Jadi, tim memutuskan untuk mempelajari pengalaman penginstalan yang lebih kaya yang akan memberikan konteks kepada pengguna tentang aplikasi web dan memungkinkan developer memanfaatkan PWA yang setara dengan pengalaman native.
Awal tahun ini, kami meluncurkan Richer Install, UI penginstalan yang diperluas di Chrome pada Android yang memungkinkan developer menambahkan screenshot ke manifesnya. Developer juga dapat menambahkan deskripsi, yang direkomendasikan tetapi tidak wajib. Berkat UI yang lebih baru ini, kami melihat rasio instal untuk beberapa PWA meningkat dua kali lipat, yang menunjukkan bahwa pengguna memiliki keyakinan lebih besar dalam menginstal aplikasi web saat kami memberikan lebih banyak konteks dan pengalaman yang lebih kaya. Versi desktop UI ini sedang dalam proses.
Kesimpulan
Tim telah menghabiskan dua tahun terakhir untuk mengeksplorasi dan bereksperimen dengan fitur-fitur baru di Chrome yang telah mengaktifkan dan mendukung developer PWA serta membantu mengedukasi pengguna tentang manfaat pengalaman web. Masih banyak pekerjaan yang bisa kami lakukan, tetapi secara kolektif kami dapat meningkatkan dan memperkaya kehidupan pengguna serta mendukung web terbuka lebih jauh.