3.5 Desain Antar Muka
3.5.1 Desain Halaman Home Admin
Desain antar muka untuk halaman awal adalah seperti Gambar 3.17 berikut
Gambar 3.16 Desain Halaman Home
3.5.2 Desain Halaman Login
Desain antar muka untuk halaman login ditampilkan pada Gambar 3.18 berikut
Gambar 3.17 Desain Halaman Login
‐Tanggal ‐
Login
‐Stasiun ‐Asal‐ ‐Stasiun Tujuan‐
‐Jumlah Kursi‐
Update Lihat
Order Home
Cari
Login
‐User Name‐ ‐Password ‐
Login
3.5.3 Desain Halaman Hasil Pencarian
Desain antar muka Hasil Pencarian ditampilkan pada Gambar 3.19 berikut;
Gambar 3.18 Desain Halaman Hasil Pencarian
3.5.4 Desain Halaman Update
Desain antar muka Halaman Update ditampilkan dalam Gambar 3.20 berikut;
Gambar 3.19 Desain Halaman Update
Update Kereta
Logout
Update Stasiun
Update Data User
Update Harga
Home Update
Lihat Order
Nama Kereta
Ubah Hapus
NomorKereta 1
Kereta1 ubah hapus 2
Kereta2 ubah hapus 3
Kereta 3 ubah hapus ‐Tanggal ‐
Logout
‐Stasiun ‐Asal‐ ‐Stasiun Tujuan‐
‐Jumlah Kursi‐
Update Lihat
Order Home
Nomor Nama
Kereta Pesan
1 Kereta1
pesan 2
Kereta1 pesan
Cari
3.5.5 Desain Form Pesan
Desain antar muka untuk Pesan ditunjukan dalam Gambar 3.21 berikut :
Gambar 3.20
Pesan
Kereta1 Stasiun asal‐stasiun tujuan
Tanggal berangkat‐tanggal tiba
Nomor KTP
Pesan Batal
3.5.6 Desain Halaman Home User
Desain antar muka Halaman Update ditampilkan dalam Gambar 3.22 berikut;
Gambar 3.18 Desain Halaman Update
‐Tanggal ‐
Login
‐Stasiun ‐Asal‐ ‐Stasiun Tujuan‐
‐Jumlah Kursi‐
Home
Cari
Pesan
Gambar 3.21 Halaman Home Admin
3.5.7 Desain Halaman Hasil Pencarian User
Desain antar muka Hasil Pencarian ditampilkan pada Gambar 3.23 berikut;
Gambar 3.22 Halaman Hasil Pencarian User
3.5.8 Desain Halaman Pesan User
Desain antar muka halaman pesan user ditampilkan pada Gambar 2.24 berikut :
Gambar 3.23 Halaman Pesan User
Pesan
Kereta1 Stasiun asal‐stasiun tujuan
Tanggal berangkat‐tanggal tiba
Batal
Nomor KTP
‐Tanggal ‐ Pesan
Home
Logout
Nama Kereta
Nomor Pesan
‐Stasiun ‐Asal‐ 1
Kereta1 pesan
‐Stasiun Tujuan‐ 2
Kereta1 pesan
‐Jumlah Kursi‐ Cari
BAB IV IMPLEMENTASI DAN ANALISIS HASIL
4.1 Antar Muka Pengguna Sistem
4.1.1 Halaman Login dan Logout
Berikut adalah tampilan hasil implementasi rancangan untuk proses login, ditunjukan pada Gambar 4.1 berikut ;
Gambar 4.1 Login Dibawah ini adalah potongan listing untuk koneksi ke database ,
disajikan dalam listing 4.1 berikut : Listing 4.1 DatabaseConnection
public class DatabaseConnection {
String url = jdbc:oracle:thin:localhost:1521:XE; String user = skripsi;
String password = skripsi;
ResultSet rs ;
39
Kategori