TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut...

98
PERANCANGAN SISTEM INFORMASI PENJUALAN TAS WANITA BERBASIS WEB TUGAS AKHIR Diajukan untuk memenuhi salah satu syarat kelulusan Diploma Tiga (D.III) CHATERINE DELIANA NIM: 12134294 Program Studi Manajemen Informatika Akademi Manajemen Informatika dan Komputer Bina Sarana Informatika Jakarta 2016

Transcript of TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut...

Page 1: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

PERANCANGAN SISTEM INFORMASI PENJUALAN TAS

WANITA BERBASIS WEB

TUGAS AKHIR

Diajukan untuk memenuhi salah satu syarat kelulusan Diploma Tiga (D.III)

CHATERINE DELIANA

NIM: 12134294

Program Studi Manajemen Informatika

Akademi Manajemen Informatika dan Komputer Bina Sarana Informatika

Jakarta

2016

Page 2: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan
Page 3: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan
Page 4: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan
Page 5: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan
Page 6: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

vi

KATA PENGANTAR

Puji syukur penulis panjatkan kehadiran Tuhan Yang Maha Esa atas rahmat

dan karunia-Nya sehingga penulis dapat menyelesaikan Tugas Akhir ini dengan baik

Tugas Akhir dilakasanakan untuk memenuhi salah satu syarat dalam menyelesaikan

program Diploma Tiga Jurusan Manajemen Informatika Pada Akademi Manajemen

Informatika dan Komputer. Adapun judul yang di ambil oleh penulis adalah sebagai

berikut, “PERANCANGAN SISTEM INFORMASI PENJUALAN TAS WANITA

BERBASIS WEB”.

Tujuan penulisan Tugas Akhir ini dibuat sebagai salah satu syarat kelulusan

program Diploma Tiga (D.III) Akademi Manajemen Informatika dan Komputer Bina

Sarana Informatika. Sebagai bahan penulisan yang diambil berdasarkan hasil penelitian

(eksperimen), observasi (pengamatan) dan beberapa sumber yang mendukung

penulisan ini.

Penulis menyadari tanpa bimbingan dan dorongan dari semua pihak penulisan

tugas akhir ini tidak akan lancar dan selesai. Oleh karena itu pada kesempatan ini,

izinkanlah penulis menyampaikan terima kasih kepada :

1. Direktur Akademi Manajemen Informatika dan komputer Bina Sarana

Informatika.

2. Ketua Program Studi Manajemen Informatika AMIK BSI.

3. Bapak Rahmat Hidayat M.Kom selaku Dosen Pembimbing Tugas Akhir.

4. Staff/karyawan/dosen dilingkungan Akademi BSI.

5. Orang tua tercinta yang sudah memberikan dukungan moral maupun spiritual.

Page 7: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

vii

6. Rekan-rekan mahasiswa kelas MI-6A

Serta semua pihak yang terlalu banyak disebut satu perastu sehingga

terwujudnya penulisan ini. Penulis menyadari bahwa penulisan tugas akhir ini

masih jauh sekali dari kata sempurna, untuk itu penulis mohon kritik dan saran

yang bersifat membangun demi kesempurnaan penulisan dimasa yang akan

datang.

Harapan semoga tugas akhir ini berguna bagi penulis khususnya dan bagi

para pembaca yang berminat pada umumnya.

Jakarta, 16 Juni 2016

Penulis

Chaterine Delliana

Page 8: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

viii

ABSTRAK Chaterine Deliana (12134294), Perancangan Sistem Informasi Penjualan Tas

Wanita Berbasis Web

Tas wanita adalah sebuah fashion, tas merupakan benda yang selalu di bawa

kemanapun oleh seseorang yang akan pergi. Tas merupakan penunjang penampilan

yang juga sudah menjadi barang wajib di bawa di setiap saat. Bukan hanya sebuah

benda sebagai pelengkap fashion, kini tas wanita pun memiliki pasar tersendiri di dunia

fashion. Sehingga bisnis di sector ini bukanlah perkara biasa. Kemampuan pasar untuk

menyerap di nilai sangat potensial. Namun saat ini beberapa penjual masih

menggunakan sistem konvensial dimana, konsumen mendatangi toko untuk melihat

produk yang ditawarkan dan untuk melakukan transaksi. Hal ini terkadang menjadi

masalah dalam proses penjualan barang yang ditawarkan dengan konsumen yang jauh

jaraknya dengan toko. Dalam perancangan sistem informasi yang dipakai penulis

adalah dengan menggunakan metode waterfall dan teknik pengumpulan data dilakukan

dengan observasi dan studi pustaka. Perancangan sistem informasi ini merupakan

solusi yang terbaik untuk memecahkan permasalahan-permaslahan yang ada, serta

dengan sistem online dapat tercapai suatu kegiatan yang efektif dan efisien dalam

menunjang aktivitas penjualan, sehingga semua orang khususnya bagi para kaum

wanita dapat melakukan transaksi pembelian dan pemilihan barang tas wanita yang di

inginkan kapan saja dan dimana saja.

Kata Kunci: Perancangan Sistem Informasi, Penjualan Tas Wanita

Page 9: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

ix

ABSTRACT

Chaterine Deliana (12134294), Information System Design of Web-based Sales of

Ladies Bags

Ladies bag is a type of fashion, an object that women will bring with them wherever

they go out. It is also a supporting accesesory that has become necessary to be brought

in any occasions. In fact, handbag for women does not just play the role as a

complement fashion, it has its own market in the world of fashion. Therefore, doing

business in this sector is very promising because of its high potential market. However,

some sellers still use conventional sales systems in which consumers have to go to

stores to see the offered products and to conduct transactions. This is sometimes a

problem in the process of sale if consumers’ place is distant from the store. In this

design of information systems, the author is using the waterfall method and techniques

of data collection with the literature observation and review. The design provides the

best solution to solve the existing problem. The online system is effective and efficient

in supporting sales activity, where all people, especially women, can choose from the

selections of ladies bag and do transactions from anywhere at anytime.

Keywords: Information System Design, Bag sales

Page 10: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

x

DAFTAR ISI

Halaman

Lembar Judul Tugas Akhir……………………………………………………… i

Lembar Pernyataan Keaslian Tugas akhir………………………………………. ii

Lembar Pernyataan Publikasi Karya Ilmiah…………………………………….. iii

Lembar Persetujuan dan Pengesahan Tugas Akhir……………………………… iv

Lembar Konsultasi Tugas Akhir………………………………………………… v

Kata Pengantar…………………………………………………………………... vi

Abstrak……………………………………………………………………........... viii

Daftar Isi…………………………………………………………………………. x

Daftar Simbol……………………………………………………………………. xii

Daftar Gambar…………………………………………………………………… xiii

Daftar Tabel……………………………………………………………………… xv

Daftar Lampiran…………………………………………………………………. xvi

BAB I PENDAHULUAN………………………………………………….. 1

1.1. Latar Belakang Masalah………………………………………... 1

1.2. Maksud dan Tujuan…………………………………………….. 2

1.3. Metode Penelitian………………………………………………. 3

1.4. Ruang Lingkup…………………………………………………. 5

1.5. Sistematika Penulisan…………………………………………... 6

BAB II LANDASAN TEORI………………………………………………. 7

2.1. Konsep Dasar Web……………………………………………… 7

2.2. Teori Pendukung………………………………………………... 28

BAB III PEMBAHASAN……………………………………………………. 35

3.1. Analisa Kebutuhan……………………………………………… 35

3.2. Perancangan Perangkat Lunak………………………………….. 38

3.2.1. Rancangan Antar Muka………………………………….. 38

3.2.2. Rancangan Basis Data……………………………………. 48

3.2.3. Rancangan Struktur Navigasi ……………………………. 55

3.3. Implementasi dan Pengujian Unit………………………………. 57

3.3.1. Implementasi……………………………………………… 57

3.3.2. Pengujian Unit…………………………………………….. 67

Page 11: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

xi

BAB IV PENUTUP 4.1. Kesimpulan……………………………………………………… 74

4.2. Saran…………………………………………………………….. 75

DAFTAR PUSTAKA

DAFTAR RIWAYAT HIDUP

LAMPIRAN-LAMPIRAN

Page 12: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

xii

DAFTAR SIMBOL

a. Entity Relationship Diagram

ENTITAS (ENTITY)

Menunjukkan obyek-obyek dasar yang terkait di

dalam sistem, obyek dasar dapat berupa orang,

benda atau hal yang keterangannya perlu disimpan

KERELASIAN (RELATIONSHIP)

Mendefiniskan hubungan antara dua buah entitas.

ATRIBUT (ATTRIBUTE)

Merupakan keterangan-keterangan yang terkait

pada sebuah entitas yang perlu disimpan dalam

basis data.

GARIS (CONNECTION)

Simbol yang menghubungkan antara relasi dengan

entitas, relasi dan entitas dengan relasi.

Page 13: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

xiii

DAFTAR GAMBAR

Halaman

1. Gambar II.5. Struktur Navigasi Linear……………………………………… 29

2. Gambar II.6. Struktur Navigasi Hirarki……………………………………... 29

3. Gambar II.7. Struktur Navigasi Non Linear………………………………… 30

4. Gambar II.8. Struktur Navigasi Composite…………………………………. 30

5. Gambar III.1. Rancangan Antar Muka Login Admin………………………. 38

6. Gambar III.2. Rancangan Antar Muka Home Admin………………………. 39

7. Gambar III.3. Rancagan Antar Muka Tambah Provinsi……………………. 39

8. Gambar III.4. Rancangan Antar Muka Tambah Kategori………………….. 40

9. Gambar III.5. Rancangan Antar Muka Tambah Data Barang……………… 40

10. Gambar III.6. Rancangan Antar Muka Tambah Data Pelanggan…………... 41

11. Gambar III.7. Rancangan Antar Muka Pemesanan Barang………………… 41

12. Gambar III.8. Rancangan Antar Muka Konfirmasi Transfer……………….. 42

13. Gambar III.9. Rancangan Antar Muka Ganti Password Admin……………. 42

14. Gambar III.10. Rancangan Antar Muka Laporan Pemesanan Masuk………. 43

15. Gambar III.11. Rancangan Antar Muka Login Pelanggan………………….. 43

16. Gambar III.12. Rancangan Antar Muka Daftar Pelanggan Baru.................... 44

17. Gambar III.13. Rancangan Antar Muka Halaman Utama Pengunjung……... 45

18. Gambar III.14. Rancangan Antar Muka Halaman Utama Pelanggan………. 46

19. Gambar III.15. Rancangan Antar Muka Konfirmasi Pembayaran………….. 47

20. Gambar III.16. Rancangan Antar Muka Cara Belanja……………………… 47

21. Gambar III.17. Entity Relationship Diagram……………………………….. 48

