Selasa, 07 Februari 2012

Minggu, 23 Oktober 2011

Analisis Antarmuka Pencarian dan Hasil Pencarian (SERP)

Tulisan ini dan tulisan sebelumnya dibuat dalam rangka Ujian Tengah Semester mata kuliah Interaksi Manusia dan Komputer. Saya akan membahas tentang antarmuka pencarian dan hasil pencarian sebagai search usability pada website www.telkomsel.co.id, mari kita mulai analisisnya.

A.    Referensi Mengenai Search Usability
·        
  •             Search and You May Find (Neilsen, 2006)
Search adalah salah satu elemen user interface yang paling penting dalam sebuah situs web. Pada umumnya, saat user membuka sebuah situs wen maka yang akan dilakukan adalah mencari sesuatu dengan searching.

  • Top 10 Mistakes in Web Design (Nielson, 2011)

Kesalahan desain website diantaranya adalah :
  1. Pencarian yang buruk – umumnya mesin pencari tidak dapat mengatasi kesalahan pengetikan, kemajemukan, tanda baca, dan lain-lain yang dalam pemrosesan query.
  2. Tidak mengubah warna dari link yang sudah dikunjungi – jika user mengetahui halaman yang sudah ia kunjungi maka ia tidak akan mengunjungi halaman tersebut berulang-ulang. Berbeda dengan google.com yang sudah menggunakan perbedaan warna dalam link yang belum dikunjungi dan link yang sudah dikunjungi.

Gambar 15: www.google.com


  • ·         List of search usability guidelines (Anonim, 2011)

  1. The default search is intuitive to configure (no Boolean operators).
  2. The search results page shows the user what was searched for and it is easy to edit and resubmit the search.
  3. Search results are clear, useful and ranked by relevance.
  4. The search results page makes it clear how many results were retrieved, and the number of results per page can be configured by the user.
  5. If no results are returned, the system offers ideas or options for improving the query based on identifiable problems with the user's input.
  6. The search engine handles empty queries gracefully.
  7. The most common queries (as reflected in the site log) produce useful results.
  8. The search engine includes templates, examples or hints on how to use it effectively.
  9. The site includes a more powerful search interface available to help users refine their searches (preferably named "revise search" or "refine search", not "advanced search").
  10. The search results page does not show duplicate results (either perceived duplicates or actual duplicates).
  11. The search box is long enough to handle common query lengths.
  12. Searches cover the entire web site, not a portion of it.
  13. If the site allows users to set up a complex search, these searches can be saved and executed on a regular basis (so users can keep up-to-date with dynamic content).
  14. The search interface is located where users will expect to find it (top right of page).
  15. The search box and its controls are clearly labeled (multiple search boxes can be confusing).
  16. The site supports people who want to browse and people who want to search.
  17. The scope of the search is made explicit on the search results page and users can restrict the scope (if relevant to the task).
  18. The search results page displays useful meta-information, such as the size of the document, the date that the document was created and the file type (Word, pdf etc.).
  19. The search engine provides automatic spell checking and looks for plurals and synonyms.
  20. The search engine provides an option for similarity search ("more like this").
 


A.               B. Analisis Kesalahan

  • ·         Tombol Search

 
Gambar 16. Tombol Search

Terdapat sedikit kekurangan dalam tombol search diatas. Warna kotak yang digunakan terlalu samar dengan warna background web. Selain itu gambar lup yang ada dalam kotak search dapat diganti dengan tulisan Search. Karena terdapat beberapa orang yang menganggap bahwa gambar lup tersebut berfungsi untuk memperbesar.

Contoh perbaikan:

Gambar 16: Tombol Search (fix)

  • Warna link hasil pencarian
Gambar 17: Link Hasil Pencarian

Tidak terdapat perbedaan antara link yang sudah di-klik dengan link yang belum di-klik. Hal ini dapat menyebabkan user mengunjungi link tersebut berulang-ulang dan dapat mengulur waktu.
Contoh perbaikan:

Gambar 18: Link Sebelum Dikunjungi

Gambar 19: Link Setelah Dikunjungi



  • ·         Jumlah hasil pencarian yang terlalu banyak
Gambar 20: Link Hasil Pencarian

Dapat dilihat bahwa hasil dari pencarian mencakup satu halaman. Hal ini membuat user harus menggunakan scroll down untuk melihat hasil yang lainnya di bawah dan semakin malas untuk melihat hasil pencarian pada halaman berikutnya yang tentunya kurang efisien.

Contoh perbaikan:

