BAB III DESAIN DAN PERANCANGAN
3.1
Sistem Yang Sedang Berjalan Sistem Pelayanan Informasi ini dapat diakses oleh admin dan user, untuk
mengakses sistem ini diwajibkan untuk melakukan login terlebih dahulu. Jika user belum memiliki akun, user dapat membuat akun baru. Admin dapat mengelola data user, mencetak laporan dan mengelola data pesan, untuk user dapat mengirimkan pesan, mengelola pesan.
3.2
Fungsi dan Kegunaan Sistem bagi Perusahaan Pembuatan Sistem Pelayanan Informasi ini bertujuan untuk menggantikan
pelayanan informasi melalui email yang aktivitasnya tidak termonitoring dengan baik, mempermudah pembuatan laporan pelayanan informasi dalam satu bulan, serta mempermudah pencarian data pesan yang sudah lama.
3.3
Kebutuhan Fungsional Kebutuhan fungsional adalah jenis kebutuhan yang berisi proses-proses
apa saja yang nantinya akan dilakukan oleh sistem, adapun kebutuhan fungsional dari sistem ini meliputi : 1. Admin dan user dapat melakukan login. 2. User dapat membuat akun. 3. Admin dapat menghapus dan memanipulasi data akun. 4. Admin dapat membalas dan menghapus data pesan. 5. Admin dapat mencetak laporan pelayanan informasi. 6. User dapat membuat, membalas dan menghapus pesan.
17
18
3.4
Kebutuhan Non Fungsional
3.4.1
Identifikasi Perangkat Lunak
Perangkat lunak yang digunakan dalam pembuatan sistem ini adalah : 1. Macromedia Dreamweaver 8. 2. XAMPP. 3. Mozilla Firefox. 4. PowerDesigner. 5. CorelDraw X4. 6. Notepad ++.
3.4.2
Identifikasi Perangkat Keras
Perangkat keras yang digunakan dalam pembuatan sistem ini adalah: 1. Laptop dengan processor Intel(R) Core (TM) i3-2330M. 2. Monitor resolusi minimal 800x600 dan 16 bit color quality. 3. Memori RAM 2,00 GB. 4. Kapasitas Hardisk minimal 50 GB. 5. Keyboard. 6. Mouse.
3.5
Diagram Aliran Data
3.5.1
Entity Relationship Diagram (ERD) Menurut salah satu para ahli, Brandy dan Loonam (2010), Entity
Relationship Diagram (ERD) merupakan teknik yang digunakan untuk memodelkan kebutuhan data dari suatu organisasi, biasanya oleh System Analys dalam tahap analisis persyaratan proyek pengembanngan sistem. Sementara seolah-olah teknik diagram atau alat peraga memberikan dasar untuk desain database relasional yang mendasari sistem informasi yang dikembangkan. ERD bersama-sama dengan detail pendukung merupakan model data yang pada gilirannya digunakan sebagai spesifikasi untuk database.
19
Gambar 3.1 Entity Relationship Diagram (ERD) Penjelasan : 1. Satu user memiliki banyak topik, dan satu topik tidak dapat dimiliki banyak user, hubungan yang terjadi adalah One to Many. 2. Satu topik memiliki banyak reply, dan satu reply tidak dapat dimiliki banyak topik, hubungan yang terjadi adalah One to Many. 3. Satu user memiliki banyak komentar, dan satu komentar tidak dapat dimiliki banyak user hubungan yang terjadi adalah One to Many.
3.5.2
Diagram Konteks Diagram konteks adalah diagram yang terdiri dari suatu proses dan
menggambarkan ruang lingkup suatu sistem. Diagram konteks merupakan level tertinggi dari Data Flow Diagram (DFD) yang menggambarkan seluruh input ke
20
sistem atau output dari sistem. Diagram Konteks akan memberikan gambaran tentang keseluruhan sistem. Dalam diagram konteks hanya ada satu proses. Tidak boleh ada store dalam diagram konteks. Diagram konteks berisi gambaran umum (secara garis besar) sistem yang akan dibuat. Diagram konteks ini berisi siapa saja yang memberi data (dan data apa saja) ke sistem, serta kepada siapa saja informasi (dan informasi apa saja) yang harus dihasilkan sistem.
Gambar 3.2 Diagram Konteks Penjelasan : 1. Admin dapat mengelola data user. 2. Admin dapat mengelola data pesan. 3. User dapat mengelola data pesan. 4. Staff dapat mengelola data pesan.
3.5.3
Data Flow Diagram (DFD) Data Flow Diagram (DFD) merupakan model dari sistem untuk
menggambarkan pembagian sistem ke modul yang lebih kecil. Casc control untuk menggambarkan desain proses disertai aliran data (data flow) yang digunakan dalam membangun sistem informasi. DFD menunjukkan bagaimana arsitektur sistem informasi dibangun karena dapat menjadi panduan (guide) bagi programmer dalam membuat program. Oleh karena itu proses yang ada dalam DFD cenderung mengarah ke proses yang terjadi secara logika.
21
Verifikasi login seksi login seksi login user Verifikasi login user
Admin
Login admin Verifikasi login admin informasi data pesan Manipulasi data pesan
Mengelola data login
Tabel_user
Mengelola data pesan
Tabel_pesan
Mengelola data komentar
Tabel_komentar
Manipulasi data komentar Informasi data komentar
User
Manipulasi data pesan Informasi data pesan
Manipulasi data komentar Informasi data komentar
Seksi
Manipulasi data komentar Informasi data komentar
Input cetak laporan Output cetak laporan
Laporan
Gambar 3.3 Data Flow Diagram Penjelasan : 1. User membuat akun baru dan login, kemudian diproses oleh sistem dan disimpan dalam tabel user. 2. Admin login, kemudian diproses oleh sistem dan disimpan dalam tabel user 3. User membuat pesan baru, kemudian diproses oleh sistem dan disimpan dalam tabel pesan 4. Admin mengomentari pesan user, kemudian diproses oleh sistem dan disimpan dalam tabel komentar 5. Sistem menghasilkan laporan yang dicetak oleh admin kemudian diserahkan kepada kepala kantor
22
3.5.4
Conceptual Data Model (CDM) Conceptual Data Model (CDM) dipakai untuk menggambarkan secara
detail struktur basis data dalam bentuk logic. Struktur ini independen terhadap semua software maupun struktur data storage tertentu yang digunakan dalam aplikasi ini. CDM terdiri dari objek yang tidak diimplementasikan secara langsung kedalam basis data yang sesungguhnya. Didalam CDM terdapat 3 tabel yang saling berelasi, diantaranya, tabel topik berelasi dengan tabel user, dan tabel reply.
Gambar 3.4 Conceptual Data Model (CDM)
3.5.5
Physical Data Model (PDM) Physical Data Model (PDM) merupakan gambaran secara detail basis data
dalam bentuk fisik. Penggambaran rancangan PDM memperlihatkan struktur penyimpanan data yang benar pada basis data yang digunakan sesungguhnya. Pada tahap ini, dilakukan penyusunan dan perancangan database yang akan digunakan beserta strukturnya. Rancangan database sistem yang dibuat berupa Entity Relational Diagram (ERD), yaitu alat untuk mempresentasikan model data yang ada pada sistem dimana terdapat entity dan relationalship.
23
Gambar 3.5 Physical Data Model (PDM)
3.6
Perancangan Tabel Database Seperti kita ketahui bahwa PHP menyediakan fasilitas yang sangat
lengkap untuk membangun aplikasi database. Sebuah aplikasi database memerlukan file database beserta tabel-tabelnya sebagai tempat perekam data. Dalam sistem ini penulis menggunakan MySQL sebagai database karena berbagai kelebihan yang dimiliki oleh MySQL. Berikut rancangan database Sistem Pelayanan Informasi Berbasis Web:
3.6.1
Tabel User Tabel user digunakan untuk menyimpan data user yang bisa mengelola
data dalam sistem yang dibuat, dan id_user sebagai Primary Key dalam tabel ini. Tabel 3.1 Tabel User No Field
Type
Ket Primary Key
1
user_id
integer
2
Fullname
varchar
3
Password
varchar
24
3.6.2
No Field
Type
4
Email
varchar
5
Level
varchar
6
member_date
date
7
last_update
date
8
Status
integer
Ket
Tabel Pesan Tabel ini adalah tabel pesan, berisikan topik atau tema yang ingin dibahas,
tanggal pesan dibuat, deskripsi isi pesan, kategori bidang dan seksi bidang, serta user pengirim pesan. Tabel 3.2 Tabel Pesan
3.6.3
No
Field
Type
Ket
1
topik_id
integer
Primary Key
2
user_id
varchar
Foreign Key
3
Date
date
4
Title
varchar
5
Descript
varchar
6
Kategori
varchar
7
Seksi
varchar
Tabel Komentar Tabel ini adalah tabel komentar, berisikan halaman pembalasan pesan,
deskripsi isi pesan, tanggal mengirim pesan dan user pengirim pesan. Tabel 3.3 Tabel Komentar No
Field
Type
Ket
1
reply_id
integer
Primary Key
2
topik_id
varchar
Foreign Key
25
3.7
No
Field
Type
Ket
3
user_id
integer
Foreign Key
4
date
date
5
reply
varchar
Perancangan Antarmuka / Interface Perancangan interface / antar muka merupakan rancangan antarmuka
(interface) program yang akan diimplementasikan. Rancangan dari Sistem Pelayanan Informasi Berbasis Web adalah sebagai berikut: 3.7.1
Halaman Home dan Login Pada halaman home memuat informasi mengenai sistem dan login, login
memiliki dua hak akses yaitu admin dan user dengan cara memasukkan email dan password. Jika user belum memiliki akun bisa mendaftar dengan klik menu buat akun.
Gambar 3.6 Halaman Home dan Login
26
3.7.2
Halaman Form Buat Akun Halaman Buat Akun ini memuat form untuk membuat akun baru dengan
mengisi nama lengkap, password dan email.
Gambar 3.7 Halaman Form Buat Akun 3.7.3
Halaman Menu Admin Setelah admin melakukan login, pada halaman admin tersedia tiga menu
yaitu beranda yang menampilkan daftar pesan, daftar user dan cetak laporan.
Gambar 3.8 Halaman Menu Admin
27
3.7.4
Halaman Daftar User Halaman daftar user menampilkan daftar akun user yang telah mendaftar,
pada halaman ini admin bisa menghapus akun user.
Gambar 3.9 Halaman Daftar User 3.7.5
Halaman Menu User Setelah user melakukan login maka halaman user akan tertampil, pada
halaman user hanya tersedia dua menu yaitu beranda dan buat pesan. pada halaman beranda akan tertampil daftar semua pesan yang telah dibuat oleh user.
Gambar 3.10 Halaman Menu User
28
3.7.6
Halaman Pesan Baru dan Edit Pesan
Halaman ini berisi form untuk membuat pesan baru.
Gambar 3.11 Halaman Pesan Baru dan Edit Pesan 3.7.7
Halaman Detail Pesan
Halaman ini berisi isi pesan serta form untuk membalas pesan.
Gambar 3.12 Halaman Detail Pesan
