Wizard

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.

Meskipun begitu, nama yang luar biasa, wizard tidak benar-benar bentuk khusus antarmuka pengguna, dan mereka hanya memiliki berbagai utilitas tertentu.

Wizard digunakan untuk melakukan tugas multi-langkah.

Cuplikan layar yang memperlihatkan wizard 'Tambahkan Printer' dengan perintah 'Tipe printer apa yang ingin Anda instal?'.

Cuplikan layar yang memperlihatkan wizard 'Tambahkan Printer' saat mencari printer yang tersedia.

cuplikan layar wizard tambahkan printer

Beberapa langkah wizard disajikan sebagai urutan halaman.

Wizard biasanya menyertakan tipe halaman berikut ini:

  • Halaman pilihan digunakan untuk mengumpulkan informasi dan memungkinkan pengguna membuat pilihan.
  • Halaman Penerapan digunakan untuk melakukan tindakan yang tidak dapat dibatalkan dengan mengklik Kembali atau Batal.
  • Halaman Kemajuan digunakan untuk memperlihatkan kemajuan operasi yang panjang.

Desain wizard modern menempatkan premium pada efisiensi, membuat halaman Kemajuan opsional untuk operasi yang lebih pendek, dan sering dispensing dengan halaman Selamat Datang tradisional dan halaman Selamat di awal dan akhir.

Semua halaman wizard memiliki komponen ini:

  • Bilah judul untuk mengidentifikasi nama wizard, dengan tombol Kembali di sudut kiri atas, dan tombol Tutup dengan tombol Minimalkan/Maksimalkan dan Pulihkan opsional. Perhatikan bahwa bilah judul juga menyertakan ikon untuk mengidentifikasinya di taskbar.
  • Instruksi utama untuk menjelaskan tujuan pengguna dengan halaman.
  • Area konten dengan teks opsional dan mungkin kontrol lainnya.
  • Area perintah dengan setidaknya satu tombol penerapan untuk berkomitmen pada tugas atau lanjutkan ke langkah berikutnya.

Meskipun wizard memiliki beberapa langkah, semua langkah ini harus ditambahkan ke satu tugas, dari sudut pandang pengguna. Ini adalah prinsip desain wizard mendasar dari "satu wizard, satu tugas."

Dengan demikian dalam artikel ini, tugas adalah fungsi dasar wizard (misalnya, tugas wizard penyiapan adalah menginstal program). Sub-tugas adalah aspek dari tugas yang lebih besar (misalnya, sub-tugas wizard penyetelan mungkin untuk mengonfigurasi program yang akan diinstal). Terakhir, setiap halaman wizard dianggap sebagai langkah dalam sub-tugas atau tugas tertentu (misalnya, mungkin ada dua atau tiga langkah yang terlibat dalam mengonfigurasi program).

Catatan: Panduan yang terkait dengan penyiapan, kotak dialog, dan bilah kemajuan disajikan dalam artikel terpisah.

Apakah ini antarmuka pengguna yang tepat?

Wizard dapat digunakan untuk tugas apa pun yang memerlukan beberapa langkah input. Namun, wizard yang efektif memiliki persyaratan tambahan:

  • Apakah wizard melakukan satu tugas atom? Jangan gunakan interaksi yang bukan tugas tunggal (seluruh program tidak boleh menjadi wizard kecuali melakukan satu tugas). Jangan gunakan wizard untuk menggabungkan tugas independen atau langkah-langkah yang sebagian besar tidak terkait.

  • Dapatkah jumlah pertanyaan yang diperlukan dikurangi? Apakah ada default yang dapat diterima yang berfungsi dengan baik untuk sebagian besar kasus atau dapat disesuaikan sesuai kebutuhan nanti? Akibatnya, dapatkah jumlah halaman dikurangi? Jika demikian, cobalah untuk menyederhanakan tugas sehingga dapat disajikan pada satu halaman (seperti kotak dialog), atau hilangkan kebutuhan input sepenuhnya (memungkinkan tugas dilakukan secara langsung).

  • Haruskah pertanyaan yang diperlukan disediakan secara berurutan? Apakah ada beberapa kemungkinan, tetapi pertanyaan opsional? Jika demikian, pertimbangkan kotak dialog atau kotak dialog bertab.

    Benar:

    cuplikan layar kotak dialog opsi cetak

    Kotak dialog Opsi Cetak Microsoft PowerPoint berisi banyak opsi input pengguna, sehingga Anda bisa menyajikannya dalam panduan. Namun, tidak perlu menyediakannya secara berurutan, jadi kotak dialog adalah pilihan yang lebih baik.

Wizard adalah bentuk antarmuka pengguna yang relatif berat; jika ada solusi yang cocok dan ringan tersedia, gunakan!

Konsep desain

Penggunaan wizard yang berlebihan

Secara historis, wizard berbeda dari antarmuka pengguna biasa karena dirancang untuk membantu pengguna melakukan tugas yang sangat kompleks (dengan langkah-langkah yang berada di lokasi yang berbeda) dan sering memiliki kecerdasan bawaan untuk membantu pengguna berhasil. Saat ini, semua UI harus dirancang untuk membuat tugas sesering mungkin, sehingga tidak perlu UI khusus hanya untuk tujuan ini.

Namun keyakinan berlanjut bahwa wizard adalah UI khusus—sebagian besar karena disebut sebagai "wizard" (jauh lebih kreatif daripada, katakanlah, "dialog" dan "jendela properti"). Sebaliknya, lebih baik menganggap mereka sebagai tugas multi-langkah dan tidak menarik perhatian khusus pada fakta itu.

