Mulai

Bangun aplikasi Anda menggunakan framework UI Jetpack Compose Glimmer untuk pengalaman augmented yang berfungsi pada layar tembus pandang optik. Jetpack Compose Glimmer adalah salah satu framework UI pertama yang dioptimalkan untuk layar transparan dan faktor bentuk kacamata.

1. Menentukan perjalanan pengguna

Fokus pada perjalanan penting pengguna (CUJ) yang kompatibel dengan prinsip sekilas faktor bentuk kacamata. Hal ini dapat diungkapkan dengan UI minimal atau audio saja, sekaligus memungkinkan pengguna tetap hadir di lingkungan mereka. Untuk menemukan peluang, pertimbangkan untuk memulai titik entri di aplikasi Anda saat ini yang akan memperoleh manfaat dari Kacamata.

Misalnya, pengguna dapat memperoleh manfaat dari rute jalan kaki belokan demi belokan handsfree untuk membantu mereka menuju ke tujuan.

Perjalanan pengguna yang dipilih juga harus mempertimbangkan prinsip keselamatan, kenyamanan, dan performa. Misalnya, jangan memilih tugas yang akan memerlukan kamera pengguna untuk jangka waktu yang tidak perlu atau melanggar privasi mereka.

Pelajari prinsip dasar.

Anjuran

Ekstrak fitur dari aplikasi seluler Anda yang memanfaatkan faktor bentuk kacamata pintar. Misalnya, pengalaman sekilas.

Larangan

Mem-porting seluruh aplikasi ponsel ke kacamata karena aplikasi tersebut tidak diskalakan ke faktor bentuk kacamata.

2. Meminimalkan & Menerjemahkan

Untuk UI mode tampilan, mulai dengan CUJ dari aplikasi inti Anda:

  • Optimalkan tata letak untuk fokus: Tata letak memprioritaskan informasi penting, sehingga mengurangi jumlah tindakan dan elemen visual untuk mempertahankan fokus pengguna.

  • Gunakan kedalaman untuk hierarki: Kedalaman digunakan untuk menyampaikan prioritas elemen.

  • Desain dari bawah ke atas: Saat membuat tiruan, mulailah dari bawah, dengan menyusun komponen ke atas.

  • Menerjemahkan komponen visual: Untuk kacamata pintar dengan layar, gunakan komponen Glimmer dan pola tata letak Jetpack Compose.

Baca selengkapnya tentang komponen dan tampilan aplikasi.

Aplikasi daftar belanja mengurangi tampilan daftar menjadi pengalaman daftar minimal dan hanya memerlukan UI masukan.
Gambar 1.: Aplikasi daftar belanja yang diterjemahkan ke dalam elemen untuk kacamata pintar dengan layar. Kolom sistem terlihat berbeda karena UI pada kacamata pintar dengan layar biasanya kosong. Di sini, panel aplikasi dapat diterjemahkan menjadi chip judul, sedangkan elemen daftar Material diterjemahkan menjadi daftar Glimmer Jetpack Compose.

3. Alur & isyarat audio

Lakukan percakapan dengan audio. Meskipun audio harus menjadi bagian besar dari pengalaman aplikasi Anda bahkan di kacamata pintar dengan layar, Anda juga perlu memperhitungkan pengalaman khusus audio untuk kacamata pintar audio. Anda dapat melakukannya dengan membuat peta alur khusus audio untuk mendeskripsikan pengalaman ini. Mencatat interaksi dan masukan dengan isyarat audio dan dialog. Evaluasi desain Anda untuk menghindari membebani pengguna dengan alur audio Anda.

Buat peta alur khusus audio untuk membantu Anda merencanakan pengalaman percakapan yang tidak membebani pengguna.

4. Kontrol input peta

Pastikan untuk memetakan input untuk kontrol dan gestur perangkat. Anda dapat memulai dengan menerjemahkan interaksi aplikasi dasar, seperti ketuk, ke ketukan trackpad.

Lanjutkan ke input.

Aplikasi yang terdiferensiasi XR memiliki pengalaman pengguna yang dirancang secara eksplisit untuk XR, dan mengimplementasikan fitur yang hanya ditawarkan di XR.

5. Pertimbangkan SysUI

Perhitungkan antarmuka sistem lainnya.

Aplikasi Anda akan muncul di layar utama dan fitur sistem lainnya, seperti notifikasi jika digunakan. Notifikasi ini dapat muncul di kolom sistem.

Selengkapnya tentang UI Sistem

Buat peta alur khusus audio untuk membantu Anda merencanakan pengalaman percakapan yang tidak membebani pengguna.

6. Negara bagian tambahan

Aplikasi Anda akan mengalami berbagai skenario di kacamata audio dan kacamata pintar dengan layar, seperti masalah koneksi atau izin. Perhitungkan berbagai status ini, baik dalam aplikasi inti maupun aplikasi kacamata Anda.

Pastikan untuk meminta izin fitur perangkat.

Ingat, Anda harus mempertimbangkan hal ini melalui UI visual dan audio. Misalnya, berikan respons audio untuk menyampaikan bahwa mereka harus menyelesaikan alur izin di perangkat seluler atau untuk membacakan error.

Perhitungkan berbagai status aplikasi, baik dalam aplikasi inti maupun aplikasi kacamata. Catatan: Mulai gunakan Jetpack Compose Glimmer UI Kit di Figma.

Sebelumnya
UI yang Dibuat untuk Kacamata AI
Berikutnya
Ringkasan