LAPORAN AKHIR
M.K INTERAKSI MANUSIA DAN KOMPUTER
SEMESTER GENAP – 2007/2008
Kajian Situs
http://www.anekahobby.com
oleh:
Noviana Pramitasari
G64052939
(
http://pramitas.wordpress.com
)
INSTITUT PERTANIAN BOGOR
DAFTAR ISI
DAFTAR ISI...2
DAFTAR GAMBAR...3
1
Pendahuluan...4
2
Analisis Situs Aneka Hobby...4
2.1
Resolusi Screen...4
2.2
Nama Situs dan Banner...5
2.2.1
Nama Situs...5
2.2.2
Banner
...5
2.3
Navigasi...6
2.3.1
Navigasi yang terletak di bagian atas (menu)...6
2.3.1.1
Home
...7
2.3.1.2
About Us
...8
2.3.1.3
Catalogue
...8
2.3.1.4
Shopping Cart
...9
2.3.1.5
FAQ
...11
2.3.1.6
Contact Us
...11
2.3.2
Navigasi yang terletak di bagian kiri...12
2.4
Isi...14
2.5
Footer
...15
3
Evaluasi Keseluruhan...16
4
Saran untuk Situs...17
5
Penutup...19
DAFTAR GAMBAR
Halaman
1 Teks Judul Situs ... 5
2 Banner Situs ... 5
3 Bagian Keterangan di Atas Banner ... 6
4 Pewarnaan Navigasi Menu ... 6
5 Penamaan Menu ... 7
6 Tampilan Meboo ... 7
7 Kesatuan Breadcrum ... 9
8 Bottom di Menu Shopping Cart ... 9
9 Textbox Email yang Terlalu Sempit ... 10
10 Konfirmasi Pesanan ... 10
11 Proses Pesanan ... 11
12 Contact Form pada Menu Contact Us ... 12
13 Pada Menu About Us dan Contact Us Terdapat Bagian yang Kosong ... 12
14 Product Catalogue ... 13
15 Product Catalogue yang Harus Dicocokkan Oleh Pengguan ... 13
16 Kategori Produk yang Panjang ... 13
17 Kategori Photo Album yanng Tidak Memiliki Produk Sama Sekali ... 14
18 Link untuk Melihat Produk Lainnya di Kategori yang Sama ... 14
1.
Pendahuluan
Situs ini merupakan situs yang memberikan layanan penjualan ecaran dan grosir kerajinan tangan berupa pernak-pernik, hiasan, hingga peralatan rumah tangga. Selain itu juga melayani pesanan pembuatan kerajinan tangan dan menyediakan kursus singkat untuk belajar membuat kerajinan tangan. Situs ini beralamat di www.anekahobby.com dan merupakan situs Indonesia. Situs ini di kaji untuk dianalisis pada tanggal 28 Mei 2008.
2.
Analisis Situs Aneka Hobby
Penjelasan lebih rincinya di bagi menjadi:2.1 Resolusi Screen
Salah satu hal penting yang harus diperhatikan mengenai lebar (width) halaman situs. Statistik menunjukkan bahwa kebanyakan komputer pengguna saat ini memiliki resolusi 800 x 600 atau 1024 x 768 pixels. Kecendrungan saat ini menunjukkan bahwa resolusi 1024 x 768 pixels akan menjadi resolusi yang paling kecil di masa mendatang. Jika lebar dari halaman situs melebihi resolusi komputer pengguna, maka ketika pengguna mengakses halaman situs, pengguna harus melakukan scrolling ke samping untuk melihat seluruh konten. Hal ini tentu saja kurang bagus karena pengguna membutuhkan usaha yang lebih untuk mendapatkan informasi dari situs.
Untuk mengatasi masalah ini ada 2 solusi, diantaranya:
a. Membuat lebar halaman situs sesuai dengan ukuran terkecil resolusi monitor saat ini yaitu 800 pixels atau lebih kecil dari itu. Harapannya adalah agar semua komputer pengguna dapat menampilkan halaman web tanpa harus scrolling ke samping. Akan tetapi, dengan lebar halaman yang hanya 800 piksel tentu tidak banyak informasi yang dapat disampaikan. Selain itu, akan mubazir jika komputer pengguna yang mengakses web memiliki resolusi tinggi (lebih besar dari 800 x 600 piksel) karena halaman situs yang ditampilkan tetap dengan lebar 800 pixels.
b. Menggunakan ukuran yang dinamis. Lebar halaman situs didefenisikan dengan menggunakan ukuran persentase. Misalnya, jika lebar halaman didefenikan 90% maka ketika dibuka pada komputer dengan resolusi berapapun, maka lebar halamannya akan memenuhi 90% dari lebar layar. Cara ini tentu lebih baik karena tidak bergantung kepada resolusi komputer pengguna. Selain itu, penyampaian informasi pada halaman web juga menjadi lebih efektif karena jika resolusi komputer pengguna tinggi, maka informasi yang akan ditampilkan juga lebih banyak. Jika komputer pengguna memiliki resolusi rendah, maka informasi pada halaman situs tetap tersaji dengan baik karena tidak ada scrolling ke samping.
Situs Aneka Hobby menggunakan cara yang pertama untuk masalah resolusi dalam masalah mengatasi scroll ke samping .
2.2 Nama Situs dan Banner 2.2.1 Nama Situs
Gambar1 : Teks judul situs Ada beberapa hal yang dapat dibahas di bagian ini, yaitu:
1. Nama situs sudah berada pada pojok kiri atas memperkuat identitas perusahaan pemilik situs.
2. Terdapat kalimat slogan (tagline) yang dapat mendeskripsikan situs tersebut. Hal yang mungkin terjadi bagi pengguna yaitu terdapat pengguna yang tidak dapat menangkap maksud deskripsi singkat tersebut karena pengunaan bahasa yang tidak konsisten. 3. Nama situs dan tagline menjadi link ke menu home hal ini sangat membantu user, jika
saat menelusuri situs binggung untuk kembali ke halaman utama. 2.2.2 Banner
Gambar2 : Banner situs Pada banner terdapat 4 hal dapat dibahas, yaitu:
a. Penjelasan mengenai situs AnekaHobby yang tidak konsisten dalam penggunaan bahasa. Hal ini membuat pengguna tertentu menjadi kurang nyaman.
b. Pewarnaan pada huruf Search Products yang sama dengan backgroundnya membuat memberikan kesulitan bagi pengguna yang memiliki penglihatan yang kurang baik untuk membaca kata Products.
c. Tiga textbox pencarian membantu pengguna dengan cepat mencari produk, dan tepat memberikan default dari textboxt dan bentuk drop down list Harga dan Kategori Produk sehingga dapat membantu pengguna tanpa pengguna harus mengetikkan satu-persatu dan dapat cepat tersambung ke database.
d. Tepat meletakkan search di banner, sehingga search akan muncul di setiap halaman yang diakses, memudahkan pengguna karena tanpa harus mencari link atau bottom
search jika ingin melakukan pencarian.
Pada bagian atas banner ada 2 hal yang dibahas, diantaranya:
a. Terdapat bagian yang memberikan informasi jumlah pemesanan dan ada di tiap halaman sehingga pengguna dapat tahu jumlah pesanan ditiap saat akses situs, pada bagian ini sangat membantu pengguna.
b. Terdapat link yang bentuknya tidak konsisten dengan link lainnya sehingga dapat membingungkan pengguna
Keterangan di atas dapat dilihat pada gambar di bawah ini.
Gambar3 : Bagian keterangan di atas banner 2.3 Navigasi
Ada dua buah jenis navigasi yang berada pada tiap halaman. Isi dari kedua halaman navigasi ini berbeda dan sudah dikelompokkan berdasarkan fungsinya. Hal ini memudahkan pengunjung bila ingin mengunjungi halaman yang sesuai dengan fungsi yang diinginkannya. Kedua navigasi tersebut yaitu:
2.3.1 Navigasi yang terletak di bagian atas (menu)
Merupakan navigasi menuju halaman yang menjelaskan mengenai segala sesuatu tantang situs AnekaHobby. Terdapat 3 hal yang dapat di bahas, yaitu:
a. Urutan fokus mata pengguna dalam mengamati sesuatu dimulai dari bagian atas, kiri, kanan, dan terakhir adalah bagian bawah. Merujuk pada fakta ini, maka penempatan informasi paling penting yaitu menu, sebaiknya diletakkan pada bagian atas karena menu merupakan ide pokok yang mengetengahkan informasi utama yang dimiliki oleh sebuah situs. Peletakan menu utama pada situs Aneka Hobby ini cukup baik karena diletakkan pada bagian atas. Dengan demikian, ketika pengguna menggunakan situs maka pengguna bisa langsung mengetahui konten apa saja yang ditawarkan oleh situs tersebut.
b. Saat memilih salah satu menu, tampilan menu yang terpilih tidak memiliki perubahan warna (perbedaan warna tab dengan menu yang tidak terpilih). Sehingga memaksa pengguna yang lupa berada di menu apa untuk mencocokkan menu terpilih dengan breadcrumb yang terdapat di sisi kiri situs. Perbedaan warna tampilan menu hanya saat kursor berada di menu tersebut. Pada gambar dibawah ini yang di pilih adalah menu home tapi yang berwarna berbeda atau lebih tua menu Contact Us, karena kursor menunjuk ke menu Contact Us. Hal ini dapat membingungkan pengguna.
c. Pada tiap menu (berhasa Inggris) saat dipilih terdapat tab tulisan berbahasa Indonesia yang dapat membantu pengguna awam untuk mengerti maksud dari salah satu menu yang di pilih pengguna, yaitu diantaranya:
1. About us Profil Aneka Hobby 2. Catalogue Daftar Produk
3. Shopping Cart Keranjang Pesanan 4. FAQ Pusat Pertanyaan dan Jawaban 5. Contact Us Hubungi Kami
Contohnya pada menu Catalogue dibawah ini.
Gambar5 : Penamaan menu
Setelah melakukan penjelajahan ke dalam situs, diketahui bahwa struktur dari situs secara garis besar adalah sebagai berikut:
2.3.1.1 Home
Ada beberapa hal yang dibahas pada pada menu home, diantaranya:
a. Pada bagian ini terdapat Random Product yaitu produk-produk yang di ditampilkan pada menu home merupakan produk yang di acak dari katalog yang beragam. Penggunaan nama Random Produk tidak diketahui oleh seluruh pengguna, lebih baik jika menggunakan bahasa Indonesia.
b.
Terdapat Live Chat yang menghubungkan langsung ke situs www.meebome.com yang dapat memudahkan pengguna untuk dapat berkomunikasi dengan perusahaan AnekaHobby. Selain berkomunikasi dengan media teks juga dapat dengan media suara yang terlihat di bagian pojok kiri bawah pada window meebo me yang dapat di close oleh pengguna. Seperti dapat dijelaskan Gambar6 : Tampilan meebo pada gambar di samping.
c. Pada kolom paling kanan terdapat content How To Buy yang merupakan penjelasan bagaimana pengguna melakukan pembelian produk di situs Aneka Hobby, via telepon, atau via email. Penjelasan Jam kerja dan daerah
layanan perusahaan. Dari penjelasan ini dapat meyakinkan pengguna pada situs ini dan pengguna dapatkan banyak bantuan tentang situs ini.
d. Terdapat Buyer’s Testimonial yang merupakan komentar orang-orang yang menjadi pelanggan atau pembeli situs AnekaHobby.
e. Pada bagian bawah terdapat iklan yang berupa flash yang membuat load menjadi lebih lama. Maka lebih baik jika menggunaka multimedia jika menguntungkan pengguna. Tampilan flash pada bagian ini tidak meguntungkan pengguna jadi lebih baik dirubah dalam bentuk teks atau
image biasa.
f. Tampak kekonsistenan ukuran warna teks judul yaitu menggunakan warna abu-abu dan oranye tanpa spasi. Sehingga tidak membingungkan pengguna pada Product Catalogue, Random Product, Live Chat, How To Buy, dan
Buyer’s Testimonial.
2.3.1.2 About Us
Bagian ini berisikan informasi menenai segala sesuatu yang dapat di lakukan dilakukan oleh Aneka Hobby, mulai dari kemudahan memilih barang yang akan di beli, layanan pengirimn barang, layanan pemesanan barang, dan layanan kursus singkat belajar membuat kerajinan tangan.
2.3.1.3 Catalogue
Bagian ini berisikan 5 hal yaitu:
a. penjelasan produk-produk dalam satu kategori mulai dari nama, gambar, harga, dan deskripsi singkat produk serta bottom untuk memesan produk tersebut.
b. Terdapat link detail yang bila di klik dapat memberikan penjelasan yang lebih lengkap, diantaranya terdapat berat produk, dan bottom yang dapat memperbesar foto produk, serta bottom untuk memesan produk tersebut. c. Selain itu juga terdapat keterangan tanggal update terakhir dari perusahaan,
jumlah stok produk, dan ditampilkan berapa kali oleh pengguna-pengguna lain.
d. Bottom untuk memesan produk tersebut yang terletak di halaman deskripsi singkat dan detail produk memudahkan pengguna memesan atau memasukkan produk dalam keranjang belanja pengguna.
e. Pada bagian atas deskripsi penjelasan produk pengguna dapat kembali ke halaman satu kategori produk dengan klik link nama kategori produk di bagian atas deskripsi detail produk. Hal ini sangat membantu pengguna untuk dapat dengan cepat kembali melihat produk-produk lain dari kategori tersebut. Tetapi dapat juga membinggungkan pengguna karena nama kategori tidak bersamaan dengan breadcrumb Catalogue.
Keterangan mengenai produk tersebut dapat mendeskripsikan secara jelas kepada pangguna mengenai produk-produk yang ingin di beli pengguna.
Gambar7 : Kesatuan Breadcrum 2.3.1.4 Shopping Cart
Pada bagian ini terdapat keranjang pesanan yaitu seluruh produk yang dipesan pengguna dapat ditampilkan di table yang berisi nomor, nama produk, harga satuan, kuantitas, sub total, total berat produk, dan total biaya yang dipesan pengguna. Pada bagian ini terdapat 3 hal yang dapat dibahas, yaitu:
a. Pada bagian ini menjelaskan bagaimana pengguna dapat mengubah kuantitas produk dan membatalkan satu atau lebih produk yang sudah di pesan. Dengan penjelasan yang singkat dan jelas pada bagian ini dapat banyak membantu pengguna .
b. Memudahkan pengguna untuk memperjelas list produk-produk yang sudah di pesan, dan memudahkan untuk meng-update, dan membatalkan pesanan karena pada bagian bawah terdapat bottom batal, update, dan kembali berbelanja dengan susunan bottom yang tepat yang dapat membantu pengguna.
c. Pada bottom kembali berbelanja terdapat tanda panah ke kiri yang sekaligus dapat mendeskripsikan fungsi bottom sehingga dapat meyakinkan pengguna untuk menekan bottom tersebut.
Gambar8 : Bottom di Menu Shopping Cart
d. Pada pengisian identitas pengguna pada textbox Email terlau kecil sehingga memaksa pengguna menggerakkan kursor untuk memeriksa kebenaran email. Keterangan lebih lanjut dapat dilihat pada gambar di bawah ini.
Gambar9 : Textbox Email yang Terlalu Sempit
e. Pada konfirmasai pesanan di tampilkan identitas pengguna, sehingga jika terdapat kesalahan pengetikan pengguna dapat dengan mudah memperbaikinya. Terdapat radio butoon yang dapat di pilih pengguna untuk memilih jenis kiriman, sudah terdapat default. Terdapat catatan penting yang di perlukan oleh pengguna, akan lebih baik jika catatan penting tersebut terletak di atas bagian botton kembali dan 3. Proses pesanan. Kalimat Konfirmasi pesanan akan lebuh baik jika berupa breadcrumb sehingga memudahkan pengguna untuk kembali ke halaman sebelumnya jika ada perbaikan. Keterangan lebih lanjut dapat di lihat pada gambar di bawah ini.
Gambar10 : Konfirmasi pesanan
f. Pada keterangan proses pesanan dalam teks berwarna oranye tampak kurang konsisten, akan lebih baik jika berwarna hitam dan disamakan dengan font sebelumnya, hanya ukurannya yang di ubah. Judul proses pesanan lebih baik berupa breadcrumb yang dapat meyakinkan pengguna untik kembali kehalaman sebelumya. Keterangan lebih lanjut dapat di lihat pada gambar di bawah ini.
Gambar11 :Proses Pesanan 2.3.1.5 FAQ
Bagian ini berisikan hasil rangkuman berbagai petanyaan yang sering di lontarkan oleh pengunjung kepada Aneka Hobby. Dengan adanya menu ini dapat membantu pengguna yang memiliki keraguan terhadap situs Aneka Hobby, sehinga dapat membaca pertanyaan dan jawaban yang ada kemungkinan Aneka Hobby telah menjawab pertanyaan pengguna.
Terdapat 2 hal yang dapat dibahas, yaitu:
a. Format pertanyaan-pertanyaan yang sisusun paling atas dan berupa link, sehingga memudahkan pengguna tidak harus membaca seluruh jawaban. Pengguna dapat klik link pertanyaan yang dipilih dan langsung dapatkan jawabannya tanpa harus scroll ke bawah untuk mencari jawaban yang dimaksud.
b. Terdapat link back to top yang memudahkan pengguna untuk kembali kehalaman atas untuk mencari pertanyaan lain atau ke navigasi lain tanpa harus scroll.
2.3.1.6 Contact Us
Bagian ini berisi hal-hal penting, diantaranya:
a. Alamat dan nomor telepon yang dapat di hubungi untuk mendapatkan informasi-informasi mengenai produk-produk yang di jual di Aneka Hobby. Hal ini sangat banyak membantu pengguna untuk percaya pada situs, atau jika pengguna kurang percaya dan memiliki pertanyaan mengenai situs dapat ditanyakan langsung ke nomor yang bisa dihubungi. b. Terdapat Live Chat, yang dapat memudah pengguna untuk langsung
onLine dengan pemilik situs AnekaHobby. Simbol berwarna kuning menunjukkan pemilik situs sedang onLine dan putih jika sedang tidak
onLine, hal ini sangat membantu karena pengguna tidak akan tertipu untuk menekan bottom jika pemilik situs sedang tidak onLine.
c. Contact Form dapat digunakan pengguna untuk mengirimkan pesan langsung kepada pemilik situs via email, dengan mengisikan nama, email, subjek, dan pesan yang dikirim. Terdapat beberapa kekurangan pada bagian Contact Form, yaitu:
1. Penggunaan bahasa yang digunakan tidak konsisten (Judul, Nama
TextBox, dan bottom berbahasa Inggris sedangkan penjelasan menggunakan bahasa Indonesia).
2. Terdapat tanda bintang merah yang menunjukkan textbox harus diisi, tapi untuk pengguna yang masih awam tidak mengerti maksud bintang merah tersebut, dan pengguna akan tertipu untuk menekan bottom
Send sebelum melengkapi textbox, dan hal ini sangat merugikan pengguna karena pengguna harus mengetik ulang seluruh textbox yang harus diisi.
Keterangan di atas dapat dilihat pada gambar di bawah ini.
Gambar12 : Contact form pada menu Contact Us
2.3.2 Navigasi yang terletak pada sebelah kiri dari bagian content
Navigasi yang terdapat di sebelah kiri berisi product catalogue, terdapat beberapa hal yang di behas dalam situs ini, yaitu:
a. Product Catalogue terletak di sisi kiri pada setiap menu kecuali menu Shopping
Cart, sehingga memudahkan pengguna untuk dapat dengan mudah mengakses katalog-katalog untuk memesan produk di situs tersebut.
b. Jumlah kategori yang terlalu banyak semuanya di list ke bawah sehingga memaksa pengguna untuk scroll ke bawah, sehingga sangat menggangu kenyaanan pengguna. c. Karena product Catalogue terlalu banyak dan disusun memanjang maka pada menu
About Us dan Contact Us terdapat bagian yang kosong yang tidak berisi apapun. Keterangan diatas dapat di lihat pada gambar di bawah ini.
Gambar13 : Pada menu About Us Contact Us terdapat bagian yang kosong d. Nama-nama katalog terurut menurut alfabetis sehingga penguna mudah untuk
e. Nama-nama katalog dalam bahasa Indonesia sehingga dapat memudahkan pengguna.
f. Pada katalog Produk Terbaru dan Produk Terlaris ada beberapa hal yang perlu dibahas, diantaranya:
1. Terletak paling atas sehingga membuat pengguna dapat dengan cepat mengakses tanpa harus scroll ke bawah.
2. Berwarna berbeda dan lebih mencolok dibandingkan katalog lainnya sehingga lebih terlihat menonjol.
3.
Tanda panah pada bagian kiri tidak konsisten karena pada katalog lainnya terdapat disebelah kanan dan terlihat hanya saat kursor didekatkan. Selain itu juga bentuk panahnya tidak konsesten. Keterangan tersebut dapat dijelaskan pada gambar di samping ini.
Gambar14: Product Catalogue
g. Katalog produk yang sudah terpilih tidak memiliki warna yang berbeda dengan katalog yang tidak terpilih dan memaksa pengguna untuk mencocokkan pada bagian atas di list kalalog. Keterangan di atas dapat di jelaskan pada gambar di bawah ini.
Gambar15 : Product Catalogue yang Harus di Cocokkan oleh Pengguna h. Pada nama katalog produk yang panjang di bagian akhirnya tertindah oleh tanda
panah sehingga tampak kurang rapi. Keterangan di atas dapat di jelaskan pada gambar di bawah ini.
Gambar16 : Kategori Produk yang Panjang
i. Pada salah satu pilihan kategori tidak ada produk yang di tawarkan sama sekali, lebih baik jika ketegori tersebur di hapus agar tidak menpu pengguna. Keterangan lebih lanjut dapat di lihat pada gambar di bawah ini. Yaitu pada kategori Photo Album.
Gambar17 : Kategori Photo Album yang Tidak Mimiliki Product Sama Sekali 2.4 Isi
Pada bagian isi memiliki white space yang cukup besar membantu pengguna dalam mengoptimalkan tampilan agar mudah di baca oleh pengguna. Bagian isi akan di bahas untuk tiap menu, seperti di bawah ini :
1. Menu Home:
Pemilihan bagian isi tepat berwarna putih agar mudah dibaca pengguna karena produk-produk yang ada sudah memiiki warna yang beraneka ragam. Sehingga gambar produk-produk terlihat jelas, keterangan produk yang berwarna hitam dan abu-abu terlihat jelas, link nama produk berwarna biru terlihat jelas, dan buttom yang berwarnaoranye juga terlihat paling jelas. Sehingga membuat pengguna menjadi lebih terbantu dan yakin untuk klik
link dan bottom, untuk selanjutnya melakukan transaksi ke situs Aneka Hobby. Tiap baris dari produk yang ditampilkan memiliki warna background yang sedikit berbeda yaitu abu-abu muda dan putih hal ini agar terlihat variatif dan tidak membuat pengguna menjadi jenuh.
2. Menu About Us :
Bagian isi pada menu About Us ini juga memilki background berwarna putih sehingga penjelasan yang ada di menu ini yang berwarna abu - abu terlihat lebih jelas dibandingkan menggunakan warna background selain putih. Kalimat penjelasan dalam menu ini jelas dan membuat pengguna tidak malas untuk membaca karena ukuran yang yang cukup (tidak terlalu besar dan tidak terlalu kecil) dan jumlah kata per-barisnya yang memenuhi kriteria (pada menu About Us jumlah kata per-barisnya 2 sampai 14 kata). Penjelasan di bagi menjadi 5 bagian seingga tidak memaksa pengguna untuk membaca seluruh bagian yang ada di menu ini. Kekurangan pada menu ini yaitu pemilihan font yang tidak seragam dengan menu-menu yang lainnya. Agar konsisten
font pada menu ini disamakan hanya saja ukurannya lebih di besarkan agar terlihat lebih rapi.
3. Menu Catalogue
Isi dari menu ini hampir sama dengan menu Home, hanya saja pada menu ini pengguna dijelaskan produk-produk di masing-masing kategori produk. Pada bagian bawah dari isi ini, pengguna di bantu dengan dapat klik link angka produk berikutnya untuk melihat produk selanjutnya di halaman yang lain. Akan lebih baik bila link tersebut juga terdapat di bagian atas, sehingga pengguna dapat dengan mudah klik link tersebut tanpa harus
scroll ke atas atau ke bawah. Keterangan diatas dapat dilihat pada gambar di bawah ini.
4. Menu Shopping Cart
Bagian isi pada menu Shopping Cart ini juga memilki background berwarna putih sehingga text yang ada di menu ini yang berwarna abu – abu dan merah terlihat lebih jelas. Header pada tabel yang berwarna biru disiasati dengan text yang berwarna putih
5. Menu FAQ
Bagian isi pada menu FAQ ini juga memilki background berwarna putih sehingga penjelasan yang ada di menu ini yang berwarna abu - abu terlihat lebih jelas dibandingkan menggunakan warna background selain putih. Kalimat penjelasan dalam menu ini jelas dan membuat pengguna tidak malas untuk membaca karena ukuran yang yang cukup (tidak terlalu besar dan tidak terlalu kecil) dan jumlah kata per-barisnya yang memenuhi kriteria (pada menu FAQ jumlah kata per-barisnya maksimal 14 kata).
Link berwarna biru juga terlihat jelas dan di beri batasan untuk tiap pertanyaan dan tiap jawaban juga di beri batasan. Selain itu, simbol amplop tertutup yang terdapat di tiap pertanyaan dan jawaban yang bersimbol amplop terbuka membantu mendeskripsikan maksud dari menu tersebut.
6. Menu Contact Us
Bagian isi pada menu Contant Us ini juga memilki background berwarna putih sehingga penjelasan yang ada di menu ini yang berwarna abu - abu terlihat lebih jelas. Textbox pada bagian Contact Form di beri warna yang berbeda dengan backgroun agar dapat terlihat dengan jelas (karena umumnya textbox berwarna putih).
Pada bagian isi dapat di simpulkan bahwa telah memenuhi prinsip-prinsip desain yaitu:
a. Contrast : Perbedaan warna yang kontras antara huruf dan background sehingga
pengguna dapat dengan mudah membaca.
b. Repetition / Consistency : Perulangan halaman yang konsesten membuat penguna tidak perlu beradaptasi lagi atau belajar menggunakan situs menjadi cepat.
c. Alignment : Penyusunan layout sehingga mudah di baca.
d. Proximity : Mengelompokkan objek sejenis dan memisahkan yang tidak mirip untuk menunjukkna hubungan dan kepentingan.
2.5 Footer
Gambar19 : Bagian Footer
Terdapat beberapa hal yang dapat di bahas dalam bagian footer, yaitu:
1. Pada bagian footer pemilihan huruf dan backgroud tepat, sehingga kalimat dapat dengan mudah terbaca walaupun ukuran huruf kecil.
2. Terdapat gambar di sudut kiri yang tepat digunakan karena menggambarkan kalimat
Costomer Care.
3. Pada Customer Care terdapat nomor telepon perusaan yang dapat di hubungi oleh pengguna, walaupun di bagian menu Contact Us sudah ada.
4. Terdapat Live Chat yang juga terdapat di menu Contact Us dan di menu Home di sebelah kiri. Hal ini sangat banyak membantu pengguna untuk menghubungi persaahaan yang memiliki situs AnekaHobby.
5. Di kolom bangian kanan terdapat keterangan pengembangan situs dan nama pengembang situs.
3.
Evaluasi Keseluruhan
Agar lebih baik dalam memenuhi persyaratan Human Computer Interaction(HCI), seperti :
No. Faktor Interksi Manusia dan Komputer
Evaluasi untuk Situs AnekaHobby secara keseluruhan
1. Usability
Learnaility
(kemampuan pembelajaran)
- Pengguna mudah dalam mempelajari situs karena banyak keterangan-keterangan yang membantu pengguna dalam bahasa indonesia.
- Pengguna dapat dengan cepat menguasai situs karena pilihan menu yang tidak terlalu banyak, sehingga pengguna dapat dengan cepat mengerti. - Pengguna dapat memiliki kemampuan
mempertahankan pengetahuannya setelah jangka waku tertentu, karena fitur situs yang berbantuk standart seperti situs-situs lain pada umumnya.
Thoughput
(Tolak Ukur Keluaran)
- Pengguna dapat kurang cepat dalam melakukan
task yang ada dalam situs karena masih banyak terdapat scroll. Karena pilihan kategori diselebal kiri yang terlalu panjang.
- Pengguana akan sedikit melakukan kesalahan karena banyak petunjuk-petunju dalam melakukan
task.
- Pengguna tidak banyak membutuhkan bantuan orang untuk memperbaiki kesalalan yang telah dilakukannya, cukup pengguna sendiri saja yang dapat memperbaiki kesalahannya.
Flexibility
(Keluwesan)
- Situs ini hanya cocok untuk pengguna menengah dan mahir dan tidak cocok untuk pengguna pemula karena banyak istilah-istilah, dan navigasi-navigasi yang perlu dipelajari.
- Sistem tidak dapat diubah untuk memenuhi jalan kerja yang berbeda atau perbedaan level dari suatu keahlian, hanya terdapat satu sistem yang terdapat dalam situs AnekaHobby.
Attitude - Pengguana akan cukup puas dengan situs tersebut
(Perilaku) navigasi yang membutuhkan pembelajaran lebih lanjut.
- Pengguna akan memperoleh manfaat yang besar karena pengguna diberikan kemudahan dalam bertransaksi oleh situs.
- Pengguna akan cukup lama mengunakan situs tersebut jika, situs tersebut sering mengupdate item-item yang di jual.
2. User Experience
- Pengguna Novice: Situs ini tidak tepat oleh pengguna dengan kemampuan yang masih kurang, pengguna novice akan mudah frutasi dan binggung maka dampak buruknya kan menunggalkan situs. - Pengguna Advanced Beginner : Situs ini dapat
dengan mudah digunakan oleh pengguna yang memiliki pengalaman Advanced Beginner , karena pada situs AnekaHobby banyak petunjuk-petunjuk sehingga memudahkan penggunaan situs.
- Pengguna Competent Performer dan Pengguna
Expert sangat mudah menggunakan situs ini karena sering mempelajari dan pengalamannya yang cukup tinggi.
3. User Interface
- Banyak bagian- bagian dari situs yang kurang memungkinkan pengguna berintaraksi dengan situs, diantaranya terdapat warna teks dan warna
backgrond yang sama sehingga menyulitkan pengguna untuk membaca dan mengetahui maksud dari tulisan tersebut.
4.
Saran untuk Situs
Ada Bebera saran untuk situs AnekaHobby, yaitu: 1. Penamaan situs
Nama situs tidak konsisten (Aneka dalam bahasa Indonesia, Hobby dalam bahasa Inggris) dan Pemberian nama situs tidak mendeskripsikan bahwa situs ini merupakan situs penjualan pernak-pernik. Selain itu slogan (tagline) dalam bahasa Inggris dapat mendeskripsikan situs untuk pengguna yang mengerti bahasa Inggris, tidak untk pengguna yang masih awam. Perubahan Slogan memang sangat vital tapi untuk memenuhi kriteria seluruh user experience perlu dilakukan perubahan.
2. Breadcrumb
Breadcrumb digunakan untuk menginformasikan kepada pengguna mengenai posisi mereka saat ini. Dengan menggunakan breadcrumb, pengguna juga dapat menelusuri
mudah dapat kembali ke halaman sebelumnya. Pemberian breadcrumb yang tepat sehingga dapat membantu pengguna, alahkah lebih baik lagi jika breadcrumb berupa
link yang dapat di klik di tiap path oleh pengguna.
Perancanngan navigasi yang baik memberikan petunjuk kepada pengguna tentang: a. Dimana letak sesuatu berada
b. Bagaimana mendapatkan sesuatu yang mereka butuhkan dalam cara yang teratur Arsitektur Informasi yang baik membuat pengguna nyaman mengeksplorasi dan percaya kembali kehalaman sebelumnya dengan mudah.
3. Typografi
a. Gunakan sedikit mungkin typeface (sekumpulan karakter grafik yang termasuk didalamnya berbagai tipe dan style, contohnya:Halvetica, Times, Courier) atau tipe
font. Gunakan saja ragam bobot dan ukuran dari typeface yang digunakan, misalnya:
italic atau bold. Pada situs AnnekaHobby terdapat Ransom-note typographi yaitu terlalu banyak penggunaan font dalam sebuah halaman. Dapat dijabarkan sebagai berikut:
1. Times New Roman • ukuran 12,5 dan 12 • tebal dan tidak tebal 2. Calibri (Body)
• ukuran 11
• Tabal dan tidak tebal 3. Arial
• ukuran 11 dan 10,5 • tabal dan tidak tebal
4. Huruf banner yang memiliki 2 bentuk huruf
b. Ragam ukuran font bergantung dari kepentingan pesan yang ingin disampaikan. c. Atur kerning (jarak antar huruf) sehingga spasi diantaranya terlihat nyaman. d. Berikan warna huruf dan background yang berbeda sehingga dapat mudah terbaca. 4. Kombinasi warna konten
Kombinasi warna-warna cukup banyak, selain itu juga banyak gradasi-gradasi warna sehingga berkesan warna semakin banyak. Hal ini dapat menarik perhatian pengguna dan dapat membuat membuat pengguna menjadi bosan. Karena produk yang di jual pada situs tersebut sudah berwarni. Saran: kurangi gradasi warna dan pilih warna-warna yang tidak terlalu mencolok serta tetap pertahankan kekonsistenan warna-warna di tiap pilihan menunya.
5. Navigasi
Gunakan navigasi yang konsisten, karena :
a. Pengguna tidak ingin menghabiskan waktu mengingat-ingat atau belajar navigasi dari situs yang berbeda-beda. Sehingga gunakan struktur navigasi yang mencerminkan sudut pandang pengguna terhadap situs, informasi, dan servisnya. b. Membantu pengguna menvisualisasikan lokasi saat ini dan pilihan yang terdapat di
situs serta mengurangi pendugaan.
c. Membuat pengguna merasa nyaman untuk mengeksplorasi situs. d. Pengguna dapat memiliki rasa dan susunan situs.
e. Banyak membantu pengguna karena navigasi yang konsisten tidak ambigu tentang letah informasi.
6. Link
Link yang telah di kunjungi tidak berubah warnanya, untuk memudahkan pengguna mengingat link mana saja yang telah dikunjungi lebih baik link berubah warna saat sudah di pilih.
7. Scroll
Pada situs ini scoll ke bawah terlalu banyak terutama di halaman menu Home, About Us Catalogue, FAQ, dan Contact Us. Hal ini di sebabkan karena bagian kategori produk yang banyak di jabarkan satu persatu. Akan lebih baik jika produk kategori dipisahkam menurut sub kategori lagi,sehingga tidak terlalu memanjang ke bawah.
8. White Space
Bagian dari halaman situs yang tidak memiliki teks atau ilustrasi apapun. White Space memudahkan pengguna untuk memproses informasi dengan baik. Sebuah situs yang memiliki sedikit White Space akan menyulitkan pengguna untuk mengidentifikasi informasi yang penting. Sebaliknya, penggunaan White Space yang terlalu banyak juga kurang bagus karena halaman situs akan terasa kosong. Pengembangan situs harus menyeimbangkan proporsi White Space dengan konten yang ada, artinya White Space jangan terlalu sedikit tetapi juga tidak terlalu banyak sehingga pengelompokan informasi dapat dilakukan dengan baik. Pada situs Aneka Hobby, pengembang terlalu banyak menggunakan White Space pada halaman menu About Us dan halaman menu
Contact Us. Hal ini menimbulkan kesan kosong pada halaman-halaman tersebut. Space yang kosong ini sebaiknya digunakan untuk menampilkan informasi lain.
9. Form
Cursor sebaiknya secara otomatis berada pada field pertama yang ada pada Contact Form di halaman menu Contact Us. Hal ini akan membuat pengguna mendapatkan sedikit kemudahan dibandingkan harus mengklik terlebih dahulu menggunakan mouse. Sebaiknya jangan pernah menggunakan tombol reset. Tombol reset akan merugikan pengguna jika tiba-tiba pengguna tidak sengaja mengklik tombol tersebut, maka semua data yang telah diisinya akan hilang.
5.
Penutup
Tulisan ini diharapkan menjadi bahan masukan bagi pengembang untuk mengembangkan situs Aneka Hobby dengan lebih memperhatikan faktor-faktor Interaksi Manusia dan Komputer diantaranya Usability, User Experience, dan User Interface. Kekurangan-kekurangan yang masih ditemui, sebaiknya segera diperbaiki agar situs dapat terlihat profesional. Dengan demikian, kepercayaan pengguna/pelanggan terhadap perusahaan akan meningkat.
DAFTAR PUSTAKA
Nielsen J & Loranger H. 2006. Prioritizing Web Usability. Berkeley : New Riders.
P. Insap Santosa, “Interaksi Manusia dan Komputer; Teori dan Praktek”, Andi Yogyakarta, 1997 Heribertus Himawan, Solichul Huda, “Catatan Kuliah Interaksi Manusia dan Komputer”, Sistem Informasi Udinus, 2007