Sebelum membuat wizard, pertimbangkan apakah pengguna benar-benar harus terganggu dari alur utama program. Mungkin ada solusi yang lebih ringan, sebaris, dan kontekstual yang pada akhirnya akan terasa lebih membantu dan efisien bagi pengguna. Misalnya, fitur yang dirancang dengan buruk dalam program tidak menjamin wizard untuk menjelaskan dan menyederhanakannya; ini menjamin desain ulang fitur itu sendiri. Wisaya tidak boleh digunakan sebagai bantuan pita untuk memperbaiki masalah yang lebih mendasar pada program.

Wizard memang memiliki fungsi yang sesuai

Wizard adalah salah satu kunci untuk menyederhanakan pengalaman pengguna. Ini memungkinkan Anda untuk mengambil operasi yang kompleks, seperti konfigurasi program, dan memecahnya menjadi serangkaian langkah sederhana. Pada setiap titik dalam proses, Anda dapat memberikan penjelasan tentang apa yang diperlukan, dan kontrol tampilan yang memungkinkan pengguna untuk membuat pilihan dan memasukkan teks.

Jenis tugas multi-langkah tertentu meminjamkan diri mereka ke formulir wizard. Misalnya, di Windows, beberapa wizard melibatkan fungsi konektivitas (ke Internet atau jaringan perusahaan, atau ke perangkat periferal seperti printer dan mesin faks).

cuplikan layar wizard koneksi

Menyambungkan ke jaringan adalah tugas umum di Windows yang sesuai untuk wisaya.

Di sini fungsi wizard adalah untuk menengahi antara sesuatu yang diketahui dan stabil (sistem operasi out-of-box) dan sesuatu yang tidak diketahui dan variabel (pengaturan konektivitas dengan perusahaan telepon atau penyedia layanan Internet). Kompleksitas ekosistem komputasi cukup signifikan sekarang karena benar-benar membantu menggunakan wizard untuk mengurangi kompleksitas tersebut.

Jenis tugas lain yang bekerja dengan baik sebagai wizard Windows termasuk fungsionalitas kelas atas (seperti pengenalan ucapan dan tulisan tangan) dan pengalaman media yang kaya (seperti mengonfigurasi opsi untuk membuat dan menerbitkan film). Wizard juga dapat disebarkan untuk tugas multi-langkah yang lebih mendasar, seperti pemecahan masalah. Singkatnya, jika pengguna yang berbeda cenderung ingin mengalami program Anda dengan cara yang sangat berbeda, ini dapat menunjukkan perlunya wizard dan kapasitasnya untuk beberapa titik input pengguna.

Untuk program Anda, ada baiknya sedikit waktu desain di muka untuk menentukan fungsi apa yang dilayani wizard Anda, dan apakah fungsi itu benar-benar naik ke tingkat penyebaran wizard.

Panjang wizard

Pertanyaan desain secara alami muncul di sekitar jumlah dan organisasi halaman dan opsi. Contohnya:

  • Apakah ada jumlah halaman yang optimal untuk panduan? Atau setidaknya rentang yang diinginkan?
  • Haruskah wizard ringkas dan disederhanakan, sehingga pengguna dapat menyelesaikannya secepat mungkin?
  • Haruskah ada lebih banyak halaman yang memerlukan lebih sedikit pilihan? Atau lebih sedikit halaman dengan kompleksitas lebih banyak? Desain mana yang dianggap lebih dapat digunakan?
  • Bisakah Anda merekayasa pengalaman wizard yang lebih cepat dengan menerapkan konvensi UI seperti halaman bertab?

Microsoft digunakan untuk memberi tahu bahwa wizard tiga halaman atau lebih sedikit dirancang sebagai wizard sederhana, dan yang dari empat halaman atau lebih menggunakan desain wizard tingkat lanjut (lihat panduan Pengalaman Pengguna Windows dari 1999). Tetapi standar desain wizard saat ini mengeluarkan dengan apa yang telah menjadi salah satu perbedaan utama antara bentuk sederhana dan lanjutan (penggunaan halaman Selamat Datang dan Selamat), sehingga kategori ini sekarang terasa tidak memadai, dan jumlah halaman yang menentukan pilihan desain tampaknya arbitrer.

Panduan Anda harus selama atau sesingkat yang diperlukan tugas; tidak ada pedoman tetap untuk panjangnya. Wizard satu halaman harus benar-benar disajikan sebagai kotak dialog, jadi dua halaman mungkin merupakan bentuk yang paling ringkas untuk wizard.

Benar:

cuplikan layar kotak dialog buat disk

Tugas ini memiliki begitu sedikit opsi yang menyajikannya sebagai panduan akan sia-sia. Kotak dialog adalah formulir yang sesuai untuk antarmuka pengguna ini.

Di ujung lain spektrum, jika Anda memiliki wizard yang menyertakan beberapa titik keputusan dan cabang, dan sering mengakibatkan pengguna kehilangan jejak jalur navigasi mereka, Anda telah melebihi batas praktis dan harus mengurangi panjang wizard. Atau, Anda mungkin dapat memecah wizard menjadi beberapa tugas yang berbeda.

Saat Anda menentukan panjang yang paling tepat untuk wizard Anda, perhatikan pengguna target Anda. Program untuk pengguna akhir seperti konsumen rumahan dan pekerja kantor cenderung menggunakan wizard untuk menyembunyikan kompleksitas; wizard sesingkat mungkin, dengan desain halaman yang bersih, sederhana, dan default yang telah dipilih sebelumnya untuk opsi sebanyak mungkin. Sebaliknya, wizard server atau program yang ditujukan untuk profesional TI cenderung lebih panjang dan lebih kompleks. Kelompok pengguna target ini memiliki toleransi yang jauh lebih tinggi untuk membuat keputusan konfigurasi, dan bahkan mungkin menjadi mencurigakan jika terlalu banyak kompleksitas tersembunyi.

