RSS

Less Update

Mungkin blog ini akan jarang di-update mengingat blog ini merupakan blog resmi saya sebagai salah satu anggota civitas akademika Institut Pertanian Bogor. Saya akan lebih banyak menulis di blog saya yang lain yaitu Catatan Kecil Seorang Mahasiswi. Untuk sedikit membedakan dengan blog tersebut, blog resmi saya ini akan saya tulis dengan hal-hal yang lebih bersifat akademis di IPB. So, just check it out..

 

Posted by on July 7, 2010 in General Term

Leave a comment

ERRORS GOT ME CRAZY (Asg. Part Four – End)

No Sign Up Means No Member

Kajian terakhir saya ini berisi beberapa hal yang cukup mengganggu saya ketika menggunakan website majalah kesayangan saya, CITA CINTA. Sebelum beranjak ke Errors yang harus dihadapi, coba Anda lihat tampilan berikut di halaman Home.

Bukan tampilan yang cukup bagus bukan? Dengan text box yang letaknya tidak sejajar tapi justru rata kanan membuat tampilan login tersebut agak terlihat aneh. Hal lain yang saya heran, tulisan SIGN UP sudah dicantumkan tetapi di bawahnya masih tertulis “Belum punya password? Silakan sign up disini” dimana semua tulisan tersebut adalah link. Hm…

Berhubung saya belum mempunyai account di website tersebut, saya akan mencoba sign up (setelah berulang kali gagal). Saya sudah mengisi lengkap formulir sign up di bawah ini


Selanjutnya yang harus saya lakukan adalah menekan tombol Kirim di bawahnya. Tapi apa yang terjadi? Tidak ada reaksi apa-apa setelah saya mengeklik tombol itu dan sudah saya coba berkali-kali. Awalnya saya pikir memang begitu sistemnya dan langsung masuk ke database. Tapi setelah saya mencoba login ternyata gagal. Hm.. Error yang menyebalkan. Saya jadi berpikir apakah website ini benar-benar tidak memiliki member dan admin tidak pernah menyadarinya? Padahal syarat mengikuti kuis di website teresbut adalah menjadi member. Penanganan Error adalah sesuatu yang wajib bagi sebuah penilaian Web Usability.

Hal tersebut adalah Error yang cukup fatal. Selain itu, banyak link di website tersebut yang ternyata hanya berisi halaman kosong alias belum ada isinya. Contohnya ketika saya masuk ke menu Dunia Kerja, lalu membuka Lowongan, Nih. Yang muncul adalah halaman kosong seperti ini

Menurut saya, jika memang halaman tersebut memang selalu kosong (dari dulu sampai sekarang) sebaiknya ditiadakan saja daripada membuat user kesal karena tidak sesuai dengan harapan. Halaman kosong lain bisa ditemui di menu GAYA&CANTIK lalu buka Tampil Beda, bahkan di Section Spotlite.

Memang cukup banyak yang bisa kita temukan ketika kita harus mengkritisi sebuah website. Tetapi mesti disadari bahwa membuat tampilan website tak semudah yang kita bayangkan, ditambah lagi harus disesuaikan dengan bahasa pemrograman yang digunakan jika harus menjalankan sebuah fungsi. Oleh karena itu, dalam website yang saya kaji ini CITA CINTA, tentu saja ada kekurangan dan kelebihan di dalamnya dari segi tampilan dan usability. Tetapi secara keseluruhan bisa dibilang website ini cukup menarik meskipun terlalu banyak iklan dan masih perlu diperbaiki lagi (terutama fungsi sign up) agar sesuai dengan harapan user.

Kajian ini berasal dari pemikiran saya dan refer dari beberapa buku diantaranya The Essential Guide to User Interface Design (karya Wilbert O. Galitz), serta Don’t Make Me Think (karya Steve Krug). Jika Anda tertarik untuk mendalami materi tersebut silahkan membaca buku tersebut atau mengambil mata kuliah Interaksi Manusia Komputer (menyenangkan).

 

