PERANCANGAN INTERFACE PROTOTYPE WEB BERDASARKAN PADA ASPEK

USABILITY (Studi Kasus: Laboratorium Ergonomi dan Perancangan Sistem Kerja

Teknik Industri ITS)
DESIGNING WEB INTERFACE PROTOTYPE BASED ON USABILITY ASPECT
(Case Study: Ergonomic and Work System Design Laboratory)
1

Sritomo Wignjosoebroto, Aditya Sudiarno, Dimaz Harenda

Jurusan Teknik Industri, Institut Teknologi Sepuluh Nopember,Surabaya
Kampus ITS Sukolilo Surabaya 60111
1
msritomo@rad.net.id ; 2aditya.sudiarno@gmail.com ; 3dimazharenda@yahoo.com
1,2

Abstrak
Usability seringkali dikatakan sebagai suatu nilai penerimaan (acceptance) seseorang
terhadap suatu produk atau sistem berdasarkan pemahaman dan ketepatan aksi / reaksi
seseorang terhadap sebuah antarmuka / interface. Dan website atau biasa disebut dengan web
saja, performansinya sangat dipengaruhi oleh baik tidaknya antarmuka / interface web tersebut
untuk mendukung informasi yang ingin disampaikan. Untuk dapat menciptakan suatu web
dengan interface yang baik, diperlukan dasar usability dalam proses pendesainannya. Karena
Laboratorium Ergonomi dan Perancangan Sistem Kerja (E & PSK) Teknik Industri ITS
memiliki kegiatan yang cukup padat, yang secara langsung akan membuat interaksi yang
dilakukan oleh pihak Laboratorium dengan user mereka akan semakin banyak juga. Transfer
maka diperlukan sebuah media penyampaian informasi yang mudah dan cepat bagi
Laboratorium E & PSK yaitu melalui suatu web. Oleh karena itu, penelitian yang akan
dilakukan adalah perancangan interface prototype web Laboratorium Ergonomi dan
Perancangan Sistem Kerja dengan menggunakan aspek Usability sebagai dasar dalam
pendesainan. Metode yang digunakan dalam penelitian ini adalah metode kuisioner dan
menggunakan dasar visual display pula. Dan hasil perancangan memberikan nilai usability yang
lebih baik, yaitu meningkatnya nilai usability masing masing atribut yang diberikan dalam
kuisioner. Kemudahan web untuk diakses nama dosen, kemudahan form login untuk
dijangkau, kemampuan web untuk dikenali, dan kemudahan forum untuk ditemukan,
mengalami peningkatan nilai usability dengan masing masing nilai 1.79 , 1.03 , 0.84 , dan 0.8.
Secara umum, web yang telah dirancang mengalami perbaikan pada bagian Letak form login,
desain kolom, font / huruf, dan desain warna.
Kata Kunci: Desain Interface Web, Ergonomi, Usability.
Abstrack
Usability usually defined as a point of human acceptance to a product or a system based
on understands and right reaction to an interface.Website or it usually called only web, it
performance has been influence by the quality of the interface of that web to supporting
information transfer process. To create a web with good interface, it needs usability aspect as
based in the design process. Ergonomic and Work System Design Laboratory Industrial
Engineering FTI-ITS, has many activity, wich is made all laboratory interaction with it user
can be many too. So, Ergonomic and Work System Design Laboratory needs some effective
information media as a website. Because of it, this final project is designing Laboratory web
interface prototype based on Usability aspect. Method that it used in this final project is
quitionnere method and based on visual display aspect too. The result of this final project gave
better point of usability. The easy to reach of the name of lecture, the easy to reach of login
form, the performance of web to recognize, and the easy to reach of response forum has get
increased on usability point, and each point is 1.79 , 1.03 , 0.84 , and 0.8. The result for all, the
new web already used a better design based on usability aspect on login form, column design,
font, and color design.
Key words : Ergonomics, Usability, Web Interface Design

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Usability helps companies understand their

customers dan A usable product is recognized,
used, and recommended. (Kleinresearch,
2006).
Jurusan Teknik Industri ITS sendiri
sebenarnya juga telah mempunyai sebuah web
yang dinamakan dengan Moodle Jurusan
Teknik Industri (JTI ITS) yang bersifat
dinamis, yang memfasilitasi dan menjadi
perantara interaksi di antara sekretariat
jurusan, dosen , dan mahasiswa teknik Industri
ITS, dengan bentuk suatu forum per mata
kuliah yang bisa diakses secara langsung oleh
dosen pengajar dan mahasiswa peserta masing
masing kelas , dan pada web eksisting ini
akan dilakukan usability testing untuk
menentukan aspek aspek apa saja yang
menjadi dasar dalam pendesainan. Oleh karena
itu, perancangan desain web dengan dasar
usability pada penelitian ini memilih studi
kasus pada Laboratorium karena web
laboratorium bisa dikatakan memiliki lingkup
yang lebih sederhana apabila dibandingkan
dengan Moodle JTI yang memiliki model
konten secara umum tidak jauh berbeda.
Dengan digunakan Web Usability, maka
diharapkan
,
desain
interface
web
Laboratorium Ergonomi dan PSK yang baru
akan menjadi lebih baik. Definisi interface
yang baik adalah efektif , efisien , aman
digunakan , punya utility yang baik , mudah
dipelajari, dan mudah diingat bagaimana
menggunakannya (Jacob Nielsen, 2007).
Berdasarkan permasalahan di atas, maka perlu
dilakukan suatu Perancangan web interface
prototype yang berdasarkan pada aspek
usability.
2. Metodologi Penelitian
Langkah awal dalam penelitian ini adalah
Identifikasi dan Perumusan Masalah, serta
Penentuan Tujuan Penelitian. Identifikasi dan
Perumusan Masalah yang dibahas dalam
penelitian dilakukan dengan cara melakukan
uji kuisioner untuk mendapatkan suara
responden. Kemudian dilakukan Uji usability
pada web moodle TI untuk mendapatkan
variabel variabel apa saja yang menjadi
penyebab sebuah web tersebut tidak usability.
Setelah itu dilakukan penyusunan rancangan
desain yang juga didasarkan pada aspek
usability. Kemudian dilanjutkan dengan
penggabungan hasil perancangan desain
infrastruktur dengan desain warna pada
interface. Dan setelah web yang baru telah
jadi, dilanjutkan dengan melakukan usability