Hasil pencarian yang ditampilkan sebaiknya 10 artikel per halaman .


Gambar 21: Hasil Pencarian (fix)

  • ·         Pencarian yang buruk

Gambar 22: No Result
Seharusnya hal ini dapat diantisipasi oleh Sang web developer agar membantu user dalam proses pencarian. Namun, memang cukup sulit untuk pengembangannya. Fitur pencarian harus mampu mengenali dan memperbaiki kesalahan query.

 Contoh Perbaikan :

Gambar 23: No Result (fix)



C. Daftar Pustaka

Nielson J. (2006) Search and You May Find[Internet]. Tersedia dari : <http://www.useit.com/alertbox/9605.html> [Diakses 24 Oktober 2011].

Nielson J. (2011) Top 10 Mistakes in Web Design [Internet]. Tersedia dari : <http://www.useit.com/alertbox/9605.html> [Diakses 24 Oktober 2011].

Anonim. (2011) 20 Search Usability Guidelines [Internet]. Tersedia dari : <http://www.userfocus.co.uk/resources/searchchecklist.html> [Diakses 24 Oktober 2011].



Analisis Berdasarkan Artikel “Top 10 Mistake in Web Design”

Tulisan ini dan tulisan selanjutnya dibuat dalam rangka Ujian Tengah Semester mata kuliah Interaksi Manusia dan Komputer. Saya akan mencoba menganalisis beberapa kesalahan desain pada beberapa website berdasarkan artikel “Top 10 Mistake in Web Design” yang dibuat oleh Jakob Nielsen, mari kita mulai analisisnya.

1. Bed Search


Salah satu kesalahan yang terdapat dalam web detik.com adalah bed searchnya. Ketika kita melakukan pencarian, misalnya saja pencarian dengan menggunakan kata kunci  “girlband korea” maka hasil keluarnya akan ditemukan 43 dokumen sedangkan jika pencariannya menggunakan kata kunci “girl band korea” (adanya spasi pada kata girl band) maka hasil keluarannya ditemukan 7 dokumen. Namun, dokumen-dokumen yang dikeluarkan tidak semuanya mengenai girlband korea melainkan juga terdapat berita mengenai artis indonesia. Hal ini sangat berbeda sekali. Sistem search engine pada web www.detik.com ini sangat berpengaruh pada cara penulisan, tanda baca, bentuk jamak, dll. Pada umumnya, pengguna lebih suka melakukam pencarian dengan kata kunci yang simple. Oleh sebab itu, jika melakukan pencarian dengan menggunakan search engine www.detik.com maka penulisan dan tanda bacanya harus diperhatikan dengan benar supaya artikel yang dinginkan ada.


2. PDF Files for Online Reading

 

Ketika kita ingin membaca suatu artikel dan kemudian mengklik title artikel, maka hal yang paling menyebalkan adalah muncul perintah untuk men-download artikel tersebut. Hal ini terkadang tidak disukai oleh user sebab selain mengulur waktu lebih lama untuk membaca artikel, users juga belum tentu ingin menyimpan file download dari artikel tersebut.

 
Gambar 3: Download


3. Not Changing the Color of Visited Link



Jika user mengetahui link yang sudah dikunjungi maka user tidak akan berulang-ulang untuk mengunjungi link tersebut. Namun, masih terdapat beberapa web yang tidak menggunakan perbedaan warna pada link yang belum dikunjungi dengan link yang sudah dikunjungi. Hal ini akan membuat user harus membuka link tersebut untuk mengetahui bahwa link tersebut sudah pernah dibacanya atau belum. Selain itu, hal ini dapat membuang waktu user untuk membuka halaman yang sama.



1.      4. Non-Scannable Text
Terkadang isi teks dalam sebuah web akan menjadi daya tarik user. Isi teks yang menarik dan rapi akan mempermudah user untuk mendapatkan informasi dari web tersebut. Jangan sampai, design text dalam web membuat user tidak jadi membaca informasi yang ada di dalam web tersebut. Dengan design text yang tidak bagus ditambah dengan informasinya menggunakan bahasa inggris membuat user menjadi malas untuk membacanya.

Gambar 5: www.fcw.com


2.      5. Fixed Font Size
Umumnya, web- web saat ini menggunakan style CSS yang membuat web terlihat lebih rapi dan menarik dengan mengubah ukuran font size oleh user sehingga font size tidak dapat diubah oleh browser. Hal ini menjadi kendala bagi user yang berusia di atas 40 tahun dengan penglihatan yang mulai berkurang.