IS IT EASY ENOUGH? (Asg. Part Three)

Learnability and Satisfaction

Melanjutkan kajian sebelumnya, saya akan membahas khususnya tentang usability dari website ini, yaitu seberapa mudah user menggunakan website ini dari interface yang ditampilkan. Sebelumnya, silahkan buka website CITA CINTA. Ini adalah halaman awal terbaru di situs tersebut, mengingat situs tersebut akan di-update setiap 2 minggu sekali, baik konten maupun warna latar dan gambarnya.

Saya ingin Anda melihat dengan seksama situs tersebut, dari menu-menu yang ditampilkan, dan saat itu juga tentukan dari mana sebenarnya Anda akan mengeksplore situs tersebut. Sedikit mengira-ngira, bagi Anda yang baru pertama membuka situs tersebut dan belum pernah membaca majalah CITA CINTA, Anda akan mencoba melihat sekilas halaman Home, lalu membuka satu persatu menu di Section atas, yaitu Dunia Kerja, Gaya&Cantik, Tubuh Kita, dll. Tapi untuk saya dan penggemar majalah CITA CINTA yang lain, saya akan mencari resensi majalah CITA CINTA edisi terbaru dan edisi mendatang atau edisi lalu yang terlewatkan oleh saya.

Salah satu komponen dalam Web Usability adalah Learnability, yaitu seberapa mudah user mempelajari fungsi saat pertama kali berhadapan dengan interface sebuah web. Awalnya saya pikir resensi majalah itu akan ada di salah satu menu di Section yang ada. Tapi setelah saya cari, ternyata hanya ada di Home, dan yang ada hanya edisi sekarang dan edisi yang akan datang. Sementara yang ada di dalam menu Dunia Kerja, Gaya&Cantik, dll itu adalah artikel yang sengaja ditulis khusus untuk website tersebut, tidak ada di dalam majalah. Sekarang coba Anda lihat tampilan berikut, yang ada di Homepage.

Jika Anda ingin melihat lebih jauh mengenai salah satu isi tampilan tersebut, misalnya Anda ingin melihat Isyu, menurut Anda kira-kira kemana kursor harus Anda gerakkan? Atau dengan kata lain mana yang bertindak sebagai link? Saya yakin sebagian besar dari Anda akan menjatuhkan kursor Anda ke title, yaitu Isyu, karena hurufnya dicetak tebal. Tapi coba Anda lihat gambar berikut

Ternyata yang menjadi link adalah tulisan di bawah title tersebut. Ketika Anda akan mengeklik link tersebut, Anda akan berharap yang akan muncul adalah resensi mengenai Isyu di CC no ini saja. Tetapi yang tampil justru bukan hanya isyu, tetapi juga konten yang ada di title Gaya di Kantor, Aspirasi, dll. Hal tersebut menunjukkan apa yang dipelajari oleh user ternyata belum tentu sesuai dari fungsi yang sebenarnya.

Hal yang cukup membuat saya heran adalah ketika saya membuka halaman baru melalui link di Section seperti di gambar berikut

Setelah membuka halaman Dunia Kerja, ternyata Section tersebut akan bertambah menjadi seperti ini

Mungkin menu tersebut adalah percabangan dari menu yang ada. Dari situ saya tahu bahwa artikel yang ada di menu Dunia Kerja akan berubah setiap update, yaitu terlihat dari menu yang muncul, Nomor Lalu. Yang saya heran mengapa kita hanya bisa mengakses artikel dari update Nomor ini dan Nomor Lalu saja, mengapa tidak bisa mengakses artikel nomor-nomor sebelumnya. Menurut saya hal tersebut mubazir karena bisa saja artikel yang lama masih berguna dan bisa jadi sumber bacaan yang menyenangkan.

Nah, link yang diberikan di halaman Dunia Kerja ini berbeda dengan yang di halaman Home.

