• Tidak ada hasil yang ditemukan

BAB III PEMBAHASAN. informasi, sehingga sekarang ini manusia telaj dimanjakan dengan teknologi tersebut

N/A
N/A
Protected

Academic year: 2021

Membagikan "BAB III PEMBAHASAN. informasi, sehingga sekarang ini manusia telaj dimanjakan dengan teknologi tersebut"

Copied!
63
0
0

Teks penuh

(1)

PEMBAHASAN

3.1. Analisa Perancangan Web 3.1.1 Tinjauan Kasus

Perkembangan zaman yang begitu maju dan begitu pesat akan selalu diikuti dengn perkembangan teknologi yang maju juga. Seperti perkembangan teknologi informasi, sehingga sekarang ini manusia telaj dimanjakan dengan teknologi tersebut dalam melakukan segala kegiatan, seperti tersedianya pengolahan informasi secara

online yang dapat diakses setiap detik dengan informasi yang ter up to date, sehingga

menghemat waktu bagi manusia dalam memperoleh suatu informasi.

Bisnis penjualan sepatu memiliki kemampuan bersaing di pasaran saat ini. Proses transaksi yang berjalan saat ini masih banyak yang dilakukan secara konvensional dengan pembeli harus datang langsung ke toko atau tempat penjualan jika ingin melakukan pembelian. Maka penulis mencoba membuat website untuk memudahkan proses transaksi pembelian yang dilakukan oleh pelanggan. Website ini nantinya akan memiliki dua antarmuka, antarmuka untuk pelanggan dan antarmuka untuk administrator.

Dalam hal ini penulis uraikan tunjauan kasusnya. Tinjauan kasus terbagi menjadi 2 yaitu:

1. Sisi Admin

(2)

a. Data Kota

Pada proses ini admin dapat melihat data kota yang telah dimasukan dan pada proses ini juga admin dapat menambah, mengubah, dan menghapus data kota.

b. Data Ukuran Sepatu

Pada proses ini admin dapat melihat data ukuran sepatu yang telah dimasukan dan pada proses ini juga admin dapat menambah, mengubah, dan menghapus data ukuran sepatu.

c. Data Kategori

Pada proses ini admin dapat melihat data kategori barang yang telah dimasukan dan pada proses ini juga admin dapat menambah, mengubah, dan menghapus data kategori barang.

d. Data Barang

Pada proses ini admin dapat melihat data barang yang telah dimasukan dan pada proses ini juga admin dapat menambah, mengubah, dan menghapus data barang.

e. Data Bank Pembayaran

Pada proses ini admin dapat melihat data bank pembayaran yang telah dimasukan dan pada proses ini juga admin dapat menambah, mengubah, dan menghapus data bank pembayaran.

(3)

f. Data Pelanggan

Pada proses ini admin dapat melihat pelanggan yang telah menjadi anggota.

g. Pemesanan Barang

Pada proses ini admin dapat melihat transaksi yang telah dilakukan oleh member.

h. Konfirmasi Transfer

Pada proses ini admin dapat melihat data konfirmasi transfer dari member yang telah melakukan pembayaran.

2. Sisi Pelanggan

a. Login Pelanggan

Pada proses ini pelanggan mengisi form login. Tujuan dari proses ini adalah untuk membatasi siapa saja yang dapat berbelanja.

b. Daftar Menjadi Pelanggan

Sebelum pelanggan menjadi anggota pelanggan dan ingin memesan, pelanggan diharuskan untuk menjadi anggota atau member terlebih dahulu dengan mengisi form pendaftaran pelanggan. Karena pemesanan hanya dapat dilakukan jika pelanggan sudah melakukan login sebagai member.

(4)

c. Produk

Pada proses ini pelanggan dapat melihat barang yang akan dijual dan dapat melakukan pemesanan barang.

3.2. Spesifikasi Rancangan Web

Pada sub bab ini, penulis membuat gambaran dari website yang dibuat. A. Rancangan Web Admin

1. Rancangan Halaman Login

Gambar III.1.

Tampilan Rancangan Halaman Login Keterangan:

Nama program : Menu Login Akronim : loginadmin.php

Fungsi : untuk menampilkan halaman login Bahasa program : HTML, PHP dan Mysql

(5)

Proses : Ketika kita mau ke halaman admin untuk melakukan proses data kita akan diminta masuk ke dalam halaman login terlebih dahulu

2. Rancangan Halaman Muka Admin

Gambar III.2.

Tampilan Rancangan Halaman Muka Admin Keterangan:

Nama program : Menu Utama

Akronim : index.php

