04_GalistaHaidir_HimmatiKairova

LAPORAN AKHIR
PERANCANGAN UI/UX

APLIKASI
“PEMESANAN KAMAR PENGINAPAN”

Disusun Oleh:

Kelompok 4 Kelas B

Himmati Kairova (21050974060)

Galista Haidir (21050974064)

Dosen Pengampu:
Ghea Sekar Palupi

TEKNIK INFORMATIKA
FAKULTAS TEKNIK

UNIVERSITAS NEGERI SURABAYA
2022

Kata pengantar

Puji syukur kami panjatkan ke hadirat Allah SWT. Atas rahmat dan hidayah-Nya, kami dapat
menyelesaikan susunan laporan tugas akhir kami yang berjudul LAPORAN AKHIR PROJECT
APLIKASI “APLIKASI PEMESANAN KAMAR PENGINAPAN” dalam bentuk yang sederhana
untuk memenuhi tugas akhir mata kuliah Interaksi Manusia dan Komputer, dan dapat diselesaikan tepat
pada waktu yang telah ditentukan.

Dalam penyusunan Tugas Akhir ini penulis banyak mendapat saran, dorongan, bimbingan serta
keterangan-keterangan dari berbagai pihak yang merupakan pengalaman yang tidak dapat diukur secara
materi, namun dapat membukakan wawasan penulis bahwa sesungguhnya pengalaman dan
pengetahuan tersebut adalah guru yang terbaik. Dan dengan tugas akhir ini kita dapat belajar bagaimana
manajemen dalam organisasi agar dapatmencapai tujuan kelompok. Oleh karena itu dengan segala
hormat dan kerendahan hati perkenankanlah penulis mengucapkan terima kasih kepada Ibu Ghea Sekar
Palupi selaku dosen pengampu mata kuliah Interaksi Manusia dan Komputer yang telah membimbing
kami dalam menyelesaikan tugas akhir ini.

Sebagai penutup, kami menyadari adanya banyak kekurangan dalam penyusunan dan penulisan
Laporan ini. Oleh sebab itu, kritik dan saran senantiasa diharapkan demi perbaikan Laporan kami. Kami
juga berharap semoga aplikasi yang akan dibuat dapat bermanfaat bagi pembaca.

Bab I Pendahuluan

1.1 latar belakang
Penginapan adalah suatu bangunan dan sebagian bangunan yang disediakan secara khusus,

dimana setiap orang dapat menggunakan sebagai tempat tinggal sementara dengan membayar sewa.
Penginapan merupakan salah satu bentuk akomodasi bagi orang yang melakukan kegiatan yang
dilakukan bukan pada tempat tinggal sehari-hari atau berada di luar kota untuk kepentingan sesuatu
seperti berwisata, bisnis, pertemua, dan lain sebagainya.

Teknologi dan informasi saat ini telah berkembang dengan pesat dan perkembangan teknologi
informasi juga telah mempengaruhi berbagai bidang, baik bidang pendidikan, industri, perusahaan
maupun pemerintahan. Perkembangan teknologi dan informasi diawali dengan munculnya internet
sebagai media informasi yang terkoneksi ke berbagai belahan dunia yang dapat di akses
menggunakan komputer atau android. Salah satu area bisnis yang memanfaatkan internet adalah
perusahaan yang bergerak di bidang jasa penginapan.

Alasan penulis membuat aplikasi tersebut karena pada saat ini seperti yang penulis ketahui jika
ingin mencari suatu informasi tentang suatu penginapan selain harus datang langsung ke penginapan
tersebut biasanya kita hanya dapat melihat informasi suatu penginapan melalu website penginapan
tersebut dan mungin ada beberapa penginapan yang belum memiliki sebuah website yang mana jika
ingin mengakses tersebut para wisatawan terbatasi oleh tempat dan waktu.

