Desain untuk perangkat layar besar sejak awal

Perangkat Android hadir dalam berbagai faktor bentuk—ponsel, tablet, perangkat foldable, perangkat ChromeOS—yang memiliki berbagai ukuran layar. Android mendukung banyak mode tampilan, termasuk multi-aplikasi, multi-layar, bentuk bebas, dan picture-in-picture. Perangkat foldable dapat berada dalam berbagai status atau postur, seperti mode di atas meja atau mode buku.

Pertimbangkan berbagai kasus penggunaan untuk aplikasi Anda saat Anda mulai mendesainnya. Contoh:

  • Perangkat Layar Besar memberi pengguna lebih banyak ruang untuk berinteraksi dengan konten aplikasi media Anda dengan berbagai cara.

  • Pengguna mungkin melakukan banyak hal saat menonton video dalam konfigurasi multi-aplikasi atau memanfaatkan layar yang lebih besar untuk menerapkan pengeditan yang lebih kompleks setelah mengambil gambar.

  • Pengguna mungkin beralih ke tablet untuk tetap terhubung dengan panggilan video dan melihat teman dan keluarga mereka dengan lebih detail. Aplikasi Anda dapat menampilkan konteks yang lebih lengkap tentang judul atau adegan dalam overlay pemutaran kustom atau menawarkan lebih banyak opsi kontrol di layar.

  • Carousel dalam tampilan penjelajahan dapat menampilkan lebih banyak variasi untuk daya tarik visual yang lebih besar, atau aplikasi media Anda dapat membuat pengguna tetap berinteraksi dengan menawarkan feed yang dapat dijelajahi secara berdampingan dengan pemutaran.

Perlu diingat bahwa aplikasi media Anda memiliki kode yang sama yang berjalan di ponsel standar, perangkat foldable, tablet, dan perangkat ChromeOS, sehingga Anda harus mendesain untuk layar besar sejak awal pengembangan aplikasi. Untuk informasi selengkapnya dan contoh visual, lihat Galeri perangkat layar besar.

Membuat aplikasi media Anda responsif secara default

Hindari pengalaman pengguna yang rusak di aplikasi media Anda dengan membuat tata letak aplikasi adaptif di seluruh ponsel, tablet, perangkat foldable, dan perangkat ChromeOS.

Aplikasi Anda harus responsif agar dapat memperhitungkan berbagai ukuran, orientasi, dan faktor bentuk layar. Tata letak adaptif berubah berdasarkan ruang tampilan yang tersedia untuknya. Untuk mengetahui informasi selengkapnya, lihat Mendukung berbagai ukuran layar.

Mendesain sesuai dengan pedoman

Kualitas aplikasi inti adalah dasar dari semua aplikasi Android, terlepas dari ukuran layar, postur perangkat, atau pertimbangan khusus perangkat lainnya. Aplikasi Anda harus memenuhi persyaratan dasar ini sebelum Anda mulai mendesain untuk perangkat layar besar. Untuk mengetahui informasi selengkapnya, lihat Kualitas aplikasi inti.

Aplikasi Anda harus menawarkan pengalaman pengguna yang sangat baik, apa pun faktor bentuk perangkat, ukuran layar, mode tampilan, atau posturnya, jadi desain aplikasi Anda sesuai dengan pedoman Tingkat 1, 2, dan 3 berikut.

Pedoman ini menentukan serangkaian persyaratan kualitas yang komprehensif untuk sebagian besar jenis aplikasi Android.

Tingkat 3:

Pada tingkat dasar ini, aplikasi Anda masih harus mematuhi persyaratan UI dan grafis. Aplikasi Anda siap digunakan di perangkat layar besar, dan pengguna dapat menyelesaikan alur tugas penting, tetapi dengan pengalaman pengguna yang kurang optimal.

Tata letak aplikasi mungkin tidak ideal, tetapi berjalan dalam layar penuh, atau jendela penuh dalam mode multi-aplikasi. Aplikasi tidak memiliki tampilan lebar dan tidak berjalan dalam mode kompatibilitas. Aplikasi menyediakan dukungan dasar untuk perangkat input eksternal, termasuk keyboard, mouse, dan trackpad. Untuk mengetahui informasi selengkapnya, lihat Siap untuk perangkat layar besar.

Tingkat 2:

Di sini, aplikasi Anda menerapkan pengoptimalan tata letak untuk semua ukuran layar dan konfigurasi perangkat, beserta dukungan yang ditingkatkan untuk perangkat input eksternal. Untuk mengetahui detailnya, lihat Dioptimalkan untuk perangkat layar besar.

Tingkat 1:

Ini adalah tingkat dukungan terbaik dan menawarkan pengalaman paling luar biasa kepada pengguna dengan aplikasi Anda, karena menentukan fitur dan kemampuan premium.

Jika memungkinkan, aplikasi akan mendukung multitasking, postur perangkat foldable, tarik, dan input stilus. Pada tingkat ini, aplikasi sangat berbeda, jadi perhatikan baik-baik pedoman untuk hal-hal seperti multi-tasking dan postur perangkat foldable. Untuk mempelajari lebih lanjut, lihat Layar besar yang terdiferensiasi.

Tata letak yang dioptimalkan

Manfaatkan ruang layar besar yang lebih luas tanpa tampilan lebar (karena membatasi orientasi) atau peregangan. Dengan mengoptimalkan tata letak aplikasi untuk media dan media sosial, Anda memperluas jangkauan aplikasi dan menciptakan pengalaman pengguna yang lebih baik di semua faktor bentuk perangkat layar besar—tablet, perangkat foldable, dan perangkat ChromeOS—serta mendukung semua ukuran ponsel.

Komponen kolom dan panel samping navigasi memberikan navigasi yang canggih untuk kemudahan dan kontrol UI. Komponen ini juga melengkapi tata letak kanonis (daftar-detail, feed, dan panel pendukung) dengan memosisikan tujuan navigasi utama dalam jangkauan yang dekat sekaligus menempati ruang minimum.

Tata letak media

Buat aplikasi Anda lebih mudah digunakan dengan menerapkan tata letak khusus media untuk daftar-detail, feed, dan panel pendukung. Untuk mengetahui informasi tentang tata letak MDX, Flutter, dan Compose, lihat Resource tata letak.

  • Daftar-detail: Mendesain aplikasi dengan browser media interaktif memungkinkan pengguna menjelajahi berbagai media sambil menonton atau mendengarkan. Judul media ditampilkan berdampingan dengan file video atau audio yang diputar. Jika orientasi perangkat berubah, tata letak daftar-detail akan merespons untuk mempertahankan status aplikasi. Untuk mempelajari lebih lanjut, lihat Tata letak daftar-detail.

  • Feed: Tata letak feed mengatur elemen konten yang setara dalam petak yang dapat dikonfigurasi agar konten dalam jumlah besar dapat dilihat dengan cepat dan nyaman, seperti feed musik atau kios film dan TV di aplikasi Anda. Untuk informasi selengkapnya, lihat Tata letak feed.

  • Panel pendukung: Dengan area tampilan utama dan sekunder, aplikasi Anda dapat menyematkan panel pendukung untuk konteks, relevansi, atau referensi, seperti daftar yang bisa di-scroll berisi judul serupa, ulasan yang dipublikasikan, atau karya tambahan oleh artis atau aktor yang sama. Untuk mengetahui detail selengkapnya, lihat Mendukung tata letak panel.

Untuk koleksi tata letak media pilihan, lihat Galeri media.

Tata letak Media Sosial

Dengan layar besar, pengguna media sosial memiliki lebih banyak ruang kerja untuk berkarya, multitasking, menarik konten antar-aplikasi, dan membagikannya. Dengan fitur dan kemampuan unik yang tidak mungkin dilakukan di perangkat layar kecil, aplikasi media layar besar Anda dapat memanfaatkan tata letak panel pendukung, feed, dan detail daftar.

  • Daftar-detail: Tata letak ini ideal untuk aplikasi pesan, pengelola kontak, atau file browser. Misalnya, aplikasi Anda dapat menampilkan daftar percakapan secara berdampingan dengan detail untuk terus mengikuti pesan terbaru. Untuk mengetahui informasi selengkapnya, lihat Tata letak daftar-detail.

  • Feed: Komponen umum dalam gaya tata letak ini adalah kartu dan daftar. Misalnya, buat kolase postingan dalam format petak yang fleksibel, atau gunakan ukuran dan posisi untuk menarik perhatian ke postingan yang menonjol. Pengguna dapat dengan cepat melihat grup konten yang besar. Untuk mengetahui informasi selengkapnya, lihat Tata letak feed.

  • Panel pendukung: Aplikasi referensi dan penelusuran atau aplikasi produktivitas dapat memanfaatkan gaya tata letak ini. Tata letak ini memudahkan pengguna mengakses alat pembuatan konten. Misalnya, aplikasi Anda dapat memungkinkan pengguna menyesuaikan setelan, mengakses palet warna, menerapkan efek, dan melihat perubahan secara instan. Untuk mengetahui informasi selengkapnya, lihat Mendukung tata letak panel.

