Bagikan melalui


Praktik terbaik Xbox

Secara default, semua aplikasi UWP akan berjalan di Xbox One tanpa upaya tambahan di bagian Anda. Namun, jika ingin aplikasi Anda bersinar, menyenangkan pelanggan Anda, dan bersaing dengan pengalaman aplikasi terbaik di Xbox, Anda harus mengikuti praktik di bawah ini.

Catatan

Sebelum memulai, lihat panduan desain yang ditata dalam Merancang untuk Xbox dan TV.

Untuk membangun pengalaman terbaik untuk Xbox One

Lakukan: Matikan mode mouse

Pengguna Xbox menyukai pengontrol mereka. Untuk mengoptimalkan input pengontrol, nonaktifkan mode mouse dan aktifkan navigasi arah (juga dikenal sebagai navigasi fokus XY dan interaksi). Hati-hati dengan perangkap fokus dan UI yang tidak dapat diakses.

Do: Menggambar persegi panjang fokus yang sesuai untuk pengalaman 10 kaki

Sebagian besar pengguna Xbox duduk di seberang ruang tamu dari TV mereka, jadi perlu diingat bahwa persegi panjang fokus standar sulit dilihat dari jarak sepuluh kaki. Untuk memastikan bahwa elemen UI dengan fokus input terlihat jelas oleh pengguna setiap saat, ikuti panduan visual Fokus. Di XAML Anda akan mendapatkan perilaku ini secara gratis saat aplikasi Anda berjalan di Xbox, tetapi aplikasi HTML harus menggunakan gaya CSS kustom.

Do: Integrasikan dengan kelas SystemMediaTransportControls

Pengguna Xbox ingin mengontrol aplikasi media dengan perintah suara Xbox Media Remote, Cortana (terutama perintah suara "Putar" dan "Jeda"), dan Xbox SmartGlass. Untuk mendapatkan fitur ini secara gratis, aplikasi Anda harus menggunakan kelas SystemMediaTransportControls , yang secara otomatis disertakan dalam kontrol media Xbox. Jika aplikasi Anda memiliki kontrol media kustom, pastikan untuk berintegrasi dengan kelas SystemMediaTransportControls untuk menyediakan fitur-fitur ini kepada pengguna Anda. Jika Anda membuat aplikasi musik latar belakang, integrasikan dengan kelas SystemMediaTransportControls untuk memastikan bahwa kontrol musik latar belakang berfungsi dengan benar di tab multitugas Xbox.

Pertimbangkan: Gambar ke tepi layar

Banyak TV memotong tepi layar, sehingga semua konten penting aplikasi Anda harus ditampilkan di area aman TV. UWP menggunakan overscan untuk menyimpan konten di dalam area aman TV, tetapi perilaku default ini dapat menggambar batas yang jelas di sekitar aplikasi Anda. Untuk memberikan pengalaman terbaik, nonaktifkan perilaku default dan ikuti instruksi di Cara menggambar UI ke tepi layar.

Penting

Jika Anda menonaktifkan overscan, Anda bertanggung jawab untuk memastikan bahwa elemen dan teks interaktif tetap berada di area aman TV.

Pertimbangkan: Gunakan warna aman TV

TV tidak menangani intensitas warna ekstrem serta monitor komputer. Hindari warna intensitas tinggi di aplikasi Anda sehingga pengguna tidak melihat efek pita ganjil atau gambar yang dicuci. Selain itu, ketahuilah bahwa perbedaan antara TV berarti bahwa warna yang terlihat bagus di TV Anda mungkin terlihat sangat berbeda dengan pengguna Anda. Baca Warna untuk memahami cara membuat aplikasi Anda terlihat bagus untuk semua orang!

Ingat: Anda dapat menonaktifkan penskalakan

Aplikasi UWP secara otomatis diskalakan untuk memastikan bahwa elemen UI seperti kontrol dan font dapat diakses di semua perangkat. Aplikasi yang menggunakan XAML diskalakan sebesar 200%, sementara aplikasi yang menggunakan HTML diskalakan sebesar 150%. Jika Anda ingin kontrol lebih besar atas tampilan aplikasi Anda di Xbox, nonaktifkan faktor skala default untuk menggunakan dimensi piksel aktual HDTV (1920x1080). Lihat Cara menonaktifkan penskalaan untuk informasi tentang menyesuaikan aplikasi Anda agar terlihat bagus di Xbox.

Lihat juga