TUGAS INTERAKSI MANUSIA DAN KOMPUTER

ANALISA WEBSITE

rave ka^

Kelas iz. D.o6

Kelompok z :
1. Miftahul M uttzqin 1214 611 Ą
2. Irvcn Izra Elwa Amala 1214 6 Ț12
ş. Farhcn Maulana 12145 11 1
Ą. Handayani 121447 + O
$. Nur Fiqih Indra I-lamzah 12141 Ş21
6. Martarina Sarbini 1214 47OȚ
y. Dewi Setiawatî 1214 OE›6 0
ü. Annisa Kautsar 1ż14117 2

Jurusan Managemen Informatika

 AMIK Bina Sarana lnformatika

*I
 Kata Pengantar

Segala pujı dan syukur karnı panjntkan ke hadirat Allah SWT karena atas segala
karunia-Nya kami dapat menyelesaikan tugas ini. Topik yang dıbahas dalam makala h im
ialah mengenai anallsa situs www.Traveloka.com, rnulai dari desain antar muka, tampilan
layar, navıgasi, fungsi-fungsi, sarrpai dengan ukuran tıngkat usabılitas sıtus im. Keberhasılan
ini tidak lepas dari bant an berbagai pihak.
Pada kesempatan ini penulis ingin mengucapkan teri maka shh kepada teman -
teman satu kelompok atas kerja sama dan kekompa kkannya serta Bapak Noviansah selaku
Dosen Mata kuliah IMK, dan semua pıhak yang teta h memberikan saran dan bantuan selama
menyelesaikan tugas ini
Kami menyadarı bahwa masih banyak terdapat kekurangan dalam
menyelesaikan makalah ini baık dari segi rnateri rraupun penyajinnnya, untuk itu saran serta
kntıkan yang membangun dari dosen dan rekan-rekan sangat dıharapkan guna
perba ikan makalah imi. Akhir kata penulis berhara p se moga tulisa n ini bermanfaat bag i

perrt›aca pada umumnya dan penulis pada khususnya.

Jakarta, 19 Des ember 2015

(Penulıs )

*I
 DAFTAR ISI
