Keadaan Kosong – Aspek UX yang Paling Diabaikan

Diterbitkan: 2022-03-11

Meskipun penting bagi pengalaman pengguna, status kosong sering diabaikan. Mengetahui apa itu dan bagaimana menggunakannya, dan menerapkan praktik terbaik UX, dapat menghasilkan manfaat besar.

Apa Itu Keadaan Kosong?

Desainer UX memiliki banyak peluang untuk menciptakan pengalaman yang menyenangkan dan bermakna. Salah satu peluang yang sering diabaikan adalah "kondisi kosong", atau layar kosong. Status kosong adalah momen dalam pengalaman pengguna dengan produk yang tidak menampilkan apa pun.

Berikut adalah beberapa contoh situasi keadaan kosong yang umum:

  • Layar Dropbox baru di mana tidak ada file atau folder yang dibuat.
  • Layar yang dihasilkan setelah menyelesaikan semua tugas di pengelola daftar tugas.
  • Mendapatkan layar kesalahan di Slack saat perintah tidak didukung.
  • Memulai akun jejaring sosial baru dan tidak ada koneksi.
  • Mencari sesuatu di Gmail dan tidak mendapatkan hasil.

Momen di antara ini memberikan peluang untuk meningkatkan pengalaman pengguna dan akibatnya memperkuat peluang bisnis. Untuk desainer UX, mengambil setiap kesempatan untuk meningkatkan pengalaman pengguna dan menambah nilai lebih pada bisnis adalah hal yang baik.

Status kosong yang berguna akan memberi tahu pengguna apa yang terjadi, mengapa itu terjadi, dan apa yang harus dilakukan. Berikut adalah dua contoh desain UX keadaan kosong yang baik:

Desain status kosong UX orientasi pengguna Dropbox
Dropbox Paper menyediakan desain UX status kosong yang baik untuk orientasi pengguna saat produk pertama kali diluncurkan. Tombol ajakan bertindak membantu Anda memulai tanpa bertanya-tanya apa yang harus dilakukan selanjutnya.


Desain status kosong tanpa hasil pencarian
Contoh desain status kosong yang baik saat kueri penelusuran tidak memberikan hasil. Layar ini memberikan referensi yang berguna dan memberi tahu pengguna apa yang sedang terjadi.


Berikut adalah beberapa contoh desain status kosong dengan peluang yang terlewatkan:

Desain status kosong dengan peluang yang terlewat
Berikut adalah desain UX keadaan kosong yang memberikan beberapa umpan balik yang bagus tetapi melewatkan kesempatan untuk memberi pengguna arahan atau tindakan tambahan apa pun yang harus diambil.


Halaman web kosong desain status kosong
Dalam desain keadaan kosong ini, kita hanya melihat halaman web yang hampir kosong. Gambar itu sendiri bagus, tetapi tidak mengarahkan pengguna ke jalur tertentu, juga tidak memberi tahu atau menginstruksikan.

Jenis Keadaan Kosong

Berikut adalah empat jenis keadaan kosong yang sering ditemui:

  • Penggunaan pertama – Terjadi dengan produk atau layanan baru saat masih tidak ada yang ditampilkan, seperti akun Evernote atau Dropbox baru.
  • Pengguna dihapus – Terjadi saat pengguna menyelesaikan tindakan seperti membersihkan kotak masuk atau daftar tugas mereka, dan hasilnya adalah layar kosong.
  • Kesalahan – Ini terjadi ketika ada yang tidak beres, atau ketika ada masalah seperti ponsel menjadi offline karena masalah jaringan.
  • Tidak ada hasil/Tidak ada data – Terjadi ketika tidak ada yang ditampilkan. Ini bisa terjadi jika seseorang melakukan pencarian dan kueri kosong atau tidak ada data yang tersedia untuk ditampilkan (misalnya saat memfilter rentang tanggal yang tidak memiliki data).

Karena desain status kosong menerima lebih banyak perhatian, desainer UX menemukan bahwa ada hasil yang bermanfaat untuk memanfaatkannya, baik dari perspektif bisnis maupun pengalaman pengguna.

Pengguna mencoba banyak aplikasi tetapi memutuskan mana yang ingin 'dihentikan penggunaannya' dalam 3-7 hari pertama. Untuk aplikasi 'layak', sebagian besar pengguna bertahan selama 7 hari bertahan lebih lama. Kunci keberhasilannya adalah membuat pengguna ketagihan selama periode 3-7 hari pertama yang kritis itu. – Ankit Jain

