Post on 05-Oct-2021
RANCANG BANGUN SISTEM INFORMASI PERSURATAN DAN
DISPOSISI BERBASIS WEB PADA BNN PROVINSI JAWA TIMUR
SKRIPSI
Diajukan untuk memenuhi persyaratan
dalam memperoleh gelar Sarjana Komputer
Program Studi Sistem Informasi
Disusun Oleh:
Muhammad Bachrul Ulum
1635010076
PROGRAM STUDI SISTEM INFORMASI
FAKULTAS ILMU KOMPUTER
UNIVERSITAS PEMBANGUNAN NASIONAL “VETERAN” JAWATIMUR
S U R A B A Y A
2020
vi
Judul Skripsi : RANCANG BANGUN SISTEM INFORMASI
PERSURATAN DAN DISPOSISI BERBASIS WEB
PADA BNN PROVINSI JAWA TIMUR
Penulis : Muhammad Bachrul Ulum
Pembimbing I : Eka Dyar Wahyuni, S.Kom, M.Kom
Pembimbing II : Syurfah Ayu Ithriah, S.Kom, M.Kom
ABSTRAK
Badan Narkotika Nasional Provinsi (BNNP) Jawa Timur adalah lembaga
pemerintah non kementrian yang berada di Negara Indonesia dan bertanggung
jawab kepada Presiden melalui koordinasi Kepala Kepolisian Negara Republik
Indonesia. Pada Badan Narkotika Nasional Provinsi Jawa timur sendiri memiliki
banyak bagian-bagian, yang menangani bidang dalam alur Administrasi dan Staff
dan salah satunya adalah Bagian Umum, pada bagian ini terdapat kegiatan
mengenai persuratan yang masih terdapat keluhan atau permasalahan, seperti
Penggunaan kertas untuk lembar disposisi yang terlalu banyak, surat tidak terbaca,
terselip ataupun terpindahkan secara tidak sengaja, pengarsipan data data surat
masuk harian yang secara manual ditulis dengan tangan di buku, penulisan disposisi
tidak efisien semisal jika diperlukan distribusi surat ke 3 bidang maka harus juga
dibuat 3 form disposisi baru dan ditulis tangan, bon nomor surat dan nomor surat
pada surat keluar yang membingungkan staff administrasi umum.
Berdasarkan dari permasalahan tersebut maka dibuatlah Sistem Informasi
Persuratan dan Disposisi menggunakan metode waterfall sebagai metode
pembangunan sistem. Sistem ini dibangun menggunakan bahasa pemrograman
PHP dan menggunakan database MYSQL serta dilakukan testing dengan metode
blackbox.
Dari hasil pembangunan sistem ini, sistem dapat membantu Staff
Administrasi di Bagian Umum serta bidang – bidang lain nya yang berada pada
BNNP Jatim untuk menangani proses persuratan serta disposisi dengan cara
menggunakan sistem ini yang di akses pada perangkat Mobile ataupun Desktop
yang saling terhubung pada jaringan lokal pada wilayah kantor BNNP Jatim.
Kata Kunci: Sistem informasi, persuratan, disposisi, Badan Narkotika Nasional
Provinsi Jawa Timur
vii
KATA PENGANTAR
Puji dan syukur saya panjatkan kehadirat Allah SWT, atas segala nikmat
dan karunia-Nya sehingga penulis dapat menyelesaikan skripsi ini yang berjudul
“RANCANG BANGUN SISTEM INFORMASI PERSURATAN DAN
DISPOSISI BERBASIS WEB PADA BNN PROVINSI JAWA TIMUR”. Skripsi
ini disusun dalam rangka memenuhi persyaratan dalam menyelesaikan Program
Studi S1 / Sistem Informasi di Universitas Pembangunan Nasional “Veteran” Jawa
Timur.
Dalam penyusunan skripsi ini banyak hambatan serta rintangan yang
penulis hadapi namun pada akhirnya dapat melaluinya berkat adanya bimbingan
dan bantuan dari berbgai pihak baik secara moral maupu spiritual. Untuk itu pada
kesempatan ini penulis menyampaikan ucapan terimakasih kepada:
1. Kedua orang tua saya yang telah memberikan dukungan baik moril maupun
materil serta doa yang tiada henti-hentinya kepada saya.
2. Ibu Eka Dyar Wahyuni, S.Kom, M.Kom, selaku dosen pembimbing 1 yang
senantiasa memberikan bimbingan dan arahan dalam penyelesaian skripsi ini.
3. Ibu Syurfah Ayu I, S.Kom, M.Kom, selaku dosen pembimbing 2 yang
senantiasa memberikan bimbingan dan arahan dalam penyelesaian skripsi ini.
4. Seluruh dosen Program Studi Sistem Informasi atas ilmu-ilmu yang di berikan
selama masa perkuliahan.
5. Teman – teman Goolag yang selama ini slelau menemani saya.
6. Teman – teman PKL saya Reja dan Erica yang senang membantu saya dalam
mengerjakan tugas selama kuliah.
Terima kasih kepada semua pihak yang telah membantu penyelesaian skripsi
ini. Semoga Allah membalas dengan balasan sebaik-baiknya. Dalam pengerjaan
skripsi ini saya menyadari bahwa skripsi ini masih ada kekurangan. Untuk itu saya
sangat membutuhkan kritik dan saran yang membangun dalam memperbaiki
penulisan skripsi ini.
Surabaya, 17 Juli 2020
Muhammad Bachrul Ulum
viii
DAFTAR ISI
SKRIPSI .................................................................................................................. ii
LEMBAR PENGESAHAN ................................................................................... iii
KETERANGAN REVISI....................................................................................... iv
SURAT PERNYATAAN........................................................................................ v
ABSTRAK ............................................................................................................. vi
KATA PENGANTAR .......................................................................................... vii
DAFTAR ISI ........................................................................................................ viii
DAFTAR GAMBAR ............................................................................................ xii
DAFTAR TABEL ............................................................................................... xvii
BAB I LATAR BELAKANG ................................................................................. 1
1.1 Latar Belakang ......................................................................................... 1
1.2 Rumusan Masalah .................................................................................... 3
1.3 Batasan Masalah ....................................................................................... 3
1.4 Tujuan ....................................................................................................... 4
1.5 Sistematika Penulisan ............................................................................... 4
BAB II TINJAUAN PUSTAKA ............................................................................. 6
2.1 Profil Lembaga ......................................................................................... 6
2.1.1 Visi dan Misi Lembaga ......................................................................... 6
2.1.2 Struktur Organisasi BNN Provinsi Jawa Timur ................................... 7
ix
2.2 Dasar Teori ............................................................................................... 8
2.2.1 Persuratan.............................................................................................. 8
2.2.2 Disposisi................................................................................................ 9
2.2.3 Sistem Informasi ................................................................................... 9
2.2.4 Data ..................................................................................................... 11
2.2.5 Basis Data ........................................................................................... 12
2.2.6 MySQL ............................................................................................... 13
2.2.7 CDM (Conceptual Data Model) ......................................................... 13
2.2.8 PDM (Physical Data Model)............................................................... 14
2.2.9 DFD (Data Flow Diagram) ................................................................. 15
2.2.10 Bahasa Pemrograman PHP ................................................................. 16
2.2.11 HTML (Hypertext Markup Language) ............................................... 17
2.2.12 Javascript ............................................................................................ 18
2.3 Penelitian Terdahulu ............................................................................... 18
BAB III METODOLOGI PENELITIAN.............................................................. 24
3.1 Metode Pengumpulan Data .................................................................... 24
3.1.1 Observasi dan Wawancara .................................................................. 24
3.1.2 Studi Literatur ..................................................................................... 24
3.2 Metode Perancangan Sistem................................................................... 24
3.2.1 Analisis Sistem Dan Pengumpulan Kebutuhan Sistem(Requirement) 25
3.2.2 Perancangan (design) .......................................................................... 26
3.3 Pembangunan Sistem ............................................................................. 26
3.4 Pengujian Sistem .................................................................................... 26
x
BAB IV HASIL DAN PEMBAHASAN .............................................................. 27
4.1 Hasil Metode Pengumpulan Data ........................................................... 27
4.1.1 Communication ................................................................................... 27
4.1.2 Studi Literatur ..................................................................................... 28
4.2 Hasil Metode Pembangunan Sistem ....................................................... 29
4.2.1 Analisis Sistem Dan Pengumpulan Kebutuhan Sistem(Requirement) 29
4.2.2 Perancangan (design) .......................................................................... 32
4.3 Pembangunan Sistem ............................................................................. 78
4.3.1 Implementasi Perangkat Keras (Hardware) ........................................ 78
4.3.2 Implementasi Perangkat Lunak (Software) ........................................ 79
4.3.3 Implementasi Database ....................................................................... 79
4.3.4 Implementasi Desain Antar Muka (Design Interface) ........................ 84
4.4 Implementasi Pengujian Sistem ........................................................... 111
4.5.1 Pengujian Halaman Login ................................................................ 111
4.5.2 Pengujian Halaman Tambah Surat Masuk........................................ 111
4.5.3 Halaman Tambah Data Disposisi ..................................................... 112
4.5.4 Halaman Tambah Surat Keluar......................................................... 113
4.5.5 Halaman Tambah Klasifikasi Surat .................................................. 113
4.5 Pembahasan .......................................................................................... 114
BAB V PENUTUP .............................................................................................. 115
5.1. Kesimpulan ........................................................................................... 115
5.2. Saran ..................................................................................................... 116
xi
DAFTAR PUSTAKA ......................................................................................... 117
LAMPIRAN ........................................................................................................ 119
xii
DAFTAR GAMBAR
Gambar 2.1 Struktur Organisasi BNN Provinsi Jawa Timur ................................ 7
Gambar 2.2 Contoh gambar PDM ....................................................................... 15
Gambar 3.1 Waterfall Model ............................................................................... 25
Gambar 4.1 Perancangan Document Flow surat masuk dan disposisi ................ 32
Gambar 4.2 Perancangan Document Flow surat keluar dan bon nomor surat .... 33
Gambar 4.3 Perancangan Diagram Konteks Sistem Informasi Persuratan dan
Disposisi (SIPEDIS) ............................................................................................. 35
Gambar 4.4 Perancangan DFD Level 0 Sistem Informasi Persuratan dan Disposisi
(SIPEDIS) ............................................................................................................. 36
Gambar 4.5 DFD Level 1 proses pengelolaan surat masuk ................................ 37
Gambar 4.6 DFD Level 1 proses pengelolaan surat keluar ................................. 38
Gambar 4.7 DFD Level 1 proses generate laporan ............................................. 39
Gambar 4.8 DFD Level 1 proses pengelolaan user ............................................. 39
Gambar 4.9 CDM (Conceptual Data Model) ...................................................... 41
Gambar 4.10 PDM (Physical Data Model) ......................................................... 42
Gambar 4.11 Perancangan halaman utama / login .............................................. 49
Gambar 4.12 Perancangan halaman dashboard admin surat masuk .................... 50
Gambar 4.13 Perancangan halaman Tambah Surat Masuk pada user Admin Surat
Masuk .................................................................................................................... 51
Gambar 4.14 Perancangan Halaman Data Surat Masuk pada user Admin Surat
Masuk .................................................................................................................... 52
Gambar 4.15 Perancangan Halaman Detail Surat Masuk pada user Admin Surat
Masuk .................................................................................................................... 53
xiii
Gambar 4.16 Perancangan Halaman Data Disposisi pada user Admin Surat Masuk
............................................................................................................................... 54
Gambar 4.17 Perancangan Halaman Detail Disposisi pada user Admin Surat
Masuk .................................................................................................................... 55
Gambar 4.18 Perancangan halaman Laporan surat masuk pada user Admin surat
masuk .................................................................................................................... 56
Gambar 4.19 Perancangan halaman dashboard kepala BNNP Jawa Timur ........ 57
Gambar 4.20 Perancangan halaman surat masuk baru pada user kepala BNNP
Jawa Timur ............................................................................................................ 58
Gambar 4.21 Perancangan halaman tambah disposisi pada user kepala BNNP Jawa
Timur ..................................................................................................................... 59
Gambar 4.22 Perancangan halaman data disposisi pada user kepala BNNP Jawa
Timur ..................................................................................................................... 60
Gambar 4.23 Perancangan halaman detail disposisi pada user kepala BNNP Jawa
Timur ..................................................................................................................... 61
Gambar 4.24 Perancangan halaman laporan surat masuk pada user BNNP Jawa
Timur ..................................................................................................................... 62
Gambar 4.25 Perancangan halaman laporan surat keluar pada user kepala BNNP
Jawa Timur ............................................................................................................ 63
Gambar 4.26 Perancangan halaman dashboard kepala bidang ........................... 64
Gambar 4.27 Perancangan halaman data disposisi pada user kepala bidang ...... 65
Gambar 4.28 Perancangan halaman detail disposisi pada user kepala bidang .... 66
Gambar 4.29 Perancangan halaman paraf surat pada user kepala bidang ........... 67
Gambar 4.30 Perancangan halaman dashboard kepala seksi .............................. 68
xiv
Gambar 4.31 Perancangan halaman data disposisi pada user kepala seksi ......... 69
Gambar 4.32 Perancangan halaman detail disposisi pada user kepala seksi ....... 70
Gambar 4.33 Perancangan halaman dashboard admin tiap bidang ..................... 71
Gambar 4.34 Perancangan halaman tambah surat keluar pada user admin tiap
bidang .................................................................................................................... 72
Gambar 4.35 Perancangan halaman tambah bon surat pada user admin tiap bidang
............................................................................................................................... 73
Gambar 4.36 Perancangan halaman data surat keluar pada user admin tiap bidang
............................................................................................................................... 74
Gambar 4.37 Perancangan halaman dashboard pada user admin tiap bidang ..... 75
Gambar 4.38 Perancangan halaman data surat keluar pada user admin sistem .. 76
Gambar 4. 39 Perancangan halaman data user pada user admin sistem ............. 77
Gambar 4.40 Perancangan halaman tambah klasifikasi pada user admin tiap bidang
............................................................................................................................... 78
Gambar 4.41 Query implementasi tabel surat_masuk ......................................... 79
Gambar 4.42 Query implementasi tabel disposis ................................................ 80
Gambar 4.43 Query implementasi tabel penerima_disposisi .............................. 80
Gambar 4.44 Query implementasi tabel isi_disposisi ......................................... 81
Gambar 4.45 Query implementasi tabel surat_keluar ......................................... 81
Gambar 4.46 Query implementasi tabel jenis_naskah_dinas .............................. 82
Gambar 4.47 Query implementasi tabel klasifikasi ............................................ 82
Gambar 4.48 Query implementasi tabel jenis_surat ............................................ 83
Gambar 4.49 Query implementasi tabel klasifikasi_jabatan ............................... 83
Gambar 4.50 Query implementasi tabel user ...................................................... 83
xv
Gambar 4.51 Halaman Login .............................................................................. 84
Gambar 4.52 Halaman Dashboard Admin Surat Masuk ..................................... 85
Gambar 4.53 Halaman Dashboard Admin Surat Masuk diakses dengan Mobile 86
Gambar 4.54 Halaman Tambah Surat Masuk Admin Surat Masuk .................... 87
Gambar 4.55 Halaman Data Surat Masuk Admin Surat Masuk.......................... 87
Gambar 4.56 Halaman Data Surat Masuk Admin Surat Masuk diakses dengan
Mobile ................................................................................................................... 88
Gambar 4.57 Halaman Detail Surat Masuk Admin Surat Masuk ....................... 89
Gambar 4.58 Halaman Data Disposisi Admin Surat Masuk ............................... 90
Gambar 4.59 Halaman Detail Disposisi Admin Surat Masuk ............................. 90
Gambar 4.60 Halaman Laporan Surat Masuk Admin Surat Masuk .................... 91
Gambar 4.61 Halaman Dashboard Kepala BNNP .............................................. 92
Gambar 4.62 Halaman Surat Masuk Baru Kepala BNNP ................................... 93
Gambar 4.63 Halaman Tambah Disposisi Kepala BNNP ................................... 93
Gambar 4.64 Halaman Data Disposisi Kepala BNNP ........................................ 94
Gambar 4.65 Halaman Detail Disposisi Kepala BNNP ...................................... 95
Gambar 4.66 Halaman Laporan Surat Masuk Kepala BNNP ............................. 95
Gambar 4.67 Halaman Laporan Surat Keluar Kepala BNNP ............................. 96
Gambar 4.68 Halaman Dashboard Kepala Bidang .............................................. 97
Gambar 4.69 Halaman Data Disposisi Kepala Bidang........................................ 98
Gambar 4.70 Halaman Detail Disposisi Kepala Bidang ..................................... 99
Gambar 4.71 Halaman Paraf Surat Kepala Bidang ........................................... 100
Gambar 4.72 Halaman Dashboard Kepala Seksi............................................... 101
Gambar 4.73 Halaman Data Disposisi Kepala Seksi ........................................ 102
xvi
Gambar 4.74 Halaman Detail Disposisi Kepala Seksi ...................................... 102
Gambar 4.75 Halaman Paraf Surat Kepala Seksi .............................................. 103
Gambar 4.76 Halaman Dashboard Admin Tiap Bidang.................................... 104
Gambar 4.77 Halaman Tambah Surat Keluar Admin Tiap Bidang .................. 105
Gambar 4.78 Halaman Tambah Bon Surat Admin Tiap Bidang ....................... 106
Gambar 4.79 Halaman List Bon Surat Keluar Admin Tiap Bidang .................. 106
Gambar 4.80 Halaman Lihat Surat Keluar Admin Tiap Bidang ....................... 107
Gambar 4.81 Halaman Dashboard Admin Sistem ............................................ 108
Gambar 4.82 Halaman Data Surat Keluar Admin Sistem ................................. 109
Gambar 4.83 Halaman Data User ...................................................................... 110
Gambar 4.84 Halaman Tambah Klasifikasi Surat ............................................. 110
xvii
DAFTAR TABEL
Tabel 2.1 Struktur Organisasi BNN Provinsi Jawa Timur ..................................... 8
Tabel 2.2 Obyek dalam PDM ............................................................................... 14
Tabel 2.3 Rangkuman penelitian terdahulu .......................................................... 19
Tabel 2.4 Rangkuman penelitian terdahulu .......................................................... 20
Tabel 2.5 Rangkuman penelitian terdahulu .......................................................... 22
Tabel 2.6 Rangkuman penelitian terdahulu .......................................................... 23
Tabel 4.1 Kebutuhan Fungsional Sistem .............................................................. 30
Tabel 4.2 Perancangan tabel surat_masuk............................................................ 43
Tabel 4.3 Perancangan tabel disposisi .................................................................. 44
Tabel 4.4 Perancangan tabel penerima_disposisi ................................................. 44
Tabel 4.5 Perancangan tabel isi_disposisi ............................................................ 45
Tabel 4.6 Perancangan tabel surat_keluar ............................................................ 45
Tabel 4.7 Perancangan tabel jenis_naskah_dinas ................................................. 46
Tabel 4.8 Perancangan tabel klasifikasi ............................................................... 47
Tabel 4.9 Perancangan tabel jenis_surat .............................................................. 47
Tabel 4.10 Perancangan tabel klasifikasi_jabatan ................................................ 48
Tabel 4.11 Perancangan tabel user ....................................................................... 48
Tabel 4.12 Pengujian Halaman Login ................................................................ 111
Tabel 4.13 Pengujian Halaman Tambah Surat Masuk ....................................... 112
Tabel 4.14 Pengujian Halaman Tambah Data Disposisi .................................... 113
Tabel 4.15 Pengujian Halaman Tambah Surat Keluar ....................................... 113
Tabel 4.16 Pengujian Halaman Tambah Klasifikasi Surat ................................. 114