Untuk koleksi pilihan tata letak media sosial, lihat halaman Galeri media sosial.

Praktik terbaik untuk aplikasi media perangkat layar besar

Menggunakan praktik terbaik untuk perangkat layar besar membantu Anda menghindari pengerjaan ulang aplikasi yang tidak perlu. Praktik terbaik ini juga membuat aplikasi Anda lebih mudah digunakan di lebih banyak perangkat sejak awal, terutama terkait orientasi, pintasan keyboard, dukungan pratinjau kamera, dan postur perangkat foldable.

Orientasi dan pengubahan ukuran

Jika aplikasi media Anda mendeklarasikan batasan orientasi dan pengubahan ukuran, Android akan mengaktifkan mode kompatibilitas. Meskipun mode kompatibilitas memastikan aplikasi Anda berperilaku dengan baik, kegunaannya sangat berkurang, dan pengalaman pengguna terganggu.

Misalnya, jika aplikasi Anda berada di tablet, tablet akan dipasang ke dok dalam orientasi lanskap. Jika aplikasi Anda dibatasi untuk orientasi potret, hal ini akan menyebabkan tampilan lebar, yang tidak ideal bagi pengguna akhir. Aplikasi Anda harus memungkinkan orang menggunakan orientasi yang mereka inginkan, jadi manfaatkan ukuran layar besar yang tersedia dalam desain Anda.

Setiap pembatasan orientasi akan mengurangi cara pengguna berinteraksi dengan konten atau menggunakan media, yang membatasi penggunaan aplikasi Anda. Mengubah orientasi dapat memengaruhi ukuran sampai batas tertentu, tetapi mengubah ukuran tidak selalu mengubah orientasi.

Pintasan keyboard

Di layar yang lebih besar, pintasan keyboard pada keyboard fisik, seperti mulai, berhenti, jeda, mundur, dan maju, lebih cenderung digunakan, sehingga memberikan pengalaman pengguna yang konsisten dengan keyboard.

Pengguna mengharapkan fungsi ini di aplikasi media mereka. Untuk mengurangi titik hambatan bagi pengguna, pertimbangkan untuk menguji aplikasi Anda dengan keyboard fisik. Hal ini membantu Anda memperhatikan dan menyertakan pintasan penting ini di aplikasi Anda di awal desain.

Dukungan pratinjau kamera

Dengan layar besar, Anda dapat mengalami lebih banyak masalah terkait peregangan, pemangkasan, dan rotasi. Jadi, Anda tidak dapat mengasumsikan ukuran pratinjau kamera adalah ukuran yang sebenarnya dirender oleh UI di aplikasi media Anda.

Misalnya, jika pengguna mengambil gambar dengan tabletnya, tetapi di layar tabletnya, gambar tersebut dirender terbalik, ini adalah pengalaman yang kurang optimal. Sertakan dukungan pratinjau kamera untuk perangkat layar besar.

Untuk mengetahui informasi selengkapnya, lihat Pratinjau CameraX, atau Pratinjau Camera2.

Postur perangkat foldable

Mendesain aplikasi media untuk perangkat layar besar mencakup postur perangkat foldable. Misalnya, aplikasi Anda dapat memungkinkan pengguna memiliki konfigurasi mode di atas meja untuk pemutaran media atau menggunakan mode tampilan belakang dan Dual Screen untuk pratinjau dan pengambilan gambar.

Dengan menyertakan postur perangkat foldable dalam rencana pengembangan, aplikasi Anda akan tersedia untuk lebih banyak perangkat dan memiliki dampak yang lebih luas. Anda memperbesar pengalaman media untuk pengguna dengan cara yang tidak dapat dilakukan perangkat lain tanpa postur perangkat foldable. Untuk mengetahui informasi selengkapnya, lihat Postur perangkat foldable.