Analisis Usability Web www.tupperware.co.id (Part 3)

Pada tulisan kali ini saya akan langsung membahas usability dari situs www.tupperware.co.id. Situs www.tupperware.co.id akan dikaji berdasarkan Nielsen Usability heuristik yang meliputi:

1. Visibility of System Status

Situs www.tupperware.co.id sudah sangat baik dalam hal feedbeck yang diberikan pada pengguna. Hal ini dapat terlihat ketika kita melakukan mouseover ke setiap menu dan content. Terdapat perubahan warna menjadi pink pada menu ketika di-mouseover.

Gambar 1. Mouse over

Gambar 2. Mouse over 2

Gambar 3. Mouse over 3

Namun untuk link-text dan non link-text tidak terlihat dengan jelas. Karena terdapat text dengan warna pink yang bisa merupakan link-text dan juga non link-text, hal ini dapat membuat user melakukan kesalahan berulang kali.

Gambar 4. Clickable dan Unclickable

Dan juga selain pink, www.tupperware.co.id juga menggunakan warna hitam untuk menandai link-text.

Gambar 5. Clickable

Sedangkan untuk penanda halaman aktif pada www.tupperware.co.id tidak diperlihatkan dengan jelas. Sebaiknya halaman yang sedang aktif diberi warna yang berbeda.

Gambar 6. Penanda halaman aktif

Tapi Tupperware menyediakan Bread-Crumb sebagai pelengkap navigasi membantu user untuk mengetahui posisi halaman yang sedang dibuka. Penggunaan Bread-Crumb tersebut memungkinkan user dapat berpindah ke halaman sebelumnya, dengan begitu user tidak akan tersesat. Penggunaan bread crumb dengan adanya perubahan warna dan guide line pada tombol.

Gambar 7. Bread-Crumb

2. Match Between System and the Real World

Bahasa yang digunakan pada www.tupperware.co.id adalah bahasa Indonesia, dengan sebagian judul-judul menu dan content dengan menggunakan bahasa inggris.

Gambar 8. Ketidakkonsistenan bahasa

Dan juga terdapat beberapa istilah yang tidak sesuai dan tidak akrab dengan user. Seperti adanya submenu yang berjudul Download yang isinya tidak seperti yang user harapkan, karena setelah submenu Download diklik yang keluar adalah login distributor. Istilah yang digunakan pada submenu ini sesuai dengan yang pengguna biasa gunakan.

Gambar 9. Ketidakkonsistenan judul dan isi

3. User Control and Freedom

Pada bagian pengisian form contact us terdapat button untuk melakukan remove, button remove ini bertindak tanpa adanya konfirmasi terlebih dahulu,

Gambar 10. Konfirmasi

sehingga apabila kita mengklik button remove ini maka semua isian form yang telah kita tulis akan hilang semua tanpa pemberitahuan terlebih dahulu (Gambar 10). Ini sangat tidak baik, karena apabila user tidak sengaja mengklik button remove ini maka user harus mengisikan kembali form tersebut. Selain itu untuk button remove dirasa tidak perlu, mengingat untuk membatalkan pengisian user bisa saja pindah kehalaman yang lain atau menutup halaman yang bersangkutan.

4. Consistency and Standards

Penggunaan button yang tidak standar terdapat pada situs www.tupperware.co.id , button submit, remove, dan go yang tidak seperti button karena menggunakan content bullet yang diikuti nama.

Gambar 11. Button tidak standar

Pada situs www.tupperware.co.id terdapat dua menu “HOME” yang menuju ke halaman yang berbeda. Jika yang dimaksud adalah home dari solusi & resep maka sebaiknya jangan dinamakan sama dengan homepage (halaman awal pada saat situs pertama kali dibuka). Namun setelah dilihat home yang terdapat pada menu solusi & resep di situs www.tupperware.co.id merupakan penjelasan tujuan Tupperware. Sehingga timbul kesalahan persepsi oleh user yang telah masuk ke halaman ini.

Gambar 12. Ambiguitas penamaan

Ketidakkonsistenan bahasa juga terdapat pada situs ini. Pada menu dan sub menu sering kali menggunakan bahasa Indonesia dicampur dengan bahasa inggris. Terkadang menggunakan judul dengan bahasa inggris, tetapi isi yang diberikan ditulis dengan bahasa indonesia.

Gambar 13. Ketidakkonsistenan bahasa

5. Error Prevention

Untuk mencegah kesalahan pada pengisian form di halaman contact us, www.tupperware.co.id menggunakan text konfirmasi format pengisian data. Penggunaan text konfirmasi ini sangat berguna agar user tidak bingung dalam hal pengisian form.

Gambar 14. Text konfirmasi

Namun format text konfirmasi juga harus disesuaikan, pada pengisian mobile user tertulis bahwa nomor dipisahkan dengan spasi dimana bagian depan sebanyak 4 angka dan di bagian belakangnya sebanyak maksimal 9 angka . setelah dilakukan pengisian ternyata bagian belakang hanya bisa terisi sebanyak 3 angka. padahal untuk memasukkan nomor mobile dibutuhkan minimal 10 angka.

Gambar 15. Kesalahan dalam text konfirmasi

Untuk selanjutnya akan di-post lanjutan dari kajian situs www.tupperware.co.id dari segi :

6. Recognition Rather Than Recall
7. Flexibility and Efficiency of Use
8. Aesthetic and Minimalist Design
9. Help Users Recognize, Diagnose, and Recover from Errors
10. Help and Documentation

-->