Jika wizard berdasarkan alam menyederhanakan tugas yang kompleks, wizard harus melakukannya relatif minimal untuk audiens yang canggih secara teknis, dan relatif agresif untuk basis pengguna pemula.

Benar:

cuplikan layar wizard bahasa tampilan

Halaman wizard ini dirancang dengan baik untuk pengguna akhir karena mengurangi subjek yang berpotensi kompleks terhadap pilihan biner logis yang sederhana: baik menginstal atau menghapus instalasi.

Benar:

Cuplikan layar yang memperlihatkan halaman 'Pemilihan Fitur' wizard 'Penyetelan SQL Server'.

Dalam wizard penyiapan untuk Microsoft SQL Server 2008, desain halaman lebih sibuk dan berbagai pilihan memerlukan lebih banyak pemikiran, tetapi audiens target adalah administrator database yang mengharapkan kontrol ketat atas pemilihan fitur.

Terakhir, perhatikan seberapa sering tugas tertentu mungkin dilakukan. Tugas yang jarang terjadi dapat menyebarkan wizard yang lebih panjang, sedangkan tugas yang sering pasti akan mendukung keringkasan.

Pencabangan

Untuk wizard yang lebih panjang, Anda mungkin perlu membuat cabang alur tugas di mana urutan halaman mungkin berbeda sesuai dengan input pengguna yang disediakan "upstream." Percabangan secara inheren dislokasi untuk pengguna, jadi Anda harus merancang pengalaman pengguna untuk menyampaikan stabilitas. Kami merekomendasikan tidak lebih dari dua poin keputusan yang akan menyebabkan percabangan di seluruh wizard, dan tidak lebih dari satu cabang berlapis dalam satu cabang.

Untuk panduan tentang membuat pengalaman pengguna yang stabil dalam wizard percabangan, lihat Percabangan di bagian Panduan di artikel ini.

Menyediakan panduan navigasi

Panduan navigasi dapat berguna ketika ada banyak langkah dalam tugas, dan pengguna mungkin kehilangan tempat mereka secara berurutan, atau hanya ingin tahu berapa lama waktu yang diperlukan untuk menyelesaikannya.

Panduan navigasi sering muncul sebagai daftar halaman atau bagian panduan, terlihat sedikit seperti daftar isi, di kolom atau panel di sisi kiri setiap halaman. Meskipun daftar tetap ada di seluruh wizard (daftar halaman yang sama muncul di setiap halaman), ada beberapa cara visual yang menunjukkan di mana pengguna saat ini berada dalam urutan (misalnya, menggunakan tebal untuk membedakan halaman atau bagian aktif).

Panduan navigasi bisa berurutan atau tidak berurutan. Jenis berurutan menyajikan halaman sebelumnya bersama dengan halaman mendatang yang diketahui. Anda dapat menyajikan masa depan dalam hal langkah-langkah, bukan halaman jika langkah-langkahnya diketahui dan halaman bergantung. Anda kemudian dapat mengisi halaman secara dinamis saat halaman diketahui. Karena urutan navigasi diperbaiki, panduan navigasi tidak interaktif.

Panduan navigasi non-berurutan bersifat interaktif, sehingga pengguna dapat mengunjungi kembali halaman yang ditampilkan sebelumnya secara langsung. Mereka juga dapat melewati urutan navigasi untuk halaman yang dirancang agar opsional. Halaman opsional harus memiliki default yang dapat diterima dalam sebagian besar keadaan. Dengan jenis panduan ini:

  • Halaman yang dilihat sebelumnya selalu dapat dilihat secara langsung.
  • Halaman mendatang mungkin tidak ditampilkan jika memiliki prasyarat.
  • Halaman yang dapat dikunjungi harus dibedakan dengan jelas dari halaman yang tidak dapat (seperti dengan menggunakan tautan yang aktif atau dinonaktifkan), bersama dengan halaman yang diperlukan atau opsional.

Pengguna dapat menjadi bingung tentang arti tombol Kembali dalam skenario ini. Apakah mengklik Kembali mengarahkan Anda ke halaman atau bagian sebelumnya di panduan navigasi, atau halaman atau bagian terakhir yang ditampilkan? Karena wizard Windows sekarang menempatkan tombol Kembali di sudut kiri atas halaman wizard, bukan di sudut kanan bawah dengan tombol penerapan lainnya, pengguna menganggap fungsionalitas Kembali seperti yang mereka lakukan di Web. Jadi solusi terbaik adalah memberi tombol Kembali Anda makna navigasi Web (mengklik Kembali harus mengarah ke halaman terakhir atau bagian yang ditampilkan), dan menggunakan panduan navigasi wizard untuk navigasi berurutan.

Integritas halaman

Desain wizard tidak hanya melibatkan keputusan yang berkaitan dengan seluruh alur tugas, seperti cara menangani navigasi dan pengalaman percabangan, tetapi juga yang berkaitan dengan halaman individual yang membentuk wizard. Prinsip terpenting untuk merancang halaman wizard yang baik adalah integritas: konten halaman harus dimiliki bersama.

Halaman wizard secara signifikan lebih dapat digunakan jika masing-masing menggantung bersama secara konseptual, hanya berurusan dengan satu aspek dari keseluruhan tugas. Instruksi utama adalah cara utama untuk mencapai ini. Identifikasi tujuan atau tujuan halaman dengan jelas kepada pengguna. Instruksi tambahan, dan kontrol apa pun di halaman, semuanya berkaitan langsung dengan instruksi utama. Meskipun halaman wizard harus menyajikan pengguna dengan opsi yang diperlukan beberapa pemikiran, upaya itu tidak terasa seperti pekerjaan karena difokuskan dengan erat oleh integritas halaman itu sendiri.

