Manajemen Jendela

Catatan

Panduan desain ini dibuat untuk Windows 7 dan belum diperbarui untuk versi Windows yang lebih baru. Sebagian besar panduan masih berlaku pada prinsipnya, tetapi presentasi dan contoh tidak mencerminkan panduan desain kita saat ini.

Artikel ini membahas penempatan jendela default ketika awalnya ditampilkan di layar, urutan tumpukannya relatif terhadap jendela lain (urutan Z), ukuran awalnya, dan bagaimana tampilannya memengaruhi fokus input.

Untuk panduan berikut:

• Jendela tingkat atas tidak memiliki jendela pemilik dan ditampilkan pada taskbar. Contoh: jendela aplikasi. Di Windows Vista dan yang lebih baru, kotak dialog tanpa jendela pemilik dan lembar properti juga dianggap tingkat atas.
• Jendela yang dimiliki memiliki jendela pemilik dan tidak ditampilkan di taskbar. Contoh: kotak dialog modal, kotak dialog tanpa mode.
• Jendela yang dimulai pengguna ditampilkan sebagai hasil langsung dari tindakan pengguna. Jika tidak, program dimulai jika dimulai oleh program, atau sistem yang dimulai jika dimulai oleh Microsoft Windows . Misalnya, kotak dialog Opsi dimulai pengguna, tetapi pengingat rapat dimulai.
• Jendela kontekstual adalah jendela yang dimulai pengguna yang memiliki hubungan kuat dengan objek tempatnya diluncurkan. Misalnya, jendela yang ditampilkan oleh menu konteks atau ikon area pemberitahuan bersifat kontekstual, tetapi jendela yang ditampilkan oleh bilah menu tidak.
• Monitor aktif adalah monitor tempat program aktif berjalan.
• Monitor default adalah monitor dengan menu Mulai, taskbar, dan area pemberitahuan.

Konsep desain

Manajemen jendela adalah salah satu aktivitas pengguna yang paling mendasar. Sebelum Windows Vista, jendela sering diberi ukuran default kecil dan ditempatkan di tengah layar. Pendekatan itu berfungsi dengan baik untuk monitor tunggal beresolusi rendah yang lebih lama, tetapi tidak untuk perangkat keras video modern.

Windows dirancang untuk mendukung perangkat keras video modern, yang sering berjalan pada resolusi secara signifikan lebih tinggi dari resolusi layar minimum yang didukung dan mungkin memiliki beberapa monitor. Dengan melakukannya, akan:

• Memungkinkan pengguna untuk mendapatkan manfaat penuh dari perangkat keras tingkat lanjut mereka.
• Membutuhkan lebih sedikit upaya dari pengguna untuk memindahkan mouse mereka ke jarak yang lebih jauh.
• Membuat penempatan jendela lebih dapat diprediksi dan karenanya lebih mudah ditemukan.

Resolusi layar minimum yang didukung

Resolusi layar efektif minimum yang didukung oleh Windows adalah 800x600 piksel. Ini berarti bahwa jendela ukuran tetap harus ditampilkan sepenuhnya pada resolusi minimum (saat menyimpan ruang untuk taskbar), tetapi jendela yang dapat diubah ukurannya dapat dioptimalkan untuk resolusi efektif 1024x768 piksel selama berfungsi pada resolusi minimum.

Sementara saat ini resolusi layar fisik yang paling umum untuk PC Windows adalah 1024x768 piksel atau lebih besar, menargetkan 800x600 piksel memungkinkan Windows untuk:

• Bekerja dengan baik dengan semua perangkat keras modern, termasuk PC notebook kecil.
• Mendukung pengaturan dpi (titik per inci) tinggi.
• Mendukung font yang lebih besar untuk aksesibilitas.
• Mendukung perangkat keras yang digunakan secara global.

Memilih resolusi minimum untuk mendukung membutuhkan keseimbangan yang tepat. Menargetkan resolusi yang lebih tinggi akan menghasilkan pengalaman suboptimal untuk persentase perangkat keras modern yang signifikan, sedangkan menargetkan resolusi yang lebih rendah akan mencegah desainer memanfaatkan sepenuhnya ruang layar yang tersedia.

Jika Anda yakin bahwa pengguna target Anda menggunakan resolusi yang jauh lebih tinggi daripada minimum Windows, Anda dapat merancang program Anda untuk memanfaatkan sepenuhnya ruang layar tambahan dengan menggunakan jendela yang dapat diubah ukurannya dengan baik.

