10 Usability Heuristic
Jakob Nielsen mengembangkan heuristik ini dengan Rolf Molich untuk heuristic evaluation di tahun 1990. Pengembangannya berdasarkan analisis dari 249 masalah usability. Setelah direvisi jadilah 10 kriteria ini. Walaupun dikembangakan tahun 90an, heuristic ini masih valid dan banyak diterapkan sampai sekarang.
Di artikel ini, saya akan mencoba menjelaskan dan memberi contoh 10 usability heuristic tersebut.
Visibility of System Status
User akan lebih senang menggunakan aplikasi ketika dia tau apa yang sedang terjadi, pada aplikasi atau sistem yang dipakainya. Misalnya indikator level baterai, wifi connection, chat notifications, signal operator. Dengan adanya indikator ini user akan merasa memiliki kontrol dengan memberikan informasi dan feedback dengan waktu yang sesuai.
Contoh sederhananya, indicator baterai hp. Kalau baterai lemah maka indikatornya akan berwarna merah atau menunjukkan angka rendah. Nah dari informasi ini, user tau langkah apa yang tepat untuk dilakukannya, yaitu mengisi daya baterainya. Dan ketika user kita mengisi daya, maka indicator baterai tersebut berubah menjadi icon baterai charging.
Yang terpenting adalah, Open communication antara user dan sistem. Dengan demikian, tidak hanya membuat user tau apa yang sedang terjadi namun juga membuat user tau untuk mengambil keputusan dari informasi tersebut. Tapi, jangan terlalu banyak memberi informasi yang ujung-ujungnya malah mengganggu konsentrasi user 🙅🏻. Misalnya cukup dengan mengganti warna, size, atau menambahkan dot kecil pada suatu icon, itu sudah cukup memberi informasi. Berikan feedback pada setiap interaksi oleh user.
Match between system and real world
‘Sistem harus menggunakan bahasa yang dimengerti oleh user.
Disini maksudnya sistem sebaiknya mengikuti hal yang biasa atau lumrah di dunia nyata. Dengan menyediakan informasi yang teratur secara logika.
Persepsi orang terhadap suatu teknologi dipengaruhi dengan pengalamannya menggunakan teknologi sebelumnya dan dengan apa yang dialamai user di dunia nyata. Contohnya adalah skeuomorphism design, dimana user interface yang didesain sesuai dengan bentuknya, bagaimana berintaraksi dengannya di dunia nyata.
Contohnya icon-icon aplikasi calculator, kelander, jam, recycle bin dll, banyak yang meniru bagaimana bentuknya didunia nyata. Kemudian misalnya, di dunia nyata kita bisa meng-highlight text dengan pena atau pewarna, nah adopsi di digitalnya adalah, kita menekan lama kemudian drag text yang ingin di highlight.
User control & Freedom️
Sistem perlu menyediakan “emergency exit” untuk keluar dari state salah tersebut.
User terkadang salah dalam mengoperasikan sistem atau apps, maka sistem perlu menyediakan “emergency exit” untuk keluar dari state salah tersebut. Sistem menyediakan informasi yang jelas bagaimana untuk meninggalkan suatu proses atau state yang salah.
Contoh ekstrimnya adalah tombol back pada browser kalau user salah klik link. Kemudian ada tombol “redo” untuk membatalkan operasi terakhir dari user. Bayangkan jika fitur ini tidak ada, user harus benar-benar yakin dengan setiap aksinya di sistem, karena ga ada caranya balik ke normal statenya.
Dengan menyediakan emergency exit ini, user akan merasakan kebebasan untuk mengeksplorasi aplikasi karena dia tidak perlu takut untuk klik suatu link, atau mencoba thema baru atau tweet di tweeter, karena jika mereka ga menginginkan itu lagi, bisa dihapus.
Consistency and Standards
Terdapat dua jenis consistency, yaitu internal consistency dan external consistency.
Sadar gak, kalau letak tombol shopping cart” pada ecommerce di sudut kanan atas, pasti semua ecommerce sama aja. Atau tombol show navigasi berada di sudut kiri atas untuk menampilkan side navigation, kalau kita mengubahnya, kita membuat user harus belajar lagi, dan mungkin mengarah ke user kebingungan. Ini merupakan contoh external consistency. Kita memaintain consistency diluar suatu produk, mengikuti standar yang ada.
Jakob’s Law: “People spend most their time on sites other than yours”
Kemudian, misalnya kita menggunakan warna biru untuk tombol CTA, kemudian header dan navigasi juga menggunakan warna merah. Ini bisa membingungkan user, elemen mana yang dapat di click mana yang statis. Disini kita memaintain internal consistency in a product or in a family of product.
Error prevention
Berdasarkan buku The Design of Everyday Things oleh Don Norman, ada dua jenis user error yaitu Slips dan Mistakes.
Slips, ketika user ingin melakukan suatu aksi namun malah membuat aksi yang berbeda (aksi yang sudah biasa dan sering dilakukan), misalnya mengetik “i” tapi malah ngetik “o”.
Mistakes, adalah error yang terjadi ketika user mendapat informasi yang salah tentang suatu task, dan membuahkan sebuah mental model yang tidak sesuai dengan yang seharusnya, dan berakhir pada hasil yang tidak diinginkan oleh user.
Untuk mencegah error ini, kita bisa membuat prevention berupa confirmation modal, input validation, suggestion pada input search, membuat default value pada input, dll.
Recognition vs. Recall in User Interface
Ada dua jenis memory retrieval, yaitu Recognition dan recall.
Misalnya kita ketemu orang di jalan, terus kamu kenal wajahnya nah pasti di pikiran kita akan terbayang namanya, ini disebut Recognition. Mengacu pada kemampuan kita untuk mengenai suatu peristiwa atau informasi yang familiar.
Kalau Recall itu, contohnya pertanyaan mengenai tanggal, bisa juga username dan password kita. Ini memerlukan lebih banyak waktu untuk mengingat kembali atau menggali informasi yang kita ingat.
User Interface yang baik itu adalah yang memberikan user informasi tambahan untuk mengingat, baik berupa task atau item yang mereka lihat sebelumnya atau mengenai suatu fungsi dari elemen interface. Contohnya menu navigasi, “History” dan “Previously visited content”, atau menggunakan tombol untuk menggantikan syntax command terminal.
Flexibility and efficiency of use
Setiap user memiliki experience yang berbeda-beda, ada yang baru pertama kali menggunakan sampai yang sudah menjadi kegiatan sehari-harinya. Flexibility disini adalah dimana user dapat memilih cara mereka memakai atau mengoperasikan suatu sistem, sehingga mereka dapat menyelesaikan task dengan cepat.
Contoh pengaplikasiannya adalah accelerator. Accelerator adalah fitur UI untuk mempercepat proses atau interaksi. Accelerator dapat berupa keyboard shorcuts, macros, atau touch gestures. Misalnya, untuk meng-copy suatu text, kita bisa block textnya lalu ke menu edit > copy. Nah, shortcut keyboardnya “cmd + c atau ctrl+c”. Atau ketika me-like feed instagram, bisa dengan double tap atau dengan tap icon “heart”.
User interface yang baik menyediakan fungsi yang dapat digunakan baik untuk user baru dan user yang telah berpengalaman.
Aesthetic and minimalist Design
Pastikan tetap menjaga konten dan desain visual dari User interface fokus terhadap yang esensial. Berhubungan erat dengan human-computer interaction concept, yaitu signal-to-noise ratio.
Signal-to-noise ratio merepresentasikan rasio dari informasi yang relevan dan yang tidak. Fokuslah untuk mencapai high-signal-to-noise untuk meningkatkan efisiensi dalam penyampaian informasi melalui desain dan untuk membantu user menyelesaikan task mereka.
Setiap elemen tambahan seperti gambar, text, graphic, dll harus mendukung proses atau experience dari goals utama user. Jangan menggunakan banyak elemen visual yang tidak berhubungan dengan goal utama, hanya untuk memperindah tampilan atau mengisi space kosong. Contoh pada modal dialog, cukup tampilkan informasi yang benar-benar relevan.
Communicate don’t decorate.
Help users recognize, diagnose, and recover from errors
Error tidak jarang dijumpai oleh user, error membuat user kesal apalagi kalau pesan erornya gak jelas.
Sampaikan informasi bagaimana error terjadi kepada user dengan jelas. Contohnya error massage di input form. Atau pesan error ketika page tidak ditemukan.
Sampaikan apa masalahnya dan berikan solusi bagaimana memperbaiki kesalahan tersebut. Sajikan “shortcut” pada pesan error. Bukan pesan error dan instruksi bagaimana menyelesaikan errornya, tapi juga bagaimana user dapat menyelesaikan sesuatu dengan satu klik tombol. Misalnya pada Traveloka, ketika pencarian dengan filter tertentu tidak ditemukam
mereka menyediakan tombol untuk langsung mereset filter.
Help and documentation
Meskipun aplikasi sebaiknya dapat digunakan tanpa dokumentasi, tapi menyediakan help dan dokumentacion itu penting, apalagi kalau sudah bersangkutan dengan user baru. Help dan documentation dapat berupa form, onboarding page, walkthroughs, tooltips, popover, dll.
Ketika mengaplikasikan help and documentation, pastikan mudah dicari, fokus ke task user, list dari step yang bisa di ikuti, dan yang terpenting mudah dimengerti oleh user (use user language).
Setelah mengetahui 10 Heuristic Usability ini, kita dapat menerapkannya pada aplikasi kita agar memiliki user experience yang baik dan efisien.