Fungsi : untuk menampilkan halaman muka Bahasa program : HTML, PHP dan Mysql

(6)

Bentuk tampilan : lihat lampiran A.2

Proses : Setelah Melakukan Login Kita akan masuk Kedalam Beranda yang khusus untuk admin

3. Rancangan Halaman Menu Data Pelanggan

Gambar III.3.

Tampilan Rancangan Halaman Menu Pelanggan Admin Keterangan:

Nama program : Menu Data Pelanggan Akronim : PelangganTampil.php

Fungsi : Menampilkan Data Pelanggan Bahasa program : HTML, PHP dan Mysql

(7)

Proses : Ketika Admin ingin melihat data tentang pelanggan tinggal klik menu data pelanggan

4. Rancangan Halaman Menu Data Barang

Gambar III.4.

Tampilan Rancangan Halaman Menu Data Barang Keterangan:

Nama program : Menu Data Barang Akronim : ProdukTampil.php

Fungsi : Menampilkan dan memanipulasi data barang Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.4

Proses : Ketika admin mau melakukan manipulasi atau melihat data klik menu data barang

(8)

5. Rancangan Halaman Menu Pembayaran Bank

Gambar III.5.

Tampilan Rancangan Halaman Menu Pembayaran Bank Keterangan:

Nama program : Menu Pembayaran Bank Akronim : pembayaran.php

Fungsi : Untuk Menambah Data Bank Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.5

Proses : Ketika admin mau melakukan penambahan data obat, klik menu tambah data Bank

(9)

6. Rancangan Halaman Menu Data Kategori

Gambar III.6.

Tampilan Rancangan Halaman Data Kategori Keterangan:

Nama program : MenuKategori Akronim : kategori.php

Fungsi : Menampilkan Data Kategori Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.6

Proses : Ketika admin ingin melihat data Kategori Barang

(10)

7. Rancangan Halaman Menu Kota

Gambar III.7.

Tampilan Rancangan Halaman Menu Kota Keterangan:

Nama program : Menu Kota

Akronim : kota.php

Fungsi : Untuk Merubah Kota Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.7

Proses : ketika admin mau merubah atau menambahkan kota

(11)

8. Rancangan Halaman Menu Admin

Gambar III.8.

Tampilan Rancangan Halaman Menu Admin Keterangan:

Nama program : Menu Admin Akronim : profil.php

Fungsi : Untuk Merubah Data Admin Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.8

(12)

9. Rancangan Halaman Pemesanan Admin

Gambar III.9.

Tampilan Rancangan Halaman Menu Pemesanan Keterangan:

Nama program : Menu Data Pemesanan Akronim : pemesanan.php

Fungsi : Untuk data pemesanan Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.9

Proses : ketika admin mau merubah dan melihat data pemesan

(13)

10.Rancangan Halaman Menu Data Konfirmasi Transfer

Gambar III.10.

Tampilan Rancangan Halaman Menu Data Konfirmasi Transfer Keterangan:

Nama program : Menu Data Konfirmasi Transfer Akronim : konfirmasitransfer.php

Fungsi : Untuk menampilkan data Transfer Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.10

(14)

11.Rancangan Halaman Menu Home Page Admin

Gambar III.11.

Tampilan Rancangan Halaman Menu Homepage Admin Keterangan:

Nama program : Menu Data Home Page Admin Akronim : homepageadmin.php

Fungsi : Untuk menampilkan halaman ke admin Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.11

(15)

12.Rancangan Halaman Menu Laporan Data Barang

Gambar III.12.

Tampilan Rancangan Halaman Laporan Data Barang Admin Keterangan:

Nama program : Menu Data Laporan data barang Admin Akronim : laporandatabarang.php

Fungsi : Untuk menampilkan laporan data barang Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.12

(16)

13.Rancangan Halaman Menu Laporan Data Kategori

Gambar III.13.

Tampilan Rancangan Halaman Laporan Data Kategori Admin Keterangan:

Nama program : Menu Data Laporan data kategori Admin Akronim : laporandatakategori.php

Fungsi : Untuk menampilkan laporan data kategori Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.13

(17)

14.Rancangan Halaman Menu Laporan Data Pelanggan

Gambar III.14.

Tampilan Rancangan Halaman Laporan Data Pelanggan Admin Keterangan:

Nama program : Menu Data Laporan data pelanggan Admin Akronim : laporandatapelanggan.php

Fungsi : Untuk menampilkan laporan data pelangggan Bahasa program : HTML, PHP dan Mysql

(18)

15.Rancangan Halaman Menu Laporan Data Kota

Gambar III.15.

Tampilan Rancangan Halaman Laporan Data Kota Admin Keterangan:

