BAB II LANDASAN TEORI
2.7 Tools Perancangan Sistem
4.3.2 Desain Arsitektural
Desain arsitektural dibuat dalam bentuk Data Flow Diagram (DFD) yang menjelaskan langkah- langkah aliran data pada syitem ini yang dituangkan dalam bentuk diagram berikut ini:
4.3.2.1 Data Flow Diagram (DFD) 1. Diagram konteks yang diusulkan
Gambar 4.7 Context Diagram
Context diagram diatas menjelaskan proses dan aktor yang terlibat dalam sistem informasi potensi perikanan kabupaten Cirebon. Proses yang ada meliputi peta potensi lokasi perikanan, data tabular, buku tamu, berita dan profil kabupaten cirebon. Dari sistem tersebut juga dapat melakukan proses pembuatan laporan.
2. DFD level 1 yang diusulkan
Gambar 4.8 Diagram level 1
Gambar diagram level 1 dari sistem informasi potensi perikanan kabupaten Cirebon yang menampilkan menu lebih rinci dibanding dengan context diagram. Dalam diagram level 1 terdapat lima menu yang terdapat dalam sistem yaitu:
1. Peta Potensi Perikanan
Peta potensi perikanan merupakan menu utama dari sistem dimana didalamnya terdapat gambar peta yang menunjukkan lokasi potensi perikanan kabupaten Cirebon. Dalam peta potensial juga berisi data dari potensi perikanan dan lokasi tempat potensi perikanan tersebut.
2. Data Tabular
Menu Data tabular merupakan menu yang berfungsi untuk menampilkan lebih rinci potensi perikanan, hasil pemanfaatan perikanan dan statistik perikanan kabupaten Cirebon.
3. Profil
Menu profil berisi sebagai menu yang digunakan untuk menampilkan informasi dan profil kabupaten Cirebon kepada masyarakat umum atau pengguna sistem.
4. Berita
Menu berita merupakan menu yang berfungsi untuk Menapilkan informasi yang berhubungan dengan perikanan yang bermanfaat untuk menunjang kebutuhan informasi yang diperlukan masyarakat. Menu berita juga dapat berisi tentang kegiatan atau acara yang dilakukan oleh dinas kelautan dan perikanan kabupaten Cirebon.
5. Buku Tamu
Menu buku tamu merupakan menu yang disediakan untuk berinteraksi dengan masyarakat atau pengguna dengan meninggalkan pesan atau pertanyaan seputar potensi perikanan kabupaten Cirebon.
3. DFD Level 2 yang diusulkan
Gambar 4.9 Diagram level 2 proses 1
Gambar diatas menjelaskan proses lebih rinci dari proses 1 yaitu proses peta potensi. Dalam proses ini hal yang dilakukan adalah user melihat peta potensial ke sistem kemudian sistem memberikan respon balik dengan memberikan informasi peta potensi perikanan kabupaten Cirebon.
Proses selanjutnya yaitu berhubungan dengan admin dimana admin melakukan proses update peta potensi untuk menampilkan hasil dari peta potensi yang baru. Setelah admin sukses melakukan update peta maka sistem akan menampilkan informasi peta yang baru yang telah di update.
Gambar 4.10 Diagram level 2 proses 2
Gambar diatas menjelaskan proses lebih rinci dari proses 2 yaitu proses Data tabular. Dalam proses ini hal yang dilakukan adalah user melihat data tabular ke sistem kemudian sistem memberikan respon balik dengan menampilkan informasi data tabular yang telah dipilih oleh user.
Proses selanjutnya yaitu berhubungan dengan admin dimana admin melakukan proses update data tabular untuk memberikan informasi baru kepada user. Setelah admin sukses melakukan update data tabular maka sistem akan menampilkan informasi data tabular yang baru yang telah di update.
Gambar 4.11 Diagram level 2 proses 3
Gambar diatas menjelaskan proses lebih rinci dari proses 3 yaitu proses profil. Dalam proses ini hal yang dilakukan adalah user melihat profil ke sistem kemudian sistem memberikan respon balik dengan menampilkan informasi profil.
Proses selanjutnya yaitu berhubungan dengan admin dimana admin melakukan proses update informasi profil untuk memberikan informasi baru
kepada user. Setelah admin sukses melakukan update peta maka sistem akan menampilkan informasi profil yang baru yang telah di update.
Gambar 4.12 Diagram level 2 proses 4
Gambar diatas menjelaskan proses lebih rinci dari proses 4 yaitu proses berita. Dalam proses ini hal yang dilakukan adalah user melihat berita ke sistem kemudian sistem memberikan respon balik dengan menampilkan berita yang telah dipilih oleh user.
Proses selanjutnya yaitu berhubungan dengan admin dimana admin melakukan proses update berita untuk memberikan informasi baru kepada user. Setelah admin sukses melakukan update berita maka sistem akan menampilkan berita hasil update tersebut diurutan teratas pada menu berita.
Gambar 4.13 Diagram level 2 proses 5
Gambar diatas menjelaskan proses lebih rinci dari proses 5 yaitu proses buku tamu. Dalam proses ini hal yang dilakukan adalah user mengisi buku tamu ke sistem kemudian sistem memberikan respon balik dengan menampilkan data buku tamu yang telah diisi oleh user.
Proses selanjutnya yaitu berhubungan dengan admin dimana admin melihat buku tamu dari masukan yang telah diisi oleh user. Selanjutnya admin merespon data buku tamu dengan membalas isian buku tamu.
4.3.2.2 Spesifikasi Proses
a. Proses Peta Potensi Perikanan
Di dalam proses peta potensi user melihat data peta potensi yang ditampilkan oleh sistem. Peta tersebut masih bersifat global dan kurang detail. Kemudian user ingin melihat lebih rinci tentang peta tersebut dengan mengklik pada peta yang dipilih maka peta yang lebih rinci akan ditampilkan oleh user. Proses ini dapat di lihat pada Gambar 4.12 di bawah ini.
b. Proses Data Tabular
Di dalam proses data tabular user dapat melihat data mengenai perikanan kabupaten Cirebon baik data pemanfaatan tambak, potensi tambak per kecamatan dan statistik perikanan kabupaten Cirebon. Proses data tabular dimulai dengan user melihat menu data tabular kemudian untuk melihat lebih rinci tinggal mengklik menu tampilkan maka akan tampil data yang lebih rinci dan detail. Proses tersebut dapat dilihat pada gambar 4.13 dibawah ini.
c. Proses Pengaturan Data Tabular
Di dalam proses update data tabular dapat mengupdate dan mencetak data peta potensi yang ditampilkan oleh sistem. Proses ini memperbarui informasi yang ada dalam peta sesuai dengan keadaan saat ini. Proses ini dapat di lihat pada Gambar 4.14 di bawah ini.
Gambar 4.16 Spesifikasi Proses pengaturan Data Tabular
d. Proses profil
Di dalam proses menu profil user melihat profil kabupaten Cirebon yang dimiliki oleh sistem. Profil
tersebut merupakan informasi tentang kabupaten Cirebon. Proses ini dapat dilihat pada gambar 4.15 dibawah ini.
Gambar 4.17 Spesifikasi Proses lihat profil.
e. Proses berita
Di dalam proses peta berita user melihat berita yang ditampilkan oleh sistem. Berita tersebut merupakan informasi yang ditampilkan selain menu peta potensi. Proses ini dapat dilihat pada Gambar 4.16 dibawah ini.
Gambar 4.18 Spesifikasi Proses berita
f. Proses olah berita
Di dalam proses update berita admin menginput dan mengupdate berita yang ditampilkan oleh sistem. Proses ini memperbarui informasi yang ada dan menambah berita baru dalam peta sesuai dengan keadaan saat ini. Proses ini dapat di lihat pada Gambar 4.17 di bawah ini.
Gambar 4.19 Spesifikasi Proses input berita
g. Proses buku tamu
Di dalam proses buku tamu user mengisi buku tamu untuk berinteraksi dengan dinas kelautan dan perikanan dengan menggunakan sistem informasi potensi perikanan. Prosesnya dapat dilihat pada gambar dibawah ini
Gambar 4.20 Spesifikasi Proses buku tamu
4.3.3 Desain Prosedural
Desain Prosedural dibuat dalam bentuk Struktur Menu, Standart State Diagram (STD) yang menjelaskan langkah-langkah dalam pengoperasian sistem ini yang dituangkan dalam bentuk diagram berikut ini dan juga tertera pada lampiran.
4.3.3.1Struktur Menu 1. Menu user
2. Menu admin
Logo Nama Instansi USERNAME : PASSWORD : Log in Reset 4.3.3.2State Transition Diagram ( STD)
Desain Prosedural dibuat dalam State Transition Diagram (STD), menjelaskan langkah- langkah dalam pengoperasian system ini yang dituangkan dalam bentuk diagram tertera pada lampiran.
4.3.4 Desain Interface
Desain interface dapat dilihat pada lampiran. 4.3.1.3Desain Input
A. Desain Input login
Gambar 4.23 Desain Input Login
1. Username, inputan berupa karakter huruf dan angka dengan tipe Varchar(50).
2. Password, inputan berupa karakter huruf dan angka dengan tipe varchar(50).
B. Desain Input Berita
Gambar 4.24 Desain Input Berita
1. Judul Berita, inputan berupa karakter huruf dan angka dengan tipe Varchar(50).
2. Kategori, inputan berupa karakter huruf dan angka dengan tipe Varchar(50).
3. Headline, inputan berupa karakter huruf dan angka dengan tipe Varchar(500).
4. Isi, inputan berupa karakter huruf dan angka dengan tipe varchar(500).
C. Desain Input Buku Tamu
Gambar 4.25 Desain Input Buku Tamu
1. Nama, inputan berupa karakter huruf dan angka dengan tipe Varchar(50).
2. E-Mail, inputan berupa karakter huruf dan angka dengan tipe Varchar(50).
3. Alamat, inputan berupa karakter huruf dan angka dengan tipe varchar(50).
4. Pesan, inputan berupa karakter huruf dan angka dengan tipe varchar(150).
4.3.1.4Desain Output A. Desain Output User
1. Peta Potensi Perikanan
Gambar 4.26 Desain Output Peta Potensi Perikanan
2. Desain Output Data Tabular
3. Desain Output Berita
Gambar 4.28 Desain Output Berita
4. Desain Output Buku Tamu
4.4 Kode
Pada tahap ini, penulis menggunakan Arcview 3.3 sebagai tool untuk digitasi peta, AlovMap sebagai tool dalam menampilkan data-data spasial ke dalam aplikasi berbasis web, PHP versi 5.2.4 sebagai bahasa pemograman, MySQL Database version 5.0.45 yang digunakan sebagai basisdatanya, dan Apache Web Server version 2.2.6 sebagai web server yang digunakan, PHPMyAdmin versi 2.11.1 sebagai interface berbasis web yang dapat digunakan untuk mengadministrasi MySQL, yang keseluruhannya tergabung dalam softrware aplikasi Xampp 1.6.4. Dalam mengkonfigurasi program GUI nya, penulis menggunakan Macromedia Dreamweaver MX sebagai pengolahan codingnya, sedangkan pengolahan gambar menggunakan Adobe Photosop CS. Untuk designer tools nya digunakan Microsoft Office Visio 2003 dan untuk Web Browsernya penulis menggunakan Mozila Firefox 3.5.