1. Pendahuluan
Kebutuhan akan web sebagai media
pendukung untuk menyampaikan suatu
informasi yang sangat efektif kini telah
melebar hingga ke dunia pendidikan. Saat ini
penyampaian informasi dalam aktivitas yang
berkaitan dengan pendidikan dapat diakses
langsung oleh siswa dan mahasiswa melalui
sebuah web. Dengan sebuah web yang
berfungsi untuk menunjang proses interaksi
suatu Institusi dengan user mereka, maka
secara langsung akan sangat membantu pula
agar transfer informasi yang terjadi dalam
interaksi tersebut bisa berjalan dengan baik.
Kebutuhan ini yang sedang diperlukan di
Laboratorium Ergonomi dan Perancangan
Sistem Kerja (E & PSK), Teknik Industri ITS
(Institut Teknologi Sepuluh Nopember)
Surabaya. Laboratorium E & PSK merupakan
salah satu laboratorium di Teknik Industri (TI)
ITS yang mempunyai aktivitas penuh dan
padat berinteraksi dengan user utama
Laboratorium tersebut yaitu mahasiswa.
Beberapa mata kuliah dalam kurikulum
Teknik Industri juga menjadi pohon penelitian
dari Laboratorium ini, seperti TTC, Ergonomi,
Kesehatan dan keselamatan kerja (K3) ,
Perancangan Fasilitas , Perancangan dan
Pengembangan Produk (P3) dan Aplikasi
Ergonomi Industri. Selama ini, keseluruhan
kegiatan yang dilakukan oleh Laboratorium E
& PSK lebih banyak dijalankan di
Laboratorium itu sendiri, yang berarti
terjadinya transfer informasi itu pula banyak
dilakukan di dalam Laboratorium. Hal ini yang
kadang menjadi hambatan bagi pihak
Laboratorium dan user untuk bisa selalu
berinteraksi dengan sempurna. Oleh karena itu
dengan tersedia web ini diharapkan akan dapat
membantu proses transfer informasi yang
dilakukan antara pihak Laboratorium dengan
user mereka.
Web Laboratorium E & PSK yang akan
didesain dalam penelitian ini nanti seharusnya
memiliki desain display dan interface yang
berdasarkan pada aspek usability, seperti
bagian dari hakikat nama lab ini sendiri, yaitu
ergonomi. Hal ini juga dikatakan dalam
pernyataan, suatu interface harus di desain
dengan visual display yang baik dan ergonomi
(Wignjosoebroto, 2000). Untuk itu, dalam
menyusun dan mendesain sebuah web ini akan
diperlukan suatu dasar yaitu Web Usability.
Penggunaan usability dalam penelitian ini juga
didasari oleh 2 (dua) pernyataan penting, yaitu

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

kembali untuk selanjutnya dapat dibandingkan

hasilnya. Untuk lebih jelasnya dapat dilihat
pada gambar 1 di bawah ini.

pernyataan dan pertanyaan yang diberikan dan

penjelasannya adalah sebagai berikut:
Pernyataan 1.
Penyampaian Informasi dari Laboratorium ke
user telah berjalan dengan baik.
Pernyataan tersebut diberikan untuk
mengetahui penilaian dari user apakah
penyampaian informasi oleh lab telah berjalan
dengan baik atau tidak.
Pernyataan 2.
Adanya media pendukung sebagai media
penyampaian informasi dari Laboratorium
untuk user.
Pernyataan tersebut
memberikan
wacana akan adanya sebuah media pendukung
penyampaian informasi oleh Lab.
Pernyataan 3.
Keberadaan sebuah Web sebagai media
pendukung penyampaian informasi.
Pernyataan tersebut
memberikan
wacana akan adanya sebuah web sebagai
media pendukung yang dipilih.
Pernyataan 4.
Keberadaan Moodle TI sebagai media
Laboratorium
untuk
menyampaikan
informasinya.
Pernyataan tersebut menanyakan akan
fungsi moodle TI sebagai media informasi dari
Lab.
Pernyataan 5.
Nilai Usability Web dalam media pendukung
penyampaian informasi.
Pernyataan tersebut
memberikan
wacana akan pentingnya suatu nilai usability
dalam sebuah web.
Pengumpulan data dengan bentuk
kuisioner disebar ke user utama dari web yang
akan dirancang, yaitu mahasiswa Teknik
Industri. kuisioner disebar melalui dua tahap
penyebaran, yaitu:
1. Kuisioner
pendahuluan
untuk
mengetahui
jumlah
kuisioner
sebenarnya yang akan disebar serta
atribut-atribut yang dipentingkan
responden dengan menguji validitas
dan reliabilitas
masing-masing
atribut
2. Kuisioner sebenarnya
Setelah data primer diambil dari
responden, dilakukan rekap terhadap hasil
pengisian kuisioner. Rekap ini dimulai dari
kusioner pendahuluan dan dilanjutkan dengan
kuisioner sebenarnya.

Gambar.1 Flowchart Metodologi Penelitian

3. Pengumpulan dan Pengolahan Data
Pengumpulan data awal yang dilakukan dalam
penelitian ini dimulai dengan menyusun dan
mendesain sebuah kuisioner awal. Kuisioner
ini dibuat untuk melihat tingkat ketertarikan
dan kebutuhan mahasiswa TI terhadap
keberadaan sebuah web Laboratorium
Ergonomi dan Perancangan Sistem Kerja yang
akan dihasilkan dari Penelitian ini. Pada
kuisioner ini terdapat 5 pertanyaan yang secara
garis besar membahas aspek-aspek yang
menjadi dasar dasar mengapa suatu web
Laboratorium dianggap perlu dirancang
dengan menggunakan dasar usability. Adapun

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Selanjutnya akan direkap kusioner