Bisa Anda buktikan bahwa yang menjadi link adalah title yaitu RAHASIA SUKSES… meskipun hurufnya berwarna hitam dan tulisan di bawahnya berwarna biru, dimana biasanya link dikenal dengan warnanya yang biru. Jika Anda membuka salah satu artikel tersebut, Anda hanya akan menemukan satu atau dua paragraf kata di dalamnya.

Tidak sesuai dengan harapan, mungkin itu yang menggambarkan perasaan user ketika menggunakan beberapa fungsi di website tersebut. Hal itu akan mengurangi Usability dari web tersebut, yaitu dari segi Satisfaction (How pleasant is it to use the design), atau istilah lain adalah Engaging. Bagaimana menurut Anda? Apakah sama dengan pendapat saya?
Post saya ini juga bisa dilihat di http://www.nadeea.co.cc/

 

THE POWER OF HOMEPAGE (Asg. Part Two)

Our First Step, Going to Home
Homepage of CITACINTA

Review website CITA CINTA (seperti yang sudah saya jelaskan sebelumnya) akan saya mulai dari halaman awal atau biasa kita sebut Homepage. Banyak disebutkan dalam berbagai literatur bahwa homepage mungkin merupakan halaman yang paling penting dalam sebuah website. Mengapa? Karena dari homepage tersebut-lah orang mendapatkan kesan pertama terhadap website tersebut. Jika kesan pertama tersebut buruk, maka kemungkinan orang akan menutup website tersebut. Namun kesan yang baik akan memicu orang tersebut untuk melakukan eksplorasi lebih lanjut. Oleh karena itu, homepage harus mudah dikenali dan mampu memenuhi tujuannya, yaitu memberi informasi pada viewer mengenai situs tersebut dan memberitahu sedang berada dimana (Galitz, 2007).

Saya akan mencoba membahas halaman tersebut sesuai dengan fungsi dan apa saja yang sebaiknya ada atau terpenuhi dalam sebuah homepage.
·    Size

Dari ukuran, jika memungkinkan sebuah homepage dibatasi hanya satu layar. Hal tersebut mengingat sebaiknya hanya elemen-elemen penting yang dicantumkan dalam homepage. Agar elemen tersebut dapat semuanya terbaca maka sebaiknya diletakan dalam satu layar tanpa scrolling. Scrolling akan membuang waktu viewer sehingga cenderung hanya melihat layar pertama saja tanpa menghiraukan konten setelah scrolling karena dianggap tidak begitu penting. Dalam situs CITA CINTA homepage masih terdiri dari tiga layar dan banyak elemen-elemen yang menurut saya kurang penting untuk dicantumkan di homepage. Mungkin terdapat banyak pertimbangan dari pembuat website, namun saya pribadi prefer untuk melihat homepage dalam satu layar. Bagaimana dengan Anda? ^^
·        Elements to Include

Seperti yang telah saya sebutkan sebelumnya, sebaiknya yang terdapat dalam homepage hanya elemen-elemen penting saja, diantaranya:

o        Owner name or logo : Dalam situs tersebut tercantum di pojok kiri atas.

o        Web site name : Biasanya terdapat di bagian atas situs dan di title bar windows. Dalam situs tersebut logo dapat disebut sekaligus sebagai web site name yaitu CITA CINTA, karena juga tertulis di title bar windows.

o        Brief description : Seharusnya dalam sebuah homepage terdapat deskripsi singkat mengenai situs tersebut. Hal itu tidak terpenuhi dalam situs CITA CINTA. Sebagai saran mungkin dapat ditambahkan deskripsi singkat (sebaiknya tidak terlalu panjang), misalnya: Official Website of CITA CINTA magazine, here you can get the recent update of CITA CINTA edition and latest news ….