22. Gambar III.18. Logical Record Structure…………………………………… 49

23. Gambar III.19. Rancangan Struktur Navigasi Halaman Admin…………….. 56

24. Gambar III.20. Rancangan Struktur Navigasi Halaman Pelanggan………… 57

25. Gambar III.21. Halaman Login Admin……………………………………... 58

26. Gambar III.22. Halaman Home Admin……………………………………... 58

27. Gambar III.23. Halaman Tambah Data Provinsi……………………………. 59

28. Gambar III.24. Halaman Tambah Data Kategori…………………………… 59

29. Gambar III.25. Halaman Tambah Data Barang…………………………….. 60

30. Gambar III.26. Halaman Tambah Data Pelanggan…………………………. 60

31. Gambar III.27. Halaman Pemesanan Barang……………………………….. 61

32. Gambar III.28. Halaman Konfirmasi Transfer……………………………… 61

33. Gambar III.29. Halaman Ganti Password Admin…………………………... 62

34. Gambar III.30. Halaman Laporan…………………………………………… 62

35. Gambar III.31. Halaman Login Pelanggan…………………………………. 63

36. Gambar III.32. Halaman Daftar Pelanggan Baru…………………………… 63

37. Gambar III.33. Halaman Cara Belanja……………………………………… 64

Page 14: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

xiv

38. Gambar III.34. Halaman Konfirmasi Pembayaran………………………….. 64

39. Gambar III.35. Halaman Utama Pengunjung……………………………….. 65

40. Gambar III.36. Halaman Utama Pelanggan…………………………………. 66

Page 15: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

xv

DAFTAR TABEL

Halaman

1. Tabel III.1. Spesifikasi File Pelanggan……………………………………….. 50

2. Tabel III.2. Spesifikasi File Pemesanan………………………………………. 51

3. Tabel III.3. Spesifikasi File Pemesanan Detail……………………………….. 52

4. Tabel III.4. Spesifikasi File Barang…………………………………………… 53

5. Tabel III.5. Spesifikasi File Kategori…………………………………………. 54

6. Tabel III.6. Spesifikasi File Provinsi………………………………………….. 55

7. Tabel III.7. Pengujian Blackbox Testing Halaman Login Admin……………... 68

8. Tabel III.8. Pengujian Blackbox Testing Halaman Login Pelanggan…………. 70

9. Tabel III.9. Pengujian Blackbox Testing Halaman Konfirmasi Pembayaran…. 72

Page 16: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

xvi

DAFTAR LAMPIRAN

Lampiran Halaman

1. A.1 Halaman Lengkapi Alamat Pengiriman………………………. 79

2. A.2 Halaman Konfirmasi Pembayaran……………………………. 79

3. A.3 Halaman Cetak Lengkap Pemesanan Barang………………... 80

4. B.1 Halaman Laporan Pemesanan Masuk………………………… 81

5. B.2 Halaman Laporan Pemesanan Lunas Pertanggal……………... 81

6. B.3 Halaman Laporan Pemesanan Lunas Per Periode…………….. 82

Page 17: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

1

BAB I

PENDAHULUAN

1.1. Latar Belakang Masalah

Tas wanita adalah sebuah fashion, tas merupakan benda yang selalu di bawa

kemanapun oleh seseorang yang akan pergi. Tas merupakan penunjang penampilan

yang juga sudah menjadi barang wajib di bawa di setiap saat.

Arti tas bagi seorang wanita adalah “tas ibarat garam dalam sebuah masakan,

jadi seorang wanita tanpa tas seperti masakan tanpa garam” tas merupakan sebuah

benda yang harus senantiasa ada dan menemani di manapun dan kapanpun seseorang

berada baik sebagai pelengkap fashion ataupun sebagai tempat menyimpan berbagai

macam barang keperluan.

Tas wanita sudah memegang peranan yang cukup penting dalam dunia

fashion. Sehingga bisinis di sector ini bukanlah perkara biasa. Ada sangat banyak

peluang yang dapat dimanfaatkan. Kemampuan pasar untuk menyerap di nilai sangat

potensial. Namun saat ini beberapa penjual masih menggunakan sistem konvensial,

dimana, konsumen mendatangi toko untuk melihat barang yang ditawarkan dan juga

untuk melakukan transaksi. Hal ini terkadang menjadi masalah dalam proses

penjualan barang dengan konsumen yang jauh jaraknya dengan toko. Selain itu

kurangnya media promosi yang ada juga dapat menjadi masalah, meski sudah ada

promosi dari mulut ke mulut (customer to customer). Kendala yang lainnya

Page 18: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

2

pelanggan harus berusaha mencari lokasi toko untuk mendapatkan barang yang

diinginkan.

Dari permasalahan diatas, maka penulis ingin membangun sebuah website

penjualan tas wanita. Untuk menawarkan dan meningkatkan penjualan tas wanita

secara online, sehingga pelanggan tidak perlu mencari-cari lokasi toko. Karena

semakin mudahnya dalam mengakses internet, merupakan sebuah peluang bisnis

yang dapat kita manfaatkan untuk transaksi jual beli online. Pengguna internet tinggal

mencari menggunakan keyword di mesin pencari untuk menemukan barang yang

ingin dibeli. Disisi lain pada saat ini bisnis penjualan online di Indonesia telah

berkembang cukup baik, dan diharapkan memberikan kemudahan yang meningkatkan

terjadinya sebuah transaksi pada bisnis penjualan tas wanita ini.

1.2. Maksud dan Tujuan

Maksud dan Tujuan dari penulisan Tugas Akhir ini adalah sebagai berikut :

1. Membuat transaksi jual beli menjadi lebih mudah dan cepat dalam hal

pemesanan atau pemilihan barang.

2. Membentuk sebuah sistem penjualan secara online dengan website yang

menarik.

3. Memberikan informasi kepada masyarakat, sehingga dalam pencarian

informasi dapat diakses dengan lebih mudah dan dapat dilakukan kapan saja

dan dimana saja.

Page 19: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

3

Sedangkan tujuan dari penulisan ini adalah untuk memenuhi salah satu

syarat kelulusan program Diploma Tiga (D.III) Program Studi Manajemen

Informatika di Akademi Manajemen Informatika dan Komputer Bina Sarana

Informatika (AMIK BSI).

1.3. Metode Penelitian

Dalam Menyusun tugas akhir ini, agar hasil sesuai dengan yang

diinginkan, diperlukan beberapa metode pengumpulan data yang digunakan

oleh penulis untuk memperoleh data-data, sebagai berikut :

A. Pengembangan Perangkat Lunak

Metode yang digunakan untuk mengembangkan perangkat lunak ini

menggunakan model waterfall sebagai pengembangan sistem. Model ini

terbagi menjadi tiga tahapan, yaitu:

1. Analisa Kebutuhan

a. Mengidentifikasi masalah yang dihadapi kebutuhan user.

b. Mengidentifikasi kebutuhan apa saja yang dibutuhakn untuk

pelanggan dalam penjualan tas online wanita.

2. Perancangan Sistem dan Perangkat Lunak

a. Perancangan Basis Data

Perancangan basis dara yang dibutuhkan oleh sistem seperti ini

menentukan jenis database, dalam hal ini penulis merancang

basis data dengan menggunakan MySQL. Dan untuk merancang

Page 20: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

4

dan mendesaign web penulis menggunakan PHP, CSS,

JavaScript dan HTML.

b. Perancangan fungsi aplikasi

Berdasarkan kebutuhan pengguna di dalam sistem yang diambil

dari aktivitas yang sedang berlangsung maka dirancanglah

aplikasi yang memiliki fungsi tertentu yang mampu memenuhi

standar proses yang mungkin terjadi di dalam sistem yaitu

dengan membuat sistem informasi penjualan tas online wanita.

c. Perancangan interface

Merancang bentuk tampilan yang menarik, ramah, dan mudah

didalam pemakaiannya dengan mempertimbangkan bentuk dan

desaign dari interface program.

3. Implementasi dan Pengujian Unit

Tahap ini adalah tahap meletakkan sistem supaya bisa dioperasikan

a. Implementasi basis data, proses penerapan basis data yang telah

dibentuk dan membandingkan atribut yang digunakan dengan

sample data yang ada.

b. Melakukan programing fungsi-fungsi aplikasi yang mendukung

transaksi basis data.

c. Implementasi antar muka (interface).

d. Melakukan pengujian dengan blackbox testing, menerapkan

fungsi yang ada dalam aplikasi.

Page 21: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

5

B. Teknik pengumpulan Data

Dalam pengumpulan data untuk menyelesaiakn tugas akhir ini penulis

melakukan beberapa metode yaitu:

1. Metode Observasi (Observation)

Merupakan metode pengamatan dan penelitaian secara langsung

terhadap objek yang diselidiki.

2. Metode Studi Pustaka (Library)

Penulis melakukan tinjauan pustaka yaitu dengan mempelajari buku-

buku yang berisi teori sebagai bahan refrensi yang berhubungan

dengan permasalahan yang di bahas.

1.4. Ruang Lingkup

Adapun ruang lingkup yang akan dibahas dalam Tugas Akhir ini, penulis

membahas tentang perancangan penjualan tas wanita berbasis web. Perancangan ini

menampilkan rancangan halaman website yang bisa diakses oleh pengunjung (user)

yaitu menu, home, profil, kontak, barang, cara belanja, login, pendaftaran baru,

kategori, cari barang dan keranjang belanja. Dan rancangan admin yang berfungsi

mengupdate dan melakukan login, input data provinsi, edit data provinsi, input data

kategori, edit data kategori, input data barang, edit data barang, tampilan home admin,

laporan dan logout. Halaman ini hanya bisa diakses oleh pengelola website dengan

username dan password yang ditetapkan.

Page 22: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

6

1.5. Sistematika Penulisan

Sistematika penulisan dalam tugas akhir ini, penulis membagi pokok-pokok

bahasan yang dimana setiap bab memiliki hubungan diantara lain :

BAB I PENDAHULUAN

Dalam bab ini berisi tentang latar belakang, maksud dan tujuan, metode

pengumpulan data, ruang lingkup dan sistematika penulisan.

BAB II LANDASAN TEORI

Dalam bab ini berisi tentang konsep dasar web dan teori pendukung

BAB III PEMBAHASAN

Dalam bab ini berisi tentang analisa kebutuhan, perancangan perangkat

lunak yang terdiri dari rancangan antar muka, rancangan basis data,

rancangan struktur navigasi, implementasi dan pengujian unit.

BAB IV PENUTUP

Dalam bab ini berisi tentang kesimpulan dan saran.

Page 23: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

7

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Dalam penulisan Tugas Akhir ini penulis menggunakan beberapa macam

teori pendukung yang diambil dari beberapa buku sebagai referensi dalam

pebuatan web desain dan pemrograman website yang ada kaitannya serta