Panduan

Umum

• Mendukung resolusi efektif Windows minimum 800x600 piksel. Untuk antarmuka pengguna (UI) penting yang harus berfungsi dalam mode aman, mendukung resolusi efektif 640x480 piksel. Pastikan untuk mempertangungjawabkan ruang yang digunakan oleh taskbar dengan mengirimkan 48 piksel relatif vertikal untuk jendela yang ditampilkan dengan taskbar.
• Optimalkan tata letak jendela yang dapat diubah ukurannya untuk resolusi efektif 1024x768 piksel. Ubah ukuran jendela ini secara otomatis untuk resolusi layar yang lebih rendah dengan cara yang masih berfungsi.
• Pastikan untuk menguji jendela Anda dalam 96 dpi (100 persen) pada 800x600 piksel, 120 dpi (125 persen) pada 1024x768 piksel, dan 144 dpi (150 persen) pada 1200x900 piksel. Periksa masalah tata letak, seperti kliping kontrol, teks, dan jendela, serta peregangan ikon dan bitmap.
• Untuk program dengan skenario sentuhan dan penggunaan seluler, optimalkan untuk 120 dpi. Layar dpi tinggi saat ini lazim disentuh dan PC seluler.
• Jendela yang dapat diubah ukurannya tidak lagi harus menampilkan glyph perubahan ukuran di sudut kanan bawah, karena:
  • Semua sisi dan tepi jendela dapat diubah ukurannya, bukan hanya sudut kanan bawah.
  • Glyph memerlukan bilah status untuk ditampilkan, namun banyak jendela yang dapat diubah ukurannya tidak menyediakan bilah status.
  • Batas jendela yang dapat diubah ukurannya dan mengubah ukuran pointer lebih efektif dalam mengomunikasikan bahwa jendela dapat diubah ukurannya daripada glyph pengukur ukuran.

Kontrol bilah judul

Gunakan kontrol bilah judul sebagai berikut:

• Tutup. Semua jendela primer dan sekunder dengan bingkai jendela standar harus memiliki tombol Tutup pada bilah judul. Mengklik Tutup memiliki efek membatalkan atau menutup jendela.

Dalam contoh ini, kotak dialog tidak memiliki tombol Tutup di bilah judul.

• Meminimalkan. Semua jendela utama dan jendela sekunder tanpa mode jangka panjang (seperti dialog kemajuan) harus memiliki tombol Minimalkan. Mengklik Minimalkan mengurangi jendela ke tombol bilah tugasnya. Akibatnya, jendela yang dapat diminimalkan memerlukan ikon bilah judul.
• Maksimalkan/Pulihkan. Semua jendela yang dapat diubah ukurannya harus memiliki tombol Maksimalkan/Pulihkan ke bawah. Mengklik Maksimalkan menampilkan jendela dalam ukuran terbesarnya, yang untuk sebagian besar jendela adalah layar penuh; sedangkan mengklik Pulihkan ke bawah menampilkan jendela dalam ukuran sebelumnya. Namun, beberapa jendela tidak mendapat manfaat dari menggunakan layar penuh, sehingga jendela ini harus dimaksimalkan ke ukuran terbesar yang berguna.

Ukuran jendela

• Pilih ukuran jendela default yang sesuai untuk isinya. Jangan takut untuk menggunakan ukuran jendela awal yang lebih besar jika Anda dapat menggunakan ruang secara efektif.
• Gunakan jendela yang dapat diubah ukurannya kapan pun praktis untuk menghindari bilah gulir dan data yang terpotok. Windows dengan isi dinamis dan daftar paling diuntungkan dari jendela yang dapat diubah.
• Untuk dokumen teks, pertimbangkan panjang baris maksimum 65 karakter untuk membuat teks mudah dibaca. (Karakter mencakup huruf, tanda baca, dan spasi.)
• Jendela berukuran tetap:
  • Harus sepenuhnya terlihat dan berukuran agar pas di dalam area kerja.