o        Navigation links : Elemen ini sangat diperlukan karena merupakan jalan untuk menuju ke halaman-halaman berikutnya dan berisi section dari website tersebut. Dalam website CITA CINTA masih terdapat kekurangan dalam hal navigasi, yaitu kurang terlihat sebagai link dan tidak jelas apakah tulisan tersebut clickable atau tidak karena menggunakan jenis dan ukuran font yang sama dengan tulisan kontennya. Alangkah lebih baik jika tulisan untuk link tersebut dicetak tebal dengan ukuran huruf yang sedikit lebih besar, jika memungkinkan diberi warna biru agar lebih terlihat sebagai link.

o        Summary of latest news and promotion : Informasi terbaru yang selalu up to date akan sangat menguntungkan karena akan mengundang pengunjung untuk membuka kembali situs Anda. Dalam CITA CINTA menurut saya sudah bagus karena selalu ada info terbaru yaitu update tiap dua minggu sekali yaitu tiap majalah tersebut terbit. Akan tetapi dalam situs tersebut promosi mengenai event terbaru atau sponsor terlalu banyak dan menghabiskan banyak space. Akan lebih baik jika materi promosi tidak semuanya disajikan dalam bentuk image atau animasi yang terlalu besar.

o        Search facility : Dalam CITA CINTA masih belum diberikan fasilitas search atau pencarian. Menurut saya fasilitas tersebut sebaiknya ada mengingat konten dari website tersebut banyak dan sulit dicari jika hanya mengandalkan navigasi. Fasilitas search akan sangat membantu viewer untuk menemukan news dari edisi di minggu-minggu sebelumnya dengan hanya memasukkan keyword tertentu atau edisi nomor tertentu.

o        Announce changes : Dapat kita lihat bahwa dalam situs CITA CINTA tersebut terdapat pengumuman mengenai edisi mendatang, baik itu di majalah maupun di website. Hal tersebut akan mengundang orang untuk mengunjungi kembali situs tersebut setelah dilakukan update selanjutnya.

·        Organization and Layout

Dari segi organisasi elemen, homepage CITA CINTA sudah cukup baik yaitu peletakan elemen lebih penting di bagian atas sehingga lebih viewable. Akan tetapi dari segi layout dan tampilan website terdapat beberapa kelebihan dan kekurangan. Salah satu kelebihannya yaitu..
Interesting

Mungkin itu yang akan kita pikirkan ketika pertama melihat Homepage tersebut. Kenapa? Karena kombinasi warna yang menarik. Background hanya terdiri dari dua warna, putih (untuk dasar teks dan konten web), dan biru muda untuk sisi kanan dan kiri pembatas web. Tetapi warna dari image yang ditampilkan dan layout yang berwarna terang membuat web ini mencolok dan mengundang kita yang awalnya hanya berniat numpang lewat menjadi ingin melihat lebih jauh kontennya. Perlu diketahui bahwa warna latar biru dan layout biru tersebut selalu berganti tiap edisi majalah CITA CINTA terbit. So, tidak membosankan untuk dilihat.
Tetapi di balik kebaikan tersebut, hal negatif yang saya catat setelah beberapa kali membuka web tersebut yaitu
Too many blinking objects

Memang animasi flash dengan gambar berubah-ubah tiap beberapa detik akan menarik perhatian, tetapi jika terlalu banyak animasi dalam satu halaman tentu saja merupakan suatu hal yang membingungkan karena terlalu banyak points of interest. Hal itu membuat user bingung yang mana sebaiknya yang dilihat terlebih dahulu. Objek/animasi yang terus menerus berkedip/berubah-ubah juga akan menghancurkan readability halaman tersebut karena akan mengganggu konsentrasi pembaca saat akan membaca konten yang ada dalam halaman tersebut. Mata pembaca akan terus menerus beralih dari tulisan ke blinking objects sehingga merupakan annoying distraction. Alangkah lebih baik jika animasi tersebut hanya diberikan seperlunya saja.

·        Access

