BAB III PERANCANGAN SISTEM

24

BAB III PERANCANGAN SISTEM

3.1

Flowchart User memilih pada menu utama yang berisi pilihan menu untuk menuju pada halaman tentang kami, produk kami, hubungi kami dan login admin. Jika user ingin membeli dan melihat produk maka user bisa memilih menu produk kami. Setelah user memilih produk yang akan dibeli maka user/calon member diharuskan untuk login terlebih dahulu. Member yang sudah memiliki user dan password bisa langsung melakukan login tetapi untuk member belum memiliki username dan password diharuskan terlebih dahulu untuk mengisi form setelah itu member tersebut baru bisa memesan produk dan mengisi buku tamu yang secara otomatis tersimpan dalam database. Admin betugas mengelola semua aktivitas member juga diharuskan login terlebih dahulu. Setelah masuk ke dalam halaman admin, admin bertugas untuk memperbarui barang yang ditawarkan, melihat semua member, melihat dan melakukan validasi terhadap pesanan member. Admin juga bertugas mengelola buku tamu yang telah diisi member.

24

25

Gambar 3.1Flowchart Daftar Member

Gambar 3.2Flowchart Transaksi Pembelian Member

26

Gambar 3.3Flowchart Admin

3.2

Context Diagram Dalam website penjualan member hanya bisa mengisi data diri member, login, memesan produk dan mengisi buku tamu. Member mendapatkan output dari website tersebut dengan mendapatkan username dan password untuk masuk ke halaman masing-masing member dan melihat produk. Admin selaku user yang mempunyai hak akses untuk mengelola website penjualan tersebut bertugas untuk mengisi data produk, dan melakukan validasi pesanan atas pesanan member, membuat laporan data pemesanan, laporan data produk, laporn

27 data pelanggan, laporan buku tamu dan laporan validasi pesanan.

Gambar 3.4Context Diagram Website Penjualan

3.3

DFD (Data Flow Diagram)  Member mengisi data diri member dalam proses pengolahan data member dan tersimpan otomatis ke database member, dari data member dikirim ke proses pembuatan laporan data member yang dikirim ke halaman admin.  Dari proses pengolahan data member, member mendapatkan username dan passwor untuk login pada haaman masingmasing member.  Member mengisi buku tamu dalam proses pengelolaan buku tamu dan tersimpan otomatis ke database buku tamu, dari data buku tamu dikirim ke proses pembuatan laporan buku tamu yang dikirim ke halaman admin.

28  Admin bertugas untuk menambahkan data produk pada proses pengolahan data produk yang secara otomatis tersimpan ke database produk dan dikirim pada proses pembuatan laporan data produk ke halaman admin dan memberikan informasi produk ke halaman member.  Member dapat melihat, mendapatkan informasi produk dan melakukan pemesanan produk pada proses pengolahan data pesanan. Pesanan member tersimpan dalam database pesnan dan dikirim ke proses pembuatan laporan pemesanan produk yang dikirim ke halaman admin. Admin melakukan validasi terhadap pesanan produk yang sudah divalidasi ke dalam proses pengolahalan data pesanan dan otomatis tersimpan ke database kemudian data validasi pesanan dikirim ke dalam proses pembuatan laporan yang masuk ke dalam halaman admin.

29

Gambar 3.5 DFD Website Penjualan

30 3.4

DFD Level 1 3.4.1

DFD Level 1 Pengolahan Produk Admin bertugas untuk menambah produk, melakukan update produk, dan menghapus produk yang langsung tersimpan ke dalam database produk. Database produk mengirimkan ke proses tampil produk. Data produk tersebut ditampilkan ke halaman member dan admin

Gambar 3.6 DFD Level 1 Pengolahan Produk

3.4.2

DFD Level 1 Pengolahan Data Pesanan Member melakukan pesanan pada proses tambah pesanan. Data pesanan member disimpan dalam database pesanan. Data pesanan yang telah tersimpan di

