LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama...

17
LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN KOMPUTER SEMESTER GENAP – 2007/2008 Kajian Situs http://www.flasindo.com Oleh: April Rustianto G64050620 (http://ilkomstudent.wordpress.com ) INSTITUT PERTANIAN BOGOR 2008

Transcript of LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama...

Page 1: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

LAPORAN AKHIRM.K INTERAKSI MANUSIA DAN KOMPUTER

SEMESTER GENAP – 2007/2008

Kajian Situshttp://www.flasindo.com

Oleh:April Rustianto

G64050620(http://ilkomstudent.wordpress.com)

INSTITUT PERTANIAN BOGOR2008

Page 2: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

DAFTAR ISI

HalamanSampul......................................................................................................................................................IDaftar Isi.................................................................................................................................................IIBAB 1 PENDAHULUAN.......................................................................................................................1

1.1 Web Usability............................................................................................................................11.2 Web PT. FLASINDO INTERNUSA PRATAMA.....................................................................1

BAB 2 ANALISIS WEB PT. FLASINDO INTERNUSA PRATAMA.................................................22.1 Nama perusahaan......................................................................................................................32.2 Pengelompokan Menu..............................................................................................................32.3 Link...........................................................................................................................................32.4 Breadcrumb..............................................................................................................................32.5 Tampilan website yang kurang konsisten.................................................................................42.6 Kategori produk........................................................................................................................42.7 Search.......................................................................................................................................62.8 Login status...............................................................................................................................62.9 Image........................................................................................................................................72.10 Formulir..................................................................................................................................72.11 Price list..................................................................................................................................82.12 Scrolling..................................................................................................................................92.13 Penempatan teks.....................................................................................................................92.14 Cara berbelanja.....................................................................................................................102.15 Halaman yang tidak berguna................................................................................................122.16 User menu.............................................................................................................................122.17 Main menu............................................................................................................................122.18 Iklan......................................................................................................................................132.19 Resolusi layar........................................................................................................................132.20 Navigasi halaman..................................................................................................................132.21 Duplikasi konten...................................................................................................................13

BAB 3 PENUTUP.................................................................................................................................143.1 Kesimpulan.............................................................................................................................143.2 Saran.......................................................................................................................................14

DAFTAR ISI..........................................................................................................................................15

II

Page 3: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

BAB I PENDAHULUAN

1.1 Web UsabilityWeb usability merupakan faktor penting dalam mengembangkan suatu website. Pengembang

harus memahami prinsip-prinsip usability sebelum mengimplementasikannya pada sebuah web. Menurut Jacob Nielsen, usability adalah sebuah atribut kualitas yang menilai tingkat kemudahan user interface untuk digunakan. Usability juga mengacu pada metode untuk meningkatkan kemudahaan penggunaan website oleh user.

Usability didefinisikan melalui lima komponen, yaitu:1. Learnability

Learnability menjelaskan tingkat kemudahan pengguna untuk melakukan task-task dasar ketika pertama kali mereka melihat atau menggunakan hasil perancangan.

2. EfficiencyEfficiency menjelaskan tingkat kecepatan pengguna dalam menyelesaikan task-task setelah mereka mempelajari hasil perancangan.

3. MemorabilityMemorability menjelaskan tingkat kemudahan pengguna dalam menggunakan rancangan dengan baik, setelah beberapa lama tidak menggunakannya.

4. ErrorsErrors menjelaskan jumlah error yang dilakukan oleh pengguna, tingkat kejengkelan terhadap error dan cara memperbaiki error.

5. SatisfactionSatisfaction menjelaskan tingkat kepuasan pengguna dalam menggunakan rancangan.

Sebuah web dangan usability akan ditinggalkan penggunanya hanya dalam hitungan menit. Berikut ini adalah beberapa kondisi yang akan membuat pengguna meninggalkan web:

➔ Web Sulit digunakan➔ Navigasi web yang buruk.➔ Pengguna tidak mendapatkan apa yang diinginkan.➔ Pengguna mendapatkan adanya kesalahan pada web.➔ Homepage tidak menjelaskan tentang apa yang ditawarkan oleh perusahaan➔ Petunjuk yang kurang jelas

1.2 Website PT. FLASINDO INTERNUSA PRATAMA PT. FLASINDO INTERNUSA PRATAMA merupakan perusahaan yang bergerak di bidang

jasa dan perdagangan TI (Teknologi Informasi). Lingkup usahanya meliputi:➢ Penjualan Komputer dan peripheral lainnya➢ Penjualan buku-buku tutorial komputer➢ Penjualan software➢ Jasa pembuatan website dan Lab Sekolah➢ Jasa membangun usaha warnet➢ Jasa service komputer➢ Suplier hardware komputer, software, dan asesoris

PT. FLASINDO INTERNUSA PRATAMA memiliki website yang beralamatkan di http://www.flasindo.com, secara garis besar website perusahaan ini mempunyai tujuan:

➢ Memasarkan hardware komputer, software, aksesoris, dan buku secara online➢ Menyediakan fasilitas untuk meliihat harga barang-barang yang dijual serta spesifikasinya➢ Mempromosikan jasa layanan yang ditawarkan oleh perusahaan ➢ Menyediakan informasi mengenai alamat, email, dan nomor telepon yang bisa dihubungi

oleh pengguna

1

Page 4: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

BAB II ANALISIS WEB PT. FLASINDO INTERNUSA PRATAMA

Analisis terhadap website PT. FLASINDO INTERNUSA PRATAMA yang beralamatkan di http://www.flasindo.com dilakukan dengan menganalisis penerapan kaidah web usability berlandaskan pada buku Prioritizing Web Usability karangan Jakob Nielsen. Di dalam buku ini, terdapat dua belas poin penting yang harus dicermati dalam mendesain dan membangun sebuah website, yaitu :

1. Nothing to Hide

2. The Web User Experience

3. Revisiting Early Web Usability Findings

4. Prioritizing Your Usability Problems

5. Search

6. Navigation and Information Architecture

7. Readability & Legibility

8. Writing for the Web

9. Providing Good Product Information

10. Presenting Page Elements

11. Balancing Technology with People's Needs12. Design That Works

Pembahasan pada makalah ini tidak dikelompokkan berdasarkan dua belas poin di atas. Pembahasan akan dikelompokkan berdasarkan sub-poin dari tiap-tiap poin sesuai dengan kondisi yang ditemukan pada website PT. PT. FLASINDO INTERNUSA PRATAMA. Selain merujuk kepada buku Prioritizing Web Usability analisis juga merujuk kepada buku Don`t make me think karangan Steve Krug, dan juga buku GUI Bloopers 2.0 karangan Jeff Johnson

2.1 Nama perusahaan

Nama perusahaan merupakan identitas utama sebuah website. Identitas ini digunakan untuk menginformasikan kepada pengguna tentang web yang sedang mereka kunjungi. Pada Website ini tidak terdapat slogan (tagline) yang menggambarkan website tersebut. Namun ketiadaan tagline tidak membuat bingung pengguna akan konten dari website ini, karena halaman depan dari website ini sudah memperlihatkan produk yang dijualnya.

Gambar Halaman utama www.flasindo.com

2

Page 5: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

2.2 Pengelompokan MenuPengelompokan menu bertujuan untuk mempermudah pengguna mengakses menu-menu

tertentu. Pengelompokan dilakukan terhadap menu-menu yang memiliki kedekatan fungsionalitas. Pada website ini menu dibagian kiri dikelompokkan menjadi tiga bagian, yaitu main menu, layanan kami, dan online-shop seperti yang diperlihatkan gambar berikut.

Gambar Pengelompokan Menu

Menu yang dikelompokkan saat ini terdapat duplikasi atau link ganda yaitu link Cara Berbelanja yang sama dengan Cara Pesan, dan link Pembayaran pada bagian Main Menu dan link Pembayaran pada bagian Layanan Kami. Seharusnya link yang terduplikasi dihilangkan saja karena hanya membingungkan pengguna. Sedangkan untuk bagian Main Menu sebaiknya dihilangkan saja karena link-link yang terdapat pada bagian tersebut sudah terdapat pada bagain Top Menu. Keadaan yang seperti itu membuat pengguna berpikir link mana yang seharusnya saya klik untuk menuju halaman yang saya inginkan. Website yang baik seharusnya membuat pengguna langsung mengetahui apa yang harus mereka lakukan untuk mendapatkan apa yang mereka inginkan bukan membuat pengguna bingung dengan link yang terduplikasi.

2.3 LinkPada website ini terdapat link yang tidak terdapat kontennya sama sekali. Hal ini tentu

membuat pengguna bingung dan frustasi melihat link produk yang ia cari ternyata tidak ada. Dari sekian banyak link yang terdapat pada wabsite ini penulis menemukan banyak link yang kosong tidak berisi konten apapun, link-link yang tidak mempunyai konten sama sekali, yaitu:

➔ Processor → AMD → AMD Socket A(462)Pada bagian sublink “AMD Socket A(462)” inilah pengguna akan menemui halaman website yang kosong sama sekali. Memang saat ini Prosesor jenis AMD Socket A(462) sudah sangat jarang yang berminat untuk membelinya, tetapi jika ada pengguna yang iseng ingin mencari prosesor AMD jenis ini maka pengguna akan kecewa karena link yang mereka kunjungi ternyata isinya kosong. Kenapa tidak menghilangkan saja item ini dari list produk yang perusahaan FLASINDO jual, sehingga tidak membuat penggunjung kecewa karenanya.

➔ UPS → APC➔ Printer → HP➔ Speaker

2.4 BreadcrumbBreadcrumb digunakan untuk menginformasikan kepada pengguna mengenai posisi mereka

saat ini. Dengan menggunakan breadcrumb, pengguna juga dapat menelusuri path yang telah dilaluinya sampai berada di posisi saat ini sehingga pengguna dengan mudah dapat kembali ke halaman sebelumnya. Pada website ini terdapat breadcrumb yang cukup membantu pengguna untuk mengetahui posisi mereka saat ini. Namun, terdapat suatu keanehan pada breadcrumb di website ini, ketika pengguna berada di halaman Home kemudian pengguna meng klik link Home maka akan muncul gambar dibawah ini.

3

Page 6: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

Gambar 4 Breadcrumb

Keberadaan breadcrumb yang berperilaku seperti itu justru membuat pengguna bingung karena pengguna berpikir dia telah masuk kedalam sub menu Home yang bernama Home juga dengan halaman yang sama juga. Hal ini membuat pengguna berpikir kenapa di dalam Home terdapat Home lagi. Kasus yang sama juga muncul ketika pengguna meng klik gambar desktop PC ataupun Notebook. Breadcrumb yang muncul ketika pengguna meng klik gambar desktop PC adalah Home → Home → Desktop PC, dan hal ini juga terjadi pada saat pengguna meng klik gambar Notebook yang terdapat pada halaman Home.

2.5 Tampilan website yang kurang konsistenSecara Umum layout dari website ini cukup konsisten untuk setiap halaman. Pada Setiap

halaman terdapat header dan Top Menu. Begitu juga menu-menu yang ada disebelah kanan dan kiri. Perubahan layout website ini hanya terjadi ketika pengguna sudah login ke dalam website. Selain itu, layout website ini berubah menjadi sangat kacau dan tidak beraturan. Seperti terlihat pada Gambar Setelah Pengguna menekan tombol Download layout website ini berubah menjadi berantakan. Menu-menu yang berada disebelah kanan bergeser ke arah kiri sehingga masuk ke bagian body utama dari website ini. Selain itu, bagian menu yang terletak disebalah kiri juga tidak terlihat. Menu ini ternyata bergeser jauh kebawah dan masuk ke bagian sebelah kanan body utama website ini. Hal tersebut cukup menggambarkan ketidak konsistenan layout dari website ini. Sebaiknya setiap halaman web didesain dengan memperhatikan aspek-aspek kekonsistenan, mulai dari layout, menu, dan lain-lain.

2.6 Kategori ProdukWebsite ini mengelompokkan produk-produk yang dijualnya berdasarkan kategori produk,

yaitu Desktop Pc, notebook, monitor, speaker, memory, optical drive, hardisk drive, usb flash disk, motherboard, processor, UPS, keyboard & mouse, Branded PC, Printer, dan Software. Website ini juga menyediakan fasilitas untuk melihat semua daftar produk yang dijual. Berikut tampilan dari pengelompokkan produk.

Gambar side menu Kategori Produk Gambar Kategori Produk

Kedua Jenis menu kategori produk terlihat cukup rapih, namun sayang peletakannya agak kurang sesuai karena bagian menunya hampir sebagian tertutup iklan yang terdapat diatas menu kategori produk. Sehingga untuk melihatnya pengguna harus melakukan scrolling terlebih dahulu. Selain itu, Menu-menu yang terdapat sebelah kiri juga tidak terlihat.

Jika kita mengeksplore lebih jauh terhadap item-item yang terdapat di tiap-tiap kategori, maka kita akan melihat sederetan produk tampil di halaman web. Pengelompokkan terhadapat item-item dalam tiap-tiap produk ternyata tidak dilakukan semuanya. Pengelompokkan yang terjadi pada kategori produk adalah sebagai berikut:

4

Page 7: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

● Produk Desktop PC dikelompokkan berdasarkan spesifikasinya, yaitu advance, medium, dan basic.

● Produk Notebook tidak dikelompokkan berdasarkan apapun. Semua jenis notebook ditampilkan begitu saja tanpa ada pengelompokkan berdasarkan merek maupun berdasarkan pengelompokkan yang lainnya. Hal ini cukup menyulitkan pengunjung karena item notebook yang muncul berjumlah 14 buah, sehingga pengunjung harus melakukan usaha ekstra untuk melihat semua item notebook.

● Produk Monitor juga tidak dikelompokkan berdasarkan apapun. Karena jenis monitor yang ditawarkan tidak terlalu banyak pengunjung website pun tidak akan terganggun dengan hal tersebut.

● Pada produk Speaker ternyata tidak terdapat item apapun didalamnya. Kondisi ini cukup membingungkan pengguna website, dikarenakan pengguna tidak menemukan item apapun didalam kategori speaker padahal pada kategori produk yang ditampilkan di halaman Home terdapat produk speaker yang dijual oleh website ini. Hal tersebut tentu saja membuat pengguna bertanya-tanya apakah memang benar website ini menjual speaker atau tidak.

● Produk Memory juga tidak dikelompokkan berdasarkan kategori apapun. Namun, karena jenis memory yang disediakan oleh website ini tidak terlalu banyak hanya lima buah saja, sehingga pengelompokkan jenis memory pun tidak terlalu di perlukan.

● Produk Optical Drive juga tidak dikelompokkan berdasarkan kategori apapun. Masalah yang muncul pada produk Notebook juga terjadi pada produk optical Drive juga. Jenis Optical Drive yang disediakan yang berjumlah sebelas buah menjadikan halaman website semakin panjang. Hal ini menyebabkan pengguna harus melakukan scrolling untuk melihat semua jenis Optical Drive yang tersedia.

● Produk Hardisk Drive di kategorikan berdasarkan merek masing-masing produk sehingga lebih mempercepat pengguna dalam melakukan pencarian barang yang diperlukan.

● Produk USB Flash Disk hanya dikelompokkan berdasarkan satu jenis USB saja, yaitu PenDrive. Pengelompokkan ini dirasa tidak diperlukan karena hanya akan memperlambat pengguna untuk melihat tipe PenDrive yang diinginkannya.

● Produk Motherboard dikelompokkan berdasarkan jenis motherboard. Namun, pada kategori motherboard AMD Socket A(462) tidak terdapat item satupun yang muncul.

● Produk Processor dikelompokkan berdasarkan tipenya juga, pengelompokkan ini sama seperti pengelompokkan pada produk motherboard.

● Produk UPS hanya dikelompokkan menjadi satu jenis saja, yaitu APC (Berdasarkan merek). Namun, yang cukup membingungkan ketika link APC ini di klik maka tidak terdapat item apapun. Padahal pada link UPS sudah terdapas UPS bermerek APC.

● Produk Keyboard dan Mouse dikelompokkan menurut merek yang disediakan oleh website ini.

● Produk Branded PC tidak dikelompokkan, karena hanya terdapat satu buah item pada kategori ini.

● Produk Printer Dikelompokkan berdasarkan merek. Namun terdapat keanehan pada pengelompokkan ini, link Hp kosong. Sementara printer merek Hp terdapat pada ketegori produk printer.

● Produk Software tidak dikelompokkan berdasarkan jenis apapun. Walaupun begitu tidak terlalu menyulitkan pengguna karena hanya tujuh buah item yang muncul.

Terdapat satu buah link lagi pada website ini, yaitu list all product. Link ini tentunya akan menampilkan semua produk yang tadi telah di kategorikan ke dalam produk-produk diatas. Setelah semua list item produk muncul ternyata terdapat item yang belum di kategorikan pada pengkategorian produk diatas. Produk tersebut adalah buku tutorial komputer, dan NIC (network interface card / kartu jaringan). Kenapa item-item tersebut tidak dimasukkan kedalam kategori produk yang dijual oleh website ini. Hal tersebut tentu saja membingungkan pengguna karena di satu sisi mereka menemukan terdapat kategori produk yang tidak terdapat isinya sama sekali, di lain pihak mereka milhat terdapat item yang tidak dikategorikan ke dalam produk terntentu.

Harga produk yang tidak dicantumkan dalam deskripsi produk juga membuat pengguna pergi meninggalkan website. Memang ada sebagian kecil produk yang mencantumkan harganya. Namun, Kebanyakan produk yang ditampilkan di website ini tidak menampilkan harga produknya. Untuk melihat daftar harga, pengguna harus login sebagai member terlebih dahulu. Hal itu tentunya membuat

5

Page 8: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

pengguna harus melakukan usaha ekstra hanya untuk melihat harga dari suatu produk. Belum lagi jika daftar harga tersebut tidak mencantumkan gambar dari produk yang tersedia. Pengguna harus mencocokannya lagi dengan gambar yang terdapat pada website ini. Masalahnya setelah login pengguna tetap tidak bisa mendapatkan daftar harga yang di inginkan. Hal tersebut tentu saja sangat membuat pengguna frustasi. Daftar harga / price list yang tidak bisa di download di jelaskan pada bagian 2.11 price list.

2.7 SearchSearching merupakan salah satu fitur yang harus terdapat pada sebuah website. Fitur

searching akan memudahkan pengguna untuk mencari dan menemukan informasi tertentu yang terdapat pada sebuah website dengan mudah dan cepat. Pengguna hanya perlu memasukkan beberapa kata sebagai kata kunci dan sistem website akan menampilkan halaman hasil yang sesuai dengan kata kunci. Penggunaan fitur ini tentu lebih menghemat waktu pengguna daripada harus browsing ke semua halaman web untuk mendapatkan informasi tertentu.

Pada website ini fitur searching dapat digunakan untuk mencari produk yang tersedia pada website ini. Dari segi tampilan, form search yang terdapat pada website ini cukup baik. Panjang dari search box adalah 20 karakter, cukup lumayan untuk menampung inputan kata kunci dari pengguna. Namun, jumlah karakter yang dapat dimasukkan ternyata hanya 20 karakter saja. Jika karakter inputan yang dimasukkan lebih dari 20 karakter maka kata kunci yang dimasukkan tidak akan tertulis pada search box. Gambar loop yang terdapat disebelah kanan kotak pencarian ternyata hanya sebuah gambar yang tidak bisa di klik sama sekali. Idealnya gambar loop tersebut dapat di klik untuk menampilkan hasil pencarian. Tampilan dari form search yang dimiliki website ini masih bisa di optimalkan lagi dengan menambahkan kata Search pada bagian atas kotak pencarian dan pemberian tombol search pada bagian kanan kotak pencarian atau bagian bawahnya.

Gambar form Search

Hasil dari pencarian menggunakan fasilitas search ini cukup relevan. Dengan memasukkan kata kunci “acer” pengguna dapat langsung menemukan sederetan produk acer. Tampilan hasil pencarian terlihat dari gambar beikut ini.

Gambar hasil pencarian

Dari ketiga pilihan pencarian, pilihan exact frase menghasilkan keluaran yang paling banyak diatara kedua opsi pilihan yang lain. Sedangkan untuk mengurutkan hasil pencarian berdasarkan utamakan yang terbaru dan utamankan yang terlama terlihat tidak ada perbedaan yang muncul antara kedua jenis pengurutan tersebut. Jika pengguna ingin mengurutkan hasil pencarian berdasarkan pilihan paling populer, maka tidak ada satu pun item yang muncul.

6

Page 9: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

2.8 Login StatusWebsite ini menyediakan form login untuk pengguna yang ingin mendownload Price List

yang disediakan oleh website. Pada Bagian login form terdapat “Saya lupa password?” yang akan meminta email dan usename pengguna untuk kemudian mengirimkan password pengguna ke email yang mereka miliki dan juga terdapat link “Daftar Baru” untuk pengguna yang belum terdaftar sebagai member website ini. Hal-hal yang disebutkan diatas cukup membantu pengguna baik itu mengingat kembali passwordnya maupun membuat akun baru pada website ini.

Setelah pengguna login, bagian login form isinya akan berubah menjadi status login dari pengguna yang berisi username dari pengguna, cukup membatu pengguna untuk mengetahui status loginnya. Namun yang sangat disayangkan pengguna kadang kala otomatis logout jika pengguna mengakses kategori produk yang terdapat pada online-shop, walaupun pengguna tidak menekan tombol logout sekalipun. Website yang baik seharusnya konsisten dan tidak membingungkan pengguna, sehingga hal-hal yang disebutkan sebelumnya tidak seharusnya terjadi, karena hanya akan membuat pengguna bingung dan membuat task yang ingin dilakukan pengguna ketika statusnya sebagai member terganggu. Untuk dapat login kembali pengguna harus memasukkan username dan passwordnya ke dalam login form.

Gambar Login Form Gambar Login Status

Pada Website ini login form cukup memegang peranan penting, karena tanpanya pengguna tidak akan mendownload Price List. Namun, permasalahan seputar penunjuk status login yang sering menghilang pada halaman website cukup membuat frustasi pengunjung website ini.

2.9 ImageGambar iklan Pendrive yang terletak di halaman Home terlihat seperti gambar iklan biasa,

dan kita akan akan mengira itu hanya gambar saja dan bukan merupakan link ke halaman lain. Namun, sekali lagi anggapan itu adalah salah. Kenyataannya gambar tersebut merupakan link ke halaman deskripsi tentang produk pendrive itu sendiri, cukup mengagetkan pengguna.

Selain itu juga, gambar Desktop PC, Notebook, dan EEEPC yang terpampang dihalaman Home juga cukup menyita space / ruang tampilan website pada browser. Gambar tersebut menutupi bagian produk kategori yang berada tepat di bawahnya. Seperti terlihat pada Gambar 1 diatas, gambar Desktop PC dan lain-lain menutupi produk kategori yang seharusnya lebih ditonjolkan kepada pengguna. Keadaan yang demikian membuat pengguna harus melakukan scrolling terlebih dahulu untuk melihat produk-produk yang tersedia di website ini. Hal ini dapat membuat pengunjung website ini menjadi tidak tertarik dengan website ini dikarenakan mereka tidak menemukan langsung apa yang mereka inginkan pada halaman Home.

2.10 FormulirTerdapat paling tidak sedikitnya empat buah formulir dalam website ini. Namun, hanya dua

buah formulir saja yang akan dibahas pada bagian ini. Bagian pertama adalah formulir pendaftaran. Pada formulir ini terdapat beberapa isian yang harus diisi oleh pengunjung situs, diataranya adalah nama, username, password, dan email. Pada isian email terdapat kelemahan pengecekan yang terdapat di website ini, yaitu sistem tidak melakukan pengecekan terhadap kebenaran format alamat email yang diisikan pengguna, sehingga pengguna bisa saja hanya mengisikan satu buah huruf saja pada isian email ini. Padahal password yang dituliskan pengguna nantinya akan dikirimkan ke email pengguna yang mendaftar di website ini. Jika dari awal alamat emailnya saja sudah salah, maka password dari pengguna tidak akan dikirimkan ke emailnya sama sekali. Kelemahan yang lain adalah, Ketika pengguna sudah mengisi semua isian yang disediakan seketika itu juga pengguna dapat langsung login

7

Status Login

Page 10: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

ke website ini. Hal ini sangat berbahaya, karena rawan sekali terhadap tindakan spamming dan pemalsuan identitas yang diisikan pada formulir pendaftaran. Idealnya ketika seseorang telah berhasil mengisi semua isian yang disediakan pada sebuah pendaftaran member terlebih dahulu pengguna harus memvalidasi pendaftarannya melalui email yang dikirimkan oleh website yang bersangkutan, dan setelah itu pengguna baru dapat login ke website tersebut.

Gambar Formulir Pendaftaran member

Dari tampilan formulir pendaftaran terlihat bahwa, website ini tidak terlalu memperhatikan panjang karakter yang diisikan pada formulir. Contohnya saja pada kolom isian nama dan username panjangnya sama padahal biasanya username seseorang itu lebih pendek dari namanya. Selain itu juga pada formulir pendaftaran tidak terdapat fitur keamanan lain semisal captcha yang dapat menghindarkan website dari serangan spam yang begitu gencar terjadi di dunia internet.

Bagian yang kedua adalah form untuk mengganti password pengguna yang sebelumnya. Pada form ini hanya terdapat pengecekan username dan emailnya apakah terdapat di database atau tidak. Jika pengguna salah memasukkan username atau email miliknya maka sistem akan memberikan peringatan bahwa username dan passwordnya tidak terdapat dalam database. Setelah itu pengguna harus memasukkan lagi username dan emailnya dengan benar untuk dapat mengganti password. Hal tersebut tentunya membuat kerja pengguna menjadi lebih lambat, karena pengguna harus memasukkan lagi username dan emailnya. Jika username dan email pengguna tetap tertulis di dalam form tersebut tentu saja pengguna tinggal mengedit username atau emailnya yang salah saja. Hal tersebut tentunya akan mempercepat kerja dari pengguna.

2.11 Price ListDownload price list dalam website ini terlihat cukup besar dan mencolok, seperti yang

diperlihatkan pada Gambar 1. Kebanyakan para pengguna website yang mengunjungi sebuah webstore (website yang menjual barang atau jasa secara online) tentunya akan langsung melihat bagian price list dan juga bagian produk. Karena pengguna ingin membandingkan terlebih dahulu harga barang dari tiap merk dan ditiap webstore yang mereka kunjungu untuk mendapatkan harga yang terbaik. Untuk mengunduh price list (daftar harga) tersebut pengguna bisa melakukan klik pada bagian berikut.

Gambar Download Price list

Seperti terlihat pada gambar diatas tombol download Price List cukup menarik perhatian pengguna. Namun, seorang pengguna yang ingin cepat mendapatkan daftar harga tersebut tentunya tidak akan terlalu memperhatikan tulisan yang terdapat pada tombol tersebut, yaitu untuk mendapatkan daftar harga pengguna harus melakukan pendaftaran terlebih dahulu. Hal ini bertentangan dengan prinsip dasar usability yang terdapat pada buku GUI Bloopers karangan Jeff Johnson, yaitu Don’t distract users from their goals yang artinya jangan mengganggu pengguna dari tujuan mereka. Dengan munculnya kewajiban untuk mendaftar bagi pengguna yang ingin mendapatkan daftar harga produk dari website ini tentunya akan sangat mengganggu kecepatan dan kenyamanan pengguna dalam melakukan tujuan mereka mengunjungi suatu situs.

Setelah pengguna berhasil melakukan pendaftaran seharusnya pengguna dapat langsung menekan tombol Download Price list untuk mendapatkan apa yang pengguna inginkan, yaitu daftar harga produk yang tersedia di website ini. Namun aksi yang muncul setelah pengguna menekan

8

Syarat untuk mendownload Price List

Page 11: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

tombol Download sangant membuat pengguna kecewa. Pengguna hanya mendapati halaman website yang rusak dan tidak tertata rapi. File daftar harga barang yang di inginkan pengguna pun tidak muncul sama sekali. Inilah tampilan halaman website setelah pengguna menekan tombol dowload.

Gambar Setelah Pengguna menekan tombol Download

Dari gambar diatas terlihat bahwa pengguna tidak mendapatkan apapun selain halaman website yang rusak diatas. Selain itu tulisan dalam halaman tersebut yang berbunyi “Maaf anda tidak punya hak untuk mengakses halaman ini” membuat pengguna berpikir kenapa saya tidak bisa mengakses halaman ini padahal status saya sedang login saat ini. Hal yang seperti tidak seharusnya terjadi pada website yang menerapkan usability yang bagus. Sebuah website yang menerapkan prinsip-prinsip usability yang salah satunya adalah don`t make me think.

2.12 ScrollingPengguna website kebanyakan malas untuk melakukan scrolling dan kalaupun mereka

melakukan scrolling, maka mereka hanya melakukannya sedikit saja (satu atau dua kali scrolling). Website ini kurang memperhatikan sisi ini. Untuk melihat seluruh konten web pengguna perlu melakukan scrolling hingga berkali-kali. Hal ini terlihat jika pengguna ingin melihat jenis-jenis notebook yang tersedia di website ini, maka pengguna harus melakukan scrolling yang cukup banyak untuk dapat melihat semua produk notebook yang tersedia. Dalam website ini tersedia 14 jenis notebook, yang kesemuanya ditampilkan dalam satu halaman website. Hal yang demikian akan merepotkan pengguna. Ditambah lagi setelah melakukan scroll sampai akhir pengguna harus melakukan scroll lagi untuk bisa kembali ke halaman website yang paling atas.

Hampir semua halaman web pada website ini harus di scroll terlebih dahulu untuk melihat seluruh isi dari halamannya. Minimnya navigasi pada halaman tersebut membuat pengguna harus mengeluarkan usaha ekstra untuk melihat seluruh isi dari website ini. Panjangnya halaman web membuat pengguna kesulitan untuk bernavigasi menggunakan breadcrumb yang tersedia pada bagain atas dari halaman web.

2.13 Penempatan teksPada halaman awal dari website ini terdapat beberapa baris teks yang berisi kalimat untuk

9

Page 12: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

meyakinkan pengunjung website ini agar mau membeli produk di sini, dengan cara meyakinkan bahwa barang yang mereka beli dijamin produk baru dan bergaransi karena telah melewati Quality Control dari teknisi PT Flasindo. Berikut ini teks yang berada pada halaman depan situs ini.

Gambar Teks ajakan membeli produk

Dari isinya teks diatas lebih baik diletakkan dibagian paling atas atau diletakkan di bagian yang terlihat oleh pengunjung. Teks ini perlu di tonjolkan karena isi dari teks tersebut membuat pengunjung yang ingin membeli produk di website ini menjadi lebih percaya dan terjamin akan barang yang akan dibelinya. Pada website ini teks tersebut terletak dibagian paling bawah dari halaman web. Keadaan seperti itu akan membuat tujuan dari keberadaan teks tersebut kurang maksimal bahkan cenderung sia-sia, karena akan sangat jarang dibaca oleh pengunjung website yang malas untuk melakukan scrolling sampai ke bawah.

2.14 Cara berbelanjaWebsite ini merupakan webstore yang menjual macam-macam jenis komputer dan

asesorisnya. Untuk memandu pengguna dalam berbelanja di website ini maka tersedia link cara berbelanja yang berisi penjelasan tentang tata cara berbalanja di website ini. Hal tersebut sesuai dengan prinsip dasar usability, yaitu Facilitate learning. Dengan adanya panduang berbelanja tersebut diharapkan pengguna yang ingin berbelanja di website ini akan mengerti bagaimana aturan berbelanja yang benar. Namun sangat disayangkan sekali, pengguna biasanya tidak akan langsung mengunjungi link tersebut. Pengunjung website biasanya akan langsung mencari produk yang mereka cari tanpa membaca panduan cara berbelanja terlebih dahulu.

Pengguna biasanya akan mempunyai pemikiran bahwa cara berbelanja di website ini adalah secara online dan bisa dilakukan langsung di website secara langsung. Pengguna yang telah menemukan produk yang mereka inginkan akan langsung mengklik link add to chart. Setelah menuju halaman chart pengguna merasa terkejut karena barang yang akan dibelinya ternyata berharga $0. Hal tersebut membuat pengguna bingung dan berpikir apakah harga produk ini benar-benar gratis.

Gambar halaman chart

Jika pengguna melanjutakan transaksinya, maka ia akan menekan link checkout yang terdapat di halaman cart tersebut.

10

Page 13: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

Gambar halaman checkout

Dari gambar diatas terlihat bahwa untuk melanjutkan transaksi kita harus login terlebih dahulu, padahal sebelumnya kita telah login kedalam website ini. Setelah pengguna mengisi semua isian yang diperlukan dan menekan tombol submit, maka yang terjadi adalah pengguna tidak bisa melakukan transaksi lagi. Hal tersebut terjadi karena sistem menolak isian yang pengguna masukkan karena menganggap bahwa pengguna belum terdaftar. Hal ini tentu saja membuat pengguna kesal, karena dia sudah melakukan login sebelumnya.

Isi dari panduan berbelanja di website ini tergambar dari gambar dibawah ini.

Gambar langkah-langkah berbelanja

Dari gambar tersebut telah jelas dijelaskan bahwa website ini tidak menyediakan layanan transaksi secara online. Permasalahannya pada tahap awal pengguna harus mendownload daftar harga terlebih dahulu untuk mengetahui harga barang-barang yang dijual. Sementara itu pengguna sama sekali tidak dapat mendownload daftar harga itu sama sekali sekalipun pengguna sudah melakukan pendaftaran untuk menjadi member website ini.

Sebaiknya link add to chart yang terdapat pada detail produk dihilangkan saja, karena hanya akan membingungkan pengguna. Selain itu fasilitas download price list sebaiknya tidak perlu ada keharusan pengguna untuk login terlebih dahulu hanya untuk mendapatkan daftar harga produk yang dijual di website ini. Hal tersebut tentunya akan mempermudah pengguna dalam memperoleh informasi produk.

11

Page 14: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

2.15 Halaman yang tidak bergunaDalam website ini terdapat beberapa halaman yang tidak berguna. Halaman tersebut justru

hanya akan membuat pusing pengguna saja. Halaman tersebut adalah halaman chart, dan checkout. Seperti dijelaskan di bagian cara berbelanja diatas pengguna tidak bisa melakukan transaksinya secara online, sehingga halaman chart dan checkout tidak diperlukan dan hanya membuat pemikiran yang salah dari pengguna. Kehadiran halaman tersebut membuat pengguna berpikir bahwa website ini menyediakan fasilitas transaksi secara online. Namun, pada kenyataannya website ini hanya menyediakan layanan transaksi melalui email, telp, dan sms.

2.16 User menuUser menu ini muncul setelah pengguna login ke dalam website ini. User menu menyediakan

link untuk melihat detail akun kita, mengecek item kita, dan logout. Tampilan dari user menu terlihat dari gambar dibawah ini.

Gambar User Menu

Pada bagian cara berbelanja di atas telah dijelaskan bahwa pengguna tidak bisa melakukan transaksi secara online di website ini. Isi dari user menu merupakan penjelasan detail dari aktivitas yang kita lakukan selama bertransaksi online di website ini. Dikarenakan website ini tidak menyediakan fasilitas transaksi online sehingga user menu dirasa fasilitas yang mubazir saja. Kita bisa lihat dari fasilitas check-in-My items. Fasilitas tersebut melakukan pengecekan item kita yang terdapt di keranjang belanja. Tentu saja hasil yang pengguna dapatkan dari meng klik link tersebut hanya akan muncul semua barang sudah dicek, karena memang tidak ada barang yang bisa di masukkan kedalam keranjang belanja. Selain itu, fasilitas logout juga sudah disediakan dibagian form login. Sehingga fasilitas user menu dihilangkan saja karena hanya akan membingungkan pengguna saja jika fasilitas ini ada. Dari segi tampilan fasilitas user menu ini juga terlihat kurang bagus. Latar belakang dari tombol di tiap-tiap menu berwarna abu-abu sementara fontnya berwarna hitam. Hal tersebut akan mempersulit pengguna untuk membaca link tersebut apalalgi bagi pengguna yang mengalami gangguan penglihatan.

2.17 Main menuFasilitas main menu berada di sidebar sebelah kiri dari layout website. Menu yang terdapat

didalamnya meliputi home, cara pesan, pembayaran, dan contact us. Tampilan fasilitas main menu adalah seperti gambar dibawah ini.

Gambar Main Menu

Menu-menu yang terdapat di main menu sebenarnya sama persis seperti menu yang berada di bagian atas layout website ini.

Gambar top menu

12

Page 15: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

Sehingga keberadaan main menu bisa digantikan dari keberadaan top menu. Dengan kata lain, main menu tidak terlalu diperlukan keberadaannya.

2.18 IklanWebsite ini juga myediakan space iklan, yaitu di bagian sebelah kanan website dan di bagian

paling bawah dari body website

Gambar iklan

Dari gambar diatas terlihat 7 buah iklan yang yang terpampang. Jika kita mengunjungi satu persatu iklan tersebut maka kita akan mendapati beberapa iklan yang tidak terdapat isinya sama sekali. Iklan tentunya bertujuan untuk menarik konsumen membeli atau menggunakan jasa yang ditawarkannya. Dengan tidak adanya isi dari iklan tersebut, maka iklan yang dipampang tersebut hanyalah sebuah gambar saja yang tidak mampu menarik perhatian konsumen.

2.19 Resolusi layarSalah satu hal penting yang harus diperhatikan oleh pengembang website adalah mengenai

lebar (width) halaman web. Statistik menunjukkan bahwa kebanyakan komputer pengguna saat ini memiliki resolusi 800 x 600 atau 1024 x 768 piksel. Website ini menggunakan resolusi 1024 x 768 piksel. Ukuran resolusi dari website ini bersifat mutlak sehingga jika website ini ditampilkan pada layar monitor berukuran 800 x 600 maka akan muncul scroll kekanan.

Pengguna yang masih penggunakan layar monitor berukuran 800 x 600 piksel tentunya akan sangat terganggu dengan hal tersebut. Pengguna harus melakukan scroll kesamping untuk dapat melihat keseluruhan isi dari website ini. Hal tersebut kurang bagus karena pengguna membutuhkan usaha yang lebih untuk mendapatkan informasi dari web. Bisa-bisa, bukannya tetap mencoba scrolling ke samping, tetapi pengguna malah memilih untuk meninggalkan web. Kalau sudah begini, perusahaan juga yang menanggung kerugiannya.

Untuk mengatasi hal tersebut pengembang website biasanya menggunakan ukuran yang dinamis. Lebar halaman web 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, sehingga informasi yang dapat disampaikan juga bisa lebih banyak dan beragam.

2.20 Navigasi halamanNavigasi pada halaman ini dapat dilakukan menggunakan bredcrumb yang terletak di bagian

atas body website. Navigasi dari website ini terbilang cukup bagus. Hanya sayangnya jika pengguna mengunjungi halaman web yang panjang, pengunjung harus melakukan scroll terlebih dahulu untuk bisa beripindah kehalaman lain. Semua itu dikarenakan tidak adanya navigasi pada bagian bawah halaman web ini. Ketiadaaan navigasi di bagian bawah cukup memperlambat pengguna yang hanya ingin browsing di situs ini.

2.21 Duplikasi kontenTerdapat isi konten yang sama pada menu Cara Pesan dibagian main menu dan menu Cara

Berbelanja di bagian layanan kami. Hal tersebut membuat pengguna menjadi bingung, karena mereka menemukan bahwa terdapat link berbeda yang isinya sama. Hal ini tentunya hanya akan membuang waktu pengguna jika duplikasi konten yang seperti ini masih terus terjadi. Sebaiknya duplikasi konten yang seperti ini dihilangkan agar tidak menimbulkan kebingungan pada pengguna.

13

Page 16: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

BAB 3 PENUTUP

3.1 KesimpulanWeb usability adalah salah satu faktor penting dalam mengembangkan sebuah web.

Pengembang harus memahami prinsip-prinsip usability sebelum mengimplemen-tasikannya pada sebuah web. Web merupakan salah satu media perusahaan untuk mempromosikan perusahaannya. Pengembangan web perusahaan bertujuan untuk meningkatkan rasa kepercayaan pengguna/pelanggan terhadap perusahaan.

Pada pengembangan web PT. FLASiNDO INTERNUSA PRATAMA masih terdapat banyak kekurangan menyangkut masalah usability. Kekurangan-kekurangan yang ditemukan pada web ini, antara lain : link yang kosong, terdapat produk yang tidak dikategorikan, isi dari beberapa kategori produk yang kosong, tampilan web yang kurang konsisten, terdapat fungsi search yang tidak bisa jalan, duplikasi konten, breadcrumb yang berperilaku aneh, daftar harga yang tidak bisa di download, dan lain-lain. Kekurangan-kekurangan tersebut membuat web terlihat kurang profesional. Kondisi ini dapat membuat kepercayaan pengguna atau pelanggan terhadap perusahaan berkurang.

3.2 SaranMakalah ini diharapkan menjadi bahan masukan bagi pengembang untuk mengembangkan

web PT. FLASiNDO INTERNUSA PRATAMA dengan lebih memperhatikan faktor-faktor usability. Kekurangan-kekurangan yang masih ditemui, sebaiknya segera diperbaiki agar web dapat terlihat profesional. Dengan demikian, kepercayaan pengguna/pelanggan terhadap perusahaan akan meningkat dan pendapatan perusahaan dari website ini juga akan bertambah.

14

Page 17: LAPORAN AKHIR M.K INTERAKSI MANUSIA DAN  · PDF fileLAPORAN AKHIR M.K INTERAKSI ... 2.1 Nama perusahaan ... Penjualan buku-buku tutorial komputer

DAFTAR PUSTAKA

● Nielsen J & Loranger H. 2006. Prioritizing Web Usability. Berkeley : New Riders.● Krug Steve. 2000. Don't Make Me Think. A Common Sense Approach To Web Usability.

Indiana : New Riders. ● Johnson Jeff. 2008. GUI Bloopers 2.0 . Burlington : Elsevier

15