mendukung dalam pelaksanaan pembuatan desain dan website ini.

A. Website

Menurut Dipraja (2013:9) “web adalah fasilitas hypertext yang mampu

menampilkan data berupa teks, gambar, suara, animasi, dan multimedia”. Data-

data tersebut saling terkait dan berhubungan satu dengan yang lainnya. Untuk

membaca data tersebut, diperlukan sebuah web browser seperti Internet

Explorer, Opera, Mozilla Firefox, Google Chrome dan lain sebagainya.

Website mempunyai fungsi yang bermacam-macam tergantung dari

tujuan dan jenis website yang dibangun, tetapi secara garis besar dapat

berfungsi sebagai berikut :

1. Media Promosi

Sebagai media promosi dapat dibedakan menjadi media promosi utama,

misalnya website yang berfungsi sebagai search engine atau sebagai

Page 24: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

8

penunjang promosi utama. Namun, website dapat berisi informasi yang

lebih lengkap dari pada media promosi offline seperti koran atau majalah

2. Media Pemasaran

Pada website merupakan media pemasaran yang cukup baik karena

dibandingkan dengan toko sebagaimana di dunia nyata, untuk

membangun toko online diperlukan modal yang relatif lebih kecil, dan

dapat beroperasi 24 jam walaupun pemilik website tersebut sedang

istirahat atau sedang tidak ditempat, serta dapat diakses dari mana saja.

3. Media Informasi

Website portal dan radio atau tv online menyediakan informasi bersifat

global karena dapat diakses dari mana saja selama dapat terhubung ke

internet sehingga dapat menjangkau lebih luas dari pada media

informasi konvensial seperti koran, majalah, radio atau televisi yang

bersifat lokal.

4. Media pendidikan

Ada komunitas yang membangun website khusus berisi informasi atau

artikel yang sarat dengan informasi ilmiah misalnya Wikipedia.

5. Media Komunikasi

Sekarang banyak terdapat website yang dibangun khusus untuk

berkomunikasi seperti forum yang dapat memberikan fasilitas bagi para

anggotanya untuk saling berbagi informasi atau membantu pemecahan

masalah tertentu.

Page 25: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

9

Menurut Sibero (2011:10) “Interconnected Network (internet) adalah

jaringan komputer yang menghubungkan antar jaringan secara global, internet

dapat juga disebut jaringan dalam suatu suatu jaringan yang luas”. Internet

menggunakan protokol komunikasi yang sama dengan jaringan komputer lokal

yaitu TCP/IP (Transmission Control Protocol/Internet Protocol) untuk dapat

bertukar data walaupun memiliki arsitektur jaringan berbeda.

Menggunakan fasilitas internet, harus berlangganan ke salah satu ISP

(Internet Service Provider) yang ada dan melayani daerah yang menggunakan

layanan ini. ISP ini biasanya disebut penyelenggara jasa internet memberikan

banyak sekali manfaat, ada yang bisa memberikan manfaat baik dan buruk.

Baik bila digunakan untuk pembelajaran informasi dan buruk bila digunakan

untuk sesuatu yang berbau pornografi, informasi kekerasan dan lain-lainnya

yang negatif.

Internet memungkinkan pengguna komputer diseluruh dunia untuk saling

berkomunikasi dan berbagi informasi dengan cara saling mengirimkan email,

menghubungkan komputer satu dengan komputer yang lainnya, mengirim dan

menerima file dalam bentuk text, gambar, audio, video dan lainnya.

Istilah-istilah yang tedapat di dunia internet, diantaranya :

1. World Wide Web (WWW)

Merupakan sekumpulan informasi yang dapat diakses melalui program

browser Internet Explorer (IE), Mozilla Firefox, Opera. Web terdiri dari

dua komponen, yaitu :

Page 26: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

10

a) Server Web

Sebuah komputer (server) dan software yang menyimpan dan

mendistribusikan data komputer lainnya melalui jaringan internet.

b) Browser Web

Adalah software yang dijalankan pada komputer pemakai (client) yang

meminta informasi dari server web dan menampilkan sesuai dengan

file data itu sendiri.

2. Halaman Web (Web Page)

Halaman web merupakan elemen-elemen penyusun sebuah situs web,

apabila situs web diumpamakan seperti buku, maka halaman web

merupakan lembaran-lembaran kertas penyusun buku tersebut. Jika

membuka situs, maka halaman-halaman yang ditampilkan oleh alamat situs

tersebut disebut halaman web.

3. Halaman Muka (Homepage)

Hompage merupakan halaman muka dari sebuah situs web, atau ibarat

sampul yang dimiliki sebuah buku. Homepage biasanya berupa daftar isi

dari situs. Karena vitalnya halaman muka, biasanya halaman muka selalu

dihiasi dengan tampilan yang cantik dan menarik.

4. Browser

Browser merupakan aplikasi yang digunakan untuk berselancar di dunia

internet. Browser dapat memandu pengguna internet untuk berpindah antar

situs maupun halaman web dengan prinsip keterkaitan atau hyperlink.

Page 27: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

11

5. Server

Server komputer di internet yang berfungsi menyediakan file-file dan

layanan kepada klien. Jasa-jasa yang bisa ditawarkan di internet antara lain

yaitu web.

6. Mesin Pencari (Search Engine)

Mesin pencari merupakan sebuah situs web yang dapat digunakan untuk

melakukan pencarian informasi tertentu dengan cara memasukkan kata

kunci (keyword) pencarian. Contoh mesin pencari yang popular adalah

www.google.com atau www.yahoo.com.

Menurut Ahmadi dan Dadang Hermawan (2013:35) “E-commerce

merupakan aktivitas pembelian dan penjualan melalui jaringan internet dimana

pembeli dan penjual tidak bertemu secara langsung, melainkan berkomunikasi

melalui media internet”. E-commerce memiliki berbagai macam jenis transaksi

dalam menerapkan sistemnya.

Jenis transaksi E-commerce di antaranya sebagai berikut:

1. Collaborative Commerce (C-Commerce)

Collaborative Commerce yaitu kerjasama secara elektronik antara rekan

bisnis. Kerjasama ini biasanya terjadi antara rekan bisnis yang berada pada

jalur penyediaan barang (supplu chain).

2. Business to Business (B2B)

E-commerce tipe ini meliputi transaksi antar organisasi yang dilakukan di

electronic market.

Page 28: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

12

3. Business to Consumers (B2C)

Business to Consumers yaitu penjual adalah suatu organisasi dan pembeli

adalah individu.

4. Consumers to Business (C2B)

Dalam C2B konsumen memberitahukan kebutuhan atas suatu produk atau

jasa tertentu, dan pemasok bersaing untuk menyediakan produk atau jasa

tersebut ke konsumen.

5. Consumers to Consumers (C2C)

C2C yaitu konsumen menjual secara langsung ke konsumen lain atau

mengiklankan jasa pribadi di internet.

B. Bahasa Pemrograman

1. CSS (Cascading Style Sheets)

Menurut Agus Saputra dan Feni Agustin (2012:5) “CSS atau yang

memiliki kepanjangan Cascading Style Sheet, merupakan suatu bahasa

pemrograman web yang digunakan untuk mengendalikan dan membangun

barbagai komponen dalam web sehingga tampilan web akan lebih rapi,

terstruktur dan seragam”.

Isi dari halaman kode HTML terletak di dalam HTML, sedangkan kode

CSS dapat berupa tampilan kode yang berada dalam file lain atau dalam salah

satu bagian dari dokumen HTML, dan biasanya diletakkan dibagian kepala atau

tag <head>.

Page 29: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

13

Ada dua jenis CSS yang dapat digunakan yaitu CSS yang bersifat

internal dan eksternal. Akan lebih mudah menggunakan yang eksternal,

karena script CSS akan tersimpan berupa file CSS tersendiri, jadi akan lebih

mudah dalam melakukan pengeditan, karena biasanya dihubungkan dengan

link. Jika ingin melakukan perubahan format, cukup melakukan perubahan pada

file CSS, maka halaman yang terhubung dengan CSS tersebut akan ikut

berubah. Jika menggunakan CSS yang bersifat internal pada halaman, maka

bila ada perubahan format harus melakukan banyak pengeditan pada semua

file. CSS juga memungkinkan untuk menerapkan banyak fitur dengan suatu

sintak sederhana yang mudah untuk dipahami. Jika anda terbiasa dengan konsep

penggunaan style dalam program pengolah kata, maka tidak akan menemukan

masalah dalam memahami CSS.

Keunggulan dari pengguna CSS jika dibandingkan dengan hanya

menggunakan kode HTML saja yaitu lebih hemat waktu dan lebih mudah dalam

mengedit tampilan web. Hal ini dikarenakan CSS fungsinya seperti master

halaman. Jadi ketika ingin mengubah seluruh web hanya cukup mengubah file

CSS nya tanpa perlu satu per satu dari tiap halaman. Karena sekali, ditulis maka

CSS akan berlaku untuk semua halaman web. Ini juga berefek pada loading

halaman yang menjadi lebih cepat, karena ukuran file tiap halaman web jadi

lebih kecil. Kemudian dengan CSS juga memungkinkan berbagi efek yang lebih

beragam untuk mempercantik tampilan web yang tidak bisa didapat dari

HTML. Sedangkan kekurangannya adalah beberapa kode CSS yang berjalan

baik pada satu web browser, belum tentu bisa aktif pada browser yang lain.

Page 30: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

14

CSS (Cascading Style Sheets) dapat dituliskan atau digunakan dalam

halaman HTML dengan menggunakan 3 cara berikut:

1. External Style Sheets

External Style Sheets adalah file berisi kode CSS, file ini menghubungkan

satu atau lebih halaman web. Keunggulan file CSS yang dihubungkan

adalah anda dapat mengubah properti dari beberapa halaman web dengan

cepat dan mudah hanya pada satu file dan satu kali proses. Ada 2 perebedaan

metode yang dapat digunakan untuk bekerja dengan file eksternal, yaitu

metode link dan metode import.

2. Emmbeddes Style

Emmbeddes Style adalah metode penulisan CSS dengan meletakkannya

di dalam sepasang tag <style>…</style>. Para desainer biasanya lebih

senang meletakkan di bagian tag <head>, meskipun sebenarnya bisa

diletakkan dibagian manapun dari halaman web. Tag <style> untuk CSS

disebut sabagai atribut jenis text atau CSS.

3. Inline Style

Inline Style adalah metode penulisan CSS dengan ditulis langsung di

dalam tag HTML.

2. PHP (Personal Home Page)

Menurut Anhar (2010:3) mengemukakan bahwa “PHP singkatan dari

Hypertext Proprocessor yaitu Bahasa pemrograman web server-side yang

bersifat open source. PHP merupakan script yang terintegrasi dengan HTML