Nama program : Menu Data Laporan data kota Admin Akronim : laporandatakota.php

Fungsi : Untuk menampilkan laporan data kota Bahasa program : HTML, PHP dan Mysql

(19)

16.Rancangan Halaman Menu Laporan Data Pemesanan masuk

Gambar III.16.

Tampilan Rancangan Halaman Laporan Data Pemesanan masuk Admin Keterangan:

Nama program : Menu Data Laporan data pemesanan masuk Akronim : laporandatapemesanan masuk.php

Fungsi : Untuk menampilkan laporan data pemesanan Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran A.16

(20)

17.Rancangan Halaman Menu Laporan Data Pelunasan Perperiode

Gambar III.17.

Tampilan Rancangan Halaman Laporan Data Pelunasan Perperiode Keterangan:

Nama program : Menu Data Laporan data pelunasan perperiode Akronim : laporandatapelunasanperperiode.php

Fungsi :Untuk menampilkan laporan pelunasan

perperiode

Bahasa program : HTML, PHP dan Mysql

(21)

18.Rancangan Halaman Menu Laporan Data Pelunasan Pertanggal

Gambar III.18.

Tampilan Rancangan Halaman Laporan Data Pelunasan Pertanggal Keterangan:

Nama program : Menu Data Laporan data pelunasan pertanggal Akronim : laporandatapelunasanpertanggal.php

Fungsi :Untuk menampilkan laporan pelunasan

pertanggal

Bahasa program : HTML, PHP dan Mysql

(22)

19.Rancangan Halaman Menu detail Pemesanan

Gambar III.19.

Tampilan Rancangan Halaman detail Pemesanan Keterangan:

Nama program : Menu Data data detail Pemesanan Akronim : detailpemesanan.php

Fungsi :Untuk menampilkan data detail transaksi pemesanan

Bahasa program : HTML, PHP dan Mysql

(23)

20.Rancangan Halaman Menu Data Ukuran Sepatu

Gambar III.20.

Tampilan Rancangan Halaman Data Ukuran Sepatu Keterangan:

Nama program : Menu Data data ukuran sepatu

Akronim : ukuran.php

Fungsi :Untuk menampilkan data uuran sepatu Bahasa program : HTML, PHP dan Mysql

(24)

A. Rancangan Antar Muka Halaman Member

1. Rancangan Halaman Cari Produk Halaman Member

Kontak YM Telepon Transaksi Kategori Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Hasil Pencarian

Halaman Gambar Produk

Gambar Produk

Gambar III.21.

Tampilan Rancangan Halaman Cari Produk Member Keterangan:

Nama program : Menu Cari Produk Akronim : cariproduk.php

Fungsi : untuk menampilkan halaman cari Produk Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.1

Proses : Ketika pelanggan pertama masuk kedalam website mengetikan nama barang yang dicari

(25)

2. Rancangan Halaman Data Produk Member Kontak YM Telepon Transaksi Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Data Produk Gambar Produk

Gambar Produk

Gambar Produk

Halaman

Gambar III.22.

Tampilan Rancangan Halaman Produk Keterangan:

Nama program : Menu Daftar Produk Akronim : daftar.php

Fungsi : Menampilkan Daftar Produk Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : Lihat Lampiran B.2

Proses : Untuk melihat daftar produk yang dijual, klik menu produk

(26)

3. Rancangan Halaman Histori Transaksi (Daftar Pemesanan Member) Kontak YM Telepon Transaksi Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

No. No.Pesan Tanggal Nama Penerima Total (Rp) Biaya Kirim (Rp) Status Tools

Gambar III.23.

Tampilan Rancangan Halaman Daftar Pemesanan Member Keterangan:

Nama program : Menu daftar pemesanan Akronim : daftarpemesanan.php

Fungsi : Menampilkan daftar pemesanan Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.3

(27)

4. Rancangan Halaman Index member Kontak YM Telepon Transaksi Kategori Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Gambar Home

Area Koleksi Barang Gambar Produk

Gambar Produk

Halaman

Gambar III.24.

Tampilan Rancangan Index Member Keterangan:

Nama program : Menu index Member Akronim : index.php

Fungsi : Menampilkan Halaman Index Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.4

(28)

5. Rancangan Halaman Kategori Produk Member Kontak YM Telepon Transaksi Kategori Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Koleksi Barang Kategori Gambar Produk

Gambar Produk

Halaman

Gambar III.25.

Tampilan Rancangan Kategori Produk Member Keterangan:

Nama program : Menu Kategori Member Akronim : kategori.php

Fungsi : Menampilkan Katagori Produk Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.5

(29)

