23
BAB III
DESAIN SISTEM DAN PERANCANGAN PROGRAM
3.1 Metodologi Pengembangan sistemMetodologi yang digunakan
dalam penulisan tugas akhir ini adalah sebagai berikut :1. Tahap
pengumpulan data
Metode pengumpulan data yang digunakan dalam penelitian ini
adalah sebagai berikut :
a) Metode wawancara
Pengumpulan data dengan cara mengadakan wawancara secara
langsung dengan berbagai pihak yang bekaitan dan terlibat langsung
dengan sistem yang akan dianalisis guna memperoleh data yang tepat
dan akurat. b) Studi Pustaka/ Studi Literatur.
Dengan membaca dan meneliti dokumen-dokumen, internet,
buku-buku, referensi yang berkenaan dengan masalah yang diteliti
guna mengumpulkan data dan informasi yang diperlukan.
2. Tahap pembuatan perangkat lunak.
Teknik analisis data dalam pembuatan perangkat lunak menggunakan
paradigma perangkat lunak secara waterfall.a. AnalisisPada tahapan
ini, penulis Menganalisa dan mengumpulkan data-data untuk di
jadikan referensi baik dari buku maupun artikel-artikel serta
diktat mengenai perangkat lunak yang diperlukan dalam perancangan
website . pentingnya menganalisa data adalah untuk memudahkan
penulis dalam membuat aplikasi dan menentukan informasi yang akan
disampaikan sehingga aplikasi yang dibuat nantinya bisa sesuai
harapan penulis.b. Design sofware
Membuat design sistem yang akan di buat, dari design awal hingga
akhir agar mempermudah dalam merealisasikan website yang akan di
buat.c. Implementasi
Melaksanakan pengkodean atau coding (membuat kalimat kalimat
perintah menggunakan bahasa komputer) mencoba kebenaran perangkat
lunak yang telah di install pada unit computer tersebut.
d. Pengujian
Pada tahap ini melakukan pengujian sistem website yang telah
dibuat.3.2 Desain Sistem3.2.1 Desain lamaDesain lama adalah suatu
bentuk sistem yang telah atau sedang digunakan oleh suatu instansi
yang menjadi objek penelitian.Desain yang digunakan adalah sebagai
berikut :
Gambar 3.1 Desain Sistem LamaPenjelasan dari Desain sistem
lama:
1. Pengunjung datang ke kantor BNN untuk mencari informasi yang
diinginkan.
2. BNN akan mempersiapkan data data sesuai dengan yang
dicari
3. BNN memberikan data yang dibutuhkan dan mensosialisasikan
kepada masyarakat atau pengunjung.
4. Pengunjung akan menerima informasi sesuai dengan kebutuhannya
dan jika dirasa cukup proses pun selesai.
5. Jika informasi belum cukup, pengunjung akan meminta data dan
informasi tersebut di BNN.6. 3.2.2 Desain alternatifeDesain sistem
alternatife adalah suatu bentuk rancangan cara kerja atau metode
yang disarankan untuk digunakan oleh instansi tempat melakukan
penelitian sebagai cara atau sistem kerja lain yang diterapkan.
Gambar 3.2 Desain Sistem Baru
Penjelasan dari Desain sistem Alternatif :
1. Admin menginputkan data ke website untuk di simpan ke
database, sehingga user dapat melihat informasi yang di inputkan
oleh admin
2. Pengunjung membuka website dan melihat informasi tentang
BNN.3. Pengunjung dapat memberikan komentar tentang informasi yang
ada pada website.3.3 Struktur Tabel Tabel AdminUntuk menyimpan data
username dan password admin.Tabel AdminNama FieldTipe
DataKeterangan
Username Varchar(100)
PasswordVarchar (150)
Tabel Profile BNNUntuk menyimpan data Profile BNN.Tabel
ProfileNama FieldTipe DataKeterangan
Profile_id (PK) IntPrimary Key
Profile_nmVarchar (150)
Profile_tglDate/Time
Profile_ketText
Tabel Unit KerjaUntuk menyimpan data Unit Kerja pada BNN.Tabel
Unit KerjaNama FieldTipe DataKeterangan
UnitKerja_id (PK) IntPrimary Key
UnitKerja_nmVarchar (150)
UnitKerja_tglDate/Time
UnitKerja_ketText
BidangUnitKerja_idInt
Tabel Bidang Unit KerjaUntuk menyimpan data bidang / bagian unit
kerja yang ada di BNN.Tabel Bidang Unit KerjaNama FieldTipe
DataKeterangan
BidangUnitKerja_id IntPrimary Key
BidangUnitKerja_nmVarchar (150)
Tabel Agenda KegiatanMeyimpan data Kegiatan kegiatan yang
dilakukan oleh BNN NTB.Tabel Agenda KegiatanNama FieldTipe
DataKeterangan
Kegiatan_id (PK)IntPrimary Key
Kegiatan_nmVarchar (100)
Kegiatan_tglDate/Time
Kegiatan_ketText
Kegiatan_sinopsisText
Tabel BeritaMeyimpan data berita / informasi seputar BNN dan
Narkotika.Tabel BeritaNama FieldTipe DataKeterangan
Berita_id (PK)IntPrimary Key
Berita_nmVarchar (50)
Berita_tglDate/Time
Berita_ketText
Berita_sinopsisText
Tabel Komentar
Menyimpan data komentar user.
Tabel 3.18 KomentarNama FieldTipe DataKeterangan
Komentar_idIntPrimary Key
Komentar_nmVarchar (50)
Komentar_emailVarchar (50)
Komentar_webVarchar (100)
Komentar_tglDate
Komentar_isiText
Komentar_valBoolean
Berita_idInt
Kegiatan_idInt
Tabel Suara Masyarakat
Menyimpan data komentar / pertanyaan masyarakat tentang BNN atau
Narkotika.
Tabel 3.21 Cara PemesananNama FieldTipe DataKeterangan
Suara_idIntPrimary Key
Suara_nmVarchar (150)
Suara_tglDate / Tgl
Suara_emailVarchar (!50)
Suara_webVarchar (150)
Suara_isiText
Suara_valBoolean
Suara_jawabanText
Suara_tglJawabDate/Tgl
3.4 ERD (Entry Relational Diagram)
Entity relationship (ER)data model didasarkan pada persepsi
terhadap dunia nyata yang tersusun atas kumpulan objek-objek dasar
yang di sebut entitas dan hubungan antar objek.entitas adalah
sesuatu atau objek dalam dunia nyata yang dapat dibedakan dari
objek lain.sebagai contoh masing-masing mahasiswa adalah entitas
dan matakuliah dapat pula di anggap sebagai entitas.entittas yang
digambarkan dalam basisdata dengan kumpulan atribut.Relasi adalah
hubungan antara bebrapa entitas.
Gambar 3.3 ERD3.5 Diagram Arus Data (DAD)DFD digunakan untuk
menggambarkan suatu sistem yang telah ada atau sistem baru yang
akan dikembangkan secara logika tanpa mempertimbangkan lingkungan
fisik dimana data tersebut mengalir (misalnya lewat telepon dan
surat). DFD merupakan alat yang digunakan pada metodologi
pengembangan sistem yang terstruktur. DFD merupakan alat yang dapat
menggambarkan arus data dalam sistem dengan struktur dan jelas.
(Prof. Dr. Jogiyanto HM, MBA, Akt, [ 2005 ], Analisis & Disain
Sistem Informasi, 3rd Edition, Penerbit Andi, Yogyakarta.)
Gambar 3.4 DFD Level 0 (Diagram Konteks)
Gambar 3.5 DFD Level 1
Gambar 3.6 DFD Level 2 Proses 1
Gambar 3.7 DFD Level 2 Proses 2
3.6 Bagan Berjenjang
Gambar 3.13 Bagan Berjenjang
3.7 Site Map
Gambar 3.14 Site Map
Gambar 3.14 Site Map Admin
3.8 Desain Layout1. Desain Layout Home
Gambar 3.15 Desain Layout Home
Pada desain layout home ,pada bagian header berisi gambar dan
nama website/perusahaan dan informasi lainnya.dibawah header
tedapat menu utama. Pada left menu berisi form pencarian dan jenis
property. Pada bagian content berisi profil singkat prusahaan dan
menampilkan property terbaru beserta foto dan deskripsi. Footer
berisi informasi copyright dan menu seperti main menu,left menu
,footer ini isinya sama untuk semua halaman.1. Desain Layout Berita
/ Agenda
Gambar 3.16 Desain Layout Berita / AgendaPada desain layout
berita / agenda, setiap header pada semua halaman memiliki
informasi yang sama, Bedanya pada isi dari content pada setiap
halaman. Pada layout ini memiliki content yang berisikan nama
berita / agenda, foto, dan deskripsi.2. Disain Layout Detail Berita
/ Agenda
Gambar 3.17 Desain Layout Detail Berita / AgendaPada Desain
Layout Detail berita / agenda ini berisi detail berita / agenda
yang ditampilkan lebih lengkap lagi dan lebih jelas lagi. Dalam
desain ini terdapat juga form komentar dimana kita dapat
mengomentari berita / agenda yang kita inginkan.3. Disain Layout
Profile
Gambar 3.18 Desain Layout Profile
Pada desain diatas, merupakan desain layout profil yang berisi
informasi mengenai perusahaan.4. Disain Layout Admin Login
Gambar 3.23 Desain Admin Login
Ini adalah form login admin, dmana admin harus melakukan login
terlebih dahulu sebelum menginputkan atau melihat data-data.5.
Disain Layout Admin Home
Gambar 3.24 Desain Admin Home
Desain ini merupakan desain layout home halaman admin.6. Disain
Layout Admin Input Data
Gambar 3.25 Desain Admin Input DataIni merupakan form input
data.7. Disain Layout Admin Lihat Data
Gambar 3.26 Desain Admin Lihat Data
Gambar diatas merupakan disain lihat data admin. Dalam form ini
tedapat berbagai jenis property yang telah di inputkan sebelumnya
oleh admin.8. Disain Layout Admin Data Admin
Gambar 3.27 Desain Admin Data Adminini merupakan form data
admin.di mana pada form ini admin dapat melakukan atau mengedit
password baru.DAFTAR
PUSTAKAAnonim,AdobeDreamwever,Diunduhdi(http://id.wikipedia.org/wiki/Adobe_Drea
mweaver). diakses hari selasa 27 April 2011 pukul 14.00 WITAAnonim,
intenet, Di unduh di
(http://www.sejarah-internet.com/pengertian-internet) Diakses Hari
Minggu, 10 April 2011 Pukul 12:00
WITA.Anonim,AdobePhotoshop,Diunduhdi(http://id.wikipedia.org/wiki/Adobe_Photoshop)
diakses Hari Selasa 5 Mei 2011 Pukul 16.00 WITAAnonim, Pengertian
Sistem, Di unduh di http://id.wikipedia.org/wiki/Sistem diakses
Hari Selasa 10 Mei 2011 Pukul 15.20 WITA
Anonim,PengertianXampp,Diunduh(http://kihendriku.wordpress.com/2009/03/09/pengertian-xampp/)
diakses Hari Selasa 27 April 2011 Pukul 14.00 WITAAnonim,
Pengertian informasi, Di unduh
http://id.wikipedia.org/wiki/Informasi diakses Hari Selasa 10 Mei
2011 Pukul 15.20
WITAAnonim,PengertianSistemInformasi,Diunduhhttp://id.wikipedia.org/wiki/Sistem_informasi.
diakses Hari Selasa 10 Mei 2011 Pukul 15.20 WITA
Edhy Susanta[2005], Sistem Basis Data,Penerbit Graha
ilmu.Fathansyah,Ir [2005],Basis Data,Penerbit INFORMATIKA
Bandung
Janner Simarmata & Iman paryudi [2006], Basis Data,Penerbit
Andi.Prof. Dr. Jogiyanto HM, MBA, Akt, [ 2005 ], Analisis &
Disain Sistem Informasi, 3rd Edition, Penerbit Andi,
Yogyakarta.
Sidik,Ir.[2004],pemograman web dengan PHP18
_1489604898.vsdHOME
PROFILE BNN
UNIT KERJA
BAGIAN UNIT KERJA
AGENDA KEGIATAN
BERITA
SUARA MASYARAKAT
KOMENTAR
ADMIN
LOGOUT
_1489606043.unknown
_1492256549.vsd
Disain Sistem Baru
Aplikasi
Pengunjung
START
Komentar
Memberikan Komentar
Y
Menerima Komentar dan balas
Balasan komentar dari admin
END
T
Membuka website dan melihat informasi tentang BNN
_1492408218.vsdDESAIN SISTIM LAMA
START
MASYARAKAT/PENGUNJUNG
BNN
Mencari informasi yang dibutuhkan di BNN
Memberikan informasi yang dibutuhkan
Mendapatkan informasi dari BNN
Mempersiapkan dokumen/informasi yang dibutuhkan
Berkunjung
END
Cukup
Y
T
_1489606096.unknown
_1489606116.unknown
_1489606136.unknown
_1489606080.unknown
_1489605930.unknown
_1489605996.unknown
_1489605903.unknown
_1489526113.vsd1.2
Input DataSuara Masyarakat
Pengunjung
Admin
1.6
Input DataAgenda
1.7
Input DataBerita
1.4
Input DataUnit Kerja
Berita
Suara Masyarakat
Unit Kerja
Agenda
1.1
Input DataKomentar
Komentar
Profile
Bidang Unit
1.5
Input DataBidang Unit Kerja
1.3
Input DataProfile BNN
Input Komentar
Input SuaraMasyarakat
Input UnitKerja
InputAgenda
InputProfile
InputBidangUnit Kerja
Berita
Komentar
Profile
BidangUnit Kerja
Berita
Agenda
UnitKerja
SuaraMasyarakat
_1489526287.vsd0
Website BNN
1
Input Data
2
Olah Data
3
View Data
2.1
Edit Data
2.2
Hapus Data
1.1
Input Data Komentar
1.3
Input DataProfile BNN
1.5
Input DataBidang Unit Kerja
Level 0
Level 1
Level 2
1.7
Input DataBerita
1.2
Input Data Suara Masyarakat
1.4
Input DataUnit Kerja
1.6
Input DataAgenda
_1489526446.vsdHOME
PROFILE BNN
HUMAS
KASUS NARKOBA
AGENDA
BERITA
SUARA MASYARAKAT
SUB PROFILE BNN
UNIT KERJA
BIDANG UNIT KERJA
SUB BIDANG UNIT KERJA
_1489526123.vsd2.2
Hapus
Admin
2.1
Edit
Data Admin
Data Agenda
Data Berita
Data Profile BNN
Data Unit Kerja
Data BidangUnit Kerja
Data Komentar
Data SuaraMasyarakat
Data Berita
Data Agenda
Data Profile BNN
Data Unit Kerja
Data BidangUnit Kerja
Data Komentar
Data SuaraMasyarakat
Profile BNN
Unit Kerja
Bidang Unit
Admin
Agenda
Berita
Suara Masyarakat
Komentar
- Edit Data Admin- Edit Profile BNN- Edit Unit Kerja- Edit
Bidang Unit Kerja- Edit Agenda Kegiatan- Edit Berita
- Hapus Unit Kerja- Hapus Bidang Unit Kerja- Hapus Agenda
Kegiatan- Hapus Berita- Hapus Komentar- Hapus Suara Masyarakat
_1489526082.vsdWebsite BNN NTB
Pengunjung
Admin
- Olah Data Admin- Olah Profile BNN- Olah Unit Kerja- Olah
Bidang Unit Kerja- Olah Agenda Kegiatan- Olah Berita- Olah
Komentar- Olah Suara Masyarakat
- Profile BNN- Unit Kerja- Bidang Unit Kerja- Agenda Kegiatan-
Berita- Komentar- Suara Masyarakat
- Input Komentar- Input Suara Masyarakat
- Data Admin- Profile BNN- Unit Kerja- Bidang Unit Kerja- Agenda
Kegiatan- Berita- Komentar- Suara Masyarakat
_1489526102.vsd1
Input Data
Pengunjung
Admin
2
Olah Data
3
View Data
- Profile BNN- Unit Kerja- Bidang Unit Kerja- Agenda Kegiatan-
Berita- Komentar- Suara Masyarakat
- Input Komentar- Input Suara Masyarakat
Profile BNN
Unit Kerja
Bidang Unit
Suara Masyarakat
Agenda
Berita
- Olah Data Admin- Olah Profile BNN- Olah Unit Kerja- Olah
Bidang Unit Kerja- Olah Agenda Kegiatan- Olah Berita- Olah
Komentar- Olah Suara Masyarakat
- Data Admin- Profile BNN- Unit Kerja- Bidang Unit Kerja- Agenda
Kegiatan- Berita- Komentar- Suara Masyarakat
- Input Profile BNN- Input Unit Kerja- Input Bidang Unit Kerja-
Input Agenda Kegiatan- Input Berita- Input Komentar- Input Suara
Masyarakat
Data Profile
Data UnitKerja
DataBidang
Data Profile
DataUnitKerja
DataBidang
Data Suara Masyarakat
DataBerita
DataAgenda
Profile BNN
Unit Kerja
Bidang Unit
Suara Masyarakat
Agenda
Berita
Admin
Komentar
Data Profile BNN
DataUnitKerja
DataBidangUnit
DataKomentar
Admin
Komentar
DataKomentar
Suara Masyarakat
DataAgenda
DataBerita
DataAdmin
DataKomentar
Suara Masyarakat
DataBerita
DataAgenda
DataAdmin
_1489524002.vsdUnit Kerja
Memiliki
UnitKerja_id
UnitKerja_nm
UnitKerja_tgl
UnitKerja_ket
BidangUnitKerja_id
Bidang Unit Kerja
BidangUnitKerja_id
BidangUnitKerja_nm
BidangUnitKerja_id
Kegiatan
Memiliki
Kegiatan_id
Kegiatan_nm
Kegiatan_tgl
Kegiatan_ket
Kegiatan_sinopsis
Komentar
Komentar_id
Komentar_nm
Kegiatan_id
Berita
Berita_id
Berita_nm
Berita_tgl
Berita_ket
Berita_sinopsis
Komentar_email
Komentar_web
Komentar_tgl
Komentar_isi
Komentar_val
Berita_id
Kegiatan_id
Memiliki
Berita_id
_1071406500.unknown
