3.3. Perancangan Basis Data
Perancangan merupakan penggambaran, perencanaan, dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah ke dalam suatu
kesatuan yang utuh dan berfungsi.
Basis data atau database adalah kumpulan file-file yang mempunyai kaitan antara satu file dengan file yang lain sehingga membentuk satu bangunan data
untuk menginformasikan satu perusahaan, instansi dalam batasan tertentu.
3.3.1. Skema Relasi
Skema relasi merupakan rangkaian hubungan antara dua tabel atau lebih pada sistem database. Berikut ini adalah skema relasi pada sistem informasi
BPAB-DC.
pelanggan
PK id_pelanggan
nama_pelanggan golongan
petugas
PK id_petugas
nama_petugas FK1
username
pembayaran
PK id_pembayaran
FK2 id_petugas
FK1 id_pelanggan
nama_pelanggan golongan
nama_petugas Login
PK username
id_petugas
Gambar 3.10 Skema Relasi
3.3.2. Struktur Tabel
1. Tabel login
Tabel 3.12 Tabel Login
Nama Field Tipe Data
Ukuran Keterangan
username varchar
20 primary key
password varchar
20 not null
hak_akses varchar
7 not null
2. Tabel Pelanggan Tabel 3.13 Tabel Pelanggan
3. Tabel Petugas Tabel 3.14 Tabel Petugas
Nama Field Tipe Data
Ukuran Keterangan
id_pelanggan varchar
3 primary key
nama_pelanggan varchar 30
not null alamat
varchar 30
not null kode_pos
varchar 5
not null no_telepon
varchar 12
not null email
varchar 50
not null golongan
varchar 2
not null ukuran_meter
varchar 3
not null
Nama Field Tipe Data
Ukuran Keterangan
id_petugas varchar
5 primary key
nama_petugas varchar
30 not null
alamat varchar
30 not null
tanggal lahir varchar
10 not null
email varchar
50 not null
4. Tabel Pembayaran Tabel 3.15 Tabel Pembayaran
3.3.3. Perancangan Struktur Menu
Struktur menu adalah bentuk umum dari suatu rancangan program untuk memudahkan pemakai dalam menjalankan program
komputer. Sehingga saat menjalankan program, petugas ataupun user tidak mengalami kesulitan dalam memilih menu-menu yang diinginkan. Pada
perancangan perangkat lunak ini dibuat menu seperti dibawah ini Nama Field
Tipe Data Ukuran
Keterangan id_pembayaran
integer 3
primary key id_pelanggan
varchar 3
foreign key nama_pelanggan
varchar 30
not null alamat
varchar 30
not null golongan
varchar 2
not null ukuran_meter
varchar 3
not null stand_awal
integer 8
not null stand _akhir
integer 8
not null pemakaian
integer 30
not null tarif1
integer 8
not null tarif2
integer 8
not null tarif3
integer 8
not null tarif4
integer 8
not null air_kotor
integer 8
not null bea_beban
integer 8
not null bea_admin
integer 8
not null jumlah_harga_air integer
8 not null
jumlah_tagihan integer
8 not null
golongan2 varchar
30 not null
bp varchar
9 not null
3.3.3.1. Perancangan Struktur Menu Admin
Login Admin
Pengolahan Data
Pelanggan Pengolahan
Data Pembayaran
Pengolahan Data Petugas
Tambah Data Petugas
Hapus Data Petugas
Ubah Data Petugas
Cari Data Petugas
Cetak Laporan Petugas
Tambah Data Pelanggan
Cetak Laporan Pelanggan
Cari Data Pelanggan
Hapus Data Pelanggan
Ubah Data Pelanggan
Tambah Data Pembayaran
Cetak Laporan Data
Pembayaran Cari Data
Pembayaran Hapsu Data
Pembayaran
Gambar 3.11 Perancangan Struktur Menu Admin
3.3.3.2. Perancangan Struktur Menu Petugas
Gambar 3.12 Perancangan Struktur Menu Petugas
3.3.4. Perancangan Antarmuka
Tahap perancangan antar muka dilakukan untuk merancang antar muka agar dapat digunakan oleh pengguna yaitu petugas yang menggunakan aplikasi
ini. Berikut ini adalah tampilan antar muka yang dirancang pada Aplikasi Pengolahan data pembayaran di Badan Pengelola Air Bersih Desa Ciburial
BPAB-DC Bandung :
1. Antarmuka Login Admin
Perancangan Antarmuka Login Admin ini adalah form untuk login admin T01
KETERANGAN
1. Tombol Login untuk menuju ke
form utama T02
2. Tombol Exit untukmembatalkan
Login
LOGIN PETUGAS
Password Username
Tampilkan Password
Exit LOGIN
Gambar 3.13 Antarmuka Login Admin
2. Antarmuka Menu Utama Petugas
Perancangan Antarmuka Menu utama Petugas adalah tampilan utama petugas. Pada perancangan Menu Utama ini terdapat tiga tombol, yaitu tombol data petugas, data
pelanggan, data pembayaran.
T02.1 Keterangan:
1. Klik tombol
File Terdapat menu exit
untuk keluar dari program
2. Klik tombol
user untuk menuju ke
T01
2. Klik Data Petugas
untuk menuju T03
3. Klik Data Pelanggan
untuk menuju T07
4. Kik Data Pembayaran
untuk menuju T11
File User
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
DATA PETUGAS LOGO
DATA PELANGGAN DATA PEMBAYARAN
Gambar 3.14 Antarmuka Menu Utama Petugas
3. Antarmuka Menu Utama Admin
Perancangan Antarmuka Menu utama admin adalah tampilan utama admin ketika sukses login. Pada perancangan Menu Utama ini terdapat tiga tombol,
yaitu tombol data petugas, data pelanggan, data pembayaran.
T02.2 Keterangan:
1. Klik tombol
file terdapat menu Logout
untuk menuju ke
T02.1
2. Klik Data Petugas
untuk menuju T03
3. Klik Data Pelanggan
untuk menuju T07
4. Kik Data Pembayran
untuk menuju T11
File
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
DATA PETUGAS LOGO
DATA PELANGGAN DATA PEMBAYARAN
Gambar 3.15 Antarmuka Menu utama Admin
4. Antarmuka Data Petugas Untuk Petugas
Perancangan Antarmuka Data Petugas adalah tampilan pengolahan data petugas, pada perancangan pengolahan data petugas ini terdapat empat tombol,
yaitu tombol cari, tambah, laporan, keluar.
T03
DATA PETUGAS
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Keterangan : 1. Klik tombol Cari untuk
mencari data Petugas. 2. Klik tombol tambah akan
menuju ke T04 3. Klik tombol laporan akan
menuju ke T06 4. Klik tombol keluar akan
menuju ke T02
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
LOGO
Diurutkan berdasarkan ID Petugas
Nama Petugas Pencarian Data
Cari
Tambah Keluar
Laporan Pengolahan Data Petugas
ID Petugas Email
Tanggal Lahir Alamat
Nama
Gambar 3.16 Antarmuka Data Petugas Untuk Petugas
5. Antarmuka Data Petugas untuk Admin
Perancangan Antarmuka Data Petugas adalah tampilan pengolahan data petugas, pada perancangan pengolahan data petugas ini terdapat enam tombol,
yaitu tombol cari, tambah, ubah, hapus, laporan, keluar.
T03
DATA PETUGAS
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Keterangan : 1. Klik tombol Cari untuk
mencari data Petugas. 2. Klik tombol tambah akan
menuju ke T04 3, Klik tombol Edit akan
menuju ke T05 4. Klik tombol Hapus
menghapus data petugas 5. Klik tombol laporan akan
menuju ke T06 6. Klik tombol Keluar akan
menuju ke T02
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
LOGO
Diurutkan berdasarkan ID Petugas
Nama Petugas Pencarian Data
Cari
Tambah Keluar
Laporan Hapus
Ubah Pengolahan Data Petugas
ID Petugas Email
Tanggal Lahir Alamat
Nama
Gambar 3.17 Antarmuka Data Petugas Untuk Admin
6. Antarmuka Data Pelanggan Untuk Petugas
Perancangan Antarmuka Data Pelanggan adalah tampilan pengolahan data pelanggan, pada perancangan pengolahan data pelanggan untuk petugas ini
terdapat empat tombol, yaitu tombol cari, tambah, laporan, keluar.
T07
DATA PELANGGAN
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Keterangan : 1. Klik tombol Cari untuk
mencari data petugas. 2. Klik tombol Tambah akan
menuju ke T08 3. Klik tombol Laporan akan
menuju ke T10 4. Klik tombo Keluar akan
menuju ke T02 Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
LOGO Diurutkan berdasarkan
ID Pelanggan Nama Pelanggan
Pencarian Data Cari
Tambah Keluar
Laporan Pengolahan Data Pelanggan
ID Pelanggan No Telepon
Kode Pos Alamat
Nama Email
Golongan Ukuran Meter
Gambar 3.18 Antarmuka Data Pelanggan untuk Petugas
7. Antarmuka Data Pelanggan untu Admin
Perancangan Antarmuka Data Pelanggan adalah tampilan pengolahan data pelanggan, pada perancangan pengolahan data pelanggan ini terdapat enam
tombol, yaitu tombol cari, tambah, ubah, hapus, laporan, keluar.
T07
DATA PELANGGAN
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Keterangan : 1. Klik tombol Cari untuk
mencari data petugas. 2. Klik tombol Tambah akan
menuju ke T08 3, Klik tombol Edit akan
menuju ke T09 4. Klik tombol Hapus untuk
menghapus data pelanggan
5. Klik tombol Laporan akan menuju ke T10
6. Klik tombol Close akan menuju ke T02
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198 LOGO
Diurutkan berdasarkan ID Pelanggan
Nama Pelanggan Pencarian Data
Cari
Tambah Keluar
Laporan Hapus
Ubah Pengolahan Data Pelanggan
ID Pelanggan No Telepon
Kode Pos Alamat
Nama Email
Golongan Ukuran Meter
Gambar 3.19 Antarmuka Data Pelanggan Admin
8. Antarmuka Data Pembayaran Untuk Petugas
Perancangan Antarmuka Data Pembayaran adalah tampilan pengolahan data pembayaran, pada perancangan pengolahan data pembayaran ini terdapat
empat tombol, yaitu tombol cari, tambah,laporan dan keluar.
T11
DATA PEMBAYARAN
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Keterangan : 1. Klik tombol Cari untuk
mencari data petugas. 2. Klik tombol Tambah akan
menuju ke T12 3. Klik tombol Laporan akan
menuju ke T14 4. Klik tombol Keluar akan
menuju ke T02 Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
LOGO
Diurutkan berdasarkan ID Pelanggan
Nama Pelanggan Pencarian Data
Cari
Tambah Keluar
Pengolahan Data Pembayaran
ID Pelanggan Ukuran Meter
Golongan Alamat
Nama Stand Awal
Stand Akhir Pemakaian
Laporan
Gambar 3.20 Antarmuka Data Pembayaran untuk Petugas
9. Antarmuka Data Pembayaran Admin
Perancangan Antarmuka Data Pembayaran adalah tampilan pengolahan data pembayaran, pada perancangan pengolahan data pembayaran ini terdapat
lima tombol, yaitu tombol cari, tambah, ubah, hapus, keluar.
T11
DATA PEMBAYARAN
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Keterangan : 1. Klik tombol Cari untuk
mencari data petugas. 2. Klik tombol Tambah akan
menuju ke T12 3, Klik tombol Edit akan
menuju ke T13 4. Klik tombol Hapus untuk
menghapus data pelanggan
5. Klik tombol Laporan akan menuju ke T14
6. Klik tombol Close akan menuju ke T02
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198 LOGO
Diurutkan berdasarkan ID Pelanggan
Nama Pelanggan Pencarian Data
Cari
Tambah Keluar
Hapus Laporan
Pengolahan Data Pembayaran
ID Pelanggan Ukuran Meter
Golongan Alamat
Nama Stand Awal
Stand Akhir Pemakaian
Gambar 3.21 Antarmuka Data Pembayaran untuk Admin
10. Antarmuka Tambah Data Petugas
Perancangan Antarmuka Tambah Data Petugas ini adalah tampilan untuk admin dan petugas ketika akan menambah data petugas baru, pada perancangan
tambah data petugas tiga tombol, yaitu tombol simpan, ulang, batal.
Keterangan 1. Klik tombol simpan
untuk menuju ke T03.
2. Klik tombol Reset untuk mengulang
semua yang di isikan.
3. Klik tombol Batal untuk menuju T03
T04
Form Isi Petugas
Simpan Ulang
Batal
ID Petugas
Alamat Nama
Tanggal Lahir Email
ddmmyyyy
Gambar 3.22 Antarmuka Tambah Data Petugas
11. Antarmuka Ubah Data Petugas
Perancangan Antarmuka Ubah Data Petugas adalah tampilan ketika admin akan mengubah data petugas, pada perancangan ubah data petugas ini terdapat
tiga tombol, yaitu tombol simpan, ulang, batal.
Keterangan 1. Klik tombol simpan
untuk menuju ke T03.
2. Klik tombol Reset untuk mengulang
semua yang di isikan.
3. Klik tombol Batal untuk menuju T03
T05
Form Edit Petugas
Simpan Ulang
Batal
ID Petugas
Alamat Nama
Tanggal Lahir Email
ddmmyyyy
Gambar 3.23 Antarmuka Ubah Data Petugas
12. Antarmuka Laporan Data Petugas
Perancangan Antarmuka Laporan Data Petugas adalah tampilan ketika
admin dan petugas akan cetak laporan data petugas.
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
LOGO
Date: ddmmyyy
T06
Alamat Nama
ID Petugas Tanggal Lahir
Email
Gamabar 3.24 Antarmuka Laporan Data Petugas
13. Antarmuka Tambah Data Pelanggan
Perancangan Antarmuka Tambah Data Pelanggan adalah tampilan ketika admin dan petugas akan menambah data pelanggan baru, pada perancangan
tambah data pelanggan terdapat tiga tombol, yaitu tombol simpan, ulang, batal.
Keterangan 1. Klik tombol simpan
akan menuju ke T07. 2. Klik tombol Reset
untuk mengulang semua yang di
isikan. 3. Klik tombol Batal
akan menuju T07
T08
Form Isi Pelanggan
Simpan Ulang
Batal
ID Pelanggan
Alamat Nama
Kode Pos No Telepon
Email Golongan
Ukuran Meter
Gambar 3.25 Antarmuka Tambah Data Pelanggan
14. Antarmuka Ubah Data Pelanggan
Perancangan Antarmuka Ubah Pelanggan adalah tampilan ketika admin dan petugas akan mengubah data pelanggan baru, pada perancangan ubah data
pelanggan terdapat tiga tombol, yaitu tombol simpan, ulang, batal.
Keterangan 1. Klik tombol simpan
akan menuju ke T07. 2. Klik tombol Reset
untuk mengulang semua yang di
isikan. 3. Klik tombol Batal
akan menuju T07
T08
Form Isi Pelanggan
Simpan Ulang
Batal
ID Pelanggan
Alamat Nama
Kode Pos No Telepon
Email Golongan
Ukuran Meter
Gambar 3.26 Antarmuka Ubah Data Pelanggan
15. Antarmuka Laporan Data Pelanggan
Perancangan Antarmuka Laporan Data Pelanggan adalah tampilan ketika
admin dan petugas akan cetak laporan data pelanggan.
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
LOGO
Date: ddmmyyy
T10
Golongan Alamat
ID Nama
No Telepon
Gambar 3.27 Antarmuka Laporan Data Pelanggan
16. Antarmuka Tambah Data Pembayaran
Perancangan Antarmuka Tambah Data Pembayaran adalah tampilan ketika admin dan petugas akan menambah data pembayaran baru, pada perancangan
tambah data pembayaran terdapat empat tombol, yaitu tombol cari, hitung,
simpan, ulang, batal.
Keterangan : 1. Tombol Cari untuk
mencari data pelanggan
2. Tombol Hitung untuk menghitung
jumlah pembayaran
3. Tombol Simpan untuk menuju ke
T11
4. Tombol Batal untuk menuju ke
T11
Hitung Batal
Simpan
Pemakaian Stand Akhir
Stand Awal Ukuran Meter
Golongan Alamat
Nama ID Pelanggan
T12
Form Isi Pembayaran
Data Input
Cari
Golongan Pemakaian
Tarif Uraian M3
Harga Air 0-10
Petugas
Jumlah Harga air 30
21-30 11-20
Air kotot Bea Beban
Bea Administrasi
Jumlah Tagian
Gambar 3.28 Antarmuka Tambah Data Pembayaran
17. Antarmuka Cetak Rekening
Perancangan Antarmuka Laporan Data Pembayaran adalah tampilan ketika
admin dan petugas akan cetak laporan data pemabayaran.
BADAN PENGELOLA AIR BERSIH DESA CIBURIAL
LOGO
Jl.Ciburial No.98 Telp.022-2504002 Bandung 40198
ID Langganan :
Perhitungan Harga Air Stand Awal
: Golongan
: Alamat
: Nama
:
Stand Akhir :
Pemakaian :
0-10 11-20
21-30 30
Tarif Uraian M3
Harga Air
Jumlah Harga air :
Ukuran :
Pemakaian :
Air Kotor :
Bea Beban :
Bea Admin :
Jumlah Tagihan :
Ciburial ddmmyyyy
Gambar 3.29 Antarmuka Laporan Data Pembayaran
3.3.5. Perancangan Pesan