Perancangan Aplikasi Online Penjualan Komik Berbasis Web Menggunakan Php Dan Mysql Chapter III V
BAB 3
PERANCANGAN SISTEM
3.1
Perancangan Sistem
Seiring dengan perkembangan teknologi informasi saat ini, serta untuk
meningkatkan efesiensi kerja dan waktu, maka masih banya ksistem yang ada saat
ini yang masih manual dan harus diganti dengan system yang lebih baik lagi. Hal
ini dilakukan dengan cara membangun system yang terkomputerisasi atau online.
Untuk memulai membangun suatu program mengenai perancangan system
informasi akademik, maka penulis terlebih dahulu merencanakan alur kerja
berdasarkan kebutuhan dari user yang akan menggunakan aplikasi basis data ini.
Perancangan merupakan proses yang dilakukan oleh perancang system
untuk mengerjakan spesifikasi sistem, membuat keputusan tentang bagaimana
komponen system diaktualisasikan. Proses ini menyangkut tujuan sistem tersebut,
audience, objek dan informasi domain. Perancangan yang baik harus mengetahui
bagaiman amendapatkan efek yang dibutuhkan oleh spesifikasi tersebut dengan
cara paling fleksibel, efesien dan elegan.
Universitas Sumatera Utara
3.2
Data Flow Diagram (DFD) Perancangan Aplikasi
Data Flow Diagram(DFD) merupakan model dari sistem untuk menggambarkan
pembagian sistem kemodulyang lebih kecil. Salah satu keuntungan menggunakan
diagramalir data adalah memudahkan pemakai yang kurang menguasai bidang
komputer untuk mengerti sistem yang akan dikerjakan. Pada
tahap analisa,
penanganan notasi simbollingkaran dan anak panah menggambarkan arus data
dalam perancangan sistem sangat membantu dalam komunikasi dengan
pemakaian sistem menggunakan notasi– notasi untuk menggambarkan arus dari
data sistem.
Disamping itu DFD adalah salah satu alat pembuatan model yang sering
digunakan, khususnya bila fungsi–fungsi system merupakan bagianyang lebih
penting dan kompleks daripada data yang dimanipulasi oleh sistem. Dengan kata
lain, DFD adalah alat pembuatan modelyangmemberikan penekanan hanyapada
fungsi sistem.
DFD juga merupakan alat perancangan system yang berorientasi pada alur
data dengan konsep dekomposisi dapat digunakan untuk penggambaran analisa
maupun rancangan system yang mudah dikomunikasikan oleh professional system
kepada pemakai maupun pembuat program.
Universitas Sumatera Utara
3.2.1
Diagram Konteks Toko Mangamon
Diagram Konteks adalah sebuah diagram sederhana yang menggambarkan
hubungan antara entity luar, masukan dan keluaran dari sistem. Diagram konteks
direpresentasikan dengan lingkaran tunggal yang mewakili keseluruhan sistem.
Berikut ini adalah diagram konteks dari Toko online Mangamon:
Gambar 3.2.1 Diagram Kontek Mangamon
Universitas Sumatera Utara
3.2.2 Data Flow Diagram (DFD) Level 0
Username dan pass
Username dan pass
D1Admin
Info produk
Data admin
2.1
Informasi pemesanan
Informasi pemesanan
Pembeli
Pemesanan
Admin
Data produk
D2
3.1
Atur
Produk
Produk
D3Kategori
Data produkData kategori
Info produk
Pengunjung
Gambar 3.2.2 Data Flow Diagram (DFD) Level 0
Universitas Sumatera Utara
3.2.3 Data Flow Diagram (DFD) Level 1
a.Admin
b.costumer
log in
or
1 order
Username
Password
Input
data
D1 | Admin
2
Produk
kategori
informasi
D2 | produk
3
C
Produk
Kategori produk
Aksesoris olahraga
Baju olahraga
Basket
Bulu tangkis
Futsal & sepakbola
Hot item
Tennis
D3| Kategori
Gambar 3.2.3 Data Flow Diagram (DFD) Level 1
Universitas Sumatera Utara
3.3
Perancangan Database Aplikasi
Database adalah kumpulan dari data yang berhubungan antara yang satu dengan
yang lainnya, tersimpan diperangkat keras komputer dan menggunakan perangkat
lunak untuk memanipulasinya. Database merupakan salah satu komponen yang
penting dalam sistem komputerisasi, karena database merupakan kumpulan dari
beberapa file, dalam hal ini file–file tersebut dikelompokan secara terstruktur
dalam beberapa tabel sesuai dengan informasi yang terkandung di dalamnya.
3.3.1 ERD (Entity Relationship Diagram)
Proses perancangan database menggunakan ERD ( Entity Relationship Diagram)
ditunjukan pada Gambar 3.3.1
id
nama
id
gambar
kategori
deskripsi
Produk
username
password
memiliki
atur
harga
kategori
ukuran
Admin
nama
id
gambar
untuk
cek
Bukti
pembayaran
harga
upload
Nama
id
pemesanan
Nama_pembeli
status
alamat
melakukan
pembeli
Tanggal
email
jumlah
No_hp
Gambar 3.3.1 ERD ( Entity Relationship Diagram)
Universitas Sumatera Utara
3.3.2 Relationship (Relasi Antar Tabel)
Tabel saling berelasi dalam aplikasi I-Commerce ini. Relasi antar tabel ditunjukan
pada Gambar 3.3.2
Gambar 3.3.2 Relationship (Relasi Antar Tabel)
3.3.3 Struktur Tabel
Berikut ini rancangan tabel yang penulis gunakan dalam membangun aplikasi
ini :
Tabel Admins terdiri dari :
Tabel 3.3.3.1 Tabel Admins
Field Name
Data Type
Size
Description
Username
Varchar
50
Username
Universitas Sumatera Utara
Password
varchar
50
Password
Nama_lengkap
varchar
100
Nama lengkap
Email
varchar
100
email
No_telp
varchar
20
No telp
Level
Varchar
20
level
Tabel hubungi terdiri dari :
Tabel 3.3.3.2. Tabel hubungi
Field Name
Data Type
Size
Description
Id_hubungi
Int
5
Id hubungi
Id_kustomer
Int
5
Id kustomer
Subjek
Varchar
100
subjek
Pesan
Text
-
pesan
Tanggal
Date
-
Tanggal
Tabel kategori terdiri dari :
Tabel 3.3.3.3 Tabel Kategori
Field Name
Data Type
Size
Description
Id_kategori
Int
5
Id
Nama_kategori
Varchar
100
Nama kategori
Universitas Sumatera Utara
Tabel kota terdiri dari :
Tabel 3.3.3.4 Tabel kota
Field Name
Data Type
Size
Description
Id_kota
Int
3
Id kota
Nama_kota
Varchar
100
Nama kota
Ongkos_kirim
Int
10
Ongkos kirim
Tabel Kustomer terdiri dari:
Tabel 3.3.3.5 Tabel kustomer
Field name
Data type
Size
Description
Id_kustomer
Int
5
Id kustomer
Password
Varchar
50
Password
Nama_lengkap
Varchar
100
Nama lengkap
Alamat
Text
-
Alamat
Email
Varchar
100
Email
Telpon
Varchar
20
Telpon
Id_kota
Int
5
Id kota
Universitas Sumatera Utara
Tabel modul terdiri dari
Tabel 3.3.3.6 Tabel modul
Field name
Data type
Size
Description
Id_modul
Int
5
Id modul
Static_content
Text
-
Static content
Gambar
Varchar
100
gambar
Tabel Orders terdiri dari:
Tabel 3.3.3.7 Tabel Order
Field Name
Data type
Size
Description
Id_orders
Int
5
Id orders
Status_orders
Varchar
50
Status_order
Tgl_order
Date
-
Tgl order
Jam_order
Time
-
Jam order
Id_kustomer
Int
5
Id kustomer
Universitas Sumatera Utara
Tabel order_detail terdiri dari:
Tabel 3.3.3.8 Tabel order_detail
Field name
Data type
Size
Description
Id_orders
Int
5
Id orders
Id_produk
Int
5
Id produk
Jumlah
Int
5
Jumlah
Tabel order_temp terdiri dari:
Tabel 3.3.3.9 Tabel order_temp
Field name
Data type
Size
Description
Id_orders_temp
Int
5
Id orders temp
Id_produk
Int
5
Id produk
Id_session
Varchar
100
Id session
Jumlah
Int
5
Jumlah
Tgl_orders_temp
Date
-
Tgl orders temp
Jam_order_temp
Time
-
Jam order temp
Stok_temp
Int
5
Stok temp
Universitas Sumatera Utara
Tabel produk terdiri dari:
Tabel 3.3.3.10 Tabel produk
Field name
Data type
Size
Description
Id_produk
Int
5
Id produk
Id_kategori
Int
5
Id kategori
Nama_produk
Varchar
100
Nama produk
Deskripsi
Text
-
Deskripsi
Harga
Int
20
Harga
Stok
Int
5
Stok
Berat
Decimal
5,2
Berat
Tgl_masuk
Date
-
Tgl masuk
Gambar
Varchar
100
Gambar
Dibeli
Int
5
dibeli
Diskon
Int
5
diskon
3.4
Flowchart Program Mangamon
Flowchart menggambarkan aliran pada sistem aplikasi komik pada website
Mangamon. Secara umum, user masuk ke aplikasi melihat
info produk lalu
melakukan pemesanan. Selanjutnya admin kita akan memeriksa pesanandan
mengkonfirmasi pemesanan.
Universitas Sumatera Utara
3.4.1 Flowchart Menu Utama
Flowchart menu utama dapat dilihat pada gambar dibawah ini :
START
PILIH KATEGORI
PILIH PRODUK
Y
BELANJA LAGI ?
T
MENYERAHKAN PRODUK
PEMBAYARAN
TUTUP APLIKASI
3.4.1 Gambar Flowchart Menu Utama
3.4.2 Flowchart Login Admin
Flowchart login admin dapat dilihat pada gambar dibawah ini :
Universitas Sumatera Utara
L_adm
Masukkan Username &
password
Login
Reset
Y
Hapus username &
Password
T
Y
Validasi Username
& Password
X
T
Valid
Y
M_adm
Gambar 3.4.2 Alur Flowchart Login Admin
3.4.3 Flowchart Menu Admin
Flowchar tmenu admin dapat dilihat pada gambar dibawah ini :
Universitas Sumatera Utara
M_Admin
Tampilan
Menu Admin
Pilih
Y
Y
Y
Tambah
Produk
Tambah Produk
Produk
T
Masukan
Data
T
Data Batal
Disimpan
Simpan
T
Simpan Data
T
Data Produk
Data
Disimpan
Y
Ubah Produk
Ubah Produk
Pilih
Data
Y
Ubah
T
Data Batal
Diubah
Ubah Data
T
Data Produk
Data Diubah
Y
Hapus
Produk
Hapus Produk
Pilih
Data
Y
Hapus
T
Data Batal
Dihapus
Hapus Data
T
Data Produk
Data
Dihapus
Y
Y
Tambah
Kategori
Kategori
Tambah
Kategori
Masukan
Data
Data Batal
Disimpan
T
Simpan Data
T
T
Y
Simpan
Data Kategori
Data
Disimpan
Y
Ubah Kategori
Ubah Produk
Pilih
Data
Y
Ubah
Data Batal
Diubah
T
Ubah Data
T
Data Kategori
Data Diubah
Y
Hapus Kategori
Hapus
Kategori
Pilih
Data
Y
Hapus
T
Data Batal
Dihapus
Hapus Data
T
Data Kategori
Data
Dihapus
Y
keluar
T
X
Gambar 3.4.3 Alur Flowchart Menu Admin
3.5 Algoritma Perancangan Toko Online Mangamon
Algoritma Kategori Beranda
Langkah I
: Pilih menu Beranda.
Universitas Sumatera Utara
Langkah II
: Menampilkan halaman utama website.
Algoritma Kategori Profil
Langkah I
: Pilih menu Profil
Langkah II
: Menampilkan halaman profil seputar Sukamol
Algoritma Kategori Produk
Langkah I
: Pilih menu Kategori Produk.
Langkah II
: Menampilkan halaman Kategori Produk.
Langkah II
:Pilih produk
Algoritma Keranjang Belanja
Langkah I
: Pilih menu Kategori Keranjang Belanja
Langkah II
: Menampilkan Barang yang telah kita pilih untuk di beli
Algoritma Hubungi kami
Langkah I
: Pilih menu Testimoni.
Langkah II
: Menampilkan halaman Testimoni pelanggan melalui
pesan.
Universitas Sumatera Utara
BAB 4
IMPLEMENTASI SISTEM
4.1 Definisi Implementasi Sistem
Implementasi sistem merupakan langkah-langkah atau prosedur yang dilakukan
dalam menyelesaikan desain sistemyang telah disetujui, untuk menguji, menginstall, dan memulai sistem baru atausistem yang diperbaiki untuk menggantikan
sistem yang lama, sedangkan tahapimplementasi sistem merupakan tahap
meletakkan sistem agar sistem dapat siap untukdioperasikan.
4.2 Tujuan Implementasi
Adapun tujuan implementasi sistem, yaitu:
a. Mengkaji rangkaian sistem baik dari segi software maupun hardware
sebagaisarana pengolah data dan penyaji informasi.
b. Memastikan bahwa pemakai dapat mengoperasikan dengan mudah
terhadapsistem yang baru dan mendapat informasi yang baik dan jelas.
Universitas Sumatera Utara
4.3 Komponen dalam Implementasi Sistem
Agar perancangan sistem yang telah kita kerjakan dapat berjalan baik atau tidak,
maka perlu dilakukan pengujian terhadap sistem yang telah dikerjakan. Untuk itu
dibutuhkan beberapa komponen utama yang mencakup perangkat keras
(hardware), perangkat lunak (software) dan perangkat operator (brainware).
4.3.1 Kebutuhan Perangkat Keras
Perangkat keras (hardware) merupakan komponen peralatan yangmembentuk
suatu sistem komputer dan peralatan tambahan lainnyayang mungkin komputer
menjalankan tugasnya sesuai dengan yang diberikan.Komponen ini bersifat nyata
secara fisik, artinya dapat dilihat dandipergunakan, misalnya monitor, CPU
(Central Processing Unit), printer, keyboard,dan mouse.
Spesifikasi perangkat keras komputer yang digunakan dalam pembuatan
website ini adalah:
1. Laptop dengan Processo Intel Core i3
2. Memory2 GB
3. Harddisk sebagai media penyimpanan
4. DVDR/W
Universitas Sumatera Utara
4.3.2 Kebutuhan Perangkat Lunak
Hardware tidak dapat menyelesaikan masalah tanpa adanya software. Software
merupakan komponen di dalam sistem data berupa program atau instruksi
untukmengontrol suatu sistem. Perangkat lunak yang diperlukan untuk
menjalankanperangkat kerasnya adalah:
1. Windows 7 Ultimate
2. Apache
3. Mysql
4. Browser
5. Sublime Text
4.3.3 Kebutuhan Brainware
Perangkat Operator (Brainware) yang dapat menjalankan website ini terbagi
menjadi 3 yaitu :
1. Administrator
2. Member
3. Visitor
Universitas Sumatera Utara
4.4 Tampilan Halaman Website
Untuk menjalankan sistem guna web browser pada pengujian ini penulis
menggunakan web browser Google Chrome setelah web browser jalan, ketikkan
pada address bar http://localhost/toko/home.php untuk pengetesan halaman
utama. Halaman utama sistem tersebut seperti pada gambar berikut :
Gambar 4.4.1 Halaman Home
Universitas Sumatera Utara
Gambar 4.4.2 Halaman Profil
Gambar 4.4.3 Halaman Cara Pemesanan
Universitas Sumatera Utara
Gambar 4.4.4 Halaman Produk
Gambar 4.4.5 Halaman Keranjang Belanja
Universitas Sumatera Utara
Gambar 4.4.6 Halaman Testimoni
Gambar 4.4.7 Halaman Login Admin
Universitas Sumatera Utara
Gambar 4.4.8 Halaman Home Admin
Gambar 4.4.9 Halaman Edit Profil Toko Admin
Universitas Sumatera Utara
Gambar 4.4.10 Halaman Info Rekening Toko Admin
Gambar 4.4.11 Halaman Kategori Produk Admin
Universitas Sumatera Utara
Gambar 4.4.12 Halaman Tambah Produk Admin
Gambar 4.4.13 Halaman Order Admin
Universitas Sumatera Utara
Gambar 4.4.14 Halaman Ongkos Kirim Admin
Gambar 4.4.15 Halaman Cara Pembelian Admin
Universitas Sumatera Utara
BAB 5
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Dari keterangan dan bab-bab sebelumnya penulis dapat mengambil kesimpulan
adalah sebagai berikut :
1. Web ini dibuat bertujuan untuk memudahkan user melakukan transaksi
barang dengan cara yang lebih praktis dan nyaman.
2. E-commerce sangat berkembang di dunia maya dan banyak investor yang
menanamkan modal di bisnis ini.
3. Perancangan web yang di tuntun harus menarik dan efektif, menjadikan
web yang dapat di pakai semua masyarakat.
Universitas Sumatera Utara
5.2 Saran
Adapun beberapa saran penulis pada pembuatan sistem ini adalah:
1. Barang yang di jual semakin tambah banyak supaya pelanggan puas akan
pelayanannya.
2. Tampilan website yang menarik juga poin plus tersendiri bagi yang
melihat.
Universitas Sumatera Utara
PERANCANGAN SISTEM
3.1
Perancangan Sistem
Seiring dengan perkembangan teknologi informasi saat ini, serta untuk
meningkatkan efesiensi kerja dan waktu, maka masih banya ksistem yang ada saat
ini yang masih manual dan harus diganti dengan system yang lebih baik lagi. Hal
ini dilakukan dengan cara membangun system yang terkomputerisasi atau online.
Untuk memulai membangun suatu program mengenai perancangan system
informasi akademik, maka penulis terlebih dahulu merencanakan alur kerja
berdasarkan kebutuhan dari user yang akan menggunakan aplikasi basis data ini.
Perancangan merupakan proses yang dilakukan oleh perancang system
untuk mengerjakan spesifikasi sistem, membuat keputusan tentang bagaimana
komponen system diaktualisasikan. Proses ini menyangkut tujuan sistem tersebut,
audience, objek dan informasi domain. Perancangan yang baik harus mengetahui
bagaiman amendapatkan efek yang dibutuhkan oleh spesifikasi tersebut dengan
cara paling fleksibel, efesien dan elegan.
Universitas Sumatera Utara
3.2
Data Flow Diagram (DFD) Perancangan Aplikasi
Data Flow Diagram(DFD) merupakan model dari sistem untuk menggambarkan
pembagian sistem kemodulyang lebih kecil. Salah satu keuntungan menggunakan
diagramalir data adalah memudahkan pemakai yang kurang menguasai bidang
komputer untuk mengerti sistem yang akan dikerjakan. Pada
tahap analisa,
penanganan notasi simbollingkaran dan anak panah menggambarkan arus data
dalam perancangan sistem sangat membantu dalam komunikasi dengan
pemakaian sistem menggunakan notasi– notasi untuk menggambarkan arus dari
data sistem.
Disamping itu DFD adalah salah satu alat pembuatan model yang sering
digunakan, khususnya bila fungsi–fungsi system merupakan bagianyang lebih
penting dan kompleks daripada data yang dimanipulasi oleh sistem. Dengan kata
lain, DFD adalah alat pembuatan modelyangmemberikan penekanan hanyapada
fungsi sistem.
DFD juga merupakan alat perancangan system yang berorientasi pada alur
data dengan konsep dekomposisi dapat digunakan untuk penggambaran analisa
maupun rancangan system yang mudah dikomunikasikan oleh professional system
kepada pemakai maupun pembuat program.
Universitas Sumatera Utara
3.2.1
Diagram Konteks Toko Mangamon
Diagram Konteks adalah sebuah diagram sederhana yang menggambarkan
hubungan antara entity luar, masukan dan keluaran dari sistem. Diagram konteks
direpresentasikan dengan lingkaran tunggal yang mewakili keseluruhan sistem.
Berikut ini adalah diagram konteks dari Toko online Mangamon:
Gambar 3.2.1 Diagram Kontek Mangamon
Universitas Sumatera Utara
3.2.2 Data Flow Diagram (DFD) Level 0
Username dan pass
Username dan pass
D1Admin
Info produk
Data admin
2.1
Informasi pemesanan
Informasi pemesanan
Pembeli
Pemesanan
Admin
Data produk
D2
3.1
Atur
Produk
Produk
D3Kategori
Data produkData kategori
Info produk
Pengunjung
Gambar 3.2.2 Data Flow Diagram (DFD) Level 0
Universitas Sumatera Utara
3.2.3 Data Flow Diagram (DFD) Level 1
a.Admin
b.costumer
log in
or
1 order
Username
Password
Input
data
D1 | Admin
2
Produk
kategori
informasi
D2 | produk
3
C
Produk
Kategori produk
Aksesoris olahraga
Baju olahraga
Basket
Bulu tangkis
Futsal & sepakbola
Hot item
Tennis
D3| Kategori
Gambar 3.2.3 Data Flow Diagram (DFD) Level 1
Universitas Sumatera Utara
3.3
Perancangan Database Aplikasi
Database adalah kumpulan dari data yang berhubungan antara yang satu dengan
yang lainnya, tersimpan diperangkat keras komputer dan menggunakan perangkat
lunak untuk memanipulasinya. Database merupakan salah satu komponen yang
penting dalam sistem komputerisasi, karena database merupakan kumpulan dari
beberapa file, dalam hal ini file–file tersebut dikelompokan secara terstruktur
dalam beberapa tabel sesuai dengan informasi yang terkandung di dalamnya.
3.3.1 ERD (Entity Relationship Diagram)
Proses perancangan database menggunakan ERD ( Entity Relationship Diagram)
ditunjukan pada Gambar 3.3.1
id
nama
id
gambar
kategori
deskripsi
Produk
username
password
memiliki
atur
harga
kategori
ukuran
Admin
nama
id
gambar
untuk
cek
Bukti
pembayaran
harga
upload
Nama
id
pemesanan
Nama_pembeli
status
alamat
melakukan
pembeli
Tanggal
jumlah
No_hp
Gambar 3.3.1 ERD ( Entity Relationship Diagram)
Universitas Sumatera Utara
3.3.2 Relationship (Relasi Antar Tabel)
Tabel saling berelasi dalam aplikasi I-Commerce ini. Relasi antar tabel ditunjukan
pada Gambar 3.3.2
Gambar 3.3.2 Relationship (Relasi Antar Tabel)
3.3.3 Struktur Tabel
Berikut ini rancangan tabel yang penulis gunakan dalam membangun aplikasi
ini :
Tabel Admins terdiri dari :
Tabel 3.3.3.1 Tabel Admins
Field Name
Data Type
Size
Description
Username
Varchar
50
Username
Universitas Sumatera Utara
Password
varchar
50
Password
Nama_lengkap
varchar
100
Nama lengkap
varchar
100
No_telp
varchar
20
No telp
Level
Varchar
20
level
Tabel hubungi terdiri dari :
Tabel 3.3.3.2. Tabel hubungi
Field Name
Data Type
Size
Description
Id_hubungi
Int
5
Id hubungi
Id_kustomer
Int
5
Id kustomer
Subjek
Varchar
100
subjek
Pesan
Text
-
pesan
Tanggal
Date
-
Tanggal
Tabel kategori terdiri dari :
Tabel 3.3.3.3 Tabel Kategori
Field Name
Data Type
Size
Description
Id_kategori
Int
5
Id
Nama_kategori
Varchar
100
Nama kategori
Universitas Sumatera Utara
Tabel kota terdiri dari :
Tabel 3.3.3.4 Tabel kota
Field Name
Data Type
Size
Description
Id_kota
Int
3
Id kota
Nama_kota
Varchar
100
Nama kota
Ongkos_kirim
Int
10
Ongkos kirim
Tabel Kustomer terdiri dari:
Tabel 3.3.3.5 Tabel kustomer
Field name
Data type
Size
Description
Id_kustomer
Int
5
Id kustomer
Password
Varchar
50
Password
Nama_lengkap
Varchar
100
Nama lengkap
Alamat
Text
-
Alamat
Varchar
100
Telpon
Varchar
20
Telpon
Id_kota
Int
5
Id kota
Universitas Sumatera Utara
Tabel modul terdiri dari
Tabel 3.3.3.6 Tabel modul
Field name
Data type
Size
Description
Id_modul
Int
5
Id modul
Static_content
Text
-
Static content
Gambar
Varchar
100
gambar
Tabel Orders terdiri dari:
Tabel 3.3.3.7 Tabel Order
Field Name
Data type
Size
Description
Id_orders
Int
5
Id orders
Status_orders
Varchar
50
Status_order
Tgl_order
Date
-
Tgl order
Jam_order
Time
-
Jam order
Id_kustomer
Int
5
Id kustomer
Universitas Sumatera Utara
Tabel order_detail terdiri dari:
Tabel 3.3.3.8 Tabel order_detail
Field name
Data type
Size
Description
Id_orders
Int
5
Id orders
Id_produk
Int
5
Id produk
Jumlah
Int
5
Jumlah
Tabel order_temp terdiri dari:
Tabel 3.3.3.9 Tabel order_temp
Field name
Data type
Size
Description
Id_orders_temp
Int
5
Id orders temp
Id_produk
Int
5
Id produk
Id_session
Varchar
100
Id session
Jumlah
Int
5
Jumlah
Tgl_orders_temp
Date
-
Tgl orders temp
Jam_order_temp
Time
-
Jam order temp
Stok_temp
Int
5
Stok temp
Universitas Sumatera Utara
Tabel produk terdiri dari:
Tabel 3.3.3.10 Tabel produk
Field name
Data type
Size
Description
Id_produk
Int
5
Id produk
Id_kategori
Int
5
Id kategori
Nama_produk
Varchar
100
Nama produk
Deskripsi
Text
-
Deskripsi
Harga
Int
20
Harga
Stok
Int
5
Stok
Berat
Decimal
5,2
Berat
Tgl_masuk
Date
-
Tgl masuk
Gambar
Varchar
100
Gambar
Dibeli
Int
5
dibeli
Diskon
Int
5
diskon
3.4
Flowchart Program Mangamon
Flowchart menggambarkan aliran pada sistem aplikasi komik pada website
Mangamon. Secara umum, user masuk ke aplikasi melihat
info produk lalu
melakukan pemesanan. Selanjutnya admin kita akan memeriksa pesanandan
mengkonfirmasi pemesanan.
Universitas Sumatera Utara
3.4.1 Flowchart Menu Utama
Flowchart menu utama dapat dilihat pada gambar dibawah ini :
START
PILIH KATEGORI
PILIH PRODUK
Y
BELANJA LAGI ?
T
MENYERAHKAN PRODUK
PEMBAYARAN
TUTUP APLIKASI
3.4.1 Gambar Flowchart Menu Utama
3.4.2 Flowchart Login Admin
Flowchart login admin dapat dilihat pada gambar dibawah ini :
Universitas Sumatera Utara
L_adm
Masukkan Username &
password
Login
Reset
Y
Hapus username &
Password
T
Y
Validasi Username
& Password
X
T
Valid
Y
M_adm
Gambar 3.4.2 Alur Flowchart Login Admin
3.4.3 Flowchart Menu Admin
Flowchar tmenu admin dapat dilihat pada gambar dibawah ini :
Universitas Sumatera Utara
M_Admin
Tampilan
Menu Admin
Pilih
Y
Y
Y
Tambah
Produk
Tambah Produk
Produk
T
Masukan
Data
T
Data Batal
Disimpan
Simpan
T
Simpan Data
T
Data Produk
Data
Disimpan
Y
Ubah Produk
Ubah Produk
Pilih
Data
Y
Ubah
T
Data Batal
Diubah
Ubah Data
T
Data Produk
Data Diubah
Y
Hapus
Produk
Hapus Produk
Pilih
Data
Y
Hapus
T
Data Batal
Dihapus
Hapus Data
T
Data Produk
Data
Dihapus
Y
Y
Tambah
Kategori
Kategori
Tambah
Kategori
Masukan
Data
Data Batal
Disimpan
T
Simpan Data
T
T
Y
Simpan
Data Kategori
Data
Disimpan
Y
Ubah Kategori
Ubah Produk
Pilih
Data
Y
Ubah
Data Batal
Diubah
T
Ubah Data
T
Data Kategori
Data Diubah
Y
Hapus Kategori
Hapus
Kategori
Pilih
Data
Y
Hapus
T
Data Batal
Dihapus
Hapus Data
T
Data Kategori
Data
Dihapus
Y
keluar
T
X
Gambar 3.4.3 Alur Flowchart Menu Admin
3.5 Algoritma Perancangan Toko Online Mangamon
Algoritma Kategori Beranda
Langkah I
: Pilih menu Beranda.
Universitas Sumatera Utara
Langkah II
: Menampilkan halaman utama website.
Algoritma Kategori Profil
Langkah I
: Pilih menu Profil
Langkah II
: Menampilkan halaman profil seputar Sukamol
Algoritma Kategori Produk
Langkah I
: Pilih menu Kategori Produk.
Langkah II
: Menampilkan halaman Kategori Produk.
Langkah II
:Pilih produk
Algoritma Keranjang Belanja
Langkah I
: Pilih menu Kategori Keranjang Belanja
Langkah II
: Menampilkan Barang yang telah kita pilih untuk di beli
Algoritma Hubungi kami
Langkah I
: Pilih menu Testimoni.
Langkah II
: Menampilkan halaman Testimoni pelanggan melalui
pesan.
Universitas Sumatera Utara
BAB 4
IMPLEMENTASI SISTEM
4.1 Definisi Implementasi Sistem
Implementasi sistem merupakan langkah-langkah atau prosedur yang dilakukan
dalam menyelesaikan desain sistemyang telah disetujui, untuk menguji, menginstall, dan memulai sistem baru atausistem yang diperbaiki untuk menggantikan
sistem yang lama, sedangkan tahapimplementasi sistem merupakan tahap
meletakkan sistem agar sistem dapat siap untukdioperasikan.
4.2 Tujuan Implementasi
Adapun tujuan implementasi sistem, yaitu:
a. Mengkaji rangkaian sistem baik dari segi software maupun hardware
sebagaisarana pengolah data dan penyaji informasi.
b. Memastikan bahwa pemakai dapat mengoperasikan dengan mudah
terhadapsistem yang baru dan mendapat informasi yang baik dan jelas.
Universitas Sumatera Utara
4.3 Komponen dalam Implementasi Sistem
Agar perancangan sistem yang telah kita kerjakan dapat berjalan baik atau tidak,
maka perlu dilakukan pengujian terhadap sistem yang telah dikerjakan. Untuk itu
dibutuhkan beberapa komponen utama yang mencakup perangkat keras
(hardware), perangkat lunak (software) dan perangkat operator (brainware).
4.3.1 Kebutuhan Perangkat Keras
Perangkat keras (hardware) merupakan komponen peralatan yangmembentuk
suatu sistem komputer dan peralatan tambahan lainnyayang mungkin komputer
menjalankan tugasnya sesuai dengan yang diberikan.Komponen ini bersifat nyata
secara fisik, artinya dapat dilihat dandipergunakan, misalnya monitor, CPU
(Central Processing Unit), printer, keyboard,dan mouse.
Spesifikasi perangkat keras komputer yang digunakan dalam pembuatan
website ini adalah:
1. Laptop dengan Processo Intel Core i3
2. Memory2 GB
3. Harddisk sebagai media penyimpanan
4. DVDR/W
Universitas Sumatera Utara
4.3.2 Kebutuhan Perangkat Lunak
Hardware tidak dapat menyelesaikan masalah tanpa adanya software. Software
merupakan komponen di dalam sistem data berupa program atau instruksi
untukmengontrol suatu sistem. Perangkat lunak yang diperlukan untuk
menjalankanperangkat kerasnya adalah:
1. Windows 7 Ultimate
2. Apache
3. Mysql
4. Browser
5. Sublime Text
4.3.3 Kebutuhan Brainware
Perangkat Operator (Brainware) yang dapat menjalankan website ini terbagi
menjadi 3 yaitu :
1. Administrator
2. Member
3. Visitor
Universitas Sumatera Utara
4.4 Tampilan Halaman Website
Untuk menjalankan sistem guna web browser pada pengujian ini penulis
menggunakan web browser Google Chrome setelah web browser jalan, ketikkan
pada address bar http://localhost/toko/home.php untuk pengetesan halaman
utama. Halaman utama sistem tersebut seperti pada gambar berikut :
Gambar 4.4.1 Halaman Home
Universitas Sumatera Utara
Gambar 4.4.2 Halaman Profil
Gambar 4.4.3 Halaman Cara Pemesanan
Universitas Sumatera Utara
Gambar 4.4.4 Halaman Produk
Gambar 4.4.5 Halaman Keranjang Belanja
Universitas Sumatera Utara
Gambar 4.4.6 Halaman Testimoni
Gambar 4.4.7 Halaman Login Admin
Universitas Sumatera Utara
Gambar 4.4.8 Halaman Home Admin
Gambar 4.4.9 Halaman Edit Profil Toko Admin
Universitas Sumatera Utara
Gambar 4.4.10 Halaman Info Rekening Toko Admin
Gambar 4.4.11 Halaman Kategori Produk Admin
Universitas Sumatera Utara
Gambar 4.4.12 Halaman Tambah Produk Admin
Gambar 4.4.13 Halaman Order Admin
Universitas Sumatera Utara
Gambar 4.4.14 Halaman Ongkos Kirim Admin
Gambar 4.4.15 Halaman Cara Pembelian Admin
Universitas Sumatera Utara
BAB 5
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Dari keterangan dan bab-bab sebelumnya penulis dapat mengambil kesimpulan
adalah sebagai berikut :
1. Web ini dibuat bertujuan untuk memudahkan user melakukan transaksi
barang dengan cara yang lebih praktis dan nyaman.
2. E-commerce sangat berkembang di dunia maya dan banyak investor yang
menanamkan modal di bisnis ini.
3. Perancangan web yang di tuntun harus menarik dan efektif, menjadikan
web yang dapat di pakai semua masyarakat.
Universitas Sumatera Utara
5.2 Saran
Adapun beberapa saran penulis pada pembuatan sistem ini adalah:
1. Barang yang di jual semakin tambah banyak supaya pelanggan puas akan
pelayanannya.
2. Tampilan website yang menarik juga poin plus tersendiri bagi yang
melihat.
Universitas Sumatera Utara