• Tidak ada hasil yang ditemukan

IV. HASIL DAN PEMBAHASAN

4.3 Modelling Quick Design

Pada tahap ini dilakukan beberapa kegiatan pemodelan sistem dengan-menggunakan unifield modeling language (UML) berupa use case, activity dia-gram, squance diadia-gram, perancangan struktur menu dan perancangan antar muka sistem.

Perancangan Use Case Diagram

Perancangan use case diagram bertujuan untuk menggambarkan in-teraksi antara pengguna dari sistem tersebut. Berikut adalah use case diagram yang digambarkan:

a. Identifikasi actor

Tabel 6. Identifikasi Aktor Sistem.

No Aktor Deskripsi

1. Super Admin Merupakan actor yang dapat mengelola pengguna serta semua data dari reporting non rutin SCADA

2. Admin/Petugas Merupakan actor yang mengelola data dari re-porting non rutin SCADA.

b. Perancangan Use Case Diagram

Gambar 9. Perancangan Use Case Diagram.

Use case ini mendeskripsikan peran keseluruhan actor yang berperan didalam sistem informmasi reporting non rutin PT. Transportasi Gas Indonesia Jambi.

Gambar 10. Use Case Diagram Admin.

Use case ini mendeskripsikan tentang peran actor super admin sebagai actor yang berperan dalam mengatur sistem, seperti menambah, mengedit dan menghapus admin. Serta dapat mengatur segala bentuk pengaturan dalam sis-tem.

Gambar 11. Use Case Staff.

Use case ini mendeskripsikan tentang para actor yang berperan dalam mengelola sistem, seperti menambah, mengedit dan menghapus data reporting non rutin. Serta dapat mengatur fitur tambahan lainnya seperti data station dan data staff.

c. Deskripsi Use Case Diagram

Setelah menjabarkan fungsionalitas dari user case masing-masing actor, maka selanjutnya adalah menjabarkan alur kerja masing-masing use case me-lalui scenario untuk menggambarkan proses yang terjadi anatra sistem dan actor.

Berikut adalah narasi use case yang akan menjelaskan alur setiap use case dia-gram yang ada:

1. Login

Nama use case : Login

Aktor : Semua actor

Deskripsi : Use case ini dilakukan agar semua pengguna dapat mengakses kedalam sistem dengan benar.

Tabel 7. Deskripsi use case login.

Aksi Aktor Respon Sistem

1. mengunjungi sistem 2. Menampilkan halaman login 3. memasukan user name

4. memasukan password

5. klik tombol login 6. mempalidasi username dan password, jika pas sword atau username salah menampilkan pesan username atau password salah. Jika benar masuk kedalam halaman dashboard ad-min.

2. Menu tambah admin

Nama use case : Tambah admin Aktor : Super admin

Deskripsi : Use case ini dilakukan untuk menambah admin atau petu

gas baru

Tabel 8. Deskripsi use case tambah admin.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard admin 2. Klik tombol User 3. Menampilkan halaman Kelola user 4. Klil tombol tambah user

5. Masukan email, username dan password setelah itu memilih level user

6. Klik tombol daftar 7. Sistem akan menyimoan data ke database, jika username telah digunakan menampilakan pesan username telah digunakan, jika

username belum diguakan maka data berhasil ditambahkan

3. Menu edit data admin

Nama use case : Edit data admin Aktor : Super admin

Deskripsi : Use case ini dilakukan untuk mengedit data admin Tabel 9. Deskripsi Use Case Edit Data Admin.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard admin 2. Klik tombol User 3. Menampilkan halaman Kelola user 4. Klik icon pensil pada data

yang akan di edit 5. Menampilkan data 6. Mengubah password atau

username

7. Klik tombol ubah data 8. Sistem akan update data ke database 4. Menu hapus data admin

Nama use case : Hapus data admin Aktor : Super admin

Deskripsi : Use case ini dilaukukan untuk menghapus data admin Tabel 10. Deskripsi Use Case Hapus Data Admin.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard admin 2. Klik tombol User 3. Menampilkan halaman Kelola user 4. Klik icon trash pada data

yang akan di hapus

5. Sistem menghapus data

5. Menu tambah data reporting non rutin Nama use case : Tambah data

Aktor : Super admin dan admin

Deskripsi : Use case ini dilaukukan untuk menambahkan data report ing non rutin