pendahuluan yang disebarkan sejumlah 32
lembar. Dalam Kuisioner pendahuluan ini
terdapat data yang valid dan tidak valid.
Prosentase masing masing data baik yang
valid maupun tidak nantinya akan digunakan
untuk melakukan penghitungan kuisioner
sebenarnya. Kemudian dilanjutkan dengan
menyebarkan kuisioner sebenarnya.Dari 30
kusioner yang disebarkan, diketahui bahwa
sebagian besar responden memberikan
penilaian yang cukup tinggi terhadap setiap
variabel pertanyaan yang ada. Rata-rata skala
penilaian responden berada diatas skala 4,
walaupun masih ada responden yang
memberikan penilaian dibawah skala tersebut.
Setelah data data yang dibutuhkan
telah dikumpulkan, maka selanjutnya akan
dilanjutkan dengan pengolahan terhadap data
data yang telah ada.
Penyebaran kuisioner awal dilakukan
dengan jumlah 32 kuisioner. Kemudian
dilakukan perhitungan jumlah sampel
minimum untuk penyebaran kuisioner
berikutnya dengan menggunakan rumus
Bernoulli.

Rekap data pendahuluan yang

terlebih dahulu akan diuji validitas dan
reliabilitasnya. Uji Validitas dapat
digunakan sebagai ukuran seberapa kuat
suatu alat tes melakukan fungsi ukurnya.
Semakin tinggi validitas suatu variabel
maka tes tersebut semakin mengenai
sasarannya dan semakin menunjukkan apa
yang harus ditunjukkannya. Pengujian
validitas dalam penelitian ini dilakukan
dengan membandingkan antara R hitung
dengan r Tabel. R hitung didapat dengan
software Microsoft Excel (functionpearson), r Tabel didapat dari Tabel r yang
terdapat di lampiran.
Tabel 3.2 Koefisien Korelasi Atribut
N
o
1
2
3

Tabel 3.1 Hasil Kuisioner Pendahuluan

Kuisioner
Disebar
Valid
tidak
valid

Jumlah
32
30

4
5

N0
Z

(Z/2)2. p. q
e2

= jumlah sampel minimum

= Nilai distribusi normal
untuk tingkat keberartian /2

= 1,96
p
= Proporsi responden yang mengisi
kuesioner dengan
benar
q
= Proporsi responden yang mengisi
kuesioner dengan
tidak
benar
e
= Tingkat kesalahan

N0

r hitung

r table

Kesimpu
lan

0.546

0.351

Valid

0.439

0.351

Valid

0.610

0.351

Valid

0.3509

0.351

Tidak
Valid

0.354

0.351

Valid

Dari hasil uji di atas, didapatkan

bahwa pernyataan no.4 dalam kuisioner
dikatakan tidak valid, sehingga tidak dapat
digunakan sebagai alat ukur yang baik.
Sedangkan untuk uji Reliabilitas,
Reliabilitas adalah suatu indeks yang
menunjukkan sejauh mana alat ukur dapat
dipercaya atau dapat diandalkan. Keandalan
disini dapat berarti berapa kalipun variabelvariabel pada kuesioner tersebut ditanyakan
kepada responden yang berlainan maka
hasilnya tidak akan menyimpang terlalu jauh
dari rata-rata jawaban responden untuk
variabel tersebut. Atau dengan kata lain
reliabilitas dapat menunjukkan konsistensi
suatu alat ukur di dalam mengukur gejala yang
sama. Untuk melakukan uji ini digunakan
software SPSS.

Rumus Bernoulli :
N0

Atribut
Penyampaian
Informasi
adanya media
penunjang
Keberadaan
sebuah Web
Moodle TI
sebagai
media
informasi
Lab
Usability
Web

1,96 2 0,937 0,062 22,30

0,12

Dengan N = banyaknya atribut = 5 maka df =

N-2 = 3
Dengan tingkat keberartian()=5%, maka r
Tabel=0,8054

Dengan n = 23 maka df = n-2 = 21

Dengan tingkat keberartian ( ) = 5%, maka r
Tabel = 0.351

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Dari Uji reliabilitas dengan SPSS diketahui

bahwa nilai R hitung = 0,948 . R hitung > r
tabel maka kuisioner dinyatakan reliable.

dilihat pada lembar lampiran. Sedangkan

rekap hasilnya adalah seperti dapat dilihat
pada table 3.6 di bawah ini.

Tabel 3.3 Hasil Uji Reliabilitas

Case Processing Summary
N
%
Cases
Valid
30
100,0
Excluded(a)
0
,0
Total
30
100,0
Reliability Statistics
Cronbach's Alpha N of Items
,948
5

Tabel 3.6 Hasil T-tes

No
1
2
3
4

Kepuasan
2.73
2.63
1.83
1.83

perbedaan
Ada
Ada
Ada
Ada

Sesuai dengan hasil di atas, maka

dapat dikatakan bahwa terdapat perbedaan
yang cukup signifikan di antara nilai
kepentingan dan kepuasan yang diberikan oleh
responden. Hal ini menunjukkan bahwa
memang perlu dirancang sebuah web guna
mendukung proses pemberian informasi dari
laboratorium kepada usernya.
Dari Kuisioner yang disebarkan,
penyebaran identitas responden dipaparkan
dalam bentuk pie chart.

Jumlah
30
30

jenis Kelam in

44%

Kepentingan
4.13
3.83
3.97
3.73

Laki -laki
56%

Perempuan

Gambar 3.1 Pie Chart Jenis Kelamin

Responden
Angkatan

Tabel 3.5 Tingkat Kepuasan dan

Kepentingan
Atribut
Penyampaian Informasi
adanya media penunjang
Keberadaan sebuah Web
Usability Web

- value
0.05
0.05
0.05
0.05

disimpulkan, ada perbedaan yang cukup

signifikan.

Dari
hasil
pengumpulan
dan
pengolahan data, dilakukan interpretasi data
untuk mendapatkan informasi-informasi yang
terkait dengan kebutuhan user. Berdasarkan
kuisioner sebenarnya yang disebarkan, dapat
diketahui tingkat kepentingan dari adanya
Web penunjang kegiatan akademik serta
tingkat kepuasan user terhadap suatu web
akademik yang telah ada. Tingkat kepentingan
dan tingkat kepuasan User dapat dilihat pada
Tabel 3.5.

