99
dengan sistem, sehingga memudahkan pengguna dalam mengetahui proses input dan output yang terdapat pada sistem.
4.2.5.1. Struktur Menu
Pada tahapan ini akan dijelaskan rancangan mengenai susunan menu yang akan dibuat. Adapun bentuk rancancangannya adalah sebagai
berikut:
HALAMAN UTAMA
Cek Jadwal Register
Register Pemesan
Register Petugas
Login Halaman
Pemesan Halaman Petugas
Transaksi Pemesanan
Penjualan Tiket
Pembuatan Laporan
Reserfasi
Gambar 4.14 Struktur Menu
4.2.5.2. Perancangan Input
Perancangan input merupakan sebuah tahapan perancangan yang mrnggambarkan tampilan masukan dari sistem yang dibangun. Tampilan
ini, nantinya akan menjadi media interaksi antara user dengan sistem. Berikut ini adalah susunan bentuk masukan dari sistem informasi
pelayanan reservasi tiket di PT. Primajasa Perdanarayautama.
100
1 Halaman Registrasi Pemesan
Halaman dibawah ini berisi form registrasi pemesan. Untuk dapat menggunakan layanan reservasi online ini, konsumen harus
melakukan proses registrasi di halaman ini.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
Registrasi Pemesan Registrasi Petugas
Login
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Registasi Pengguna
Username Password
Konfirmasi Password Nama Depan
Nama Belakang Pekerjaan
Alamat Nomor Telepon
Alamat E-mail
Register Clear All
Register Pemesan
Logo
PRIMAJASA
Gambar 4.15 Rancangan Halaman registrasi pemesan
2 Halaman Registrasi Petugas
101
Halaman ini digunakan untuk proses registrasi petugas, agar dapat melayani transaksi pemesanan dan melakukan pembuatan
laporan.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
Registrasi Pemesan Registrasi Petugas
Login
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Registasi Pengguna
NIK Password
Konfirmasi Password Nama Depan
Nama Belakang
Register Clear All
Register Petugas
Logo
PRIMAJASA
Gambar 4.16 Rancangan Halaman registrasi petugas
3 Halaman Login
102
Setelah melakukan proses registrasi, Petugas dan Pemesan dapat melakukan login kedalam sistem melali form pada halaman
ini.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu Login
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Registasi Pengguna
Logo
PRIMAJASA
Informasi Website
Username Password
Login Pemesan
Petugas
Gambar 4.17 Rancangan Halaman login
4 Halaman Reservasi pemilihan Jadwal Keberangkatan
103
Untuk melakukan proses reservasi tiket, Pemesan dapat memilih jadwal keberangkatan pada form di halaman ini
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
· Reserfasi Tiket · Berkas Reserfasi
Profil Pemesan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Layanan Penumpang
Logo
PRIMAJASA Tanggal Berangkat
Jam Berangkat Rute
Next Jadwal Keberangkatan
Silahkan pilih jadwal keberangkatan anda
Gambar 4.18 Rancangan Halaman reservasi jadwal keberangkatan
5 Halaman Pemilihan Nomor dan Jumlah Kursi
104
Setelah memilih jadwal keberangkatan, Pemesan dapat
memilih posisi kursi pada denah yang tersedia di halaman ini.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
· Reserfasi Tiket · Berkas Reserfasi
Profil Pemesan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Layanan Penumpang
Logo
PRIMAJASA
Next DENAH ARMADA
1 2
3 4
5 6
7 8
9 10
11 12
13 14
15 16
17 18
19 20
21 22
23 24
25 26
27 28
29 30
31 32
33 34
35 36
DEPAN
BELAKANG
Gambar 4.19 Rancangan Halaman pemilihan nomor dan jumlah kursi
6 Halaman Input Nama Penumpang
105
Setelah memasukan data kursi, maka pemesan akan diminta untuk memasukan nama penumpang.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
· Reserfasi Tiket · Berkas Reserfasi
Profil Pemesan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Layanan Penumpang
Logo
PRIMAJASA
Next NAMA PENUMPANG
Silahkan masukan nama penumpang
NOMOR TIKET
NOMOR KURSI
NAMA PENUMPANG XXXX
XX XXXX
XX
Gambar 4.20 Rancangan Halaman Input Nama penumpang
7 Halaman Transaksi Pemesanan
106
Halaman ini hanya diperuntukan kepada petugas untuk
melakukan proses transaksi pemesanan.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
Pembuatan Laporan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Transaksi Pemesanan
Logo
PRIMAJASA Nomor Pemesanan
No. Manifest Nama Pemesan
Rp. xxx.xxx Pemesanan
No. Pemesanan
Cari Silahkan masukan nomor pemesanan.
: xxx
: xxx : xxx
Jumlah Tiket : xxx
Harga Satuan : xxx
Harga Total Pemesanan
Verifikasi Pembayaran
Gambar 4.21 Rancangan Halaman transaksi pemesanan
8 Rancangan Halaman Pembuatan Laporan Penjualan Harian
107
Petugas dapat membuat laporan penjualan harian di halaman ini. Laporan nantinya akan berbentuk softcopy dalam format pdf.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
· Penjualan Harian · Penjualan Bulanan
· Daftar Manifest Penumpang
Pembuatan Laporan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Transaksi Pemesanan
Logo
PRIMAJASA Tanggal Penjualan
Laporan Penjualan Harian
Buat Laporan
Rute
Gambar 4.22 Rancangan Halaman pembuatan lap. Penjualan harian
9 Rancangan Halaman Pembuatan Laporan Penjualan Bulanan
108
Pada halaman ini, petugas dapat membuat laporan penjualan bulanan dengan mengisi periode waktu penjualan pada form yang
tersedia.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
· Penjualan Harian · Penjualan Bulanan
· Daftar Manifest Penumpang
Pembuatan Laporan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Transaksi Pemesanan
Logo
PRIMAJASA Periode Tahun
Laporan Penjualan Bulanan
Buat Laporan
Periode Bulan Rute
Gambar 4.23 Rancangan Halaman pembuatan lap. Penjualan bulanan
10 Rancangan Halaman Pembuatan DMP
109
Pada halaman ini, petugas dapat membuat Daftar Manifest Penumpang.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Menu
· Penjualan Harian · Penjualan Bulanan
· Daftar Manifest Penumpang
Pembuatan Laporan
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Transaksi Pemesanan
Logo
PRIMAJASA Tgl. Keberangkatan
Daftar Manifest Penumpang
Buat DMP
Jam Berangkat Rute
Gambar 4.24 Rancangan Halaman pembuatan Daftar Manifest Penumpang
110
11 Rancangan Halaman Pembuatan Laporan Pemesanan Harian
Untuk menghasilkan laporan pemesanan harian, petugas harus melakukan input tanggal pada halaman ini.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Logo
PRIMAJASA
Laporan Pemesanan Harian
Buat Laporan
Periode Tanggal
Menu
· Penjualan Harian · Penjualan Bulanan
· Pemesanan Harian · Pemesanan Bulanan
· Daftar Manifest Penumpang
Pembuatan Laporan Transaksi Pemesanan
Gambar 4.25 Rancangan Halaman Pembuatan Laporan Pemesanan Harian
111
12 Rancangan Halaman Pembuatan Laporan Pemesanan Bulanan
Pada halaman ini, petugas akan diminta untuk memasukan periode bulan yang akan digunakan untuk menghasilkan laporan
pemesanan yang terjadi.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Kamis, 30 Juni 2011
Hallo Guest
Info Primajasa
Berita 1 Berita 2
Berita 3
Info Client IP
Browser Sistem Opersasi
Gambar
Footer
127.0.0.1 Chrome
Windows 7
Logo
PRIMAJASA
Laporan Pemesanan Bulanan
Buat Laporan
Periode Bulan
Menu
· Penjualan Harian · Penjualan Bulanan
· Pemesanan Harian · Pemesanan Bulanan
· Daftar Manifest Penumpang
Pembuatan Laporan Transaksi Pemesanan
Gambar 4.26 Rancangan Halaman Pembuatan Laporan Pemesanan Bulanan
112
13 Rancangan Halaman Login Admin
Halaman ini adalah halaman login yang akan ditemui pertama kali oleh admin, untuk dapat mengakses halaman Utama
Admin.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
Username Password
Login
FOOTER
Gambar
Logo
PRIMAJASA PEMADU MODA
Login Admin
Gambar 4.27 Rancangan Halaman login admin
113
14 Rancangan Halaman Petugas
Pada halaman ini, Admin dapat menambahkan data petugas baru melalui form Petugas.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
FOOTER
· Daftar Tiket
· Daftar Transaksi
· Daftar Manifest
· Daftar Pemesan
DATA PETUGAS
Tambah Data Petugas Daftar Petugas
Verifikasi Petugas
DATA ARMADA BUS
Tambah Data Bus Daftar Bus
DATA RUTE
Tambah Data Rute Daftar Rute
DATA JADWAL
Tambah Data Jadwal Daftar Jadwal
LOGOUT Kamis, 30 Juni 2011
Logo
PRIMAJASA PEMADU MODA
NIK Password
Konfirmasi Password Nama Depan
Nama Belakang
Register Clear All
Petugas
Gambar 4.28 Rancangan Halaman Petugas
114
15 Rancangan Halaman Armada Bus
Pada halaman ini, terdapat form inputan untuk memasukan data armada bus.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
FOOTER
· Daftar Tiket
· Daftar Transaksi
· Daftar Manifest
· Daftar Pemesan
DATA PETUGAS
Tambah Data Petugas Daftar Petugas
Verifikasi Petugas
DATA ARMADA BUS
Tambah Data Bus Daftar Bus
DATA RUTE
Tambah Data Rute Daftar Rute
DATA JADWAL
Tambah Data Jadwal Daftar Jadwal
LOGOUT Kamis, 30 Juni 2011
Logo
PRIMAJASA PEMADU MODA
No. Polisi Kapasitas Penumpang
Register Clear All
Armada Bus
Gambar 4.29 Rancangan Halaman Armada Bus
115
16 Rancangan Halaman Rute
Dalam halaman ini terdapat form inputan untuk memasukan data rute baru yang akan dilayani.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
FOOTER
· Daftar Tiket
· Daftar Transaksi
· Daftar Manifest
· Daftar Pemesan
DATA PETUGAS
Tambah Data Petugas Daftar Petugas
Verifikasi Petugas
DATA ARMADA BUS
Tambah Data Bus Daftar Bus
DATA RUTE
Tambah Data Rute Daftar Rute
DATA JADWAL
Tambah Data Jadwal Daftar Jadwal
LOGOUT Kamis, 30 Juni 2011
Logo
PRIMAJASA PEMADU MODA
Nama Rute Harga Tiket Rp.
Register Clear All
Rute
Gambar 4.30 Rancangan Halaman Rute
116
17 Rancangan Halaman Jadwal
Halaman ini digunakaoleh admin untuk memasukan data jadwal harian baru, yang dapat dipilih oleh Penumpang atau
Petugas.
Logo
PELAYANAN TIKET ANGKUTAN PEMADU MODA
FOOTER
· Daftar Tiket
· Daftar Transaksi
· Daftar Manifest
· Daftar Pemesan
DATA PETUGAS
Tambah Data Petugas Daftar Petugas
Verifikasi Petugas
DATA ARMADA BUS
Tambah Data Bus Daftar Bus
DATA RUTE
Tambah Data Rute Daftar Rute
DATA JADWAL
Tambah Data Jadwal Daftar Jadwal
LOGOUT Kamis, 30 Juni 2011
Logo
PRIMAJASA PEMADU MODA
Jam Berangkat
Register Clear All
Jadwal Berangkat Harian
Kode Bus Rute
Gambar 4.31
Rancangan Halaman Jadwal
4.2.5.3. Perancangan Output