Rabu, 26 Januari 2011

Analisis Web Distro BloopEndorse (Part 3)

Pada postingan ini saya akan melanjutkan pembahasan mengenai analisis web usability www.bloopendorse.com  berdasarkan  Nielsen Usability heuristik. Langsung aja ke poin pembahasannya yaitu :

1.    Visibility of System Status

Situs www.bloopendorse.com ini sudah lumayan memperlihatkan feedback yang baik dalam hal pengguna. Karena ketika kita lakukan mouseover pada menu akan terdapat perubahan warna tulisan menjadi kuning.

Gambar 1. Mouseover pada menu kategori


Namun untuk menu di atas sepertinya bukan menu yang biasa ditampilkan pada navigasi header pada biasanya, melainkan seperti menu kategori produk yang ditampilkan secara horizontal saja.  Menu yang terdiri seperti halaman home, about us, atau chekout malah ditampilkan di sisi sudut kanan atas. Hal ini akan membuat user tidak menyadari keberadaan menu tersebut dan merasa bingung  dalam menggunakan web ini.

Gambar 2. Menu

Pada visualisasi menu ini warna tulisan yang digunakan terlihat mati. Dan tidak memperlihatkan interaksi mouseover dengan baik. Ketika dimouseover memang terlihat perbedaannya dengan tulisan lain namun hal pembeda itu di tampilkan seperti  link-text. Hal ini akan membuat user merasa tidak nyaman. Sebaiknya digunakan perubahan warna  yang membedakan  background setiap menu (diberi tampilan hover) dan di letakkan dibawah header.
Selain itu situs www.bloopendorse.com  tidak menyediakan fasilitas  Bread-Crumb sebagai pelengkap navigasi yang 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.


2.    Match Between System and the Real World

Bahasa yang digunakan pada situs www.bloopendorse.com ini yaitu kolaborasi  bahasa indonesia dan bahasa inggris. Namun di sisi ini saya melihat ada ketidakkonsistenan pada setiap penggunaannya.   Di situs ini terdapat task yang langsung menampilkan tulisan dengan dua bahasa sekaligus. Menurut saya ini akan terlalu memakan banyak tempat jika tulisannya panjang. Hal ini diperlihatkan ketika user sudah selesai melakukan chekout tanpa mengisi keranjang belanjanya dan ada notifikasi bahwa “Shoping cart anda kosong” seperti  gambar berikut ini.

Analisis Web Distro BloopEndorse (Part 4)

Berlanjut dari postingan sebelumnya mengenai analisis web bloopendorse.com ini yaitu :

6. Recognition Rather Than Recall

Ketika user sudah selesai melakukan registrasi, user akan ditampilkan dengan halaman baru yang langsung bisa meng-update data dirinya. Hal ini akan mengurangi beban memori dari user dalam mengoperasikan situs ini.

Gambar 8. Update Data
       
7. Flexibility and Efficiency of Use

Pada halaman yang menampilkan daftar seluruh produk, penempatan harga, kode, judul, ukuran yang ditampilkan menurut saya kurang sesuai. Karena biasanya user melihat judul, kode, dan harga terlebih dahulu. Selain itu tidak ada button add to chart langsung pada setiap viewing produk, sehingga user harus mengeluarkan beban lebih untuk mengaksesnya.
Gambar 9. Viewing Produk

Pada task pemesanan produk, setelah selesai memesan sudah ada konfirmasi pemberitahuannya.

 Gambar 10. Selesai Pesan

Jadi pada poin ini situs www.bloopendorse.com sudah lumayan baik hanya saja kurang teliti dalam analisis penempatan task nya.


     8. Aesthetic and Minimalist Design

Situs www.bloopendorse.com memiliki tema grayscale karena warna background yang digunakan yaitu kolaborasi hitam, putih, dan abu-abu. Secara umum desain yang digunakan sudah cukup menarik mengikuti selera user (anak muda). Namun ada beberapa gambar yang seharusnya ditempatkan di posisi yang tepat. Contohnya pada halaman produk wanita yaitu :

 Gambar 11. View Kategori women

Pada bagian yang diberi kotak merah tidak menunjukan arti apapun, sehingga harus memakan banyak tempat. Mungkin maksud kotak biru tersebut akan diisi oleh gambar-gambar baju yang berkaitan.  Namun disini kotak tersebut terlihat sangat mengganggu. Sebaiknya kotak tersebut dihilangkan saja dan diganti oleh Judul kategori.  Dari segi keseluruhan desain situs www.bloopendorse.com ini sudah cukup bagus namun hanya masih kurang interaktif menurut saya.


      9. Help Users Recognize, Diagnose, and Recover from Errors

Dalam situs ini sudah terdapat pesan yang sangat jelas dan tidak membingungkan bila pengguna tidak melengkapi data pada form registrasi  dan  setelah pengguna menyelesaikan memilihan barang yang telah dipesan.  Hanya saja penggunaan huruf pada form yang dibuat kecil dan pewarnaannya mungkin agak menyulitkan pengguna. Contoh gambar ada pada poin  Error Prevention.


     10. Help and Documentation