No
1
2
3
4

p-value
0.000
0.000
0.000
0.000

Ket. : Jika p-value < -value, maka dapat

Setelah mengetahui jumlah sampel

minimum dengan jumlah 24, maka kuisioner
sebenarnya yang telah valid yaitu berjumlah
30 digunakan langsung sebagai kuisioner
sebenarnya . Sehingga hasil penyebaran
kuisioner sebenarnya dapat dilihat pada Tabel
3.4.
Tabel 3.4 Hasil Penyebaran Kuisioner
sebenarnya
Kuisioner
Disebar
Valid
tidak
valid

Atribut
Penyampaian Informasi
adanya media penunjang
Keberadaan sebuah Web
Usability Web

Gap
-1.4
-1.2
-2.14
-1.9

Untuk
menunjukkan
adanya
perbedaan yang cukup signifikan antara nilai
kepentingan dan kepuasan yang diberikan oleh
responden, maka perlu dilakukan sebuah tes,
dan sebuah tes yang dapat menunjukkan hal
tersebut adalah T-tes menggunakan software
minitab. Hasil dari software minitab dapat

25%

Angkt.2004

13%
21%

Angkt.2005
Angkt.2006

41%

Angkt.2007

Gambar 3.2 Pie Chart Angkatan

Responden

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Web Moodle akademik Jurusan Teknik

Industri juga diamati dalam penelitian ini. Hal
yang diperhatikan adalah pada bagian
pendeskripsian
mengenai
Laboratorium
Ergonomi dan PSK sendiri dalam web moodle
ini. Pada Moodle ini, penjelasan mengenai
Laboratorium Ergonomi dan PSK kurang
detail dan hanya sebatas beberapa informasi
yang sangat penting saja. Hal ini memang
cukup bisa dimaklumi karena memang moodle
TI fokus pada pelayanan akademik. Dan
karena hal ini, maka perlu adanya web
Laboratorium yang berdiri sendiri yang dapat
menjelaskan dan memberikan informasi pada
user Laboratorium dengan lebih lengkap.
Adapun bagian dari moodle TI yang
memberikan
informasi
mengenai
Laboratorium Ergonomi dan Perancangan
Sistem Kerja dapat diliat pada gambar 3.3.

User tes Usability yang digunakan

adalah mahasiswa mahasiswa TI ITS yang
diasumsikan telah terbiasa menggunakan fitur
Web Browser. Hal ini dilakukan agar User
benar benar telah terbiasa melakukan task
task yang diberikan dan tidak mengalami
kesulitan. Jumlah User yang digunakan adalah
sebanyak 30 orang yang terdiri dari beberapa
angkatan mahasiswa TI. Nilai 30 dipilih
berdasarkan
dasar
literatur
yang
menyampaikan bahwa jumlah User tes
usability tidak perlu terlalu banyak jumlahnya.
Seperti telah dijelaskan di awal,
bahwa metode usability testing yang
digunakan dalam penelitian ini adalah metode
Kuisioner dengan responden user web ini
sendiri yaitu mahasiswa TI. Responden yang
digunakan dalam usability testing ini
berjumlah 30 orang/mahasiswa. Jumlah ini
dipilih sesuai dengan penelitian yang pernah
dilakukan sebelumnya yang mengatakan
bahwa responden usability testing tidak boleh
terlalu banyak (Brenda Battleson, 2001).
responden yang dipilih adalah mahasiswa
mahasiswa yang mengerti mengenai web,
tetapi belum pernah mengakses web yang diuji
sebelumnya. Secara teknis, Usability testing
ini dilakukan di Laboratorium Ergonomi dan
Perancangan
Sistem
Kerja
dengan
menggunakan alat alat berupa monitor 15 ,
selembar task dan kuisioner, serta sebuah alat
tulis. Dalam suatu usability testing, pada
awalnya masing masing responden akan
diberikan beberapa task atau tugas yang harus
dilakukan terlebih dahulu terhadap web yang
akan diuji, dimana task task tersebut adalah
seperti pada tabel di bawah ini :
Tabel 4.7 Task Usability Testing
No.
1
2
3
4

Gambar 3.3 Interface Web Moodle TI

Task / Tugas
Lakukan Login sebagai User dalam Web ini
Cari dalam Web ini nama dosen Jurusan ini
Cari informasi yang update dalam Web ini
Cari forum pembahasan mata kuliah / responsi
lakukan Logout untuk meninggalkan Web ini dan
lakukan Login kembali

Penjelasan dari masing masing task

di atas adalah sebagai berikut:
Task 1. Lakukan Login sebagai user dalam
web ini.
Task ini meminta user untuk
melakukan login, diawali dengan
mencari form login, yaitu nama dan
password,
menuliskannya,
dan
mengkliknya.
Task 2. Cari dalam Web ini nama dosen
jurusan ini.

Untuk mendapatkan variabel variabel

apa saja yang perlu dititikberatkan dalam
proses pendesainan, maka perlu dilakukan
suatu usability testing pada sistem website
yang sejenis atau berkaitan, yang dalam hal ini
dilakukan pada Moodle TI yang secara garis
besar
mempunyai fungsi
memberikan
informasi secara dinamis pada mahasiswa TI.
Adapun detail dari Usability testing
yang dilakukan ini adalah sebagai berikut.

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Task yang kedua ini meminta

user untuk mencari dan mengakses
informasi mengenai nama nama
dosen yang ada di jurusan Teknik
Industri. Task ini dikatakan selesai
ketika user telah dapat melihat
informasi nama nama dosen yang
ada.
Task 3. Cari informasi yang update dalam
Web ini.
Task ini meminta user untuk
mencari dan memilih salah satu
informasi atau news dalam web hingga
mengklik masuk dalam bagian news,
dan dapat membaca informasi yang
ada dengan jelas.
Task 4. Cari forum pembahasan mata kuliah
Task ini meminta user untuk
mencari dan menemukan hingga
mengklik masuk ke dalam forum mata
kuliah. Task ini dilakukan sampai user
telah
dapat
membaca
dan
mendapatkan informasi mengenai
adanya forum mata kuliah dan
melakukan 1 kali posting komentar.
Task 5. Lakukan logout untuk meninggalkan
Web dan lakukan login kembali
Task ini dilakukan oleh user
untuk mencari letak form logout,
mengklik logout, dan melakukan login
kembali seperti pada task 1.

