BAB IV ANALISIS DAN PERANCANGAN
4.3. Perancangan
4.3.1. Perancangan Aplikasi
Sesuai dengan penjelasan di BAB III, pada perancangan aplikasi ini penulis menggunakan tools UML, berikut adalah penjelasannya:
a. Perancangan Use Case Diagram
Use Case Diagram digunakan untuk menjelaskan apa yang akan dilakukan oleh sistem dengan mempresentasikan sebuah interaksi antar aktor pada sistem.
1. Aktor
Pada sistem baru yang diusulkan ini, penulis mendefenisikan aktor menjadi 3 tingkatan, yaitu admin, Kaderisasi, dan kader.
Dari ketiganya memiliki wewenang yang berbeda-beda. Berikut adalah wewenang masing-masing aktor:
Tabel 4.1. Aktor Sistem Usulan
No Aktor Deskripsi
1 Admin Admin merupakan aktor tingkatan tertinggi dalam sistem ini.
Wewenangnya adalah sebagai berikut:
1. Melihat kader hasil masukan atau setelah disimpan.
2. Menambah, mengubah, menghapus, menampilkan User atau user account tertentu sesuai dengan kesepakatan organisasi. Dalam hal ini yang ditambah, diubah dan dihapus adalah id user, username, password, dan level.
3. Melakukan penghitungan nilai IJDK terhadap kader
tertentu yang sudah dinyatakan lulus dari syarat-syarat penilaian. Penghitungan IJDK dapat dilakukan setelah ada masukan data.
4. Menampilkan laporan yang berisikan informasi data kader dan IJDK.
5. Menyimpan laporan yang berisikan informasi data kader dan IJDK dalam bentuk PDF.
6. Mencetak laporan yang berisikan informasi data kader dan data IJDK.
7. Mencetak sertifikat IJDK.
2 Kaderisasi Pada sistem ini, Kaderisasi merupakan aktor dengan tingkatan di bawah admin, yang memiliki hak akses adalah Staff Kaderisasi KAMMJA dan Kaderisasi KAMMI Komisariat.
Wewenangnya adalah:
1. Memasukkan, mengubah, menghapus data asal dan kader.
2. Melihat data asal dan kader hasil masukan atau setelah disimpan.
3. Melakukan input nilai terhadap IJDK kader tertentu yang sudah dinilai sesuai dengan syarat-syarat penilaian.
3 Kader Kader merupakan aktor dengan tingkatan di bawah admin dan Kaderisasi. Kader dapat melakukan proses dalam sistem ini tanpa harus melakukan login terlebih dahulu. Wewenangnya hanya dapat melihat (browsing) data kader dan data nilai IJDK.
2. Use Case Diagram
Gambar 4.5. Use Case Diagram Sistem Usulan 3. Penjelasan Use Case Diagram Sistem Usulan
Dari gambar diatas, dapat dijelaskan deskripsi dari setiap use case diagram sistem usulan mulai dari login hingga eksport data dan wewenang masing-masing aktor.
Tabel 4.2. Penjelasan Use Case Diagram Sistem Usulan
No Use Case Name Description Actor
1 Login Use case ini menggambarkan proses untuk masuk ke dalam sistem yang dilakukan oleh dua aktor yaitu admin dan Kaderisasi.
Admin dan Kaderisasi
2 Menghitung Nilai Use case ini menggambarkan proses menghitungan nilai IJDK yang sudah di masukkan terlebih dahulu oleh kaderisasi.
Admin
3 Menentukan status kader
Use case ini menggambarkan proses menentukan status kader berdasarkan hasil penghitungan total nilai kader
Admin
4 Manajemen Laporan
Use case ini menggambarkan proses read , data kader yang masuk
merupakan data laporan kemudian dapat melakukan proses cetak laporan dalam bentuk hardcopy dan menyimpannya dalam bentuk softcopy .
Admin
5 Mencetak sertifikat IJDK
Use case ini menggambarkan proses read data nilai IJDK dan proses mencetak sertifikat IJDK.
Admin
6 Manajemen kader Use case ini menggambarkan proses create, read, update, delete data kader oleh kadersasi. Sedangkan admin hanya menampilkan data tersebut dan melakukan pencarian
Admin dan Kaderisasi
data kader 7 Manajemen Data
Asal
Use case ini menggambarkan proses create, read, update, delete data asal oleh kaderisasi
Kaderisasi
8 Manajemen Nilai IJDK
Use case ini menggambarkan proses create, read, update, delete data nilai IJDK oleh kaderisasi
Kaderisasi
9 Manajemen Operator
Use case ini menggambarkan proses create, read, update, delete operator oleh admin
Admin
10 Lihat Data Kader Use case ini menggambarkan proses read data kader oleh kader, juga dapat dilakukan oleh admin dan kaderisasi di manajemen kader
Kader
11 Lihat Data IJDK Use case ini menggambarkan proses read data IJDK oleh kader, juga dapat dilakukan oleh admin dan kaderisasi di manajemen kader
Kader
4. Use Case Document
Use case document adalah penjelasan secara rinci fungsi dari masing-masing use case yang terjadi di dalam sistem dari sudut pandang pengguna dalam bentuk narasi atau kata-kata.
1) Use Case Login
Tabel 4.3. Login Nama Use Case Login
Aktor Admin dan Kaderisasi
Pemicu Aktor ingin masuk ke dalam sistem
Pre Condition 1. Menampilkan form login kemudian Aktor login sebagai Kaderisasi
2. Aktor login sebagai admin, ketik
http://localhost/masdar/admin pada url di browser, muncul form login admin
Action 1. Aktor mengisi form login
2. Aktor meminta sistem untuk login ke dalam sistem 3. Sistem melakukan pengecekan username dan
password
4. Sistem menampilkan menu home sesuai dengan tingkatan/level
Langkah Alternatif Jika username dan password salah atau field belum diisi lengkap, secara otomatis sistem akan menampilkan pesan kesalahan.
Post condition Jika use case sukses dijalankan maka aktor dapat mengakses sistem sesuai level aktor tersebut.
2). Use Case Menghitung Nilai Tabel 4.4. Menghitung Nilai Nama Use Case Menghitung Nilai
Aktor Admin
Pemicu Melakukan penghitungan nilai IJDK yang sudah di masukkan oleh kaderisasi.
Pre Condition Login sebagai admin data nilai IJDK sudah ada di dalam database, data kader sudah ada di dalam database
Action Menghitung nilai data IJDK
Post condition Nilai IJDK di dalam database telah dihitung
3). Use Case Menentukan Status Kader Tabel 4.5. Menentukan Status Kader Nama Use Case Menentukan Status Kader
Aktor Admin
Pemicu Admin membutuhkan dokumen tersimpan sebagai laporan Pre Condition Login sebagai admin data nilai IJDK sudah ada di dalam
database, data kader sudah ada di dalam database Action Menentukan status kader
Post condition Status kader di dalam database telah ditentukan 4). Use Case Manajemen Laporan
Tabel 4.6. Manajemen Laporan Nama Use Case Manajemen Laporan
Aktor Admin
Pemicu Aktor membutuhkan data kader
Pre Condition Login sebagai admin, data kader sudah ada di dalam database, nilai IJDK sudah ada di dalam database.
Action Eksport Data
Post condition File report data tampil
5). Use Case Mencetak Sertifikat IJDK Tabel 4.7. Mencetak Sertifikat IJDK Nama Use Case Mencetak Sertifikat IJDK
Aktor Admin
Pemicu Kader meminta sertifikat IJDK dan admin membutuhkan sertifikat IJDK
Pre Condition Login sebagai admin, data kader sudah ada di dalam database, nilai IJDK sudah ada di dalam database.
Action Cetak Sertifikat
Post condition Sertifikat IJDK telah tercetak
6). Use Case Manajemen Kader Tabel 4.8. Manajemen Kader Nama Use Case Manajemen Kader
Aktor Admin dan Kaderisasi
Pemicu Kaderisasi ingin melakukan proses CRUD (Create, Read, Update, Delete) data kader. Create yaitu untuk input data, Read untuk menampilkan data, Update untuk edit data dan Delete untuk menghapus data. Sedangkan untuk aktor admin hanya dapat menggunakan fungsi Read
(menampilkan data)
Pre Condition Aktor berhasil login dan berhasil memasuki sistem Action Memasukkan, menampilkan, mengubah, menghapus data Post condition Fungsi Read
Jika data yang diminta ada dalam database, maka data tersebut akan ditampilkan
Fungsi Create
Jika data yang diisikan lengkap, data akan disimpan ke dalam database
Fungsi Update
Jika data baru yang diisikan lengkap, data akan disimpan ke dalam database
Fungsi Delete
Jika use case sukses dijalankan, data akan dihapus dari database
7). Use Case Manajemen Data Asal Tabel 4.9. Manajemen Data Asal Nama Use Case Manajemen Data Asal
Aktor Kaderisasi
Pemicu Use case ini digunakan aktor Kaderisasi untuk proses CRUD (Create, Read, Update, Delete) data asal. Data asal disini akan diisi dengan data daerah, komisariat dan kampus. Create yaitu untuk input data, Read untuk menampilkan data, Update untuk edit data dan Delete untuk menghapus data.
Pre Condition Aktor berhasil login dan berhasil memasuki sistem Action Memasukkan, menampilkan, mengubah, menghapus data Post condition Fungsi Read
Jika data yang diminta ada dalam database, maka data tersebut akan ditampilkan
Fungsi Create
Jika data yang diisikan lengkap, data asal akan disimpan ke dalam database
Fungsi Update
Jika data baru yang diisikan lengkap, akan disimpan ke dalam database
Fungsi Delete
Jika use case sukses dijalankan, data asal akan dihapus dari database
8). Use Case Manajemen Nilai IJDK Tabel 4.10. Manajemen Nilai IJDK Nama Use Case Manajemen Nilai IJDK
Aktor Kaderisasi
Pemicu use case ini digunakan aktor Kaderisasi untuk proses CRUD (Create, Read, Update, Delete) data nilai ijdk.
Create yaitu untuk input data, Read untuk menampilkan data, Update untuk edit data dan Delete untuk menghapus data.
Pre Condition Aktor berhasil login dan berhasil memasuki sistem Action Memasukkan, menampilkan, mengubah, menghapus data Post condition Fungsi Read
Jika data yang diminta ada dalam database, maka data tersebut akan ditampilkan
Fungsi Create
Jika data yang diisikan lengkap, data ijdk akan disimpan ke dalam database
Fungsi Update
Jika data baru yang diisikan lengkap, akan disimpan ke dalam database
Fungsi Delete
Jika use case sukses dijalankan, data ijdk akan dihapus dari database
9). Use Case Manajemen Operator Tabel 4.11. Manajemen Operator Nama Use Case Manajemen Operator
Aktor Admin
Pemicu use case ini digunakan aktor Admin untuk proses CRUD (Create, Read, Update, Delete) data operator. Create yaitu untuk input data, Read untuk menampilkan data, Update untuk edit data dan Delete untuk menghapus data.
Pre Condition Login sebagai admin, aktor berhasil masuk ke dalam sistem Action Memasukkan, menampilkan, mengubah, menghapus data Post condition Fungsi Read
Jika data yang diminta ada dalam database, maka data tersebut akan ditampilkan
Fungsi Create
Jika data yang diisikan lengkap, data operator akan disimpan ke dalam database
Fungsi Update
Jika data baru yang diisikan lengkap, akan disimpan ke dalam database
Fungsi Delete
Jika use case sukses dijalankan, data operator akan dihapus dari database
10). Use Case Lihat Data Kader Tabel 4.12. Lihat Data Kader Nama Use Case Lihat Data Kader
Aktor Kader
Pemicu Aktor membutuhkan dan ingin melihat data kader yang telah ada
Pre Condition Data kader sudah ada di dalam database
Action Menampilkan data kader
Post condition Data kader di dalam database ditampilkan
11). Use Case Lihat Nilai IJDK Tabel 4.13. Lihat Nilai IJDK Nama Use Case Lihat Nilai IJDK
Aktor Kader
Pemicu Aktor membutuhkan dan ingin melihat data kader yang telah ada
Pre Condition nilai IJDK sudah ada di dalam database.
Action Menampilkan Nilai IJDK
Post condition Nilai IJDK di dalam data base ditampilkan
b. Perancangan Activity Diagram
Activity Diagram merupakan diagram yang digunakan untuk menggambarkan berbagai alir aktivitas dalam sistem, meliputi bagaimana masing-masing alir terjadi mulai dari awal, kemungkinan-kemungkinan yang terjadi dan bagaimana prosesnya berakhir. Berikut adalah activity diagram yang akan penulis paparkan: activity diagram login, pemasukan nilai ijdk, perubahan nilai ijdk, penghapusan nilai ijdk, pencarian nilai ijdk, menampilkan detail nilai ijdk, pemasukan data asal, pemasukan data User, perubahan data asal, perubahan data User, penghapusan data asal, penghapusan data User.
1. Activity Diagram untuk Login
Activity diagram ini menggambarkan sebuah proses ketika aktor akan melakukan login. Aktor langsung menghadapi tampilan form login, selanjutnya dapat memasukkan username dan password yang sesuai.
Setelah tombol login ditekan sistem akan melakukan pengecekan kebenaran username dan password, jika benar maka aktor mempunyai akses ke dalam sistem dan dimulai dari halaman utama dan jika salah maka akan muncul informasi dialog peringatan kemudian aktor diarahkan untuk login kembali.
Gambar 4.6. Activity Diagram Login
2. Activity Diagram untuk Pemasukan Data Kader
Activity diagram diatas menggambarkan ketika aktor (admin dan Kaderisasi) akan melakukan proses pemasukan data kader ke dalam database. Proses ini dimulai ketika aktor mengklik menu “Data Kader” selanjutnya diarahkan ke halaman list data kader, di halaman tersebut aktor dapat menekan tombol “Input Data Kader”, maka sistem akan mengarahkan ke halaman form biodata kader, disinilah aktor mengisi field-field yang disajikan, lalu aktor menekan tombol
“Simpan”, maka secara otomatis sistem akan mengecek data yang dimasukkan oleh aktor. Jika ada kesalahan ketika memasukkan data-data, maka sistem akan memberikan peringatan kesalahan masukan dan aktor diarahkan untuk mengisi kembali field-field yang tersedia, namun jika aktor tidak ingin melanjutkan pengisian maka aktor dapat menekan tombol “Batal”. Jika data yang dimasukkan benar, maka data akan tersimpan dan proses penyimpanan selesai.
Gambar 4.7. Activity Diagram Pemasukan Data Kader
3. Activity Diagram untuk Perubahan Data Kader
Activity diagram diatas adalah rangkaian proses yang akan terjadi ketika aktor melakukan perubahan data kader yang telah ada di dalam database. Pertama yang dilakukan oleh aktor adalah mengklik menu
“Edit” dari halaman view data kader yang bernama halaman list data kader, selanjutnya diarahkan oleh sistem untuk aktor pada tampilan form edit data kader. Langkah selanjutnya aktor mengisi field-field yang tersedia. Setelah aktor melakukan pengisian field-field, lalu aktor dapat menekan tombol “Simpan”, selanjutnya sistem secara otomatis akan melakukan validasi data, jika terdapat kesalahan masukan data, maka sistem akan memberikan peringatan kesalahan dan mengarahkan ke halaman form edit data kader untuk kembali mengoreksi kesalahan yang dilakukan, namun apabila aktor tidak ingin meneruskan maka dapat menekan tombol “Batal”. Jika data yang dimasukkan valid, maka data akan tersimpan dan proses penyimpanan selesai.
Gambar 4.8. Activity Diagram Perubahan Data Kader
4. Activity Diagram untuk Penghapusan Data Kader
Activity diagram ini menggambarkan rangkaian proses yang akan terjadi ketika aktor melakukan penghapusan data kader yang telah ada di dalam database. Proses ini bermula dari list data kader, pada list data kader tersebut aktor menekan tombol “Delete” untuk melakukan penghapusan data kader. Sistem secara otomatis akan menghapus data kader tertentu berdasarkan id_kader.
5. Activity Diagram untuk Pencarian Data Kader
Activity diagram diatas menggambarkan proses yang dilakukan oleh aktor ketika melakukan pencarian terhadap data kader tertentu yang
Gambar 4.9. Activity Diagram Penghapusan Data Kader
Gambar 4.10. Activity Diagram Pencarian Data Kader
ada di dalam database. Aktor melakukan masukan kata kunci ke dalam form yang tersedia, setelah itu aktor menekan tombol “Cari”, selanjutnya sistem melakukan pencarian data yang sesuai. Kemudian data yang didapatkan ditampilkan.
6. Activity Diagram untuk Menampilkan Detail Data Kader
Activity diagram ini menggambarkan proses untuk menampilkan detail data kader yang dilakukan oleh aktor. Sistem menampilkan list data kader, pada halaman list data kader ini aktor dapat menekan tombol
“Detail Kader”, sistem akan menampilkan seluruh detail data kader tertentu berdasarkan id_kader, maka data kader secara detail ditampilkan.
Gambar 4.11. Activity Diagram Menampilkan Detail Data Kader
7. Activity Diagram untuk Pemasukan Nilai IJDK
Activity diagram diatas menggambarkan ketika aktor (Kaderisasi) akan melakukan proses pemasukan nilai IJDK terhadap data kader yang belum dinilai ke dalam database. Proses ini dimulai ketika aktor mengklik menu “IJDK” selanjutnya diarahkan ke sub menu “Nilai IJDK” , dari halaman nilai ijdk aktor dapat menekan tombol “Isi IJDK”, maka sistem akan mengarahkan ke halaman form penilaian ijdk, disinilah aktor mengisi field-field yang disajikan dengan nilai berupa angka, lalu aktor menekan tombol “Simpan”, maka secara Gambar 4.12. Activity Diagram Pemasukan Nilai IJDK
otomatis sistem akan mengecek data yang dimasukkan oleh aktor. Jika ada kesalahan ketika memasukkan data-data, maka sistem akan memberikan peringatan kesalahan masukan dan aktor diarahkan untuk mengisi kembali field-field yang tersedia, namun jika aktor tidak ingin melanjutkan pengisian maka aktor dapat menekan tombol “Batal”.
Jika data yang dimasukkan benar, maka data akan tersimpan dan proses penyimpanan selesai. Perlu diketahui, setiap pemasukan nilai ijdk berkaitan erat dengan pemasukan data kader, karena proses penilaian ijdk terhadap kader tertentu tidak akan terjadi jika tidak ada pemasukan data kader. Untuk kader yang sudah dinilai maka secara otomatis akan diketahui status jenjang anggotanya.
8. Activity Diagram untuk Perubahan Nilai IJDK
Gambar 4.13. Activity Diagram Perubahan Nilai IJDK
Activity diagram diatas adalah rangkaian proses yang akan terjadi ketika aktor melakukan perubahan nilai ijdk yang telah ada di dalam database. Pertama yang dilakukan oleh aktor adalah mengklik menu
“IJDK”, lalu selanjutnya diarahkan oleh sistem untuk menekan sub menu “Data Nilai IJDK”, jika sub menu “Data Nilai IJDK” sudah ditekan maka muncul tampilan list nilai berbentuk tabel, selanjutnya aktor dapat menekan tombol “Edit” yang berada di tabel tersebut untuk memulai perubahan data, kemudian sistem akan mengarahkan aktor pada tampilan form edit data IJDK. Langkah selanjutnya aktor mengisi field-field yang tersedia. Setelah aktor melakukan pengisian field-field, lalu aktor dapat menekan tombol “Simpan”, selanjutnya sistem secara otomatis akan melakukan validasi data, jika terdapat kesalahan masukan data, maka sistem akan memberikan peringatan kesalahan dan mengarahkan ke halaman form edit data IJDK untuk kembali mengoreksi kesalahan yang dilakukan, namun apabila aktor tidak ingin meneruskan maka dapat menekan tombol “Batal”. Jika data yang dimasukkan valid, maka data akan tersimpan dan proses penyimpanan selesai.
9. Activity Diagram untuk Penghapusan Nilai IJDK
Activity diagram ini menggambarkan rangkaian proses yang akan terjadi ketika aktor melakukan penghapusan nilai ijdk yang telah ada di dalam database. Proses ini bermula dari list data nilai ijdk yang masuk dalam sub menu “Data Nilai IJDK” dan masuk bagian dalam menu “IJDK”. Pada list data nilai ijdk tersebut aktor menekan tombol
“Delete” untuk melakukan penghapusan nilai ijdk. Sistem secara otomatis akan menghapus nilai ijdk tertentu berdasarkan id_kader, nilai ijdk terhapus.
Gambar 4.14. Activity Diagram Penghapusan Nilai IJDK
10. Activity Diagram untuk Pencarian Nilai IJDK
Activity diagram diatas menggambarkan proses yang dilakukan oleh aktor ketika melakukan pencarian terhadap nilai ijdk tertentu yang ada di dalam database. Aktor melakukan masukan kata kunci ke dalam form yang tersedia, setelah itu aktor menekan tombol “Cari”, selanjutnya sistem melakukan pencarian data yang sesuai. Kemudian data yang didapatkan ditampilkan.
Gambar 4.15. Activity Diagram Pencarian Nilai IJDK
11. Activity Diagram untuk Menampilan Detail Nilai IJDK
Activity diagram ini menggambarkan proses untuk menampilkan detail nilai ijdk yang dilakukan oleh aktor. Langkah pertama yang dilakukan oleh aktor adalah mengklik menu data kader, setelah itu akan diarahkan oleh sistem menuju halaman data kader, pada halaman data kader ini aktor dapat menekan tombol “Detail IJDK”, sistem akan menampilkan seluruh detail nilai ijdk tertentu berdasarkan id_kader, maka nilai ijdk secara detail ditampilkan.
Gambar 4.16. Activity Diagram Menampilkan Detail Nilai IJDK
12. Activity Diagram untuk Pemasukan Data Asal
Activity diagram diatas menggambar proses yang terjadi ketika aktor menekan tombol menu “Data Asal” kemudian memilih sub menu
“Data Asal”. Selanjutnya aktor dapat menekan tombol “Tambah Data” sesuai dengan sub menu yang dipilih. Setelah itu maka form untuk menambah data asal akan ditampilkan oleh sistem. Tahap berikutnya aktor mengisi data-data asal yang diminta sistem. Apabila data-data yang dimasukan sesuai dengan permintaan sistem maka data asal akan disimpan ke dalam database. Sedangkan jika data-data yang dimasukan tidak sesuai dengan permintaan sistem maka data tidak akan disimpan ke dalam database.
Gambar 4.17. Activity Diagram Data Asal
13. Activity Diagram untuk Pemasukan Data User
Activity diagram diatas menggambar proses yang akan terjadi ketika admin memasukkan data User baru, meliputi id_user, username, password dan level yang dimulai dari menekan tombol menu
“Tambah User”, selanjutnya sistem secara otomatis akan mengarahkan ke halaman form penambahan User baru, ketika admin sudah mengisi field-field yang disajikan lalu admin menekan tombol
“Simpan”, maka data User akan tersimpan dan nantinya User akan dapat mengakses halaman sesuai dengan levelnya, setiap level mempunyai hak akses yang berbeda-beda, ketentuan pemberian level hanya dapat dilakukan oleh admin.
14. Activity Diagram untuk Perubahan Data Asal
Gambar 4.18. Activity Diagram Pemasukan Data User
Gambar 4.19. Activity Diagram Perubahan Data Asal
Activity diagram diatas adalah rangkaian proses yang akan terjadi ketika aktor melakukan perubahan data asal yang telah ada di dalam database. Dari halaman view data asal, aktor dapat menekan tombol
“Edit” untuk memulai perubahan data, selanjutnya sistem akan mengarahkan aktor pada tampilan form edit. Kemudian aktor mengisi field-field yang tersedia. Setelah aktor melakukan pengisian field-field, lalu aktor dapat menekan tombol “Simpan”, maka data selanjutnya tersimpan didalam database.
15. Activity Diagram untuk Perubahan Data User
Activity diagram diatas adalah rangkaian proses yang akan terjadi
Activity diagram diatas adalah rangkaian proses yang akan terjadi