dan berada pada server (server side HTML embedde scripting)”.

Page 31: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

15

Menurut Kustyaningsish (2011:114) “PHP (atau resminya PHP:

Hypertext Proprosessor) adalah script bersifat sever-side yang ditambahkan ke

dalam HTML.

PHP adalah script yang digunakan untuk membuat halaman website

yang dinamis. Dinamis berarti halaman yang akan ditampilkan dibuat saat

halaman itu diminta oleh client. Mekanisme ini menyebabkan informasi yang

diterima client selalu yang terbaru atau up to date. Semua script PHP

dieksekusi pada server dimana script tersebut dijalankan.

PHP pertama kali dibuat oleh Rasmus Lerdorf pada Tahun 1995, yang

diberi nama FI (Form Interpreted) dan digunakan untuk mengelola form dari

web. Pada perkembangannya, kode tersebut dirilis keumum sehingga mulai

banyak dikembangkan oleh programmer di seluruh dunia.

Pada tahun 1997 PHP 2.0 dirilis. Pada versi ini sudah terintegrasi

dengan Bahasa pemrograman C dan dilengkapi dengan modulnya sehingga

kualitas kerja PHP meningkat secara signifikan. Pada tahun ini juga sebuah

perusahaan yang bernama Zend merilis ulang PHP dengan lebih bersih, baik,

dan cepat. Kemudian diikuti dengan diluncurkannya PHP 3.0 pada tahun 1998.

Tahun 1999 versi 4.0 dirilis PHP versi ini paling banyak digunakan pada

awal abad 21 karena sudah mampu membangun web komplek dengan stabilitas

kecepatan yang tinggi.

Zend merilis kembali PHP 5.0 pada Tahun 2004. Dalam versi ini, inti

dari interpreter PHP mengalami perubahan besar. Versi ini juga memasukkan

model pemrograman berorientasi objek.

Page 32: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

16

Lalu pada versi 6 PHP sudah support untuk Unicode. Juga banyak fitur

penting yang telah ditambah ke dalam PHP 6, antara lain:

1. Support Unicode, dukungan terhadap pengguna Unicode telah

ditambahkan, sehingga lebih mudah untuk membangun dan memelihara

aplikasi.

2. Perbaikan keamanan.

3. Fitur dan kontruksi baru, sejumlah fitur sintaks baru ditambhakan,

seperti 64-bit integer type, membangun perulangan untuk array

multidimensi, serta dukungan untuk lebeled breaks.

Ada dua side dalam programming, yaitu client-side programming dan

server side programming. Dan PHP adalah salah satu server-side progrmming

yang paling banyak digunakan, PHP diciptakan oleh Rasmus Lerdorft, seorang

programmer C yang sangat handal. Pada saat ini PHP digunakan untuk

mencatat jumlah pengunjung pada homepage-nya. PHP mampu berhubungan

dengan database dan dapat diintegrasikan dengan HTML. Pada tahun 1996

HTML dapat digunakan oleh banyak website di dunia. Berdasarkan hasil survey

dari netcraft, PHP adalah salah satu bahasa serever-side yang paling populer

di dunia. PHP memiliki kelebihan yang tidak dimiliki oleh Bahasa-bahasa

sejenisnya. PHP mudah dibuat dan cepat dijalankan. PHP dapat berjalan dalam

web server yang berbeda dan dalam menjalankan sistem operasi yang berbeda

pula, akan tetapi PHP tidak bisa melakukan pengaturan format tampilan

didalam web (browser), misalnya mengatur warna background, jenis huruf,

Page 33: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

17

layout dengan table. PHP bisa disisipkan (Embeded) di dokumen HTML, begitu

juga sebaliknya, bahkan PHP dapat memanipulasikan HTML, agar tampilannya

dapat menjadi lebih dinamis.

PHP membuat proses pengembangan aplikasi menjadi mudah karena

kelebihan-kelebihan yaitu:

1. Kode program (script) terintegrasi dengan HTML, sehingga developer bisa

berkonsentrasi langsung pada penampilan dokumen web-nya.

2. Berorientasi Objek

3. Sintaksis pemrogramman mudah dipelajari, sangat menyerupai C dan perl.

4. Integrasi yang sangat luas ke berbagai server database. Menulis web yang

terhubung ke database menjadi sangat sederhana. Database yang

didukung oleh PHP, Oracle, Cybase, MySQL, Solid, ODBC,

PostegresSQL, Adabas D, Filepro, Velods, Informix, D-Base, UNIX, dbm.

5. Tidak ada proses compliling dan linking.

6. PHP tidak hanya terbatas menghasilkan keluaran HTML, ia juga bisa

digunakan untuk menghasilkan gambar GIF, atau bahkan sumber gambar

GIF yang dinamis.

Untuk menuliskan dan memperkenalkan kode PHP, anda harus

memulainya dengan tanda <?php, setelah tanda tersebut anda dapat

melanjutkan dengan kode program isi didalamnya. Untuk mengakhiri kode

program yang dibuat, anda dapat menutupnya dengan tanda ?>. Selain

penggunaan tanda seperti itu, anda juga dapat menggunakan beberapa bentuk

lain seperti yang ditunjukkan berikut ini:

Page 34: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

18

1. <?

Script PHP

?>

2. <?PHP

Script PHP

?>

3. <script language=”PHP”>

Script PHP

</script>

Pemisah antar instruksi adalah tanta titik koma (;). Untuk membuat

atau menambahkan komentar, standar penulisan adalah /*komentar*/,

//komentar dan #komentar.

3. JavaScript

Menurut Prasetio (2012:300) “JavaScript adalah bahasa pemrograman

yang digunakan untuk membuat web lebih dinamis dan interaktif ”. JavaScript

terintegrasi langsung dengan HTML. Kode JavaScript biasanya dituliskan

dalam bentuk fungsi yang ditaruh di tag <head> yang dibuka dengan tag

<script type=”teks/javascript’>.

4. HTML

Menurut Dipraja (2013:10) “HTML (HyperText Markup Language)

Adalah Bahasa pemrograman (scripti) yang digunakan untuk menyususn

dokumen-dokumen web”. Dokumen HTML disimpan dalam format teks

regular (berupa file, html atau htm) dan mengandung tag-tag yang

Page 35: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

19

memerintahkan web browser untuk mengeksekusi perintah-perintah yang

spesifikasikan. HTML tidak membedakan penulisan huruf besar dan huruf kecil

pada penulisan elemen maupun tag. Penulisan <i> dan <I> dianggap sama.

Program yang digunakan untuk membuat document HTML

menggunakan HTML editor. Ada banyak HTML editor yang bisa digunakan,

diantaranya Notepad, Ms.Front Page, dan Dreamweaver..

HTML ini dikenal sebagai Bahasa standar untuk membuat dokumen

web. Sesungguhnya HTML justru tidak dibuat untuk mempublikasikan

informasi web, namun oleh karena kesederhanaan serta kemudahan

penggunanya, HTML kemudian dipilih orang untuk mendistribusikan

informasi di web.

Perintah-perintah HTML diletakkan dalam file berekstensi html dan

ditandai dengan mempergunakan tanda (tag) berupa karakter “<” dan “>”.

Tidak seperti Bahasa pemrograman berstruktur procedural seperti pascal atau

C, HTML tidak mengenal jumping atau looping. Kode-kode HTML dibaca

oleh browser dari atas kebawah tanpa adanya lompatan-lompatan.

Struktur pada sebuah dokumen HTML pada dasarnya dibagi menjadi

dua bagian besar, yaitu header dan body. Masing-masing ditandai oleh

pasangan container tag <head> dan <body>. Bagian head berisikan judul

dokumen dan informasi-informasi dasar lainnya, sedangkan bagian body adalah

data dokumennya. Pengaturan format teks dan pembentukkan link dilakukan

terhadap objeknya langsung dengan ditandai oleh tag-tag HTML sebagai

berikut:

Page 36: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

20

1. Bagian Awal html

<html> ini memberitahukan browser, bahwa ini merupakan awalan dari

sebuah dokumen html yang diakhiri dengan </html>.

2. Head

Teks yang terdapat diantara tag <head> dan </head>, merupakan

informasi header. Informasi ini tidak dapat ditampilkan pada dokumen

anda.

3. Title

Teks yang diantara tag <tittle> dan </tittle>, merupakan judul yang akan

ditampilkan pada dokumen anda.

4. Body

Bagian body merupakan isi dokumen html. Pada tag ini, semua informasi

baik itu teks, gambar, suara maupun lainnya dapat ditampilkan pada

halaman ini. Teks yang terdapat diantara tag <body> dan </body>,

merupakan teks atau informasi yang akan ditampilkan pada browser.

C. Software Pendukung

1. Adobe Dreamweaver CS6

Saat ini membuat website sudah mulai menjadi trend baru yang banyak

dipelajari orang, menggeser aktivitas membuat e-mail beberapa waktu lalu.

Apalagi saat ini sudah banyak program aplikasi web editor yang memudahkan

orang untuk membuat website dengan mudah dan cepat. Salah satu program

web editor tersebut adalah Adobe Dreamweaver CS6. “Adobe Dreamweaver

Page 37: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

21

merupakan salah satu aplikasi populer yang digunakan untuk mendesain

sekaligus melakukan pemrograman web”, Wahana Komputer (2013:2). Salah

satu kekuatan Adobe Dreamweaver CS6 ini adalah kemampuannya mendukung

pemrograman script server side seperti Active Server Pages (ASP), ASP NET,

Cold Fusion, Java Server Pages (JSP) dan PHP. Selain itu, tentunya

mendukung pemrograman client side yang sangat terkenal dan dipakai orang,

yakni HTML dan JavaScript.

Banyak jenis web editor yang dapat mengolah file PHP, dari

shareware sampai dengan yang freeware dan memiliki kemampuan untuk

mendukung pemrograman server seperti pengelola database, sedangkan client

side merupakan bahan pemrograman tambahan.

2. Adobe Photoshop CS3

Menurut Effendy (2012:4), “Adobe Photoshop adalah perangkat lunak

editor citra buatan Adobe System yang dikhususkan untuk pengeditan foto atau

gambar dan pembuatan efek”. Aplikasi ini juga untuk mengolah data gambar

dan grafis untuk kebutuhan printing, desain grafis, membuat efek “glow” pada

foto. Biasanya ini digunakan untuk membuat kesan glamour pada foto di web

desaign. Keberadaannya benar-benar mampu membantu dan memudahkan

pemakai dalam menyelesaikan berbagai jenis pekerjaan digital maupun digital

imaging. Hasil gambar olah dengan Adobe photoshop ini banyak dilihat di

berbagai website, brosur, koran, majalah, dan media lainnya.

Page 38: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

22

3. XAMPP

