Jbptunikompp Gdl Krisnaegip 19637 9 Babiv
-
Upload
norzam-yahya -
Category
Documents
-
view
215 -
download
0
description
Transcript of Jbptunikompp Gdl Krisnaegip 19637 9 Babiv
69
BAB IV
ANALISIS DAN PERANCANGAN SISTEM
4.1 Analisis Sistem Yang Sedang Berjalan
Analisis prosedur sistem diperlukan untuk memenuhi kebutuhan akan data
suatu sistem yang sedang berjalan disuatu perusahaan. Analisis sistem yang
sedang berjalan berikut ini merupakan prosedur pemesanan dan pembatalan tiket
kereta api yang sedang berjalan di PT. Kereta Api (Persero) Daop 2 Bandung.
4.1.1 Analisis Prosedur Yang Sedang Berjalan
Proses pemesanan tiket kereta api adalah proses dimana pelanggan
melakukan pemesanan terhadap sebuah tempat duduk dalam satu pemberangkatan
kereta api.
Secara konvensional, pelanggan dapat memesan tempat duduk dengan
menghubungi petugas loket atau datang ke tempat reservasi tiket, kemudian
pelanggan mengisi formulir pemesanan tiket yang berisi nama, alamat, tanggal
berangkat, tujuan , kelas gerbong kereta api yang digunakan dan jumlah tiket.
Yang kemudian formulir pemesanan tiket tersebut diberikan kembali kepada
petugas loket yang akan melakukan pengecekan terhadap database jadwal
perjalanan yang mereka sediakan. Jika petugas loket menemukan jadwal yang
70
user petugas loket
pembatalan
pemesanan
<<include>>
cocok dengan keinginan pelanggan, maka pelanggan harus membayar sesuai
dengan tarif kereta api yang dipesan. Jika semua persyaratan ini dipenuhi oleh
pelanggan, petugas loket akan mencatat data-data pelanggan tadi ke dalam
database. Pelanggan akan menerima tanda bukti pemesanan tempat duduk berupa
karcis atau tiket perjalanan. Pada hari keberangkatan, pelanggan cukup dengan
menunjukan tiket ini kepada petugas yang bersangkutan.
Proses yang sering terjadi dalam pemesanan tiket kereta api adalah
pembatalan tiket (batal pembeli & batal tunda) pelanggan mempunyai wewenang
untuk melakukan pembatalan pemesanan tiket kereta ataupun menunda
keberangkatan kereta api, tetapi dengan konsekuensi pelanggan dikenakan
sejumlah denda sesuai dengan aturan yang berlaku.
4.1.1.1 Model Use Case Diagram Yang Sedang Berjalan
Model use case diagram merupakan gambaran aktivitas yang berjalan
dilihat dari kebutuhan. Pada tahapan ini menggambarkan hubungan antara aktor
dengan sistem. Dibawah ini adalah pemodelan diagram use case pemesanan tiket
yang sedang berjalan dimana bisa kita lihat hubungan antara aktor dengan sistem.
Gambar 4.1 Use Case Diagram Yang Sedang Berjalan
71
mulai
mengisi formulir pemesanan tiket
membayar sejumlah uang
menerima bukti pembayaran berupa tiket
selesai
verifikasi formulir pemesanan
mencatat data user dan pemesanan tempat duduk ke database
membuat bukti pembayaran berupa tiket
[tidak]
ya
melakukan pengecekan terhadap jadwal dan tempat duduk yang tersedia
: petugas loketuser
4.1.1.2 Aktivity Diagram Pemesanan Tiket Yang Berjalan
Activity Diagramdi bawah ini menggambarkan proses ataupun tahapan dalam
melakukan proses pemesanan tiket, adapun gambarnya sebagai berikut :
Gambar 4.2 Aktivity Diagram Pemesanan Yang Sedang Berjalan
4.1.1.3 Skenario Aktivity Diagram Pemesanan Tiket Yang Berjalan
Skenario yang terjadi di dalam diagram use case pemesanan tiket yang
sedang berjalan dapat digambarkan didalam sebuah table, antara lain :
72
Tabel 4.1 Skenario Aktivity Diagram Pemesanan Yang Sedang Berjalan
Nama Use Case : Pemesanan
Aktor : User
Worker : Petugas loket
Type : Primary
Tujuan : melakukan pemesanan tiket
ACTOR SISTEM
1.User mengisi formulir pemesanan
tiket
2.Petugas loket memverifikasi formulir
pemesanan tiket untuk jadwal
keberangkatan dan tempat duduk yang
tersedia.
3.Jika sesuai, user membayar
sejumlah uang. Kalau tidak ada
jadwal dan tempat duduk tersedia
user kembali mengisi formulir
pemesanan.
4. Mencatat data user dan pemesanan
tempat duduk ke dalam database
73
mulai
memberikan bukti pembayaran berupa tiket
menerima tiket yang baru atau sejumlah uang
selesai
menerima kembali tiket yang sama
memvalidasi tiket
tidak
mencetak tiket yang baru
uang
teller memberikan pilihan mengganti jadwal atau pengembalian uang
ya
pengembalian uang sesuai dengan ketentuan yang berlaku
mengedit data pemesanan tempat duduk ke database
ubah jadwal
TellerUser
Tabel 4.1 Skenario Aktivity Diagram Pemesanan Yang Sedang Berjalan
(Lanjutan)
5.Mencetak bukti pembayaran berupa
tiket kereta api
6. Menerima bukti pembayaran
berupa tiket
4.1.1.4 Activity Diagram pembatalan yang berjalan
Activity Diagramdi bawah ini menggambarkan proses ataupun tahapan dalam
melakukan proses pembatalan tiket, adapun gambarnya sebagai berikut :
Gambar 4.3 Aktivity Diagram Pembatalan Yang Sedang Berjalan
74
4.1.1.5 Skenario Aktivity Diagram Pembatalan Yang Berjalan
Skenario yang terjadi di dalam use case diagram pembatalan pemesanan
tiket yang sedang berjalan dapat digambarkan didalam sebuah table, antara lain :
Tabel 4.2 Skenario Aktivity Diagram Pembatalan Yang Sedang Berjalan
Nama Use Case : Pembatalan
Aktor : User
Worker : Petugas loket
Type : Secondary
Tujuan : melakukan pembatalan
AKTOR SISTEM
1.User userikan bukti pembayaran
berupa tiket kepada petugas loket
2. Petugas loket menerima bukti
pembayaran berupa tiket dari user yang
kemudian di validasi oleh petugas loket
apakah masih berlaku atau tidak. Jika
tidak petugas loket akan userikan
kembali tiket kepada user
3. menerima kembali tiket yang sama
4. Jika valid maka petugas loket akan
userikan pilihan apakah akan
75
formulir pemesanan dokumen pemesananpetugas loket
Tabel 4.2 Skenario Aktivity Diagram Pembatalan Yang Sedang Berjalan
(Lanjutan)
mengganti jadwal pemberangkatan atau
menerima pengembalian uang.
5. User menerima sejumlah uang atau
tiket yang baru
4.1.2 Use Case Realization
Use Case Realization adalah sebuah proses bisnis yang sebenarnya dari
suatu use case yang berhubungan dengan dokumen atau simpanan data yang
dikelola oleh worker.
4.1.2.1 Use Case Realization Pemesanan
Use case realization di bawah ini menggambarkan bahwa user mengisi
formulir pemesanan kemudian diberikan kepada petugas loket yang kemudian
diproses dan disimpan di dalam database pemesanan tiket.
Gambar 4.4 Use Case Realization Pemesanan
76
tiket dokumen pembatalan
petugas loket
4.1.2.2. Use Case Realization Pembatalan
Use case realization di bawah ini menggambarkan bahwa user userikan
bukti pembayaran berupa tiket kepada petugas loket yang kemudian diproses dan
di simpan di dalam database pembatalan pemesanan tiket ataupun mengubah
jadwal keberangkatan.
Gambar 4.5 Use Case Realization Pembatalan
4.1.3 Evaluasi Sistem Yang Sedang Berjalan
Dari analisis sistem pemesanan tiket yang ada di PT. KA (Persero) telah di
ketahui bahwa antrian yang cukup panjang di loket pemesanan tiket serta
banyaknya calo merupakan beberapa hal yang dapat mengurangi kenyamanan
calon penumpang. Oleh karena itu penulis mengajukan pembuatan sistem
informasi yang bersifat realtime atau online karena dengan tingginya etos kerja
dari kebanyakan orang membuat pemesanan tiket dengan harus datang ke stasiun
yang telah ditentukan menjadikan efisiensi waktu menjadi kurang maksimal.
Kelebihan dari sistem online ini adalah calon penumpang tidak harus melewati
perjalanan yang cukup jauh untuk menuju ke stasiun, dan tidak perlu antri lama.
Dengan adanya tiket pemesananan secara online yang dapat di akses secara
77
langsung dimanapun dan kapanpun. Apalagi pada saat ini dimana efisiensi waktu
merupakan hal yang diingnkan oleh setiap orang.
4.2 Perancangan Sistem
Berdasarkan analisis terhadap objek penelitian yang telah dilakukan, maka
penulis melanjutkan dengan melakukan perancangan sistem. Perancangan sistem
ini merupakan gambaran dari sistem informasi pemesanan tiket yang akan
dibangun di PT. Kereta Api (Persero).
4.2.1 Tujuan Perancangan Sistem
Pada tahapan perancangan sistem ini bertujuan untuk menjelaskan
pembuatan sketsa dari beberapa elemen yang saling terhubung dalam suatu
kesatuan yang utuh dan memiliki fungsi serta manfaat. Perancangan sistem ini
terdiri dari :
1. Desain konseptual atau desain secara umum berupa perancangan sistem
dilihat secara global, dimana tujuannya untuk userikan gambaran secara
umum kepada pengguna tentang sistem yang akan dibangun.
2. Desain terperinci atau desain secara fisik, berupa penggambaran model use
case, activity diagram, sequnce diagram, collaboration diagram, class
diagram, component diagram, depeloyment diagram, perancangan
78
tampilan, perancangan input, perancangan output, dan coding atau
pengkodean.
4.2.2 Gambaran Umum Sistem yang Diusulkan
Setelah melihat hal-hal tersebut diatas maka perangkat lunak yang akan
dibangun yaitu Sistem Informasi Pemesanan Tiket yang merupakan sebuah
aplikasi untuk melakukan pemesanan ataupun pembatalan tiket dan userikan
informasi tentang jadwal pemberangkatan kereta api yang berbasiskan World
Wide Web (WWW). Yang dimana akan meningkatkan efisiensi waktu bagi para
pengguna jasa kereta api karena tidak akan melakukan antrian pada saat
melakukan pemesanan ataupun pembelian tiket serta akan menurunkan kegiatan
para calo yang semakin berkeliaran. Proses pemesanan tiket dapat dilakukan
dimana saja tanpa mengenal ruang dan waktu dengan memanfaatkan koneksi
internet. Perangkat lunak yang berbasis aplikasi web ini akan digunakan oleh tiga
kategori pengguna yaitu administrator, petugas loket, dan user . Ketiga kategori
tadi memiliki hak dan tugas yang berbeda.Hak (otorisasi) dan tugas tersebut
tertulis dalam tabel.
79
Tabel 4.3 Hak dan otorisasi user
Kategori pengguna Tugas Hak
Administrator Mengelola pengguna SI
pemesanan tiket,
mengelola informasi
jadwal.
1. Menambah, mengedit dan
menyimpan pengguna baik user
maupun petugas loket.
2. Menambah, menghapus dan
mengedit jadwal pemberangkatan.
3. Mencari, dan menghapus data
pemesanan.
petugas loket Menerima pembayaran
deposito uang setelah
memverifikasi
pendaftaran
1. Menambah, menghapus dan
mengedit data pendaftaran.
2. Memvalidasi pendaftaran yang
kemudian akan dimasukan ke dalam
database user.
Menerima sejumlah uang sebagai
syarat untuk menjadi user.
User Melakukan pendaftaran,
Melakukan pemesanan
tiket ataupun melihat
jadwal keberangkatan.
1. Melihat jadwal pemberangkatan dan
tarif.
2. Melakukan pendaftaran untuk
menjadi user.
3. Melakukan pemesanan dan
pembatalan tiket.
80
Alur Sistem Informasi pemesanan tiket secara sederhana adalah sebagai
berikut :
1. User dapat melihat jadwal pemberangkatan dan tarif pada Daerah Operasi
(DAOP) 2 Bandung.
2. User dapat menjadi user dengan syarat-syarat sebagai berikut :
a. User dapat melakukan pendaftaran untuk menjadi user secara
online ataupun off line.
b. Setelah melakukan pendaftaran secara online, user diberi waktu
tiga hari untuk datang ke stasiun kereta api terdekat untuk
melakukan deposito uang dengan melampirkan fotocopy KTP.
c. Uang deposito minimal satu juta rupiah.
3. User yang sudah menjadi user dapat melakukan pemesanan tiket secara
online.
a. Pemesanan tiket dapat dilakukan minimal satu hari sebelum
pemberangkatan dan maksimal pemesanan tiket tiga puluh hari
sebelum pemberangkatan.
b. Banyaknya pemesanan di batas sampai empat tempat duduk saja.
4.2.3 Model Use Case Diagram Yang Diusulkan
Use case adalah deskripsi fungsi dari sebuah sistem dari perspektif
pengguna. Use case bekerja denga cara mendeskripsikan tipikal interaksi antara
user (pengguna) sebuah sistem dengan sistemnya sendiri melalui sebuah cerita
bagaimana sistem dipakai. Use case diagram menyajikan interaksi antara use case
81
dengan aktor. Dimana, aktor dapat berupa orang, peralatan, atau sistem lain yang
berinteraksi dengan sistem yang sedang dibangun. Dibawah ini adalah pemodelan
diagram use case sistem informasi pemesanan tiket yang diusulkan.
Gambar 4.6 Use Case Diagram Sistem Informasi Pemesanan Tiket
4.2.4 Activity Diagram
Activity Diagram atau Diagram aktivitas yaitu penggambaran rangkaian
aliran aktivitas, digunakan untuk mendeskripsikan aktivitas yang dibentuk
dalam suatu operasi sehingga dapat juga digunakan untuk aktifitas lainnya
seperti use case atau interaksi.
82
4.2.4.1 Aktivity Diagram Pendaftaran
Aktivity Diagram di bawah ini menggambarkan proses ataupun tahapan
dalam melakukan proses pendaftaran, adapun gambarnya sebagai berikut :
display form pendaftaran
isi form pendaftaran
[incomplete]
validasi field-field form pendaftaran
validasi form pendaftaran
simpan data pendaftaran ke dalam database
[OK]
konfirmasi pendaftaran diterima
selesai
mulai
Gambar 4.7 Activity Diagram Pendaftaran
Nama use case : Activity Diagram Pendaftaran
Actor : user
Type : Primary
Tujuan : Pendaftaran user untuk menjadi user
83
Deskripsi : user membuka form pendaftaran kemudian
melakukan pengisian formulir pendaftaran yang
kemudian akan divalidasi, jika lolos validasi maka
pendaftaran diterima jika tidak user kembali
melakukan pengisian formulir.
4.2.4.2 Activity Diagram Pembayaran
Activity Diagram dibawah ini menggambarkan tentang proses pembayaran
sejumlah uang setelah melakukan pendaftaran, adapun gambarnya seperti berikut :
memberikan fotocopy ktp
membayar sejumlah uang
verifikasi form pendaftaran
cek jumlah uang
mengaktifkan user menjadi member
pembayaran < 1 juta maka pendaftaran ditolak
cek data pendaftaran di database
[ Yes ]
[NO]
[Yes]
[NO]
: teller: user
Gambar 4.8 Activity Diagram Pembayaran
84
Nama Use Case : Pembayaran
Actor : user, petugas loket
Type : Primary
Tujuan :Melakukan pembayaran sejumlah uang
sebagai syarat untuk menjadi user
Deskripsi : user datang ke loket, kemudian petugas
loket meminta kepada user untuk
menyerahkan fotocopy ktp dimana petugas
loket akan membuka data pendaftaran di
database dan mencocokan dengan ktp user,
jika cocok maka user akan membayar
sejumlah uang, jika tidak petugas loket akan
mengedit data pendaftaran disesuaikan
dengan data ktp. Pembayaran dibatas
minimal 1 juta rupiah maka petugas loket
akan mengaktifkan data pendaftara data user
jika pembayaran kurang dari 1 juta maka
pendaftaran akan ditolak.
4.2.4.3 Activity Diagram pemesanan
Activity Diagram dibawah ini menggambarkan tentang proses pemesanan
tiket atau tempat duduk dimana status user sudah berubah menjadi user dan
mempunyai saldo uang, adapun gambarnya seperti berikut :
85
display form login
isi user name dan password
verifikasi user name dan password
[ NO ]
cek user name dan password di database member
pilih menu pesan tiket
[Yes]
memilih asal dan tujuan
display jadwal pemberangkatan
memilih jadwal pemberangkatan
memilih tanggal, kelas kereta dan tempat duduk
validasi saldo
saldo tidak memenuhi
display pemesanan berhasil
[NO]
[Yes]
Gambar 4.9 Aktivity Diagram Pemesanan
Nama Use Case : Pemesanan
Actor : User
Type : Primary
Tujuan : Untuk melakukan proses pemesanan tiket
86
Deskripsi : User melakukan login terlebih dahulu
dengan menginputkan username dan
password yang kemudian akan divalidasi
apakah cocok atau tidak dengan database .
Jika tidak maka user akan kembali
memasukan username dan password. Jika
cocok maka user akan memilih jadwal
pemberangkatan dan memilih tempat duduk,
kemudian akan tampil total bayar dari
penjumlahan jumlah tempat duduk dan
harga tiket, jika saldo memenuhi maka akan
muncul tampilan pemesanan berhasil jika
saldo tidak memenuhi maka proses
pemesanan di batalkan.
4.2.5 Sequence Diagram
Sequance diagram merupakan suatu interaksi objek yang disusun dalam
suatu urutan waktu di sekitar sistem. Sequence diagram terdiri dari dimensi waktu
dan dimensi dari objek-objek yang terkait didalam sistem dimana dua elemen itu
memperlihatkan tahap demi tahap apa yang seharusnya terjadi untuk
menghasilkan sesuatu didalam use case. Berikut ini adalah sequence diagram dari
sistem yang diusulkan :
87
4.2.5.1 Sequence Diagram Pendaftaran
Sequence diagram yang dihasilkan dari pendaftaran yaitu :
: user : user: form
pendaftaran: form
pendaftaran: data
pendaftaran: data
pendaftaran
1: open ()
2: isi form
3: validasi pendaftaran
4: data user
5: simpan ()
6: konfirmasi pendaftaran berhasil
Gambar 4.10 Sequence Diagram Pendaftaran
4.2.5.2 Sequence Diagram Pembayaran
Sequence diagram yang dihasilkan dari pembayaran yaitu :
: user : user : petugas loket : petugas loket
: data_pendaftaran : data_pendaftaran : data_user : data_user
1: memberikan fotocopy ktp
2: cari ()
3: cek pendaftaran
4: data pendaftaran
5: membayar sejumlah uang
6: cek uang
7: approve data pendaftaran dan jumlah saldo
8: simpan ()
9: bukti pembayaran
Gambar 4.11 Sequence Diagram pembayaran
88
: user : user
: login user : login user : data_user : data_user : form pemesanan : form pemesanan : data pemesanan
: data pemesanan
: data_jadwal : data_jadwal
1: open ()
2: isi form
3: data user
4: login berhasil
5: open ()
6: pilih jadwal
9: pilih tanggal
10: pilih kelas
11: pilih tempat duduk
12: display total harga
13: cek saldo
14: data pemesanan
15: simpan ()
7: cari ()
8: data jadwal
16: konfirmasi pemesanan berhasil
4.2.5.3 Sequence Diagram Pemesanan
Sequence diagram yang dihasilkan dari pemesanan yaitu :
Gambar 4.12 Sequene Diagram pemesanan
4.2.6 Collaboration Diagram
Collaboration diagram merupakan tipe diagram yang menekankan pada
hubungan antar objek yang menggambarkan interaksi antar objek pada masing-
89
: user : petugas loket
: data_pendaftaran
: data_user
3: cek pendaftaran
6: cek uang 8: simpan ()
1: memberikan fotocopy ktp5: membayar sejumlah uang
9: bukti pembayaran
2: cari ()4: data pendaftaran
7: approve data pendaftaran dan jumlah saldo
masing peran objek tersebut, dan bukan menekankan pada waktu penyampaian
message seperti sequence diagram.
4.2.6.1 Collaboration Diagram Pendaftaran
Adapun collaboration diagram pendaftaran adalah sebagai berikut :
: user
: form_pendaftaran
: data_pendaftaran
2: isi form
5: simpan ()
1: open ()4: data daftar
6: konfirmasi pendaftaran diterima3: validasi pendaftaran
Gambar 4.13 Collaboration Diagram Pendaftaran
4.2.6.2 Collaboration Diagram Pembayaran
Adapun collaboration diagram pembayaran adalah sebgai berikut :
Gambar 4.14 Collaboration diagram pembayaran
90
: user
: login user
: data_user
: form pemesanan
: data pemesanan
2: isi form
6: pilih jadwal9: pilih tanggal10: pilih kelas
11: pilih tempat duduk
13: cek saldo15: simpan ()
: data_jadwal
1: open ()
5: open ()
3: data user
4: login berhasil
14: data pemesanan
12: display total harga
7: cari ()
8: data jadwal
16: konfirmasi pemesanan berhasil
4.2.6.3 Collaboration Diagram Pemesanan
Adapun Collaboration Diagram Pemesanan adalah sebagai berikut :
Gambar 4.15 Collaboration Diagram Pemesanan
4.2.7 Class Diagram
Class Diagram mendeskripsikan jenis-jenis objek dalam sistem dan
berbagai macam hubungan statis yang terdapat diantara mereka. Class diagram
juga menunjukan properti (atribut) dan operasi sebuah Class dan batasan-batasan
yang terdapat dalam hubungan-hubungan objek tersebut. UML menggunakan
istilah fitur sebagai istilah umum yang meliputi properti-properti dan operasi
sebuah Class.
91
Adapun class diagram dalam sistem informasi pemesanan tiket yang
diusulkan adalah sebagai berikut :
data_pendaftaran
no_daftarnama_lengkaptempat_lahirjenis_kelaminalamatkode_posno_teleponpekerjaanemailuser_namepassword
cari()hapus()edit()approve()
data_user
id_membernama_lengkaptempat_lahirtanggal lahirjenis_kelaminalamatkode_posno_teleponpekerjaanemailuser_namepasswordsaldo
tambah()cari()edit()simpan()hapus()
data_pemesanan
no_pemesanantgl_pemesananid_memberno_keretakelasjumlah_pesanno_tempat_duduktotal_bayar
tambah()hapus()cari()
data_jadwal
no_keretanama_keretajam_berangkatjam_tibakota_asalkota_tujuankls_bisniskls_eksekuti f
tambah()edit()hapus()simpan()
petugas_loket
user_namepasswordnipnama lengkap
tambah()edit()hapus()simpan()
Gambar 4.16 Class Diagram Pemesanan
4.2.8 Component Diagram
Component diagram terdiri dari satu atau beberapa diagram komponen
dan menggambarkan pengorganisasian dan keterkaitan dari semuanya ke dalam
komponen dalam desain fisik dan menampilkan hubungan–hubungan mereka.
92
Adapun component diagram tersebut dapat digambarkan sebagai berikut :
koneksi.php
pendaftaran pemesanan
database Pt. Kereta Api
data pendaftaran
data pemesanan
config
Gambar 4.17 Component Diagram Sistem Informasi Pemesanan Tiket
4.2.9 Deployment Diagram
Deployment/physical diagram menggambarkan detail bagaimana
komponen di-deploy dalam infrastruktur sistem, di mana komponen akan terletak
(pada mesin, server atau piranti keras apa), bagaimana kemampuan jaringan pada
lokasi tersebut, spesifikasi server, dan hal-hal lain yang bersifat fisikal.
Sebuah node adalah server, workstation, atau piranti keras lain yang
digunakan untuk men-deploy komponen dalam lingkungan sebenarnya. Hubungan
antar node dan requirement dapat juga didefinisikan dalam diagram ini. Berikut
93
workstation
HTTP Web Server
config package
Server Pt. KA(Koneksi Apache)
Client
Server Database
Browser
IE, Opera, Modzila
koneksi.php
Mysql Database Server
adalah deployment diagram yang dibutuhkan dalam perancangan sistem website
Sistem:
Gambar 4.18 Deployment Diagram Sistem Informasi Pemesanan Tiket
4.2 Perancangan Antar Muka
Perancangan antar muka yang diajukan untuk membuat aplikasi website
pemesanan tiket di Pt. Kereta (Api Persero) menggambarkan tentang rancangan
arsitektur sistem di dalam sebuah aplikasi yang akan dibuat baik itu dari segi input
maupun output. Dibawah ini adalah perancangan tampilan aplikasi website yang
akan dibuat :
94
4.2.1 Perancangan Input
Sebelum masuk ke perancangan input, berikut ini adalah Perancangan
halaman utama website untuk PT. Kereta Api (Persero).
Gambar 4.19 Perancangan Tampilan Halaman utama
Pada perancangan input menjelaskan gambaran yang akan ada di Website
Pt. Kereta Api (Persero) dimana user dengan kategori user, user dan petugas loket
akan menginputkan data yang selanjutnya akan diproses.
Adapun Perancangan input tersebut, diantaranya sebagai berikut :
HEADER
Icon link
menu
Gambar-
gambar
MENU UTAMA CONTENT
FOOTER
95
1. Pendaftaran User
Di dalam form pendaftaran user terdapat field-field yang harus diisi oleh user,
field-field tersebut berisi tentang informasi si pendaftar.
HEADER
Icon link
menu
Gambar-
gambar
MENU UTAMA
Nama Lengkap :
Tempat lahir :
Tgl Lahir :
Jenis kelamin : Pria Wanita
Alamat :
Kode Pos :
No. Telp :
Pekerjaan :
Email :
User Name :
Password :
FOOTER
Gambar 4.20 Form Pendaftaran User
Tabel 4.4 Tabel Navigasi Form Pendaftaran User
No. Nama Navigasi Keterangan
1 Daftar Untuk mengirim data User
2 Reset Untuk mengosongkan form
Daftar Reset
96
2. Cari Jadwal
Form cari jadwal di sediakan untuk membantu dalam pencarian jadwal
keberangkatan kereta, adapun perancangannya adalah sebagai berikut :
Gambar 4.21 Form Jadwal Kereta
Table 4.5 Tabel navigasi form jadwal kereta
No Nama navigasi Keterangan
1 Cari Untuk mencari data
HEADER
Icon link
menu
Gambar-
gambar
MENU UTAMA
Asal :
Tujuan :
Cari
FOOTER
No. KA Nama Kereta Jam Berangkat Jam tiba
97
3. Login User
Form ini disediakan bagi para user yang sudah berkategori user untuk dapat
masuk ke dalam web Pt. Ka sehingga fasilitasnya pun berbeda dengan user yang
berkategori user.
Gambar 4.22 Form Login User
Tabel 4.6 Tabel Navigasi Login User
No. Nama Navigasi Keterangan
1 Masuk Untuk masuk ke halaman meber
HEADER
Icon link
menu
Gambar-
gambar
MENU UTAMA
LOGINLOGINLOGINLOGIN
User Name :
Password :
FOOTER
MASUK
98
4. Pesan Tiket
User dapat melakukan pemesanan tiket dengan memilih jadwal kereta
terlebih daulu yang kemudian klik pesan di samping pilihan jadwal, maka akan
tampil form di bawah ini.
Gambar 4.23 Form Pesan Tiket
Tabel 4.7 Tabel Navigasi Form Pesan Tiket
No Nama Navigasi Keterangan
1 Proses Untuk memvalidasi saldo dan jumlah tiket
HEADER
MENU
Nama Kereta Api :
Asal :
Tujuan :
Jam Berangkat :
Kelas :
Harga Bisnis :
Harga Eksekutif :
Jumlah Tiket :
FOOTER
proses
99
5. Login Admin
Form ini disediakan untuk user berkategori petugas loket dan administrator
itu sendiri, adapun perancanganya adalah sebagai berikut :
HEADER
LOGINLOGINLOGINLOGIN
User Name :
Password :
FOOTER
Gambar 4.24 Form Login Admin
Tabel 4.8 Tabel Navigasi Login Admin
No. Nama Navigasi Keterangan
1 Login Untuk dapat masuk ke menu berkategori
petugas loket dan admin
LOGIN
100
6. Form Tambah User
Form tambah user adalah salah satu fasilitas yang ada pada menu petugas
loket, adapun perancangannya sebagai berikut :
HEADER
MENU
Nama Lengkap :
Tempat lahir :
Tgl Lahir :
Jenis kelamin : Pria Wanita
Alamat :
Kode Pos :
No. Telp :
Pekerjaan :
User :
Password :
Saldo :
FOOTER
Gambar 4.25 Form Tambah User
Tabel 4.9 Tabel Navigasi Form Tambah User
No. Nama Navigasi Keterangan
1 Simpan Untuk menyimpan data user yang baru
2 Batal Untuk kembali ke menu petugas loket.
Simpan Batal
101
7. Form Edit User
Gambar 4.26 Form Edit User
Tabel 4. 10 Tabel Navigasi Form Edit User
No. Nama Navigasi Keterangan
1 Simpan Untuk mengupdate data user yang baru
2 Batal Untuk kembali ke menu petugas loket.
HEADER
MENU
Nama Lengkap :
Tempat lahir :
Tgl Lahir :
Jenis kelamin : Pria Wanita
Alamat :
Kode Pos :
No. Telp :
Pekerjaan :
User :
Password :
Saldo :
FOOTER
Simpan Batal
102
8. Form Tambah Jadwal
Form Tambah jadwal disediakan bagi administrator, adapun perancangannya
adalah sebagai berikut :
Gambar 4.27 Form Tambah Jadwal
Tabel 4.11 Tabel Navigasi Form Tambah Jadwal
No. Nama Navigasi Keterangan
1. Simpan Untuk menyimpan data ke dalam database jadwal
2. Batal Kembali ke form jadwal dan tariff
HEADER
MENU
No. Kereta :
Id Kereta :
Jama Berangkat :
Jam Tiba : :
Jumlah Kursi :
FOOTER
Simpan Batal
103
9. Form Tambah Harga
Form tambah harga disediakan untuk administrator, adapun perancangannya
adalah sebagai berikut :
HEADER
MENU
Kode Harga :
Kls eksekutif :
Kls Bisnis :
FOOTER
Gambar 4.28 Form tambah harga
Tabel 4.12 Tabel Navigasi Form Tambah Harga
No. Nama Navigasi Keterangan
1. Simpan Untuk proses menyimpan data ke dalam database harga
2. Batal Untuk kembali ke form
Simpan Batal
104
4.3.3 Perancangan Output
Pada perancangan output menjelaskan gambaran yang akan ada di website
Pt. Kereta Api (Persero), adapun perancangannya adalah sebagai berikut :
1. Data User
Pada form ini menampilkan semua data user yang ada di website Pt.
Kereta Api (persero), adapun rancangannya adalah sebagai berikut :
HEADER
MENU
FOOTER
Gambar 4.29 Output Data User
Tambah
No User Name No Tlp email aksi
1 sacrafice 7002837 Ebel_@yaj Detail|hapu
s
2 lombok 9909739 email Detail|hapu
s
105
Tabel 4.13 Tabel Navigasi Output Data User
No. Nama Navigasi Keterangan
1. Tambah Untuk menambah data user
2. Detail Untuk menampilkan profil user
3. Hapus Untuk menghapus data user
2. Ouput Data Jadwal
Pada form ini menampilkan semua data keberangkatan kereta, adapun
perancangannya sebagai berikut :
Gambar 4.30 Form Ouput Data jadwal
HEADER
MENU
FOOTER
Tambah
No Nama Kereta Tujuan Berangkat aksi
1 Argo gede gambir 07.00 Detail|hapu
s
2 Argo wilis surabaya 09.00 Detail|hapu
s
106
Tabel 4.14 Tabel Navigasi Form Output Data Jadwal
No. Nama Navigasi Keterangan
1. Detail Untuk menampilkan data jadwal secara lengkap
2. Hapus Untuk mengahapus jadwal
3. Tambah Untuk menambah data jadwal baru
3. Output Data Tarif
Pada form ini menampilkan semua data tarif berdasarkan kode harga baik
itu berkelas bisnis maupun eksekutif. Adapun gambar perancangannya seperti di
bawah ini :
HEADER
MENU
FOOTER
Gambar 4.31 Form Output Data Tarif
Tambah
Kd harga Tujuan eksekutif bisnis aksi
A01 Gambir 35000 30000 Edit | hapus
B02 Bandung 45000 40000 Edit | hapus
107
Tabel 4.15 Tabel Navigasi Form Output Data Tarif
No. Nama Navigasi Keterangan
1. Edit Untuk mengubah data tariff
2. Hapus Untuk menghapus data tariff
3. Tambah Untuk menambah data tarif yang baru