BAB 3
Perancangan atau Metode Penelitian
Untuk memudahkan dalam pembuatan aplikasi sistem informasi geografis persediaan darah di PMI wilayah Jateng maka diperlukan perancangan sistem agar dalam pembuatan dapat lebih terarah. Perancangan sistem disesuaikan dengan kebutuhan yaitu untuk membangun apilkasi sistem informasi yang dapat membantu PMI Kab/kota memperbaharui informasi tentang data jumlah persediaan darah dan menentukan jarak yang terdekat pada pencarian lokasi persediaan darah di PMI wilayah Jawa Tengah.
Sebelum melakukan perancangan sistem, langkah–langkah yang dilakukan antara lain : studi pustaka, pengumpulan data untuk perancangan sistem, pengolahan data, dan perancangan sistem.
Pada tahap studi pustaka ini dikumpulkan bahan dari beberapa sumber, seperti media internet, jurnal-jurnal, dan beberapa buku referensi yang membahas tentang PMI wilayah Jateng, WebGIS, pemetaan, Google Maps API, dan framework
CodeIgniter. Pengumpulan data untuk perancangan sistem dilakukan pengumpulan data-data tentang PMI di wilayah di Jawa Tengah. Data diperoleh dari melakukan dengan survei untuk pengambilan data dan melakukan wawancara di PMI Provinsi Jawa Tengah. Dalam proses pengolahan data, setiap data yang terkumpul diolah untuk selanjutnya digunakan sebagai acuan perancangan sistem informasi geografis persediaan darah di PMI wilayah Jateng.
Untuk perancangan sistem digunakan metode Waterfall.
perangkat lunak yang dibuat secara terstruktur dan berurutan dimulai dari analisis kebutuhan, perancangan sistem dan perangkat lunak, implementasi dan pengujian unit, integrasi dan pengujian sistem, operasi dan pemeliharan sistem. Bagan Waterfall model dapat dilihat pada Gambar 3.1.
Gambar. 3.1 Metode Waterfall (Pressman, 2001)
3.1
Analisis Kebutuhan
Tahap ini untuk mengetahui dan menerjemahkan semua permasalahan serta kebutuhan perangkat lunak dan kebutuhan sistem yg dibangun. Analisis kebutuhan dilakukan dengan melakukan pencarian data-data serta informasi-informasi yang dibutuhkan oleh sistem. Ada empat analisis kebutuhan dalam perancangan sistem yaitu analisis kebutuhan sistem, analisis kebutuhan data, analisis kebutuhan perangkat keras dan analisis kebutuhan perangkat lunak.
wawancara kepada pegawai bidang IT di Kantor PMI Provinsi Jateng yang terletak di Jl. Tanjung No. 11 A Semarang. Untuk hasil wawancara dapat dilihat dalam lampiran 1. Dalam tahap ini dilakukan analisis terhadap kebutuhan pengguna, kebutuhan pengguna tersebut antara lain :
a. Guest yang merupakan masyarakat umum diharapkan dapat memperoleh informasi tentang PMI di wilayah Jateng. Informasi tersebut adalah berita mengenai aktivitas dari PMI dan publikasinya, berita tentang diklat PMI, berita dari Unit Donor Darah, berita tentang logistik dan Posko PMI, data tentang
persediaan darah terbaru, profil dari masing-masing
kabupaten/kota PMI di wilayah Jateng beserta dengan letak tiap-tiap PMI kabupaten/kota. Selain itu, Guest dapat melakukan pencarian lokasi terdekat yang memiliki persediaan golongan darah tertentu serta dapat mendaftar sebagai member PMI. b. Group Members PMI dapat melihat informasi tentang PMI
wilayah Jateng selayaknya Guest dan dapat menuliskan berita tentang PMI dan komentar berita.
c. Operator dari setiap PMI kabupaten/kota dapat melihat informasi tentang PMI wilayah Jateng, menuliskan berita tentang PMI serta melakukan update atau merubah data persediaan darah.
data persediaan darah dan profil PMI kabupaten/kota di wilayah Jateng.
Ketersediaan data sangat mempengaruhi perancangan sistem yang akan dibangun. Dari analisis kebutuhan data, dibutuhkan data tentang informasi terbaru dari persediaan darah di tiap-tiap PMI wilayah Jateng, alamat PMI di masing-masing daerah dan PMI Provinsi Jateng serta data lain yang terkait, yaitu berita donor darah, diklat PMI Jateng, aksi PMI serta Unit Donor Darah, posko-posko yang dibuat PMI, dan agenda kegiatan PMI wilayah Jateng .
Analisis kebutuhan perangkat keras untuk kriteria minimum, spesifikasi perangkat keras yang disarankan dalam penerapan sistem informasi geografi yang akan dibangun adalah :
- Processor Intel
- RAM 2 GB
- VGA on board
- Standar optical mouse dan keyboard
- Monitor resolusi 1024 x 768 pixel
Analisis kebutuhan perangkat lunak yang akan digunakan: - Sistem operasi Windows 7
- Google Maps API 3
- XAMPP 4.7.1
- Web browser : Internet Explorer atau Mozilla Firefox
- Dreamever 8
3.2
Perancangan Sistem dan Perangkat Lunak
Untuk perancangan sistem dan perangkat lunak meliputi penyusunan UML (Unified Modelling Language), desain database, dan desain user interface.
Aplikasi sistem informasi geografis ini akan dirancang menggunakan UML sebagai pemodelan sistem dan akan digambarkan dengan sarana perangkat lunak yaitu Rasional Rose. UML menyediakan beberapa diagram dalam proses perancangan sistem. Penyusunan UML untuk aplikasi ini digunakan lima diagram yaitu Use Case Diagram, Activity Diagram, Class Diagram, Sequence Diagram, dan Deployment Diagram.
3.2.1
Use Case Diagram
Use Case Diagra m menggambarkan interaksi antara aktor-aktor dengan sistem yang dibangun serta menggambarkan fungsionalitas yang dapat diberikan sistem kepada user. Dari dalam sistem yang akan dibangun terdapat empat aktor yang masing-masing memiliki hak akses yang berbeda-beda yaitu guest, member,
operator dan admin. Guest adalah masyarakat umum yang bisa mengakses sistem informasi dan mencari data tentang PMI di
wilayah Jateng. Member merupakan masyarakat umum yang
mendaftar, kemudian telah dikonfirmasi oleh admin dan telah masuk sebagai member dalam group PMI Jateng, sedangkan operator
adalah pegawai dari tiap-tiap PMI kabupaten/kota di wilayah Jateng.
Gambar 3.2 Use case diagram sistem
Gambar 3.2 menjelaskan interaksi antara aktor dalam sistem serta fungsionalitas yang diberikan kepada guest, member, operator serta admin. Mengenai bagian-bagian yang tersedia untuk hak akses guest yaitu melihat profil PMI kabupaten/kota di wilayah Jateng, melihat berita PMI, melihat data persediaan darah dari masing-masing PMI kabupaten/kota di wilayah Jateng, mengisi buku tamu serta mendaftar sebagai member PMI Jateng. Selain itu
Hak akses yang dapat dilakukan oleh seorang member
setelah melakukan login adalah mencari lokasi PMI kabupaten/kota di wilayah Jateng, melihat berita PMI, melihat persediaan darah yang ada di PMI, melihat galeri, melihat profil PMI kabupaten/kota di wilayah Jateng,serta menambah berita PMI.
Hak akses seorang operator hampir sama dengan hak akses seorang member, yaitu melihat data persediaan darah, melihat berita PMI, mencari lokasi PMI kabupaten/kota, melihat galeri, melihat profil PMI kabupaten/kota, menambah berita PMI. Hak akses yang membedakan member dan operator dalah hak untuk mengubah data persediaan darah sesuai dengan PMI kabupaten/kota daerah masing-masing.
Seorang admin memiliki hak akses penuh untuk mengatur atas sistem yang akan dibuat. Hak akses admin adalah mengelola data persediaan darah, mengelola galeri, mengelola operator,
mengelola member group PMI, mengelola berita PMI, mengelola profil PMI kabupaten/kota. Dalam mengubah data persediaan darah dari masing-masing PMI kabupaten/kota wilayah Jateng. Mengelola
operator yang dilakukan admin adalah dengan menambah dan menghapus operator dari masing-masing PMI kabupaten/kota.
Dalam sistem akan dibuat sebuah group PMI Jateng, yang anggotanya adalah masyarakat umum yang mendaftar melalui
3.2.2
Activity Diagram
Activity diagram menggambarkan aliran aktifitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Dalam sistem akan dibuat dua bentuk activity diagram. Masing-masing diagram mewakili aktifitas setiap aktor dalam menggunakan sistem.
Gambar 3.3 Activity diagramGuest
Gambar 3.4 Activity diagramMember
Gambar 3.4, menggambarkan aktivitas member yaitu setelah
Gambar 3.5 Activity diagramOperator
Gambar 3.5 menggambarkan aktivitas operator yaitu setelah
login seorang operator dapat mengubah username dan password
milik operator tersebut, melihat data persediaan darah, melihat berita PMI, mencari lokasi PMI kabupaten/kota, melihat profil PMI kabupaten/kota, ubah data persediaan darah sesuai dengan lokasi PMI kabupaten/kota dimana operator bekerja, serta menambah berita PMI . Aktifitas berakhir dengan logout yang dilakukan oleh
Gambar 3.6 Activity diagramadmin
3.2.3
Sequence Diagram
Sequence diagram menggambarkan interaksi antar objek didalam dan disekitar sistem, berupa pesan yang digambarkan terhadap waktu. Sequence diagram terdiri antar dimensi vertikal (waktu) dan dimensi horizontal (objek-objek yang terkait).
Gambar 3.7 merupakan sequence diagram untuk proses melihat daftar PMI dan UDD Kab/kota se-Jawa Tengah serta melihat profil masing-masing PMI Kab/kota. Selain itu terlihat proses pencarian jalur yang terpendek PMI kabupaten/kota yang dilakukan oleh seorang guest. Penjelasan proses untuk pencarian jalur yang terpendek adalah sebagai berikut: pertama guest
membuka aplikasi dan memilih menu rute antar PMI se-jateng kemudian memasukkan kota atau daerah dari PMI wilayah Jateng yang akan dicari maka pada controller GisPmiJatengakan meminta data yang berupa alamat PMI kab/kota dari basis data melalui model
: guest : GisPmiJateng : GisPmiModel : gmap pmi_sejateng( )
udd_sejateng( )
getPmi( )
get Udd( )
baca_profil( )
getProfilPmi( ) return( ) tampil( )
return( ) tampil( )
return( ) tampil( )
direction_map( )
baca_pmicabang( ) return( )
direction() return( ) tampil( )
: guest : Bukutamu : BukuTamuModel : pmijateng baca_bukutamu( )
getBukutamu( )
getbukutamu( )
tambah_pesan( )
tambah_pesan( )
save() konfirmasi()
konfirmasi()
Gambar 3.8 Sequence diagram Guest mengisi buku tamu
Gambar 3.8 merupakan sequence diagram dari proses seorang guest melihat dan mengisi buku tamu. Untuk melihat pesan-pesan dalam buku tamu, maka class Bukutamu pada controller akan memanggil class BukuTamuModel, selanjutnya data-data tentang pesan dalam buku tamu akan ditampilkan. Untuk penulisan pesan dalam buku tamu, ketika pesan dikirim maka controller akan mengecek valid atau tidaknya pesan yang di-input-kan. Jika data
: member : berita : BeritaModel : pmijateng
baca_berita( ) getBerita( )
tulis_berita( )
tulis_berita( )
tulis_komentar_berita( )
tulis_komentar( ) return( )
tampil( )
save()
konfirmasi( )
save()
konfirmasi( )
Gambar 3.9 Sequence Diagram untuk member menambah berita
Pada Gambar 3.9, terlihat proses dari seorang member untuk melihat berita, menambahkan berita dan menulis komentar berita. Untuk proses menambahkan berita tentang PMI proses yang terjadi adalah ketika data berita telah di-input-kan maka class berita pada
controller akan mengecek apakah data yang dimasukkkan tersebut
data telah disimpan maka controller akan mengirim konfirmasi kepada member bahwa berita telah tersimpan dan menunggu konfirmasi dari admin. Berita yang dimasukkan member tidak langsung ditampilkan namun menunggu konfirmasi aktifasi dari admin. Hal ini dimaksudkan agar setiap berita yang dimasukkan
member dapat dilihat terlebih dahulu apakah berita yang ditambahkan layak untuk ditampilkan atau tidak. Ketentuan layak atau tidaknya berita ditentukan berdasarkan aturan-aturan dalam PMI Provinsi Jawa Tengah.
Selanjutnya untuk proses penulisan komentar berita, ketika komentar berita telah di-input-kan maka class berita pada controller
: operator : StokDarah : StokDarahModel : pmijateng
data pmijateng. Ketika data berhasil disimpan maka controller akan mengirim konfirmasi kepada operator.
: admin
: controlgallery : gallerymodel : pmijateng
lihat_galeri( )
Gambar 3.11 Sequence Diagram untuk admin mengelola galeri Untuk proses melihat gambar, menambah gambar dan menghapus gambar pada galeri yang dilakukan admin terlihat pada Gambar 3.11. Penampilan gambar-gambar pada geleri melewati proses sebagai berikut. Ketika admin mengiinginkan untuk melihat galeri maka class controlgallery akan meminta data gambar kepada
dikembalikan ke controller dan ditampilkan kepada admin. Ketika admin menambah gambar maka class controlgallery pada controller
akan mengirim gambar yang di-uploa d ke gallerymodel agar disimpan dalam basis data pmijateng. Setelah gambar berhasil disimpan akan dikirim konfirmasi kepada admin. Begitu juga ketika menghapus gambar, class hapus_gambar pada controller akan memanggil class gallerymodel agar data dihapus dari basis data pmijateng, jika gambar berhasil dihapus akan muncul konfirmasi kepada admin.
3.2.4
Class Diagram
Pada Gambar 3.12 merupakan Class sistem. Untuk perancangan class yang akan dibuat pada aplikasi tersebut adalah
class berita, class BeritaModel, class user_controller, class
user_model, class controlgallery, class gallerymodel, class
StokDarah, class StokDarahModel, class BukuTamu, class
BukuTamuModel , class GisPmiJateng, class GisPmimodel.
Pada class diagram sistem dapat diketahui terdapat enam relasi one to many, yaitu antara class berita dan class BeritaModel, class user_controller dan class user_model, class controlgallery dan class gallerymodel, class StokDarah dan class StokDarahModel, class BukuTamu dan class BukuTamuModel, class GisPmiJateng
dan class GisPmimodel.
3.2.5
Deployment Diagram
Gambar 3.13 Deployment Diagram sistem
yang akan dibuat, terlihat bahwa ada beberapa perangkat yang digunakan saat deployment, yaitu sebuah komputer yang bertugas sebagai server yang di dalamnya terdapat database yang mengakses
Google Maps API untuk menampilkan peta serta komputer client
yang bertindak sebagai pengguna aplikasi atau client. Client
melakukan request ke server, kemudian server melakukan proses pencarian data PMI Kab/kota yang juga dihubungkan ke Google Maps untuk menampilkan peta.
3.2.6
Perancangan Arsitektur MVC
Framework Codeigniter merupakan framework yang menggunakan arsitektur pola pengembangan MVC. MVC ini membagi pengembangan aplikasi dalam tiga bagian yaitu Model, View dan Controller. Dengan menggunakan prinsip MVC suatu aplikasi dapat dikembangkan sesuai dengan kemampuan developer -nya, yaitu progra mmer yang menangani bagian model dan
controller, sedangkan designer yang menangani bagian view, sehingga penggunaan arsitektur MVC dapat meningkatkan
tampilan yang merupakan bagian yang berinteraksi langsung dengan pengguna. Perubahan pada satu bagian memiliki potensi keterkaitan dengan keseluruhan aplikasi. Namun dengan digunakannya arsitektur MVC, permasalahan ini dapat diatasi.
Model merupakan bagian yang bertugas merepresentasikan data yang digunakan oleh aplikasi sebagaimana proses bisnis yang
diasosiasikan terhadapnya. Bagian Model yang dibangun
berhubungan langsung dengan basis data dan menangani validasi dari bagian Controller, namun tidak berhubungan langsung dengan
view. Model dalam aplikasi ini tergabung dalam sebuah package
yaitu models didalamnya terdapat class-class yang berhubungan dengan basis data, yaitu package models yaitu BeritaModel, BukuTamumodel, Galerimodel2, GisPmiModel, StokDarahModel, admin_model, dbpmi dan user_model.
View merupakan bagian yang menangani presentation logic. View berfungsi untuk menerima dan merepresentasikan data kepada user. Pada aplikasi web bagian ini biasanya berisi file
template HTML yang diatur oleh Controller.. Bagian ini tidak memiliki akses langsung terhadap bagian Model. Perancangan yang dilakukan pada bagian View dikelompokkan dalam package-package untuk lebih memudahkan dalam pengembangan, yaitu:
a. Package admin : berisi file-file php untuk tampilan halaman admin.
b. Package berita : berisi file-file php untuk menangani tampilan pada menu Berita.
d. Packagedarah: berisi file-file php untuk menangani tampilan
g. Packagehtml berisi template untuk tampilan halaman user. h. Package informasi berisi file-file php untuk menangani
tampilan informasi umum PMI Provinsi Jawa Tengah.
i. Package pmi_cabang berisi file-file php untuk menangani tampilan daftar alamat UDD dan Kantor PMI Kab/Kota se-Jawa Tengah.
j. Package user berisi file-file php untuk menangani tampilan untuk login user dan pendaftaran member.
Controller merupakan bagian logic yang menyatukan antar bagian atau sebagai jembatan untuk model, view dan library atau
helper yang ada pada CodeIgniter .Controller akan menerima
3.2.7
Desain User Interface
Perancangan antarmuka dibuat sebagai Gambaran tentang bentuk fisik aplikasi yang akan dibuat. Berikut ini desain untuk rancangan antar muka aplikasi :
Gambar 3.14 Desain Halaman utama sistem PMI di wilayah Jateng
Gambar 3.14 merupakan desain dasar untuk aplikasi yang dibuat yaitu dengan sebuah header dibagian atas, sebuah panel menu dan form login disebelah kiri dan sebuah panel untuk isi dari web disebelah kanan.
Gambar 3.15 adalah perancangan desain untuk halaman yang menampilkan peta dari Google Maps. Peta yang ditampilkan berupa rute hasil dari pencarian lokasi dengan jumlah pesediaan darah minimal yang diharapkan.
Gambar 3.16 Desain Form buku tamu
Gambar 3.16 merupakan rancangan form buku tamu untuk
guest. Seorang guest dapat memberikan kritik, saran dan pertanyaan kepada PMI Provinsi Jawa Tengah dengan mengisi pada form buku tamu.
Gambar 3.17 Desain Desain Form tambah berita