Menurut Dukom (2011:43), XAMPP singkatan X (empat sistem operasi

apapun), Apache, MySQL, PHP, Perl adalah “ perangkat lunak yang disediakan

secara gratis, yang mendukung banyak sistem operasi, merupakan kompilasi

dari beberapa program”. Untuk menjalankan fungsinya sebagai server yang

berdiri sendiri, yang terdiri atas program Apache HTTP Server, MySQL

database, dan penterjemahan bahasa yang ditulis dengan Bahasa pemrograman

PHP dan Perl. Program ini tersedia dalam GNU “General Public License” dan

bebas, merupakan web server yang mudah digunakan yang mampu melayani

halaman dinamis. Software XAMPP bisa kita download gratis internet.

D. Basis Data

Menurut Rosa dan Shalahuddin (2013:43) sistem basis data adalah “

sistem terkomputerisasi yang tujuan utamanya adalah memelihara data yang

sudah diolah atau informasi dan membuat informasi tersedia saat dibutuhkan”.

Pada intinya basis data adalah media untuk menyimpan data agar dapat diakses

dengan mudah dan cepat.

1. SQL

“ SQL (Structured Query Language) adalah Bahasa yang digunakan untuk

mengelola data pada RDBMS. SQL awalnya dikembangkan berdasarkan teori

aljabar relasional dan kalkulus” Menurut rosa dan Shalahuddin (2013:46).

SQL mulai berkembang pada tahun 1970. SQL mulai digunakan sebagai

standar yang resmi pada Tahun 1986 oleh ANSI (American National Standards

Page 39: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

23

Institue) dan pada tahun 1987 oleh ISO (Inteenational Organization for

Standardization) dan disebut sebagai SQL-86. Pada perkembangannya SQL

beberapa kali dilakukan revisi.

Menurut Suma (2013) “Banyak perintah dan fungsi SQL yang dapat

digunakan untuk mendefenisikan maupun memanipulasi database. Suatu

rangkaian aktivitas yang berhubungan dengan pemulihan dan pengoptimalan

perintah query di dalam database pada SQL dapat dituliskan fasilitas yang

memiliki antarmuka grafis yaitu Query Analyzer” ( mahasiswa.ung.ac.id)

Secara umum perintah-perintah pada SQL dibagi menjadi dua kelompok

yaitu :

1. DDL (Data Definition Language)

DDL merupakan bagian dari SQL yang digunakan untuk mendefenisikan

data dan proyek database. Perintah digunakan untuk mendefenisikan suatu

proyek, yaitu membuat, mengubah, menghapus dan memberikan izin.

Beberapa Perintah pada SQL yang termasuk DDL, adalah seperti berikut :

a. Create Table untuk Membuat Tabel.

b. Create Index untuk Membuat Index.

c. Create View untuk Membuat View.

d. Alter Table untuk Mengubah atau menyisipkan ke dalam tabel.

e. Drop Table untuk Menghapus Tabel.

f. Drop Index untuk Menghapus Index.

g. Drop View untuk Menghapus View.

h. Grant untuk Memberi izin akses kepada user.

Page 40: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

24

2. DML (Data Manipulation Language)

DML merupakan bagian dari SQL yang digunakan untuk memanipulasi

data. Perintah-perintah ini bertugas untuk melakukan query dan perubahan

yg dilakukan dalam suatu table. Beberapa perintah SQL yang termasuk

DML, seperti :

a. Select digunakan untuk memilih data dari suatu tabel atau view.

b. Insert digunakan untuk Menyisipkan baris dari suatu table.

c. Delete digunakan ntuk Menghapus baris dari suatu table.

d. UpDate digunakan untuk Mengubah isi dari kolom (field) pada

suatu table.

e. Commit digunakan untuk Menuliskan perubahan ke dalam disk.

f. Rollback digunakan untuk Membatalkan perubahan yang dilakukan

setelah perintah Commit yang berakhir.

Kepopulerannya disebabkan MySQL menggunakan SQL sebagai bahan

dasar untuk mengakses databasenya. Selain itu bersifat open source (Anda tidak

perlu membayar untuk menggunakannya) pada berbagai platform, (kecuali

untuk jenis enterprise, yang bersifat komersial). Perangkat MySQL sendiri bisa

di download dari http://www.mysql.com. MySQL termasuk jenis RDBMS

(Relational Database Manajemen System). Itulah sebabnya, istilah seperti

table, baris dan kolom digunakan pada MySQL, semua database mengandung

satu atau beberapa kolom.

Salah satu database server yang cukup terkenal saat ini adalah MySQL.

Adapun keunggulan dari MySQL adalah:

Page 41: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

25

1. Mampu menangani jutaan user dalam waktu bersamaan.

2. Mampu menampung lebih dari 50.000.000 record.

3. Sangat cepat mengeksekusi perintah.

4. MySQL dapat berjalan di berbagai platform, antara lain linux, windows dan

lain sebagainya.

5. Memiliki user privlage sistem yang mudah dan efisien.

Selain itu MySQL juga menyediakan dukungan open source. Setiap

pengguna MySQL diizinkan mengubah source untuk keperluan pengembangan

atau menyelaraskan spesifikasi database sesuai kebutuhan.

PHP berfungsi sebagai Application Programming Interface (API) yang

menghubungkan programmer dengan MySQL. API dapat diibaratkan

seseorang dengan dua muka, satu muka PHP menghadap programmer untuk

menyampaikan pesan dari programmer.

Berikut beberapa fungsi MySQL yang sering digunakan beserta deskripsi

singkat masing-masing fungsi tersebut:

a. Mysql_connect()

Sebelum melakukan operasi apapun di MySQL, hal pertama yang

harus dilakukan adalah membuka koneksi dengan perintah

mysql_connect().

b. Mysql_close()

Perintah mysql_close() digunakan untuk mengakhiri koneksi ke

MySQL.

Page 42: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

26

c. Mysql_create_db()

Selain digunakan untuk membuat koneksi ke MySQL, username dan

password yang diberikan oleh administrator server juga merupakan

izin terbatas untuk membuat dan menggunakan database sendiri.

Untuk membuat database yang hanya dapat diakses oleh username dan

password, digunakan fungsi mysql_create_db() setelah koneksi ke

MySQL dibuka.

d. Mysql_db_query()

Perintah yang diberikan kepada MySQL untuk melakukan sesuatu

Disebut dengan query. Query dikirim ke database yang sedang aktif.

e. Mysql_select_db()

Jika sebuah website menggunakan satu database, fungsi

mysql_select_db() dapat digunakan memilih databse yang sedang aktif

tersebut dapat menghemat resource. Tidak perlu mengulang fungsi

mysql_select_db() untuk mengirimkan query kepada database yang

aktif.

f. Mysql_query()

Digunakan untuk mengirimkan query kepada database aktif yang

sudah dipilih dengan fungsi mysql_select_db().

g. Mysql_fetch_row()

Digunakan unuk mengambil hasil query dari database sebagai data

numeric array.

Page 43: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

27

Fungsi ini akan mengambil data baris-perbaris (per record) dari

database secara berulang-ulang sampai nilai kondisi query menjadi

FALSE. Nilai kondisi query diperoleh dari fungsi

mysql_querry($querry).

h. Mysql_fetch_array

Hampir sama dengan mysql_fetch_row(), mysql_fetch_array()

digunakan untuk mengambil hasil querry dari database sebagai data

associative array.

i. Mysql_nums_rows()

Digunakan untuk menghitung jumlah row (blok data atau record) hasil

query.

E. Model Pengembangan Perangkat Lunak

Menurut Rosa, Shalahuddin (2013:28) “Model SDLC air terjun (Water

fall) sering juga disebut model sekuental linier (Sequiential linier) atau alur

hidup klasik (classic life cycle)”. Model water fall menyediakan pendekatan

alur hidup perangkat lunak secara sekuensial atau terurut di mulai dari analisis,

desain, dan pengujian.

1. Analisis kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

mengspesifikasikan kebutuhan perangkat lunak agar dapat dipahami

perangkat lunak seperti apa yang dibutuhkan oleh user. Spesifikasi

kebutuhan perangkat lunak pada tahap ini perlu untuk didokumentasikan.

Page 44: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

28

2. Desain

Desain perangkat lunak adalah proses multi langkah yang fokus pada

desain pembuatan program perangkat lunak termasuk struktur data,

arsitektur perangkat lunak, representasi antarmuka, dan prosedur

pengkodean. Tahap ini mentranlasi kebutuhan perangkat lunak dari tahap

analisis kebutuhan ke representasi desain agar dapat diimplementasikan

menjadi program pada tahap selanjutnya. Desain perangkat lunak yang

dihasilkan pada tahap ini juga perlu didokumentasikan.

3. Pengujian

Pengujian fokus pada perangkat lunak secara segi lojik dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

meminimalisirkan kesalahan (error) dan memastikan keluaran yang

dihasilkan sesuai dengan yang diinginkan.

2.2. Teori Pendukung

Teori pendukung adalah media yang tepat untuk digunakan dalam

perancangan website. Dengan adanya teori pendukung, maka pemakai dapat

dengan mudah mengetahui cara kerja beserta fungsi dari suatu program

website yang telah dirancang. Adapun teori pendukung yang digunakan

dalam pembuatan website ini adalah struktur navigasi, Enterprise

Relationship (ERD), Logical Record Structure (LRS), dan pengujian web.

Page 45: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

29

A. Struktur Navigasi

Struktur navigasi adalah gabungan dari struktur refrensi informasi situs

web dan mekanisme link yang mendukung pengunjung untuk melakukan

penjelajahan situs.

Menurut Binanto (2010:269-270) ada empat macam bentuk dasar dari

struktur navigasi yang biasa digunakan yaitu:

1. Linier

Pengguna akan melakukan navigasi secara berurutan, dari frame atau

byte informasi yang satu ke yang lainnya.

Gambar II.5.

Struktur Navigasi Linear

Sumber : Binato (2010:269)

2. Hirarki

Struktur dasar ini disebut juga struktur “linier dengan percabangan-

percabangan”, karena pengguna melakukan navigasi disepanjang cabang pohon

struktur yang terbentuk oleh logika isi.

Gambar II.6.

Struktur Navigasi Hirarki

Sumber: Binanto (2010:269)

Page 46: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

30

3. Non Linier

Pengguna akan melakukan navigasi dengan jelas melalui isi proyek

dengan tidak terikat dengan jalur yang sudah ditentukan sebelumnya.

Gambar II.7.

Struktur Navigasi Non Linear

Sumber: Binanto (2010:270)

4. Composite

Pengguna akan melakukan navigasi dengan bebas (secara non-linier),

tetapi terkadang dibatasi prestasi linier film atau informasi penting dan atau

pada data yang paling terorganisasi secara logis pada suatu hirarki.

Gambar II.8.

Struktur Navigasi Composite

