Pada bagian pemodelan sistem, akan dirancang bagaimana nantinya sistem diharapkan bekerja. Pemodelan ini menggunakan UML (Unified Modelling Languange) .
a. Use Case Diagram
Use case diagram digunakan untuk menggambarkan kumpulan tindakan yang harus sistem kerjakan dalam kolaborasi dengan satu atau lebih external users dari sistem (aktor).
Gambar 3.2 Use Case
Use case pada gambar 3.1 menjelaskan aksi yang dapat dilakukan oleh user. User dapat , melihat daftar project, dan juga bisa membuat project AHP dan SAW.
b. Activity Diagram
Activity diagram adalah diagram yang menunjukkan alur dari kontrol atau alur objek dengan menekankan pada urutan dan kondisi dari dari alur. Activity diagram untuk penelitian ini penulis membagi dalam 2 bagian , AHP dan SAW.
Gambar 3.3 activity diagram Untuk AHP
c. Sequence Diagram
Sequence Diagram ialah interaksi menggambarkan interaksi diantara actor dan sistem dalam scenario use case. Sequence diagram untuk penelitian ini penulis membagi dalam 2 bagian , sequence diagram AHP dan sequence diagramSAW.
Gambar 3.5 Sequence Diagram AHP
Gambar 3.6 Sequence Diagram SAW
d. Flowchart
Flowchart membantu menyusun gambaran aliran program sehingga lebih mudah dipahami. Berikut flowchart AHP dan SAW :
Gambar 3.8 Flowchart SAW
3.2 Perancangan Interface
a. Page Login
Page Login adalah page yang pertama kali muncul saat mengakses aplikasi ini. Pada page ini terdapat form yang berisi Nama dan sandi yang harus di isi oleh user.
Gambar 3.9 Rancangan Tampilan Page Login
Keterangan :
1. Judul dari aplikasi.
2. Textfield yang merupakan nama dari pengguna aplikasi.
3. Textfield yang merupakan sandi yang digunakan untuk mengakses aplikasi. 4. Button untuk memproses form login.
Gambar 3.10 Rancangan Tampilan Page Utama
Judul 1 Nama Sandi Submit 2 3 4 Judul
Beranda Daftar Projek AHP SAW Logout 5
6
4 3
Keterangan :
1. Menu Beranda adalah menu untuk kembali ke menu utama.
2. Daftar Projek adalah menu untuk melihat projek yang sudah dibuat.
3. AHP adalah menu yang memproses bobot dengan menerapkan algoritma AHP. 4. SAW adalah menu yang memproses bobot dengan menerapkan algoritma SAW. 5. Logout adalah menu untuk keluar dari aplikasi.
6. Judul Aplikasi.
Ketika user memilih menu daftar projek maka page selanjutnya yang akan ditampilkan adalah page daftar projek .
Gambar 3.11 Rancangan Tampilan Menu Daftar Projek
Judul
Id Projek Judul Projek di Postkan Oleh: Proses Hapus
11
6 7 8 9 10
Home Daftar Projek AHP SAW Logout 5 4
3
Keterangan :
1. Menu beranda adalah menu untuk kembali ke menu utama.
2. Daftar Projek adalah menu untuk melihat projek yang sudah dibuat.
3. AHP adalah menu yang memproses bobot dengan menerapkan algoritma AHP. 4. SAW adalah menu yang memproses bobot dengan menerapkan algoritma SAW. 5. Keluar adalah menu untuk keluar dari aplikasi.
6. Id Projek adalah menu yang menampilkan id dari projek 7. Judul projek adalah menu yang menampilkan judul dari projek. 8. Dipostkan oleh : adalah menu yang menampilkan nama dari pengguna. 9. Proses adalah menu yang menampilkan proses dari projek.
10. Hapus adalah menu yang digunakan untuk menghapus projek. 11. Judul aplikasi
Ketika user memilih menu AHP page yang ditampilkan:
Gambar 3.12 Rancangan Tampilan AHP
Beranda Daftar Projek AHP SAW Keluar
Judul 1 2 3 4 5 6 Nama Projek Submit 8 7
Keterangan :
1. Menu beranda adalah menu untuk kembali ke menu utama.
2. Daftar Projek adalah menu untuk melihat projek yang sudah dibuat.
3. AHP adalah menu yang memproses bobot dengan menerapkan algoritma AHP. 4. SAW adalah menu yang memproses bobot dengan menerapkan algoritma SAW. 5. Logout adalah menu untuk keluar dari aplikasi.
6. Judul aplikasi.
7. Nama projek adalah textfield yang digunakan untuk mengisi nama dari projek AHP. 8. Submit adalah button yang digunakan untuk memproses nama projek.
Ketika user mengklik button tambah maka page yag selanjutnya di load adalah page Kriteria AHP .
Gambar 3.13 Rancangan Tampilan Kriteria AHP
Beranda Kriteria Bandwidth LOS Security Service Price RAM Processor SAW
1 2 3 4 5 6 7 8 9
Submit 11
12
Keterangan:
1. Beranda adalah menu untuk kembali ke menu utama. 2. Kriteria adalah menu untuk menampilkan page kriteria. 3. Bandwidth adalah menu untuk menampilkan page Bandwidth. 4. LOS adalah menu untuk menampilkan page LOS.
5. Security adalah menu untuk menampilkan page Security. 6. Service adalah menu untuk menampilkan page Service. 7. Price adalah menu untuk menampilkan page Price. 8. RAM adalah menu untuk menampilkan page RAM.
9. Processor adalah menu untuk menampilkan page Processor. 10. SAW adalah menu untuk meload page SAW.
11. Matriks perbandingan pasangan Kriteria.
12. Submit adalah button yang digunakan untuk memproses form Kriteria.
Ketika user mengklik button tambah maka page yang selanjutnya ditampilkan adalah page alternatif dimana terbagi kedalam beberapa page yaitu : Bandwidth, LOS, Security, Service, Price, RAM, Processor.
Gambar 3.14 Rancangan Tampilan Alternatif AHP
Keterangan :
1. Beranda adalah menu untuk kembali ke menu utama. 2. Kriteria adalah menu untuk meload page kriteria. 3. Bandwidth adalah menu untuk meload page Bandwidth. 4. LOS adalah menu untuk meload page LOS.
5. Security adalah menu untuk meload page Security. 6. Service adalah menu untuk meload page Service. 7. Price adalah menu untuk meload page Price. 8. RAM adalah menu untuk meload page RAM.
9. Processor adalah menu untuk meload page Processor. 10. SAW adalah menu untuk meload page SAW.
11. Matriks perbandingan pasangan Alternatif.
12. Submit adalah button yang digunakan untuk memproses form Alternatif.
Beranda Kriteria Bandwidth LOS Security Service Price RAM Processor SAW
1 2 3 4 5 6 7 8 9
Submit
11
12
Setelah semua alternatatif terisi langkah selanjutnya yang ditampilkan adalah page SAW.
Gambar 3.15 Page SAW
Beranda Kriteria Bandwidth LOS Security Service Price RAM Processor SAW
1 2 3 4 5 6 7 8 9
Submit 13
10
Kriteria Bandwidth LOS Security Service Price RAM Processor SAW Benefit/cost
11
Keterangan :
1. Beranda adalah menu untuk kembali ke menu utama. 2. Kriteria adalah menu untuk meload page kriteria. 3. Bandwidth adalah menu untuk meload page Bandwidth. 4. LOS adalah menu untuk meload page LOS.
5. Security adalah menu untuk meload page Security. 6. Service adalah menu untuk meload page Service. 7. Price adalah menu untuk meload page Price. 8. RAM adalah menu untuk meload page RAM.
9. Processor adalah menu untuk meload page Processor. 10. SAW adalah menu untuk meload page SAW.
11. Adalah tabel yang berisi vektor eigen dari kriteria. 12. Matriks yang berisi vektor eigen dari Alternatif.
13. Submit adalah button yang digunakan untuk memproses page SAW.
Ketika button submit di klik maka page selajutnya yang akan ditampilkan adalah page normalisasi SAW.
Gambar 3.16 Tampilan Normalisasi SAW
Beranda Kriteria Bandwidth LOS Security Service Price RAM Processor SAW
1 2 3 4 5 6 7 8 9
Simpan
11
12
Keterangan :
1. Beranda adalah menu untuk kembali ke menu utama. 2. Kriteria adalah menu untuk meload page kriteria. 3. Bandwidth adalah menu untuk meload page Bandwidth. 4. LOS adalah menu untuk meload page LOS.
5. Security adalah menu untuk meload page Security. 6. Service adalah menu untuk meload page Service. 7. Price adalah menu untuk meload page Price. 8. RAM adalah menu untuk meload page RAM.
9. Processor adalah menu untuk meload page Processor. 10. SAW adalah menu untuk meload page SAW.
11. Matriks normalisasi dari SAW.
12. Simpan adalah button yang digunakan untuk Menyimpan projek.
Setelah disimpan selanjutnya user bisa melihat kembali projek atau keluar dari aplikasi. Gambar 3.16 adalah rancangan tampilan untuk menampilkan data yang sudah disimpan.
Gambar 3.17 Tampilan Data yang sudah disimpan
Keterangan :
1. Beranda adalah menu untuk kembali ke menu utama. 2. Kriteria adalah menu untuk meload page kriteria. 3. Bandwidth adalah menu untuk meload page Bandwidth. 4. LOS adalah menu untuk meload page LOS.
5. Security adalah menu untuk meload page Security. 6. Service adalah menu untuk meload page Service. 7. Price adalah menu untuk meload page Price. 8. RAM adalah menu untuk meload page RAM.
9. Processor adalah menu untuk meload page Processor. 10. SAW adalah menu untuk meload page SAW.
11. Tabel yang berisi hasil dari proses AHP dan SAW.
12. Button yang digunakan untuk Menampilkan page yang selanjutnya.
Beranda Kriteria Bandwidth LOS Security Service Price RAM Processor SAW
1 2 3 4 5 6 7 8 9
Submit
11
12