Tabel 11. Deskripsi Use Case Tambah Data.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard 2. Klik tombol new report 3. Menampilkan halaman input data 4. Input data reporting baru

5. Klik icon submit 6. Sistem akan mnyipan data ke database

6. Menu edit data laporan reporting non rutin Nama use case : Edit data

Aktor : Super admin dan admin

Deskripsi : Use case ini dilaukukan untuk mengedit data reporting non rutin

Tabel 12. Deskripsi Use Case Edit data.

Aksi Aktor Respon Sistem

1. Menampilkan halaman data master 2. Klik icon pensil pada data

yang akan di edit

3. Menampilkan data 4. Klik icon pensil pada data

yang akan di edit

5. Menampilkan data 6.Mengedit data reporting

non rutin

7. Klik tombol save 8. Sistem akan update data ke database

7. Menu hapus data laporan reporting non rutin Nama use case : Hapus data

Aktor : Super admin dan admin

Deskripsi : Use case ini dilaukukan untuk menghapus data reporting non rutin

Tabel 13. Deskripsi Use Case Hapus Data.

Aksi Aktor Respon Sistem

1. Menampilkan halaman data master 2. Klik icon trash pada data

yang akan di hapus 3. Sistem menghapus data

8. Menu tambah data station

Nama use case : Tambah data station Aktor : Super admin dan admin

Deskripsi : Use case ini dilakukan untuk menambahkan data station

Tabel 14. Deskripsi Use Case Tambah Data Station.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard 2. Klik tombol Setting 3. Menampilkan halaman setting

4. Klik menu station 5. Sistem akan menampilkan data station

6. Klik icon tamabah station 7. Menampilakn halaman input data

8. Input data station baru 9. Sistem akan menyimapan data ke database 9. Menu hapus data station

Nama use case : Hapus data station Aktor : Super admin dan admin

Deskripsi : Use case ini dilakukan untuk menghapus data station Tabel 15. Deskripsi Use Case Hapus Data Station.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard 2. Klik tombol Setting 3. Menampilkan halaman setting

4. Klik menu station 5. Sistem akan menampilkan data station 6. Klik icon trash pada data

yang akan dihapus

7. Sistem menghapus data

10. Menu tambah data staff

Nama use case : Tambah data staff Aktor : Super admin dan admin

Deskripsi : Use case ini dilakukan untuk menambahkan data staff Tabel 16. Deskripsi Use Case Tambah Data Staff.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard 2. Klik tombol Setting 3. Menampilkan halaman setting 4. Klik menu staff 5. Sistem akan menampilkan data staff 6. Klik icon tamabah staff 7. Menampilakn halaman input data

8. Input data staff baru 9. Sistem akan menyimapan data ke database 11. Menu hapus data staff

Nama use case : Hapus data staff

Aktor : Super admin dan admin

Deskripsi : Use case ini dilakukan untuk menghapus data staff Tabel 17. Deskripsi Use Case Hapus Data Staff.

Aksi Aktor Respon Sistem

1. Menampilkan halaman dashboard 2. Klik tombol Setting 3. Menampilkan halaman setting 4. Klik menu staff 5. Sistem akan menampilkan data staff

6. Klik icon trash pada data

yang akan dihapus 7. Sistem menghapus data 12. Menu print report

Nama use case : Print report

Aktor : Super admin dan admin

Deskripsi : Use case ini dilakukan untuk mencetak data reporting Tabel 18. Deskripsi Use Case Print Report.

Aksi Aktor Respon Sistem

1. Menampilkan halaman print report 2. Cari data yang akan

dice-tak

3. Sistem akan mencetak data reporting 4. Klik icon save untuk

me-nyimpan data dalam format PDF

Perancangan Squance Diagram

Perancangan squance diagram bertujuan untuk menggambarkan aksi yang dilakukan oleh actor kemudian diproses oleh sistem dan terhubung ke da-tabase untuk mengintergrasikan data. Berikut merupakan beberapa rancangan squance diagram dari sistem informasi reporting non rutin PT. Transportasi Gas Indonesia Jambi :

a. Squance diagram login

Gambar 12. Squance Diagram Login.

Squance diagram ini dimulai dari membuka halaman login selanjutnya Memasukan username dan password, kemudian menekan tombol login. Sistem akan mencocokan data pada form login dengan data user pada table users. Jika data cocok maka berhasil dan menampilakan halaman dashboard. Namun jika