Sumber: Binanto (2010:270)

Page 47: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

31

B. Enterprise Relation Diagram (ERD)

Menurut Utami dan Anggit Dwi Hartanto (2012:18) “ERD adalah suatu

diagram untuk menggambarkan desain konsepsual dari model konsepsual suatu

basis data relasional. ERD juga merupakan gambaran yang menghubungkan antar

objek satu dengan objek lain dalam dunia nyata”. Secara umum ERD terdiri dari

tiga komponen, yaitu :

1. Entitas (Entity)

Entitas merupakan suatu “objek nyata yang mampu dibedakan dengan objek

yang lain. Objek tersebut dapat berupa orang, benda ataupun hal yang lainnya.

Jika nama entitas terdiri lebih dari satu suku kata, maka diberikan tanda garis

bawah untuk menyambungnya. Nama entitas merupakan nama objek tunggal dan

sedapat mungkin menggunakan nama yang mudah dipahami.

2. Atribut (Attribute)

Setiap entitas pasti memiliki atribut yang mendeskripsikan karakteristik

(properti) dari entitas tersebut. Sebagai mana telah disebutkan sebelumnya,

penentuan atau pemilihan atribut-atribut yang relevan bagi sebuah entitas

merupakan hal penting lainnya dalam pembentukan model data.

3. Relasi (Relationship)

Belah ketupat merupakan penggambaran hubungan (relasi) antar entitas

atau sering disebut kerelasian. Ada dua macam relasi, yakni relasi kuat dan relasi

lemah. Relasi kuat biasanya untuk menghubungkan antar entitas kuat, sedangkan

realsi lemah untuk menghubungkan entitas kuat dengan entitas lemah.

Page 48: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

32

Dan ada tiga macam relasi menurut derajatnya yaitu Unary, relasi yang

menghubungkan dua entitas. Ternary, relasi yang menghubungkan lebih dari

dua entitas.

Derajat kardinalitas merupakan penjelasan dari tingkat hubungan antar

entitas. Ukuran derajat kardinalitas dibagi menjadi tiga macam, yakni :

a. 1-1 (one-to-one)

Derajat kardinalitas 1-1 terjadi jika satu entitas A hanya mempunyai

hubungan dengan entitas B, ataupun sebaliknya. Sebagai contoh seorang ketua

jurusan hanya memimpin satu jurusan, begitu juga sebaliknya satu jurusan

hanya dipimpin seorang ketua jurusan

b. 1-N (one-to-many) atau N-1 (many-to-one)

Derajat kardinalitas 1-N atau N-1 terjadi jika satu entitas A mempunyai lebih

dari satu hubungan ke entitas B. Sebagai contoh, seorang mahasiswa hanya

mempunyai seorang wali, tetapi seorang wali bisa menjadi wali banyak

mahasiswa.

c. N-N (many-to-many)

Derajat kardinalitas N-N terjadi jika satu entitas A mempunyai lebih dari satu

hubungan ke entitas B dan sebaliknya satu entitas B mempunyai lebih dari

satu hubungan ke entitas A. Sebagai contoh, seorang mahasiswa bisa

mengambil banyak mata kuliah, begitu juga sebaliknya satu mata kuliah bisa

diambil oleh banyak mahasiswa.

Page 49: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

33

C. LRS (Logical Record Structure)

Menurut Suma (2013) “LRS Merupakan representasi dari struktur record-

record pada table-tabel yang terbentuk dari hasil relasi antar himpunan entitas”

(mahasiswa.ung.ac.id).

Menentukan kardinalitas, jumlah table dan Foreign Key (FK). Logical

Record Structure dibentuk dengan nomor dan tipe record. Beberapa tipe record

digambarkan oleh kotak empat persegi panjang dan dengan nama yang unik. Beda

LRS dan ERD nama dan tipe record berada diluar kotak field tipe record

ditempatkan. LRS terdiri dari link-link diantara tipe record. Link ini menunjukkan

arah dari satu tipe record lainnya. Banyak link dari LRS yang di beri tanda field-

field yang kelihatan pada kedua link tipe record. Penggambaran LRS dimulai

dengan menggunakan model yang dimengerti. Dua metode yang dapat digunakan,

dimulai dengan hubungan kedua model yang dapat dikonversikan ke LRS. Metode

lain yang dimulai dengan ERD dan langsung dikonversikan ke LRS.

D. Pengujian Web (Black Box Testing)

Menurut Rosa dan Shalahuddin (2013:275) “Black-Box Testing yaitu

menguji perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan

kode program”. Pengujian dimaksudkan untuk mengetahui apakah fungsi-fungsi,

masukan dan keluaran dari perangkat lunak sesuai dengan spesifikasi yang

dibutuhkan.

Pengujian kotak hitam dilakukan dengan membuat kasus uji yang bersifat

mencoba semua fungsi dengan memakai perangkat lunak apakah sesuai dengan

Page 50: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

34

spesifikasi yang dibutuhkan. Kasus uji yang dibuat dengan kotak hitam harus

dibuat dengan kasus yang benar dan kasus yang salah, misalkan untuk kasus proses

login maka kasus yang dibuat adalah :

1. Jika user memasukan nama pemakai (username) dan kata sandi (password)

yang benar.

2. Jika user memasukkan nama pemakai (username) dan kata sandi (password)

yang salah, misalnya nama pemakai benar tapi kata sandi salah, atau

sebaliknya, atau keduanya salah.

Page 51: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

35

BAB III

PEMBAHASAN

3.1. Analisa Kebutuhan

Analisa Kebutuhan merupakan tahap pengumpulan data-data yang diperlukan

untuk digunakan sebagai dasar dari pengembangan sistem informasi.

3.1.1. Kebutuhan Pengguna

A. Kebutuhan Pengunjung

1. Dapat melihat profil web.

2. Dapat melihat barang atau koleksi barang.

3. Dapat melihat kontak.

4. Dapat melakukan pendaftaran baru.

5. Dapat memilih kategori.

6. Dapat melihat cara belanja.

7. Dapat melakukan cari barang.

B. Kebutuhan Pelanggan

1. Dapat melakukan Log in Member.

2. Dapat melihat profil web.

3. Dapat melihat cara belanja.

4. Dapat melihat barang dan membeli barang.

Page 52: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

36

5. Dapat melihat kontak.

6. Dapat melihat daftar pemesanan.

7. Dapat melakukan konfirmasi pembayaran.

8. Dapat melakukan Log out.

C. Kebutuhan Admin

1. Dapat melakukan log in, seperti mengupdate atau mengolah data-data yang

akan dimasukan ke dalam web.

2. Dapat melihat home, seperti tampilan saat setelah melakukan log in.

3. Dapat mengelola kategori, seperti tambah kategori, edit kategori dan hapus

kategori.

4. Dapat mengubah password admin.

5. Dapat mengelola data provinsi, seperti ongkos kirim pada tiap-tiap provinsi

yang akan dituju, menambahkan atau menghapus data provinsi.

6. Dapat mengelola data barang, seperti menambahkan barang, mengedit

barang, dan menghapus barang.

7. Dapat mengelola status pemesanan, seperti mengubah status dari pesan

menjadi lunas.

8. Dapat melihat laporan, seperti laporan data provinsi, kategori, barang,

pelanggan, pemesanan masuk periode, pemesanan lunas tanggal,

pemesanan lunas periode.

Page 53: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

37

9. Dapat mengelola konfirmasi pembayaran, seperti menghapus data

konfirmasi dan melihat atau mengecek konfirmasi pembayaran apakah

seorang pelanggan sudah mengirimkan transfer uang pembayaran atau

belum.

10. Dapat mengelola data pelanggan, seperti melihat nama pelanggan dan

menghapus data pelanggan.

11. Dapat melakukan log out, seperti setelah mengatur semua kebutuhan data

yang akan di masukan ke dalam web.

3.1.2. Kebutuhan Sistem

A. Kebutuhan sistem untuk admin

1. Memberikan layanan login untuk masuk ke dalam halaman administrator.

2. Memberikan layanan ganti Password.

3. Memberikan layanan laporan.

B. Kebutuhan sistem untuk pelanggan

1. Menyediakan layanan login pelanggan.

2. Menyediakan layanan cara belanja dan ketentuan transaksi.

3. Menyediakan layanan konfirmasi pembayaran.

C. Kebutuhan sistem untuk pengunjung

1. Menyediakan layanan cara belanja dan ketentuan transaksi.

2. Menyediakan layanan untuk melihat kategori barang.

3. Menyediakan layanan pendaftaran baru.

Page 54: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

38

3.2. Perancangan Perangkat Lunak

3.2.1. Rancangan Antar Muka

Penulis akan memberikan penjelasan mengenai rancangan website yang

dibuat, berikut adalah penjelasan mengenai rancangan website yang dibuat :

A. Rancangan Antar Muka Halaman Admin

1. Rancangan Antar Muka Login Admin

Halaman login admin adalah ruang login khusus admin untuk masuk pada

ruang admin yang ada pada website.

Rancangan halaman login admin adalah sebagai berikut :

Gambar III.1.

Rancangan Antar Muka Login Admin

2. Rancangan Antar Muka Halaman Home Admin

Halaman admin adalah halaman untuk admin mengelola website, seperti

melihat, menambah, mengedit dan menghapus data yang ada pada website.

Rancangan antar muka halaman home admin adalah sebagai berikut :

Page 55: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

39

Gambar III.2.

Rancangan Antar Muka Home Admin

3. Rancangan Antar Muka Tambah Data Provinsi

Gambar III.3.

Rancangan Antar Muka Tambah Data Provinsi

Page 56: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

40

4. Rancangan Antar Muka Tambah Data Kategori

Gambar III.4.

Rancangan Antar Muka Tambah Data Kategori

5. Rancangan Antar Muka Tambah Data Barang

Gambar III.5.

Rancangan Antar Muka Tambah Data Barang

Page 57: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

41

6. Rancangan Antar Muka Data Pelanggan

Gambar III.6.

Rancangan Antar Muka Tambah Data Pelanggan

7. Rancangan Antar Muka Pemesanan Barang

Gambar III.7.

Rancangan Antar Muka Pemesanan Barang

Page 58: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

42

8. Rancangan Antar Muka Konfirmasi Transfer

Gambar III.8

Rancangan Antar Muka Konfirmasi Transfer

9. Rancangan Antar Muka Ganti Password Admin

Gambar III.9.

Rancangan Antar Muka Ganti Password Admin

Page 59: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

43

10. Rancangan Antar Muka Laporan Pemesanan Masuk

Gambar III.10.

Rancangan Antar Muka Laporan Pemesanan Masuk

B. Rancangan Antar Muka Halaman Pengunjung (User)

Front end adalah halaman untuk user atau pengunjung yang ada pada website

1. Rancangan Antar Muka Login pelanggan

