Desain UML
4.3.2 Desain UML
Perancangan aplikasi ini peniliti melakukan perancangan dengan menggunakan UML yang terdiri dari Usecase diagram, Activity diagram, Sequence diagram dan Class diagram.
4.3.2.1 Identifikasi Usecase dan Aktor
Usecase diagram dapat dibuat setelah peniliti melakaukan identifikasi actor dan identifikasi kebutuhan Usecase. Berdasarkan penjelesan pada bab sebelumnya Usecase mencakup aliran-aliran kerja (workflow) dalam sistem (bersifat internal) sedangkan actor-aktor mencakup segala sesuatu yang ada di luar sistem (bersifat eksternal). Pemodelan sistem dilakukan untuk mendiskripsikan Usecase apa saja dan aktor yang akan terlibat dalam analisis sistem usulan. Berukut ini informasi detail mengenai identifikasi aktor dan identifikasi kebutuhan Usecase :
Tabel 4. 7 Requirepment, aktor, dan usecase
NO Requerepment
Aktor
Usecase
1 Pemilik percetakan
Menambah, melihat, menginput data ke
Admin
mengubah, mencari data, dalam sistem
dan mencetak data
2 Resepsionis Pegawai Menginput data klien dan menginput klien
menggenerate jadwal
4.3.2.2 Usecase Diagram
Berikut ini merupakan Usecase diagram dari sistem usulan penjadwalan percetakan menggunakan algoritma genetika:
Gambar 4. 5 Usecase Diagram Admin
Gambar 4. 6 Usecase Diagram Pegawai
Gambar 4.5 dan gambar 4.6 menjelaskan mengenai Usecase pada aplikasi penjadwalan, dimana admin dan pegawai sebagai aktor. Berikut skesnario narasi Usecase Diagram.
4.3.2.3 Usecase Scenario
Usecase Scenario mendefinisikan apa yang dilakukan oleh sistem ketika aktor mengaktifkan Usecase. Struktur dari Usecase Scenario ini terdiri dari:
1. Nama Usecase,
2. Aktor yang terlibat
3. Pre-condition yang penting bagi Usecase untuk memulai.
4. Deskripsi rinci dari aliran kejadian yang terdiri dari: • Main flow dari kejadian yang bisa dirinci lagi
menjadi sub flow dari kejadian (sub flow bisa dibagi lagi lebih jauh menjadi sub flow yang lebih kecil agar dokumen lebih mudah dimengerti).
• Alternative flow untuk mendefinisikan situasi
perkecualian. • Post-condition yang menjelaskan state dari sistem
setelah usecase berakhir.
Tabel 4. 8 Usecase Login
Usecase Name
Login
Actor
Admin, Pegawai
Usecase ini mengambarkan aktor dapat
Description
menambah data pegawai pada PT Dila Print Aktor harus memiliki Username dan password
Pre-condition
yang telah terdaftar di dalam aplikasi.
Typical course of
System Response events
Actor Action
1. Membuka aplikasi 2. Membuka halaman
penjadwalan
Login
4. Cek kesesuaian
3. Memasukan
Username dan
Username
dan
password.
password, lalu klik 5. Menampilkan
tombol ‘masuk’.
halaman utama sesuai otentifikasi aktor
Jika terjadi kesalahan/ketidakcocokan otentifikasi
Alternate Course
Username dan password, maka sistem akan menampilkan pesan kesalahan.
Post-condition
Aktor berhasil masuk kedalam sistem.
Tabel 4. 9 Usecase input data pegawai
Usecase Name
Menginput Data Pegawai
Actor
Admin
Usecase ini menggambarkan aktor dapat
Description
menginput data pegawai pada aplikasi penjadwalan. Tabel dan Form data Pegawai telah ada dalam
Pre-condition
aplikasi.
System Response events
Typical course of
Actor Action
1. Memilih
menu 2. Menampilkan form pegawai input pegawai
inputan dari user
dengan label pada
aplikasi
sistem
5. Mengklik button 6. Menghubungkan
‘simpan’.
dengan database
7. Menampilkan data yang sudah di input kan.
Jika terjadi kesalahan saat menambahkan data
Alternate Course
maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 10 Usecase view data pegawai
Usecase Name
Melihat Data Pegawai
Actor
Admin Usecase ini menggambarkan aktor dapat melihat
Description
list data pegawai pada aplikasi penjadwalan. Tabel dan Form data Pegawai telah ada dalam
Pre-condition
aplikasi.
Typical course of
System Response events
Actor Action
1. Memilih menu 2. Menghubungkan Data pegawai dengan database
3. Menampilkan Data list data pegawai
yang diambil dari database
Jika terjadi kesalahan saat mengambil data dari
Alternate Course
database maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil ditampilkan.
Tabel 4. 11 Usecase edit data pegawai
Usecase Name
Mengedit Data Pegawai
Actor
Admin
Usecase ini menggambarkan aktor dapat
Description
mengubah data pegawai pada aplikasi penjadwalan. Tabel dan Form data Pegawai telah ada dalam
Pre-condition
aplikasi.
Typical course of
System Response events
Actor Action
1. Memilih menu 2. Menghubungkan List Pegawai dengan database
4. Menampilkan form
3. Klik button edit
edit data pegawai
5. Mengklik button 6. Menghubungkan
‘simpan’.
dengan database
7. Menampilkan data yang sudah di input kan.
Jika terjadi kesalahan saat mengubah data maka
Alternate Course
sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 12 Usecase view data pemesan
Usecase Name
Melihat Data Pemesan
Actor
Admin Usecase ini menggambarkan aktor dapat melihat
Description
list pemesan pada aplikasi penjadwalan. Tabel dan Form data Pemesan telah ada dalam
Pre-condition
aplikasi.
Typical course of
System Response events
Actor Action
1. Memilih menu 2. Menghubungkan list Pemesan dengan database
3. Menampilkan list pemesan
dari database
Jika terjadi kesalahan saat mengambil data dari
Alternate Course
database maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 13 Usecase view jadwal
Usecase Name
Melihat Jadwal
Actor
Admin Usecase ini menggambarkan aktor dapat melihat
Description
data jadwal pada aplikasi penjadwalan. Tabel dan Form data jadwal telah ada dalam
Pre-condition
aplikasi.
Typical course of
System Response events
Actor Action
1. Memilih menu 2. Mengubungkan penjadwalan deangan database
3. Menampilkan list jadwal
dari database
Jika terjadi kesalahan saat mengambil data dari
Alternate Course
database maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 14 Usecase input data pemesan
Usecase Name
Menginput Data Pemesan
Actor
Pegawai
Usecase ini menggambarkan aktor dapat
Description
menginput data pemesan pada aplikasi penjadwalan. Tabel dan Form data Pemesan telah ada dalam
Pre-condition
aplikasi.
System Response events
Typical course of
Actor Action
1. Memilih menu 2. Menampilkan form pemesan input pemesan
inputan dari user
dengan label pada
aplikasi
sistem
5. Mengklik button 6. Menghubungkan
‘simpan’.
dengan database
7. Menampilkan alert yang sudah di input kan.
Jika terjadi kesalahan saat menambahkan data
Alternate Course
maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 15 Usecasef view data pemesan
Usecase Name
Melihat Data Pemesan
Actor
Pegawai Usecase ini menggambarkan aktor dapat melihat
Description
data pemesan pada aplikasi penjadwalan. Tabel dan Form data pemesan telah ada dalam
Pre-condition
aplikasi.
System Response events
Typical course of
Actor Action
1. Memilih menu 2. Mengubungkan pemesan deangan database
3. Menampilkan list pemesan
dari database
Jika terjadi kesalahan saat mengambil data dari
Alternate Course
database maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 16 Usecase edit data pemesan
Usecase Name
Mengedit Data Pemesan
Actor
Pegawai
Usecase ini menggambarkan aktor dapat
Description
mengubah data pemesan pada aplikasi penjadwalan. Tabel dan Form data Pemesan telah ada dalam
Pre-condition
aplikasi.
Typical course of
System Response events
Actor Action
1. Memilih menu 2. Menghubungkan List Pemesan dengan database
4. Menampilkan form
3. Klik button edit
edit data pemesan
5. Mengklik button 6. Menghubungkan
‘simpan’.
dengan database
7. Menampilkan data yang sudah di input kan.
Jika terjadi kesalahan saat mengubah data maka
Alternate Course
sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 17 Usecase input jadwal
Usecase Name
Menginput Jadwal
Actor
Pegawai
Usecase ini menggambarkan aktor dapat
Description
menginput data jadwal pada aplikasi penjadwalan. Tabel dan Form data Jadwal telah ada dalam
Pre-condition
aplikasi.
Actor Action
System Response
1. Memilih menu 2. Menampilkan form penjadwalan input penjadwalan
inputan dari user
dengan label pada
Typical course of
5. Mengklik button 6. Menghubungkan
‘simpan’.
dengan database
7. Menampilkan alert yang sudah di input kan.
Jika terjadi kesalahan saat menambahkan data
Alternate Course
maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 18 Usecase view data jadwal
Usecase Name
Melihat Data Jadwal
Actor
Pegawai Usecase ini menggambarkan aktor dapat melihat
Description
data jadwal pada aplikasi penjadwalan. Tabel dan Form data jadwal telah ada dalam
Pre-condition
aplikasi.
Typical course of
System Response events
Actor Action
1. Memilih menu 2. Mengubungkan penjadwalan deangan database
3. Menampilkan list jadwal
dari database
Jika terjadi kesalahan saat mengambil data dari
Alternate Course
database maka sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
Tabel 4. 19 Usecase edit data jadwal
Usecase Name
Mengedit Data jadwal
Actor
Pegawai
Usecase ini menggambarkan aktor dapat
Description
mengubah data jadwal pada aplikasi penjadwalan. Tabel dan Form data Jadwal telah ada dalam
Pre-condition
aplikasi.
System Response events
Typical course of
Actor Action
1. Memilih menu
2. Menghubungkan
List
dengan database
Penjadwalan
4. Menampilkan form
3. Klik button edit
edit data penjadwalan
5. Mengklik button 6. Menghubungkan
‘simpan’.
dengan database
7. Menampilkan data yang sudah di input kan.
Jika terjadi kesalahan saat mengubah data maka
Alternate Course
sistem akan menampilkan pesan kesalahan.
Post-condition
Data berhasil tersimpan kedalam sistem.
4.3.2.4 Activity Diagram
Activity diagram pada sistem penjadwalan percetakan ini dibuat sesuai berdasarkan pada use case diagram yang menggambarkan aktivitas dari suatu sistem dan proses berjalannya suatu sistem. Berikut ini Activity diagram penjadwalan percetakan PT Dila Print.
1. Activity Diagaram Login
Gambar 4. 7 Activity Diagram Login
Pada gambar 4.7 Merupakan diagram Activity untuk Login. Sebelum user menggunakan aplikasi penjadwalan, terlebih dahulu User harus memasukkan username dan password. Setelah itu User akan masuk pada halaman awal sesuai hak askses yang telah ditentukan.
2. Activity Diagram Admin
Berikut ini merupakan activity diagram admin untuk mengelola data pada sistem penjadwalan percetakan pada PT Dila Print yang dapat memberikan gambaran alur aktivitas.
Gambar 4. 8 Activity Diagram admin input data pegawai
Pada gambar 4.8 merupakan diagram Activity untuk memasukkan data baru pegawai, dimana hanya admin yang memiliki akses untuk menginput data pegawai baru.
Gambar 4. 9 Activity Diagram admin edit data pegawai
Pada gambar 4.9 merupaka Activity diagram untuk mengedit/merubah data pegawai, dan dimana hanya admin memiliki akses untuk mengedit data tersebut.
Gambar 4. 10 Activity Diagram admin view data pegawai
Pada gambar 4.10 merupakan Activity diagram admin melihat data pegawai yang terdapat pada sistem panjadawalan, dan dimana hanya admin yang memiliki akses tersebut.
Gambar 4. 11 Activity Digram admin view data pemesan
Pada gambit 4.11 meruapakan Activity diagram admin melihat data pemesan pada aplikasi penjadwalan, dan pada Activity ini yang memiliki hak akses pada melihat data pemesan yaitu admin dan pegawai.
Gambar 4. 12 Activity Diagram admin melihat data jadwal
Pada gambar 4.12 merupakan Activity diagram melihat data jadwal pada sistem penjadwalan, dan yang memiliki akses pada menu adalah admin dan pegawai
3. Activity Diagram Pegawai
Berikut ini merupakan activity diagram pegawai untuk mengelola data pada sistem penjadwalan percetakan pada PT Dila Print yang dapat memberikan gambaran alur aktivitas.
Gambar 4. 13 Activity Diagram pegawai input data pemesan
Pada gambar 4.13 merupakan Activity diagram pegawai menginput data pemesan pada sistem penjadwalan, dan yang memiliki akses pada menu ini adalah pegawai.
Gambar 4. 14 Activity Diagram pegawai edit data pemesan
Pada gambar 4.14 merupakan Activity diagram mengubah atau mengedit data pemesan pada sistem penjadwalan, dan yang memiliki akses pada menu ini adalah pegawai.
Gambar 4. 15 Activity Diagram input data jadwal
Pada gambar 4.15 merupakan Activity diagram pegawai menginput data jadwal apda sistem penjadwalan, dan yang memiliki akses pada menu ini adalah pegawai.
Gambar 4. 16 Activity Diagram pegawai edit data jadwal
Pada gambar 4.16 merupakan activity diagram pegawai edit atau mengubah data jadwal pada sistem penjadwalan, dan yang memiliki akses pada menu ini adalah pegawai.
Gambar 4. 17 Activity Digaram pegawai view data jadwal
Pada gambar 4.17 meruapakan Activity diagram pegawai view atau melihat data jadwal pada sistem penjadwalan, dan mempunyai akses pada menu ini adalah pegawai dan admin.
4.3.2.5 Sequence Diagram
Sequence diagram menjelaskan secara detail urutan proses yang dilakukan dalam sistem untuk mencapai tujuan dari Usecase. Berikut ini akan digambarkan tentang Sequence diagram pada aplikasi penjadwalan percetakan: Sequence diagram menjelaskan secara detail urutan proses yang dilakukan dalam sistem untuk mencapai tujuan dari Usecase. Berikut ini akan digambarkan tentang Sequence diagram pada aplikasi penjadwalan percetakan:
Gambar 4. 18 Sequence Diagram admin tambah pegawai
Gambar 4. 19 Sequence Diagram Admin Edit Data Pegawai
Gambar 4. 20 Sequence Diagram Pegawai Add Jadwal
Gambar 4. 21 Sequence Pegawai edit jadwal
Gambar 4. 22 Sequence Pegawai view Jadwal
Gambar 4. 23 Sequence Pegawai Add Pemesan
Gambar 4. 24 Sequence Pegawai View Pemesan
Gambar 4. 25 Sequence Pegawai Edit Pemesan
4.3.2.6 Class Diagram
Class Diagram menggambarkan struktur objek sistem. Diagram ini menunjukan kelas objek yang menyusun sistem dan menghubungkan antara kelas objek kelas tersebut. Berikut ini akan mengambarkan tentang Class diagram pada aplikasi penjadwalan percetakan:
1. Login Pada Setiap user aplikasi ini memiliki method validasi login dan
logout . Berikut gambar diagram login.
2. Pegawai Pada bagian pegawai memuliki method tambah, lihat, ubah.
Berikut gambar diagram pegawai.
Gambar 4. 26 Class Diagram Pegawai
3. Pemesan Pada bagian pemesan memiliki method tambah, lihat, uabh.
Berikut gambar diagram pemesan.
Gambar 4. 27 Class Diagram Pemesan
4. Pesanan Pada bagian pesanan memiliki method tambah, lihat, dan ubah.
Berikut gambar diagram pesanan.
Gambar 4. 28 Class Diagram Pesanan
5. Detail Pemesan Pada Detail Pemesan meiliki method lihat. Berikut gambar
diagram detail pesanan.
Gambar 4. 29 Class Diagram Detail Pesanan
6. Data Jadwal Pada Data Jadwal memiliki method view. Berikut gamabr
diagram data jadwal.
Gambar 4. 30 Class Diagram Data Jadwal
4.3.2.7 Perancangan Interface
Perancangan interface (tampilan) adalah salah satu fase yang penting dalam merancang aplikasi. Perancangan tampilan ini diperlukan untuk memberikan gambaranseperti apa aplikasi yang akan dibangun. Aplikasi ini menerapkan interface yang User friendly. Aplikasi ini terdiri dari 2 pengguna (user) yaitu admin dan pegawai. Berikut ini dijelaskan mengenai perancangan tampilan aplikasi penjadwalan percetakan:
a. Rancangan Tampilan Login
Gambar 4. 31 Rancangan Tampilan Login
Gambar 4.31 Diatas adalah rancangan tampilan login dimana user harus memasukkan username dan password terlebih dahulu sebelum menggunakan sistem penjadwalan
b. Halaman Home
Gambar 4. 32 Rancangan Halaman Home
Gambar 4.32 diatas adalah rancangan halaman utama ketika user telah melakukan login yang berdasarkan username dan password
c. Form Add Pegawai
Gambar 4. 33 Form Add Pegawai
Gambar 4.33 diatas merupakan rancangan tampilan form dimana admin ingin menambahkan pegawai baru.
d. Halaman List Pegawai
Gambar 4. 34 Halaman List Pegawai
Gambar 4.34 diatas merupakan rancangan tampilan dari halaman list pegawai jika admin ingin melihat list pegawai.
e. Form Edit Data Pegawai
Gambar 4. 35 Form Edit Data Pegawai
Gambar 4.35 diatad merupakan rancangan tampilan form edit data pegawai jika admin ingin mengubah data pegawai.
f. Form Add Pemesan
Gambar 4. 36 Form Add Pesanan
Gambar 4.36 merupakan desain form menambah/add data pesanan dimana pegawai input data pesanan.
g. Form Add Pemesan
Gambar 4. 37 Form Add Pemesan
Gambar 4.37 merupakan desain dari form dari add atau tambah data pemesan, pada bagian pegawai ini menambahkan data pemesan yang sesuai data diri dari pemesan.
h. Halaman List Pemesan
Gambar 4. 38 Hamalam List Pemesan
Gambar 4.38 merupakan desain halaman list data pemesan, halaman ini berguna sebagai laporan dari jumlah keseluruhan pemesan.
i. Halaman Generate
Gambar 4. 39 Halaman Generate Jadwal
Gambar 4.38 merupakan desain halaman generate jadwal, halaman ini akan merujuk kepada jadwala yang akan dikerjakan pegawai percetakan, dan job mana yang akan dikerjakan.