Sayangnya perancang wizard sering kali salah mengeklik tombol Next pengguna dengan cepat sebagai bukti kegunaan, kesederhanaan, dan integritas halaman mereka. Pengalaman wizard utama bukan Berikutnya, Berikutnya, Berikutnya, Berikutnya, Selesai. Meskipun pengalaman seperti itu menunjukkan bahwa default dipilih dengan baik, itu juga menunjukkan bahwa wizard tidak benar-benar diperlukan karena semua pilihan bersifat opsional.

Dalam hal visual dan teks, pare down elemen-elemen ini ke hal-hal penting yang telanjang. Tahan keinginan untuk menggabungkan beberapa sub-tugas pada satu halaman ("wizard burrito") atau untuk menggunakan tab untuk menyajikan persyaratan input yang kompleks. Satu halaman harus mencakup satu sub-tugas dari keseluruhan tugas wizard.

Salah:

cuplikan layar wizard penyiapan server sql

Dengan tiga tab input pengguna yang cukup padat diperlukan, halaman wizard ini mencoba mencapai terlalu banyak.

Dalam kebanyakan kasus, pertahankan ukuran setiap halaman di seluruh wizard untuk menumbuhkan tampilan dan nuansa yang konsisten. Meskipun panduan Windows memungkinkan halaman yang dapat diubah ukurannya sehingga ukuran halaman cocok dengan jumlah isi, hanya beberapa yang memanfaatkan opsi ini.

Dan akhirnya, pertahankan elemen struktural dari setiap halaman wizard melalui urutan. Misalnya, jangan pindahkan tombol Kembali dari sudut kiri atas kembali ke bawah ke area tombol penerapan untuk satu atau dua halaman. Tingkat konsistensi tata letak ini membantu pengguna merasa stabil dalam wizard. Anggap ini sebagai garis besar untuk integritas visual halaman.

Menemukan tingkat komunikasi yang tepat

Pengguna memiliki toleransi rendah untuk membaca blok besar teks di layar, dan bahkan kurang begitu dalam permukaan UI yang tujuan ekspresnya adalah untuk bergerak secara eksplisit melalui tugas.

Wizard memiliki kecenderungan untuk berkomunikasi secara berlebihan. Mereka mengambil banyak ruang di layar, yang tampaknya mendorong drive untuk mengisi ruang. Ini seperti variasi pada Parkinson's Law: teks UI akan diperluas untuk mengisi ruang yang tersedia.

Salah satu pelaku dalam kelebihan ini adalah redundansi. Karena templat yang digunakan dalam desain wizard awal, bahasa yang sama mungkin muncul di beberapa lokasi pada halaman, seperti di bilah judul, judul, teks isi, label kontrol, dan sebagainya.

Layak untuk menyewa editor profesional untuk memangkas teks wizard Anda dengan kejam. Hilangkan pertanyaan dan opsi yang tidak perlu di halaman individual, dan hilangkan seluruh halaman dari wizard secara keseluruhan (misalnya, halaman Selamat Datang dan Selamat tradisional). Langsung ke titik halaman dengan instruksi utama yang ditulis secara ringkas, menggunakan bahasa yang digunakan audiens target Anda untuk menggambarkan tugas, bukan jargon teknologi atau fitur yang Anda atau tim Anda gunakan secara internal. Pendekatan yang berfokus pada pengguna ini sangat penting untuk meningkatkan komunikasi wizard program Anda.

Beri perhatian khusus pada nada wizard Anda: kadang-kadang kesan paling abadi dari program Anda adalah hasilnya bukan dari apa yang Anda katakan tetapi bagaimana Anda mengatakannya! Dalam wizard, pengguna nyaman dengan nada percakapan yang ramah, dengan penggunaan liberal kata ganti orang kedua ("Anda") ketika program meminta masukan. Untuk panduan selengkapnya, lihat Gaya dan Nada.

Mengurangi jumlah kata pada halaman wizard umumnya dapat dipuji, tetapi berhati-hatilah untuk tidak terlalu jauh. Jika tugas itu penting dan menjamin wizard, pengguna menghargai memiliki informasi yang cukup untuk membuat pilihan yang bijaksana. Contoh berikut menunjukkan bagaimana teks wizard dapat diringkas tanpa mengorbankan makna.

Sebelumnya:

cuplikan layar wizard cleartype, draf

Setelahnya:

cuplikan layar wizard cleartype, direvisi

Versi yang diedit dari halaman wizard ini menyediakan instruksi utama berorientasi tugas, menghapus paragraf penjelasan yang tidak perlu di bawah instruksi utama, dan merevisi label kotak centang untuk mengklarifikasi tujuan kotak centang.

Jika Anda hanya melakukan tiga hal ...

  1. Petakan tugas yang anda coba selesaikan dengan UI yang sesuai untuk melakukan pekerjaan; jangan hanya default ke wizard ketika Anda berpikir Anda perlu mengumpulkan banyak input dari pengguna.

  2. Pikirkan dengan cermat tentang panjang dan struktur wizard Anda; lebih suka wizard pendek dan tidak bercabang untuk menjaga pengalaman sesederhana mungkin, sehingga pengguna dapat kembali ke tugas utama atau minat mereka pada program Anda.

  3. Pastikan integritas setiap halaman dalam wizard Anda: konten halaman harus benar-benar menjadi milik bersama.

Panduan

Umum

  • Pertimbangkan alternatif ringan terlebih dahulu, seperti kotak dialog, panel tugas, atau satu halaman. Anda tidak perlu menggunakan wizard—Anda dapat memberikan informasi dan bantuan yang bermanfaat di UI apa pun.

  • Gunakan wizard untuk tugas multi-langkah. Gunakan kotak dialog multi-halaman untuk tugas satu langkah dengan umpan balik. Untuk panduan selengkapnya, lihat Kotak Dialog.

    Benar:

    cuplikan layar kotak dialog diagnostik

    cuplikan layar umpan balik dialog diagnostik

    Dalam contoh ini, Diagnostik Jaringan Windows terdiri dari halaman kemajuan dan hasil. Karena tugas hanya satu langkah, tugas tidak memerlukan tombol navigasi yang dibutuhkan pengguna dalam wizard. Ini secara efektif disajikan sebagai kotak dialog multi-halaman.