tidak cocok maka user akan dikembalikan kehalaman login serta pemberitahuan bahwa username dan password salah.

b. Squance Diagram Tambah Admin

Gambar 13. Squance Diagram Tambah User.

Squance diagram ini dimulai dengan membuka halaman tambah user selanjutnya memilih role yang tersedia super admin atau admin, kemudian me-masukan username, email dan password dan tekan tombol simpan. Sistem akan menyimpan data yang telah dimasukan sebelumnya kedalam database pada table users disertai dengan pemberitahuan data berhasil ditambahkan.

c. Squance Diagram Tambah Data Reporting

Gambar 14. Squance Diagram Tambah Data Reporting.

Squance diagram ini dimulai dengan membuka halam tambah report se-lanjutnya memasukan repeir activity, station dan status kemudian tekan tombol submit.Sistem akan menyimpan data yang telah dimasukan sebelumnya kedalam database pada table db_data_master disertai dengan pemberitahuan data ber-hasil Ditambahkan.

d. Squance Diagram Edit Data Reporting

Gambar 15. Squance Diagram Edit Data Reportin.

Squance diagram ini dimulai dengan membuka halam data master selan-jutnya memilih data yang akan diedit dan menekan icon pensil. Sistem akan men-ampilkan halaman edit data dan jika sudah slesai maka menekan tombol update.

Sistem akan menguupdate data yang telah diedit pada table database sesuias jenis yang dipilih sebelum nya, disertai dengan pemberitahuan data berhasil diupdate.

e. Squance Diagram Hapus Data Reporting

Gambar 16. Squance Diagram Hapus Data Reporting.

Squance diagram ini dimulai dengan membuka halam data master selan-jutnya memilih data yang akan dihapus dan menekan icon trash. Sistem akan menghapus sesuai dengan data yang dipilih sebelumnya pada table database, disertai dengan pemberitahuan data berhasil dihapus.

f. Squance Diagram Tambah Data Station

Gambar 17. Squance Diagram Tambah Station.

Squance diagram ini dimulai dengan membuka halam station selanjutnya memasukan nama station kemudian tekan tombol submit. Sistem akan menyim-pan data yang telah dimasukan sebelumnya kedalam database pada table db_sta-tion dengan pemberitahuan data berhasil Ditambahkan.

g. Squance Diagram Hapus Data Station

Gambar 18. Squance Diagram Hapus Station.

Squance diagram ini dimulai dengan membuka halam station selanjutnya Pilih data station yang akan dihapus kemudian tekan icon trash. Sistem akan menghapus data pada database pada table db_station dengan pemberitahuan data berhasil dihapus.

h. Squance Diagram Tambah Data Staff

Gambar 19. Squance Diagram Tambah Staff.

Squance diagram ini dimulai dengan membuka halam staff selanjutnya memasukan nama staff kemudian tekan tombol submit. Sistem akan menyimpan data yang telah dimasukan sebelumnya kedalam database pada table db_staff dengan pemberitahuan data berhasil Ditambahkan.

i. Squance Diagram Hapus Staff

Gambar 20. Squance Diagram Hapus Staff.

Squance diagram ini dimulai dengan membuka halam staff selanjutnya Pilih data staff yang akan dihapus kemudian tekan icon trash. Sistem akan menghapus data pada database pada table db_staff dengan pemberitahuan data berhasil dihapus.

Perancangan Activity Diagram

Perancangan activity diagram bertujuan untuk mendeskripsikan aktivitas yang terjadi dalam suatu sistem informasi. Berikut beberapa rancangan activity diagram dari sistem informasi reporting non rutin PT. Transportasi Gas Indonesia Jambi :

a. Activity Diagram Login

Gambar 21. Activity Diagram Login.

Activity diagram login menggambarkan aktivitas yang harus dilakukan semua pengguna untuk dapat masuk ke dalam sistem dengan memasukan username dan password, lalu sebelum masuk ke halaman utama sistem akan memvalidasi apakah username dan password yang dimasukan telah terdaftar didalam database.

b. Activity Diagram Tambah Admin

Gambar 22. Activity Diagram Tambah Admin.