Berdasarkan latar belakang diatas penulis ingin mengembangkan sebuah aplikasi “Pemesanan
Kamar Penginapan” yang merupakan suatu aplikasi yang dirancang guna memberi kemudahan bagi
pengguna. Sebuah aplikasi yang dapat memberikan kemudahan dalam memilih tempat penginapan
atau penginapan.

1.2 Rumusan masalah
Berdasarkan latar belakang permasalahan di atas, dapat dirumuskan sebuah masalah yaitu :

Bagaimana merancang UI/UX aplikasi pemesanan kamar penginapan?

1.3 Tujuan
Tujuan dari penelitian ini adalah dapat menghasilkan perancangan UI/UX aplikasi pemesanan

kamar penginapan.

1.4 Manfaat
• Menghasilkan rancangan aplikasi pemesanan penginapan.
• Memaksimalkan UI pada aplikasi sehingga dapat dipaham pengguna.

Bab II
Pembahasan

2.1 Jenis Penelitian
Jenis Penelitian yang digunakan pada proses perancangan UI/UX kali ini adalah dengan

wawancara pribadi.

Wawancara pribadi adalah proses penelitian yang dilakukan dengan cara wawancara yang
dilakukan oleh 1 orang pewawancara dengan 1 informan. Dalam jenis wawancara ini, pewawancara
dapat memberikan pertanyaan secara bertahap dan berkembang.

2.2 Hasil Penelitian

Interview orang ke 1
• Seberapa sering menginap di sebuah penginapan?
Jawab : cukup sering, hampir setiap ada libur lebih dari 1 hari, saya pergi menginap.
• Bagaimana pelayanan resepsionis saat memesan kamar penginapan?
Jawab : Kalau dipukul rata ya hampir semua ramah, karena tempat saya menginap juga
lebih ke daerah yang jauh dari tengah kota.
• Bagaimana sistem pemesanannya?
Jawab : Biasanya saya mencari alamat penginapan terlebih dahulu entah di internet
atau lewat teman, lalu saya langsung datang untuk memesan penginapan lewat
penjaga/resepsionis penginapan.
• Menurut anda apakah cara tersebut efisien?
Jawab : Sebenarnya tidak, karena saya harus pergi ke lokasi secara langsung dimana
tidak semua penginapan selalu sedia, terkadang sudah disewa, direnovasi, dll.

Interview orang ke 2
• Seberapa sering menginap di sebuah penginapan?

Jawab : pernah tapi tidak sering
• Bagaimana pelayanan resepsionis saat memesan kamar penginapan

Jawab : ramah dan menawarkan model-model kamar yang ada.
• Bagaimana sistem pemesanannya

Jawab : biasanya ketika kita datang ke penginapan ditanya mau pesan kamar yg mana,
terus ditawarkan beberapa paket pelayanan terbaru dan daftar dengan memberikan KTP
kita

• Menurut anda apakah cara tersebut efisien
Jawab : karena pemesanannya masih offline / harus datang ke tempatnya jadi masih
kurang efisien karena kadang kala kamar yang kita inginkan sudah didahului.

Interview orang ke 3
• Seberapa sering menginap di penginapa ?

Jawab: bisa dikatakan jarang, karena saya menginap ketika ada kepentingan atau
liburan saja.
• Bagaimana pelayanan resepsionis saat memesan kamar penginapan?
Jawab: sebagian besar yang saya temui selama ini ramah, namun terkadang ada yang
terlihat jengkel atau kurang sabar ketika menghadapi klien yang banyak bertanya.
• Bagaimana sistem pemesanannya?
Jawab: biasanya saya mencari info di internet atau bertanya kepada teman-teman lalu
jika dirasa cocok saya langsung mendatangi tempatnya dan memesan kamar jika sudah
cocok dan sesuai ekspektasi.
• Menyandang apakah cara tersebut efisien?
Jawab: menurut saya cara tersebut kurang efisien karena terkadang tempatnya tidak
sesuai ekspektasi, entah kamarnya full, sedang dalam perbaikan, atau kamar yang kita
inginkan sudah di dahului orang lain.