Dicari desainer UX freelance penuh waktu yang berbasis di AS

Manfaat Menggunakan Keadaan Kosong yang Didesain dengan Baik

Mendesain layar status kosong yang dipikirkan dengan matang dan berguna dapat membantu mendorong keterlibatan produk, menyenangkan pengguna, dan mengurangi churn. Ini mengurangi kemungkinan kehilangan pengguna karena produk pesaing, sehingga membuat mereka frustrasi atau tersesat.

Dalam bukunya, Apa yang Benar-Benar Diinginkan Pelanggan , Scott McKain memaparkan enam prinsip panduan pengalaman pelanggan yang hebat.

Dia menulis bahwa pelanggan menginginkan:

  1. Pengalaman yang menarik
  2. Fokus pribadi
  3. Loyalitas timbal balik
  4. Diferensiasi
  5. Koordinasi
  6. Inovasi

Ketika diterapkan pada desain keadaan kosong, prinsip-prinsip ini dapat sangat bermanfaat bagi bisnis—misalnya, peningkatan kepuasan produk, dan penurunan tingkat pengabaian.

Berikut adalah tiga area tambahan yang juga dapat mengambil manfaat dari desain status kosong yang baik:

  • Orientasi pengguna – Memberikan kesempatan untuk membangun kepercayaan dan penggunaan produk secara berkelanjutan selain meningkatkan pengalaman pengguna.
  • Membangun merek – Menghasilkan kesadaran dan mempromosikan perusahaan untuk membangun ekuitas merek yang meningkat.
  • Personalisasi – Dapat bersifat main-main, menyenangkan, serius, atau dinamis dalam berbagai kondisi penggunaan; menciptakan rasa sentuhan pribadi.

Manfaat dari keadaan kosong yang dirancang dengan baik tidak dapat diremehkan. Mereka tidak hanya berkontribusi pada pengalaman pelanggan yang menarik, tetapi karena jendela peluang untuk membuat pelanggan senang dan terlibat semakin pendek, mereka hanyalah bisnis yang bagus.

Dijauhi: Layar Desain UX yang Terlupakan

Karena ada hasil positif yang nyata untuk keadaan kosong yang dirancang dengan baik, mengapa mereka diabaikan sejak awal?

Pertama, sangat sedikit situasi keadaan kosong yang terjadi jika dibandingkan dengan jumlah total layar dalam aplikasi atau produk atau situs web, sehingga sering kali diabaikan karena tidak dilihat sebagai prioritas, dan desainer cenderung memfokuskan upaya mereka pada bagian desain yang lebih terlihat.

Kedua, dengan perkiraan hanya 2-5% pengguna yang melihat keadaan kosong, itu tidak selalu merupakan penggunaan waktu desainer yang ekonomis atau praktis.

Terakhir, status kosong tidak selalu dipahami dengan baik dalam hal di mana mereka terjadi dan apa yang harus dilakukan dengan mereka, jadi mereka mengambil kursi belakang demi layar dan halaman yang lebih populer.

Apa yang terjadi ketika keadaan kosong diabaikan?

Layar kosong tanpa panduan dapat menyebabkan kebingungan, ketidakpastian, dan kekecewaan. Hal ini dapat mengakibatkan tingkat pengabaian yang lebih tinggi dan kepuasan keseluruhan yang lebih rendah dengan produk.

Untungnya, banyak hal mulai berubah karena manfaat dan peluang mendesain layar status kosong yang baik menjadi bagian yang lebih penting dan berprioritas tinggi dari proses desain UX.

Cara Mengisi Layar Kosong dengan Tujuan

Berikut adalah beberapa praktik terbaik UX untuk memastikan layar kosong dirancang agar berguna, membantu, dan informatif.

Empati. Menambahkan kejutan dan kegembiraan , emosi , dan kepribadian adalah semua cara desainer UX menciptakan pengalaman yang lebih baik bahkan di sudut tergelap suatu produk. Untuk layar kosong, pesan empatik menambah variasi dan menciptakan pengalaman yang lebih menarik dan dipersonalisasi.

Menggunakan emosi dan kepribadian untuk mengisi layar kosong
Gusto adalah contoh yang bagus untuk mengisi layar keadaan kosong dengan personalisasi dan beberapa kepribadian yang menyenangkan.