Activity Diagram Tambah admin ini merupakan aktivitas super admin ketika menambahkan user baru, sistem akan menampilkan halaman kelola user selajutnya super admin memasukan data yang dibutuhkan seperti melilih role yang tersedia lalu memasukan username dan password, kemudian sebelum data berhasil ditambahkan sistem akan memvalidasi apakah username yang dimasukan tersedia atau tidak.

c . Activity Diagram Tambah Data Reporting

Gambar 23. Activity Diagram Tambah Data Reporting.

Activity Diagram Tambah data reporting ini merupakan aktivitas super admin dan admin, sistem akan menampilkan halaman tambah data reporting selajutnya super admin dan admin memasukan data yang dibutuhkan seperti re-pair activity, station dan status, kemudian sebelum data berhasil ditambahkan sistem akan memvalidasi apakah data yang dimasukan sudah sesuai baru kemudian data disimpan ke database.

d. Activity Diagram Edit Data Reporting

Gambar 24. Activity Diagram Edit Data Reporting.

Activity Diagram Edit Data Reporig ini dapat dilakukan oleh super admin atau admin, sebelum mengedit data super admin atau admin memilih halaman data master. Selanjutnya memilih data yang akan diedit lalu sistem menampilkan halaman data yang dipilih dan melakukan update data.

e. Activity Diagram Hapus Data Reporting

Gambar 25. Activity Diagram Hapus Data Reporting.

Activity Diagram Hapus Data Reporting ini dapat dilakukan oleh super admin atau admin, sebelum menghapus data super admin atau admin memilih halaman data master. Selanjutnya memilih data yang akan dihapus.

f. Activity Diagram Tambah Data Station

Gambar 26. Activity Diagram Tambah Data Station.

Activity Diagram Tambah data stationini merupakan aktivitas super admin dan admin, sistem akan menampilkan halaman station selajutnya super admin dan admin memasukan data yang dibutuhkan seperti nama station, kemudian data akan ditambahkan kedalam database.

g. Activity Diagram Hapus Data Station

Gambar 27. Activity Diagram Hapus Data Station.

Activity Diagram Hapus Data Station ini dapat dilakukan oleh super admin atau admin, sebelum menghapus data super admin atau admin memilih halaman station. Selanjutnya memilih data yang akan dihapus.

h. Activity Diagram Tambah Data Staff

Gambar 28. Activity Diagram Tambah Data Staff.

Activity Diagram Tambah data staff ini merupakan aktivitas super admin dan admin, sistem akan menampilkan halaman staffselajutnya super admin dan

admin memasukan data yang dibutuhkan seperti nama staff, kemudian data akan ditambahkan kedalam database.

i. Activity Diagram Hapus Data Staff

Gambar 29. Activity Diagram Hapus Data Staff.

Activity Diagram Hapus Data Staff ini dapat dilakukan oleh super admin atau admin, sebelum menghapus data super admin atau admin memilih halaman staff. Selanjutnya memilih data yang akan dihapus.

Perancangan Class Diagram

Class Diagram menggambarkan struktur sistem dari segi pendefenisian kelas-kelas pada database sebagai tempat penyimpanan data yang digunakan pada sistem. Berikut ini merupakan identifikasi entitas dan skema rancanga da-tabase:

a. Identifikasi entitas

Tabel 19. Identifikasi Entitas.

Entitas Deskripsi

Data User Merupakan entitas untuk menyimpan data user Data Report Merupakan entitas untuk menyimpan semua data

reporting non rutin

Data Station Merupakan entitas untuk menyimpan semua data station

Data Staff Merupakan entitas untuk menyimpan semua data staff

b. Skema perancangan database class diagram

Gambar 30. Skema Rancangan Database Class Diagram.

Perancangan Struktur Menu

Kegiatan pada tahap ini yaitu merancang struktur menu berdasarkan proses yang terdapat pada sistem informasi reporting non rutin PT. Transportasi gas Indonesia Jambi yang dirancang. Perancangan struktur menu ini dimulai dari menu login, menu utama dashboard hingga sub menu beradasarkan tugas dari pengguan sistem. Berikut adalah rancangan struktur menu sistem informasi re-porting non rutin PT. Transportasi Gas Indonesia Jambi:

Gambar 31. Perancangan Struktur Menu.

Berdasarkan struktur menu yang telah digambarkan, maka dapat dijelas-kan masing-masing fungsi dari setiap menu yang dibuat sebagai berikut:

a. Menu Admin 1. Dashboard