NOV E ÏiŻ (ã ÎífÏ3............-...........................-..........................................................................I
Kata Pcnganíæ...........................................................................................................2
DaJiar
BABłPENDARŁŁUAN
tlLauwBcäkanØ......................................4
1.2Ruwusãs M&nśah....................................................4
1.3.Tşmn...............................................................................4

2.1. Usabãity.................................................................................................5
2.2. Fkksbilias...............................................................................................f
2.3. User Berfacc..........................................................................................6

3.2. Websie Travebka......................................................................................7

.1..0 Tairpiían Interface
3.3.1.
3.3.2. Tampiían
3.3.3. Säem Menu..................................................................................9
3.3.4.
3.3..5. Ai4arn ka ßerbasis Intemkni Grafts.............................................11
3.4. Kontcn Web...........................................................................................13
3.4.1 Per gønaan
3.4.2 Konten Uoik
3.4.4 Penggunaan
3.5 Program.................................................................................................................... 14
3J.l
3.5J Cepai dan Tepat..............................................................................................14

4.1
4.2. Saran.........................................................................................................1.1

4 JP a g e
 BAB I
PENDAHULUAN

1.1. Latar Belakang

Sekarang iŃ web telah begitu pop‹Jer dberbagai kalangan di masyarakat, karena
mereka meręgunakan web sebagai infmnasi dalam kehidupan sebań
- hań. Website dibangw dengan bcÒagai fugsi dan berbagai kebutuhan sesuai dengan
kepentingan aæu keinginan yarę mentiuatnp. Karena peranan website sangat peœing,
maka dalam membaręun sebuah website harus merręeÒatikan bebeapa faktor pitu
usability, user experience, dan user interface.Tujuan utama dalam pembuatan website
adalah menpbaùan infomasi, oleh kaena iN sebuah weÖite ńarus dapat Óakses oleh
¡ængg‹xia.
Faktor usability dan utiliŞ merupakan faktor penting pada sebuah website.
Usability merupakan sebuah atribut yang menilai tingkat kenxidahan user inteČace untuk
digunakan Óeh pengguna. Sedangkan aility adalah kemampan sebuah website untuk
rremberiDn manfaat aQu kegłx\aan atau kepuasan kepada peręguna. Mengapa ledua
faüor enebut sangat penãng dalam membangun sebuah website 77 Karena ji% sebæh
websïæ sulit 6g\xiakan, jika sebuah websiØ Ğdak beûsikan tentang informasi yang dicari
oleh user, jika sebuah we&ite tidak menuntun user ixituk melakukan apa yang harus user
lakukan, dan jiD user Œrsesat pada sebæh websiŒ yang user kunj‹x›gi, maka pilihan
terbaik user adalah de•ngan mergklik tanda close (X] atau keluar dań website tersebut.

1.2. Rumusan Masalah

Berdasarkan faktor-faktor yang telah kami uraikan diatas, karrź akan melakukan
analisis terhadap sItrs market place wu/w.TæwI6a.com

1.3. Tujuan Pembuatan Makalah

Tujuan dań pembuatanrnaka!ahiœ adalahüuUmennenuhiŁugasinteœkslrnanunia
dan komputer dan lebih mengenal tenta Interface suatu website.
 BAB II
TINJAUAN PUSTAŒ

Usabillms a6lah suatu Isãlah png digunakan umuk menanAkan balwa oarę
dapat rrerrşłekerjaÄn alat urterłbi Ångan mu&h %lam ængka mencapi &jæn
teŒnN. rsaŒlas dapt juga mengacu pada mæ%e yang digunakan untuk mengukur
wabillæs %n sNd mengenai kerağan aDu efisiemi sætu 6yck.
Dlmæd u¥ablllGs d6 ßuesenbery ( 2D05j.

1 E&ktîf (EĄectîve'). ketéitian dan kelengka¡æn para pemakai dalam rnerzapai gal
rrareka. Ł E€sien (5@/ciefx). Kecepaæn (derłgan keæliôan) para peækal %lam
menyelesailœn tugæ merelø.
3. KcteJibatan (Sngøying). Oerajat atau tingkat gaya interface yang rrerrôuat prałuk
ryrnaan unwk dlguækaæ
4. @emæl Kesalahan (Pro7 toJemnŞ. Œbempa balk dlsaln mancegah kesalahan
Ån emme%ntu memeperlæi6 kesaIaføn iŃ.
5. Mudah untuk sipelaja¥ (Sosy ro morn). Seberapa Iælk produk rrondukung odentasl awal
%n nængeÆalam pemahaman un@ng kemampœn posuk tersebA

z.2. FlekibiI"ßas
Usaólas j¢ga mempuryai suao hubungan dergan flekslbllhas dalam dlsain.
æcaæ ænœn, keÒka fleØibillæs daã suaN ásaln meningkat, usabillæs nya
berkurang.Disain fleØibel dapat rmlakukan banyak fix\gsi di&ndlng dlsain khcsw, æpl
kurarę eÈsieş hal ml memelałat dŃain Dbih korręleØ. Neksibilltas meÆuat para
wmakai ã%k Òsa dengan jelas rrengantisipasi sistem kebutuhan meeka yarę akan
da6ng. Kerrx<lian, pada akhirrça FleĞibilitas "Œ akan meręakibatkan suaw
țængumrgan usabil“œs. seŃngga perlu 6perãmbaQkan.
2.3. User InteØace

Antarmuka pemakai adalah bagian slstem komputer yang rrønxingkinkan manusia

Iæńnteraksi dengan k‹xr›puter. Desain antar M d‹a yang baik memilib kaæüeristik di
laeńkut ini:
• Standardlsasl : keseragaman slfat-slfat antaruxika pemakai pada aplikasi yang berbeda.
• Integrasi : ketepaduan antaa paket aplikasi dan sÆware tłaÔs.
• Konsi#ansi : keseagaman dalam sæ€ pogam aplikasi.
• Portabilitas : dimtxigkinkannya data dikonveni pada berbagai haÓware dan sÔtwae.

A% beberapa hal yang menyebabkan menunxinya üngkat usabiliæs dari suaŒ desain
antar muka system, Óantaranya ialah
1. Teks belum jelas dan pernilihan kaæ yang ôdak Rpat dalam bexanya menjadi penyebab
Keraguan dan akhirnya dibaca kembali, yang memungkinkan paa pengguna salah dalam
menafsirkamya.
2. Grafis yang tidak tepat sehingga unsur-unsur penting terserrôunyi.
3. Judul yang tidak repeserœaf. Ini juga mercïpækan keblnguręan dan menghalangi
kemampuan dalam melihat h ungan png ada.
4. Pemintaan irfawiasi yang ódak pentirg aØu tidak elevan, perrrinBan iØorrriasi yang
memerlukan pemikirkan darę dań jawaban sebéumnya sehingga merròiręungDn
pengg‹xia yang pada akhimya rnenimb‹Jkan kekeliruan.
5. LayoN png tidak tertnJktur dan teæah yang memurękiriœn aŞaănp kesalahan.
6. Kualitas presenasi yang jelek sulit dilæca, akan rrenurunkan kemarrguan pemakai dan
menyebat¥¢an kesalahan lagi.
 BAB Ill
HASIL DAN PEMBAHASAN

3.1. Market Place

Pada pembahasan kali iŃ Iœmi akan merrÕahas tentang web poÛal, %n kami
memîllh MaČet Place sebagai bahan amlisa kanł.
Bicara arnarg market place, apa sih market place iæ?

DcfiŃsi markcØlace secaa bahasa beraÊi “pasar* Ó In@met kbagaiææ pasar mda
łatilarrya , pasar yang saa Id juga merupaløn tarrpat jual bell bamng s6lrgga di
wllapk ini newpakan saa wilayah sebagai terrțaat benenx/nya aršaa sËIer dan
bzyer. Dengan adanya pasar glØal prig tak teÒaæs, rron&ong paa pelaku blsnls
untuk rrelakiAan inovasi unÂik memanfaaßan rredia omiæ sebagai IaØn bisnis.
Apala@ dengan semakin rreŃn$Dtnya çengø«ia inŒrnet daã hań ke haË pn$ serrøón
banyak rremanfaatlœn maĞetpl6ce dalam keadaan sepeØ ini untuk meręerrÕarękan
blsnis melalui internet tentu
rrempkan jxospek yang san$at bagus. Saat iŃ banyak sekali maĆeØlace yarg
lemłxłculan dl InÕanesia contohnya sepeÆ TÓœpedla, Bukalapak, BNneka, Tmaldœ
dl.

3.2. Tavelolæ
Tmveloka a&lah salah saN æñaølaa dalam ódarg pømesanan Oke pesawat
łian łætel yang sanşat pop4la di Indonaia, Traveloka &keȘasama dengan
beberapa maslœpai dan jçga hoœl. TaveI6a.com msrrśerlkan kerr«ałahan kapada
maspakat œłtuk merœń tiko pesawat dan j¥ga foul deføan Œfręilan yałø meæńk dan
pogam
ncarianya yang murlah di gunakan (user friendly).

Trawl6a frenÕeńlœn kenxidahan, kerłyamanan, Ån læamanan kepada œer png herAk

merxań tik6 pesawat Ån foteł.
3.3. Tampilan Interface website Traveloka
3.3.1. Nama dan Logo

traveloka
TravelDka, nama yang sangat bagus dan cocok untuk sua tu website
yang berhubungan dengan Perjalanan / wisata, dengan adanya kata yang khas
yaitu Travel yang berarti perjalanan. Nnma yang cuk«p simpel dan rnudah di
ingat. Nama Traveloka sudah sangat melekat di otak masyarakat, apabila
seseorang ingin berpergian atau berwisata, butuh tiket pesawat dan
penginapan pasti yang mumul pertama kali di otak mereka adalah Traveloka.

3.3.2. Tampilan Grafis

Pertama kali masuk’ ke website Traveloka kalian akan di suguhkan dengan

tampilan yang menarik rJan Simpel dengan ten a biru. Pada home pnge web
Traveloka dia lebih mengutamakan mesin atau program pencarian tikel
pesawat ‹Jan jugn hotel, namun tetap terlihat menarik dengan adanya
gambar- gambar, banner dan juga ikon-ikon sebaga i pelengkap dan juga
memudahkan user untuk lebih memahami.
3.3.3. Sistem Menu

Sis@m Menu tidak pemah lepas dari sebuah sistem aBu progam baik
pogam Oesktop ata¢qun program Onlie, Sistem rrenu berguna unt&
rrerrudahkan wer unttA berkomwikasi dergan pogram, User bisa
memberikan perinæh hanya dengan menekan atau klik sebuah menu. Sistem
menu ada be&epa jcnis misal menu daær, menu pdldown, meru dropdo«n
dll.
Pada website Tavelol¢a ini juga teŒapat &berapa menu png bisa membanN
para user untuk menemukan apa yang nareka irgird‹an.

tmvetoka
*

Pada bagian Header halaman Traveloka terdapat beberapa menu penting yang di
butuhkan paa user semrti Pilihan Noel / Tiket, Bantuan, Login, Register, Caa
Pesan, Cek Pesanan, Pilihan Bahasa, Pilihan mata uarg.

Men¢Put kami ini sudah sangat bagus karena dia menerrpatI‹an menu pada
&gian header hanya menu-menu yang penting saja, menu yang sangat di
butuN‹an oleh para werdan tidak rrengganggu ampilarL

L¥\Rk menu-menu pÆergkap di IeÖkan di &gian FoQer aæu bagian paling

bawah websiŒ, menu-menu pelengkap iN seperti ConBct Us, Customer Senice,
About @, kebijakan Prlvasi, Syaat & Ketentuaç FAQ, Sœlal Media, dll.

Menu-menu ini sangat cocok di ie@kan di bawah karena tidak terlalu banyak é
gunakan oleh user.
3.3.4. IKON / Simbol

Ikon atau si mbol juga merupakan bagian terpenti ng dari suatu progra m dan
website, ikon berguna untuk rrerrÖantu user memahami suatu menu atau konten
dalam suatu web, misalnya dalam web Traveloka terdapat ikon koper menunjukan
kapasitas begasi, ikon kalender menunjukan waktu pemesanan, ikon bendera
menunjukan bahasa yang di gunakan, ikon/logo maskapai, ikon/logo bank, dll.

« ‹› > a •- •‹ ••• •

. . -- - - - -› •• --

Semua ikon itu umum di gunakan oleh para programer, jadi us er p«n sudah tidak
asing lagi dengan ikon- ikon terscbut.
3.3.5. Antarmuka Berbasis Interaksi Grafis

Dialog berbentuk pesan atau informasi pada suatu gambar atau link yang tampil
ketika pengguna melakukan suatu aktifitas.

Maksudnya seperti kotak dialog, tombol-tombol, list box, combo box, scroll, dll.
Yang perintah dari suatu web yang di desain secara grdfis yang mudah di paharri.

Pada web Traveloka ini juga banyak terdapat interaksi berbasis grafis contohnya
sebagai beri hut :

1. Tombol Tekan
Banyak terdapat tombol tekan pada bagian progra‹w›ya, berbeda dengan
progra m-program desktop yar›g menggunakan tombol tekan bergaya tiga
dimensi, pada web tombol tekan biasanya mengg unakan highth ght atau
Hover pada tombol tekan yareg mempunya i link aktif.
Contohnya seperti int :

2. List Box
List bux pada web ini terdapat pada menu pemilihan kota tujuan disana di buat
List box daftar nama-nama kota.

Pada Lust Box itu di tampi Ikan semua nama hota, jadi us er tidak merasa
bingung untuk mencari kota asal dan kota tujuan.
3 Combo Box
Combo Box pada web ini bus a kalian lihat pada menu jumlah penumpang,
ada dewasa, anak anak, dan Bayi. Apabila di klik dia akan drop pilihan angka
jumlah penumpang 1-7.

Kami masih merak a bingung dengan combo box ini, karena rrenu ini tidak
terlihat seperti combo box, akan lebih baik dl tambahkan tanda segitiga ke
arah bawa h seperti tampilan combo box pada umu ya, seperti gambar di
bawah ini

4. Radio Button
Radio Button biasanya di gunakan untuk menu 2 pilihan yang hanya bisa di
pilih salah satu pilihan, pada web ini di gunakan pada menu perjalanan s‹tkali
jalan / pulang pergi, harus di pilih salah satu.

Selain radio button juga masih banyak lagi dialog berbasis interaksi grafis
seperti Check Box, Spin Box, label box dll. Itu semua untuk membuat tampilan
lebih interaktif dan lebih simpel.
3.4 Konten dalam website
Sebuah wetsite anpa adanya konten itu bagaikan IeÆaan buku yarg kosong,
dengan adanp konten sebuah website akan terasa hidup.
Yang membedakan web satu dengan web lain selain daR desain inteÆce
adalah korten png menaÑk, unik, dan jlya OÑginal.
IVknurut analisa kaml mergenai konten dalam web Traveloka ini ada beberapa
yang karri gaÑs bawahi.
3.4.1. Penggix›aan Bahasa
Bahasa png di gunakan r6lam web iä ada be&æpa yang kwang
konsisŒn d bagian menu pada header, dia menggunakan bahasa
indonesia tapi ada l¥Ja menu yang menggunakan bahasa inggns yaitu
Register dan L¢gin.

traveloka*
Bahasa Indonesia
Bahasa ngris

Harusnya dia memakai bahasa Daftar dan Masuk untuk menggantikan kata
Regisær dan Login. Ganti
Lebih baik konsisten dalam bahasa karena dia sczJah ada fasilitas ganti
bahasa dengan ikon ben&a.

3.4.2. Konten Unik dan Original

Sebuah websiB hams mempunyai korten yang unik dan juga original
sebagai yombeda web satu dengan web lain, agar tidak di anggap oleh
google sebagai plagiat
Travel@a Im mempunyai konten yang Uri k dan Juga original, seperti yang
terlil3at dari kaIimat&Iimat pomosi &n lelimat penjelas tentang web.
 3.4.3 Penggunaan Font
Untuk Penggunaan Font, untuk keyword penting harus lebih di tekankan
atau di cetak tebal atau besar, supaya pengunjung bisa tau dan mengerti.
Tapi secara keseluruhan penggunaan Font dari bentuk, model, ukuran,
wama dll sudah sangat bagus dan jelas.

3.5. Program
Karena Begitu banyaknya database pada web Traveloka ini maka di sediakan
program pencarian tiket dan juga hotel untuk memudahkan para pengunjung untuk
menemukan tikel dan hotel yang mereka inginkan.
3.5.1. User Friendly
Program Pencarian ini sudah sangat bagus, simpe! , dan mudah di mengerti atau
yang biasa di sebut Uscr Friendly, dalam artian bersahabat dengan pcngguna.
3.5.2. Cepat dan Tepat
Program mi di Desain sedemikian rupa untuk bisa mencari tiket dan hotel secara
cepat dan tepat, sesua i yang di Inginkan para pengunjung.

1s
 BAB IV
PENUTUP

3.4. Kesimpulan
Desain lnterface dalam sebuah Website sangatlah penting sebagai media
interkasi manusia (user) dan komputcr, user akan merasa di muda hkan dengan
adanya rrenu-menu, gambar, dan juga tombol-tombol yang ada dalam sebua h
website. Desain Interface haruslah menank, interaktif, dan yang pasti User
friendly agar user merasa mudah dan nyaman untuk mengakses website
tersebut.

3.S. Saran

Saran untuk para programer dan teman-teman untuk membuat Desain

interface harus tau ha-hal apa sajakah yang perlu di perhatikan dalam membuat
desain interface yang baik dan benar, bagaimana caranya? Semua itu ada pada
mat£?ri Interaksi manusia dan komputer (IMK).