METODOLOGI PENELITIAN
3.7 Desain Antar Muka Aplikasi
Ada beberapa rancangan dari sistem KRK Monitoring yang akan dijelaskan pada bagian sub bab berikut.
3.6.1 Rancangan Halaman Login
Halaman pertama yang tampil saat admin mengunjungi sistem KRK Monitoring, jika proses login berjalan, maka admin dapat membuka halaman menu utama untuk melakukan pengolahan data sistem KRK Monitoring. Rancangan halaman login dapat dilihat pada Gambar 3.12.
KRK ONLINE.COM HALAMAN ADMIN
Form Login Admin
Input username
Input password Kode chaptca
Input kode chaptca
Login
Gambar 3.12 Rancangan halaman login
3.6.2 Rancangan Halaman Admin (Home)
Rancangan halaman home adalah ketika seorang admin mengakses sistem KRK Monitoring yang akan tampil pertama kali sebelum melakukan login. Rancangan halaman awal dapat dilihat pada Gambar 3.13 untuk Bidang PB, Gambar 3.14 untuk Bidang TR dan Gambar 3.15 untuk Kepala Dinas.
KRK ONLINE.COM Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
Dashboard
Data Regional Kecamatan | Desa
Konten
Data KRK Pemohon | Deskripsi | Berkas Konfirmasi | Kajiaan GTB
Data Informasi Artikel | Informasi | Slider
Pegawai Bangunan Pemerintah
Gambar 3.13 Rancangan Halaman Home (Bidang PB)
KRK ONLINE.COM Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
Dashboard
Data Regional Kecamatan | Desa
Konten
Data KRK Pemohon | Deskripsi | Berkas Konfirmasi | Kajiaan TR
Data Informasi Artikel | Informasi | Slider
Data Jenis Pekerjaan | No. Id | Bangunan | Pekerjaan | Material
Pegawai
Gambar 3.14 Rancangan Halaman Home (Bidang TR)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
Dashboard
Data Regional
Kecamatan | Desa
Konten
Data KRK
Pemohon | Kajiaan GTB
| Kajian TR
Pegawai
Bangunan Pemerintah
Sub Bidang
Sistem Login
Gambar 3.15 Rancangan Halaman Home (Kepala Dinas)
3.6.3 Rancangan Halaman Admin (Data Regional - Kecamatan)
Rancangan halaman ini digunakan saat admin melakukan pengolahan (view, input , ubah dan hapus) data kecamatan. Rancangan halaman data regional kecamatan dapat dilihat pada Gambar 3.16 untuk view data, Gambar 3.17 untuk input data dan Gambar 3.18 untuk ubah data.
KRK ONLINE.COM
Kelola Akun
Notifikasi 1
Notifikasi 2
Foto Akun
DATA KECAMATAN
Tabel Data Kecamatan
Dashboard
pencarian
Data Regional
Nama Kecamatan Data Kecamatan
Kode Pos
Data Data Desa
Data
Gambar 3.16 Rancangan Halaman Data Regional - Kecamatan (View Data)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
DATA KECAMATAN
Tambah Data Kecamatan
Dashboard
Data Regional *Kode Pos Input
*Nama Kecamatan
Input
Data Kecamatan
Data Desa
Batal
Simpan
Gambar 3.17 Rancangan Halaman Data Regional - Kecamatan (Input Data)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
DATA KECAMATAN
Ubah Data Kecamatan
Dashboard
Data Regional *Kode Pos
Input
*Nama Kecamatan
Input
Data Kecamatan
Data Desa
Ubah
Batal
Gambar 3.18 Rancangan Halaman Data Regional - Kecamatan (Ubah Data)
3.6.4 Rancangan Halaman Admin (Data Regional - Desa)
Rancangan halaman admin data regional desa, dibuat untuk digunakan saat admin akan mengoperasikan (view, input, ubah dan hapus) data desa. Rancangan halaman data regional desa teridiri dari tiga halaman, yaitu halaman view data desa, input data desa, dan ubah data desa. Rancangan halaman data regional desa dapat dilihat pada Gambar 3.19 untuk view data, Gambar 3.20 untuk input data dan Gambar 3.21 untuk ubah data.
Gambar 3.19 Rancangan Halaman Data Regional - Desa (View Data)
KRK ONLINE.COM
Gambar 3.20 Rancangan Halaman Data Regional - Desa (Input Data)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto
Akun
DATA DESA
Ubah Data Desa
Dashboard
*Kecamatan
Data Regional
Input
*Kode Desa
Input
Data Kecamatan *Nama Desa
Input
Data Desa
Batal
Ubah
Gambar 3.21 Rancangan Halaman Data Regional - Desa (Ubah Data)
3.6.5 Rancangan Halaman Admin (Data KRK - Pemohon)
Rancangan halaman data KRK dibuat untuk melihat data pendaftaran yang masuk, baik secara keseluruhan maupun detail perorang. Rancangan halaman data KRK dapat dilihat pada Gambar 3.22 untuk view data dan Gambar 3.23 untuk view detail data.
Gambar 3.22 Rancangan Halaman Data KRK - Pemohon (View Data)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto DATA PEMOHON Akun
Data Lengkap Pemohon
Dashboard
Photo KTP/SIM
Data KRK
*No. Reg.
*No. Kontak
Gambar 3.23 Rancangan Halaman Data KRK - Pemohon (View Data Detail)
3.6.6 Rancangan Halaman Admin (Data KRK - Deskripsi)
Rancangan halaman berikut digunakan untuk melihat deskripsi pengajuan. Juga melakukan proses kajian GTB (Gambar Teknis Bangunan) dan proses kajian TR (Tata Ruang), yang dapat dilihat pada Gambar 3.24 untuk view data, Gambar
3.25 untuk view detail data, Gambar 3.26 untuk input data kajian GTB dan Gambar
3.27 untuk untuk input data kajian TR.
Gambar 3.24 Rancangan Halaman Data KRK - Deskripsi (View Data)
Gambar 3.25 Rancangan Halaman Data KRK - Deskripsi (View Detail Data)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
DATA DESKRIPSI
Kajian GTB (Gambar Teknis Bangunan)
Dashboard
Data KRK
*No. Reg.
Data
Pemohon * Detail Pengajuan
Gambar 3.26 Rancangan Halaman Data KRK - Kajian GTB (Input Data)
Gambar 3.27 Rancangan Halaman Data KRK - Kajian TR (Input Data)
3.6.7 Rancangan Halaman Admin (Data KRK - Berkas)
Rancangan halaman ini digunakan untuk melihat berkas-berkas dari pendaftaran, dan dapat dilihat pada Gambar 3.27.
Gambar 3.28 Rancangan Halaman Data KRK - Berkas (View Data)
3.6.8 Rancangan Halaman Admin (Data KRK - Konfirmasi)
Rancangan halaman ini buat untuk melihat dan membuat konfimasi pendaftaran, yang menampilkan proses dan informasi untuk pendaftar, rancangan halaman dapat dilihat pada Gambar 3.29 untuk view data, Gambar 3.30 untuk input data dan Gambar 3.31 untuk ubah data.
Gambar 3.29 Rancangan Halaman Data KRK - Konfirmasi (View Data)
Notifikasi 1
KRK ONLINE.COM
Notifikasi 2 Kelola Akun
Foto Akun
DATA KONFRIMASI
Konfrimasi Pendaftaran
Dashboard
Data KRK
*Kode Kfm
*No. Reg.
Pilihan
*Status
Deskripsi *Keterangan
Input
Berkas
*Tgl. Keluar
Gambar 3.30 Rancangan Halaman Data KRK - Konfirmasi (Input Data)
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto Akun
DATA KONFRIMASI
Dashboard
Ubah Konfrimasi Pendaftaran
Data KRK *Kode Kfm
Data
Pemohon
*No. Reg.
*Tgl. Keluar
Gambar 3.31 Rancangan Halaman Data KRK - Konfirmasi (Ubah Data)
3.6.9 Rancangan Halaman Admin (Data KRK - Kajian GTB dan TR)
Rancangan halaman ini dirancang untuk melihat data permohonan yang sudah dilakukan proses kajian GTB (Gambar Teknis Bangunan) dan TR (Tata Ruang), rancangan halaman dapat dilihat pada Gambar 3.32 untuk view data kajian GTB dan Gambar 3.33 untuk view data kajian TR.
Gambar 3.32 Rancangan Halaman Data KRK - Kajian GTB (View Data)
Kelola Akun Foto
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2
DATA KAJIAN
Akun
Dashboard
Tabel Data Kajian TR (Tata Ruang)
Data KRK
pencarian
No. Reg.
Pemohon
File
Tanggal Keluar
Deskripsi Berkas Konfirmasi Kajian
Gambar 3.33 Rancangan Halaman Data KRK - Kajian TR (View Data)
3.6.10 Rancangan Halaman Admin (Ubah Akun)
Rancangan halaman ini dugunakan ketika admin akan melakukan pengubahan akun berupa username dan password yang digunakan. Rancangan halaman dapat dilihat pada Gambar 3.34.
KRK ONLINE.COM
Notifikasi 1
Notifikasi 2 Kelola Akun
Foto
Akun
SISTEM LOGIN
Ubah Akun Login
Dashboard
Sistem Login Input
Confirm password
Batal
Ubah
Gambar 3.34 Rancangan Halaman Ubah Akun
3.6.11 Rancangan Halaman User (Home)
Rancangan halaman ini dugunakan sebagai halaman pembuka saat user mengunjungi sistem. Rancangan halaman dapat dilihat pada Gambar 3.35.
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB Subid TR Kontak
SLIDER
Konten 2
Konten Home
Konten 3
Footer
Gambar 3.35 Rancangan Halaman Home
3.6.12 Rancangan Halaman User (Informasi)
Rancangan halaman ini dugunakan sebagai halaman yang menyajikan artikel bagi user saat mengunjungi sistem. Rancangan halaman dapat dilihat pada Gambar
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB Subid TR Kontak
SLIDER
Konten Artikel 1
Konten 2
Konten Artikel 2 Konten 3
Konten Artikel 3
Footer
Gambar 3.36 Rancangan Halaman Informasi
3.6.13 Rancangan Halaman User (KK Online)
Rancangan halaman ini dugunakan sebagai halaman yang digunakan user untuk melakukan proses pendaftaran pengajuan IMB. Pada halaman ini terdapat 3 sub menu yang terdiri dari buat pengajuan, konfirmasi pendaftaran, dan informasi pendaftar. Rancangan halaman dapat dilihat pada Gambar 3.37 untuk menu KRK Monitoring , Gambar 3.38 untuk form pendaftaran, Gambar 3.39 untuk form cek konfirmasi dan Gambar 3.40 data pendaftar.
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB Subid TR Kontak
SLIDER
Konten 2
Buat Pengajuan
Cek Konfirmasi Ddaftar
Gambar 3.37 Rancangan Halaman KRK Monitoring
Informasi KRK Online
KRK ONLINE.COM
Home
Bid PB Subid TR Kontak
Pendaftaran 2 Pendaftaran 3
Konten 3
Footer
Gambar 3.38 Rancangan Halaman KRK Monitoring (Form Pendaftaran)
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB Subid TR Kontak
SLIDER
Konten 2
Form Cek Konfirmasi
Konten 3
Footer
Gambar 3.39 Rancangan Halaman KRK Monitoring (Form Cek Konfirmasi)
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB Subid TR Kontak
SLIDER
Konten 2
Form Daftar Pengajuan
Konten 3
Footer
Gambar 3.40 Rancangan Halaman KRK Monitoring (Form Daftar Pengajuan)
3.6.14 Rancangan Halaman User (Bid PB)
Rancangan halaman ini dugunakan sebagai halaman yang menyajikan informasi tentang Bidang Pengendalian Bangunan. Rancangan halaman dapat dilihat pada Gambar 3.41.
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB
Subid TR Kontak
SLIDER
Konten 2
Konten Informasi Bidang P2B
Konten 3
Footer
Gambar 3.41 Rancangan Halaman Bid PB
3.6.15 Rancangan Halaman User (Subid TR)
Rancangan halaman ini dugunakan sebagai halaman yang menyajikan informasi tentang Bidang Tata Ruang. Rancangan halaman dapat dilihat pada Gambar 3.42.
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB
Subid TR
Konten Informasi Bidang TR
Konten 3 Footer
Gambar 3.42 Rancangan Halaman Subid TR (Tata Ruang)
3.6.16 Rancangan Halaman User (Kontak)
Rancangan halaman ini dugunakan sebagai halaman yang menyajikan informasi pegawai Dinas Cipta Karya Kab. Indramayu. Rancangan halaman dapat dilihat pada Gambar 3.43.
KRK ONLINE.COM
Home
Informasi
KRK Online
Bid PB Subid TR
Konten Informasi Data Pegawai
Konten 3 Footer
Gambar 3.43 Rancangan Halaman Kontak
3.6.17 Rancangan Laporan
Rancangan laporan digunakan sebagai kerangka pembuatan laporan, dan bertujuan memenuhi kebutuhan sistem. Adapun laporan yang dibuat adalah laporan data regional, data pegawai, penilaian kajian, dan data pendaftaran. Rancangan laporan dapat dilihat pada Gambar 3.44 untuk data kecamatan, Gambar 3.45 untuk data desa, Gambar 3.46 untuk data pegawai, Gambar 3.47 untuk kajian GTB, 3.48 untuk bukti pendafataran, Gambar 3.49 untuk kajian Gambar TR, 3.50 untuk data pendaftar dan Gambar 3.51 untuk data bangunan pemerintah.
LOGO KOP SURAT
Keterangan
KODE POS
Gambar 3.44 Rancangan Laporan Data Regional (Kecamatan)
LOGO
KOP SURAT
Gambar 3.45 Rancangan Laporan Data Regional (Desa)
LOGO
KOP SURAT
Keterangan
NOMOR ID
Gambar 3.46 Rancangan Laporan Data Pegawai
LOGO
KOP SURAT
Keterangan
URAIAN
LUAS BANGUNAN
Gambar 3.47 Rancangan Laporan Data Kajian Gambar Teknis Bangunan
LOGO
KOP SURAT
Keterangan
DATA PENDAFTAR
KESIMPULAN
Gambar 3.48 Rancangan Laporan Bukti Pendaftaran
LOGO
KOP SURAT
Gambar 3.49 Rancangan Laporan Data Kajian Tata Ruang
KOP SURAT
LOGO
Keterangan
IDENTITAS JENIS BANGUNAN
No. REG
NAMA
TGL. REG
Gambar 3.50 Rancangan Laporan Data Pendaftaran
LOGO
KOP SURAT
Keterangan
NOMOR ID
NAMA
LOKASI
DATA DATA
DATA
Gambar 3.51 Rancangan Laporan Data Bangunan Pemerintah