2.3 Afinity Diagram

Gambar 1 (Di Bagian Lampiran)

2.4 Analisis Pengguna (User Analyssis)
Gambar 2.1 (Di Bagian Lampiran)
Gambar 2.2 (Di Bagian Lampiran)
Gambar 2.3 (Di Bagian Lampiran)

2.5 Analisis Tugas (Task Analyssis)
Gambar 3 (Di Bagian Lampiran)

2.7 Rancangan Solusi (Possible Solution)

Setelah penulis mewawancarai beberapa orang tentang pemesanan kamar penginapan, ternyata
ada beberapa masalah yang dihadapi yaitu berupa customer harus mendatangi langsung tempat
penginapan dan terkadang penginapan atau kamar yang mereka inginkan sudah didahului oleh orang
lain. Berdasarkan permasalahan tersebut maka laporan ini mencoba untuk memberikan rancangan solusi
berupa rancangan aplikasi pemesanan kamar secara online yang nantinya dapat memberikan alternatif

solusi masalah tersebut. Pada aplikasi ini penulis membangun aplikasi yang dapat meningkatkan
pelayanan dan memberikan informasi pemesanan kamar dengan lengkap dan cepat hingga tidak
khawatir di dahului oleh customer lainnya. Penulis juga menciptakan aplikasi yang memudahkan
pengunjung melakukan pemesanan secara online sehingga pengunjung tidak perlu datang langsung ke
tempat ketika ingin memesan kamar penginapan.

Bab III Implementasi

3.1 Prototype Tingkat Lo-Fi (Wiraframe)

Wireframe adalah kerangka, struktur, atau sketsa berbentu kotak-kotak dan garis, yang dibuat
bertujuan untuk mempresentasikan sebuah desain aplikasi yang hendak dibangun. Kerangka tersebut
dibuat sebelum masuk pada desain yang lebih nyata. Berikut merupakan wireframe yang telah kami
buat :

Gambar 4 (Di bagian lampiran)

3.2 Prototype Tingkat Hi-Fi (Fully Functioning)

1) Login
Tampilan awal ketika pengguna mengakses aplikasi, pada login terdapat email dan

password yang sudah terdaftar / sudah melakukan registrasi. Tombol masuk berguna untuk
login jika sudah memiliki akun, tombol lupa password berguna untuk pengguna jika lupa
dengan passwordnya, tombol daftar sekarang berguna untuk pengguna yang belum memiliki
akun.

Gambar 5.1 (Di bagian lampiran)

2) Register
Tampilan register ketika pengguna belum memiliki akun untuk memasuki aplikasi,

pada register terdapat email, password, ulangi password untuk melakukan pendaftaran akun.
Tombol daftar berguna untuk mendaftarkan akun ke aplikasi, tombol masuk sekarang
digunakan apabila pengguna sudah memiliki akun (setelah mendaftar).

Gambar 5.2 (Di bagian lampiran)

3) Lupa Password
Tampilan Lupa password ketika pengguna lupa dengan password yang mereka miliki

sebelumnya, pada lupa password terdapat kolom pengisian email, dimana nanti email yang
telah diketikkan akan dikirimi link untuk memperbarui password. Tombol reset password
berguna untuk mengirimkan link untuk memperbarui password ke email yang telah diketikkan.

Gambar 5.3 (Di bagian lampiran)

4) Info App
Tampilan info app ketika pengguna ingin mengetahui info aplikasi yang sedang

digunakan.

Gambar 5.4 (Di bagian lampiran)

5) Cari Penginapan
Halaman cari penginapan digunakan untuk pengguna mencari penginapan yang