Situs www.bloopendorse.com sudah memiliki menu How to order untuk membantu user dalam melakukan pemesanan secara online di web ini. Dari proses pemesanan melalui website, sms, hingga proses pengiriman semua sudah cukup jelas di sini. User dapat bertanya secara langsung kepada owner melalui no telp yang tercantum.  


Gambar 12. Cara Pemesanan


Kesimpulan :
Berdasarkan seluruh ulasan yang sudah saya analisis dapat diambil kesimpulan bahwa situs www.bloopendorse.com  sudah memiliki sisi interface yang baik. Dari sisi evaluasi heuristik situs ini cukup mudah digunakan dan dipelajari, efisien, dan pengguna yang melakukan kesalahan pun  dapat dengan mudah mengetahui sisi kesalahannya.  Sisi kekurangganya yaitu mungkin developer belum memasukan beberapa task yang seharusnya ada pada web serta masih kurangnya analisis mengenai suatu ketidak-konsistenan.



Selasa, 25 Januari 2011

Analisis Web Distro BloopEndorse (Part 2)

Kemajuan teknologi semakin menuntut perubahan sistem interaksi yang semakin canggih untuk dapat mudah digunakan. Salah satu bentuk aplikasinya yaitu dalam bidang web. Terkait hal itu, sistem dunia bisnis pun tidak kalah berkembang seiring dengan kemajuan teknologi web tersebut. Website E-commerce merupakan salah satu metode atau strategi pemasaran bisnis yang dianggap mampu memanjakan user dalam melakukan transaksi jual beli online. Sehingga Web Usability suatu web harus diperhatikan dalam pembuatan suatu situs web e-commerce. Sebelum mengkaji pembahasan situs www.bloopendorse.com , sebaiknya kita mengetahui apa itu web usability.

Menurut Jacob Nielsen, usability adalah sebuah atribut kualitas yang menilai tingkat kemudahan user interface untuk digunakan. Usability juga mengacu kepada metode untuk meningkatkan kemudahan penggunaan selama proses perancangan. Sedangkan menurut Galitz, Usability adalah atribut kualitas yang menilai seberapa mudah user interface untuk digunakan.

Dari sisi pengguna, usability sangat penting dalam membedakan antara perlakuan task secara akurat dan perlakuan task secara sempurna atau tidak, dan apakah user menikmati proses dari sistem atau malah membosankan. Jika diberi pilihan, orang cenderung untuk membeli sistem yang lebih user-friendly.

Menurut Nielson(2003), Usability didefenisikan melalui lima komponen, yaitu :

a. Learnability
Learnability menjelaskan tingkat kemudahan pengguna untuk memenuhi task-task dasar ketika pertama kali mereka melihat/menggunakan hasil perancangan.
b. Efficiency
Efficiency menjelaskan tingkat kecepatan pengguna dalam menyelesaikan task-task setelah mereka mempelajari hasil perancangan.
c. Memorability
Memorability menjelaskan tingkat kemudahan pengguna dalam menggunakan rancangan dengan baik, setelah beberapa lama tidak menggunakannya.
d. Errors
Errors menjelaskan jumlah error yang dilakukan oleh pengguna, tingkat kejengkelan terhadap error dan cara memperbaiki error.
e. Satisfaction
Satisfaction menjelaskan tingkat kepuasan pengguna dalam menggunakan rancangan.

Tujuan utama dari Usability web adalah Efektif digunakan, Efisien digunakan, Aman digunakan, Punya utility yang baik, Mudah dipelajari, dan Mudah diingat bagaimana menggunakannya.

Analisis Web Distro BloopEndorse (Part 1)

Postingan kali ini terkait dengan tugas akhir matakuliah Interaksi Manusia dan Komputer (IMK) mengenai analisis Web Usability dari antarmuka (interface) situs www.bloopendorse.com  yang merupakan salah satu situs web e-commerce yang menyediakan fasilitas transaksi jual beli berupa produk fashion remaja dan anak muda. Distro ini merupakan salah satu distro yang sudah populer di kalangan fashion anak muda terutama di daerah jakarta. Oleh karena itu, demi memperluas jaringan pasar bisnis ini, situs www.bloopendorse.com  merupakan bentuk visualisasi web yang dibuat untuk interaksi para calon pembeli dalam melakukan transaksi jual beli dengan mudah tanpa harus pergi ke toko.

Pada postingan kajian usability web bloopendorse.com yang pertama ini saya tunjukan tampilan home pada situs e-commerce tersebut.

Gambar 1. Tampilan Home

Demikian tampilan awal ketika mengakses situs www.bloopendorse.com. Dan pada postingan berikutnya saya akan menjelaskan beberapa hal terkait pembahasan web usability yang akan di analisis.


"...My New World..."