Tabel 3.8 Pertanyaan Kuisioner

Dari 10 pertanyaan diatas, masing

masing pertanyaan memiliki bagian tersendiri
untuk mewakili tiap aspek dalam usability.
Dan aspek aspek tersebut adalah sebagai
berikut:
1. Learnability
Learnability
menjelaskan
tingkat
kemudahan pengguna untuk memenuhi
task-task dasar ketika pertama kali mereka
melihat/menggunakan hasil perancangan.
2. Efficiency
Efficiency menjelaskan tingkat kecepatan
pengguna dalam menyelesaikan task-task
setelah
mereka
mempelajari
hasil
perancangan.
3. Memorability
Memorability
menjelaskan
tingkat
kemudahan
pengguna
dalam
menggunakan rancangan dengan baik,
setelah
beberapa
lama
tidak
menggunakannya.
4. Errors
Errors
menjelaskan
kemungkinan
terjadinya error yang dilakukan oleh
pengguna, tingkat kejengkelan terhadap
error dan cara memperbaiki error.
5. Satisfaction
Satisfaction menjelaskan tingkat kepuasan
pengguna dalam menggunakan rancangan.

Setelah
Task
diberikan
pada
responden,
langkah
selanjutnya
yang
dilakukan adalah dengan cara memberikan
kuisioner untuk mendapatkan penilaian dari
responden untuk mengetahui seberapa besar
Web ini dipahami, diingat, dan lain lain.
Kuisioner yang diberikan terdiri dari 10
pertanyaan, dan dari 10 pertanyaan tersebut
telah cukup untuk menunjukkan nilai aspek
aspek usability (Brenda Battleson, 2001).
Dari tiap tiap pertanyaan kuisioner
ini nantinya bertujuan untuk menunjukkan
tingkat Usability menurut penerimaan User,
yang akan dinilai dalam skala nilai 5.
Pertanyaan pertanyaan yang diberikan dalam
kuisioner ini adalah seperti dalam tabel di
bawah ini:

Kontribusi pertanyaan kuisioner untuk

tiap tiap aspek usability di atas dapat dilihat
pada tabel 3.9. Dimana masing masing
attribut ditunjukan dengan nomer masing
masing attribut tersebut. Dan dalam pemberian
kuisioner, hal ini telah dijelaskan sebelumnya
oleh peneliti kepada responden.

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Kem udahan Web untuk dikenali

Kurang mudah
Sekali
7%0% 17%
Kurang Mudah

Tabel 3.9 plot aspek Usability

No

Pertanyaan

Apakah Web dapat

dikenal dari interface awal?

Apakah anda dapat

menemukan form
login dengan mudah?

Apakah informasi pengumuman

dapat anda dapatkan
dengan mudah?

Apakah anda dapat

menemukan forum
dengan mudah?

Apakah anda dapat

menemukan nama - nama
dosen dengan mudah?

27%

ukup Mudah
Mudah
49%
Sangat Mudah

Gambar 3.4 Pie chart Pertanyaan 1

Kem udahan untuk Login
Kurang mudah
Sekali

Apakah Huruf yang

ada mudah dibaca?

17%
7
8
9
10

0%

Kurang Mudah
30%

Apakah simbol mudah dipahami?

Cukup Mudah

Apakah desain warna Web ini

nyaman dilihat?

Mudah
Lakukan logout
Setelah melakukan Logout,
apakah mudah lakukan login
kembali?

53%
Sangat Mudah

Gambar 3.5 Pie chart Pertanyaan 2

Adapun
penjelasan
mengenai
pertanyaan pertanyaan di atas terhadap
hubungannya pada masing masing atribut,
telah dijelaskan oleh peneliti kepada
responden, dengan maksud agar responden
dapat mengisi kuisioner dengan benar dan
sesuai dengan yang diharapkan.
Setelah
dilakukan
penyebaran
kuisioner yang diberikan pada responden,
maka selanjutnya dilakukan rekap terhadap
hasil kuisioner yang telah disebar. Hasil rekap
kuisioner Usability selengkapnya dapat dilihat
pada halaman lampiran. Setelah dilakukan
penyebaran kuisioner yang diberikan pada
responden, maka selanjutnya dilakukan rekap
terhadap hasil kuisioner yang telah disebar

Informasi / jadwal
Kurang mudah
Sekali
0%

17%

Kurang Mudah

20%

Cukup Mudah
Mudah
63%

Sangat Mudah

Gambar 3.6 Pie chart Pertanyaan 3

Kemudahan Forum

Hasil dari Usability testing yang dilakukan

terhadap 30 responden yang menggambarkan
penyebaran jawaban dari masing masing
pertanyaan yang diberikan dalam kuisioner
usability testing dapat dilihat dari masing
masing pie chart dibawah ini :

13%

Kurang Mudah
Sekali

0%7%

Kurang Mudah
30%

Cukup Mudah
Mudah

50%

Sangat Mudah

Gambar 4.7 Pie chart Pertanyaan 4

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Gambar 4.12 pie chart pertanyaan 9

Kurang Mudah

Gambar 3.8 Pie chart pertanyaan 5

Kemudahan
Login
Sekali
kembali

Kurang Mudah

Kem udahan Huruf terbaca

13% 0% 23%
Cukup Mudah

Kurang Mudah
Sekali
0%

18%

Kurang Mudah

29%

Mudah

Cukup Mudah

64%

Gambar 3.13 Pie chart Pertanyaan 10

Mudah
53%

Dari Interpretasi hasil Usability

Testing diatas, maka didapatkan Rekap nilai
Usability dari masing - masing atribut atau
variabel seperti pada tabel 3.10 di bawah ini..

Sangat Mudah

Gambar 3.9 Pie Chart Pertanyaan 6

Tabel 3.10 Rekap nilai usability

Sim bol

N
o

Kurang Mudah
Sekali
13% 0%

Sangat Mudah

5
6

Informasi update yang menarik