Ukuran jendela

  • Pilih ukuran jendela yang bisa menampilkan semua halaman panduan tanpa pengguliran halaman vertikal atau horizontal. Meskipun kontrol pada halaman mungkin memerlukan pengguliran, halaman wizard itu sendiri tidak boleh.

  • Ukuran jendela cukup besar untuk melakukan tugas mereka dengan nyaman. Tata letak halaman tidak boleh sempit atau mengharuskan pengguna untuk menggulir atau mengubah ukuran secara berlebihan.

  • Tapi jangan membuat jendela terlalu besar. Jendela yang lebih besar membuat tugas terasa lebih kompleks dan memerlukan gerakan tambahan untuk interaksi.

  • Gunakan jendela yang dapat diubah ukurannya untuk wizard yang dapat memperoleh manfaat dari lebih banyak ruang layar tetapi tidak memerlukannya. Tetapkan ukuran minimum yang sesuai. Jendela yang dapat diubah ukurannya berguna ketika halaman memerlukan interaksi dengan konten yang dapat diubah ukurannya seperti tampilan daftar besar.

    Benar:

    cuplikan layar penyiapan studio visual, daftar parsial

    Lebih:

    cuplikan layar penyiapan visual studio, daftar lengkap

    Dalam contoh ini, mengubah ukuran jendela membantu pengguna melihat daftar lengkapnya.

  • Pertimbangkan untuk menggunakan wizard berukuran dinamis yang ukuran halamannya berubah sesuai kebutuhan untuk kontennya. Melakukannya memungkinkan wizard untuk mengakomodasi tata letak halaman dengan berbagai konten.

  • Lebih suka ukuran statis daripada dinamis jika pengguna dapat melihat perubahan sebagai kurangnya stabilitas dalam pengalaman mereka tentang wizard. Stabilitas visual sering kali meniru akomodasi konten. Sebagian besar wizard harus mengadopsi ukuran jendela statis standar, dengan ukuran dinamis yang disediakan untuk kasus khusus.

Panjang wizard

  • Buat wizard Anda sesingkat dan sesederhana mungkin. Singkirkan opsi dan pertanyaan yang tidak perlu, dan gunakan default cerdas, untuk mengurangi jumlah halaman yang diperlukan untuk input pengguna.
    • Pengecualian: Profesional TI dan pengguna teknis lainnya memiliki toleransi yang lebih tinggi untuk wizard yang lebih panjang dan persyaratan input terperinci.
  • Jadikan wizard Anda minimal dua halaman. Panduan satu halaman harus didesain ulang sebagai kotak dialog sebagai gantinya.
  • Jangan mengurangi jumlah halaman wizard hanya dengan meningkatkan kompleksitas setiap halaman. Misalnya, halaman wizard yang menyertakan tiga tab yang memerlukan input pengguna harus dirancang ulang sebagai tiga halaman terpisah.
  • Jangan tingkatkan jumlah halaman wizard dengan membuat setiap halaman begitu sederhana sehingga pengguna dengan mudah mengklik Berikutnya melalui seluruh urutan. Ini adalah kelemahan desain wizard umum. Jika halaman wizard tidak memerlukan setidaknya beberapa tingkat pemikiran, halaman tersebut mungkin tidak perlu berada di wizard sama sekali.

Pencabangan

  • Lebih suka desain wizard non-percabangan daripada percabangan. Wizard non-percabangan cenderung lebih sederhana, lebih pendek, dan mudah dinavigasi. Wizard percabangan membuatnya lebih sulit bagi pengguna untuk menentukan berapa banyak langkah dalam tugas, dan di mana mereka berada secara berurutan.

  • Jika Anda harus bercabang, bantu pengguna berorientasi pada diri mereka sendiri dengan menggunakan salah satu teknik berikut:

    • Hitung halaman. Teknik umumnya adalah menunjukkan lokasi pengguna dalam urutan di setiap halaman, seperti dengan frasa Langkah X dari Y. Pastikan titik akhir (Y) stabil. Jika nilai berubah, ini merusak kepercayaan diri pengguna.

    • Sertakan gagasan sub-langkah (seperti Langkah 2a dari 6).

    • Buat langkah-langkah independen dari halaman, di mana setiap langkah mungkin melibatkan beberapa halaman. Misalnya, layanan perjalanan mungkin menggunakan organisasi wizard berdasarkan konvensi e-niaga yang mapan untuk industri.

      Benar:

      cuplikan layar organisasi wizard berbasis langkah

      Label logis dapat memberikan orientasi yang memadai untuk pengguna wizard percabangan.

    • Perlakukan langkah-langkah opsional sebagai persisten dalam urutan enumerasi. Misalnya, jika cabang hanya melewatkan beberapa langkah opsional, cukup lewati langkah-langkah dalam umpan balik juga, daripada berjumlah ulang. Dengan demikian, jika pengguna membuat pilihan di halaman 2 yang menghasilkan membuat halaman 3 dan 4 opsional, tampilkan langkah 1, 2, 5, dan 6 dari 6. Jangan hitung ulang langkah 5 dan 6.

    • Jika wizard menggunakan satu cabang, dan cabang terjadi di awal tugas, mulai urutan pada saat itu, dan kemudian cukup gunakan pendekatan non-percabangan. Artinya, dimulai pada titik cabang, maju secara berurutan ke akhir cabang.

  • Jika Anda harus bercabang, batasi jumlah cabang menjadi satu atau dua dalam satu wizard. Jangan pernah menyertakan lebih dari satu cabang dalam cabang (cabang "berlapis").

