3.4.2 Perancangan Arsitektur
Perancangan arsitektur merupakan perancangan yang dibuat sebelum program aplikasi dibuat. Dengan perancangan arsitektur akan mempermudah
proses pembangunan Sistem Informasi Pengaduan Publik pemerintah Kota Bandung.
3.4.2.1 Perancangan Struktur Menu
Berikut adalah perancangan struktur menu Sistem Informasi Pengaduan Publik pemerintah Kota Bandung :
a. Struktur Menu Admin pada Sistem Informasi Pengaduan Publik
pemerintah Kota Bandung.
Admin
Login
Data user Data pengaduan
Data perintah Data tanggapan
Data usergroup
Cari Tambah
Update Hapus
Lihat Detail
Gambar III.18 Struktur menu admin
b. Struktur Menu user publik pada Sistem Informasi Pengaduan Publik
pemerintah Kota Bandung.
Publik
Login
Data user Data tanggapan
Data pengaduan
Cari input
Lihat Detail
Update
Gambar III.19 Struktur menu user publik
c. Struktur Menu SKPD pada Sistem Informasi Pengaduan Publik
pemerintah Kota Bandung.
SKPD
Login
Data pengaduan Data perintah
Data tanggapan
Cari Input
Lihat Update
Detail Data user
Gambar III.20 Struktur menu SKPD
d. Struktur Menu Walikota pada Sistem Informasi Pengaduan Publik
pemerintah Kota Bandung.
Gambar III.21 Struktur menu walikota
Walikota
Login
Data pengaduan Data perintah
Input lihat
Data user Data tanggapan
Update
3.4.2.2 Perancangan antarmuka
T01
S02 S01
S03 S05
S04 S07
SO6
S08
Keterangan :
1. S01 : logo instansi 2. S02 : Input username
3. S03 : input password 4. S04 : register
5. S05 : login 6. S06 : tombol home
7. S07 : nama instansi 8. S08 : informasi terbaru
Gambar III.22 Index
T02
S02 S01
S03 S05
S04 Form register user
SO6
S07
Keterangan :
1. S01 : logo instansi 2. S02 : Input username
3. S03 : input password 4. S04 : register
5. S05 : login 6. S06 : tombol home
7. S07 : form register user 8. S08 : tombol simpan
9. S09 : tombol reset
S08 S09
Gambar III.23 Halaman form register user
T03
Login sebagai user publik S01
S02
Selamat datang
S03
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : informasi 4. S04 : home
5. S05 : tombol pengaduan
S04 S05
Gambar III.24 Halaman home user publik
T04
Login sebagai user publik S01
S02 S03
S04 Daftar pengaduan yg ditanggapi-daftar pengaduan yg direalisasikan
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : seleksi skpdkategori pengaduanstatus
6. S06 : search 7. S07 : record pengaduan
yang ditanggapi 8. S08 : tombol tambah
pengaduan
S05 S06
S07 S08
Daftar pengaduan
Gambar III.25 Halaman daftar pengaduan
T05
Login sebagai user publik S01
S02 S03
S04 Tambah pengaduan
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : seleksi skpd 6. S06 : seleksi kategori
7. S07 : form pengaduan 8. S08 : tombol save
9. S09 : tombol reset
S05 S06
S07 S08
S09
Gambar III.26 Halaman untuk input pengaduan
T06
Login sebagai user publik S01
S02 S03
S04 Daftar pengaduan yg ditanggapi-daftar pengaduan yg direalisasikan
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : seleksi skpdkategori pengaduanstatus
6. S06 : search 7. S07 : record pengaduan
yang ditanggapi 8. S08 : tombol tambah
pengaduan
S05 S06
S07 S08
Daftar pengaduan
Gambar III.27 Halaman pengaduan yang ditanggapi
T07
Login sebagai user publik S01
S02 S03
S04 Daftar pengaduan yg ditanggapi-daftar pengaduan yg direalisasikan
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : seleksi skpdkategori pengaduanstatus
6. S06 : search 7. S07 : record pengaduan
yang direalisasi 8. S08 : tombol tambah
pengaduan 9. S09 : detail respon
S05 S06
S07 S08
Daftar pengaduan
Halaman-total record S09
Gambar III.28 Halaman pengaduan yang direalisasikan
T08
Login sebagai admin S01
S02 S03
S04
S08
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : halaman admin
S06 Admnistrator panel
S07 S05
Gambar III.29 Halaman admin
T09
Login sebagai admin S01
S02 S03
S04
S09
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : link daftar user
publik-private 9. S09 : record user publik –
private 10. S10 : add user
11. S11 : add user group
S06 List user manager dan group
S07 S05
S08 S11
S10
Gambar III.30 Halaman pengolahan data user
T10
Login sebagai admin S01
S02 S03
S04
S08
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : form registrasi user
private 9. S09 : tombol save
10. S10 : tombol reset
S06 Form registrasi user private
S07 S05
S10 S09
Gambar III.31 Halaman registrasi user private
T11
Login sebagai admin S01
S02 S03
S04
S08
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : form registrasi user
group 9. S09 : tombol save
10. S10 : tombol reset
S06 Form registrasi user group
S07 S05
S10 S09
Gambar III.32 Halaman registrasi user group
T12
Login sebagai admin S01
S02 S03
S04
S11
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : seleksi skpd
9. S09 : search 10. S10 : add user
11. S11 : record skpd
S06 Skpd manager -
daftarkategori S07
S05 S08
S10 S09
Halaman-total record
Gambar III.33 Halaman admin mengolah data skpd
T13
Login sebagai admin S01
S02 S03
S04
S08
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : form tambah skpd
9. S09 : tombol save 10. S10 : tombol reset
11. S11 : Add skpd
S06 Tambah SKPD
S07 S05
S10 S09
S11
Gambar III.34 Halaman menambah skpd
T14
Login sebagai admin S01
S02 S03
S04
S11
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : seleksi skpdkategori
pengaduanstatus 9. S09 : search
10. S10 : add user 11. S11 : record pengaduan
dan aksi admin 12. S12 : multiple respon
S06 Daftar pengaduan saya-daftar
pengaduan keseluruhan S07
S05 S08
S10 S09
Halaman-total record S12
Gambar III.35 Halaman admin mengolah pengaduan
T15
Login sebagai admin S01
S02 S03
S04
S10
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol users
5. S05 : tombol SKPD 6. S06 : tombol pengaduan
7. S07 : tombol perintah 8. S08 : seleksi skpd
9. S09 : search 10. S10 : daftar perintah dan
aksi admin
S06 List perintah waliota
S07 S05
S08 S09
Halaman-total record
Gambar III.36 Halaman admin melihat perintah walikota
T16
Login sebagai skpd S01
S02 S03
S04
S05
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : halaman SKPD
Selamat datang di halaman skpd
Gambar III.37 Halaman home skpd
T17
Login sebagai skpd S01
S02 S03
S04
S08
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : tombol perintah 6. S06 : seleksi skpdkategori
pengaduanstatus 7. S07 : search
8. S08 : record pengaduan 9. S09 : update – detail – add
respon 10 S10 : multiple respon
Daftar pengaduan S05
S06 S07
S09
S10
Gambar III.38 Halaman pengolahan pengaduan oleh skpd
T18
Login sebagai skpd S01
S02 S03
S04
S08
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol pengaduan
5. S05 : tombol perintah 6. S06 : seleksi skpd
7. S07 : search 8. S08 : record pengaduan
Perintah walikota S05
S06 S07
Halaman-total record
Gambar III.39 Halaman skpd melihat perintah walikota
T19
Login sebagai walikota S01
S02 S03
S04
S05
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : home 4. S04 : tombol perintah
5. S05 : halaman walikota
Selamat datang di halaman walikota
Gambar III.40 Halaman walikota
T20
Login sebagai walikota S01
S02 S03
S06
Keterangan :
1. S01 : logo instansi 2. S02 : logout
3. S03 : add perintah 4. S04 : seleksi skpd
5. S05 : search 6. S06 : record perintah
walikota
List perintah walikota S04
S05
Gambar III.41 Halaman perintah walikota
3.4.2.3 Jaringan Semantik
T01 T09
T05
T06 T04
T19 T16
T08 T03
T02
T07
T12
T14
T15
T20 T17
T18 T10
T11
T13
Gambar III.42 Jaringan Semantik
3.4.3 Perancangan Prosedural
Perancangan prosedural merupakan perancangan yang dilakukan untuk menetapkan detail algoritma yang akan dinyatakan kedalam suatu sistem. Adapun
perancangan prosedural untuk sistem informasi berbasis web yang akan dibangun adalah :
a. Proses Login
Mulai
Username dan Password
Username dan Password
Valid Login Valid
Masuk Form Menu
Selesai Tampilkan
Pesan Invalid
Gambar 3.43 Proses login
b. Proses Registrasi
Kategori