Kemudahan Forum diakses
Kemudahan menemukan nama
Dosen
Kemudahan Web dibaca

Kemudahan Simbol dipahami

8
9
1
0

Desain warna nyaman

Kemudahan untuk logout

Nil
ai
3.2
3
2.8
7
2.9
7
2.7
2.0
4
3.1
2.8
3
3.4
7
3.5

Kemudahan Login kembali

2.9

Variabel

Kurang Mudah

30%
Cukup Mudah

2
Mudah

3
4

57%
Sangat Mudah

Gambar 3.10 Pie chart Pertanyaan 7

Kemudahan Interface dikenali

Posisi form Login yang mudah
dijangkau

Desain Warna
Kurang Mudah
Sekali

7%0%7%

Kurang Mudah
Cukup Mudah
40%
46%

Setelah dilakukan studi awal, dan

diketahui komponen akan web yang akan
dirancang, maka yang dapat dilakukan
selanjutnya adalah merancang arsitektur web
tersebut.Interface navigation di buat untuk
menampilkan struktur dari halaman website

Mudah
Sangat Mudah

Gambar 4.11 Pie chart Pertanyaan 8

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

yang akan di realisasikan. Interface

Navigation dari Web yang akan dibuat
berdasarkan contoh konten yang telah dipilih
dapat dilihat pada gambar 3.14.

menuliskan judul atau nama web. Oleh karena

itu, pada web yang akan dirancang ini,
diberikan header dengan berisikan nama atau
judul web, dan logo web. Pendesainan juga
didasarkan pada hasil usability testing yang
mengatakan bahwa kemampuan web untuk
dikenali dari interface awalnya juga
merupakan aspek yang penting. Untuk lebih
jelasnya dapat dilihat pada gambar 3.16.

Gambar 3.16 Header

Menu utama atau bisa dikatakan juga
dengan navigasi pada frame interface awal
diletakkan pada 2 posisi, yaitu yang pertama di
bawah header dengan posisi horisontal. Hal ini
dilakukan dengan maksud memudahkan user
menemukan navigasi yang diinginkan sesaat
langsung setelah membaca header dan agar
menu utama mudah dan cepat dijangkau oleh
User saat ingin mengaksesnya. Menu Utama
ini terdiri dari Home , News , Forum Responsi
, Nama Dosen dan Asisten serta Contact us.
Dengan adanya menu utama yang diberikan
dalam 2 posisi, user tidak perlu menggunakan
scroll kembali. Menu atau navigasi yang
kedua, diletakkan pada bagian bawah kiri
dengan posisi vertikal karena berdasarkan
kebanyakan orang yang memaca dimulai dari
sebelah kiri. (webworks , 2000). Adapun hasil
penyusunan frame nya untuk bagian menu dan
navigasi menjadi seperti pada gambar 3.17.

Gambar 3.14 Navigation

Dari konsep yang telah disusun di atas,
maka dapat dilakukan proses perancangan
prototype diawali dengan penyusunan
kerangka atau frame dari halaman interface.
Pada proses ini, perancangan juga didasarkan
pada hasil usability testing terdahulu.
Ketika Interface Web akan dibuat,
perencanaan mengenai tampilan dan isi dari
antarmuka / interface disusun menggunakan
Microsoft Visio. Adapun rancangan dasarnya
seperti pada gambar 4.14 di bawah ini.

Gambar 3.15 Frame Interface

Adapun penjabaran dari masing masing
bagian pada frame interface di atas adalah
sebagai berikut:
Header adalah bagian dari web yang
seringkali menjadi yang pertama kali dilihat
oleh user saat membuka suatu web. Di header
pula kebanyakan pada web web yang sudah
ada, terdapat menu navigasi dari web tersebut.
Header
juga merupakan tempat untuk

gambar 3.17 Menu utama

Login Form diletakkan diantara 2 menu
utama dengan ukuran yang cukup besar. Hal
ini dilakukan agar form login tetap terlihat saat
web diakses oleh user.Letak yang berada
sebelah kiri di bawah header dilakukan
berdasarkan kebiasaan orang kebanyakan yang

10

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

membaca mulai dari sebelah kiri dan

kebanyakan web yang sudah ada pun juga
memiliki form login dengan letak posisi yang
sama. Sedangkan posisi form login ini secara
vertikal dipilih atas dasar posisi tengah yang
memang mudah dijangkau dan tidak
memerlukan aksi scroll yang terlalu berlebihan
(webworks, 2000). Sesuai dengan hasil
usability testing pula, posisi login pada moodle
TI yang berada pada ujung kanan atas ternyata
juga cukup menyulitkan user untuk
menjangkaunya.Sehingga posisi yang cukup di
tengah akan membuat form login ini pasti
terlihat. Lebih jelasnya dapat dilihat pada
gambar 3.18.

gambar 3.19 Letak isi / news

Setelah dilakukan penyusunan pada
masing masing bagian interface, yaitu
header, isi / news, menu utama atau navigasi
dan form login, maka didapatkan frame
interface awal secara keseluruhan seperti pada
gambar 3.20 di bawah ini.

gambar 3.18 form login

Bagian terbesar
dari interface
diberikan pada isi atau konten News yang
memang nantinya terdiri dari beberapa
informasi update yang harus terakses oleh
User. Isi Konten akan disusun sesuai urutan
informasi terbaru akan diletakkan di bagian
yang paling atas. Hal ini dilakukan agar
nantinya user tidak perlu masuk ke halaman
lain yang terlalu jauh untuk mendapatkan
informasi mengenai pengumuman atau news
dari Laboratorium. Pada bagian isi, Web yang
baru disusun sesuai dengan site navigation
yang telah dirancang sebelumnya, hal ini
dilakukan agar proses penelusuran konten atau
isi web yang ingin diakses oleh user tidak
memakan waktu yang terlalu lama, dan hal ini
sesuai juga dengan hasil usability testing pada
moodle TI. Posisi news yang dimaksud dapat
dilihat pada gambar 3.19

gambar 3.20 Frame jadi