Tombol Terapkan

  • Saat pengguna berkomitmen pada tugas, gunakan tombol penerapan yang merupakan respons khusus terhadap instruksi utama (misalnya, Cetak, Sambungkan, atau Mulai). Jangan gunakan label generik seperti Berikutnya (yang tidak menyiratkan komitmen) atau Selesai (yang tidak spesifik) untuk melakukan tugas. Label pada tombol penerapan ini harus masuk akal sendiri. Selalu mulai terapkan label tombol dengan kata kerja. Pengecualian:
    • Gunakan Selesai saat respons tertentu masih umum, seperti Simpan, Pilih, Pilih, atau Dapatkan.
    • Gunakan Selesai untuk mengubah pengaturan tertentu atau kumpulan pengaturan.
  • Satu wizard dapat memiliki beberapa titik penerapan, tetapi satu titik lebih disukai.
  • Jika perlu, Anda dapat mengganti nama atau menyembunyikan tombol penerapan di halaman. Fleksibilitas ini adalah salah satu keuntungan dari desain wizard baru di Windows yang tidak tersedia di wizard yang lebih lama. Perhatikan bahwa menyembunyikan tombol penerapan berbeda dari menonaktifkannya.
  • Hindari menonaktifkan tombol penerapan positif. Jika tidak, pengguna harus menyimpulkan mengapa tombol penerapan dinonaktifkan. Lebih baik membiarkan tombol penerapan diaktifkan, dan memberikan pesan kesalahan yang bermanfaat setiap kali masalah muncul. Menonaktifkan tombol hanya dapat diterima jika alasan untuk melakukannya jelas dan tidak ambigu.
  • Jangan bingung tombol navigasi (Berikutnya dan Kembali) dengan tombol penerapan. Selanjutnya berarti untuk maju dalam wizard tanpa komitmen; Kembali harus selalu tersedia di halaman berikutnya, dan mengklik Kembali harus membatalkan efek tombol Berikutnya terakhir. Jika itu tidak memungkinkan, pengguna membuat komitmen, dan itu ditunjukkan melalui label tertentu pada tombol penerapan. Untuk panduan selengkapnya tentang tombol Berikutnya dan Kembali, lihat Navigasi.

Tombol Batal

  • Jangan meminta pengguna untuk mengonfirmasi apakah mereka benar-benar berniat untuk membatalkan. Melakukannya bisa mengganggu. Pengecualian:
    • Tindakan ini memiliki konsekuensi yang signifikan dan, jika salah, tidak mudah diperbaiki.
    • Tindakan ini dapat mengakibatkan hilangnya waktu atau upaya pengguna secara signifikan.
    • Tindakan ini jelas tidak konsisten dengan tindakan lain.
  • Perbolehkan pengguna untuk menghidupkan ulang wizard jika mereka dibatalkan secara tidak sengaja.
  • Jangan nonaktifkan tombol Batalkan. Pengecualian:
    • Jika pembatalan berbahaya, yang mungkin terjadi saat melakukan tugas dalam wizard mandiri.
    • Jika membatalkan tidak mungkin, yang mungkin terjadi ketika wizard tidak memiliki kontrol atas semua langkah.

Tombol tutup

  • Gunakan Tutup untuk halaman Follow-Up dan Penyelesaian. Jangan gunakan Batal, karena menutup jendela tidak akan mengabaikan perubahan atau tindakan apa pun yang dilakukan pada saat ini. Jangan gunakan Selesai, karena itu bukan kata kerja imperatif.
  • Setelah tugas dilakukan, Batal harus menjadi Tutup (untuk wizard mandiri). Efek Tutup hanyalah menutup jendela.

Kontrol lainnya

  • Gunakan tautan perintah hanya untuk pilihan, bukan komitmen. Tombol penerapan tertentu menunjukkan komitmen yang jauh lebih baik daripada tautan perintah dalam wizard.
  • Saat menggunakan tautan perintah, sembunyikan tombol Berikutnya, tetapi biarkan tombol Batal.

Menggunakan halaman (vs. kotak dialog atau antarmuka pengguna sebaris)

  • Secara umum, lebih suka halaman ke kotak dialog. Pengguna mengharapkan wizard berbasis halaman.
  • Gunakan kotak dialog untuk membantu menyelesaikan halaman, seperti dengan pemilih objek dan browser.
  • Gunakan kotak dialog untuk memberikan pesan kesalahan yang berlaku untuk seluruh halaman, dan hasil dari mengklik tombol penerapan.
  • Gunakan presentasi sebaris untuk perilaku dinamis sederhana, seperti pengungkapan progresif dan UI kontekstual.
  • Gunakan presentasi sebaris untuk pesan kesalahan yang berlaku untuk kontrol tertentu.