6. Rancangan Halaman Keranjang Member Kontak YM Telepon Transaksi Kategori Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Gambar Produk

Gambar Nama Barang Harga (Rp) Jumlah Total (Rp) Tools

Lanjutkan

Text Nama Brg Text Harga Text Total Delete

Grand Total:

Ubah Data Text Grand Total:

Gambar III.26.

Tampilan Rancangan Keranjang Belanja Member Keterangan:

Nama program : Menu Kaeranjang Belanja Akronim : keranjang.php

Fungsi : Menampilkan menyimpan belanja Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.6

(30)

7. Rancangan Halaman Komfirmasi pemesanan Member Kontak YM Telepon Transaksi Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang : Footer Header No. Pemesan Nama Penerima Bank Tujuan Bank Asal Jumlah Transfer (Rp) Keterangan Kirim Gambar III.27.

Tampilan Rancangan Konfirmasi Pemesanan Member Keterangan:

Nama program : Menu Komfirmasi Pemesanan Akronim : komfirmasipemesanan.php

Fungsi : Menampilkan komfirmasi pemesanan Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.7

Proses : Ketika User Ingin mengkomfirmasi pemesanan

(31)

8. Rancangan Halaman Panduan Belanja Member

Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Area Panduan Belanja

Footer Header Kontak YM Telepon Transaksi Kategori Gambar III.28.

Tampilan Rancangan Panduan Belanja Member Keterangan:

Nama program : Menu Panduan Belanja Member Akronim : Panduanbelanja.php

Fungsi : Menampilkan tata cara belanja Bahasa program : HTML, PHP dan Mysql

(32)

Proses : Ketika User Ingin mengetahui cara belanja 9. Rancangan Halaman Detail Produk Member

Kontak YM Telepon Transaksi Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi Cari Barang :

Footer

Header

Area Detail Produk

Area Koleksi Barang Sejenis Gambar Produk

Beli

Gambar III.29.

Tampilan Rancangan Produk Member Keterangan:

Nama program : Menu Produk Member Akronim : produk.php

Fungsi : Menampilkan produk member Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.9

(33)

10.Rancangan Halaman Profil Member

Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang : Area Profil Footer Header Kontak YM Telepon Transaksi Kategori Gambar III.30.

Tampilan Rancangan Profil Member Keterangan:

Nama program : Menu Profil Member Akronim : profil.php

Fungsi : Menampilkan profil member Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.10

(34)

11.Rancangan Halaman checkout Member Kontak YM Telepon Transaksi Kategori Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

No. Nama Barang Harga (Rp) Jumlah Total (Rp)

Text Nama Barang Text Harga Text Jumlah Text Total (Rp)

Grand Total Nama Penerima Alamat Tujuan Provinsi Tujuan Kota Tujuan Kode Pos No. Telepon

Simpan dan Lanjutkan Transaksi Pilih Ukuran

Gambar III.31.

Tampilan Rancangan Checkout Member Keterangan:

Nama program : Menu Checkout Member Akronim : checkout.php

Fungsi : Menampilkan proses transaksi member Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran B.11

(35)

B. Rancangan Antar Muka Halaman Pengunjung

1. Rancangan Halaman Cari Produk Halaman Pengunjung

Kontak YM Telepon Login Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Hasil Pencarian

Halaman Gambar Produk

Gambar Produk

Gambar III.32.

Tampilan Rancangan Halaman Cari Produk Pengunjung Keterangan:

Nama program : Menu Cari Produk Akronim : cariproduk.php

Fungsi : untuk menampilkan halaman cari Produk Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.1

Proses : Ketika pelanggan pertama masuk kedalam website mengetikan nama barang yang dicari

(36)

12.Rancangan Halaman Data Produk Member Kontak YM Telepon Login Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Data Produk Gambar Produk

Gambar Produk

Gambar Produk

Halaman

Gambar III.33.

Tampilan Rancangan Halaman Produk Keterangan:

Nama program : Menu Daftar Produk Akronim : daftar.php

Fungsi : Menampilkan Daftar Produk Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : Lihat Lampiran C.2

Proses : Untuk melihat daftar produk yang dijual, klik menu produk

(37)

13.Rancangan Halaman Index Pengunjung

Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang : Footer Header Kontak YM Telepon Login Kategori Gambar Home

Area Koleksi Barang Gambar Produk

Gambar Produk

Halaman

Gambar III.34.

Tampilan Rancangan Index Pengunjung Keterangan:

Nama program : Menu index Pengunjung Akronim : index.php

Fungsi : Menampilkan Halaman Index Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.3

(38)

14.Rancangan Halaman Kategori Produk Pengunjung Kontak YM Telepon Login Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Koleksi Barang Kategori Gambar Produk