• Jendela yang dapat diubah:
  • Dapat dioptimalkan untuk resolusi yang lebih tinggi, tetapi berukuran turun sesuai kebutuhan pada waktu tampilan ke resolusi layar aktual.
  • Untuk ukuran jendela yang semakin besar, harus menunjukkan informasi lebih lanjut secara progresif. Pastikan setidaknya satu bagian atau kontrol jendela memiliki isi yang dapat diubah ukurannya.
  • Harus menghindari ukuran default yang dipulihkan yang dimaksimalkan atau hampir dimaksimalkan. Sebagai gantinya, pilih ukuran default yang biasanya paling berguna tanpa layar penuh. Asumsikan bahwa pengguna akan memaksimalkan jendela alih-alih mengubah ukuran untuk membuatnya layar penuh.
  • Harus mengatur ukuran jendela minimum jika ada ukuran di bawah ini yang kontennya tidak lagi dapat digunakan. Untuk kontrol yang dapat diubah ukurannya, atur ukuran elemen minimum yang dapat diubah ukurannya ke ukuran fungsional terkecilnya, seperti lebar kolom fungsional minimum dalam tampilan daftar.
  • Harus mengubah presentasi jika melakukannya membuat konten dapat digunakan pada ukuran yang lebih kecil.

Dalam contoh ini, Pemutar Media Windows mengubah formatnya ketika jendela menjadi terlalu kecil untuk format standar.

Lokasi jendela

• Untuk panduan berikut, "berpusat" berarti bias penempatan vertikal sedikit terhadap bagian atas monitor, alih-alih menempatkan tepat di tengah. Letakkan 45 persen ruang antara bagian atas monitor/pemilik dan bagian atas jendela, dan 55 persen antara bagian bawah monitor/pemilik dan bagian bawah jendela. Lakukan ini karena mata secara alami bias terhadap bagian atas layar.

  

  "Tengah" berarti bias penempatan vertikal sedikit ke arah atas monitor.

• Jika jendela kontekstual, selalu tampilkan di dekat objek tempat jendela diluncurkan. Letakkan dari jalan sehingga objek sumber tidak ditutupi oleh jendela.

  • Jika ditampilkan menggunakan mouse, jika memungkinkan, letakkan offset ke bawah dan ke kanan.

  

  Tampilkan jendela kontekstual di dekat objek tempat objek diluncurkan.

  

  Windows yang diluncurkan dari ikon area pemberitahuan ditampilkan di dekat area pemberitahuan.

• Jika ditampilkan menggunakan pena, jika memungkinkan, tempatkan agar tidak tercakup oleh tangan pengguna. Untuk pengguna tangan kanan, tampilkan di sebelah kiri; jika tidak, tampilkan di sebelah kanan.

  

  Saat menggunakan pena, tampilkan juga jendela kontekstual sehingga tidak tercakup oleh tangan pengguna.

• Pengembang: Anda dapat membedakan antara peristiwa mouse dan peristiwa pena menggunakan GETMessageExtraInfo API. Anda dapat menentukan keseruan pengguna menggunakan SystemParametersInfo API dengan SPI_GETMENUDROPALIGNMENT.

• Tempatkan dialog kemajuan dari jalan di sudut kanan bawah monitor aktif.

  

  Tempatkan dialog kemajuan di sudut kanan bawah.

• Jika jendela tidak terkait dengan konteks saat ini atau tindakan pengguna, letakkan dari lokasi penunjuk saat ini. Melakukannya mencegah interaksi yang tidak disengaja.

• Jika jendela adalah aplikasi atau dokumen tingkat atas, selalu kaskade asalnya dari sudut kiri atas monitor. Jika dibuat oleh program aktif, gunakan monitor aktif; jika tidak, gunakan monitor default.

  

  Kaskade aplikasi tingkat atas atau jendela dokumen di sudut kiri atas monitor.

• Jika jendela adalah utilitas tingkat atas, selalu tampilkan "berpusat" di monitor. Jika dibuat oleh program aktif, gunakan monitor aktif; jika tidak, gunakan monitor default.

  

  Jendela utilitas tingkat atas tengah.

• Jika jendela adalah jendela yang dimiliki, awalnya tampilkan "berpusat" di atas jendela pemilik. Untuk tampilan berikutnya, pertimbangkan untuk menampilkannya di lokasi terakhirnya (relatif terhadap jendela pemilik) jika melakukannya cenderung lebih nyaman.

  

  Awalnya tengah jendela yang dimiliki di atas jendela pemilik.