Pada web tersebut (Gambar 7) hanya dapat dilakukan 3 kali perbesaran font. Selain itu, web ini juga menyediakan pengaturan untuk memperkecil font namun tetap dengan tampilan yang rapi.


3.      6. Page Titles With Low Search Engine Visibility


Dapat dilihat pada gambar di atas bahwa sebuah judul halaman dalam web memberikan informasi yang penting. Pada web www. Dailymotion.com semua judul halaman diawali dengan tulisan Dailymotion. Ketika user membuka tab dengan jumlah yang banyak, browser akan memperkecil ukuran halam judul sehingga membuat user bingung dalam melihat halaman judul yang sedang dibukanya.

4.     7.  Anything That Looks Like an Advertisment

Dalam membuat web, maka bentuk dan isi web harus diperhatikan. Jangan sampai, ketika user mengunjungi web tersebut membuat user menjadi bingung karena halaman utama dari web tersebut seperti web yang mengisi iklan-iklan. Hal ini terdapat pada web anselme.homestead.com. Saat user mengunjungi halaman depan maka akan terdapat gambar-gambar seperti banner periklanan. Namun, jika user mengklik gambar tersebut (misalnya tulisan HAITI yang diberi lingkaran warna hijau) maka akan keluar sebuah informasi mengenai negara HAITI.




5.      8. Violating Design Conventions
Konsistensi merupakan salah satu prinsip kegunaan yang paling penting. Jika sebuah web dapat terlihat lebih menarik maka akan menjadi nilai tambah untuk web tersebut. Salah satu contoh yang kurang bagus dan konsisten adalah ronoslund.com. Dengan background yang tidak jelas ditambah dengan tulisan-tulisan yang kecil membuat user malas untuk mengunjungi web ini.



6.      9. Opening New Browser Windows

Pada umumnya, user biasa menggunakan tab yang sama untuk membaca suatu artikel tanpa harus berpindah ke new tab. Hal ini dikarenakan user malas untuk kembali ke tab semula jika dia sudah membaca sebuah artikel di halaman baru. Biasanya dengan menggunakan tab yang sama user hanya perlu menekan tombol backspace untuk kembali ke halaman sebelumnya. Namun pada web deptan.go.id, saat user ingin membaca artikel lebih lengkap maka artikel tersebut akan muncul dengan tab yang baru.


Gambar 12: www.deptan.go.id



7.      10. Not Answering User’s Questions

Ketika user mengunjungi situs e-commerce, biasa mereka mempunyai tujuan untuk membeli produk yang dijual dalam situs tersebut. Namun, apabila web tersebut tidak memberikan informasi yang diinginkan oleh user maka dapat menghilangkan niat user untuk membeli produk yang dijual tersebut.

Gambar 13: www.grsshop.com

Gambar 14: www.grsshop.com

Salah web yang memiliki informasi tidak lengkap adalah www.grsshop.com. Dalam web ini tidak dijelaskan cara pembayaran jika user jadi membeli produk dalam web tersebut. Padahal hal ini yang menjadi sangat penting dalam e-commerce. Dalam web ini hanya menjelaskan cara pemesanan dan pengiriman produk tanpa menjelaskan bagaimana cara membayarnya.

Kamis, 29 September 2011

QR Code Hewan

 QR code adalah kode matriks (barcode 2 dimensi) yang diciptakan oleh Denso Wave -  perusahaan Jepang  pada tahun 1994. QR merupakan singkatan dari Quick Response, dengan tujuan untuk menyampaikan informasi dan mendapatkan respons dengan cepat. QR sangat popular di Jepang karena kemampuannya menyimpan data yang lebih besar dari pada barcode sehingga mampu mengkodekan informasi dalam bahasa jepang sebab dapat menampung huruf kanji. QR mendapatkan standarisasi internasional dan standarisasi Jepang berupa ISO / IEC 18004 dan JIS-X-0510.

Saat ini, implementasi QR Code sudah banyak digunakan terutama di negara Sakura, Jepang. Beberapa contoh implementasi dari QR Code adalah tiket pesawat/ kapal, Identitas Virtual, bidang Pendidikan, Markeeting, Infotaiment, dan Medis.