Gambar Produk

Halaman

Gambar III.35.

Tampilan Rancangan Kategori Produk Pengunjung Keterangan:

Nama program : Menu Kategori pengunjung Akronim : kategori.php

Fungsi : Menampilkan Katagori Produk Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.4

(39)

15.Rancangan Halaman Komfirmasi pemesanan Pengunjung Kontak YM Telepon Login Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang : Footer Header No. Pemesan Nama Penerima Bank Tujuan Bank Asal Jumlah Transfer (Rp) Keterangan Kirim Gambar III.36.

Tampilan Rancangan Konfirmasi Pemesanan Pengunjung Keterangan:

Nama program : Menu Komfirmasi Pemesanan Akronim : komfirmasipemesanan.php

Fungsi : Menampilkan komfirmasi pemesanan Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.5

Proses : Ketika User Ingin mengkomfirmasi pemesanan

(40)

16.Rancangan Halaman Panduan Belanja Pengunjung

Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Area Panduan Belanja

Footer Header Kontak YM Telepon Login Kategori Gambar III.37.

Tampilan Rancangan Panduan Belanja Pengunjung Keterangan:

Nama program : Menu Panduan Belanja Pengunjung Akronim : Panduanbelanja.php

Fungsi : Menampilkan tata cara belanja Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.6

(41)

17.Rancangan Halaman Detail Produk pengunjung Kontak YM Telepon Login Kategori Cari

Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang :

Footer

Header

Area Detail Produk

Area Koleksi Barang Sejenis Gambar Produk

Beli

Gambar III.38.

Tampilan Rancangan Detail Produk Pengunjung Keterangan:

Nama program : Menu Produk Pengunjung Akronim : detailproduk.php

Fungsi : Menampilkan detail produk pengunjung Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.7

(42)

18.Rancangan Halaman Profil Pengunjung

Cari Text Judul

Home Profil Produk Panduan Konfirmasi Cari Barang : Area Profil Footer Header Kontak YM Telepon Login Kategori Gambar III.39.

Tampilan Rancangan Profil Pengunjung Keterangan:

Nama program : Menu Profil Pengunjung Akronim : profil.php

Fungsi : Menampilkan profil pengunjung Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.8

(43)

19.Rancangan Halaman Pendaftaran pelanggan Baru Pengunjung Kontak YM Telepon Login Kategori Cari Text Judul

Home Profil Produk Panduan Konfirmasi

Cari Barang : Footer Header Nama Pelanggan Kelamin E-Mail No. Telepon DATA LOGIN Username Password Password (Lagi) Daftar Gambar III.40.

Tampilan Rancangan Pendaftaran Keterangan:

Nama program : Menu pendaftaran Akronim : pendaftaran.php

Fungsi : Menampilkan form pendafataran Bahasa program : HTML, PHP dan Mysql

Bentuk tampilan : lihat lampiran C.9

(44)

3.3. Rancangan Struktur Navigasi

Struktur navigasi yang digunakan adalah navigasi campuran (composite). Melalui struktur navigasi ini, terlihat bagaimana isi dan susunan dari sebuah website

secara menyeluruh. Pembuatan struktur navigasi website ini akan sangat membantu nantinya ketika akan membuat rancangan seluruh halaman website.

1. Struktur Navigasi Administrator

Merupakan halaman yang dapat diakses oleh pengguna yang mempunyai

username dan password saja.

Login

Index

Home Password Admin Data Admin Data Kota Data Kategori Data Barang Data Bank Pembayaran Data Pelanggan

Pemesanan Barang

Konfirmasi

Transfer Laporan Logout

Laporan Data Provinsi Laporan Data Kategori Laporan Data Barang Laporan Data Pelanggan Laporan Pemesanan Masuk - Periode Laporan Pemesanan Lunas – Tanggal Laporan Pemesanan Lunas - Periode Gambar III.41.

(45)

2. Struktur Navigasi Pengunjung

Merupakan halaman yang akan ditampilkan untuk pengunjung yang mengakses website tersebut.

Index

Home

Profil

Produk

Panduan

Konfirmasi

Pendaftaran Baru

Login

Kategori

Cari

Beli

Detail Produk

Gambar III.42. Struktur Navigasi Pegunjung

(46)

3. Struktur Navigasi Member

Index

Home Profil Produk Panduan Konfirmasi

Pendaftaran Baru

Transaksi Kategori Cari Beli Detail Produk

Keranjang Belanja

Tampilkan Transaksi

Logout

Lanjutkan Ubah Data

Simpan & Lanjutkan Transaksi

Gambar III.43. Struktur Navigasi Member

