UI penginstalan PWA yang lebih lengkap

Pengantar

Perangkat seluler dan pengenalan app store vendor perangkat telah mengubah model mental pengguna tentang cara menemukan, mengevaluasi, dan menginstal software. Pengguna kini sangat akrab dengan app store, dan informasi tambahan yang diberikan melalui app store seperti konteks tentang aplikasi, masukan sosial, rating, dll. sehingga Anda melihat metafora app store muncul di sistem operasi Desktop, termasuk ChromeOS, Mac, dan Windows.

Tantangan pada platform penginstalan saat ini

Saat ini, jika pengguna ingin menginstal PWA, infobar dan overlay modal akan muncul dengan informasi minimal. Jika pengguna terus menginstal, prosesnya akan selesai terlalu cepat tanpa memberikan konteks kepada pengguna. Hal ini bertentangan dengan ekspektasi mereka untuk menginstal aplikasi dan dapat membuat mereka agak bingung tentang apa yang telah terjadi.

Contoh UI penginstalan PWA.
Contoh UI penginstalan PWA.

Agar developer dapat memberikan pengalaman penginstalan yang setara dengan pengalaman native, Chrome memperkenalkan platform penginstalan baru, Penginstalan yang Lebih Kaya, yang memungkinkan developer menambahkan deskripsi dan screenshot ke file manifes mereka dan menampilkannya di dialog panel bawah dalam Chrome untuk Android.

Contoh UI panel bawah di Chrome.
Contoh UI panel bawah di Chrome.

Hal ini memberi developer peluang untuk membuat proses penginstalan yang lebih menarik yang lebih selaras dengan ekspektasi pengguna dan meniru model mental pengalaman terinstal yang sudah ada.

UI Penginstalan yang Lebih Kaya Diperluas.
UI Penginstalan yang Lebih Kaya Diperluas.
UI Penginstalan yang Lebih Kaya Diciutkan.
UI Penginstalan yang Lebih Kaya Diciutkan.

Kompatibilitas mundur

Situs yang tidak menyertakan setidaknya satu screenshot ke file manifesnya akan terus menerima perintah yang ada. Hal ini dapat berubah pada masa mendatang, bergantung pada penggunaan komunitas developer dan reaksi pengguna.

Melihat pratinjau UI

UI ini berfungsi mulai Chrome 94 di Android, dan Chrome 108 di desktop.

Fitur ini diaktifkan di squoosh.app dan dapat dilihat pratinjaunya di sana.

Penerapan

Untuk menampilkan dialog UI penginstalan yang lebih lengkap, developer harus menambahkan minimal satu screenshot untuk faktor bentuk yang sesuai dalam array screenshots. Kolom description tidak wajib diisi, tetapi direkomendasikan. Dialog konten dibuat menggunakan konten kolom screenshots dan description untuk membuat pengalaman lebih mirip dengan penginstalan app store. UI ini membantu pengguna mengidentifikasi bahwa mereka menambahkan aplikasi ke perangkat, dan dengan lebih banyak ruang yang tersedia, developer dapat memberikan konteks tertentu kepada pengguna mereka pada waktu penginstalan.

Misalnya, developer dapat menggunakan kolom description untuk menyoroti fitur aplikasi yang memberikan insentif kepada pengguna untuk menyimpannya di perangkat mereka, dan dengan screenshots, mereka dapat menampilkan tampilan dan nuansa aplikasi web sebagai aplikasi mandiri, dengan semua akses mudah yang dimiliki aplikasi platform.

Untuk mengetahui spesifikasi mendetail dan panduan menambahkannya ke aplikasi Anda, buka Pola UI Penginstalan yang Lebih Kaya.

Masukan

Di masa mendatang, kami akan mempertimbangkan untuk menambahkan data lain seperti kategori dan rating aplikasi, tetapi hal ini akan didasarkan pada masukan dari developer dan pengguna.

Dalam beberapa bulan mendatang, kami ingin melihat bagaimana developer menjelajahi pola UI baru ini dan kami ingin mendapatkan masukan dari Anda. Hubungi kami dengan mengisi formulir ini