Perumpamaan. Ada prinsip desain yang disebut efek biofilia. Ini adalah keadaan berkurangnya stres dan peningkatan konsentrasi yang dihasilkan dari pemandangan alam. Menambahkan beberapa citra pemandangan (latar belakang layar kesalahan status kosong, misalnya) dapat menghasilkan pengalaman pengguna yang lebih menyenangkan.

Efek biofilia dapat menciptakan keadaan stres yang berkurang
Layar status kosong yang dirancang seputar efek biofilia dapat berdampak positif pada pengalaman pengguna dengan mengurangi stres dan membantu interaksi.

Bimbingan Bermanfaat. Tergantung pada jenis produk, status kosong dapat digunakan untuk memandu pengguna. Contoh yang baik dari ini adalah aplikasi manajemen proyek. Dengan akun baru, belum ada proyek yang dimainkan, menawarkan peluang besar yang berpotensi membantu pengguna memulai dengan cepat, sehingga mengurangi kemungkinan pengabaian. Berikut ini contohnya:

Praktik terbaik UX desain status kosong untuk memandu pengguna
Evernote melakukan pekerjaan yang baik dalam memandu pengguna dengan desain halaman status kosong mereka.

Konten Pemula. Ada banyak layar yang kosong cukup lama sehingga pengguna merasa frustrasi dan pergi. Untuk produk tertentu, menyediakan konten awal yang baik membantu mereka memvisualisasikan apa yang sedang terjadi dan apa yang dapat mereka lakukan selanjutnya.

Berikut adalah contoh layar status kosong dengan konten starter:

Desain keadaan kosong yang bagus dengan konten pemula
Berikut adalah contoh yang baik dari konten starter keadaan kosong. Ini memberi pengguna sesuatu untuk dikembangkan dan mengurangi kemungkinan kebingungan dan pengabaian produk.

Memberikan Langkah Tindakan. Dengan beberapa produk, kami tidak perlu memberikan panduan atau mengisi layar dengan konten apa pun karena itu tidak masuk akal. Dalam kasus ini, desainer cukup memberikan langkah tindakan.

Namun, yang terbaik adalah menjaga tindakan seminimal mungkin. Hukum Hick menyatakan bahwa "waktu yang dibutuhkan untuk membuat keputusan meningkat dengan jumlah dan kompleksitas pilihan." Dengan demikian, pengguna kemungkinan akan lebih cepat bertindak ketika ajakan bertindak disimpan ke satu atau dua paling banyak. Berikut adalah contoh yang bagus:

Desain status kosong dengan ajakan bertindak minimal
Berikut adalah contoh bagus dari desain status kosong UX yang bagus yang memberi tahu pengguna untuk mengambil tindakan tetapi tetap meminimalkannya.

Contoh bagus lainnya adalah Instagram. Saat orang baru mengenal platform, mereka belum mengikuti siapa pun (dan tidak ada yang mengikuti mereka). Akan mudah untuk fokus pada semua fitur hebat Instagram, tetapi layar keadaan kosong yang bagus, misalnya, dapat memberi mereka opsi untuk “menambahkan orang untuk diikuti.”

Pengguna Instagram yang menggunakan UX
Saat baru mengenal platform ini, pengguna Instagram akan disambut dengan cara cepat dan mudah untuk menemukan orang.

Praktik Terbaik UX Status Kosong – Dari Lapangan

Toptal memiliki talenta lepas global tingkat atas di semua bidang desain. Inilah yang dikatakan beberapa desainer Toptal UX tentang pengalaman mereka mendesain layar status kosong.

Desainer Toptal: Tamara Olson

Disiplin Desain: Desain UX

Desainer UX Toptal Tamara Olson membagikan praktik terbaik desain keadaan kosong
Tamara Olson adalah seorang desainer UX yang bekerja dengan Toptal dan telah mengerjakan banyak proyek yang melibatkan desain keadaan kosong.

Apa saja desain keadaan kosong yang bagus yang telah Anda kerjakan atau lihat?

Bagus, desain keadaan kosong modern yang saya amati biasanya adalah dua bagian instruksi, satu bagian menyenangkan. Jika UI kosong, adalah tugas desainer UX untuk membantu pengguna memahami apa yang akan masuk ke ruang saat diisi. Jika tugas pengguna untuk mengisinya, pesan harus menyertakan petunjuk tentang caranya. (Misalnya, tabel "Kelas" kosong di produk teknologi pendidikan mungkin menyertakan salinan yang memberi tahu guru cara membuat kelas pertama mereka.)