(47)

3.4 Normalisasi

1.Bentuk Tidak Normal (Unnormalized)

Gambar III.44.

Normalisasi Bentuk Tidak Normal

kd_kategori kd_bank status_bayar

nm_kategori nm_bank kd_kota

kd_barang kd_size id

nm_barang kd_kota harga

harga_modal nm_kota jumlah

harga_jual biaya_kirim kd_barang

stok id no_pemesanan

keterangan nm_pelanggan kd_size

file_gambar bank_asal size

kd_kategori jumlah_transfer no_rekening

kd_pelanggan ket nm_pemilik

nm_pelanggan tanggal kelamin no_pemesanan email tgl_pesan no_telepon nm_penerima username alamat_lengkap password kode_pos tgl_daftar no_telepon

(48)

2. Bentuk Normal Kesatu (1 NF)

Gambar III.45.

Bentuk Normal Kesatu (1NF)

Keterangan:

* Candidate key

kd_kategori* no_telepon no_pemesanan*

nm_kategori username tgl_pesan

kd_barang* password nm_penerima

nm_barang tgl_daftar alamat_lengkap

harga_modal kd_bank* kode_pos

harga_jual nm_bank no_telepon

stok no_rekening status_bayar

keterangan nm_pemilik biaya_kirim

file_gambar id* id

nm_kota nm_pelanggan harga

kd_pelanggan* bank_asal jumlah

nm_pelanggan jumlah_transfer kd_size*

kelamin ket kd_kota*

(49)

3. Bentuk Normal Kedua (2 NF)

Gambar III.46.

Bentuk Normal Kedua (2 NF) Keterangan:

* = Kunci Primer (Primary Key) = Satu Ke Satu (One To One)

**= Kunci Tamu (Foreign Key) = Satu Ke Banyak (One To Many)

kategori kd_kategori* nm_kategori bank kd_bank* nm_bank no_rekening nm_pemilik konfirmasi id* nm_pelanggan bank_asal jumlah_transfer ket tanggal kd_bank** no_pemesanan** barang kd_barang* nm_barang harga_modal harga_jual stok keterangan kd_kategori** pemesanan no_pemesanan* tgl_pesan nm_penerima alamat_lengkap kota kode_pos no_telepon status_bayar kd_kota** kd_pelanggan** kd_barang** kd_size** pelanggan kd_pelanggan* nm_pelanggan kelamin email no_telepon username password tgl_daftar kota kd_kota* nm_kota biaya_kirim size kd_size* size

(50)

4. Bentuk Normal Ketiga (3 NF)

Gambar III.46.

Bentuk Normal Kedua (2 NF) Keterangan:

* = Kunci Primer (Primary Key) = Satu Ke Satu (One To One)

**= Kunci Tamu (Foreign Key) = Satu Ke Banyak (One To Many)

kategori kd_kategori* nm_kategori bank kd_bank* nm_bank no_rekening nm_pemilik konfirmasi id* nm_pelanggan bank_asal jumlah_transfer ket tanggal kd_bank** no_pemesanan** barang kd_barang* nm_barang harga_modal harga_jual stok keterangan kd_kategori** pelanggan kd_pelanggan* nm_pelanggan kelamin email no_telepon username password tgl_daftar kota kd_kota* nm_kota biaya_kirim Pemesanan_item id* harga jumlah kd_barang** no_pemesanan** kd_size** pemesanan no_pemesanan* tgl_pesan nm_penerima alamat_lengkap kota kode_pos no_telepon status_bayar kd_kota** kd_pelanggan** size kd_size* size

(51)

3.5. Spesifikasi File

Menjelaskan tentang file atau table yang terbentuk dari transformasi normalisasi (dan atau file-file penunjang untuk web). File-file ini tersimpan pada database

sepatu_db.sql dengan parameter-parameter sbb: 1. Tabel Admin

a. Nama File : Tabel admin b. Akronim File : admin

c. Fungsi : Untuk menyimpan data admin d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 230 karakter

i. Software : Mysql

j. Record Key : username

Tabel III.1 Spesifikasi file admin

No Elemen Data Nama File Tipe Size Ket

1 User Name Username varchar 30 Primary Key

(52)

2. Tabel Bank

a. Nama File : Tabel Bank b. Akronim File : bank

c. Fungsi : Untuk menyimpan data bank d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 35 karakter

i. Software : Mysql

j. Record Key : kd_bank

Tabel III.2

Spesifikasi file data bank

No Elemen Data Nama File Tipe Size Ket

1 Kode Bank kd_bank varchar 5 Primary Key

2 Nama Bank nm_bank varchar 30