Setelah frame interface selesai dibuat,
langkah selanjutnya adalah melakukan
pewarnaan atau pemberian warna pada frame
interface yang telah dibuat. Seperti telah
dijelaskan sebelumnya, header adalah satu hal
yang pasti dilihat terlebih dahulu dari suatu
web oleh user. Dan warna yang dipilih sebagai
dasar warna header adalah warna biru. Hal ini
dilakukan karena dari sumber yang ada,
menunjukkan warna biru merupakan warna
yang paling mudah dipilih dan digunakan,
karena warna biru adalah warna yang paling
nyaman dan sangat menarik untuk dilihat
(Xiaowei Yuan and Xiaoqin Wang, 2000).
Dan juga, header sebagai pendukung identitas
web, akan tertulis nama web dan terdapat logo
laboratorium dengan warna dasar kuning.
Sehingga akan smakin baik jika warna kuning
pada logo diletakkan pada header dengan
warna dasar biru. Hasilnya dapat dilihat pada
gambar 3.21.

11

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

Font yang dipilih adalah font yang

paling banyak digunakan dalam web sesuai
dengan hasil survey, yaitu Microsoft Sans
Serif. Font ini dikatakan mudah dibaca dan
dipahami. Font yang bagus pada bentuk
laporan seperti Times New Roman, belum
tentu baik pula apabila digunakan dalam
media web (codestyle,2003). Lebih jelasnya
dapat dilihat pada gambar 4.24.

Gambar 3.21 Header jadi

Hampir sama dengan format header,
bagian isi / news juga akan di isi dengan warna
biru. Hanya saja pada bagian ini akan di
dominasi dengan warna biru yang lebih muda
dengan tulisan / font berwarna hitam. Hal ini
dilakukan agar diantar forground yaitu tulisan,
dengan background, terjadi perbedaan yang
cukup kontras. Warna yang baik untuk isi atau
konten dalam web adalah background terang
atau putih dengan tulisan atau font berwarna
hitam atau gelap (Blue, 2008). Adapun
hasilnya dapat dilihat pada gambar 3.22 ini.

Gambar 4.24 Jenis font

Data data yang telah didapatkan pada
studi awal mengenai laboratorium, yaitu
konten atau isi, dan arsitektur web, akan
digabungkan pada bagian ini hingga menjadi
satu kesatuan web.
Dari penyusunan konsep menggunakan
dasar usability dan aspek visual display yang
telah dilakukan sebelumnya, maka dapat
digambarkan atau divisualisasikan dengan
menggunakan desain halaman interface yang
sudah digabungkan atau telah diinputkan
dengan konten. Hasilnya dapat dilihat pada
gambar 4.25 di bawah ini.

Gambar 3.22 Isi jadi

Seperti form login pada web lainnya,
warna dasar form login ini di desain
disesuaikan dengan warna interface web awal
secara keseluruhan. Sehingga kombinasi yang
ada adalah antara warna biru tua, biru muda,
putih (untuk kolom login dan password) serta
oranye yang digunakan sebagai tanda klik
pada login. Dipilih oranye agar terlihat kontras
dan dapat menonjolkan fungsi klik pada
bagian ini. Hasilnya dapat dilihat pada gambar
3.23

Gambar 4.25 Interface jadi tanpa login

4.

Analisa
Setelah dilakukan T-tes, dari kuisioner
kebutuhan awal yang diberikan, didapatkan
beberapa perbedaan yang signifikan antara
kepentingan
dan
kepuasan
responden
mengenai peryataan pernyataan yang
diberikan dalam kuisioner. Namun ada pula
pernyataan yang tidak memberikan hasil
perbedaan cukup signifikan antara nilai

Gambar 4.23 Form Login

12

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

kepentingan dan kepuasan. Pernyataan yang

diberikan dalam kuisioner tersebut yang
pertama adalah apakah penyampaian informasi
dari Laboratorium ke user nya telah berjalan
dengan baik, dan hasil kuisioner memberikan
nilai kepentingan sebesar 4,13 , sedangkan
nilai kepuasannya hanya sebesar 2,73. Dan
sesuai dengan hasil uji T-tes, perbedaan ini
dapat dikatakan cukup signifikan. Hal ini
disebabkan karena selama ini, responden
merasa bahwa penyampaian informasi dari
Laboratorium dirasa masih kurang baik yang
hanya
menggunakan
media
papan
pengumuman saja di depan laboratorium.
Untuk pernyataan yang kedua, yaitu adanya
media lain sebagai penunjang penyampaian
informasi, juga memberikan hasil dengan
perbedaan yang cukup signifikan, hal ini dapat
terjadi karena responden berpikir bahwa
penyampaian informasi yang masih kurang
baik, akan dapat didukung dengan adanya
media lain yang efektif. Pernyataan yang
ketiga adalah mengenai dipilihnya media Web
sebagai media pendukung tersebut, dan
hasilnya juga cukup signifikan, hal ini
dikarenakan sebuah Web kini sudah menjadi
konsumsi hampir seluruh mahasiswa sehari
hari, dan dengan adanya web, informasi pun
dapat diakses dari mana saja. Untuk
pernyataan yang keempat, yaitu apakah
moodle TI bisa menjadi media penyampaian
informasi dari Laboratorium, menunjukkan
hasil perbedaan antara nilai kepuasaan dan
kepentingan yang tidak signifikan. Dengan
nilai kepuasan dan kepentingan yang sama
sama rendah dari keduanya, dapat dikatakan
bahwa sebenarnya moodle TI, bagi mahasiswa
responden, dikatakan sebagai media informasi
akademik dari jurusan untuk mahasiswa saja,
belum mencakup informasi dari laboratorium
yang ada. Dan untuk pernyataan yang terakhir,
yaitu mengenai perlunya usability diterapkan
dalam
Web
yang
akan
dirancang,
menunjukkan nilai kepentingan yang tinggi,
dan berbeda signifikan dengan nilai
kepuasannya, sehingga dapat disimpulkan
bahwa dalam penyediaan web yang baru,
sangat perlu diterapkannya aspek aspek
usability.
Usability testing pada penelitian ini
dilakukan sebanyak 2 (dua) kali, yaitu yang
pertama adalah pada Moodle TI dan
selanjutnya dilakukan juga pada hasil Web
Laboratorium E & PSK yang baru.Usability
testing yang pertama, yaitu yang dilakukan