Dalam sebuah web site sebaiknya memungkinkan akses yang mudah ke homepage dari halaman-halaman lain. Homepage merupakan tempat kembali bagi viewer ketika menghadapi masalah atau kebingungan menggunakan sebuah web site, atau ketika ingin memulai eksplorasi baru. Untuk itu perlu difasilitasi untuk dapat secepatnya mengakses homepage, yaitu dengan menaruh label Home di bagian atas atau sebelum navigation links. Namun, dalam situs CITA CINTA belum terdapat label home. Hal itu akan menyulitkan mengingat tidak semua user mengetahui bahwa logo website adalah link menuju ke homepage.

Cukup panjang memang pembahasan dari saya. Semoga Anda dapat ikut menikmati penjelajahan lebih detail mengenai sebuah website dan bagaimana mengkaji satu per satu elemen di dalamnya. Apakah pendapat Anda sama dengan saya??? Untuk halaman-halaman lain akan saya bahas di postingan saya selanjutnya.

 

Posted by on June 20, 2010 in Human Computer Interaction

Leave a comment

WEBSITE REVIEW ….CITA CINTA… (Asg. Part One)

Piece Information About The Website

http://www.citacinta.com/

No Offense..


Beberapa postingan saya yang akan datang saya akan mencoba membahas tentang tampilan antarmuka dan sisi usability dari sebuah website buatan Indonesia. Saya memang bukan ahli HCI (Human Computer Interaction), bukan reviewer handal, atau ahli di bidang design graphic. Tapi di sini saya duduk sebagai user akan mencoba berbagi dengan Anda dan sekaligus mengajak Anda untuk berpikir kritis ketika Anda sebenarnya mencari informasi di internet dengan membuka website favorit Anda.

Yup, website yang akan coba saya bahas adalah website salah satu majalah yang pembacanya adalah mayoritas wanita yang duduk di bangku kuliah dan juga wanita karier. Nama majalah tersebut adalah CITA CINTA. Mungkin sebagian dari Anda, khususnya kaum hawa, pernah melihat, membaca, atau bahkan menjadi member di situ. Saya akan mengajak Anda untuk ikut me-review website majalah tersebut, caranya, cukup membuka situsnya http://www.citacinta.com/ , dan selanjutnya baca review saya di postingan ini dan postingan saya selanjutnya (Nantikan saja ^^).

Sebelumnya saya akan memberi sedikit bayangan tentang website tersebut, barangkali ada diantara Anda yang belum pernah mendengar, mengetahui, apalagi membukanya. Namun, bagi pembaca setia majalah CITA CINTA (seperti saya) pasti sudah pernah setidaknya tahu meskipun belum tentu pernah membukanya. Hal itu karena dalam tiap edisi majalah tersebut dicantumkan alamat web-nya. Menurut bayangan saya, website tersebut adalah website dimana kita dapat mengetahui sekilas isi dari CITA CINTA tiap edisi, khususnya edisi terbaru, dan jika beruntung bisa membaca full content gratis. Dalam kenyataannya, memang kita tidak bisa membaca isi majalah tersebut secara keseluruhan, tapi kita bisa melihat konten secara singkat beberapa rubrik yang terdapat dalam majalah tersebut, contohnya Dunia Kerja, Gaya & Cantik, Tubuh Kita, dll. Sajian singkat tersebut justru menarik kita untuk membaca secara lengkap dalam majalahnya, dan satu-satunya cara adalah dengan membelinya (atau pinjam dari teman). Selain itu, sesuai bayangan saya, melalui website tersebut kita bisa memperoleh informasi lain yang up2date, info zodiak, info berlangganan majalah tersebut, dll. Meskipun, menurut saya informasi yang diberikan masih setengah-setengah dan kurang interaktif.

Cukup demikian saja sedikit perkenalan tentang CITA CINTA. Menurut saya website tersebut merupakan salah satu yang cukup menarik untuk dikaji. Bukan untuk dijelek-jelekkan atau sekedar mencari-cari kesalahan, tapi mencoba berpikir kritis dan sebagai contoh penerapan ilmu Interaksi Manusia Komputer ^^. Sekali lagi, no offense..

 

Posted by on June 8, 2010 in Human Computer Interaction

Leave a comment