3. Tabel Barang

a. Nama File :Tabel Barang b. Akronim File : barang

(53)

c. Fungsi : Untuk menyimpan data barang d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 257 karakter

i. Software : Mysql

j. Record Key : kd_barang

Tabel III.3 Spesifikasi file barang

No Elemen Data Nama File Tipe Size Ket

1 Kode Barang kd_barang Char 5 Primary Key

2 Nama Barang nm_barang varchar 100 3 Harga Modal harga_modal Int 12

4 Harga Jual harga_jual Int 12

5 Stok stok Int 4

6 Size Tersedia size_tersedia Varchar 20 7 Keterangan keterangan Text

8 File Gambar file_gambar Varchar 100

(54)

4. Tabel Kategori

a. Nama File :Tabel Kategori b. Akronim File : kategori

c. Fungsi : Untuk menyimpan data kategori barang d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 104 karakter

i. Software : Mysql

j. Record Key : kd_kategori

Tabel III.4 Spesifikasi file Kategori

No Elemen Data Nama File Tipe Size Ket

1 Kode Kategori kd_kategori Char 4 Primary Key

2 Nama Kategori nm_kategori varchar 100

5. Tabel Konfirmasi Pembayaran

a. Nama File :Tabel Konfirmasi Pembayaran b. Akronim File : konfirmasi

c. Fungsi : Untuk menyimpan data Konfirmasi Pembayaran d. Tipe File : File Transaksi

(55)

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 159 karakter

i. Software : Mysql

j. Record Key : id

Tabel III.5

Spesifikasi file Konfirmasi Pembayaran No Elemen Data Nama File Tipe Size Ket 1 Id

Pembayaran

Id Int 4 Primary Key

2 Nomor Pemesanan

no_pemesanan varchar 8 Foreign Key

3 Nama Pelanggan

nm_pelanggan Varchar 100

4 Kode Bank kd_bank varchar 5 Foreign Key

5 Bank Asal bank_asal varchar 30 6 Jumlah

Transfer

jumlah_transfer Int 12

7 Keterangan Ket Text

(56)

6. Tabel Pelanggan

a. Nama File : Tabel Pelanggan b. Akronim File : konten

c. Fungsi : Untuk menyimpan data Pelanggan d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 346 karakter

i. Software : Mysql

j. Record Key : kd_pelanggan

Tabel III.6

Spesifikasi file pelanggan

No Elemen Data Nama File Tipe Size Ket 1 Kode

Pelanggan

kd_pelanggan Char 6 Primary Key

2 Nama Pelanggan

nm_pelanggan Varchar 100

3 Jenis Kelamin Kelamin Enum (‘laki-laki’,’per empuan’)

(57)

4 Email Email Varchar 100 5 Nomor

Telepon

no_telepon Varchar 100

6 User Name Username Varchar 20

7 Password Password Varchar 100

8 Tanggal Daftar

tgl_daftar Date

7. Tabel Pemesanan

a. Nama File :Tabel Pemesanan b. Akronim File : pemesanan

c. Fungsi : Untuk menyimpan data pemesanan pelanggan d. Tipe File : File Transaksi

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 303 karakter

i. Software : Mysql

(58)

Tabel III.7

Spesifikasi file Pemesanan

No Elemen Data Nama File Tipe Size Ket 1 Nomor

Pemesanan

no_pemesanan Char 8 Primary Key

2 Kode Pelanggan

kd_pelanggan Char 6 Foreign Key

3 Tanggal Pemesanan tgl_pesan Date 4 Nama Penerima nm_penerima varchar 60 5 Alamat Lengkap alamat_lengkap varchar 200

6 Kode Kota kd_kota Char 3 Foreign Key

7 Kode Pos kode_pos Varchar 6

8 Nomor telepon

no_telepon Varchar 20

9 Status Bayar status_bayar Enum (‘pesan’ ,’lunas’, ’batal’)

(59)

8. Tabel Pemesanan Item

a. Nama File : Tabel Pemesanan Item b. Akronim File : pemesanan_item

c. Fungsi : Untuk menyimpan data detail pemesanan pelanggan d. Tipe File : File Transaksi

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 32 karakter

i. Software : Mysql

j. Record Key : -

Tabel III.8

Spesifikasi file Pemesanan Item

No Elemen Data Nama File Tipe Size Ket

1 Id Pesan Id Int 4

2 Nomor Pemesanan

no_pemesanan Char 8 Foreign Key

3 Kode barang kd_barang Char 5 Foreign Key

4 Harga Harga Int 12

5 Jumlah Jumlah Int 3

(60)

9. Tabel kota