Halaman panduan

  • Fokus pada pengambilan keputusan yang efisien. Kurangi jumlah halaman untuk fokus pada hal-hal penting. Konsolidasikan halaman terkait, dan keluarkan halaman opsional dari alur utama. Meminta pengguna mengklik Berikutnya sepenuhnya melalui wizard Anda mungkin tampak seperti pengalaman yang baik pada awalnya, tetapi jika pengguna tidak perlu mengubah default, halaman mungkin tidak perlu.

  • Rancang setiap halaman untuk memiliki satu tujuan dan konsistensi visual. Untuk informasi selengkapnya, lihat Integritas halaman.

  • Jangan gunakan halaman Selamat Datang—buat halaman pertama berfungsi jika memungkinkan. Gunakan halaman Memulai opsional hanya saat:

    • Wizard memiliki prasyarat yang diperlukan untuk menyelesaikan wizard dengan sukses.
    • Pengguna mungkin tidak memahami tujuan wizard berdasarkan halaman Pilihan pertamanya, dan tidak ada ruang untuk penjelasan lebih lanjut.
    • Instruksi utama untuk halaman Memulai adalah "Sebelum Anda mulai:".

    Salah:

    cuplikan layar halaman selamat datang penyiapan mappoint

  • Wizard modern memilih halaman pertama fungsi. Di sini tidak ada yang perlu dilakukan tetapi klik Berikutnya. Mengapa memaksa pengguna untuk membayar pajak token ini pada waktu berharga mereka?

  • Pada halaman di mana pengguna diminta untuk membuat pilihan, optimalkan untuk kasus yang paling mungkin. Jenis halaman ini harus menyajikan pilihan aktual, bukan hanya instruksi.

    • Jika Anda tidak menggunakan halaman Memulai, jelaskan tujuan wizard di bagian atas halaman pertama pilihan.
  • Gunakan halaman Penerapan untuk memperjelas saat pengguna melakukan tugas. Biasanya halaman Penerapan adalah halaman terakhir pilihan, dan tombol Berikutnya diberi label ulang untuk menunjukkan tugas yang sedang dilakukan.

    • Jangan gunakan halaman Ringkasan yang hanya meringkas pilihan pengguna sebelumnya, kecuali tugas berisiko (melibatkan keamanan, atau kehilangan waktu atau uang) atau ada kemungkinan pengguna perlu meninjau pilihan mereka.
  • Gunakan halaman Kemajuan untuk memperlihatkan status operasi yang panjang. Setelah berhasil diselesaikan, halaman kemajuan harus maju ke langkah berikutnya secara otomatis. Ini harus tetap berada di halaman kemajuan hanya jika ada masalah yang perlu dilihat pengguna. Mengklik Kembali ke halaman kemajuan seharusnya tidak memiliki efek samping.

    • Gunakan bilah kemajuan tunggal yang menentukan. Ikuti panduan bilah kemajuan penentuan, termasuk:
      • Menunjukkan penyelesaian dengan jelas. Jangan biarkan bilah kemajuan masuk ke 100 persen kecuali operasi telah selesai.
      • Jangan mulai ulang kemajuan. Bilah kemajuan kehilangan nilainya jika dimulai ulang (mungkin karena langkah dalam operasi selesai) karena pengguna tidak memiliki cara untuk mengetahui kapan operasi akan selesai. Sebagai gantinya, buat semua langkah dalam operasi berbagi sebagian kemajuan dan minta bilah kemajuan selesai sekali.
    • Berikan deskripsi ringkas tentang langkah saat ini di atas bilah kemajuan. Untuk operasi cepat, teks tersebut tidak perlu; bilah kemajuan saja sudah cukup. Untuk operasi yang membutuhkan waktu satu menit atau lebih, teks dapat membantu.
      • Gunakan fragmen kalimat, biasanya dimulai dengan kata kerja, dan diakhpuni dengan elipsis. Contoh: Menyalin file..., Menginstal komponen yang diperlukan... .
      • Tempatkan teks di atas bilah, bukan di bawah ini.
      • Salah:
      • cuplikan layar bilah kemajuan dengan teks di bawah ini
      • Dalam contoh ini, teks penjelasan akan muncul di atas bilah kemajuan.
      • Menahan diri dari mengacaukan halaman kemajuan dengan detail yang tidak perlu. Halaman ini bukan untuk dukungan teknis; ini untuk pengguna.
      • Salah:
      • cuplikan layar bilah kemajuan dengan terlalu banyak detail
      • Dalam contoh ini, detail teknis seperti GUID tidak berarti bagi pengguna.
  • Jangan gunakan halaman Selamat yang tidak melakukan apa pun selain mengakhiri wizard. Jika hasil wizard jelas bagi pengguna, cukup tutup wizard pada tombol penerapan akhir.

    • Gunakan halaman Follow-Up ketika ada tugas terkait yang kemungkinan dilakukan pengguna sebagai tindak lanjut. Hindari tugas tindak lanjut yang sudah dikenal, seperti "Kirim pesan email."
    • Gunakan halaman Penyelesaian hanya saat hasil tidak terlihat dan tidak ada cara yang lebih baik untuk memberikan umpan balik untuk penyelesaian tugas.
    • Panduan yang memiliki halaman Kemajuan harus menggunakan halaman Penyelesaian atau halaman Follow-Up untuk menunjukkan penyelesaian tugas. Untuk tugas jangka panjang, tutup wizard di halaman Terapkan dan gunakan pemberitahuan untuk memberikan umpan balik.
  • Gunakan halaman Ringkasan hanya jika input rumit dan pengguna perlu meninjau, jika tugas melibatkan risiko signifikan (seperti transisi keuangan), atau jika wizard akan mengambil tindakan berdasarkan input pengguna yang tidak jelas (untuk membangun kepercayaan melalui transparansi). Sering kali, halaman ringkasan tidak memenuhi bilah relevansi ini, dan dapat dihilangkan.

  • Gunakan halaman kesalahan jika wizard tidak dapat diselesaikan karena masalah dari mana pemulihan tidak dimungkinkan. Pada halaman ini, jelaskan apa masalahnya dalam bahasa yang jelas, bebas dari pengguna jargon teknis tidak akan mengerti. Juga menyediakan langkah-langkah praktis yang dapat diambil pengguna untuk menyelesaikan masalah. Untuk panduan selengkapnya, lihat Pesan Kesalahan.

    • Pengecualian: Jika wizard selesai dengan masalah kecil dari mana pemulihan dimungkinkan, sajikan masalah sebagai tugas tambahan alih-alih kesalahan. Gunakan bahasa yang positif, berorientasi keberhasilan, mendorong, bukan istilah seperti kesalahan, kegagalan, atau masalah. Jangan gunakan ikon kesalahan.
  • Gunakan Berikutnya hanya saat maju ke halaman berikutnya tanpa komitmen. Maju ke halaman berikutnya dianggap sebagai komitmen ketika efeknya tidak dapat dibatalkan dengan mengklik Kembali atau Batal.
  • Gunakan Kembali hanya untuk memperbaiki kesalahan. Selain memperbaiki kesalahan, pengguna tidak perlu mengklik Kembali untuk membuat kemajuan dalam tugas.
  • Pertahankan pilihan pengguna melalui navigasi. Misalnya, jika pengguna membuat perubahan, klik Kembali lalu Berikutnya, perubahan tersebut harus dipertahankan. Pengguna tidak berharap harus memasukkan kembali perubahan kecuali mereka secara eksplisit memilih untuk menghapusnya.
  • Jangan nonaktifkan tombol Kembali kecuali mengulangi langkah-langkahnya berbahaya.
  • Izinkan pengguna untuk menelusuri atau merevisi pilihan dalam skenario navigasi berikut:
    • Pengguna memberikan input, klik tombol terapkan, klik Kembali untuk meninjau perubahan sebelumnya, tidak mengubah apa pun, lalu mengklik tombol terapkan lagi. Biasanya, ini harus dimungkinkan dan penerapan kedua hanya harus maju ke halaman berikutnya (karena tugas telah dilakukan).
    • Pengguna memberikan input, klik tombol terapkan, klik Kembali untuk meninjau perubahan sebelumnya, mengubah sesuatu, lalu mengklik tombol terapkan lagi. Biasanya, ini harus dimungkinkan dan penerapan kedua harus mengulangi tugas dengan input yang diubah (mengganti atau membatalkan efek yang pertama).

