BAB IV ANALISIS DAN PERANCANGAN 4.1 Analisis Kebutuhan Sistem Analisis sistem ini merupakan penguraian dari sistem yang utuh, kedalam bagian-bagian komponennya dengan maksud mengidentifikasi dan mengevaluasi permasalahan, kesempatan, hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikannya. 4.1. 1 Analisis sistem yang sedang berjalan Gambar Flowmap sistem yang sedang berjalan dapat dilihat di gambar 4.1 Flowmap Proses Pengolahan Data Laporan Hasil Kerja Sebelum Menggunakan Aplikasi Sektor Verifikator Atasan Start Buat Laporan Kirim Email Menerima Email Verifikasi Update Tidak Layak Ya Laporan Diterima End Phase Gambar 4.1 Flowmap Sistem yang sedang berjalan 34
35 4.1. 2 Identifikasi kebutuhan data 1. Data sektor 2. Data verifikator 3. Data laporan hasil kerja 4. Data laporan tambahan (Tabulasi LH, Pencapaian Kinerja, Bobot Kinerja, Cover, Neraca Limbah, Bukti Penyampaian Laporan, Kesimpulan) 5. Data alur waktu input, update dan verifikasi laporan 4.1. 3 Identifikasi kebutuhan pengguna 1. Input laporan hasil kerja & laporan tambahan 2. Update laporan hasil kerja & laporan tambahan 3. Verifikasi laporan 4. Mengatur data data sektor dan verifikator 5. Tampilan laporan hasil kerja serta waktu pengumpulan hingga selesai proses verifikasi. 6. Sektor memiliki rentan waktu untuk menginputkan/memperbaiki/menghapus data yaitu selama 3 bulan yang dimulai dari 12 Januari 7. Setelah 3 bulan terlewati data yang diinputkan masuk ke data baru 4.1. 4 Identifikasi kebutuhan hardware dan software minimal 1. Aplikasi Browser (Google Chrome, Mozilla Firefox, Safari) 2. XAMPP 3. Notepad++
36 4. Koneksi Internet 5. Server beserta domain 6. Komputer dengan spesifikasi a. RAM 4GB b. Processor Core i5 4.2 Perancangan sistem yang diusulkan 4.2. 1 Flowmap Gambar Flowmap sistem yang dapat dilihat di gambar 4.2 Flowmap Proses Pengolahan Data Laporan Hasil Kerja yang diusulkan Admin Sektor Verifikator Atasan Start Start Manage Login data Input Laporan Update Database Simpan Data Dalam Database Membuka Data Laporan End Verifikasi Upadte Database Verifikasi Update Tidak Layak Ya Laporan Ditampilkan beserta waktunya End Phase Gambar 4.2 Flowmap Sistem yang diusulkan
37 4.2. 2 Flowchart 4.2.2.1 Sektor 1) Prosedur Input Data Laporan Hasil Kerja 1. Deskripsi dari prosedur input data laporan hasil kerja : a. Sektor memasuki halaman utama Sector Area setelah melakukan proses log in b. Sektor memilih Form (1/2/3) yang akan diinputkan. c. Sektor mengisi form. d. Sektor mengklik tombol Submit. e. Sistem mengecek kelengkapan form lalu menyimpannya ke database. 2. Gambar flowchart alur input data laporan hasil kerja Gambar Flowchart input laporan hasil kerja dapat dilihat di gambar 4.3 Start Pilih Form Inputkan Data Simpan Data ke DataBase Error Report Sukses Tidak Ya End Gambar 4.3 Flowchart Input Data laporan hasil kerja.
38 2) Prosedur Update Data Laporan Hasil Kerja 1. Deskripsi dari prosedur Update data laporan hasil kerja: a. Sektor memasuki halaman utama Sector Area setelah melakukan proses login b. Sektor memilih Form(1/2/3) yang akan diupdate. c. Sektor mengklik menu Submit. d. Sistem mengecek kelengkapan form lalu database diupdate. 2. Gambar flowchart alur Update Data laporan hasil kerja Gambar Flowchart update laporan hasil kerja dapat dilihat di gambar 4.4 Start Pilih Form Update Data Update Data dari DataBase Error Report Sukses Tidak Ya End Gambar 4.4 Flowchart Update Data laporan hasil kerja
39 3) Prosedur Input Data Laporan Tambahan 1. Deskripsi dari Prosedur input data laporan tambahan a. Sektor memasuki halaman utama Sector Area setelah melakukan proses login b. Sektor memilih model data yang akan diupload lalu mengklik Upload c. Sektor memilih file yang akan diupload d. File diupload e. Sistem mengecek upload berhasil atau tidak f. Sistem memasukan data file ke dalam DataBase 2. Gambar flowchart alur input data laporan tambahan Gambar Flowchart input laporan tambahan dapat dilihat di gambar 4.5 Start Pilih Model Data Pilih File Upload Error Report Sukses Tidak Ya Data upload disimpan di DataBase Sukses Tidak Hapus File Ya End Gambar 4.5 Flowchart input data laporan tambahan
40 4) Prosedur Delete Data Laporan Tambahan 1. Deskripsi dari Prosedur Delete data laporan tambahan a. Sektor memasuki halaman utama Sector Area setelah melakukan proses log in b. Sektor memilih data yang akan di hapus lalu mengklik delete c. Data di cek keberadaannya dan dihapus beserta file yang terdata di dalamnya 2. Gambar flowchart alur Delete data laporan tambahan Gambar Flowchart delete laporan tambahan dapat dilihat di gambar 4.6 Start Pilih Data Delete Error Report Sukses Tidak Ya End Gambar 4.6 Flowchart Delete data laporan tambahan
41 4.2.2.2 Verifikator 1) Prosedur View status Data 1. Deskripsi dari prosedur View status Data: a. Verifikator memasuki halaman utama Verificator Area setelah melakukan proses login b. Verifikator memilih tipe tampilan data yang ingin dilihat. 1) Tampilan 1 menampilkan status suatu sektor tanpa keterangan. 2) Tampilan 2 menampilkan semua sector tanpa keterangan. 2. Gambar flowchart alur View Status data Gambar Flowchart view status data dapat dilihat di gambar 4.7 Start Detail Pilih bentuk tampilan Detail Pelaporan Tampilan 1 (Dengan Keterangan) Tampilan 2 (Tanpa Keterangan) End Gambar 4.7 Flowchart View Status Data.
42 2) Prosedur Verifikasi Data 1. Deskripsi dari prosedur verifikasi data adalah : a. Verifikator memasuki halaman utama Verificator Area setelah melakukan proses login b. Verifikator melihat status data. c. Verifikator memilih data yang ingin diverifikasi d. Verifikator mengecek kebenaran data. e. Data di verifikasi sesuai dengan keadaan data tersebut. f. Klik tombol submit g. Database verifikasi data tersebut diupdate. 2. Gambar flowchart alur Verifikasi Data Gambar Flowchart verifikasi data dapat dilihat di gambar 4.8 Start View Status Pilih Data Verivikasi Data Update data yang di Verifikasi di database Error Report Sukses Tidak Ya End Gambar 4.8 Flowchart Verifikasi Data
43 3) Prosedur Download data 1. Deskripsi dari prosedur Download data adalah : a. Verifikator memasuki halaman utama Verificator Area setelah melakukan proses login b. Verifikator melihat status data. c. Verifikator memilih data yang ingin didownload d. Klik download 2. Gambar flowchart alur Download Data Gambar Flowchart download data dapat dilihat di gambar 4.9 Start View Status Pilih Data Download Download data dari server Error Report Sukses Tidak Ya End Gambar 4.9 Flowchart Download Data
44 4.2.2.3 Admin 1) Prosedur Tambah Users 1. Deskripsi dari Prosedur tambah users a. Admin memasuki halaman utama Admin Area setelah melakukan proses login dan memilih jabatan sebagai admin b. Admin mengklik tombol tambah data c. Admin menginputkan data lalu menekan tombol submit d. Sistem memasukan data ke dalam database. 2. Gambar flowchart alur Tambah Users Gambar Flowchart tambah users dapat dilihat di gambar 4.10 Start Input Data Tambahkan data dalam database Error Report Sukses Tidak Ya End Gambar 4.10 Flowchart Tambah User
45 2) Prosedur Edit User 1. Deskripsi dari Prosedur Edit User a. Admin memasuki halaman utama admin Area setelah melakukan proses login dan memilih jabatan sebagai admin b. Admin memilih data user yang akan diedit lalu menekan tombol edit c. Admin menginputkan data user yang baru lalu menekan tombol submit d. Data users di update dari DataBase 2. Gambar flowchart alur Edit User Gambar Flowchart edit users dapat dilihat di gambar 4.11 Start Pilih Users Edit Data Edit data users dalam database Error Report Sukses Tidak Ya End Gambar 4.11 Flowchart Edit User
46 3) Prosedur Delete data user 1. Deskripsi dari Prosedur Delete Data User a. Admin memasuki halaman utama Admin Area setelah melakukan proses login dan memilih jabatan sebagai admin b. Admin memilih data user yang akan di hapus lalu menekan tombol hapus c. Data users di hapus dari DataBase 2. Gambar flowchart alur Delete Data User Gambar Flowchart delete users dapat dilihat di gambar 4.12 Start Pilih Users Delete Data Delete data dari database Error Report Sukses Tidak Ya End Gambar 4.12 Flowchart Delete Data User
47 4) Prosedur Clear Blocked IP 1. Deskripsi dari Prosedur Clear Blocked IP a. Admin memasuki halaman utama Admin Area setelah melakukan proses login lalu memilih jabatan sebagai admin b. Pilih tombol Clear Blocked Security c. IP yang terblock akan di hapus oleh sistem dari database 2. Gambar flowchart alur Clear Block IP Gambar Flowchart clear block ip dapat dilihat di gambar 4.13 Start Clear Block IP Menghapus data IP yang di blockir Error Report Sukses Tidak Ya End Gambar 4.13 Flowchart Clear Blocked IP
48 4.2.3 Diagram Konteks Gambar konteks diagram aplikasi monitoring hasil kerja dapat dilihat di gambar 4.14 Gambar 4.14 Konteks Diagram
49 Keterangan : Dari konteks diagram di atas didapatkan beberapa entitas : a. Admin Admin atau administrator mempunyai tugas umum yaitu mengatur semua jalannya aplikasi ini baik itu input data, dan edit data. Sebelum admin menjalankan tugasnya maka admin harus login dahulu ke dalam sistem. b. Sektor Sektor adalah pengguna aplikasi yang bertugas untuk mengupload data laporan untuk diverifikasi dan siap untuk dilaporkan nantinya. c. Verifikator Verifikator adalah pengguna aplikasi yang bertugas memverifikasi laporan yang masuk. Untuk di cek kelengkapannya d. Atasan Pemilik perusahaan adalah pengguna yang bertugas melihat data hasil laporan 4.2.4 Data Flow Diagram (DFD) Data Flow Diagram (DFD) merupakan alat yang digunakan untuk menggambarkan suatu sistem yang telah ada atau sistem baru yang akan dikembangkan secara logika tanpa mempertimbangkan lingkungan fisik dimana data tersebut mengalir ataupun lingkungan fisik dimana data tersebut akan disimpan (Jogiyanto, HM, 2005 :700).
50 4.2.4.1 DFD Level 0 4.15 Gambar DFD Level 0 aplikasi monitoring hasil kerja dapat di lihat di gambar Gambar 4.15 DFD Level 0
51 4.2.4.2 DFD Level 1 1. Manage Users Gambar DFD Level 1 Manage Users aplikasi monitoring hasil kerja dapat di lihat di gambar 4.16 Gambar 4.16 DFD Level 1 Manage Users
52 2. Validasi Login Gambar DFD Level 1 Validasi Login aplikasi monitoring hasil kerja dapat di lihat di gambar 4.17 Gambar 4.17 DFD Level 1 Validasi Login
53 3. Pengolahan Laporan Gambar DFD Level 1 Pengolahan laporan aplikasi monitoring hasil kerja dapat di lihat di gambar 4.18 Gambar 4.18 DFD Level 1 Pengolahan Laporan
54 4.2.4.3 DFD Level 2 1. Manage Laporan Sektor Gambar DFD Level 2 manage laporan sektor aplikasi monitoring hasil kerja dapat di lihat di gambar 4.19 Gambar 4.19 DFD Level 2 Manage Laporan Sektor
55 2. Verifikasi Gambar DFD Level 2 verikasi aplikasi monitoring hasil kerja dapat di lihat di gambar 4.20 Gambar 4.20 DFD Level 2 verifikasi 4.2.5 Entity Relationship Diagram (ERD) Setelah merancang DFD, akan dilanjutkan dengan perancangan E-RD (Entitas Relationship Diagram). ERD merupakan metode untuk merancang database secara sistematis yang berisi komponen-komponen. Himpunan entitas dan himpunan relasi yang masing-masing dilengkapi dengan atribut. gambar 4.21 Gambar ERD Aplikasi monitoring laporan hasil kerja dapat dilihat pada
56 Informasi Laporan Status Laporan Isi Laporan Waktu Pengumpulan Id Users Password Id Laporan Username Laporan M 1 Memverifikasi Verifikator Id Users 1 Nama Waktu Verifikasi Alamat Status Mengisi Id Users Password 1 Username Sektor Nama Alamat Status Gambar 4.21 ERD Aplikasi Monitoring Laporan Hasil Kerja 4.2.6 Skema Relasi Relasi antar file/database merupakan hubungan yang terjadi antara satu file dengan file yang lain, yang dihubungkan dengan suatu kata kunci (key). Hubungan antar file dari Sistem Sirkulasi perpustakaan dapat dilihat pada gambar berikut : Laporan Id_laporan id_users status_laporan waktu_verifikasi waktu_pengumpulan Informasi_laporan Users id_users username password nama status alamat Gambar 4.22 Skema Relasi
57 4.2.7 Struktur Tabel 1. Tabel Users Table ini digunakan untuk menyimpan data users pengguna aplikasi ini yang membutuhkan login seperti admin, sektor dan verifikator. Strukturnya dapat dilihat pada tabel 4.1 berikut: Tabel 4.1 Struktur Tabel Users No. Nama Field Tipe Data Panjang Ket 1. id_users Int 11 PK 2. nama Varchar 150 3. username Varchar 30 4. password Varchar 100 5. status Admin, Verifikator, enum Sektor 6. alamat Varchar 200 2. Tabel Laporan Table ini digunakan untuk menyimpan data-data laporan yang masuk. Strukturnya dapat dilihat pada tabel 4.2 berikut: Tabel 4.2 Struktur Tabel Laporan No. Nama Field Tipe Data Panjang Ket 1. id_laporan Int 11 PK 2. id_users Int 11 FK 3. isi_laporan Text 1000 4. informasi_laporan Varchar 200 5. status_laporan enum Belum, Lulus, Tidak Lulus 6. waktu_pengumpulan Date DD/MM/YYYY 7. waktu_verifikasi Datae DD/MM/YYYY 4.2.8 Perancangan Interface Perancangan interface Perancangan antarmuka terbagi menjadi beberapa bagian menurut fungsi dari status usersnya masing masing, seperti sector area yang digunakan oleh sektor, admin area untuk admin dll.
58 1. Perancangan Mockup/ Wireframe Sektor Area. Sektor Area adalah halaman yang digunakan sektor untuk input, update dan view laporan dari sektor itu sendiri. Untuk rancangan mockup dapat dilihat pada gambar 4.23-4.26 a) mockup untuk melihat status laporan yang dikerjakan dapat dilihat pada gambar 4.23 Gambar 4.23 Mockup view status laporan b) mockup untuk input laporan yang dikerjakan dapat dilihat pada gambar 4.24 Gambar 4.24 Mockup input laporan
59 c) mockup untuk update laporan yang dikerjakan dapat dilihat pada gambar 4.25 Gambar 4.25 Mockup update laporan d) mockup untuk view laporan yang dikerjakan dapat dilihat pada gambar 4.26 Gambar 4.26 Mockup view laporan
60 2. Perancangan Mockup/ Wireframe Verifikator Area. verifikator Area adalah halaman yang digunakan verifikator untuk melihat status laporan dan memverifikasi data laporan dari sektor itu sendiri. Untuk rancangan mockupnya dapat dilihat pada gambar 4.27-4.30 a) mockup untuk melihat status laporan dapat dilihat pada gambar 4.27 Gambar 4.27 Mockup view status laporan b) mockup untuk melihat detail status laporan (tampilan 1) dapat dilihat pada gambar 4.28 Gambar 4.28 Mockup view detail status laporan tampilan 1
61 c) mockup untuk melihat detail status laporan (tampilan 2) dapat dilihat pada gambar 4.29 Gambar 4.29 Mockup view detail status laporan tampilan 2 d) mockup untuk memverifikasi laporan dapat dilihat pada gambar 4.30 Gambar 4.30 Mockup Verifikasi laporan
62 3. Perancangan Mockup/ Wireframe Admin Area. Admin Area adalah halaman yang digunakan admin untuk mengatur IP yang di block agar nantinya ip tersebut bisa login atau tidak pada halaman login. Untuk rancangan mockup dapat dilihat pada gambar 4.31 Gambar 4.31 Mockup Manage IP Blocked 4. Perancangan Mockup/ Wireframe Manage Users. Manage users adalah halaman yang digunakan sektor dan admin untuk mengatur data users yang ada. Mulai dari melihat data users, edit users, tambah user dan delete users. Untuk rancangan mockup dapat dilihat pada gambar 4.32-4.34 a) mockup untuk melihat data users dapat dilihat pada gambar 4.32 Gambar 4.32 Mockup view data users
63 b) mockup untuk menambah data users dapat dilihat pada gambar 4.33 Gambar 4.33 Mockup edit data users c) mockup untuk tambah data users dapat dilihat pada gambar 4.34 Gambar 4.34 Mockup tambah data users
64 5. Perancangan Mockup/ Wireframe halaman login. Halaman login adalah halaman yang digunakan oleh sektor, admin, dan verifikator untuk melakukan login. Sedangkan halaman login juga di gunkan pemilik perusahaan untuk melihat laporan. Untuk mockup halaman login dapat dilihat pada gambar 4.35 Gambar 4.35 Mockup halaman login