diinginkan. Tombol cari lokasi digunakan untuk menentukan daerah/lokasi dimana penginapan
yang diinginkan, kolom search digunakan untuk mencari nama penginapan. Kolom rencana
berisikan keinginan pengguna dimana terdapat tempat mengisikan tanggal berapa, berapa
malam, jumlah kamar, kisaran harga, dan rating penginapan yang ingin dipesan oleh pengguna.
Pada bagian hasil merupakan hasil dari yang sudah diinputkan oleh pengguna pada kolom
rencana.

Gambar 5.5 (Di bagian lampiran)

6) Detail Penginapan
Halaman detail penginapan merupakan tampilan dari penginapan yang telah ditekan

pada halaman cari penginapan, pada halaman ini terdapat alamat, tombol buka map untuk
membuka aplikasi map untuk melihat dimana tepat letak penginapan, nama penginapan, rating
penginapan, deskripsi penginapan, fasilitas, ulasan. Tombol pesan digunakan untuk melakukan
komunikasi dengan pihak penginapan secara langsung entah melalui pesan atau panggilan,
tombol pesan sekarang berguna untuk membawa pengguna ke proses selanjutnya untuk
melakukan validasi pemesanan.

Gambar 5.6 (Di bagian lampiran)

7) Halaman chat
Halaman chat merupakan daftar chat antara penginapan dan pengguna.

Gambar 5.7 (Di bagian lampiran)

8) Chat dengan Penginapan
Halaman chat merupakan halaman personal chat antara pihak penginapan dengan

pengguna. Dimana terdapat fitur pesan dan panggilan selayaknya aplikasi chatting.

Gambar 5.8 (Di bagian lampiran)

9) Memesan Penginapan
Halaman pesan penginapan merupakan langkah selanjutnya setelah memilih

penginapan. Pada kolom data pemesan pengguna dapat memasukkan email dan nomor tlpn
untuk pengiriman kode yang nantinya akan discan di pihak penginapan, lalu ada checklist pesan
untuk pribadi atau pesan untuk orang lain. Pada kolom permintaan khusus terdapat pilihan tipe
kamar, tipe tempat tidur, waktu check-in dan check-out. Pada kolom rincian harga terdapat
harga total dari penginapan (+ setelah mengisi permintaan khusus).

Gambar 5.9 (Di bagian lampiran)

10) Review Pemesanan Penginapan
Halaman review merupakan halaman yang berisi ringkasan pesanan penginapan yang

telah dipilih oleh pengguna. Pada halaman ini terdapat kolom waktu menginap, tipe kamar, dan
rincian harga. Terdapat juga tombol kembali apabila masih ada yang ingin diganti atau
membatalkan pesanan, dan tombol lanjutkan berfungsi untuk melanjutkan ke halaman
selanjutnya.

Gambar 5.10 (Di bagian lampiran)

11) Review Pembayaran Penginapan
Halaman Review pembayaran, berisikan waktu batas pembayaran, dan metode

pembayaran. Terdapat tombol ubah digunakan untuk mengubah metode pembayaran.

Gambar 5.11 (Di bagian lampiran)

12) Pilih Metode Pembayaran
Halaman Metode pembayaran merupakan pilihan metode pembayaran yang dapat

dipilih sesuai keinginan pengguna.

Gambar 5.12 (Di bagian lampiran)

13) Konfirmasi Pembayaran
Halaman konfirmasi pembayaran berisi rangkuman dari metode pembayaran dan

terdapat nomor VA pembayaran yang digunakan untuk membayar. Dan tombol selesai
digunakan apabila semua proses telah selesai.

Gambar 5.13 (Di bagian lampiran)

14) Halaman Pin
Halaman pin merupakan daftar dari penginapan yang telah disimpan oleh pengguna,

berguna agar apabila pengguna ingin menginap di penginapan yang telah di pin, pengguna
hanya tinggal pergi ke halaman pin (tidak mencari secara manual di halaman cari penginapan.

Gambar 5.14 (Di bagian lampiran)

15) Halaman Profile
Halaman profile merupakan tampilan untuk menampilkan akun dari user, pada