31 database dikirim ke proses tampil pesanan yang dikirim ke halaman admin. Admin bertugas untuk melakukan validasi pesanan pada proses validasi pesanan setelah dilakukan validasi, data tersebut ditampilkan ke halaman admin.

Gambar 3.7DFD Level 1 Pengolahan Data Pesanan

3.4.3

DFD Level 1 Pengolahan Buku Tamu Member melakukan pengisian buku tamu yang diproes pada tambah buku tamu. Data buku tamu yang telah diisi oleh member tersimpan ke database buku tamu. Database buku tamu mengirimkan data buku tamu pada proses tampil buku tamu. Proses tampil buku tamu dikirim ke admin. Admin mempunyai hak untuk menyaring pesan yang masuk, jika pesan tersebut tidak

32 pantas untuk ditampilkan, maka admin berhak untuk melakukan hapus buku tamu pada proses hapus buku tamu. Data yang terhapus otomatis tersimpan didatabase dan tidak bisa ditampilkan lagi.

Gambar 3.8DFD Level 1 Pengolahan Data Buku Tamu

3.4.4

DFD Level 1 Pengolahan Data Member Calon member melakukan pengisian data diri yang diproes pada tambah member. Data member yang telah diisi oleh member tersimpan ke database member. Database member

mengirimkan data member pada

proses tampil member. Proses tampil member dikirim ke admin. Admin mempunyai hak untuk melakukan hapus

33 member pada proses hapus member. Data yang terhapus otomatis

tersimpan

didatabase

dan

tidak

bisa

ditampilkan lagi.

Gambar 3.9DFD Level 1 Pengolahan Data Member

3.4.5

DFD Level 1 Laporan 

Member dapat melihat produk yang di tampilkan oleh admin pada data produk dan juga ditampilkan di halaman admin untuk di proses dalam pembuatan laporan data produk yang tampil dihalaman admin



Member dapat memesan produk dan tersimpan langsung di database pesanan. Data pesanan tersebut di olah dalam proses pembuata laporan pesanan yang

34 dikirim langsung ke halaman admin. Admin bertugas untuk melakukan validasi pesanan dan membuat laporan validasi pesanan yang otomatis tersimpan di database dan tampil pada halaman admin 

Member mengisi buku tamu dan langsung tersimpan di database buku tamu. Data buku tamu diproses pada laporan buku tamu dan ditampilkan pada halaman user.



Member mengisi data diri member dan langsung tersimpan di database member. Data member diproses pada laporan

member dan ditampilkan

pada halaman user.

Gambar 3.10DFD Level 1 Pembuatan Laporan

35 3.5

ERD (Entity Relationship Diagram) 

Entitas member memiliki atribut id member yang digunakan sebagai primary key, user, password, nama, email, alamat dan nomer telepon.



Member memiliki relasi ke entitas barang. Satu member memesan banyak barang.

Barang memiliki atribut id

barang yang digunakan sebagai primary key, nama barang, harga, gambar dan pesanan. Barang yang dipesan oleh member disimpan ke entitas pemesanan. 

Entitas pemesanan memiliki atribut id pesan yang digunakan sebagai primary key, id member yang digunakan sebagai foreign key, id barang yang digunakan sebagai foerign key, tanggal, ukuran dan banyak pesanan. Member memiliki relasi ke entitas pemesanan. Satu member memiliki banyak pemesanan.

36

Gambar 3.11ERD Website Penjualan

3.6

Tabel dan Relasi 

Tabel barang mempunyai field (id_barang, nama_barang, harga, gambar, keterangan). Tabel member mempunyai field (id_member, user, pass, nama, email, alamat,no_tlp).



Tabel pesanan mempunyai field (id_pesanan, id_barang, id_member, ukuran, banyak, tanggal, validasi).



Tabel barang dengan field id_barang sebagai primary key mempunyai relasi ke tabel pesanan dengan id_barang sebagai

foreign key di tabel pesanan. Sehingga data