a. Nama File :Tabel kota b. Akronim File : kota

c. Fungsi : Untuk menyimpan data kota d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 115 karakter

i. Software : Mysql

j. Record Key : kd_kota

Tabel III.9

Spesifikasi file Data Kota

No Elemen Data Nama File Tipe Size Ket

1 Kode Kota kd_kota Char 3 Primary Key

2 Nama Kota nm_kota varchar 100

(61)

10.Tabel Size

a. Nama File : Tabel Size

b. Akronim File : Size

c. Fungsi : Untuk menyimpan data ukuran sepatu d. Tipe File : File Master

e. Organisasi File : Index sequential

f. Akses : Random

g. Media File : Hard Disk

h. Panjang Record : 25 karakter

i. Software : Mysql

j. Record Key : -

Tabel III.10 Spesifikasi file Size

No Elemen Data Nama File Tipe Size Ket

1 Kode size kd_size Varchar 5 Primary Key

(62)

3.6. Spesifikasi Sistem Komputer

Sebelum melakukan suatu sistem komputerisasi, diperlukan beberapa persiapan, baik dalam hal kebutuhan akan perangkat keras (hardware) maupun perangkat lunak (software) sebagai sarana pendukung program yang akan di jalankan. Sarana pendukung tersebut harus mampu membantu aplikasi program atau komputerisasi sistem yang efektif dan efisien.

1. Perangkat keras (Hardware)

Perangkat keras (Hardware) adalah seluruh komponen yang membentuk suatu sistem komputer dan perlalatan lainnya yang memungkinkan komputer dapat melaksanakan tugasnya. Dalam hal ini perangkat keras yang penulis butuhkan diantaranya :

a. Monitor : 1366 x 768 HD LED LCD

b. Processor : intel Core i3 4.0 GHz

c. Memory : 2 GB

d. -Harddisk : 500 GB

e. Keyboard : 86 keys

2. Perangkat Lunak(sofware)

Dalam suatu perancangan program tidak terlepas dari perangkat lunak

(sofware) yang akan digunakan dalam menyusun program aplikasi serta

sistem operasi yang akan penulis gunakan untuk menjalankan program. Aplikasi tersebut

Perangkat lunak (software) sering di istilahkan dengan program. Program bukanlah sesuatu yang harus dipegang atau di jamah sebagaimana layaknya

(63)

Hardware. Pemakaian komputer tidak terlepas dari penggunaan software

untuk mengolah data dan sebagai sarana pendukung program yang akan dibuat

Adapun perangkat lunak yang penulis gunakan dalam pembuatan program tugas akhir ini yaitu :

a. Sistem Operasi : Microsoft windows 7

b. Program Aplikasi Design : Adobe Dreamweaver CS5 c. Bahasa Script : PHP, Javascript

d. Web Server : XAMPP

e. Web Pengunjung Web : Mozilla Firefox, Google Chrome

Gambar

Gambar III.7.
Gambar III.8.
Gambar III.9.
Gambar III.11.
+7

Referensi

Garis besar

Dokumen terkait

menghentikan pengobatan medis terhadap pasien yang kondisinya sudah dianggap dokter untuk tidak dapat disembuhkan. Hadis tersebut juga memrintahkan untuk tetap melakukan

Dalam penelitian ini, sumber informasi yang digunakan adalah Hasil penelitian berupa bentuk kerjasama yang dapat dilakukan dalam pelestarian Kawasan Pecinan Kembang

Sanggup menyelesaikan kegiatan tersebut tepat waktu dengan menyerahkan laporan hasil kegiatan ke Satuan Kerja Penjaminan Kepastian Layanan Pendidikan SMP Dinas

Tesis ini membahas tentang pelaksanaan pengumpulan dan pendistribusian zakat Profesi bagi Pegawai Negeri Sipil (PNS) yang dilaksanakan oleh Badan Amil Zakat (BAZ)

Hasil penelitian variabel suku deposito, SBI, kurs dan inflasi secara simultan mempunyai pengaruh terhadap harga saham sedangkan secara parsial adalah suku bunga

Produk yang dikembangkan pada penelitian ini adalah LKPD berbasis inkuiri pada materi pengklasifikasian ikan menggunakan Model Prosedur pengembangan hasil adaptasi dari

Dalam penelitian ini, peneliti akan melakukan observasi secara langsung dengan melihat dan mengamati kondisi lingkungan sekolah, sarana prasarana, dan bagaimana

penentuan sarana produksi, dan pihak yang terlibat dalam proses penentuan sarana produksi, hal ini membuktikan bahwa petani sagu di Desa Tanjung sudah memiliki