21
BAB III
PEMBAHASAN
3.1. Analisa Kebutuhan
Pada website penyewaan kos masih menggunakan sisitem transaksi secara
manual. Pada website penyewaan kos ini merupakan informasi bagi para pendatang
yang baru mengunjungi Cikampek dengan memberikan informasi letak kos-kosan
yang ada di Cikampek. Transaksi yang digunakan adalah langsung menghubungi
pemilik kos tersebut dan melakukan pembayaran langsung kepada pemilik kos,
dengan bertujuan agar langsung mengetahui lokasi dan bisa berinteraksi langsung
dengan pemilik kos.
Dengan adanya website penyewaan kos ini bisa mempermudah para
pendatang untuk mencari dan menghubungi pemilik kos dan menanyakan informasi-
informasi yang diinginkan para pendatang. Dan dengan adanya perkembangan
teknologi sekarang pencarian lokasi bisa dijangkau mudah melalui smartphone.
3.2. Perancangan Perangkat Lunak
3.2.1 Rancangan Antar Muka
Tujuan untuk dibuatnya rancangan antar muka ini adalah untuk menghasilkan
tampilan yang nyaman untuk dilihat dan diakses oleh pengguna (user friendly).
Rancangan web ini rancangan antar muka pada website ini ada dua yaitu user sebagai
pemlik kos dan admin untuk mengelola dan mengawasi website.
FINAL
22
A. Rancangan Antar Muka Admin
1. Rancangan Antar Muka Login Pemilik Kos
Gambar III.1
Rancangan Antar Muka Login Pemilik Kos
2. Rancangan Antar Muka Login Admin
Gambar III.2
Rancangan Antar Muka Login Admin
Silahkan Login Untuk Dapat Memulai
Mendaftarkan Kontrakan Anda
Username Anda
Password
Login
Login untuk masuk ke halaman admin
Username Anda
Password
Login
FINAL
23
3. Rancangan Aantar Muka Beranda
Gambar III.3
Rancangan Antar Muka Beranda
Cari Berdasarkan
BERANDA CARA PEMESANAN KOS DAFTARKAN KOS LOGIN
BANNER
Kategori Wilayah Harga cari
KOS
KOS
KOS
KOS
KOS
KOS
FOOTER
KOS
KOS
KOS FIN
AL
24
4. Rancangan Antar Muka Iinformasi Kos
Gambar III.4
Rancangan Antar Muka Informasi Kos
5. Rancangan Antar Muka Pemilik Kos Beranda
Gambar III.5
Rancangan Antar Muka Beranda Pemilik Kos
BERANDA CARA PEMESANAN DAFTARKAN KOS LOGIN
GAMBAR KOS
FOOTER
DESKRIPSI KOS
PROFILE
BERANDA
E-KOST
DAFTARKAN KOS
KOST ANDA
OPTION
GANTI PASSWORD
LOGOUT
Selamat Datang di halaman user sistem informasi E - Kost.
Dihalaman ini anda selaku pemilik dan pendaftar di e-kost
dapat mendaftarkan kost anda untuk di tampilkan di aplikasi
kami untuk tujuan promosi kost / kontrakan anda di area
Cikampek.
PROFILE
BERANDA
FINAL
25
Masukkan Foto Ukuran 400x300 (PNG/JPG/JPEG) Untuk Gambar Kost Anda
6. Rancangan antar muka input kos
Gambar III.6
Rancangan Antar Muka Input Kos
7. Rancangan antar muka Profil Pemilik Kos
Gambar III.7
Rancangan Antar Muka Profil Pemilik Kos
Choose File
xxxxxx
xxxxx
xxxxx
999999 Bulan/Tahun
xxxxxxx
xxxxxxx
E-KOST
DAFTARKAN KOS
KOST ANDA
OPTION
GANTI PASSWORD
LOGOUT
PROFILE
BERANDA
Hapus Daftar
E-KOST
DAFTARKAN KOS
KOST ANDA
OPTION
GANTI PASSWORD
LOGOUT
PROFILE
BERANDA Profile Anda
FINAL
26
8. Rancangan Antar Muka Kos Anda
Gambar III.8
Rancangan Antar Muka Kos Anda
9. Rancangan Antar Muka Ganti Password Pemilik Kos
Gambar III.9
Rancangan Antar Muka Ganti Password Pemilik Kos
E-KOST
DAFTARKAN KOS
KOST ANDA
OPTION
GANTI PASSWORD
LOGOUT
PROFILE
BERANDA Ganti Password User
xxxxxx
xxxxxx
xxxxxx
E-KOST
DAFTARKAN KOS
KOST ANDA
OPTION
GANTI PASSWORD
LOGOUT
PROFILE
BERANDA Kos Anda
HAPUS GANTI
FINAL
27
10. Rancangan Antar Muka Admin Beranda
Gambar III.10
Rancangan Anatar Muka Admin Beranda
11. Rancangan Antar Muka Data Kos
Gambar III.11
Rancangan Antar Muka Data Kos
E-KOST
DATA KOS
PROFILE ADMIN
OPTION
GANTI PASSWORD
LOGOUT
HALAMAN ADMIN E-KOS
Selamat Datang di halaman admin sistem informasi E -
Kost. Website ini dibuat sebagai syarat memenuhi Tugas
Akhir. Halaman Admin ini dapat melakukan pengelolahan
data, baik itu data user maupun data admin sendiri. Proses
yang terjadi pada data user sepenuhnya tanggung jawab dari
Admin.
DATA USER
BERANDA
E-KOST
DATA KOS
PROFILE ADMIN
OPTION
GANTI PASSWORD
LOGOUT
DATA USER
BERANDA Data Kos
FINAL
28
12. Rancangan Antar Muka Data Pemilik Kos
Gambar III.12
Rancangan Antar Muka Data Pemilik Kos
13. Rancangan Antar Muka Profil Admin
Gambar III.13
Rancangan Antar Muka Profil Admin
E-KOST
DATA KOS
PROFILE ADMIN
OPTION
GANTI PASSWORD
LOGOUT
DATA USER
BERANDA Daftar Pemilik Kos
E-KOST
DATA KOS
PROFILE ADMIN
OPTION
GANTI PASSWORD
LOGOUT
DATA USER
BERANDA Profile Admin
FINAL
29
14. Rancangan Antar Muka Daftar Pemilik Kos
Gambar III.14
Rancangan Antar Muka Daftar Pemilik Kos
Form Untuk Pendaftaran Pemilik Kos
xxxxxxxx
xxxxxxxx
xxxxxxxx
xxxxxxxx
xxxxxxxx
Kembali Hapus Daftar
FINAL
30
15. Rancangan Antar Muka Input Data Konsumen
Gambar III.15
Rancangan Antar Muka Input Data Konsumen
18. Rancangan Antar Muka Tabel Informasi Pemesanan
Gambar III.16
Rancangan Antar Muka Tabel Pemesanan
Input Data Konsumen
xxxxxxxx
Hapus Submit
xxxxxxx
xxxxxxx
xxxxxxx
xxxxxxx
xxxxxxx
-> Next
No.
Pesan
Nama
Pemilik
No. HP Alamat Harga Lama
Sewa
Kateg
ori
Deskrip
si
Total
xxxxx xxxxx 999999 xxxxx 999999 99999 xxxxx xxxxx 99999 FINAL
31
3.3. Rancangan Basis Data
3.3.1 Entity Relationship Diagram (ERD)
memiliki
mengisi
melakukan
konsumen
id_konsumen
no_ktp
jenis_kelamin
nama_kons
nopesan
no_telp_kons
tanggal
status_pemb
ayaran
idkos
nopesan
namakos
idkos
no_telp_kos
alamat_kos
harga
kategori
deskripsi
sewa kamar_kos
idkos
id_user
namakos
alamat_kos
harga
per
kategori
deskripsi
gambar
no_telp_kos
status_kos
foto_pemilik
gambar_lainn
ya
isi
pemilik_kospassword
nama
alamat
id_user
no_telp_p
mlk
nopesan
memiliki
nopesan
konfirmasi
nopesan
nama_kons
bank
no_rek
bukti
idkos
id_user
1
1
1 1
1
1
1
1
Gambar III.17
Entity Relationship Diagram
FINAL
32
3.3.2. Logical Record Structure (LRS)
id_user PK
nama
password
alamat
no_telp
pemilik_kos
idkos PK
id_user FK
namakos
alamat_kos
harga
per
kategori
deskripsi
gambar
gambar_lainnya
foto_pemilik
no_telp_kos
status_kos
isi
kamar_kos
nopesan PK
namakos
idkos FK
no_telp_kos
alamat_kos
harga
kategori
deskripsi
sewa
id_konsumen PK
nopesan FK
nama_kons
jenis_kelamin
no_ktp
no_telp_kons
tanggal
status_pembayaran
konsumen
nopesan PK
nama_kons
bank
No_reksi
konfirmasi
1
1
1
1
1
1
11
Gambar III.18
Logical Relationship Structure
FINAL
33
3.3.3. Spesifikasi File
a. Spesifikasi File Pemilik Kos
Nama File : pemilik_kos
Fungsi : Menyimpan data pemilik kos
Tipe File : File Master
Akses File : Random
Media : Harddisk
Panjang Record : 232 byte
Kunci File : id_user
Software : Mysql
FINAL
34
Tabel III.1.
Spesifikasi File Pemilik Kos
No Elemen data Nama File Tipe Size Keterangan
1. Id User id_user Int 11 Primary key
2. Nama nama Varchar 70
3. Password password Varchar 30
4. Email email Varchar 40
5. Alamat alamat Varchar 70
6. Nomor Telepon no_telp Varchar 11
7. Status Kos status_kos Enum
FINAL
35
b. Spesifikasi File Kamar Kos
Nama File : kamar_kos
Fungsi : Menyimpan data kos
Tipe File : File Master
Akses File : Random
Media : Harddisk
Panjang Record : 203 byte
Kunci File : idkos
Software : Mysql
FINAL
36
Tabel III.2.
Spesifikasi Data Kamar Kos
No Elemen data Nama File Tipe Size Keterangan
1. Id Kos id_kos Integer 10 Primary key
2. Id User id_user Int 11
3. Nama Kos namakos Varchar 70
4. Alamat alamat_kos Text
5. Harga harga Integer 30
6. Per per Varchar 20
7. Kategori kategori Varchar 50
8. Deskripsi deskripsi Text
9. Gambar gambar Blob
10. Foto Pemilik
Kos
foto_pemilik blob
11. Gambar Kos
Lainnya
gambar_lainnya blob
12. No Telepon no_telp_kos Varchar 12
13. Status Kos status_kos Varchar 12
FINAL
37
14. Jumlah Pintu isi Integer 10
c. Spesifikasi file Konsumen
Nama File : konsumen
Fungsi : Menyimpan data konsumen
Tipe File : File Master
Akses File : Random
Media : Harddisk
Panjang Record : 182 byte
Kunci File : id_konsumen
Software : Mysql
FINAL
38
Tabel III.3
Spesifikasi file Data Konsumen
No. Elemen Data Nama File Tipe Size Keterangan
1. Id konsumen id_konsumen Varchar 20 Primary Key
2. Nomor pesan
konsumen
nopesan Varchar 5
3. Nama nama_kons Varchar 20
4. Jenis Kelamin jenis_kelamin Varchar 13
5. Nomor KTP no_ktp Varchar 25
6. Bank bank Varchar 9
7. No Telpon Konsumen no_telp_kons Varchar 14
8. Nomor Rekening no_rek Varchar 25
9. Jumlah jumlah Varchar 25
10. Tanggal tanggal Varchar 12
11. Status status_pembayaran Enum
FINAL
39
d. Spesifikasi file Sewa
Nama File : sewa
Fungsi : Menyimpan data pemesanan sementara
Tipe File : File Master
Akses File : Random
Media : Harddisk
Panjang Record : 72 byte
Kunci File : nopesan
Software : Mysql
FINAL
40
Tabel 1II.4
Spesifikasi Data File Sewa
No. Elemen Data Nama File Tipe Size Keterangan
1. Nomor Pesan nopesan Varchar 5 Primary Key
2.. Nama Pemilik namakos Varchar 20
3. Identitas Pemilik idkos Integer 11
4. Nomor Handphone no_telp_kos Varchar 14
5. Alamat alamat_kos Text
6. Harga harga Varchar 12
8. Kategori kategori Varchar 10
9. Deskripsi deskripsi Text
FINAL
41
e. Spesifikasi file admin
Nama File : admin
Fungsi : Menyimpan data admin
Tipe File : File Master
Akses File : Random
Media : Harddisk
Panjang Record : 109 byte
Kunci File : nama
Software : Mysql
Tabel 1II.5
Spesifikasi data file admin
No. Elemen Data Nama File Tipe Size Keterangan
1. Nama nama Varchar 20 Primary Key
2. Password password Varchar 20
3. Alamat alamat Varchar 20
4. Nomor Handphone no_telp Varchar 20
5. Email email Varchar 29
FINAL
42
f. Spesifikasi file konfirmasi
Nama File : konfirmasi
Fungsi : Menyimpan data bukti transfer
Tipe File : File Master
Akses File : Random
Media : Harddisk
Panjang Record : 165 byte
Kunci File : nopesan
Software : Mysql
Tabel III.6
Spesifikasi File Konfirmasi
No. Elemen Data Nama File Tipe Size Keterangan
1. Nomor Pemesanan nopesan Varchar 20 Primary Key
2. Nama Konsumen nama_kons Integer 20
3. Nama Bank Bank Varchar 10
4. Nomor Rekening no_rek Integer 15
5. Bukti Transfer bukti Varchar 100
FINAL
43
3.2.3 Struktur Navigasi
1. Rancangan Struktur Navigasi Admin
FORM LOGIN
ADMIN
DATA
KONSUMENDATA TRANSFERBERANDADATA USER DATA KOSDATA USER LOGOUT
Gambar III.19
Struktur Navigasi Admin
2. Rancangan Struktur Navigasi Pemilik Kos
FORM LOGIN
PEMILIK KOS
PENYEWA KOS ANDABERANDADAFTARKAN
KOS
GANTI
PASSWORDPROFILE LOGOUT
Gambar III.20
Struktur Navigasi Pemilik Kos
FINAL
44
3. Rancangan Struktur Navigasi Beranda
INDEX
BERANDACEK STATUS
SEWAINFO KOSREGISTRASI
LOGIN
KONFIRMASI
PEMBAYARAN
Gambar III.21
Struktur Navigasi Beranda
FINAL
45
3.4 Implementasi Dan Pengujian Unit
3.4.1 Implementasi
1. Implementasi Halaman Login Akun Pemilik Kos
Gambar III.22
Implementasi Login Akun Pemilik Kos
2. Implementasi Halaman Beranda Pemilik Kos
Gambar III.23
Implementasi Beranda Pemilik Kos
FINAL
46
3. Implementasi Halaman Data Penyewa
Gambar III.24
Implementasi Halaman Data Penyewa
4. Implementasi Halaman Daftarkan Kos
Gambar III.25
Implementasi Halaman Daftarkan Kos
FINAL
47
5. Implementasi Halaman Profil Akun Pemilik Kos
Gambar III.26
Implementasi Halaman Profil Akun Pemilik Kos
6. Implementasi Halaman Kos Anda
Gambar III.27
Implementasi Halaman Kos Anda
FINAL
48
7. Implementasi Halaman Ganti Password Akun Pemilik Kos
Gambar III.28
Implementasi Halaman Ganti Password Akun Pemilik Kos
8. Implementasi Halaman Admin Login
Gambar III.29
Implementasi Halaman Admin Login
FINAL
49
9. Implementasi Halaman Admin Beranda
Gambar III.30
Implementasi Halaman Admin Beranda
10. Implementasi Halaman Data Konsumen
Gambar III.31
Implementasi Halaman Data Konsumen
FINAL
50
11. Implementasi Halaman Data Bukti Transfer
Gambar III.32
Implementasi Halaman Data Bukti Transfer
12. Implementasi Halaman Data Kos
Gambar III.33
Implementasi Halaman Data Kos
FINAL
51
13. Implementasi Halaman Data Akun Pemilik Kos
Gambar III.34
Implementasi Halaman Data Akun Pemilik Kos
14. Implementasi Halaman Profil Admin
Gambar III.35
Implementasi Halaman Profil Admin
FINAL
52
15. Implementasi Halaman Beranda
Gambar III.36
Implementasi Halaman Beranda
16. Implementasi Halaman Info Detail Kos
Gambar III.37
Implementasi Halaman Info Detail Kos
FINAL
53
17. Implementasi Halaman Tabel Pemesanan Kos
Gambar III.38
Implementasi Halaman Tabel Pemesanan Kos
18. Implementasi Halaman Isi Data Diri Konsumen
Gambar III.39
Implementasi Halaman Isi Data Diri Konsumen
FINAL
54
19. Implementasi Halaman Cetak Bukti Penyewaan
Gambar III.40
Implementasi Halaman Cetak Bukti Penyewaan
20. Implementasi Halaman Konfirmasi Pembayaran
Gambar III.41
Implementasi Halaman Konfirmasi Pembayaran
FINAL
55
21. Implementasi Halaman Cek Status Pembayaran
Gambar III.42
Implementasi Halaman Cek Status Pembayaran
FINAL
56
3.4.2 Pengujian Unit
Tabel III.7
Pengujian Input Terhadap Form Login User
No Skenario
Pengujian Test Case
Hasil yang
diharapkan
Hasil
pengujian Kesimpulan
1.
Seluruh input
tidak diisi
kemudian klik
[Login]
Username
(kosong)
Password
(kosong)
Sistem akan menolak
akses dengan
menampilkan pesan
“Field masih ada
yang kosong harap
diisi”
Sesuai
harapan Valid
2.
[Username]
diisi tetapi
salah
Username
(aceng)
Password
(1234)
Sistem akan menolak
akses dan
menampilkan pesan
“Username/password
anda salah”
Sesuai
harapan Valid
3.
[Password]
diisi tetapi
salah
Username
(aceng)
Password
(1234)
Sistem akan menolak
akses dan
menampilkan pesan
“Username/password
anda salah”
Sesuai
harapan Valid
Tabel III.8
Pengujian Input Terhadap Form Login Admin
No Scenario
Pengujian Test Case
Hasil yang
diharapkan
Hasil
pengujian Kesimpulan
1. Seluruh input
tidak diisi
kemudian klik
login
Username
(kosong)
Password
(kosong)
Sistem akan menolak
akses menampilkan
pesan “Field masih
ada yang kosong
harap diisi”
Sesuai
harapan Valid
2. [Username]
diisi tetapi
Username
(aceng)
Sistem akan menolak
akses dan Sesuai Valid
FINAL
57
salah Password
(1234)
menampilkan pesan
“Username/password
anda salah”
harapan
3.
[Password]
diisi tetapi
salah
Username
(aceng)
Password
(1234)
Sistem akan menolak
akses dan
menampilkan pesan
“Username/password
anda salah”
Sesuai
harapan
Valid
Tabel III.9
Pengujian Input Kos
No Scenario
Pengujian Test Case
Hasil yang
diharapkan
Hasil
pengujian Kesimpulan
1.
Seluruh form
input data kost
tidak diisi dan
klik tombol
[Daftar]
Nama pemilik
kos (kosong)
Alamat (kosong)
Nomor
Teleppn(kosong)
Harga (kosong)
Kategori
(kosong)
Deskripsi
(kosong) Foto
kost (kosong)
Sistem akan
menolak
akses dan
menampilkan
“Mohon diisi
semua
fieldnya”
Sesuai
harapan Valid
2.
Hanya mengisi
salah satu form
input saja dan
klik tombol
[Daftar]
Nama pemilik
kos (angga)
Alamat (kosong)
No Telp
(kosong) Harga
(kosong)
Kategori
(kosong)
Deskripsi
(kosong) Foto
kost (kosong)
Sistem akan
menolak
akses dan
menampilkan
pesan
“Mohon diisi
semua
fieldnya”
Sesuai
harapan Valid
3. Memasukan
foto melebihi
Nama pemilik
kos (angga)
Sistem akan
menolak dan Sesuai Valid
FINAL
58
atau kurang
dari ukuran
400x300 lalu
klik tombol
[Daftar]
Alamat
(cikampek)
Nomor Telepon
(0123145)
Harga (300000)
Kategori
(umum)
Deskripsi
(dekat) Foto kost
(foto 1280x720)
menampilkan
pesan “Foto
yang
diupload
terlalu besar”
harapan
Tabel III.10
Pengujian input pada form konsumen
No Scenario
Pengujian Test Case
Hasil yang
diharapkan
Hasil
pengujian Kesimpulan
1.
Seluruh input
tidak diisi
kemudian
klik SUBMIT
Nama
(kosong)
Nomor
pemesanan
(kosong)
Nomor
identitas
(kosong)
Nomor
handphone
(kosong)
Nama bank
(kosong)
Jumlah
Transfer
(kosong)
Nomor
Rekening
(kosong)
Sistem akan menolak
akses menampilkan
pesan “Field masih
ada yang kosong
harap diisi”
Sesuai
harapan Valid
2.
Hanya
beberapa diisi
lalu SUBMIT
Nama
(angga)
Nomor
pemesanan
(TR001)
Nomor
Sistem akan menolak
akses menampilkan
pesan “Field masih
ada yang kosong
harap diisi”
Sesuai
harapan Valid
FINAL
59
identitas
(kosong)
Nama bank
(kosong)
Jumlah
Transfer
(kosong)
Nomor
Rekening
(kosong)
Tabel III.10
Pengujian input daftar pemilik kos
No Scenario
Pengujian Test Case
Hasil yang
diharapkan
Hasil
pengujian Kesimpulan
1.
Seluruh input
tidak diisi
kemudian klik
daftar
Nama
(kosong)
Password
(kosong)
(kosong)
Alamat
(kosong)
Nomor
Handphone
(kosong)
Sistem akan
menolak
akses
menampilkan
pesan “Field
masih ada
yang kosong
harap diisi”
Sesuai
harapan Valid
2. Seluruh input
diisi sebagian
kemudian klik
daftar
Nama
(angga)
Password
(kosong)
(kosong)
Alamat
(kosong)
Nomor
Handphone
(kosong)
Sistem akan
menolak
akses
menampilkan
pesan “Field
masih ada
yang kosong
harap diisi”
Sesuai
harapan Valid
3. Input email
tidak sesuai atau
Nama
(angga)
Sistem akan
menolak Sesuai Valid
FINAL
60
tidak memakai
@
Password
(1234) Email
(abc) Alamat
(cikampek)
Nomor
Handphone
(12345)
akses
menampilkan
pesan
“mohon di isi
dengan
format yang
benar
menggunakan
@”
harapan
FINAL