37 id_barang yang terdapat di tabel pemesanan mengambil data dari id_barang pada tabel barang. 

Tabel member dengan field id_member sebagai primary key mempunyai relasi ke tabel pesanan dengan id_member sebagai

foreign key di tabel pesanan. Sehingga data

id_member yang terdapat di tabel pemesanan mengambil data dari id_member pada tabel member.

Gambar 3.12Relasi Website Penjualan

3.7

Jaringan Semantik Tampilan Jaringan semantik tampilan merupakan pedoman yang digunakan untuk membuat navigasi antar form sehingga akan memudahkan proses pembuatan aplikasi karena form yang berkaitan telah dipetakan. Jaringan semantik tampilan berupa

38 lingkaran berisi nomor yang mewakili form yang akan dibuat dan tanda huruf mewakili pemicu yang menghubungkannya.

Gambar 3.13 Jaringan Semantik Tampilan Produk Pada Admin

Gambar 3.13 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Produk”. d. T2 mengakses T3 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “tambah”. f. T4 mengakses T3 dengan klik tombol “Produk”. g. T3 mengakses T4 dengan klik tombol “tambah”. h. T4 mengakses T3 dengan klik tombol “Produk”. i. T3 mengakses T5 dengan klik tombol “Delete”. j. T5 mengakses T3 dengan klik tombol “Produk”. k. T3 mengakses T6 dengan klik tombol “Edit”. l. T6 mengakses T3 dengan klik tombol “Produk”.

39

Gambar 3.14Jaringan Semantik Tampilan Pesanan Pada Admin

Gambar 3.14 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Pesanan”. d. T3 mengakses T2 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “Status checkbox”. f. T4 mengakses T3 dengan klik tombol “Pesanan”. g. T3 mengakses T5 dengan klik tombol “Print”. h. T5 mengakses T3 dengan klik tombol “Pesanan”.

40

Gambar 3.15 Jaringan Semantik Tampilan Member Pada Admin

Gambar 3.15 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Member”. d. T2 mengakses T3 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “Hapus Member”. f. T4 mengakses T3 dengan klik tombol “Member”.

Gambar 3.16 Jaringan Semantik Tampilan Hubungi Pada Admin

41 Gambar 3.16 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Hubungi”. d. T2 mengakses T3 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “Hapus Pesan”. f. T4 mengakses T3 dengan klik tombol “Hubungi”.

Gambar 3.17 Jaringan Semantik Tampilan Ganti Password Pada Admin

Gambar 3.17 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Password”. d. T2 mengakses T3 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “Ganti Password”. f. T4 mengakses T3 dengan klik tombol “Hubungi”.

42

Gambar 3.18 Jaringan Semantik Tampilan Produk Pada Member

Gambar 3.18 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Produk”. d. T2 mengakses T3 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “Review Item”. f. T4 mengakses T3 dengan klik tombol “Produk”. g. T3 mengakses T5 dengan klik tombol “Buy This Item”. h. T5 mengakses T3 dengan klik tombol “Produk”. i. T5 mengakses T6 dengan klik tombol “Banyak”. j. T5 mengakses T7 dengan klik tombol “Ukuran”. k. T5 mengakses T8 dengan klik tombol “Simpan & Kirim”.

43

Gambar 3.19 Jaringan Semantik Tampilan Hubungi Kami Pada Member

Gambar 3.19 diatas dapat dijelaskan seperti berikut: a. T1 mengakses T2 dengan klik tombol “login”. b. T2 mengakses T1 dengan klik tombol “Keluar”. c. T2 mengakses T3 dengan klik tombol “Hubungi Kami”. d. T2 mengakses T3 dengan klik tombol “Keluar”. e. T3 mengakses T4 dengan klik tombol “Kirim Pesan" f. T4 mengakses T3 dengan klik tombol “Hubungi Kami”. g. T3 mengakses T5 dengan klik tombol “Hapus”. h. T5 mengakses T3 dengan klik tombol “Hubungi Kami”.

3.8

