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
Menerima Email
Kirim Email
Verifikasi
Update
Tidak
Layak
Ya
Laporan Diterima
Phase
End
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
Start
Start
Manage Login data
Update Database
Verifikator
Atasan
Input Laporan
Membuka Data Laporan
Simpan Data Dalam Database
Verifikasi
End
Upadte Database Verifikasi
Update
Tidak
Layak
Ya
Laporan Ditampilkan beserta waktunya
Phase
End
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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
Sukses
Error Report
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 Gambar DFD Level 0 aplikasi monitoring hasil kerja dapat di lihat di gambar 4.15
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 ERD Aplikasi monitoring laporan hasil kerja dapat dilihat pada gambar 4.21
56
Informasi Informasi Laporan Laporan
Status Status Laporan Laporan
Isi Isi Laporan Laporan
Id Id Users Users
Waktu Waktu Pengumpulan Pengumpulan
Password Password
Id Id Laporan Laporan
Username Username M
Laporan
1
Memverifikasi
Verifikator
Id Id Users Users
Nama Nama 1
Waktu Verifikasi
Mengisi
Alamat Alamat
Status Status
Id Id Users Users
Password Password Username Username
1
Sektor Nama Nama Alamat Alamat
Status 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
Users
Id_laporan id_users status_laporan waktu_verifikasi waktu_pengumpulan Informasi_laporan
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. 1. 2. 3. 4. 5.
Nama Field id_users nama username password status
Tipe Data Int Varchar Varchar Varchar
alamat
Varchar
6.
enum
Panjang 11 150 30 100 “Admin”, “Verifikator”, “Sektor” 200
Ket PK
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. 1. 2. 3. 4. 5. 6. 7.
Nama Field id_laporan id_users isi_laporan informasi_laporan status_laporan
Tipe Data Int Int Text Varchar
waktu_pengumpulan waktu_verifikasi
Date Datae
enum
Panjang 11 11 1000 200 “Belum”, “Lulus”, “Tidak Lulus” DD/MM/YYYY DD/MM/YYYY
Ket PK FK
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