pada Moodle TI mempunyai tujuan untuk

mengetahui atribut atau variabel dari suatu
Web akademik apa saja yang ditikberatkan
akan menjadi fokus pendesainan perbaikan
yang akan dilakukan pada Web Laboratorium
Ergonomi dan Perancangan Sistem Kerja yang
baru. Hasil dari Usability Testing pada Moodle
TI menunjukkan nilai nilai kepuasan atau
penerimaan user terhadap masing masing
atribut dapat dilihat pada tabel 4.1.
Tabel 4.1 Tingkat usability atribut
N
o

5
6

Informasi update yang menarik

Kemudahan Forum diakses
Kemudahan menemukan nama
Dosen
Kemudahan Web dibaca

Kemudahan Simbol dipahami

8
9
1
0

Desain warna nyaman

Kemudahan untuk logout

Nil
ai
3.2
3
2.8
7
2.9
7
2.7
2.0
4
3.1
2.8
3
3.4
7
3.5

Kemudahan Login kembali

2.9

1
2
3
4

Variabel
Kemudahan Interface dikenali
Posisi form Login yang mudah
dijangkau

Dari tabel 4.1 di atas, dapat dilihat

bahwa untuk atribut Kemudahan Interface
dikenali, memiliki nilai penerimaan Usability
oleh User sebesar 3.23 dalam skala 5. Hal ini
dapat diartikan bahwa sebenarnya Web
Moodle TI telah cukup bisa dikenali oleh User
dari
halaman
interface
awal
Web
ini.Sedangkan untuk atribut yang kedua, yaitu
Kemudahan form Login untuk ditemukan atau
dijangkau mempunyai nilai 2.87 atau bisa
dikatakan dibawah nilai tengah yaitu 3 yang
mempunyai arti Cukup Mudah. Dari atribut
no.2 ini nanti pada proses pendesainan Web
Laboratorium E & PSK akan lebih
dititikberatkan dengan menggunakan dasar
Visual Display. Begitu juga pada atribut
Informasi update, Kemudahan Forum diakses,
Kemudahan
Simbol
dipahami,
dan
Kemudahan Login kembali yang semuanya
memiliki rata rata nilai dibawah 3.
Sedangkan hasil pada Usability testing
pada hasil prototype Web Laboratorium E &
PSK yang baru menung berbeda. Hasil masing

13

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)

 masing nilainya dapat dilihat pada tabel 4.2

di bawah ini.

2. Hasil Usability Testing pada Moodle TI

menunjukkan hasil bahwa Moodle TI
belum memiliki nilai aspek Usability,
Learnability dan Memorability yang
sempurna.
3. Perancangan Interface Web dengan dasar
Usability
sangat
mendukung
meningkatnya nilai aspek Usability pada
hasil perancangan tersebut.
4. Perbandingan nilai Usability pada Moodle
TI dan prototype Interface Web Lab. E &
PSK cukup signifikan. Dsi lah satu
atributnya, yaitu atribut Letak Form
Login, peningkatan nilai Usability sampai
1.0. Dari nilai pada Moodle sebesar 2.87
yang berarti kurang usability, menjadi 3.9
yang berarti hampir sangat usability.

Tabel 4.2 Hasil Usability Prototype

No
1
2
3
4
5
6
7
8
9
10

Variabel
Kemudahan Interface dikenali
Posisi form Login yang mudah
dijangkau
Informasi update yang menarik
Kemudahan Forum diakses
Kemudahan mencari nama dosen
Kemudahan Web dibaca
Kemudahan Simbol dipahami
Desain warna nyaman
kemudahan logout
Kemudahan Login kembali

Nilai
4,07
3,9
3,5
3,5
3,83
3,33
3,47
3,63
4,06
3,2

Apabila
disesuaikan
kembali
hubungannya dengan masing masing
aspek Usability, maka sesuai dengan tabel
5.3, dapat dikatakan bahwa Web
Laboratorium E & PSK yang baru telah
memiliki
nilai
Usability
seperti
Learnability, Efficiency, Memorability,
Errors, dan Satisfaction yang baik. Hal ini
ditunjukkan dengan nilai hasil usability
pada atribut Kemudahan Interface dikenali
sebesar 4.07 yang dapat menunjukkan
bahwa Web telah mempunyai nilai aspek
Usability Learnability. Sedangkan nilai
atribut Posisi form Login yang mudah
dijangkau menunjukkan Web telah
memiliki nilai aspek Efficiency. Nilai
Atribut Kemudahan untuk Login kembali
sebesar 3.2 menunjukkan jika Web telah
memiliki nilai aspek Memorability. Nilai
Atribut Huruf yang mudah dibaca dan
Simbol yang mudah dipahami membuat
Web dapat dikatakan telah meminimalisasi
aspek Errors. Dan dari keseluruhan atribut
yang memiliki nilai rata rata di atas 3,
menunjukkan jika Web telah mempunyai
aspek Satisfaction yang baik.

6.

Daftar Pustaka

[1]

Hackos & Redish. 1998. Interface

Design. New York, USA

[2]

Indrajit,Richardus
Eko.2006.
Konsep & aplikasi e-Business,
Andi offset , Yogyakarta

[3]

Lehto,M.R & Buck, J.R. 2008.

Introduction to Human Factors and
Ergonomics
for
Engineers.
Lawrence Erlbaum Associates, New
York, USA

[4]

Ulrich, Karl T. dan Steven D.

Eppinger.2001. Perancangan dan
pengembangan Produk. Jakarta :
Penerbit Salemba Teknika

[5]

Wignjosoebroto, Sritomo. 2003.

Ergonomi, Studi Gerak dan Waktu.
Jakarta: Guna Widya.

5.
Kesimpulan
Beberapa hal yang dapat disimpulkan dari
Tugas Akhir ini adalah sebagai berikut :
1. Hasil Kuisioner awal menunjukkan bahwa
dengan adanya Web Laboratorium E &
PSK akan sangat mendukung proses
penyampaian informasi yang terjadi di
antara pihak Lab dan User.

14

Create PDF files without this message by purchasing novaPDF printer (http://www.novapdf.com)