• Untuk dialog tanpa mode, selalu tampilkan awalnya di atas jendela pemilik untuk membuatnya mudah ditemukan. Namun, jika pengguna mengaktifkan jendela pemilik, yang mungkin mengaburkan dialog tanpa mode.

  

  Tampilkan dialog tanpa mode awalnya di atas jendela pemilik untuk membuatnya mudah ditemukan.

• Jika perlu, sesuaikan lokasi awal sehingga seluruh jendela terlihat dalam monitor target. Jika jendela yang dapat diubah ukurannya lebih besar dari monitor target, kurangi agar pas.

Urutan jendela (urutan Z)

• Selalu tempatkan jendela yang dimiliki di atas jendela pemiliknya. Jangan pernah menempatkan jendela yang dimiliki di bawah jendela pemilik mereka, karena kemungkinan besar pengguna tidak akan melihatnya.
• Hormati pilihan pesanan Z pengguna. Ketika pengguna memilih jendela, hanya bawa jendela yang terkait dengan instans program tersebut (jendela ditambah pemilik atau jendela yang dimiliki) ke atas urutan Z. Jangan mengubah urutan jendela lain, seperti instans independen dari program yang sama.

Aktivasi jendela

• Menghormati pemilihan status jendela pengguna. Jika jendela yang ada perlu diperhatikan, flash tombol taskbar tiga kali untuk menarik perhatian dan membiarkannya disorot, tetapi jangan lakukan hal lain. Jangan pulihkan atau aktifkan jendela. Jangan gunakan efek suara apa pun. Sebagai gantinya, biarkan pengguna mengaktifkan jendela saat mereka siap.
  • Pengecualian: Jika jendela tidak muncul di taskbar, bawa ke bagian atas semua jendela lain dan flash bilah judulnya sebagai gantinya.
• Memulihkan jendela utama juga harus memulihkan semua jendela sekundernya, bahkan jika jendela sekunder tersebut memiliki tombol taskbar sendiri. Saat memulihkan, tempatkan jendela sekunder di atas jendela utama.

Fokus input

• Windows yang ditampilkan oleh tindakan yang dimulai pengguna harus mengambil fokus input, tetapi hanya jika jendela segera dirender (dalam 5 detik). Setelah jendela dirender, jendela dapat mengambil fokus input sekali.
  • Jika jendela dirender secara perlahan (lebih dari 5 detik), pengguna kemungkinan akan melakukan tugas lain saat menunggu. Mengambil fokus pada titik ini akan menjadi gangguan, terutama jika dilakukan lebih dari sekali.
• Windows yang tidak segera ditampilkan atau ditampilkan oleh tindakan yang dimulai sistem tidak boleh mengambil fokus input. Sebagai gantinya, tampilkan di atas tanpa fokus, dan biarkan pengguna mengaktifkannya saat mereka siap.
  • Pengecualian: Manajer Kredensial.

Persistensi

• Saat jendela diputar ulang, pertimbangkan untuk menampilkannya dalam keadaan yang sama seperti yang terakhir diakses. Saat menutup, simpan monitor yang digunakan, ukuran jendela, lokasi, dan status (dimaksimalkan vs. pemulihan). Saat memutar ulang, pulihkan ukuran jendela, lokasi, dan status yang disimpan menggunakan monitor yang sesuai. Selain itu, pertimbangkan untuk membuat atribut ini bertahan di seluruh instans program berdasarkan per pengguna. Pengecualian:
  • Jangan menyimpan atau membuat atribut ini bertahan untuk windows ketika penggunaannya singgah sehingga pengguna jauh lebih mungkin ingin memulai dari awal sepenuhnya.
  • Untuk program yang kemungkinan akan digunakan pada komputer Tablet Windows dan Teknologi Sentuh, simpan dua status jendela untuk mode lanskap dan potret. Untuk informasi selengkapnya, lihat Merancang untuk Berbagai Ukuran Tampilan.
• Jika konfigurasi monitor saat ini mencegah menampilkan jendela menggunakan status terakhirnya:
  • Coba tampilkan jendela menggunakan monitor terakhirnya.
  • Jika jendela lebih besar dari monitor, mengubah ukuran jendela seperlunya.
  • Pindahkan lokasi ke sudut kiri atas agar pas di dalam monitor seperlunya.
  • Jika langkah-langkah di atas tidak menyelesaikan masalah, kembali ke panduan penempatan jendela default. Pertimbangkan untuk memulihkan ukuran sebelumnya, jika memungkinkan.