Lembar Kerja Tampilan 3.8.1

LKT Daftar Member Baru Form LKT daftar member baru memiliki fungsi untuk : 

Mengisi nama member baru



Mengisi username member baru

44 

Mengisi email member baru



Mengisi alamat member baru



Mengisi nomer telepon mamber baru

Semua isian akan tersimpan ke dalam database dengan cara klik pada tombol daftar member. Data member yang telah diisi tersimpan di database member dan akan tampil di halaman admin.

Gambar 3.20Daftar Member Baru

Hasil input member dari form daftar member yang tampil pada halaman admin yang secara otomatis membuat format seperti tabel. 

Nama pesanan diambil dari pengisian nama member baru



Username

diambil

member baru

dari

pengisian

username

45 

Email dimbil dari pengisian email member baru



Alamat diambil dari pengisian alamat member baru



No Telepon diambil dari pengisian nomer telepon mamber baru



Action hapus memberdigunakan untuk menghapus member

Gambar 3.21Laporan Member

3.8.2

LKT Login Member Form Login member digunakan untuk member yang telah memiliki username dan password untuk masuk ke halaman member masing-masing. Jika ingin mengapus data diri sebelum disimpan pilih tombol reset untuk mengulangi mengisi dari awal

46

Gambar 3.22Login Member

Hasil setelah login dengan username dan password adalah bisa masuk ke halaman masing-masing member. Terdapat username yang diambil dari input username member.

Gambar

Gambar 3.23Halaman Member

47 3.8.3

LKT Pesan Barang Member Form LKT Pesan Barang member memiliki fungsi : 

Memesan dari produk yang ada di website dengan memilih banyak barang ang akan dibeli dan ukuran dai baju tersebut.



Tombol simpan & kirim digunakan setelah member memilih dan mengisi banyak dan ukuran baju.

Hasil input pesanan langsung tersimpan di database pesanan.

Gambar Baju

Gambar 3.24Pesan Produk Member

Laporan hasil input pesan barang yang masuk ke halaman admin. Terdapat member, harga, keterangan, banyak dan ukuran dari produk yang dipesan.

48 Laporan Pesan Barang Nomor

Nama Pesanan

Nama Barang

Banyak Pesanan

Tanggal Pesanan

Status Validasi

1

Satya

Happy Sunday

10

01-082013

Sudah Belum

Gambar 3.25Laporan Pesan Produk Member

3.8.4

LKT Isi Buku Tamu Form isi buku tamu digunakan untuk menulis pesan dengan mengisi nama, email, alamat dan pesan. Tombol kirim pesan digunakan untuk mengirim pesan yang ditulis oleh member. Tombol reset digunakan untuk menghapus pesan sebelum dikirim dan masuk ke halaman admin.

Gambar 3.26 Isi buku tamumember

49 Laporan hasil input buku tamu yang masuk ke halaman admin. Admin mempunyai hak untuk menghapus pesan dari member.

Gambar 3.27Laporan Isi Buku TamuHapus Pesan

3.8.5

LKT Login Admin Admin mengisi username dan password untuk mesuk dan mengelola semua aktivitas yang dilakukan oleh member.

Gambar 3.28 Login Admin

50 3.8.6

LKT Tambah Barang Admin mempunyai tugas untuk menambah barang dengan mengisi nama barang, harga, keterangan dan upload gambar. Jika ingin menambahkan barang pilih tombol tambah barang secara otomatis tersimpan ke dalam database dan masuk ke dalam direktori gambar sebagai folder penyimpan barang yang telah diupload.

Gambar 3.29Tambah Barang

Laporan tambah barang akan muncul dihalaman admin dan member. Tetapi member tidak bisa melakukan update dan hapus.

51

Gambar Baju

Gambar 3.30 HasilTambah Barang

3.8.7

LKT Ganti Password Admin Admin mempunyai fasilitas untuk mengganti username admin yang baru dan password baru nya.

Gambar 3.31 Ganti Password Admin