98
Alternatif Key = jumlah
Struktur tabel :
Tabel 3.10 Tabel
Detail_Order Nama Field
Tipe ukuran
Keterangan Id_order
Int 5
Kode Order Id_produk
Int 5
Kode Mobil Jumlah
Int 5
Jumlah Order Time_booking
Varchar 10
Tanggal Booking Jam_booking
Varchar 10
Jam Booking Lama_sewa
Varchar 2
Lama Sewa Mobil Lama_sewa2
Varchar 7
Jenis Sewa Mobil Jenis_service
Varchar 2
Penggunaan Mobil Supir
Varchar 2
Penggunaan Supir
3.2.2 Perancangan Antar Muka
Perancangan antar muka bertujuan untuk memberikan gambaran tentang aplikasi
yang akan
dibangun sehingga
akan mempermudah
dalam mengimplementasikan aplikasi serta akan memudahkan pembuatan aplikasi yang
user friendly .
Rancangan sistem pemesanan dan pembayaran sewa mobil online berbasis web di Rental Daras yang akan dibuat sebagai berikut :
99
1. Antar muka Pengunjung a. Form Home
BANNER RESERVATION
Image
Support :
P01
Keranjang Belanja Login
Daftar
YM YM
Biling :
Navigasi :
1. Klik tombol home menuju ke form P01
2. Klik tombol list mobil menuju ke form P02
3. Klik tombol sewa sekarang menuju ke form P03
4. Klik tombol hubungi kami ke form P04
5. Klik tombol keranjang belanja menuju ke form P05
6. Klik tombol login menuju ke form P06
7. Klik tombol daftar menuju ke form P07
Home List mobil
Sewa Sekarang Hubungi Kami
Penyewaan : Pilih Mobil :
YM Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Gambar 3.19 Form Home
b. Form List Mobil
BANNER RESERVATION
Image P02
Keranjang Belanja Login
Daftar
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil Image
Image Image
Deskripsi Produk Deskripsi Produk
Deskripsi Produk
Image
1. Klik tombol list mobil menuju ke form P02
2. Klik tombol sewa sekarang menuju ke form P03
3. Klik tombol hubungi kami ke form P04
4. Klik tombol keranjang belanja menuju ke form P05
5. Klik tombol login menuju ke form P06
6. Klik tombol daftar menuju ke form P07
7. Klik tombol home menuju ke form P01
Gambar 3.20 Form List Mobil
100
c. Form Sewa Sekarang
BANNER RESERVATION
Image
Support :
P03
Keranjang Belanja Login
Daftar
YM YM
Biling :
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Penyewaan : Pilih Mobil :
YM Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Image
1. Klik tombol sewa sekarang menuju ke form P03
2. Klik tombol list mobil menuju ke form P02
3. Klik tombol hubungi kami ke form P04
4. Klik tombol keranjang belanja menuju ke form P05
5. Klik tombol login menuju ke form P06
6. Klik tombol daftar menuju ke form P07
7. Klik tombol home menuju ke form P01
Gambar 3.21 Form Sewa Sekarang
d. Form Daftar
BANNER RESERVATION
P05
Keranjang Belanja Login
Daftar
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Data Pribadi
Image
Login Area Password :
Email : Nama Lengkap
Title Identitas
Alamat Pekerjaan
Thn Tanggal Lahir
Tgl Bln
Kota Kode Pos
No Tlp No HP
Captcha Daftar
Kosongkan Form
1. Klik tombol daftar menuju ke form P07
2. Klik tombol list mobil menuju ke form P02
3. Klik tombol sewa sekarang menuju ke form P03
4. Klik tombol hubungi kami ke form P04
5. Klik tombol home menuju ke form P01
Gambar 3.22 Form Daftar
101
e. Form Order Mobil
BANNER RESERVATION
Support :
P06
Keranjang Belanja Login
Daftar
YM YM
Biling :
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Penyewaan : Pilih Mobil :
YM Jenis Nama Produk
Jenis Nama Produk Jenis Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil Form Order Mobil
Pilih Mobil Lama Sewa
Jam Pengambilan Tanggal Sewa
Supir Jenis Service
Tgl Bln
Thn Jam
WIB hari
Minggu Bulan
Image Deskripsi
Produk ya
Tidak Captcha
Kembali Proses
Image
1. Klik pilih mobil pada menu order menuju ke form P08
2. Klik tombol proses menuju ke form P05
3. Klik link belum memiliki akun menuju ke form P07
4. Klik tombol home menuju ke form P01
Gambar 3.23 Form Order Mobil
f. Form Deskripsi Belum Memiliki Akun
BANNER RESERVATION
Image P07
Keranjang Belanja Login
Daftar
Navigasi :
1. Klik tombol home menuju ke form P01
2. Klik tombol list mobil menuju ke form P02
3. Klik tombol sewa sekarang menuju ke form P03
4. Klik tombol cara membayar ke form P04
5. Klik Checkout ke form P07
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Image
Deskripsi pemberitahuan belum memiliki akun pengunjung harus mendaftar terlebih dahulu
Belum memiliki akun Proses sekarang
Gambar 3.24 Form Deskripsi Belum Memiliki Akun
102
2. Antar Muka Member a. Form Home Member
BANNER
RESERVATION
Image
Support :
M01
Keranjang Belanja Login
Daftar
YM YM
Biling :
Navigasi :
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik tombol list mobil menuju ke form M03
4. Klik tombol sewa sekarang ke form M04
5. Klik tombol keranjang belanja menuju ke form M05
Home List mobil
Sewa Sekarang Hubungi Kami
Penyewaan : Pilih Mobil :
YM Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Gambar 3.25 Form Home Member
b. Form Login
BANNER RESERVATION
Image M02
Keranjang Belanja Login
Daftar
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Form Login Password :
Email :
Image
Login Buat Akun
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
Gambar 3.26 Form Login
103
c. Form Setelah Login
BANNER RESERVATION
Image M03
Keranjang Belanja Client Area
Edit Profil
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Image
Data Tagihan
Logout
Client Area Edit Profil
Data Tagihan Logout
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link Setelah login menuju ke form M03
4. Klik tombol list mobil menuju ke form M04
5. Klik tombol sewa sekarang menuju ke form M05
6. Klik tombol keranjang belanja menuju ke form M06
7. Klik tombol client area menuju ke form M07
8. Klik tombol edit profil menuju ke form M08
9. Klik tombol data tagihan menuju ke form M09
10. Klik tombol logout menuju ke form M01
Gambar 3.27 Form Client Area
d. Form List Mobil
BANNER RESERVATION
Image M04
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil Image
Image Image
Deskripsi Produk Deskripsi Produk
Deskripsi Produk
Image
Keranjang Belanja Client Area
Edit Profil Data
Tagihan Logout
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
4. Klik tombol list mobil menuju ke form M04
5. Klik tombol logout menuju ke form M01
Gambar 3.28 Form List Mobil
104
e. Form Sewa Sekarang
BANNER RESERVATION
Image
Support :
M05
YM YM
Biling :
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Penyewaan : Pilih Mobil :
YM Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Image
Keranjang Belanja Client Area
Edit Profil Data
Tagihan Logout
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
4. Klik tombol sewa sekarang menuju ke form M05
5. Klik tombol logout menuju ke form M01
Gambar 3.29 Form Sewa Sekarang
f. Form Keranjang Belanja
BANNER RESERVATION
Image M06
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil hapus
Tipe Mobil
Sub Total Harga
Per Hari Lama Sewa
No Harga Fix
Deskripsi Detail Pemesanan Total Rp
Check Out
Image
Keranjang Belanja Client Area
Edit Profil Data
Tagihan Logout
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
4. Klik tombol keranjang belanja menuju ke form M06
5. Klik tombol logout menuju ke form M01
Gambar 3.30 Form Keranjang Belanja
105
g. Form Client Area
BANNER RESERVATION
Image
Support :
M07
Keranjang Belanja
YM YM
Biling :
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Penyewaan : Pilih Mobil :
YM Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil Client Area
Edit Profil Data
Tagihan Logout
Teks Image
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
4. Klik tombol client area menuju ke form M07
5. Klik tombol logout menuju ke form M01
Gambar 3.31 Form Client Area
h. Form Edit Profil
BANNER RESERVATION
M08 Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil Data Pribadi
Image
Login Area Password :
Email : Nama Lengkap
Title Identitas
Alamat Pekerjaan
Thn Tanggal Lahir
Tgl Bln
Kota Kode Pos
No Tlp No HP
Captcha Update
Keranjang Belanja Client Area
Edit Profil Data
Tagihan Logout
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
4. Klik tombol edit profil menuju ke form M08
5. Klik tombol logout menuju ke form M01
Gambar 3.32 Form Edit Profil
106
i. Form Data Tagihan
BANNER RESERVATION
Image M09
Keranjang Belanja Client Area
Edit Profil
Navigasi :
Home List mobil
Sewa Sekarang Hubungi Kami
Pilih Mobil Nama Produk
Nama Produk Nama Produk
Nama Produk Nama Produk
Home List mobil
Konfirmasi Pembayaran kontak
Sewa mobil
Image
Data Tagihan
Logout
View All Order Active Order Canceled
No Order Waktu
Pemesanan Status
Action
1. Klik tombol home menuju ke form M01
2. Klik tombol login menuju ke form M02
3. Klik link login menuju ke form M03
4. Klik tombol data tagihan menuju ke form M09
5. Klik tombol logout menuju ke form M01
Gambar 3.33 Form Data Tagihan
3. Antar Muka Staff a. Form Login Staff
A01 Navigasi :
Form Login Username
Password
Login
1. Klik login menuju ke form A01
Gambar 3.34 Form Login Staff
107
b. Form Home Staff
A02
HOME EDIT PROFIL
SETTING
Navigasi :
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol edit profil menuju ke form A03
4. Klik tombol setting menuju ke form A04
5. Klik tombol restore menuju ke form A23
6. Klik tombol backup data menuju ke form A24
7. Klik tombol produsen ke form A05
8. Klik tombol pengelolaan mobil menuju ke form A06
9. Klik tombol transaksi menuju ke form A07
10. Klik tombol berita menuju ke form A08
11. Klik tombol daftar member menuju ke form A09
12. Klik tombol laporan menuju ke form A10
13. Klik tombol logout menuju ke form A01
Produsen LOGOUT
Pengelolaan Mobil Daftar Member
Berita Transaksi
Laporan Banner
Teks Teks
Teks Teks
Lihat Lihat
Lihat Lihat
RESTORE DATA
BACKUP DATA
Gambar 3.35 Form Home Staff
c. Form Edit Profil Staff
A03 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Username
Password Email
Nama Lengkap Update
1. Klik tombol login menuju ke form A02
2. Klik tombol edit profil menuju ke form A03
3. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.36 Form Edit Profil Staff
d. Form Setting
A04 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Jenis Diskon
Besaran Diskon Keterangan Diskon
Min mendapatkan Diskon Keterangan Tidak ada Diskon
Harga Supir Mata Uang
Update
1. Klik tombol login menuju ke form A02
2. Klik tombol setting menuju ke form A04
3. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.37 Form Setting
108
e. Form Produsen
A05 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Teks
Teks EditHapus
EditHapus Form TambahEdit
Nama Produsen Submit
1. Klik tombol login menuju ke form A02
2. Klik tombol produsen menuju ke form A05
3. Klik link edit menuju ke form A12
4. Edit atau tambah nama produsen pada form tambah
edit 5. Klik tombol submit menuju
ke form A13 6. Klik link reffresh kembali ke
form A05 7. Klik tombol logout menuju
ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.38 Form Produsen
f. Form Pengelolaan Mobil
A06 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Semua
Tambah No
Nama Mobil Non aktifkan
Hapus Non aktifkan
Non aktifkan Hapus
Hapus Status
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol pengelolaan mobil menuju ke form A06
4. Klik link tambah menuju ke form A16
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.39 Form Pengelolaan Mobil
g. Form Transaksi
A07 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Transaksi Baru
Semua Transaksi Transaksi Cancel Mobil Kembali
No No Order Tanggal
Pemesan Total Bayar
sudah aktifkan
bayar aktifkan
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol transaksi menuju ke form A07
4. Klik tombol transaksi baru menuju ke form A17
5. Klik link semua transaksi menuju ke form A18
6. Klik link transaksi cancel menuju ke form A19
7. Klik link mobil kembali menuju ke form A20
8. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.40 Form Transaksi
109
h. Form Berita
A08 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
List Berita Tambah Berita
Teks Berita Teks Berita
More More
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol berita menuju ke form A08
4. Klik link list berita menuju ke form A21
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.41 Form Berita
i. Form Daftar Member
A09 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
No Nama Lengkap
Email No TlpHP
Pesanan
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol daftar member menuju ke form A09
4. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.42 Form Daftar Member
j. Form Laporan
A10 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Kode Transaksi Total Bayar
Waktu Bayar
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol laporan menuju ke form A10
4. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.43 Form Laporan
110
k. Form Update Profil
A11 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner
Username Password
Email Nama Lengkap
Update
1. Klik tombol login menuju ke form A02
2. Klik tombol edit profil menuju ke form A03
3. Klik tombol update menuju ke form A11
4. Klik tombol logout menuju ke form A01
Data telah diupdate
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.44 Form Update Profil
l. Form Edit Tambah Produsen
A12 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Teks Teks
EditHapus EditHapus
Form TambahEdit Nama Produsen
Submit teks
1. Klik tombol login menuju ke form A02
2. Klik tombol produsen menuju ke form A05
3. Klik link edit menuju ke form A12
4. Edit atau tambah nama produsen pada form tambah
edit 5. Klik tombol submit menuju
ke form A13 6. Klik link reffresh kembali ke
form A05 7. Klik tombol logout menuju
ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.45 Form Edit Tambah Produsen
m. Form Submit Produsen
A13 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Teks
Teks EditHapus
EditHapus Form TambahEdit
Nama Produsen Submit
Sukses diubah Reffresh
1. Klik tombol login menuju ke form A02
2. Klik tombol produsen menuju ke form A05
3. Klik link edit menuju ke form A12
4. Edit atau tambah nama produsen pada form tambah
edit 5. Klik tombol submit menuju
ke form A13 6. Klik link reffresh kembali ke
form A05 7. Klik tombol logout menuju
ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.46 Form Submit Produsen
111
n. Form Hapus Produsen
A14 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Teks
Teks EditHapus
EditHapus Yakin anda ingin menghapusnya ??
Nama Produsen Ya
1. Klik tombol login menuju ke form A02
2. Klik tombol produsen menuju ke form A05
3. Klik link hapus menuju ke form A14
4. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.47 Form Hapus Produsen
o. Form Konfirmasi Hapus Produsen
A15 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Teks
Teks EditHapus
EditHapus Sukses dihapus Reffresh
Yakin anda ingin menghapusnya ?? Nama Produsen
Ya
1. Klik tombol login menuju ke form A02
2. Klik tombol produsen menuju ke form A05
3. Klik link hapus menuju ke form A14
4. Klik tombol ya menuju ke form A15
5. Klik link reffresh kembali ke form A05
6. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.48 Form Konfirmasi Hapus Produsen
p. Form Tambah Pengelolaan Mobil
A16 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi Laporan
Banner Produsen
Produk mobil Fasilitas
Deskripsi Kapasitas orang
Bagasi Transmisi
AC Pintu
Harga Images
Hari Browse
Submit
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol pengelolaan mobil menuju ke form A06
4. Klik link tambah menuju ke form A16
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.49 Form Tambah Pengelolaan Mobil
112
q. Form Transaksi Baru
A17 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Transaksi Baru
Semua Transaksi Transaksi Cancel Mobil Kembali No No Order
Tanggal Pemesan Total Bayar
sudah aktifkan
bayar aktifkan
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol transaksi menuju ke form A07
4. Klik tombol transaksi baru menuju ke form A17
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.50 Form Transaksi Baru
r. Form Semua Transaksi
A18 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Transaksi Baru
Semua Transaksi Transaksi Cancel Mobil Kembali No No Order
Tanggal Pemesan Total Bayar
Sudah bayar batal
hapus
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol transaksi menuju ke form A07
4. Klik link semua transaksi menuju ke form A18
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.51 Form Semua Transaksi
s. Form Transaksi Cancel
A19 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Transaksi Baru
Semua Transaksi Transaksi Cancel Mobil Kembali
No No Order Tanggal
Pemesan Total Bayar
Pemesanan batal Pemesanan batal
Pemesanan batal
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol transaksi menuju ke form A07
4. Klik link transaksi cancel menuju ke form A19
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.52 Form Transaksi Cancel
113
t. Form Mobil Kembali
A20 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
Transaksi Baru
Semua Transaksi Transaksi Cancel Mobil Kembali No No Order
Tanggal Pemesan Total Denda
off Sudah kembali
Sudah kembali
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol transaksi menuju ke form A07
4. Klik link mobil kembali menuju ke form A20
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.53 Form Mobil Kembali
u. Form List Berita
A21 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
List Berita Tambah Berita
Teks Berita Teks Berita
More More
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol berita menuju ke form A08
4. Klik link list berita menuju ke form A21
5. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.54 Form List Berita
v. Form Tambah Berita
A22 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol berita menuju ke form A08
4. Klik link list berita menuju ke form A21
5. Klik link tambah berita menuju ke form A22
6. Klik tombol logout menuju ke form A01
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
List Berita Tambah Berita
Judul Berita Isi Berita
Tambah Berita Submit
Gambar 3.55 Form Tambah Berita
114
w. Form Restore Data
A23 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol restore data menuju ke form A23
4. Klik tombol logout menuju ke form A01
Restore Data MySQL DB Name
Browse Restore
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.56 Form Restore Data
x. Form Backup Data
A24 Navigasi :
Produsen Pengelolaan Mobil
Daftar Member Berita
Transaksi
Laporan Banner
1. Klik tombol login menuju ke form A02
2. Klik tombol home menuju ke form A02
3. Klik tombol backup data menuju ke form A24
4. Klik tombol logout menuju ke form A01
Database berhasil dibackup
download
HOME EDIT PROFIL
SETTING LOGOUT
RESTORE DATA
BACKUP DATA
Gambar 3.57 Form Backup Data
3.2.3
Perancangan Antar Muka Pesan
Rancangan antar muka pesan dari sistem yang dibangun dapat dilihat sebagai berikut :
115
W01 Username tidak boleh kosong
OK W02
Password tidak boleh kosong OK
W03 Nama tidak boleh kosong
OK W04
Email tidak boleh kosong OK
W06
W07 W08
W10 W11
W09 Daftar berhasil, silahkan verifikasi email
Account yang anda masukan salah OK
Username atau password yang anda masukan salah
OK Silahkan anda melakukan
login terlebih dahulu
Apakah anda yakin akan menghapus data tersebut ?
OK Perubahan data berhasil
Maaf data mobil tidak bisa dihapus OK
OK
OK
Cancel OK
W05
Gambar 3.58 Rancangan Antar Muka Pesan
3.2.4 Jaringan Semantik