halaman ini juga terdapat menu lihat riwayat pesanan untuk ke halaman riwayat pesanan, belum
bayar merupakan keterangan bagi user apabila belum menyelesaikan pembayaran, penilaian
saya untuk menuju ke halaman penilaian, favorit saya untuk menuju ke halaman favorit dari
user.

Gambar 5.15 (Di bagian lampiran)

16) Halaman Penilaian
Pada halaman ini merupakan tempat untuk user memberikan rating maupun komentar

untuk penginapan yang telah mereka pesan.
Gambar 5.16 (Di bagian lampiran)

17) Halaman Beri Penilaian
Pada halaman ini terdapat dua bagian dimana pada bagian pertama terdapat tombol

nilai untuk mengarah ke halaman penilaian saya, kemudian bagian berikutnya berisikan
penginapan yang sudah diberikan rating / komentar oleh user.

Gambar 5.17 (Di bagian lampiran)

18) Halaman Riwayat Pesanan
Pada bagian ini berisikan riwayat pemesanan penginapan yang pernah dilakukan oleh

user.
Gambar 5.18 (Di bagian lampiran)

3.2 Tools Prototype

Untuk mendesign aplikasi tentu membutuhkan sebuah tools yang mendukung dan
membantu dalam mendesign. Ada banyak tools yang dapat digunakan. Untuk mendesign
UI/UX aplikasi “Pemesanan Kamar Penginapan” penulis menggunakan Figma.

Figma merupakan editor grafis vektor dan alat prototyping yang memudahkan para
programer untuk melakukan kolabirasi dalam mendesign website, apps, serta berbagai
komponen user interface lainnya karena bekerja di cloud dan bisa di akses via browser dari
mana saja selama laptop terhubung pada internet. Rangkaian fitur Figma fokus pada
penggunaan dalam antarmuka pengguna dan desain. Maka dari itu penulis sangat terbantu
dengan adanya tools figma ini.

Bab IV Penutup

4.1 Kesimpulan
Berdasarkan penelitian dari perancangan desain UI/UX aplikasi Pemesanan Kamar Penginapan

berbasis android, dapat disimpulkan : Berdasarkan proses evaluasi pada penelitian ini didapatkan
permasalhan yang membutuhkan sebuah sistem untuk proses memesan kamar pada sebuah penginapan,
sebelum tahap pembuatan sistem/aplikasi maka dibutuhkan perancangan UI/UX sebagai langkah awal
dalam pembuatan aplikasi.

4.2 Saran
Untuk penelitian selanjutnya dapat mengembangkan rancangan prototype untuk versi dekstop

dan website berdasarkan prototype yang dibuat dan menghasilkan tampilan yang bisa disesuaikan
dengan ukuran semua device sehingga aplikasi ini dapat dijalankan dan digunakan dalam semua device
dan menghasilkan rancangan prototype yang lebih bagus kedepannya.

Daftar Pustaka

• https://kanalwisata.com/jenis-jenis-penginapan-akomodasi
• https://www.ekrut.com/media/teknik-wawancara

Lampiran

➢ Gambar 1

➢ Gambar 2.1

➢ Gambar 2.2

➢ Gambar 2.3
➢ Gambar 3

➢ Gambar 4
➢ Gambar 5.1

➢ Gambar 5.2
➢ Gambar 5.3
➢ Gambar 5.4

➢ Gambar 5.5
➢ Gambar 5.6
➢ Gambar 5.7

➢ Gambar 5.8
➢ Gambar 5.9
➢ Gambar 5.10

➢ Gambar 5.11
➢ Gambar 5.12
➢ Gambar 5.13

➢ Gambar 5.14
➢ Gambar 5.15
➢ Gambar 5.16

➢ Gambar 5.17
➢ Gambar 5.18