Halaman login pelanggan adalah ruang login khusus pelanggan yang telah

terdaftar menjadi pelanggan yang dapat membeli barang.

Rancangan halaman pelanggan baru adalah sebagai berikut :

Page 60: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

44

Gambar III.11.

Rancangan Antar Muka Login Pelanggan

2. Rancangan Antar Muka Halaman Daftar Pelanggan Baru

Gambar III.12.

Rancangan Antar Muka Daftar Pelanggan Baru

Page 61: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

45

3. Rancangan Antar Muka Halaman Utama Pengunjung

Halaman Utama Pengunjung merupakan halaman Utama untuk User untuk

melihat website.

Rancangan antar muka halaman utama pengunjung adalah sebagai berikut :

Gambar III.13.

Rancangan Antar Muka Halaman Utama Pengunjung

Page 62: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

46

4. Rancangan Antar Muka Halaman Pelanggan

Gambar III.14.

Rancangan Antar Muka Halaman Pelanggan

Page 63: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

47

5. Rancangn Antar Muka Konfirmasi Pembayaran

Gambar III.15.

Rancangan Antar Muka Konfirmasi Pembayaran

6. Rancangan Antar Muka Cara Belanja

Gambar III.16.

Rancangan Antar Muka Cara Belanja

Page 64: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

48

3.2.2. Rancangan Basis Data

A. Entity Relationship Diagram (ERD)

Gambar III.17.

Entity Relationship Diagram

Page 65: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

49

B. Logical Record Structure (LRS)

Gambar III.18.

Logical Record Structure

C. Spesifikasi File

1. Spesifikasi File Pelanggan

Nama File : Pelanggan

Akronim : pelanggan

Fungsi : Untuk menyimpan data pelanggan

Page 66: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

50

Tipe File : File Master

Organisasi File : Index Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 108 karakter

Kunci Field : kd_pelanggan

Software : MySQL

Tabel III.1

Spesifikasi File Pelanggan

No Elemen Data Nama Filed Type Size Keterangan

1 Kode pelanggan kd_pelanggan Char 6 Primary Key

2 Nama pelanggan nm_pelanggan Varchar 10

4 Email email Varchar 10

5 No Telepon No_telepon Varchar 12

6 Username username Varchar 20

7 Password password Varchar 50

8 Tanggal Daftar Tgl_datar Date

2. Spesifikasi File Pemesanan

Nama File : Pemesanan

Akronim : pemesanan

Page 67: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

51

Fungsi : Untuk menyimpan data pemesanan

Tipe File : File Transaksi

Organisasi : Index Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 86 karakter

Kunci Field : no_pemesanan

Software : MySQL

Tabel III.2

Spesifikasi File Pemesanan

No Elemen Data Nama Filed Type Size Keterangan

1 No Pemesanan no_pemesanan Char 6 Primary Key

2 Kode Pelanggan kd_pelanggan Char 6 index

3 Tanggal Pemesanan tgl_pemesanan Date

4 Nama Penerima nm_penerima Varchar 20

5 Alamat Lengkap Alamat_lengkap Varchar 25

6 Kode Provinsi kd_provinsi Char 3

7 Kota Kota Varchar 8

8 Kode Pos Kode_pos Varchar 6

9 No Telepon no_telepon Varchar 12

10 Status Bayar Status_bayar Enum

Page 68: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

52

3. Spesifikasi File Pemesanan Detail

Nama File : Pemesanan Detail

Akronim : pemesanan_detail

Fungsi : untuk menyimpan detail pemesanan

Tipe File : File Transaksi

Organisasi : Index Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 33 karakter

Software : MySQL

Tabel III.3

Spesifikasi File Pemesanan Detail

No Elemen Data Nama Filed Type Size Keterangan

1 Identitas Id Int 5 Primari Key

2 No Pemesanan no_pemesanan Char 8

3 Kode Barang kd_barang Char 5

4 Harga Harga Int 12

5 Jumlah Jumlah Int 3

4. Spesifikasi File Barang

Nama File : Barang

Akronim : barang

Page 69: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

53

Fungsi : untuk menyimpan data barang

Tipe File : File Master

Organisasi : Index Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 154 karakter

Software : MySQL

Tabel III.4.

Spesifikasi File barang

No Elemen Data Nama Filed Type Size Keterangan

1 Kode Barang kd_barang Char 4 Primari Key

2 Nama Barang nm_barang Varchar 30

3 Harga Jual harga_jual Int 12

4 Stok Stok Int 4

5 keterangan Keterangan Text

6 File Gambar file_gambar Varchar 100

7 Kd Kategori kd_kategori Char 4

5. Spesifikasi File Kategori

Nama File : Kategori

Akronim : kategori

Fungsi : untuk menyimpan data kategori

Page 70: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

54

Tipe File : File Master

Organisasi : Index Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 34 karakter

Software : MySQL

Tabel III.5.

Spesifikasi File Kategori

No Elemen Data Nama Filed Type Size Keterangan

1 Kode Kategori kd_kategori Char 4 Primari Key

2 Nama Kategori nm_kategori Varchar 30

6. Spesifikasi File Provinsi

Nama File : Provinsi

Akronim : provinsi

Fungsi : untuk menyimpan data biaya kirim provinsi

Tipe File : File Master

Organisasi : Index Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 40 karakter

Software : MySQL

Page 71: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

55

Tabel III.6.

Spesifikasi File Provinsi

No Elemen Data Nama Filed Type Size Keterangan

1 Kode Provinsi kd_provinsi Char 3 Primari Key

2 Nama Provinsi nm_provinsi Varchar 25

3 Biaya Kirim biaya_kirim int 12

3.2.3. Rancangan Struktur Navigasi

Struktur navigasi website digunakan untuk menggambarkan secara garis

besar isi dari seluruh situs web dan menggambarkan bagaimana hubungan antara isi

tersebut. Struktur navigasi website ini adalah struktur navigasi campuran

(composite). Melalui struktur navigasi website ini, terlihat bagaimana isi dan

susunan dari sebuah website secara menyeluruh. Pembuatan struktur navigasai

website ini akan sangat membantu nantinya ketika akan membuat rancangan seluruh

halaman website.

Page 72: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

56

1. Rancangan Struktur Navigasi Halaman Admin

Gambar III.19.

Rancangan Struktur Navigasi Halaman Admin

Page 73: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

57

2. Rancangan Struktur Navigasi Halaman Pelanggan

Gambar III.20.

Rancangan Struktur Navigasi Halaman Pelanggan

3.3. Implementasi Dan Pengujian Unit

3.3.1. Implementasi

A. Implementasi Rancangan Antar Muka

1. Halaman Login Admin

Administrator harus melakukan login terlebih dahulu untuk dapat masuk

keruang admin. Jika login berhasil, maka menu-menu yang dibutuhkan admin

akan ditampilkan.

Page 74: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

58

Gambar III.21.

Halaman Login Admin

2. Halaman Home Admin

Gambar III.22.

Halaman Home Admin

Page 75: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

59

3. Halaman Tambah Data Provinsi

Gambar III.23.

Halaman Tambah Data Provinsi

4. Halaman Tambah Data Kategori

Gambar III.24.

Halaman Tambah Data Kategori

Page 76: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

60

5. Halaman Tambah Data Barang

Gambar III.25.

Halaman Tambah Data Barang

6. Halaman Tambah Data Pelanggan

Gambar III.26.

Halaman Tambah Data Pelanggan

Page 77: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

61

7. Halaman Pemesanan Barang

Gambar III.27.

Halaman Pemesanan Barang

8. Halaman Konfirmasi Transfer

Gambar III.28.

Halaman Konfirmasi Transfer

Page 78: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

62

9. Halaman Ganti Password Admin

Gambar III.29.

Halaman Ganti Password Admin

10. Halaman Laporan

Gambar III.30.

Halaman Laporan

Page 79: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

63

11. Halaman Login pelanggan

Gambar III.31.

Halaman Login Pelanggan

12. Halaman Daftar Pelanggan Baru

Gambar III.32.

Halaman Daftar Pelanggan Baru

Page 80: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

64

13. Halaman Cara Belanja

Gambar III.33.

Halaman Cara Belanja

14. Halaman Konfirmasi Pembayaran

Gambar III.34.

Halaman Konfirmasi Pembayaran

Page 81: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

65

15. Halaman halaman utama pengunjung

Gambar III.35.

Halaman Utama Pengunjung

Page 82: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

66

16. Halaman Utama Pelanggan

Gambar III.36.

Halaman Utama Pelanggan

Page 83: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

67

B. Spesifikasi Sistem Komputer

1. Spesifikasi Perangkat Keras

1) CPU

(a) Processor Intel Core i3 – M380M (2.53Ghz)

(b) RAM 2 GB DDR3

(c) HardDisk 500 Gb

2) Mouse

3) Keyboard

4) Layar LCD 14,0’ LED

2. Spesifikasi Perangkat Lunak

1) Operating System Windows 7 Starter

2) Web Editor Adobe Dreamweaver CS6

3) Bahasa Script PHP, CSS, HTML, JavaScript

4) Web Server XAMPP 1.8.1

5) Database Server 127.0.0.1

6) Database Tools PhpMyadmin 5.4.7

7) Web Browser Mozilla Firefox, Google Chrome

3.3.2. Pengujian Unit

Pengujian terhadap program yang dibuat menggunakan blackbox testing yang

fokus terhadap proses masukan dan keluaran program.

1. Pengujian Terhadap Form Login Admin

Page 84: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

68

Tabel III.7

Pengujian Blackbox Testing Halaman Login Admin

No Skenario

pengujian

Test case Hasil Yang

Diharapakan

Hasil

Pengujian

Kesimpulan

1 Mengosongkan

semua isian

data login pada

login admin

lalu mengklik

tombol login

Username:

(kosong)

Password:

(kosong)

Sistem akan

menolak akses login

dan menampilkan

pesan” Data

Username tidak

boleh kosong”,

“Data Password

tidak boleh kosong”.

Sesuai

harapan

valid

2 Hanya mengisi

username dan

mengosongkan

password,

kemudian

mengklik

tombol login.

Username:

(admin)

Password :

(kosong)

Sistem akan

menolak akses login

dan menampilkan

pesan” Data

Password tidak

boleh kosong”.

Sesuai

harapan

valid

3 Hanya mengisi

password dan

mengosongkan

username,

kemudian

mengklik

tombol login.

Username:

(kosong)

Password :

(admin)

Sistem akan

menolak akses login

dan menampilkan

pesan” Data

Username tidak

boleh kosong”.

Sesuai

harapan

valid

4 Menginput

dengan kondisi

salah satu

Username :

(admin)

Password :

Sistem akan

menolak akses login

dan akan kembali ke

Sesuai

harapan

valid

Page 85: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

69

benar, salah

satu salah,

