44
BAB 4
ANALISIS DAN PERANCANGAN
4.1 Analisis Sistem
Analisis sistem adalah aktivitas yang menguraikan suatu sistem informasi
yang utuh dan nyata kedalam komponen yang bertujuan untuk mengidentifikasi
serta mengevaluasi masalah-masalah yang muncul, sehingga mengarah kepada
suatu solusi untuk perbaikan maupun pengembangan kearah yang lebih baik dan
sesuai dengan kebutuhan. Untuk alur dan implementasi e-marketing
menggunakan Customer Relationship Management (CRM) pada Anggun
Hantaran dan Dekorasi akan diuraikan menggunakan pemodelan UML (Unifed
Modeling Language) yaitu: Use Case Diagram, Class Diagram, Squence
Diagram, dan Activity Diagram.
4.1.1 Analisis masalah
Untuk mengidentifikasi masalah, perlu dilakukan analisis terhadap kinerja,
informasi, ekonomi, keamanan, efisiensi dan pelayanan. Panduan ini dikenal
dengan PIECES analysis (Performance, information, economic, control,
efficiency, service). Analisis ini dipilih sebagai tolak ukur apakah sistem baru ini
layak digunakan sebagai pengganti sistem lama atau tidak.
a. Analisis Kinerja (Performance Analysis)
Beban kerja dalam proses transaksi cukup lama pada Anggun Hantaran dan
Dekorasi, apalagi ditambah dengan pembuatan semua laporan. Dan waktu yang
dibutuhkan dalam proses pembuatan laporan terlalu lama karena masih manual
45
sehingga memperlambat proses kerja pada Anggun Hantaran dan Dekorasi
tersebut.
b. Analisis Informasi (Information Analysis)
Tidak akuratnya perhitungan pada Anggun Hantaran dan Dekorasi karena
proses perhitungan cenderung menggunakan kalkulator, sehingga sering terjadi
kesalahan pada proses penginputan harga sewa hantaran dan dekorasi, tidak
tepat waktu dikarenakan banyak data penyewaan masih tertulis pada nota,
sehingga harus menunggu laporan disatukan dulu. Dan tidak relevan
dikarenakan informasi yang disajikan tidak sesuai dengan keinginan karena
adanya kesalahan pada pembuatan laporan.
c. Analisis Ekonomi (Economic Analysis)
Dilihat dari jangka panjangnya, biaya produksi yang dikeluarkan akan semakin
meningkat pada Anggun Hantaran dan Dekorasi seiring dengan perkembangan
usaha dan kebutuhan alat tulis dan promosi.
d. Analisis Pengendalian (Control Analysis)
Pada sistem yang sedang berjalan saat ini, tidak adanya pengamanan terhadap
laporan serta nota-nota penjualan yang penting pada Anggun Hantaran dan
Dekorasi, sehingga resiko kehilangan atau kerusakan dapat terjadi.
e. Analisis Efisiensi (eficiency Analysis)
Beban kerja yang diterima sangat banyak, yakni proses perhitungan transaksi
penyewaan pada Anggun Hantaran dan Dekorasi serta pembuatan laporan.
f. Analisis Pelayanan (Service Analysis)
Dalam proses transaksi terhitung lama, karena pencarian produk yang diminta
oleh para pelanggan dilakukan dengan pengecekan pada daftar produk.
46
4.1.2 Analisis Kebutuhan Sistem
Tujuan analisis yaitu memahami dengan sebenar-benarnya kebutuhan dari
sistem baru dan mengembangkan sebuah sistem yang melayani kebutuhan
tersebut, atau memutuskan bahwa sebenarnya pengembangan sistem baru tidak
dibutuhkan. Untuk mempermudah analis sistem dalam menentukan keseluruhan
kebutuhan secara lengkap, maka analis membagi kebutuhan sistem menjadi 2
jenis yaitu :
1. Kebutuhan Fungsional
Jenis kebutuhan yang berisi proses-proses apa saja yang nantinya dilakukan
oleh sistem. Seperti: membatasi hak akses, penginputan data, transaksi
penyewaan, dan laporan penyewaan hantaran dan dekorasi.
2. Kebutuhan non-fungsional
Kebutuhan non-fungsional merupakan tipe kebutuhan yang berupa properti
perilaku yang dimiliki oleh sistem. Diantaranya kebutuhan perangkat lunak,
perangkat keras, serta pengguna sistem sebagai bahan analisis kekurangan dan
kebutuhan yang harus dipenuhi dalam perancangan sistem yang akan
diterapkan.
4.1.2.1 Analisis Data
1. Analisis Data Masukan
Berdasarkan hasil data yang diperoleh, terdapat beberapa data masukan yang
digunakan dalam sistem pada Anggun Hantaran dan Dekorasi, adapun
perincian dari data-data tersebut adalah sebagai berikut :
47
Tabel 4.1 Data Masukan
No Nama Tujuan
1 Data hantaran dan
dekorasi
Admin, Pimpinan
2 Data Pelanggan Admin, Pimpinan
3 Data Pesanan Admin
2. Analisis Data Keluaran
Data keluaran merupakan data yang dipakai sebagai output ataupun data yang
digunakan sebagai informasi kepada owner. Yang termasuk kedalam data
keluaran adalah sebagai berikut:
Tabel 4.2 Data Keluaran
No Nama Dokumen Fungsi Tujuan
1 Laporan
Transaksi
Menginformasikan transaksi
penyewaan hantaran dan dekorasi
Pimpinan
4.1.2.2 Analisis Proses
Pemodelan fungsional sistem menggambarkan proses atau fungsi yang
harus dikerjakan oleh sistem untuk melayani kebutuhan pengguna (User).
Berdasarkan kebutuhan masyarakat/pengguna dan admin, maka fungsi utama
yang harus dilakukan oleh sistem adalah sebagai berikut :
1. Sistem menampilkan informasi penyewaan produk pada Anggun Hantaran dan
Dekorasi melalui website.
2. Sistem menampilkan berbagai macam produk yang disewakan, dan harga.
3. Sistem dapat melakukan penyewaan langsung yang dilakukan pelanggan.
48
4.1.2.3 Analisis Pengguna
Analisis pengguna yang dimaksud untuk mengetahui siapa saja aktor yang
terlibat dalam menjalankan dan yang dapat mengakses website Anggun Hantaran
dan Dekorasi. Pengguna sistem ini yaitu :
1. Pelanggan yang mencari informasi tentang Anggun Hantaran dan Dekorasi,
dalam menggunakan sistem ini pelanggan harus memiliki koneksi internet
karena sistem ini bersifat online.
2. Admin merupakan aktor yang berperan dalam memanipulasi / mengelola data
pada sisi server.
Tujuan penggunaanya adalah sebagai media informasi dan pemasaran
penyewaan hantaran dan dekorasi yang dapat berguna dan efisien pada Anggun
Hantaran dan Dekorasi, memudahkan Anggun Hantaran dan Dekorasi dalam
mengelola data dan proses transaksi penyewaan hantaran dan dekorasi. Serta
sebagai tempat promosi bagi Anggun Hantaran dan Dekorasi itu sendiri.
4.1.2.4 Analisis Perangkat Keras
Berikut ini adalah spesifikasi perangkat keras (hardware) yang digunakan
untuk mengimplementasikan aplikasi sistem E-marketing menggunakan Customer
Relationship Management (CRM) pada Anggun Hantaran dan Dekorasi yaitu
sebagai berikut :
49
Tabel 4.3 Analisis Perangkat Keras
No Nama
Hardware
Spesifikasi Jml Fungsi Harga
1
Asus
X441B
Processor :
AMD Dual
Core A4-9125
RADEON,
2.6GHz
Memory : 4GB
Hardisk : 1TB
1 Sebagai alat Antar
muka, penampil
data serta pengolah
data pada Anggun
Hantaran dan
Dekorasi
Rp.4.000.000
2 Printer Type : Epson
L360
1 Sebagai alat cetak
laporan
Rp.2.150.000
Total Rp.6.150.000
4.1.2.5 Analisis Perangkat Lunak
E-marketing pada Anggun Hantaran dan Dekorasi ini didukung kebutuhan
perangkat lunak (software) yang digunakan untuk mengimplementasikan aplikasi
sistem ini seperti:
Tabel 4.4 Analisis Perangkat Lunak
No Kebutuhan Keterangan Fungsi Harga
1 Sistem
Operasi
Windows 10
Home Basic
Sebagai sistem operasi yang
membantu dalam mengolah
data.
Free
2 Web Browser Mozilla
Firefox
Penjelajah web Free
3 Web Server Xampp Versi
5.6
Sebagai server yang berdiri
sendiri (localhost)
Free
4 Bahasa
Pemograman
PHP&MYSQL Untuk membuat halaman
web
Free
5 Text Editor Notepade++ Untuk editing kode-kode
dalam membangun website
Free
Total -
50
4.1.2.6 Analisis Konfigurasi Sistem
Konfigurasi merupakan proses pembuatan pengaturan dari bagian-bagian
yang membentuk keseluruhan. Sistem informasi yang dimiliki database yang
dapat menyimpan data yang akan disampaikan pada saat pengguna mengakses
aplikasi ini. Sistem informasi penyewaan pada Anggun Hantaran dan Dekorasi ini
akan dibuat sebagai suatu web service dengan menggunakan jaringan internet.
4.2 Analisis Biaya
Tabel 4.5 Analisis Biaya
No Deskripsi Biaya
Biaya Pengadaan & Persiapan
1 Pembelian Hardware Rp.6.150.000,-
2 Pembelian Software -
Total Rp. 6.150.000,-
4.3 Perancangan Sistem Secara Umum
Untuk mendukung proses bisnis, Anggun Hantaran dan Dekorasi harus
mengembangkan sistem yang ada agar proses bisnis dapat berjalan dengan lancar.
Anggun Hantaran dan Dekorasi memiliki banyak peluang untuk mengembangkan
sistem dengan E-marketing. Perkembangan jaringan internet saat ini
mempermudah perusahaan memperoleh akses internet yang mendukung
penerapan sistem E-marketing. Selain itu, perkembangan electronic business di
Indonesia cukup pesat sehingga E-marketing dapat memberikan keunggulan
kompetitif bagi Anggun Hantaran dan Dekorasi.
51
4.3.1 Aliran Sistem Informasi Lama yang Sedang Berjalan
Pengamatan sistem informasi lama yaitu pemecahan dari suatu sistem
informasi yang utuh ke dalam bagian komponennya dengan tujuan untuk
mendefinisikan dan mengevaluasi permasalahan-permasalahan yang terjadi dan
kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan-
perbaikan.
Adapun prosedur yang sedang berjalan saat proses penyewaan pada Anggun
Hantaran dan Dekorasi adalah sebagai berikut :
1. Customer melihat hantaran dan dekorasi di Anggun Hantaran dan Dekorasi.
2. Customer mendapatkan informasi seputar hantaran dan dekorasi yang
dijelaskan oleh karyawan Anggun Hantaran dan Dekorasi.
3. Customer memilih hantaran atau dekorasi yang akan disewa, dan menentukan
tanggal pemesanan penyewaan.
4. Anggun Hantaran dan Dekorasi akan menyanggupi atau tidak untuk
menerima pesanan pada tanggal tersebut. Anggun hantaran dan dekorasi
dapat menyatakan tidak mampu menyanggupi pesanan apabila sedang banyak
pesanan pada tanggal tersebut. Jika Anggun Hantaran dan Dekorasi tidak
menyanggupi pesanan customer, maka customer dapat membuat pesanan
untuk tanggal lain.
5. Jika Anggun Hantaran dan Dekorasi menyanggupinya, maka akan mencatat
informasi detail data sewa hantaran dan dekorasi dari customer. Data detail
yang diminta berupa anggaran, isi dalam hantaran dan catatan lain yang
dibutuhkan untuk kepentingan pesanan customer.
52
6. customer mendapat kwitansi pembayaran (nota) booking fee. Kwitansi
pembayaran diarsipkan oleh karyawan Anggun Hantaran dan Dekorasi.
7. Jika kedua belah pihak sepakat, maka customer akan melakukan pembayaran
booking fee sebagai tanda jadi.
8. Anggun Hantaran dan Dekorasi akan mengantarkan pesanan penyewaan
customer pada tanggal yang ditentukan.
9. customer menerima hasil pekerjaan yang dikerjakan Anggun Hantaran dan
Dekorasi.
10. customer membayar sisa pembayaran dan menerima kwitansi lunas
pembayaran.
11. Karyawan Anggun Hantaran dan Dekorasi mengarsipkan tanda bukti
pembayaran lunas dan memberikan tanda bukti dan pembayaran kepada
pemilik Anggun Hantaran dan Dekorasi.
53
Gambar 4.1 ASI Lama Anggun Hantaran dan Dekorasi
54
4.3.2 Aliran Sistem Informasi Baru yang Diusulkan
Perangkat lunak yang akan dibangun adalah sebuah aplikasi E-Marketing di
Anggun Hantaran dan Dekorasi berbasis web yang dapat membantu dalam
menyampaikan informasi produk kepada Customer tanpa mengharuskan
Customer datang langsung ke Anggun Hantaran dan Dekorasi untuk melakukan
pemesanan penyewaan hantaran atau dekorasi. Perangkat lunak ini digunakan
oleh admin dan Customer dimana seorang admin bertugas untuk mengontrol
penyewaan Customer. Admin mempunyai hak penuh terhadap sistem yang
mengelola data informasi tentang Anggun Hantaran dan Dekorasi yang meliputi
pengelolaan data Customer, Data produk, penambahan data hantaran dan dekorasi
serta data Customer yang telah melakukan penyewaan. Sedangkan Customer
berhak melakukan pemesanan penyewaan setelah mendaftarkan diri di form
Register. Customer hanya memiliki hak akses untuk mengedit data diri masing-
masing sesuai akunnya, melakukan penyewaan dan memperoleh laporan
pemesanan yang telah disewa.
Aliran sistem informasi baru dapat dijabarkan secara rinci melalui
keterangan berikut :
1. Customer melakukan registrasi di sistem informasi Anggun Hantaran dan
Dekorasi.
2. Selanjutnya Customer mengisi form registrasi dengan benar dan sistem akan
menyimpan data dalam database
3. Selanjutnya Customer melakukan login dan melengkapi data untuk pemesanan
penyewaan hantaran atau dekorasi .
55
4. Setelah pesanan dikonfirmasi oleh admin/karyawan, Kemudian Customer
mengupload bukti pembayaran dan sistem akan mengkonfirmasi pesanan
5. selanjutnya admin/karyawan akan mengirimkan hantaran dan dekorasi yang
disewa tersebut kepada Customer sesuai dengan tanggal yang telah di tentukan.
6. Kemudian admin/karyawan akan mencetak laporan sewa hantaran atau
dekorasi, selanjutnya sistem akan menampilkan laporan.
7. Admin/Karyawan memberikan hasil laporan kepada pemilik Anggun Hantaran
dan Dekorasi.
56
Gambar 4.2 ASI Baru Anggun Hantaran dan Dekorasi
57
4.3.3 Unifed Modeling Language (UML)
UML (Unified Modeling Language ) merupakan sekumpulan teknik dan
struktur pemodelan desain program berorientasi objek (OOP).
UML adalah suatu bahasa yang digunakan untuk menentukan,
memvisualisasikan, membangun, dan mendokumentasikan suatu sistem informasi.
4.3.3.1 Use Case Diagram
Berikut adalah Use Case dari “Implementasi E-Marketing Menggunakan
Customer Relationship Managament (CRM) pada Anggun Hantaran dan Dekorasi
Berbasis Web”.
Admin
Data User
Paket Wedding
laporan
login
logout
tambah
edit
hapus
tambah
edit
hapus
pelanggan
pesanan
<<extend>>
cetak
cetak
User
Informasi Sewa
Paket Wedding
<<include>>
<<extend>>
<<extend>>
<<extend>>
<<extend>>
<<extend>>
<<extend>>
<<extend>>
<<include>>
<<include>>
<<include>>
<<include>>
<<include>>
<<extend>>
<<extend>>
Gambar 4.3 Use Case Diagram
Adapun keterangan gambar 4.3 dapat dijelaskan sebagai berikut :
1. Deskripsi Use Case Login
Tabel 4.6 merupakan deskripsi Use Case Login yang menjelaskan skenario
dari Use Case Login yang dilakukan oleh admin.
58
Tabel 4.6 Deskripsi Use Case Login
Nama Login
Aktor Admin
Deskrisi Admin melakukan proses Login untuk dapat menggunakan
sistem
Expection Proses Login gagal
Pre Condition Username dan password sudah tersimpan dalam database
Aktor Sistem
Skenario Normal
1. Admin masuk ke halaman Login 2. Menampilkan halaman Login
3. Admin memasukkan username dan
password
4. Membuka koneksi database
5. Memeriksa status login
6. Proses Login berhasil, Admin masuk
ke sistem
Skenario Alternatif
1. Admin masuk ke halaman Login 2. Menampilkan halaman Login
3. Admin memasukkan username dan
password
4. Membuka koneksi database
5. Memeriksa status login
6. Proses Login gagal,
Menampilkan pesan error
7. Admin mengulang kembali proses
Login
Post Condition Admin berhasil masuk ke sistem
2. Deskripsi Use Case Logout
Tabel 4.7 merupakan deskripsi use case logout yang menjelaskan skenario
dari use case logout yang dilakukan oleh admin.
Tabel 4.7 Deskripsi Use Case Logout
Nama Logout
Aktor Admin
Deskrisi Admin melakukan proses Logout untuk dapat
menggunakan sistem.
Expection Proses Logout gagal
Pre Condition Admin telah logout ke sistem.
Aktor Sistem
Skenario Normal
1. Admin memilih menu logout
2. Melakukan logout
59
3. Deskripsi Use Case Mengolah Data User
Tabel 4.8 merupakan deskripsi use case mengola data user yang
menjelaskan skenario yang dilakukan oleh admin.
Tabel 4.8 Deskripsi Use Case Mengelola Data User
Nama Mengolah Data User
Aktor Admin
Deskrisi Admin melakukan pengolahan data user
Expection Proses pengolahan data user gagal
Pre Condition Admin telah login ke sistem.
Aktor Sistem
Skenario Normal
1. Admin memilih menu Data User
2. Menampilkan halaman data user
3.
- Jika ingin menambah data user, maka
sub scenario S-1 yang berlaku.
- Jika ingin mengedit data user, maka
sub scenario S-2 yang berlaku.
- Jika ingin menghapus data user, maka
sub scenario S-3 yang berlaku.
4. Sistem menyimpan data user
kedalam database
Sub Scenario
S-1 : Tambah User
1. Admin meng-klik tombol tambah
2. Sistem menampilkan form
tambah user
3. Admin mengisi form tambah user dan
meng-klik tombol simpan
4. Sistem menyimpan data ke
database
S-2 : Edit User
1. Admin memilih data user yang akan di
edit dan meng-klik tombol edit
2. Sistem menampilkan data user
yang akan di edit ke dalam
halaman
3. Admin mengubah data user dan meng-
klik simpan
4. Sistem mengubah data user ke
dalam database
S-3 : Hapus User
1. Admin memilih data user yang akan di
60
hapus kemudian meng-klik tombol
hapus
2. Sistem menghapus data user
dari database
Skenario Alternatif
S-1 3a : Sistem akan menampilkan pesan apabila ada data yang tidak terisi
dan proses penyimpanan data dibatalkan.
S-1 3b : Sistem memberi kesempatan untuk mengulang kembali.
S-2 3a : Sistem akan menampilkan pesan apabila ada data yang tidak terisi
dan proses edit data dibatalkan.
S-2 3b : Sistem memberi kesempatan untuk mengulang kembali.
S-3 1a : Sistem tidak akan menghapus data dari database apabila aktor tidak
meng-klik tombol hapus.
S-3 1b : Sistem menampilkan halaman data user kembali
Post Condition Admin berhasil melakukan pengolahan data user
4. Deskripsi Use Case Mengelola Produk Hantaran dan Dekorasi
Tabel 4.9 merupakan deskripsi use case mengelola Produk Hantaran dan
Dekorasi yang menjelaskan skenario yang dilakukan oleh admin.
Tabel 4.9 Deskripsi Use Case Mengelola Paket Hantaran dan Dekorasi
Nama Mengolah Data Produk Hantaran dan Dekorasi
Aktor Admin
Deskrisi Admin melakukan pengolahan data Produk Hantaran dan
Dekorasi
Expection Proses pengolahan data Produk Hantaran dan Dekorasi
gagal
Pre Condition Admin telah login ke sistem.
Aktor Sistem
Skenario Normal
1. Admin memilih menu Produk
Hantaran dan Dekorasi
2. Menampilkan halaman Produk
Hantaran dan Dekorasi
3.
- Jika ingin menambah Produk
Hantaran dan Dekorasi, maka sub
scenario S-1 yang berlaku.
- Jika ingin mengedit Produk Hantaran
dan Dekorasi, maka sub scenario S-2
yang berlaku.
- Jika ingin menghapus Data Produk
Hantaran dan Dekorasi, maka sub
61
scenario S-3 yang berlaku.
4. Sistem menyimpan data Produk
Hantaran dan Dekorasi kedalam
database
Sub Scenario
S-1 : Tambah Produk Hantaran dan Dekorasi
1. Admin meng-klik tombol tambah
2. Sistem menampilkan form
tambah Produk Hantaran dan
Dekorasi
3. Admin mengisi form tambah Produk
Hantaran dan Dekorasi dan meng-klik
tombol simpan
4. Sistem menyimpan data ke
database
S-2 : Edit Produk Hantaran dan Dekorasi
1. Admin memilih data Produk Hantaran
dan Dekorasi yang akan di edit dan
meng-klik tombol edit
2. Sistem menampilkan data
Produk Hantaran dan Dekorasi
yang akan di edit ke dalam
halaman
3. Admin mengubah data Produk
Hantaran dan Dekorasi dan meng-klik
simpan
4. Sistem mengubah data Produk
Hantaran dan Dekorasi ke dalam
database
S-3 : Hapus Produk Hantaran dan Dekorasi
1. Admin memilih data Produk Hantaran
dan Dekorasi yang akan di hapus
kemudian meng-klik tombol hapus
2. Sistem menghapus data Produk
Hantaran dan Dekorasi dari
database
Skenario Alternatif
S-1 3a : Sistem akan menampilkan pesan apabila ada data yang tidak terisi
dan proses penyimpanan data dibatalkan.
S-1 3b : Sistem memberi kesempatan untuk mengulang kembali.
S-2 3a : Sistem akan menampilkan pesan apabila ada data yang tidak terisi
dan proses edit data dibatalkan.
S-2 3b : Sistem memberi kesempatan untuk mengulang kembali.
S-3 3a : Sistem tidak akan menghapus data dari database apabila aktor tidak
meng-klik tombol hapus.
S-3 3b : Sistem menampilkan halaman data Produk Hantaran dan Dekorasi
kembali
62
Post Condition Admin berhasil melakukan pengolahan Produk Hantaran
dan Dekorasi
5. Deskripsi Use Case Mengelola Data Laporan
Tabel 4.10 merupakan deskripsi use case mengelola data Laporan yang
menjelaskan skenario dari use case mengelola data laporan yang dilakukan oleh
admin.
Tabel 4.10 Deskripsi Use Case Mengelola Data Laporan
Nama Mengolah Data Laporan
Aktor Admin
Deskrisi Admin melakukan pengolahan data laporan
Expection Proses pengolahan data laporan gagal
Pre Condition Admin telah login ke sistem.
Aktor Sistem
Skenario Normal
1. Admin memilih halaman laporan
2. Menampilkan halaman data
laporan
3.
- Jika ingin mengolah data pelanggan,
maka sub scenario S-1 yang berlaku.
- Jika ingin mengolah data pesanan,
maka sub scenario S-2 yang berlaku.
4. Sistem menyimpan data
transaksi kedalam database
Sub Scenario
S-1 : Mengolah Data Pelanggan
1. Admin memilih data pelanggan
2. Menampilkan halaman data
pelanggan
3. Admin memilih cetak laporan
pelanggan untuk cetak laporan
4. Sistem menampilkan data
laporan dari database
S-2 : Mengolah Data Pesanan
5. Admin memilih data pesanan
6. Menampilkan halaman data
pesanan
7. Admin memilih cetak laporan pesanan
untuk cetak laporan
8. Sistem menampilkan data
63
laporan dari database
Skenario Alternatif
S-1 2a : Sistem akan mencetak laporan apabila aktor meng-klik tombol cetak.
S-1 2b : Sistem menampilkan halaman data laporanvpelanggan kembali.
S-2 2a : Sistem akan mencetak laporan apabila aktor meng-klik tombol cetak.
S-2 2b : Sistem menampilkan halaman data laporan pesanan kembali.
Post Condition Admin berhasil melakukan pengolahan data laporan
4.3.3.2 Class Diagram
Diagram kelas atau class diagram menggambarkan struktur sistem dari segi
pendefenisian kelas-kelas yang akan dibuat untuk membangun sistem. Berikut ini
adalah class diagram dari sistem Implementasi E-Marketing pada Anggun
Hantaran dan Dekorasi.
Mengolah Data
Input Data()
Hapus Data()
Edit Data()
Cari Data
akun
id
nama
username
akses
tambah()
edit()
hapus()
pelanggan
id_reg
nama_lengkap
tanggal_lahir
tambah()
edit()
hapus()
password
pesan
id_pesan
pelanggan
pesan
tambah()
edit()
hapus()
pesanan
no_faktur
pelanggan
tambah()
edit()
hapus()
tanggal
wedding
id_pa
nama_paket
harga
foto
tambah()
edit()
hapus()
stok
tanggal_up
keterangan
admin
username:
varchar(10)
password:
varchar(10)
tambah() koneksi_basisdat
a
database
username
open()
excute()
getresult()
password
close()
validasi
login
logout
cekstatuslogin
main
main
Antarmuka
Form DataUser()
FormPaketWedding()
FormLaporan()
TampilDataUser()
TampilPaketWedding()
TampilLaporan()
password
jenis_kelamin
tempat_lahir
alamat
no_hp
tgl_sewa
paket
tgl_pesan
status
f_bukti
hit
Gambar 4.4 Class Diagram
64
4.3.3.3 Sequence Diagram
Diagram sequence menggambarkan kelakuan objek pada use case dengan
mendeskripsikan waktu objek dan message yang dikirimkan dan diterima antar
objek. Oleh karena itu untuk menggambarkan diagram sequence maka harus
diketahui objek-objek yang terlibat dalam sebuah use case beserta metode-metode
yang dimiliki kelas yang diinstansiasi menjadi objek itu.
1. Sequence Diagram Login
Admin masuk ke halaman login terlebih dahulu untuk melakukan login jika
username dan password benar maka admin akan masuk ke halaman menu utama
Anggun Dekorasi dan Hantaran.
Adminsequence
logininterface
login formmenu utama
database
1 : Login
2 : Input Username/Password
3: Cek Username/Password 4: Berhasil
5 : Login Berhasil
6 : Tampil Menu Utama
Gambar 4.5 Diagram Sequence Login
2. Sequence Diagram Logout
Manajemen user masuk ke halaman utama terlebih dahulu untuk
melakukan Logout. Jika logout berhasil maka manajemen user akan keluar dari
halaman menu utama dan menonaktifkan semua menu yang ada di halaman
utama.
65
Admin logoutmenu utama
database
1 : Menampilkan Form Logout
3: Logout
2 : Klik Logout
Gambar 4.6 Diagram Sequence Logout
3. Sequence Diagram Mengolah Data User
Admin melakukan pengelolaan data user dari sistem informasi penyewaan
pada Anggun Hantaran dan Dekorasi. Diagram sequence menampilkan aktivitas
Admin saat menambah, mengedit, dan menghapus data.
AdminHalaman
UtamaMenu Data
UserData User
Database
1: Mengakses Menu Utama
1.1 : Tampil M. Utama
2: Pilih Menu Data User 2.1 : Mengolah Data User,
Simpan, Edit, Hapus
3: Akses Data
3.1 : Berhasil
4: Data User Berhasil di Olah
Gambar 4.7 Diagram Sequence Mengelola Data User
66
4. Sequence Diagram Mengolah Data Produk Hantaran dan Dekorasi
Admin melakukan pengelolaan data Hantaran dan Dekorasi dari sistem
informasi penyewaan pada Anggun Hantaran dan Dekorasi. Diagram sequence
menampilkan aktivitas Admin saat menambah Hantaran dan Dekorasi, mengedit,
dan menghapus Hantaran dan Dekorasi.
AdminHalaman
UtamaMenu Paket
WeddingPaket
WeddingDatabase
1: Mengakses Menu Utama
1.1 : Tampil M. Utama
2: Pilih Menu Paket Wedding 2.1 : Mengolah Paket Wedding,
Simpan, Edit, Hapus
3: Akses Data
3.1 : Berhasil
4: Paket Wedding Berhasil di
Olah
Gambar 4.8 Diagram Sequence Mengelola Data Produk
5. Sequence Diagram Mengelola Data Laporan
Admin melakukan pengelolaan data laporan dari sistem informasi
penyewaan pada Anggun Hantaran dan Dekorasi. Diagram sequence
menampilkan aktivtas Admin saat mencetak laporan.
67
AdminHalaman
UtamaMenu Laporan Laporan Database
1: Mengakses Menu Utama
1.1 : Tampil M. Utama
2: Pilih Menu Laporan 2.1: Mengolah laporan
pelanggan dan pesanan
3: Cetak Data
3.1 : Berhasil
4: Berhasil Cetak Data Laporan
Gambar 4.9 Diagram Sequence Mengelola Data Laporan
4.3.3.4 Activity Diagram
Diagram aktivitas menggambarkan aktivitas dari sebuah sistem yang ada
pada perangkat lunak. Berikut adalah gambar dari activity diagram dari e-
marketing pada Anggun Hantaran dan Dekorasi.
1. Activity Diagram Login
Merupakan proses yang dijalankan sistem sebelum Admin dapat
mengakses sistem. Pada proses ini Admin wajib memasukkan username dan
password yang valid agar dapat menggunakan sistem.
68
Gambar 4.10 Activity Diagram Login
2. Activity Diagram Logout
Merupakan proses yang dijalankan sistem setelah Admin mengakses
sistem. Pada proses ini Admin hanya memilih menu keluar agar dapat keluar dari
sistem.
Gambar 4.11 Activity Diagram Logout
69
3. Activity Diagram Mengelola Data User
Activity Diagram mengelola data user yang menjelaskan tentang aktivitas
sistem saat menambah, mengedit dan menghapus data user. Adapun gambarnya
seperti berikut:
SistemAdmin
Halaman Administrator
Memilih Menu Data
User
Menampilkan Menu
Data User
Menambah/Mengedit/
Menghapus Data User
Menambah/Mengedit/
Menghapus Data User
Melihat Hasil
Penambahan/
Pengeditan/
Penghapussan
Gambar 4.12 Activity Diagram Data User
4. Activity Diagram Mengelola Data Produk Hantaran dan Dekorasi
Activity Diagram mengelola data Produk Hantaran dan Dekorasi yang
menjelaskan tentang aktivitas sistem saat menambah, mengedit dan menghapus
data Produk Hantaran dan Dekorasi. Adapun gambarnya seperti berikut.
70
SistemAdmin
Halaman Administrator
Memilih Menu Paket
Hantaran dan Dekorasi
Menampilkan Menu
Paket Hantaran dab
Dekorasi
Menambah/Mengedit/
Menghapus Paket
Hantaran dan Dekorasi
Menambah/Mengedit/
Menghapus Paket
Hantaran dan DekorasiMelihat Hasil
Penambahan/
Pengeditan/
Penghapussan
Gambar 4.13 Activity Diagram Mengelola Data Produk
5. Activity Diagram Mengelola Data Laporan
Activity Diagram mengelola data laporan yang menjelaskan tentang
aktivitas sistem saat mencetak data laporan. Adapun gambarnya seperti berikut.
Gambar 4.14 Activity Diagram Data Laporan
4.3.3.5 Flowchart
Berikut ini adalah flowchart dari sistem implementasi e-marketing pada
Anggun Hantaran dan Dekorasi yang akan dirancang.
71
1. Flowchart Login
Gambar 4.15 Flowchart Login
2. Flowchart Hak Akses Admin
Gambar 4.16 Flowchart Hak Akses Admin
Start
Input Username dan
password
Cek
Data
Halaman Utama
Halaman Login
True
False
End
End
Start
Input Username dan
password
Cek Data
Halaman Login
True
False
Menu Admin : 1. Data User
2. Jenis Hantaran dan Dekorasi
3. Laporan :
- Pelanggan
- Penyewaan
72
3. Flowchart Penyewaan
start
Lihat ketersediaan hantaran dan
dekorasi
Pilih
hantaran dan
dekorasi
Sistem menampilkan detail
hantaran dan dekorasi serta
harga sewa
sewa
Sistem menampilkan hantaran
dan dekorasi yang akan disewa
Batalkan
transaksi
Sistem menghapus transaksiTotal biaya sewa
Konfirmasi penyewaan
Sistem menyimpankan transaksi
yang telah terferifikasi
End
ya
tidak
tidak ya
Gambar 4.17 Flowchart Penyewaan
73
4.4 Perancangan Basis Data
4.4.1 Entity Relationship Diagram (ERD)
Adapun Entity Relationship Diagram (ERD) pada aplikasi e-marketing pada
Anggun Hantaran dan Dekorasi adalah sebagai berikut :
User menyewa
menyewakan
Jenis Dekorasi/
hantaran
admin
Id_regNama_lengkapemail
password
Jenis_kelamin
Tempat_lahir
Tgl_lhrnohp
id_pa nama_paket harga
keterangan
stok
foto
tgl_up
hit
idnama
username
password
Gambar 4. 18 ERD Penyewaan Hantaran dan Dekorasi
4.4.2 Struktur Data
Struktur data yang akan digunakan didalam perancangan sistem ini akan
menunjukan struktur dari elemen-elemen yang ada pada database. Adapun
struktur datanya yaitu :
74
Gambar 4.19 Struktur Data
1. Desain Tabel/File Dalam Database
Dalam merancang suatu sistem yang baik dibutuhkan beberapa file yang
bertujuan untuk memudahkan pengambilan informasi data yang akan dibutuhkan.
File-file ini akan berkaitan satu sama lainnya dan dapat digunakan sesuai dengan
kebutuhan pemakai atau user. Adapun file-file yang digunakan dalam rancangan
sistem yang baru adalah sebagai berikut :
1. Desain tabel akun
Nama Database : wedding-ex
Nama Tabel : akun
nama
id_reg
Nama_lengkap
password
Jenis_kelamin
Tempat_lahir
Tgl_lahir
No_hp
alamat
Admin
pelanggan pesan pesanan wedding akun
password
Id
username
akses
Id_pesan
pelanggan
pesan
tanggal
status
f_bukti
no_faktur
pelanggan
paket
tgl_pesan
tgl_sewa
id_pa
nama_paket
harga
keterangan
stok
foto
tanggal_up
hit
75
Tabel 4.11 Tabel Akun
No Field Name Type Size Description
1 Id Int 11 Id
2 Nama Varchar 50 Nama
3 Username Varchar 50 Username
4 Password Varchar 50 Password
5 Akses Varchar 10 Akses
2. Desain tabel pelanggan
Nama Database : wedding-ex
Nama Tabel : pelanggan
Tabel 4.12 Tabel Pelanggan
No Field Name Type Size Description
1 id_reg Int 11 Id Registrasi
2 nama_lengkap Varchar 50 Nama Lengkap
3 Email Varchar 50 Email
4 Password Varchar 50 Password
5 jenis_kelamin Varchar 20 Jenis Kelamin
6 tempat_lahir Varchar 100 Tempat Lahir
7 tgl_lahir Date - Tgl Lahir
8 Nohp Varchar 15 No Hp
9 Alamat Text - Alamat
3. Desain tabel pesan
Nama Database : wedding-ex
Nama Tabel : pesan
Tabel 4.13 Tabel Pesan
No Field Name Type Size Description
1 id_pesan Int 11 Id Pesan
2 Pelanggan Varchar 50 Pelanggan
3 Pesan Text - Pesan
4 Tanggal Timestamp - Tanggal
76
4. Desain tabel pesanan
Nama Database : wedding-ex
Nama Tabel : pesanan
Tabel 4.14 Tabel Pesanan
No Field Name Type Size Description
1 no_faktur Varchar 11 No Faktur
2 Pelanggan Int 11 Pelanggan
3 Paket Int 11 Paket
4 tgl_pesan Date - Tgl Pesan
5 tgl_sewa Date - Tgl Sewa
6 Status Varchar 25 Status
7 f_bukti Text - Foto Bukti
5. Desain tabel rating
Nama Database : wedding-ex
Nama Tabel : rating
Tabel 4.15 Tabel Rating
No Field Name Type Size Description
1 Id Int 11 id
2 user_id Int 11 Username id
3 product_id Int 11 Produk id
4 Vote float - voting
6. Desain tabel voucher
Nama Database : wedding-ex
Nama Tabel : voucher
Tabel 4.16 Tabel Voucher
No Field Name Type Size Description
1 Id Int 11 id
2 kd_voucher varchar 32 Kode voucher
3 Harga Int 11 Harga
77
7. Desain tabel wedding
Nama Database : wedding-ex
Nama Tabel : wedding
Tabel 4.17 Tabel Wedding
No Field Name Type Size Description
1 id_pa Int 11 Id Pa
2 nama_paket Varchar 100 Nama Paket
3 Harga Float - Harga
4 Keterangan Text - Keterangan
5 Stok Int 11 Stok
6 Foto Text - Foto
7 tanggal_up Date - Tanggal Up
8 Hit Int 11 Hit
4.5 Perancangan Antar Muka (User Interface)
4.5.1 Desain Global
Salah satu bentuk desain global adalah struktur program yang merupakan
gambaran dari rangkaian modul-modul program yang saling terikat satu sama lain
yang terlibat dalam proses pengolahan data. Berikut ini adalah struktur program e-
marketing Pada Anggun Hantaran dan Dekorasi yang dirancang seperti gambar
berikut:
78
Gambar 4.20 Desain Global
4.5.2 Desain Masukan
Desain masukan sangat penting dalam membangun sebuah sistem,
kuantitas informasi atau laporan yang akan dihasilkan nantinya tergantung pada
input yang dirancang.
Kegunaan desain masukan :
1. Memberikan tampilan bentuk pemasukan data pada layar komputer
2. Memudahkan pengguna untuk melakukan pekerjaan
3. Memastikan keakuratan data
Login
Halaman Utama
Administrator
A
Sistem Informasi Hantaran dan Dekorasi
Home
Data User
Paket Wedding
Laporan
Manajemen User
Hy, Admin
Laporan
Ganti Password
Logout
Pesan
79
4. Data dasar lebih mudah untuk diolah
5. Memberikan keterangan yang jelas bagi pemakai
Berikut ini adalah desain masukan pada Anggun Hantaran dan Dekorasi yang
dirancang seperti gambar berikut:
1. Rancangan Halaman Home Admin
Sistem Informasi Wedding Pernikahan Pesan Hy,Admin
Halaman Admin
Pesanan
No No.Faktur Pelanggan Paket Tgl
Pesan
Tgl
Sewa Harga Alamat Status Opsi
xxx Xxx Xxxx Xxx xxx xxx xxx Xxx xxx
Gambar 4.21 Rancangan Halaman Home Admin
2. Rancangan Halaman Home Publik
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
5 Paket Terpopuler
footer
Gambar 4.22 Rancangan Halaman Home Publik
HEADER
Gambar 1
Gambar 2
Gambar 3
Gambar 4
Gambar 5
Pesanan Pelanggan Jenis Hantaran
dan Dekorasi
80
3. Rancangan Halaman Login Admin
Anggun Hantaran dan Dekorasi
Login
Username
Password
Gambar 4.23 Rancangan Halaman Login Admin
4. Rancangan Halaman Input User
Gambar 4.24 Rancangan Halaman Input User
Tambah Data
Nama Lngkap
Password
Jenis Kelamin
Tempat Lahir
Tanggal Lahir
No Hp
Alamat
Batal Simpan
xxxxxxx
xxxxxxx
Login
81
5. Rancangan Halaman Input Produk
Gambar 4.25 Rancangan Halaman Input Produk
6. Rancangan Halaman Login User
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
Halaman Login
Silahkan Login
footer
Gambar 4.26 Rancangan Halaman Login User
Batal Simpan
Tambah Data
Nama Paket
Harga
Stok
Keterangan
Browse
Username
Password
LOgin Or Registrasi
82
7. Rancangan Halaman Input Pemesanan
Anggun Hantaran dan Dekorasi Home Akun Logout
Halaman Pelanggan
Menu
Profil
Pesan Paket Wedding
Cek Bukti Sewa
Kirim Pesan
Gambar 4.27 Rancangan Input Pesan Produk
8. Rancangan Halaman Form Registrasi
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
Halaman Registrasi
Gambar 4.28 Rancangan Halaman Form Registrasi
Register An Account
Masukkan Email Anda
Masukkan Nama Lengkap
Masukkan No Hp Anda
Form Registrasi
Masukkan Password yang di Inginkan
Tanggal Sewa
Nama Lengkap
Alamat
Silahkan lengkapi data
Pilih Paket
Selanjutnya Reset
83
9. Rancangan Halaman Konfirmasi Pemesanan
Sistem Informasi Wedding Pernikahan Pesan Hy,admin
Home
Data User
Paket Wedding Edit Status Pesanan
Laporan Nama Pelanggan
Status
Gambar 4.29 Rancangan Halaman Konfirmasi Pemesanan
10. Rancangan Halaman List Pesanan
Anggun Hantaran dan Dekorasi Home Akun Logout
List Pesanan
Nofak
xxxxx
Tgl Pesan
Xxxxxx
Tgl Sewa
Xxxxxx
Nama
xxxx
Nama Produk
xxxxxxxxxx
Harga
xxxxx
Opsi
xxxxxxx
Gambar 4.30 Rancangan Halaman List Pesananan
xxxxxxxxx
xxxxxxxxx
Status Bukti
Pembayaran
Upload Bukti
Batal Sewa
84
11. Rancangan Kirim Pesan/Pertanyaan
Anggun Hantaran dan Dekorasi Home Akun Logout
Halaman Pelanggan
Kirim Pesan atau Pertanyaan
Nama lengkap
Pesan
Gambar 4.31 Rancangan Halaman Kirim Pesan/Pertanyaan
12. Rancangan Halaman Semua Produk
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
Halaman Jenis Produk Hantaran dan Dekorasi
Semua jenis paket hantaran dan dekorasi
Gambar 4.32 Rancangan Halaman Semua Produk
13. Rancangan Halaman Informasi Sewa
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
Selamat Datang Di Anggun Hantaran dan Dekorasi
Informasi Sewa
xxxxxxxx
xxxxxxxxxx
Gambar 4.33 Rancangan Halaman Informasi Sewa
xxxxxxxxxxx
KIRIM RESET
Gambar 1
Pesan Sekarang More Info
Gambar 1 Gambar 1
Pesan Sekarang Pesan Sekarang More Info More Info
85
14. Rancangan Halaman Kontak
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
Informasi Kontak Anggun Hantaran dan Dekorasi
xxxxxxxx
Nomor Rekening
xxxxxxxxxx
Gambar 4.34 Rancangan Halaman Kontak
15. Rancangan Halaman Manajemen User
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak Login
Managemen User
Data Pelanggan
No Nama Email Jenis
Kelamin
Nohp Alamat Opsi
xxx Xxx Xxx Xxx xxx xxx
Gambar 4.35 Rancangan Halaman Manajemen User
16. Rancangan Halaman Komentar
Anggun Hantaran dan Dekorasi Home Paket Hantaran dan Dekorasi Informasi Sewa Kontak
Paket Wedding Pernikahan
0 Comment anggun hantaran Disqus Privacy Policy
Gambar 4.36 Rancangan Halaman Komentar
Pelanggan Operator
+Tambah Data
Gambar
Sewa produk Rp.xxxxx
………………..
86
4.5.3 Desain Keluaran
Desain keluaran merupakan tujuan akhir dari sebuah sistem informasi. Pada
desain ini dituntut untuk memproses data secara tepat dan akurat. Berikut ini
adalah desain output dari website e-marketing pada Anggun Hantaran dan
Dekorasi.
1. Rancangan Halaman Laporan Pelanggan
Sistem Informasi Wedding Pernikahan Pesan Hy,Admin
Pelanggan
Gambar 4.37 Rancangan Halaman Laporan Pelanggan
2. Rancangan Halaman Laporan Pemesanan
Sistem Informasi Wedding Pernikahan Pesan Hy,Admin
Laporan Pemesanan
Laporan Pesanan Bulanan
Gambar 4. 38 Rancangan Halaman Laporan Pemesanan
No Nama Email Jenis
Kelamin
T/Tgl
Lahir No Hp Alamat
xxx
xxx
xxx
Xxx
Xxx
xxx
xxx
No No
Faktur Pelanggan Paket
Tgl
Pesan
Tgl
Sewa Harga Alamat Status
xxx xxx xxx xxx xxx xxx xxx xxx xxx
+Cetak Laporan Pelanggan
Faktur Harian Bulanan Tahunan