Bantuan

  • Halaman panduan desain untuk menyediakan informasi yang cukup sehingga mengacu pada dokumentasi dalam Bantuan program tidak diperlukan. Wizard sudah menjauhkan pengguna dari interaksi langsung yang diinginkan dengan program; mengharuskan pengguna untuk mencari Bantuan eksternal menghapusnya lebih jauh dari status ini. Bantuan harus menjadi pengecualian, bukan aturan.
  • Jika Anda harus memberikan titik akses ke Bantuan, gunakan tautan di bagian kiri bawah area konten halaman (di atas area perintah). Tautan ini harus singkat, dan biasanya diungkapkan dalam bentuk pertanyaan yang kemungkinan besar ingin dijawab oleh pengguna.
  • Benar:
  • cuplikan layar halaman wizard dengan tautan bantuan
  • Tautan ke Bantuan ini sesuai karena informasi latar belakang dasar seperti ini akan mengacaukan halaman panduan terlalu banyak.

Teks

Umum

  • Gunakan Anda dan Anda untuk merujuk ke pengguna dan komputer pengguna, dokumen, pengaturan, dan sebagainya. Jangan gunakan orang pertama (saya, saya) untuk merujuk ke komputer atau wizard. Namun, dapat diterima untuk menggunakan orang pertama dalam opsi yang dipilih pengguna. Contoh:Kotak centang Penggunaan saya saja .
  • Setiap halaman wizard harus memiliki instruksi utama.

Judul

  • Letakkan nama panduan di bilah judul. Gunakan kapitalisasi gaya judul.
  • Judul tidak boleh menyertakan tanda baca, kecuali judul dengan tanda tanya.
  • Jangan sertakan kata Wizard dalam judul panduan. Misalnya, gunakan Sambungkan ke Jaringan alih-alih Wizard Penyetelan Jaringan.

Tombol

  • Jangan sertakan teks pada tombol Kembali. Gunakan tanda panah sebagai gantinya, tanpa label.

  • Sertakan teks pada tombol Berikutnya. Jangan gunakan glyph (seperti > atau >>) selain kata Berikutnya.

  • Gunakan label tombol penerapan tertentu yang masuk akal sendiri dan merupakan respons terhadap instruksi utama. Idealnya pengguna tidak perlu membaca hal lain untuk memahami label. Pengguna jauh lebih mungkin membaca label tombol perintah daripada teks statis.

  • Jika memungkinkan, jangan gunakan kata Selesai untuk label tombol penerapan, karena biasanya ada tombol penerapan yang lebih baik dan lebih spesifik:

    • Jika mengklik tombol berkomitmen pada tugas (sehingga tugas belum dilakukan), gunakan label tertentu yang dimulai dengan kata kerja yang merupakan respons terhadap instruksi utama (contoh: Cetak, Sambungkan, Mulai).

    • Jika tugas telah dilakukan dalam panduan, gunakan Tutup sebagai gantinya.

      Pengecualian:

      • Anda dapat menggunakan Selesai saat label tertentu masih umum, seperti Simpan, Pilih, Pilih, atau Dapatkan.
      • Anda dapat menggunakan Selesai saat tugas melibatkan perubahan pengaturan atau kumpulan pengaturan.
  • Mulai terapkan label tombol dengan kata kerja. Pengecualian OK, Ya, dan Tidak.

  • Gunakan kapitalisasi gaya kalimat.

  • Jangan gunakan tanda baca akhir.

Dokumentasi

  • Meskipun sebagian besar panduan Windows tidak lagi memiliki panduan kata dalam judul, panduan dapat diterima sebagai panduan dalam dokumentasi. Referensi ini harus huruf kecil.
  • Benar:
  • Jika Anda menyiapkan jaringan untuk pertama kalinya, Anda bisa mendapatkan bantuan dengan menggunakan wizard Sambungkan ke Jaringan .
  • Beberapa panduan warisan dari versi Windows yang lebih lama mungkin menyertakan Wizard dalam judul. Jika merujuk ke salah satu wizard tersebut, anda dapat menggunakan Wizard [X] untuk menghindari wizard [X].
  • Lihat layar individual dalam wizard sebagai halaman.