kemudian

mengklik

tombol login.

(coba) halaman index

admin.

5 Menginput

dengan kondisi

semua salah

Username :

(twyety)

Password :

(ghghhngg)

Sistem akan

menolak akses login

dan akan kembali ke

halaman index

admin.

Sesuai

harapan

valid

6 Menginput

dengan kondisi

salah satu

salah, satu

benar,

kemudian

mengklik

tombol login.

Username :

(admincoba)

Password :

(admin)

Sistem akan

menolak akses login

dan akan kembali ke

halaman index

admin.

Sesuai

harapan

valid

7 Mengisi semua

isian data login

pada login

admin lalu

mengklik

tombol login

Username :

(admin)

Password :

(admin)

Sistem akan

menerima dan anda

bisa masuk ke ruang

admin.

Sesuai

harapan

valid

Page 86: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

70

2. Pengujian Terhadap Form Login Pelanggan

Tabel III.8.

Pengujian Blackbox Testing Halaman Login Pelanggan

No Skenario

pengujian

Test case Hasil Yang

Diharapakan

Hasil

Pengujian

Kesimpulan

1 Mengosongkan

semua isi data

login pada

login

pelanggan lalu

mengklik

tombol login.

Username:

(kosong)

Password:

(kosong

Sistem akan

menolak akses login

dan menampilkan

pesan” Login Anda

Salah, kesalahan

input”, “Data

username, kosong

silahkan isi dengan

benar”, “Data

password, kosong

silahkan isi dengan

benar”, “Data

username dan

password yang anda

masukkan belum

benar”.

Sesuai

harapan

valid

2 Hanya mengisi

username dan

mengosongkan

password,

kemudian

mengklik

tombol login.

Username:

(chaterine)

Password:

(kosong)

Sistem akan

menolak akses login

dan menampilkan

pesan” Login Anda

Salah, kesalahan

input “Data

password kosong,

Sesuai

harapan

valid

Page 87: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

71

silahkan isi dengan

benar”, “Data

username dan

password yang anda

masukkan belum

benar”.

3 Mengisi

password dan

mengosongkan

username,

kemudian

mengklik

tombol login.

Username:

(kosong)

Password:

(rin95)

Sistem akan

menolak akses login

dan menampilkan

pesan” Login Anda

Salah, kesalahan

input “Data

username kosong,

silahkan isi dengan

benar”, “Data

username dan

password yang anda

masukkan belum

benar”

Sesuai

harapan

valid

4 Menginput

dengan kondisi

salah satu

benar, salah

satu salah,

kemudian

mengklik

tombol login.

Username :

(chaterine)

Password :

(rin)

Sistem akan

menolak akses login

dan menampilkan

pesan” Login Anda

Salah, kesalahan

input data username

dan password yang

anda masukkan

belum benar”.

Sesuai

harapan

valid

5 Menginput Username : Sistem akan Sesuai valid

Page 88: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

72

dengan kondisi

salah satu

salah, satu

benar,

kemudian

mengklik

tombol login.

(catherine)

Password :

(rin95)

menolak akses login

dan menampilkan

pesan” Login Anda

Salah, kesalahan

input data username

dan password yang

anda masukkan

belum benar”.

harapan

6 Menginput

dengan kondisi

semua benar

Username:

(chaterine)

Password:

(rin95)

Sistem akan

menerima, dan anda

bias login sebagai

pelanggan.

Sesuai

harapan

valid

3. Pengujian Terhadap Form Halaman Konfirmasi Pembayaran

Tabel III.9.

Pengujian Blackbox Testing Halaman Konfirmasi Pembayaran

No Skenario

pengujian

Test case Hasil Yang

Diharapakan

Hasil

Pengujian

Kesimpulan

1 No.pemesanan

Kosong, nama

pelanggan

kosong,

jumlah

transfer

kosong,

keterangan

kosong, klik

tombol kirim.

No.

pemesanan:

(kosong)

Nama

pelanggan:

(kosong)

jumlah

transfer:

(kosong)

Keterangan

Sistem akan

menolak akses dan

muncul tulisan “

Data no.pemesanan

masih kosong, isi

sesuai dengan

no.pemesanan

anda”, “Data nama

penerima masih

kosong, isi sesuai

Sesuai

harapan

valid

Page 89: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

73

: (kosong) nama akun anda”,

“Data jumlah

ditransfer(Rp)

masih kosong, dan

harus ditulis angka,

“Data keterangan

masih kosong”.

2 No.pemesanan

Kosong, nama

pelanggan

diisi, jumlah

transfer diisi,

keterangan

kosong, klik

tombol kirim.

No.

pemesanan:

(kosong)

Nama

pelanggan:

(chaterine)

jumlah

transfer:

(199.000)

Keterangan

: (kosong)

Sistem akan

menolak akses dan

muncul tulisan “

Data no.pemesanan

masih kosong, isi

sesuai dengan

no.pemesanan

anda”, “Data

keterangan masih

kosong”.

Sesuai

harapan

valid

3 No.pemesanan

diisi, nama

pelanggan

diisi, jumlah

transfer diisi,

keterangan

diisi, klik

tombol kirim.

No.

pemesanan:

(diisi)

Nama

pelanggan:

(diisi)

jumlah

transfer:

(diisi)

Keterangan

: (diisi)

Data konfirmasi

diterima oleh

sistem.

Sesuai

harapan

valid

Page 90: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

74

BAB IV

PENUTUP

4.1. Kesimpulan

Berdasarkan permasalahan yang telah terurai pada bab sebelumnya, maka

penulis dapat menarik kesimpulan sebagai berikut :

1. Dengan web kita dapat mengetahui informasi dan membeli suatu barang atau

produk tanpa harus bersusah payah datang langsung atau mencari ketempat yang

dituju.

2. Dengan web ini diharapkan seluruh pengguna internet dapat mengakses dan

mengetahui tentang penjualan tas wanita.

3. Dengan web ini diharapkan dapat mempermudah dan memperluas promosi produk

dan penjualan tas wanita.

4. Web ini juga dapat mengurangi biaya yang dikeluarkan untuk promosi produk yang

di pasarkan oleh toko tas wanita.

5. Web ini akan mengupdate produk terbaru tas wanita yang akan dijual.

6. Dengan adanya ATM transaksi pembelian jauh lebih mudah dan cepat.

Page 91: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

75

4.2. Saran

Dari kesimpulan yang penulis sudah kemukakan diatas, maka penulis

memberikan beberapa saran yang mungkin dapat membantu agar web ini dapat bekerja

secara optimal. Adapun saran dari penulis adalah sebagai berikut :

1. Tampilan pada gambar masih sederhana, maka karena dari itu diharapkan bisa

menampilkan gambar yang lebih menarik lagi.

2. Agar tidak mengabaikan keamanan web security system, karena keamanan web

security merupakan salah satu prioritas yang sangat utama pada sebuah website.

3. Belum adanya fasilitas lupa password, maka karena dari itu diharapakan untuk

menambahkan fasilitas lupa password.

Page 92: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

76

DAFTAR PUSTAKA

Ahmadi, Candra, dan Dadang Hermawan. 2013. E-Business & E-Commerce.

Yogyakarta: Andi.

Anhar. 2010. Panduan menguasai PHP & MySQL secara otodidak. Jakarta: Media

Kita.

A.S.Rosa. M Shalahudin 2013. Rekayasa Perangkat Lunak. Bandung: Informatika.

Binanto, Iwan. 2010. Multimedia Digital – Dasar Teori dan pengembangannya.

Yogyakarta : Lokomedia

Dipraja, Samja 2013. Panduan Praktis Membuat Website Gratis. Jakarta: Pustaka

Makmur.

Dukom, Master. 2011. Menjadi master Website Gratis dalam Hitungan Menit Jakarta:

Dunia Komputer.

Effendy, Asep. 2012. Otodidak Photoshop dari Basic Hingga Mahir. Jakarta: Kubus

Media.

Kustyaningsih, Yeni, R. A. Devie 2011. Pemrograman Basis Data Berbasis Web

Menggunakan PHP & MySQL. Yogyakarta : Graha Ilmu.

Prasetio, Adhi 2012. Buku Pintar Pemrograman Web. Jakarta : Media Kita.

Rosa A. S, M Shalahudin. 2013. Rekayasa Perangkat Lunak Terstruktur dan

Berorientasi Objek. Bandung: Informatika.

Saputra, Agus, dan Feni Agustin. 2012. Membangun Sistem Aplikasi E-commerce

dan SMS. Jakarta: PT. Elek Media Komputindo.

Shalahudin. Rosa. 2013. Rekayasa Perangkat Lunak. Bandung: Informatika.

Suma, Arif. 2012. Jenis-jenis perintah atau bahasa SQL. Diambil dari:

http://mahasiswa.ung.ac.id/921409030/home/s=SQL

(4 Mei 2016).

Suma, Arif. 2013. relationship pada perpustakaan. Diambil dari:

http://mahasiswa.ung.ac.id/921409030/home/categories/921409030_tugas_kelo

(4 Mei 2016).

Page 93: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

77

Sibero, Alexander. 2011. Kitab Suci Web Programming. Yogyakrta: MediaKom.

Utami, Erna, dan Anggit Dwi Hartamto. 2012. Sistem Basis Data Menggunakan

Micrososft SQL server 2005. Yogyakarta: Andi

Page 94: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

76

DAFTAR RIWAYAT HIDUP

A. Biodata Mahasiswa

NIM : 12134294

Nama Lengkap : Chaterine Deliana

Tempat & Tanggal Lahir : Blora, 12 Mei 1995

Jenis Kelamin : Perempuan

Agama : Kristen

Alamat Lengkap : Asrama Rindam Jaya No. 257 RT.005 RW.05

Condet-Jakarta Timur

B. Pendidikan Formal

1. SD ST LOUISA CEPU, Lulus Tahun 2007

2. SMP NEGERI 3 CEPU, Lulus Tahun 2010

3. SMK NEGERI 1 CEPU, Lulus Tahun 2013

Jakarta, 16 Juni 2016

Chaterine Deliana

Page 95: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

79

LAMPIRAN-LAMPIRAN

Lampiran A1. Halaman Lengkapi Alamat Pengiriman

Lampiran A2. Halaman Konfirmasi Pembayaran

Page 96: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

80

Lampiran A3. Halaman Cetak Lengkap Pemesanan Barang

Page 97: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

81

Lampiran B1. Halaman Laporan Pemesnan Masuk

Lampiran B2. Halaman Laporan Pemesanan Lunas Pertanggal

Page 98: TUGAS AKHIR...vii 6. Rekan-rekan mahasiswa kelas MI-6A Serta semua pihak yang terlalu banyak disebut satu perastu sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan

82

Lampiran B3. Halaman Laporan Pemesanan Lunas Per Periode