Salah satu implementasi QR Code yang terfikirkan oleh saya adalah QR Code untuk  informasi binatang (animal information) yang terdapat di kebun binatang. Informasi yang dimaksud di sini adalah profil mengenai deskripsi  hewan-hewan yang terdapat di kebun binatang. Di zaman sekarang ini banyak sekali masyarakat  (mulai dari anak kecil sampai orang dewasa) yang tidak mengetahui deskripsi atau database hewan berupa  nama binatang, nama latin/ilmiah, asal hewan, deskripsi lengkap hewan serta foto hewannya. Oleh karena itu, dengan menggunakan QR Code ini dapat mempermudah pengunjung mengetahui informasi  atau profil lengkap semua hewan yang terdapat di kebun binatang. Walaupun di kebun binatang sudah terdapat papan informasi tapi itu semua belum cukup karena informasi yang diberikan di papan informasi tersebut tidak terlalu lengkap. Dengan menggunakan QR Code maka informasi atau profil yang dapat ditampung mengenai hewan yang ada di kebun binatang jauh lebih lengkap. QR Code untuk informasi atau profil hewan kebun binatang ini diletakan pada papan informasi yang tersedia di depan rumah kadang hewan. Jadi, selain ada QR Code pada papan informasi tersebut juga terdapat deskripsi singkat mengenai hewan. Jika pengunjung ingin melihat deskripsi atau profil lengkap mengenai informasi hewan yang sedang dilihat, mereka (pengunjung) hanya perlu mengarahkan kamera handphonenya ke lambang QR Code. Kamera handphone secara otomatis akan membaca QR Codenya yang hasilnya akan muncul di layar handphone.

Sabtu, 03 September 2011

Interaksi Manusia dan Komputer


belladesoto.us

http://www.belladesoto.us



Sebuah website harus memperhatikan bentuk tampilan agar dapat membuat pengunjung yang melihat website tersebut tertarik dan tidak merasa jenuh atau bosan. Website dengan tampilan menarik yang baik (menarik) akan membuat pengunjung merasa nyaman dan betah berlama-lama untuk membaca informasi yang kita berikan. Sedangkan website yang terlalu banyak tulisan ataupun gambar akan mengganggu mata serta membuat bingung pengunjung web tersebut.

Menurut saya, salah satu website yang memiliki tampilan buruk yaitu belladesoto.us.
Web ini merupakan web yang memberikan informasi-informasi dalam berbagai macam kategori. Mulai dari kategori Art & Entertainment, Business, Food, Education, Health, dan masih banyak lagi.


Tampilan buruk dalam website ini:
1. Warna yang digunakan dalam website ini kurang menarik (terlalu simple, hanya ada warna putih dan biru muda) untuk dilihat.



1. 2.  Warna kotak search yang diletakkan di kanan pojok atas terlalu samar (sama dengan warna background) sehingga agak terlalu sulit untuk dilihat oleh pengunjung yang mempunyai penglihatan tidak normal (minus, plus, silinder).



3. Warna tulisan pada poin pages, categories, archives, dll yang terletak disebelah kanan terlalu samar dengan warna background web ini (putih). Sehingga pengunjung harus melihat dengan jarak yang dekat lagi untuk membaca tulisan tersebut.



Dalam membuat sebuah website, tampilan sangat perlu diperhatikan. Oleh karena itu, para pengembang web harus memperhatikan tampilan webnya agar websitenya bisa dikunjungi serta diterima oleh banyak pengunjung.

Minggu, 22 Mei 2011

Maaf

Sedih bgt kemarin ga bisa pulang ke rmh gara2 MESTI, KUDU, HARUS, WAJIB kerjain project kuliah yang banyak bgt...Padahal sabtu kemarin kakak gw ultah...
Yang bikin tambah sedih wktu kakak gw sms ke gw : "Kok ga ada yang pulang? kan aku bawa kue :-( "
Gw langsung blz sms dy: "Maaf uni, aku ga bs plng coz hrs kerjain tugas"
aduh2...sedih bgt dh

Minggu, 01 Mei 2011

My B'day

Pas ultah w yg ke 20...awal rada BT coz tmn2 dkat w dikampus pada ga ucapin ultah ke gw..padahal klo mereka ultah w berusaha untuk ucpin happy b'day yang pertama buat mereka...hufh
gw sempat berpikir kalo mereka memang sengaja...tp 1 diantara mereka tuh ad yg ngucapin,,,loh trus ini gmn???
Akhir'a ssemua pertnyaan w terjawab...sore'a setelah rapat famghat..tmn2 gw bikin suprise untuk gw...ohh so sweett....pas gw tanya ke mereka kenapa g ucpin happy b'day gw ke ternyata mereka itu sengaja gak ucapin,buat bikin gw kesal...OMG!!!!
tuk rini:thx ya,gw suka bgt kado lo...
Thx for all my friends...w sayang kalian semua