Menu halaman ini menampilkan data terbaru sehingga pengguna sis-tem bisa melihat data yang telah ditambahkan kedalam sissis-tem, dan juga pengguna sistem juga dapat membuat laporan report baru.

2. Data Master

Menu halaman ini menampilkan keseluruhan data pada sistem se-hingga pengguna sistem dapat melihat mengedit dan menghapus semua data-data reporting non rutin pada sistem pada sistem.

3. Setting Report

Menu halaman ini berguna untuk mengedit dan menambahkan kompen pelengkap pada data reporting non rutin, seperti data station dan data staff.

4. Cetak Report

Menu halaman ini berguna untuk mencetak laporan reporting non ru-tin,

5. Users

Menu ini digunakan oleh super admin untuk menambah, mengedit data dan menghapus admin.

b. Menu Staff 1. Dashboard

Menu halaman ini menampilkan data terbaru sehingga pengguna sis-tem bisa melihat data yang telah ditambahkan kedalam sissis-tem, dan juga pengguna sistem juga dapat membuat laporan report baru.

2. Data Master

Menu halaman ini menampilkan keseluruhan data pada sistem se-hingga pengguna sistem dapat melihat mengedit dan menghapus semua data-data reporting non rutin pada sistem pada sistem.

3. Setting Report

Menu halaman ini berguna untuk mengedit dan menambahkan kompen pelengkap pada data reporting non rutin, seperti data station dan data staff.

4. Cetak Report

Menu halaman ini berguna untuk mencetak laporan reporting non ru-tin,

Perancangan User Interface

Perancangan user interface dibuat setelah selesai rancangan menu dan alur proses dari sistem informasi reporting non rutin PT. Transportasi Gas Indo-nesia Jambi. Tahapan ini merupakan tahapan terakhir dari rangkaian yang dil-akukan pada modelling quick design. Dalam perancangan user interface terdapat tiga kali revisi user interface. Berikut adalah rancangan user interface sistem in-formasi reporting non rutin PT. Transportasi Gas Indonesia Jambi.

1. Rancangan User Interface Pertama

Gambar 32. Prototype User Interface Awal Sistem.

2. Rancangan User Interface Kedua

Gambar 33. Prototype User Interface Kedua Sistem.

3. Rancangan User Interface Ketiga

a. Desain user interface login (semua actor)

Gambar 34. Halaman Login.

Merupakan halaman user memasukan username dan password agar bisa masuk kedalam sistem untuk mengelola data, serta menentukan role masing-masing user.

b. Desain user interface dashboard (semua actor)

Gambar 35. Halaman Dashboard.

Merupakan halaman dashboard, dimana pada halaman ini merupakan halaman utama yang berisi informasi seperti halaman dashboard pada umumnya.

c. Desain user interface data master (semua actor)

Gambar 36. Halaman Data Master.

Merupakan halaman data master, dimana halaman ini menampilkan tombol dan icon untuk mengedit dan menghapus data pada kolom database re-port yang telah ditambahkan sebelumnya.

d. Desain user interface print report (semua actor)

Gambar 37. Halaman Print Report.

Merupakan halaman cetak report, dimana halaman ini yang menyediakan form untuk mencetak data reporting non rutin scada dengan format form yang sudah disediakan.

e. Desain user interface setting report (semua actor)

Gambar 38. Halaman Setting Report.

Merupakan halaman setting report, dimana halaman ini menyediakan sub menu untuk satation dan staff, didalam dapat mengolah data station dan staff.

f. Desain user interface users (super admin)

Gambar 39. Halaman Users.

Merupakan halaman kelola user super admin, dimana halaman ini menampilkan tombol dan icon untuk menambah, menghapus serta mengedit data user. Halaman ini lah yang membedakan antara super admin dan admin.

g. Desain user interface input report

Gambar 40. Halaman Input Report.

Merupakan halaman input report, dimana halaman ini menampilkan form data yang akan disikan untuk menjadi data reporting non rutin scada.

h. Desain user interface station (semua actor)

Gambar 41. Halaman Station.

Merupakan halaman kelola station, dimana halaman ini menampilkan tombol dan icon untuk menambah, menghapus serta mengedit data station.

i. Desain user interface staff (semua actor)

Gambar 42. Halaman Staff.

Merupakan halaman kelola staff, dimana halaman ini menampilkan tombol dan icon untuk menambah, menghapus serta mengedit data staff.

Dokumen terkait