Saya juga melihat banyak aplikasi menggunakan real estat murah hati negara bagian yang kosong sebagai peluang untuk memasukkan kepribadian merek yang menyenangkan dan menyenangkan. Anda mungkin mengatakan ini adalah versi aplikasi web dari halaman 404 situs web.

Pernahkah Anda mengabaikan keadaan kosong, dan jika ya, mengapa?

Tentu saja, ini jebakan yang mudah. Saat kami menjadi visioner, kami membayangkan aplikasi dan produk saat mereka dalam penerbangan penuh, diisi dengan konten dan pengguna. Ketika saya bekerja di Google, seorang VP produk berkomentar bahwa produk itu seperti penerbangan pesawat; sebagian besar masalah terjadi saat lepas landas dan mendarat.

Saat pengguna pertama kali memasuki produk Anda, status kosong tidak dapat dihindari, dan kami tidak ingin mereka menemui jalan buntu bahkan sebelum mereka memulai. Saya akan mendorong desainer junior untuk merancang serangkaian desain linier terpisah yang menunjukkan alur orientasi pengguna.

Pernahkah Anda melihat kesuksesan klien dengan menggunakan status kosong? Jika demikian, dengan cara apa?

Saya baru-baru ini bekerja dengan Bulan Penulisan Novel Nasional pada desain ulang platform mereka, yang memungkinkan pengguna untuk menetapkan dan melacak tujuan seputar kemajuan penulisan mereka. Tim produk kami memiliki bola mutlak dengan status kosong; itu adalah cara yang luar biasa untuk memperkenalkan dan menggoda fungsionalitas dan kepribadian platform, dan menginspirasi pengguna untuk mulai mencatat kemajuan mereka.

Apa penggunaan paling sukses dari keadaan kosong yang pernah Anda alami?

Sebagai “zero inboxer”, saya terus-menerus senang dengan ilustrasi kotak masuk kosong aplikasi Gmail: seseorang di bawah payung, membaca buku di bawah sinar matahari, dengan teks “Anda sudah selesai!” Secara teknis itu melanggar aturan yang saya sebutkan tentang keadaan kosong yang membutuhkan ajakan untuk bertindak, namun ternyata tidak, karena CTA bawah sadarnya adalah "Buang email Anda dan nikmati hidup Anda." Saya suka itu.

Desainer Toptal: Michael Clingerman

Disiplin Desain: Desain Produk SaaS

Desainer UX Toptal Michael Clingerman berbicara tentang desain status kosong
Desainer UX Toptal Michael Clingerman mengkhususkan diri dalam desain produk SaaS.

Jika Anda telah mendesain untuk keadaan kosong, jenis apa yang paling sering Anda lihat?

Status kosong yang paling saya kenal adalah status 404/kesalahan dan status yang dihapus pengguna.

Pernahkah Anda melihat kesuksesan klien dengan menggunakan status kosong? Jika demikian, dengan cara apa?

Ya. Saya telah melihat kasus di mana layar status kosong menjadi bagian dari konten dan strategi komunikasi yang menarik dan menyenangkan. Ada kasus lain di mana klien telah menggunakannya untuk membangun kepribadian merek mereka.

Apa penggunaan paling sukses dari keadaan kosong yang pernah Anda alami?

Saya selalu menyukai penggunaan gaya ilustrasi sederhana dan monokromatik Dropbox untuk membangun kepribadian, nada, dan karakter merek korporat.

Kesimpulan

Sangat mudah untuk mengabaikan status kosong (atau layar kosong) dalam desain UX karena jarang terjadi dan tidak selalu dipahami dengan baik. Namun, manfaat penyertaan mereka diremehkan karena meningkatkan pengalaman pengguna dan membantu menciptakan produk yang lebih kohesif.

• • •

Bacaan lebih lanjut di Blog Desain Toptal

  • Praktik Terbaik Desain UI dan Kesalahan Umum
  • Desain UX Seluler – Praktik Terbaik, Kendala, dan Bekerja dengan Pengembang
  • Prinsip Heuristik untuk Antarmuka Seluler
  • Pengaruh dengan Desain – Panduan untuk Warna dan Emosi
  • Prinsip Desain dan Kepentingannya