TUGAS AKHIR - repository.bsi.ac.id · TUGAS AKHIR Diajukan untuk memenuhi salah satu syarat kelulusan Diploma Tiga (D.III) LINGGIH LUKIS TRESNA NIM : 12136448 ... Akademi Manajemen

PERANCANGAN SISTEM INFORMASI PENJUALAN JAM

TANGAN PRIA BERBASIS WEB

TUGAS AKHIR

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

LINGGIH LUKIS TRESNA

NIM : 12136448

Program Studi Manajemen Informatika

Akademi Manajemen Informatika dan Komputer Bina Sarana Informatika

Jakarta

2016

ii

iii

iv

v

vi

KATA PENGANTAR

Puji syukur penulis panjatkan kehadirat Allah SWT, yang telah melimpahkan

rahmat dan karunia-Nya, sehingga pada akhirnya penulis dapat menyelesaikan tugas

akhir dengan baik dan lancar. Dimana tugas akhir ini penulis sajikan dalam bentuk

yang sederhana. Adapun judul penulisan tugas akhir, yang penulis ambil sebagai

berikut: “PERANCANGAN SISTEM INFORMASI PENJUALAN JAM

TANGAN PRIA BERBASIS WEB”.

Tujuan penulisan tugas akhir ini adalah sebagai salah satu syarat kelulusan

Program Diploma Tiga (DIII) Akademi Manajemen Informatika dan Komputer Bina

Sarana Informatika (AMIK BSI) Program Studi Manajemen Informatika.

Penulis menyadari bahwa tanpa adanya bimbingan dan dorongan dari semua

pihak, maka penulisan tugas akhir ini tidak akan berjalan dengan lancar sebagaimana

mestinya. Oleh karena itu pada kesempatan ini, perkenankanlah penulis

menyampaikan ucapan terima kasih kepada:

1. Direktur Bina Sarana Informatika

2. Ketua Program Studi Manajemen Informatika

3. Ibu Puji Astuti, M.Kom selaku dosen pembimbing tugas akhir

4. Seluruh Staff, Dosen serta semua Karyawan AMIK BSI yang telah banyak

membantu dan memberikan motivasi kepada penulis dalam menyelesaikan

tugas akhir ini

vii

5. Orang tua serta keluarga yang senantiasa memberikan semangat, dukungan

dan doanya sehingga penulis dapat menyelesaikan tugas akhir ini dengan tepat

waktu.

6. Rekan-rekan seperjuangan dari Akademi Manajemen Informatika dan

Komputer (AMIK BSI) Salemba 22, khususnya Program Studi Manajemen

Informatika kelas 12.6A.07 serta rekan-rekan lainnya yang telah membantu

menyumbangkan pemikirannya sehingga penulis dapat menyelesaikan tugas

akhir ini.

Penulis menyadari bahwa penulisan tugas akhir ini masih jauh dari sempurna

dan masih banyak memiliki kekurangan. Oleh karena itu kritik dan saran yang

membangun sangat penulis harapkan demi kesempurnaan penulisan dimasa yang

akan datang. Semoga penulisan ini dapat memberikan manfaat bagi ilmu pengetahuan

umumnya dan khususnya bagi pembaca.

Jakarta, 22 Juni 2016

Penulis

Linggih Lukis Tresna

viii

ABSTRAK

Linggih Lukis Tresna (12136448), Perancangan Sistem Informasi Penjualan

Jam Tangan Pria Berbasis Web

Jam tangan adalah sebuah aksesoris yang berfungsi sebagai penunjuk waktu. Namun,

seiring dengan berkembangnya industri fashion di dunia, jam tangan tidak hanya

berfungsi sebagai penunjuk waktu, sekarang jam tangan juga berfungsi sebagai

pelengkap dalam fashion pria. Jika kita melihat ke belakang, dunia fashion selalu

dianggap sebagai bagian dari gaya hidup wanita, tetapi dalam beberapa tahun

belakangan ini kita bisa melihat meningkatnya permintaan pasar terhadap fashion

pria. Banyak perusahaan yang telah membuka beberapa cabang toko jam tangan

untuk memudahkan konsumen mereka dalam mendapatkan jam tangan. Tetapi

dengan perkembangan teknologi dan internet sekarang ini, sudah banyak sekali

perusahaan-perusahaan yang mulai menjual jam tangan buatan mereka melalui media

internet atau lebih dikenal dengan istilah e-commerce. Jangkauan yang luas tanpa

mengenal wilayah dan waktu membuat sistem penjualan berbasis web menjadi oasis

baru bagi para pelaku bisnis didunia. Dengan adanya perkembangan seperti itu, maka

potensi untuk mendapatkan konsumen akan lebih besar dari pada penjualan dengan

cara konvensional. Hal inilah yang melatar belakangi penulis untuk mengambil

permasalahan ini dalam penulisan makalah kali ini dalam rangka pembuatan website

dengan konsep e-commerce dengan mengedepankan pelayanan yang cepat dan

menyeluruh bagi seluruh konsumen maupun calon konsumen.

Kata Kunci: Jam Tangan, E-commerce, Website

ix

ABSTRACT

Linggih Lukis Tresna (12136448), Web Based Information System Design of Men

Watches’s Sales

Watches are an accessory used to be as a timepiece. However, along with the

development of the fashion industry in the world, watches are not only functions as a

timepiece, now watches also serves as a complement in men's fashion. If we look

back, the fashion world has always been considered as a part of the lifestyle of

women, but in the past few years we could see an increasing market demand for

men's fashion. Many companies have opened their store all over the world to

facilitate customers to buy the watches. But with the current technology and internet

developments, many companies began selling their watches through media of the

internet or commonly known as e-commerce. This is a new oasis for businessman in

the world without the limit of time and wide range of place. Given such developments,

the potential to get consumers will be greater than the sales in the conventional

manner. It is the background of the authors to take the matter in writing this paper in

order to make a website with the concept of e-commerce by promoting fast and

comprehensive service for all consumers and potential consumers.

Keywords: Watches, E-commerce, Website

x

DAFTAR ISI

Lembar Judul Tugas Akhir ......................................................................................... i

Lembar Pernyataan Keaslian Tugas Akhir ................................................................. ii

Lembar Pernyataan Persetujuan 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

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 .............................................................................. 16

BAB III PEMBAHASAN .................................................................................... 21

3.1. Analisis Kebutuhan .......................................................................... 21

3.2. Perancangan Perangkat Lunak ......................................................... 23

3.2.1. Rancangan Antar Muka.......................................................... 26

3.2.2. Rancangan Basis Data ............................................................ 35

3.2.3. Rancangan Struktur Navigasi ................................................. 44

3.3. Implementasi dan Pengujian Unit .................................................... 46

xi

3.3.1. Implementasi .......................................................................... 46

3.3.2. Pengujian Unit ........................................................................ 56

BAB IV PENUTUP .............................................................................................. 60

4.1. Kesimpulan .................................................................................... 60

4.2. Saran ............................................................................................. 61

DAFTAR PUSTAKA ............................................................................................... 62

DAFTAR RIWAYAT HIDUP................................................................................. 63

xii

DAFTAR SIMBOL

Simbol Entity Relationshiop Diagram

Entitas atau Obyek Data

Kumpulan obyek atau sesuatu yang dapat dibedakan

atau dapat diidentifikasi secara unik.

Relationship

Hubungan yang terjadi antara satu entitas atau lebih.

Kumpulan relationship yang sejenis disebut

relationship set.

Atribut atau Elemen Data

Karakteristik dalam entity atau relationship yang

mengerjakan penjelasan detail tentang entity atau

relationship atau dengan kata lain adalah kumpulan

elemen data yang membentuk suatu entitas.

Weak Entity

Suatu entity dimana keberadaan dari entity tersebut

tergantung dari entity lain.

Atribut Multivalue

Atribut yang memiliki nilai lebih dari satu.

Connection

Digunakan sebagai penghubung entitas yang

membedakan entitas tersebut dengan entitas lainnya.

xiii

DAFTAR GAMBAR

1. Gambar II.1. Ilustrasi Model Waterfall ............................................................... 13

2. Gambar II.2. Struktur Navigasi Linier ................................................................ 16

3. Gambar II.3. Struktur Navigasi Hierarki ............................................................ 17

4. Gambar II.4. Struktur Navigasi Non Linier ........................................................ 18

5. Gambar II.5. Struktur Navigasi Campuran ......................................................... 18

6. Gambar III.1. Entity Relationship Diagram ........................................................ 24

7. Gambar III.2. Logical Record Structure ............................................................. 25

8. Gambar III.3. Rancangan Antar Muka Home User 1 ......................................... 26

9. Gambar III.4. Rancangan Antar Muka Home User 2 ......................................... 27

10. Gambar III.5. Rancangan Antar Muka Halaman Product ................................... 27

11. Gambar III.6. Rancangan Antar Muka Halaman Sign-in ................................... 28

12. Gambar III.7. Rancangan Antar Muka Halaman Register .................................. 28

13. Gambar III.8. Rancangan Antar Muka Halaman Detail Product ........................ 29

14. Gambar III.9. Rancangan Antar Muka Halaman Cart ........................................ 29

15. Gambar III.10. Rancangan Antar Muka Halaman Checkout .............................. 30

16. Gambar III.11. Rancangan Antar Muka Halaman Login Admin ....................... 31

17. Gambar III.12. Rancangan Antar Muka Halaman Dashboard ............................ 31

18. Gambar III.13. Rancangan Antar Muka Halaman Show Product....................... 32

19. Gambar III.14. Rancangan Antar Muka Halaman Insert Product....................... 32

20. Gambar III.15. Rancangan Antar Muka Halaman Product Detail ...................... 33

21. Gambar III.16. Rancangan Antar Muka Halaman Show Order .......................... 33

22. Gambar III.17. Rancangan Antar Muka Halaman Show Order Detail ............... 34

23. Gambar III.18. Rancangan Antar Muka Halaman Show Customer ................... 34

24. Gambar III.19. Struktur Navigasi Halaman Pengunjung .................................... 44

25. Gambar III.20. Struktur Navigasi Halaman Admin ............................................ 45

26. Gambar III.21. Struktur Navigasi Halaman Login Admin ................................. 47

27. Gambar III.22. Struktur Navigasi Halaman Utama Admin ................................ 47

28. Gambar III.23. Struktur Navigasi Halaman Menu Product ................................ 48

xiv

29. Gambar III.24. Struktur Navigasi Halaman Insert Product ................................ 48

30. Gambar III.25. Struktur Navigasi Halaman Insert Product Detail ...................... 49

31. Gambar III.26. Struktur Navigasi Halaman Menu Customer ............................. 49

32. Gambar III.27. Struktur Navigasi Halaman Utama Home ................................. 50

33. Gambar III.28. Struktur Navigasi Halaman Utama Product ............................... 50

34. Gambar III.29. Struktur Navigasi Halaman Utama Product Detail .................... 51

35. Gambar III.30. Struktur Navigasi Halaman Utama Login .................................. 52

36. Gambar III.31. Struktur Navigasi Halaman Utama Register .............................. 52

37. Gambar III.32. Struktur Navigasi Halaman Utama Cart .................................... 53

38. Gambar III.32. Struktur Navigasi Halaman Utama Checkout ............................ 53

xv

DAFTAR TABEL

1. Tabel II.1. Komponen ERD (Entity Relation Diagram) ..................................... 19

2. Tabel III.1. Spesifikasi File Customer................................................................ 36

3. Tabel III.2. Spesifikasi File Product .................................................................. 37

4. Tabel III.3. Spesifikasi File Product Detail ....................................................... 38

5. Tabel III.4. Spesifikasi File Cart ........................................................................ 39

6. Tabel III.5. Spesifikasi File Order ..................................................................... 40

7. Tabel III.6. Spesifikasi File Order Detail .......................................................... 41

8. Tabel III.7. Spesifikasi File Payment ................................................................. 42

9. Tabel III.8. Spesifikasi File Admin .................................................................... 43

10. Tabel III.9. Hasil Pengujian Blackbox Testing Login Admin ............................. 55

11. Tabel III.10. Hasil Pengujian Blackbox Testing Login Pelanggan ..................... 56

12. Tabel III.11. Hasil Pengujian Blackbox Testing Daftar Pelanggan .................... 57

13. Tabel III.12. Hasil Pengujian Blackbox Testing Tambah Produk ...................... 58

14. Tabel III.13. Hasil Pengujian Blackbox Testing Stok Produk ............................ 59

15. Tabel III.14. Hasil Pengujian Blackbox Testing Edit Data Admin ..................... 77

1

BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

Saat ini industri fashion di Indonesia, khususnya fashion pria, sedang

berkembang dengan pesat. Meskipun tidak secepat di kota-kota besar di dunia, namun

kita bisa melihat pertumbuhan yang signifikan. Jika kita melihat ke belakang, dunia

fashion selalu dianggap sebagai bagian dari gaya hidup wanita. Tapi dalam beberapa

tahun belakangan ini, kita melihat meningkatnya permintaan pasar terhadap fashion

pria. Menurut beberapa desainer dan pengamat fashion pria terkemuka di Indonesia

(http://www.bestlife.co.id/article/mengungkap-tren-fashion-pria-indonesia-2016), hal

ini dapat terjadi karena para pria mulai peduli pada penampilan, mereka mulai paham

bahwa penampilan dapat mencerminkan citra diri mereka di hadapan orang lain. Ini

dapat dilihat dari makin banyaknya toko-toko fashion pria baik lokal maupun

internasional yang bisa kita temukan di berbagai pusat perbelanjaan.

Salah satu aksesoris yang penting dalam fashion pria kini adalah jam tangan.

Jam tangan adalah sebuah aksesoris yang berfungsi sebagai penunjuk waktu. Namun,

seiring dengan berkembangnya industri fashion di dunia, jam tangan tidak hanya

berfungsi sebagai penunjuk waktu, sekarang jam tangan juga berfungsi sebagai

pelengkap dalam fashion pria. Tidak bisa dipungkiri lagi bahwa sekarang jam tangan

pria sudah menjadi salah satu bagian dari dunia fashion.

2

Banyak perusahaan yang telah mengembangkan produksi pembuatan jam

tangan pria. Perusahaan-perusahaan tersebut juga membuka beberapa cabang toko

jam tangan untuk memudahkan konsumen dalam mendapatkan jam tangan yang

sesuai dengan selera masing-masing. Bahkan, banyak juga perusahaan yang menjual

jam tangan melalui media internet atau dikenal dengan istilah e-commerce (sistem

penjualan produk secara elektronik).

Berdasarkan hal-hal tersebut diatas, dalam penyusunan tugas akhir ini penulis

akan membuat sebuah rancangan yang berjudul “Perancangan Sistem Informasi

Penjualan Jam Tangan Berbasis Web”. Pada penyusunan tugas akhir ini, akan

dilakukan perancangan terhadap sistem agar sesuai dengan tujuan dalam pembuatan

sistem penjualan ini serta implementasi dari hasil perancangannya. Dengan sistem ini,

penjual dapat mengelola kegiatan penjualan, produk-produk yang tersedia dan juga

laporan-laporan yang terkait dengan kegiatan penjualan. Diharapkan dengan

pembuatan sistem ini pelanggan mendapatkan kemudahan dalam membeli jam tangan

tanpa memperdulikan tempat dan waktu.

1.2 Maksud dan Tujuan

Adapun maksud dari penulisan tugas akhir ini adalah:

1. Memberikan kemudahan kepada konsumen atau pelanggan dalam melakukan

transaksi pembelian jam tangan dengan menggunakan internet.

2. Memperluas jangkauan pemasaran penjualan jam tangan pria melalui website.

3. Mengembangkan pengetahuan penulis tentang HTML, CSS, PHP dan MySQL

sebagai acuan utama dalam pembuatan sistem penjualan berbasis web.

3

Penulis juga menjelaskan mengenai tujuan dari penulisan tugas akhir ini

adalah sebagai salah satu syarat kelulusan pada Program Diploma Tiga (D.III) untuk

program studi Manajemen Informatika di Akademi Manajemen Informatika dan

Komputer Bina Sarana Informatika (AMIK BSI JAKARTA).

1.3 Metode Penelitian

Dalam penyusunan tugas akhir ini, penulis menggunakan beberapa metode

penelitian data, yaitu:

A. Metode Pengembangan Perangkat Lunak

Model waterfall adalah suatu proses pengembangan perangkat lunak yang

berurutan, dimana kemajuan dipandang sebagai terus mengalir ke bawah

melewati fase-fase perencanaan, pemodelan, implementasi (konstruksi) dan

pengujian. Menurut Rosa dan Salahudin (2013 : 28) “Model Air terjun

(waterfall) menyediakan pendekatan alur hidup perangkat lunak secara

sekuensial atau terurut dimulai dari analisis, desain, pengodean, pengujian dan

tahap pendukung (support)”.

1. Analisis Kebutuhan

Proses analisa disini meliputi kebutuhan-kebutuhan yang diperlukan oleh

user dalam cara pengoperasian website, melihat produk pada website dan

melakukan transaksi. Dan juga kebutuhan yang diperlukan administrator

dalam pengoperasian website, pengolahan data produk dan pengolahan

data transaksi.

4

2. Desain

Proses desain yang dimaksud disini bukan hanya desain dari tampilan

atau interfacenya saja, tetapi yang dimaksud adalah desain sistem dari

website itu sendiri. Dalam proses penampilan gambar pada header,

navigasi, footer dan lainnya, penulis menggunakan Adobe Photoshop

untuk menyelesaikannya.

3. Pengkodean

Metode waterfall pada tahap pengkodean ini penulis menggunakan script

HTML, CSS, JAVASCRIPT, PHP dan MySQL sebagai basis data.

Dengan menggunakan software XAMPP dan Sublime Text Editor.

4. Implementasi dan Pengujian Unit

Implementasi ini menggunakan metode Blackbox Testing sebagai

pengujian terhadap beberapa halaman-halaman yaitu admin dan user.

B. Metode Pengumpulan Data

Metode yang penulis gunakan untuk mendapatkan data sebagai objek penulisan

adalah sebagai berikut :

1. Metode Pengamatan (Observation)

Penulis mendapat gambaran langsung terhadap kegiatan transaksi yang dilakukan

oleh penjual jam tangan, agar penulis dapat mengetahui proses yang dilalui dari

awal pengenalan produk sampai produk yang telah diterima oleh pelanggan.

5

2. Studi Pustaka (Library Research)

Penulis mengumpulkan data-data dari buku dan sumber lainnya seperti buku,

website, jurnal dan sebagainya yang berkaitan dengan masalah yang akan dibahas

dalam Tugas Akhir ini.

1.4 Ruang Lingkup

Adapun ruang lingkup dalam penulisan Tugas Akhir ini adalah membahas

tentang sistem penjualan jam tangan dengan memberi batasan yang terdiri dari proses

pendaftaran pelanggan baru, pengelolaan data oleh bagian administrasi dan proses

transaksi pemesanan jam tangan yang dilakukan pelanggan.

1.5 Sistematika Penulisan

Sistematika yang akan penulis gunakan pada penulisan tugas akhir ini adalah

sebagai berikut:

BAB I PENDAHULUAN

Bab ini akan memberikan gambaran secara singkat tentang latar

belakang permasalahan, maksud dan tujuan, metode pengumpulan data,

ruang lingkup dan sistematika penulisan.

BAB II LANDASAN TEORI

Bab ini berisi dasar teori yang akan menjadi dasar pemikiran dan

sebagai landasan penulis dalam membuat Tugas Akhir ini.

BAB III PEMBAHASAN

6

Bab ini berisikan penjelasan dari tinjauan perusahaan, analisis

kebutuhan, perancangan perangkat lunak yang terdiri dari rancangan

antar muka, rancangan basis data, dan rancangan struktur navigasi. Juga

menjelaskan tentang implementasi dan pengujian unit.

BAB IV PENUTUP

Bab ini secara khusus akan menjabarkan kesimpulan dari perancangan

sistem yang dibuat serta menyatakan saran-saran untuk pengembangan

sistem dan juga pengembangan penulisan selanjutnya.

7

BAB II

LANDASAN TEORI

2.1 Konsep Dasar Web

Sebelum masuk ke dalam tahap pembahasan mengenai spesifikasi

perancangan web, penulis juga akan mengemukakan teori perancangan

programnya karena teori difokuskan pada pengolahan data.

A. Pengertian Web

Menurut Arief (2011:7) “Web adalah salah satu aplikasi yang berisikan

dokumen-dokumen multimedia (teks, gambar, suara, animasi, video) di dalamnya

menggunakan protokol HTTP (Hypertext Transfer Protocol) dan untuk

mengaksesnya menggunakan perangkat lunak yang disebut browser.”

1. Internet

Internet merupakan kependekan dari kata Internetwork, yang berarti

rangkaian komputer yang terhubung menjadi beberapa rangkaian jaringan dengan

cakupan secara global. Menurut Setiawan (2012:1) menjelaskan bahwa “Internet

adalah kumpulan komputer dan jaringan lokal yang melakukan aktivitas

komunikasi satu sama lain berbasis protokol TCP/IP dalam area yang tidak

terbatas. Dasar internet adalah jaringan komputer yang dikembangan oleh

ARPANET pada tahun 1972.”

2. Website

Website atau situs web merupakan kumpulan dari halaman web yang

sudah dipublikasikan di jaringan internet dan memiliki domain/URL (Uniform

8

Resource Locator) yang dapat diakses semua pengguna internet dengan cara

mengetikkan alamatnya pada address bar di browser.

Ditinjau dari aspek content atau isinya, website dapat dibagi menjadi 2

jenis menurut Arief (2011:8-9) yang menjelaskan bahwa “Web statis adalah web

yang isinya/contentnya tidak berubah-ubah. Maksudnya adalah isi dari dokumen

web tersebut tidak dapat diubah secara cepat dan mudah. Ini karena teknologi

yang digunakan untuk membuat dokumen web ini tidak memungkinkan dilakukan

perubahan isi/data. Web dinamis adalah jenis web yang content/isinya dapat

berubah-ubah setiap saat. Untuk melakukan perubahan data, user cukup

mengubahnya langsung secara online di internet melalui halaman control

panel/administrasi yang biasanya telah disediakan untuk user administrator

sepanjang user tersebut memiliki hak akses yang sesuai.”

3. World Wide Web (WWW)

World Wide Web atau yang biasa disingkat WWW merupakan kumpulan

situs web yang dapat diakses di internet yang berisikan semua informasi yang

dibutuhkan semua pengguna internet. Jadi antara web, website dan WWW

sebenarnya memiliki pengertian yang sama, hanya ruang lingkupnya yang

berbeda.

4. Aplikasi Berbasis Web

1. Web Browser

Merupakan program yang berfungsi untuk menampilkan dokumen-

dokumen web dalam format HTML. Bagaimana halaman web yang

dibuat ditampilkan sangat tergantung pada web engine yang digunakan

oleh masing-masing browser. Menurut Arief (2011:19) “Semua jenis web

9

browser yang ada saat ini mengikuti standarisasi yang dibuat oleh World

Wide Web Consortium (W3C) yang merupakan badan independen yang

mengurus semua hal yang berkaitan dengan web di dunia.”

2. Web Server

Menurut Arief (2011:19) “Web server adalah program aplikasi yang

memiliki fungsi sebagai tempat menyimpan dokumen-dokumen web.”

Jadi semua dokumen web baik yang ditulis menggunakan client side

scripting maupun server side scripting tersimpan didalam direktori utama

web server (document root).

3. Database Server

Adalah program yang digunakan untuk menyimpan data yang akan

diolah dihalaman web. Database biasa disebut Database Management

System (DBMS) adalah sebuah aplikasi yang menjembatani user dan

data-data di dalam database. Dengan menggunakan DBMS user mampu

mengolah data-data didalam database secara mudah dan cepat.

B. Bahasa Pemrograman

Untuk membuat web statis maka Bahasa pemrograman/script yang

digunakan cukup jenis client side scripting, contohnya adalah HTML, HTML5,

Cascading Style Sheet (CSS), JQuery. Untuk membuat web dinamis maka script

yang digunakan adalah gabungan antara client side scripting dan server side

scripting, yang contohnya adalah PHP: Hypertext Preprocessor (PHP).

10

1. HTML (Hypertext Markup Language)

Menurut Arief (2011:23) menjelaskan bahwa “HTML atau Hypertext

Markup Language merupakan salah satu format yang digunakan dalam

pembuatan dokumen dan aplikasi yang berjalan di halaman web.” Dokumen ini

dikenal sebagai web page. Dokumen HTML merupakan dokumen yang disajikan

pada web browser.

Menurut Setiawan (2012:105) “Dokumen HTML adalah suatu dokumen

teks biasa, dan disebut markup language karena mengandung tag tertentu yang

digunakan untuk menentukan tampilan suatu teks dan tingkat kepentingan dalam

teks suatu dokumen.”

Jadi dapat disimpulkan bahwa HTML (Hypertext Markup Language)

adalah sebuah bahasa pemrograman yang berfungsi untuk menampilkan konten

dalam suatu web. Sebuah dokumen HTML sendiri adalah dokumen teks yang

dapat diedit oleh editor teks apapun. Dokumen HTML juga disusun oleh beberapa

elemen atau lebih dikenal dengan komponen-komponen dasar yang disebut

dengan tag HTML.

2. PHP (PHP: Hypertext Preprocessor)

Pengertian PHP (PHP: Hypertext Preprocessor) adalah bahasa server-side

scripting yang menyatu dengan HTML untuk membuat halaman web yang

dinamis. Karena PHP merupakan server-side scripting maka sintaks dan perintah-

perintah PHP akan dieksekusi di server kemudian hasilnya dikirimkan ke browser

dalam format HTML. Dengan demikian kode program yang ditulis dalam PHP

tidak akan terlihat oleh user sehingga keamanan halaman web lebih terjamin.

11

Salah satu keunggulan yang dimiliki oleh PHP adalah kemampuannya

untuk melakukan koneksi ke berbagai macam software sistem manajemen basis

data/Database Management System (DBMS), sehingga dapat menciptakan

halaman website yang dinamis.

3. CSS (Cascading Style Sheet)

Menurut Saputra (2012:27b) “CSS yang merupakan singkatan dari

cascading style sheet merupakan Bahasa pemrograman web yang di desain khusus

untuk mengendalikan dan membangun berbagai komponen dalam web sehingga

tampilannya lebih rapih, terstruktur dan seragam.”

Pemrograman CSS wajib dikuasai dikuasai oleh pembuat program (Web

Programmer), terlebih lagi bagi pendesain web (Web Designer). CSS saat ini

dikembangkan oleh World Wide Web Consortiura (W3C) dan menjadi Bahasa

standar dalam pembuatan web. CSS juga difungsikan sebagai penopang atau

pendukung, dan pelengkap file html yang berperan dalam penataan kerangka dan

layout.

C. Basis Data

Basis dapat diartikan sebagai markas atau gudang, tempat bersarang atau

berkumpul. Sedangkan data merupakan representasi fakta dunia nyata yang

mewakili suatu objek seperti manusia, hewan, benda dan objek lainnya. Basis data

itu sendiri adalah media untuk menyimpan data agar dapat diakses dengan mudah

dan cepat.

Menurut Yakub (2012:55) mendefinisikan bahwa “Basis data merupakan

koleksi dari data-data yang terorganisasi dengan cara sedemikian rupa sehingga

data tersebut mudah disimpan dan dimanipulasi.”

12

Sebuah sistem basis data dapat memiliki beberapa basis data. Setiap basis

data dapat memiliki sejumlah objek basis data (seperti tabel, indeks dan lainnya).

Data tersebut dapat ditampilkan, didefinisikan, diubah dan dihapus dari tabel.

1. MySQL (My Structure Query Language)

Menurut Arief (2011:151), “MySQL adalah salah satu jenis database

server yang sangat terkenal terkenal dan banyak digunakan untuk membangun

aplikasi web yang menggunakan database sebagai sumber dan pengelolaan

datanya.” MySQL menggunakan SQL sebagai bahasa dasar untuk mengakses

database-nya sehingga mudah untuk digunakan. Hal lain yang membuat MySQL

begitu populer adalah karena kinerja query begitu cepat, dan memcukupi untuk

kebutuhan database perusahaan-perusahaan skala menengah-kecil.

MySQL juga bersifat open source dan free (tidak perlu membayar untuk

menggunakannya) pada berbagai platform (kecuali pada Windows, yang bersifat

shareware). MySQL merupakan database yang pertama kali didukung oleh

bahasa pemrograman script untuk internet seperti PHP. MySQL dan PHP

dianggap sebagai pasangan software pengembangan aplikasi web yang ideal.

MySQL lebih sering digunakan untuk membangun aplikasi berbasis web,

umumnya pengembangan aplikasinya menggunakan bahasa pemrograman script

PHP.

Adapun keunggulan dari MySQL antara lain:

a. Mampu menangani jutaan user dalam waktu yang bersamaan

b. Mampu menampung lebih dari 50.000.000 record

c. MySQL menggunakan SQL dan bersifat free (gratis)

13

d. Setiap pengguna MySQL diizinkan mengubah source untuk keperluan

pengembangan atau menyelaraskan spesifikasi database sesuai kebutuhan

D. Model Pengembangan Perangkat Lunak

Menurut Rosa dan Shalahuddin (2013:26), “SDLC (Software Development

Life Cycle) adalah proses mengembangkan atau mengubah suatu sistem perangkat

lunak dengan menggunakan model-model dan metodologi yang digunakan orang

untuk mengembangkan sistem-sistem perangkat lunak.” Sebelumnya. SDLC

memiliki beberapa model dalam penerapan tahapan prosesnya, antara lain: Model

Waterfall, Model Prototipe, Model Rapid Application Development (RAD),

Model Iteratif dan Model Spiral.

Model yang banyak digunakan oleh para pengembang perangkat lunak

adalah model Waterfall, karena mengusulkan sebuah pendekatan perkembangan

perangkat lunak yang sistematik dan sekuensial. Model Waterfall memiliki

tahapan sebagai berikut:

Analisa Desain Pengodean Pengujian

Sistem/Rekayasa

Informasi

Sumber : Rosa dan Salahuddin (2013:29)

Gambar II.1.

Ilustrasi Model Waterfall

14

1. Analisis Kebutuhan Perangkat Lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

menspesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat

lunak seperti apa yang dibutuhkan oleh user.

2. Desain

Proses multilangkah yang focus pada desain pembuatan program termasuk

struktur data, arsitektur perangkat lunak, representasi antar muka dan

prosedur pengodean.

3. Pembuatan kode program

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari

tahap ini adalah program computer sesuai dengan desain yang telah dibuat

pada tahap desain.

4. Pengujian

Fokus pada perangkat lunak secara dari segi lojik dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini bertujuan untuk

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan

sesuai yang diinginkan.

Model Waterfall sangat cocok digunakan, kebutuhan pelanggan sudah

sangat dipahami dan kemungkinan terjadinya perubahan kebutuhan selama

pengembangan perangkat lunak kecil. Hal positif dari model Waterfall adalah

struktur tahap pengembangan sistem jelas, dokumentasi dihasilkan di setiap tahap

pengembangan, dan sebuah tahap dijalankan setelah tahap sebelumnya selesai

dijalankan (tidak ada tumpeng tindih pelaksanaan tahap). Model ini hanya cocok

15

untuk pengembangan perangkat lunak dengan spesifikasi yang tidak berubah-

ubah.

E. E-Commerce

Definisi e-commerce menurut Turban dkk, dalam buku Jonathan, K.

Prihartono (2012:5), ialah “Proses membeli dan menjual atau menukar produk,

jasa atau informasi melalui komputer”. Sedangkan menurut Laudon dalam buku

Sarwono, K. Prihartono (2012:5), “E-commerce ialah penggunaan internet dan

web untuk transaksi bisnis, atau secara lebih formal e-commerce didefinisikan

sebagai transaksi perdagangan yang dimungkinkan secara digital antar organisasi

dengan organisasi atau dengan individual serta antar individual dengan

individual.”

Dari kedua definisi diatas, dapat disimpulkan bahwa e-commerce berkaitan

dengan transaksi jual beli yang dilakukan secara digital dengan menggunakan

komputer yang tersambung dengan internet. Oleh karena itu, peranan internet

dalam e-commerce sangat penting karena komputer yang digunakan untuk

bertransaksi harus dapat digunakan untuk berkomunikasi antara pihak pembeli

dan penjual.

Dengan demikian, model transaksi dalam e-commerce akan berbeda

dengan transaksi bisnis konvensional. Jika transaksi bisnis konvensional

memerlukan tatap muka, maka dalam e-commerce tidak diperlukan tatap muka

langsung antara pembeli dan penjual.

16

2.2 Teori Pendukung

A. Struktur Navigasi

Dalam membangun sebuah program, diperlukan juga peralatan pendukung

yang berguna untuk mempermudah langkah-langkah dalam mendesain program.

Salah satu peralatan pendukung tersebut adalah struktur navigasi.

Menurut Suyanto (2008:62) “Struktur navigasi dalam situs web melibatkan

sistem navigasi situs web secara keseluruhan dan desain interface situs web

tersebut, navigasi memudahkan jalan yang mudah ketika menjelajahi situs web”.

Struktur Navigasi dapat dikatakan sebagai penggambar dari hubungan atau

rantai kerja dari seluruh elemen yang akan digunakan dalam aplikasi.

Menurut Binanto (2010), ada 4 macam bentuk struktur navigasi yaitu:

1. Struktur Linier

Struktur navigasi yang hanya mempunyai satu rangkaian cerita yang

terurut. Struktur ini menampilkan satu demi satu tampilan layar secara berurutan

menurut aturannya

Sumber : Binanto (2010)

Gambar II.2.

Struktur Navigasi Linier

17

2. Struktur Hierarki

Struktur navigasi hierarki sering disebut navigasi bercabang, yaitu

merupakan suatu struktur yang menghandalkan percabangan untuk menampilkan

data atau gambar pada layar berdasarkan kriteria tertentu. Tampilan pada menu

pertama disebut master page, halaman tersebut mempunyai halaman percabangan

yang disebut slave page (halaman pendukung), dan jika dipilih akan menjadi

halaman kedua dan seterusnya.


Gambar II.3.

Struktur Navigasi Hierarki

3. Struktur Non Linier

Struktur non linier merupakan pengembangan dari struktur penjejakan

linier yang diperkenankan membuat struktur navigasi bercabang. Pada

percabangan nono linier walaupun terdapat banyak percabangan tetapi tiap-tiap

tampilan mempunyai kedudukan yang sama, sehingga tidak terdapat “master

page” dan “slave page”.

18


Gambar II.4.

Struktur Navigasi Non Linier

4. Struktur Campuran

Struktur navigasi yang merupakan gabungan dari struktur navigasi non

linier dan hirarki, dan biasa disebut juga struktur navigasi bebas, maksudnya

adalah jika suatu tampilan membutuhkan percabangan.


Gambar II.5

Struktur Navigasi Campuran

19

B. ERD (Entity Relationship Diagram)

ERD merupakan dokumentasi data dengan mengidentifikasi jenis entitas

dan hubungannya dan disiapkan pada suatu titik dalam proses pengembangan

sistem saat gambaran besar data ditentukan. Banyaknya suatu entitas berhubungan

dengan entitas lain disebut keterkaitan (connectivity).

Menurut Budilaksono (2009:12) “Entity Relationship Diagram (ERD) atau

disebut ER merupakan diagram yang berfungsi sebagai alat bantu kita dalam

memodelkan rancangan basis data”.

Tujuan dari Entity Relationship adalah untuk menunjukkan objek data dan

relationship yang ada pada objek tersebut. Disamping itu model ER ini

merupakan salah satu alat untuk perancangan dalam basis data.

Menurut Fathansyah (2007:8) notasi simbolik didalam diagram ER yang

dapat digunakan sebagai berikut:

Tabel II.1.

Komponen ERD (Entity Relation Diagram)

Diagram Keterangan

Persegi panjang, menyatakan Himpunan

Entitas

Lingkaran/Elip, menyatakan Atribut (Atribut

yang berfungsi sebagai key digaris bawahi)

Belah ketupat, menyatakan Himpunan Relasi

20

Garis, sebagai penghubung antara Himpunan

Relasi dengan Himpunan Entitas dan

Himpunan Entitas dengan Atributnya.

Sumber : Fathansyah (2007:80)

C. LRS (Logical Record Strukture)

Berdasarkan definisi dari Ladjamudin (2006:189) “ERD (Entity

Relationship Diagram) adalah suatu model jaringan yang menggunakan susunan

data yang disimpan dalam sistem secara abstrak”.

D. Pengujian Web atau Black Box Testing

Menurut Rizky (2011:264), Black Box testing (pengujian kotak hitam)

adalah tipe testing yang memperlakukan perangkat lunak yang tidak diketahui

kinerja internalnya. Sehingga para tester memandang perangkat lunak seperti

layaknya sebuah “kotak hitam” yang tidak penting dilihat isinya, tapi cukup

dikenai proses testing di bagian luar.

Black Box Testing berusaha untuk menemukan kesalahan dalam kategori

berikut:

1. Fungsi yang tidak benar atau fungsi yang hilang

2. Kesalahan antarmuka

3. Kesalahan dalam struktur data atau akses database eksternal

4. Kesalahan perilaku (behavior) kesalahan kinerja

21

BAB III

PEMBAHASAN

3.1 Analisis Kebutuhan

Dalam rancangan website, penulis akan membuat website yang dapat memberikan

kemudahan bagi para pengguna untuk memperoleh informasi produk maupun

melakukan transaksi pembelian secara online. Dengan mengacu pada kebutuhan-

kebutuhan yang sudah penulis analisa, sebagai berikut:

A. Kebutuhan pengguna

Dalam sistem informasi penjualan berbasis web, terdapat tiga kategori pengguna,

yaitu administrator, pengunjung dan pelanggan (member). Masing-masing kategori

pengguna mempunyai kebutuhan yang berbeda-beda, dengan penjelasan sebagai

berikut :

1. Administrator

a. Administrator dapat melakukan login menuju web administrator

b. Administrator dapat mengelola data-data seperti menambah, mengubah dan

menghapus data-data produk, kategori produk, data pelanggan dan data

administrator itu sendiri

c. Administrator dapat mengolah data pemesanan berikut data konfirmasi

pembayaran dari pelanggan

2. Pengunjung

a. Pengunjung dapat melihat halaman utama website dan halaman produk

22

b. Pengunjung dapat melakukan pendaftaran menjadi pelanggan (member) pada

halaman pendaftaran yang tersedia, agar dapat melakukan transaksi pada

website

3. Pelanggan (member)

a. Pelanggan dapat melakukan login pelanggan (member)

b. Pelanggan (member) dapat melakukan pemesanan produk dengan

memindahkan produk menuju keranjang belanja

c. Pelanggan (member) dapat melihat tampilan produk yang dipesan pada

keranjang belanja, yaitu berupa spesifikasi gambar dan deskripsi mengenai

keterangan dari produk tersebut

d. Pelanggan (member) dapat mengubah data-data pribadi sebelum melakukan

transaksi

e. Jika pelanggan sudah melakukan pembayaran dengan metode yang

disediakan, maka pelanggan dapat melakukan konfirmasi pembayaran pada

halaman yang tersedia

B. Kebutuhan Sistem

Dalam sistem informasi penjualan berbasis web, terdapat kebutuhan sistem sebagai

berikut :

1. Sistem harus mampu memberikan informasi yang realtime terhadap pengunjung

2. Sistem harus mampu menampilkan produk-produk beserta detail produk tersebut

3. Setiap pengunjung dapat melakukan transaksi apabila telah mendaftar menjadi

pelanggan (member) dan telah melakukan login

23

4. Sistem harus memberikan feedback atau pesan yang jelas terhadap pengunjung

ataupun member saat melakukan login dan juga transaksi

5. Sistem harus mampu memverifikasi akun dari member maupun administrator

6. Sistem harus dapat melakukan kalkulasi secara otomatis terhadap transaksi

pemesanan barang yang dilakukan oleh pelanggan (member)

3.2 Perancangan Perangkat Lunak

Rancangan perangkat lunak yang penulis siapkan untuk membangun sistem informasi

penjualan jam tangan pria berbasis web adalah rancangan antar muka, rancangan

basis data dan rancangan struktur navigasi.

24

A. Entity Relationship Diagram (ERD)

product

product_series

price

product_desc

product_id

product_detail

product_detail_id

product_name color qty

image1

image2

product_id

M

1

M

M

customers

customer_id

firstname

address

email

phone

lastname

city

province

password

1Memilih

Memiliki

Masuk

Melakukan

order

order_id

total_order

customer_id

completed

order_date

1

1

1

pending

cancel

Melakukan

payment

payment_id

image

order_idcustomer_id

1

M

verify

admin_id

Memeriksaadmin

phone

email

name

password 1

order_detail

order_detail_id

order_id

product_id

product_detail_id

priceqty

sub_total

M

Memiliki

1

cart

product_detail_id

product_id

qty

sub_total

1

admin_id

customer_id

cart_id

cart_id

Gambar III.1.

Entity Relationship Diagram

25

B. Logical Record Structure (LRS)

cart

cart_id*qty

sub_total

product_detail_id**product_id**

customer_id**

payment

payment_id*ImageVerify

order_id**customer_id**

admin_id**

customers

customer_id*firstnamelastnameaddressprovince

cityemail

passwordphone

admin

admin_id*email

passwordnamephone

order

order_id*total_orderorder_date

pendingcompleted

cancel

customer_id**

order_detail

order_detail_id*priceqty

sub_total

order_id**product_id**

product_detail_id**cart_id**

product

product_id*product_seriesproduct_desc

price

product_detail

product_detail_id*product_name

colorqty

Image1Image2

product_id**

1

M

1

M

M

1

1

M

1

M

1

1

1

1

1

1

M

M

M

M

1

1

M

Gambar III.2.

Logical Record Structure

26

3.2.1 Rancangan Antar Muka

Rancangan antar muka di bawah ini lebih cenderung kepada dasar tampilan antar

muka (interface) website yang akan dibuat. Dasar tampilan ini hanya sketsa atau

gambaran kasar dari tampilan sebenarnya. Rancangan ini akan digunakan sebagai

landasan dasar dalam membuat tampilan website.

Berikut ini adalah rancangan antar muka (interface) yang penulis siapkan untuk

membangun sistem informasi penjualan berbasis web:

A. Rancangan Halaman Home User

Halaman ini adalah halaman yang dapat diakses oleh seluruh customer atau user :

1. Rancangan Antar Muka Home User

Gambar III.3.

Rancangan Antar Muka Home User 1

27

Gambar III.4.

Rancangan Antar Muka Home User 2

2. Rancangan Antar Muka Halaman Product

Gambar III.5.

Rancangan Antar Muka Halaman Product

28

3. Rancangan Anta Muka Halaman Sign In

Gambar III.6.

Rancangan Antar Muka Halaman Sign In

4. Rancangan Antar Muka Halaman Register

Gambar III.7.

Rancangan Antar Muka Halaman Register

29

5. Rancangan Antar Muka Halaman Detail Product

Gambar III.8.

Rancangan Antar Muka Halaman Detail Product

6. Rancangan Antar Muka Halaman Cart

Gambar III.9.

Rancangan Antar Muka Halaman Cart

30

7. Rancangan Antar Muka Halaman Checkout

Gambar III.10.

Rancangan Antar Muka Halaman Checkout

B. Rancangan Halaman Administrator

Rancangan halaman administrator ini adalah rancangan halaman yang akan

digunakan oleh admin untuk mengolah data yang ditampilkan pada halaman user.

Gunanya adalah untuk mengisi, mengubah, maupun menghapus data dalam database

yang ditampilkan pada halaman user.

31

1. Rancangan Antar Muka Halaman Login Admin

Gambar III.11.

Rancangan Antar Muka Login Admin

2. Rancangan Antar Muka Halaman Dashboard

Gambar III.12.

Rancangan Antar Muka Halaman Dashboard

32

3. Rancangan Antar Muka Halaman Show Product

Gambar III.13.

Rancangan Antar Muka Halaman Show Product

4. Rancangan Antar Muka Halaman Insert Product

Gambar III.14.

Rancangan Antar Muka Halaman Insert Product

33

5. Rancangan Antar Muka Halaman Insert Product Detail Produk

Gambar III.15.

Rancangan Antar Muka Halaman Insert Product Detail

6. Rancangan Antar Muka Halaman Show Order

Gambar III.16.

Rancangan Antar Muka Halaman Show Order

34

7. Rancangan Antar Muka Halaman Show Order Detail

Gambar III.17.

Rancangan Antar Muka Halaman Show Order Detail

8. Rancangan Antar Muka Halaman Show Customer

Gambar III.18.

Rancangan Antar Muka Halaman Show Customer

35

3.2.2 Rancangan Basis Data

Perancangan basis data menghasilkan pemetaan tabel-tabel yang digambarkan dengan

Entity Relationship Diagram (ERD) dan Logical Record Structure (LRS)

A. Spesifikasi File

Menjelaskan tentang file atau tabel yang terbentuk dari transformasi ERD dan file-file

penunjang untuk web. File-file ini tersimpan pada database yang bernama watch_db

dengan parameter-parameter sebagai berikut:

1. Spesifikasi File Customer

Nama File : Customer

Akronim : customer

Fungsi : untuk menyimpan data customer

Tipe File : File Master

Organisasi File : Index Sequential

Akses File : Random

Media File : Harddisk

Panjang Record : 326

Kunci Filed : customer_id

Software : Mysql

36

Tabel III.1.

Spesifikasi File Customer

No Elemen Data Akronim Type Size Keterangan

1 ID Customer customer_id Integer 11 Primary Key

2 First Name firstname varchar 35

3 Last Name lastname varchar 35

4 Email email varchar 35

5 Password password varchar 24

6 Address address varchar 100

7 Province province varchar 35

8 City city varchar 35

9 Phone phone varchar 16

2. Spesifikasi File Product

Nama File : Product

Akronim : product

Fungsi : untuk menyimpan data product



Akses File : Random


Panjang Record : 72

Kunci Filed : product _id

Software : Mysql

37

Tabel III.2.

Spesifikasi File Product


1 ID Product product_id integer 11 Primary Key

2 Product Series product_series varchar 50

3 Product Description product_desc text -

4 Price price integer 11

3. Spesifikasi File Product Detail

Nama File : Product Detail

Akronim : product_detail

Fungsi : untuk menyimpan data product detail



Akses File : Random



Kunci Filed : product_detail_id

Software : Mysql

38

Tabel III.3.

Spesifikasi File Product Detail


1 Product Detail ID product_detail_id Integer 11 Primary Key

2 Product ID product_id Integer 11 Foreign Key

3 Product Name product_name Varchar 100

4 Color color Varchar 50

5 Quantity qty Integer 11

6 Image1 image1 Text -

7 Image2 image2 Text -

4. Spesifikasi File Cart

Nama File : Cart

Akronim : cart

Fungsi : untuk menyimpan data cart

Tipe File : File Transaksi


Akses File : Random


Panjang Record : 66

Kunci Filed : cart_id

Software : Mysql

39

Tabel III.4.

Spesifikasi File Cart


1 Cart ID cart_id Integer 11 Primary Key


3 Product Detail ID product_detail_id Integer 11 Foreign Key

4 Customer ID customer_id Integer 11 Foreign Key


6 Sub Total sub_total Integer 11

5. Spesifikasi File Order

Nama File : Order

Akronim : order

Fungsi : untuk menyimpan data order



Akses File : Random


Panjang Record : 36

Kunci Filed : order_id

Software : Mysql

40

Tabel III.5.

Spesifikasi File Order


1 Order ID order_id Integer 11 Primary Key


3 Total Order total_order Integer 11

4 Order Date order_date Date -

5 Pending pending Bit 1

6 Completed completed Bit 1

7 Cancel cancel Bit 1

6. Spesifikasi File Order Detail

Nama File : Order Detail

Akronim : orders

Fungsi : untuk menyimpan data order detail



Akses File : Random


Panjang Record : 88

Kunci Filed : order_detail_id

Software : Mysql

41

Tabel III.6.

Spesifikasi File Order Detail


1 Order Detail ID order_detail_id Integer 11 Primary Key

2 Order ID order_id Integer 11 Foreign Key


4 Product Detail ID product_detail_id Integer 11 Foreign Key

5 Cart ID cart_id Integer 11 Foreign Key

6 Sub Total sub_total Integer 11

7 Price price Integer 11


7. Spesifikasi File Payment

Nama File : Payment

Akronim : payment

Fungsi : untuk menyimpan data payment



Akses File : Random


Panjang Record : 39

Kunci Filed : payment_id

Software : Mysql

42

Tabel III.7.

Spesifikasi File Payment


1 Payment ID payment_id Integer 11 Primary Key

2 Order ID order_id Integer 11 Foreign Key


4 Image image Text -

5 Admin ID admin_id Integer 5 Foreign Key

6 Verify verify Bit 1

8. Spesifikasi File Admin

Nama File : Admin

Akronim :admin

Fungsi : untuk menyimpan data administrator



Akses File : Random



Kunci Filed : admin_id

Software : Mysql

43

Tabel III.8.

Spesifikasi File Admin


1 Admin ID admin_id Integer 5 Primary Key

2 Email email Varchar 35

3 Password password Varchar 255

4 Name name Varchar 50

5 Phone phone Varchar 16

44

3.2.3 Rancangan Struktur Navigasi

Struktur navigasi website digunakan untuk menggambarkan secara garis halaman-

halaman dari sebuah website. Dengan adanya struktur navigasi, akan terlihat jelas

sususan dari sebuah website. Struktur navigasi yang digunakan penulis untuk

pembuatan website ini adalah struktur navigasi campuran. Struktur navigasi pada

website ini dapat dilihat pada gambar di bawah ini.

A. Struktur Navigasi Halaman Pengunjung

Home

CartProductLogin

RegisterProduct Detail

Checkout

Payment

Gambar III.19.

Struktur Navigasi Halaman Pengunjung

45

B. Struktur Navigasi Halaman Admin

Dashboard

Product

Show Product

Login

Insert Product

Insert Product Detail

Customer

Show Customer

Order

Show Order

Show Order Detail

ShowPayment

Report

ShowReport

Admin

ShowAdmin

InsertAdmin

Logout

Gambar III.20.

Struktur Navigasi Halaman Admin

46

3.3 Implementasi dan Pengujian Unit

Tahap implementasi sistem merupakan tahap penerapan sistem agar dapat

dioperasikan secara optimal sesuai kebutuhan. Tahap ini merupakan penerjemahan

kebutuhan pembangunan aplikasi ke dalam representasi perangkat lunak, sesuai

analisis pada bab sebelumnya. Implementasi antarmuka yang dibuat pada tahap

perancangan, diimplementasikan menjadi bentuk halaman web.

Pengujian unit adalah suatu kegiatan dimana suatu sistem atau komponen dijalankan

dalam kondisi tertentu, yang mana hasilnya diamati atau direkam, atau kemudian

dilakukan evaluasi.

3.3.1 Implementasi

Implementasi sistem informasi penjualan keripik berbasis web yang telah dirancang

akan diterjemahkan ke dalam bahasa pemrograman yang dapat dimengerti oleh

komputer.

A. Implementasi Rancangan Antar Muka

1. Halaman Login Admin

Administrator harus melakukan login terlebih dahulu untuk menggunakan admin-

panel yang tersedia.

47

Gambar III.21. Tampilan Halaman Login Admin

2. Halaman Utama Admin

Setelah admin melakukan login maka akan tampil halaman dashboard dan ada

keterangan nama admin yang melakukan login.

Gambar III.22. Tampilan Halaman Utama Admin

48

3. Halaman Menu Product

Admin dapat mengelola produk-produk yang ditampilkan di halaman pengunjung,

diantaranya dapat menampilkan data produk, melakukan tambah produk, mengubah

data produk dan menghapus data produk.

Gambar III.23. Tampilan Halaman Menu Produk

4. Halaman Menu Insert Product

Menampilkan form Insert Product .

Gambar III.24. Tampilan Halaman Menu Insert Product

49

5. Halaman Menu Insert Product Detail

Menampilkan form Insert Product Detail yang berisi data-data produk yang lebih

lengkap.

Gambar III.25. Tampilan Halaman Menu Insert Product Detail

6. Halaman Menu Customer

Menampilkan para pelanggan yang sudah terdaftar pada website.

Gambar III.26. Tampilan Halaman Menu Customer

50

7. Halaman Utama Home

Halaman awal pada web yang berisi image-slider dari produk-produk terbaru yang

tersedia.

Gambar III.27. Tampilan Halaman Utama Home

8. Halaman Utama Product

Halaman pada web yang berisi produk-produk yang tersedia dengan penjelasan

singkat mengenai harga dan nama produk.

Gambar III.28. Tampilan Halaman Utama Product

9. Halaman Utama Product Detail

51

Halaman pada web yang berisi mengenai satu produk lengkap dengan galeri gambar

dan juga penjelasannya. Terdapat juga tombol untuk membeli.

Gambar III.29. Tampilan Halaman Utama Product Detail

52

10. Halaman Utama Login

Halaman yang berfungsi untuk melakukan akses selanjutnya dengan menggunakan

email/username dan password.

Gambar III.30. Tampilan Halaman Login

11. Halaman Utama Register

Halaman yang berfungsi untuk pendaftaran data diri sebagai syarat dalam melakukan

transaksi pembelian pada web.

Gambar III.31. Tampilan Halaman Utama Register

53

12. Halaman Utama Cart

Halaman yang berfungsi sebagai keranjang belanja pengunjung. Pengunjung bisa

mengumpulkan produk yang ingin dibeli pada halaman ini.

Gambar III.32. Tampilan Halaman Utama Cart

13. Halaman Utama Checkout

Halaman ini berisi data diri dari konsumen dan juga total harga dari transaksi yang

sedang dilakukan.

Gambar III.33. Tampilan Halaman Utama Checkout

54

B. Spesifikasi Sistem Komputer

Pembuatan sebuah website membutuhkan perangkat keras (hardware) dan perangkat

lunak (software) yang memadai untuk menunjang implementasi sebuah website yang

sedang dibuat.

1. Spesifikasi Perangkat Keras

a. Server

1) CPU

a) Processor Pentium Core i3

b) RAM DDR3 4 GB

c) Harddisk 500 GB

2) Mouse

3) Keyboard

4) Monitor dengan resolusi layar minimum 1024x768

5) Koneksi internet dengan kecepatan minimum 2 Mbps

b. Client

1) CPU

a) Processor Pentium Core i3

b) RAM DDR3 2 GB

c) Harddisk 120 GB

2) Mouse

3) Keyboard

4) Monitor dengan resolusi layar minimum 1024x768

5) Koneksi internet dengan kecepatan minimum 1 Mbps

55

2. Spesifikasi Perangkat Lunak

a. Server

1) Sistem Operasi Microsoft Windows Server atau Linux Server

2) Aplikasi bundle web server, seperti Xampp, yang terdiri dari:

a) Apache Server v2

b) PHP Server v5

c) MySQL Server v5

d) PhpMyAdmin v3

3) Aplikasi web browser, seperti Mozilla Firefox, Google Chrome dan

Internet Explorer

b. Client

1) Sistem Operasi Microsoft Windows

2) Aplikasi web browser, seperti Mozilla Firefox, Google Chrome dan

Internet Explorer

3.3.2 Pengujian Unit

Sebelum sistem diterapkan, terlebih dahulu dilakukan tahap pengujian. Hal ini

dilakukan untuk mengidentifikasi sistem jika terjadi kesalahan dan melihat

kekurangan yang ada. Pengujian terhadap program yang dibuat menggunakan

blackbox testing yang berfokus terhadap proses masukkan dan keluaran program.

Cara pengujian ini dilakukan dengan menjalankan dan mengeksekusi tiap modul

kemudian dilakukan pengamatan pada hasil dari proses tersebut.

56

Tabel III.9. Hasil Pengujian Blackbox Testing Login Admin

No. Skenario

Pengujian Tes Case

Hasil Yang

Diharapkan

Hasil

Pengamatan Kesimpulan

1

Username dan

Password tidak

diisi kemudian

klik tombol

masuk

Username:

(kosong)

Password:

(kosong)

Sistem akan menolak

akses dan

menampilkan pesan

gagal

Sesuai Harapan Valid

2

Username diisi

dan Password

dikosongkan

kemudian klik

tombol masuk

Username :

admin

(Benar)

Password :

(kosong)

Sistem akan menolak

akses dan

menampilkan pesan

gagal


3

Username tidak

diisi dan

Password diisi

kemudian klik

tombol masuk

Username:

(kosong)

Password:

(Isi)

Sistem akan menolak

akses dan

menampilkan pesan

gagal


4

Memasukan

username

dengan benar

tetapi

memasukan

password salah,

kemudian klik

masuk

Username :

(Benar)

Password :

(Salah)

Sistem akan menolak

akses dan

menampilkan pesan

“Login gagal!

Username & Password

tidak benar”


5

Memasukan

username salah

tetapi

memasukan

password

dengan benar,

kemudian klik

masuk

Username :

(Salah)

Password :

(Benar)

Sistem akan menolak

akses dan

menampilkan pesan

“Login gagal!

Username & Password

tidak benar”


6

Mengetikkan

Username dan

Password

dengan data

yang benar

kemudian klik

masuk

Username :

(Benar)

Password :

(Benar)

sistem menerima akses

masuk dan kemudian

langsung

menampilkan menu

beranda admin


57

Tabel III.10. Hasil Pengujian Blackbox Testing Login Pelanggan

No. Skenario

Pengujian Tes Case

Hasil Yang

Diharapkan

Hasil


1

Username dan

Password tidak

diisi kemudian

klik tombol

masuk

Username:

(kosong)

Password:

(kosong)

Sistem akan menolak

akses dan

menampilkan pesan

gagal


2

Username diisi

dan Password

dikosongkan

kemudian klik

tombol masuk

Username :

admin

(Benar)

Password :

(kosong)

Sistem akan menolak

akses dan

menampilkan pesan

gagal


3

Username tidak

diisi dan

Password diisi

kemudian klik

tombol masuk

Username:

(kosong)

Password:

(Isi)

Sistem akan menolak

akses dan

menampilkan pesan

gagal


4

Memasukan

username

dengan benar

tetapi

memasukan

password salah,

kemudian klik

masuk

Username :

(Benar)

Password :

(Salah)

Sistem akan menolak

akses dan

menampilkan pesan

“Login gagal!

Username & Password

tidak benar”


5

Memasukan

username salah

tetapi

memasukan

password

dengan benar,

kemudian klik

masuk

Username :

(Salah)

Password :

(Benar)

Sistem akan menolak

akses dan

menampilkan pesan

“Login gagal!

Username & Password

tidak benar”


6

Mengetikkan

Username dan

Password

dengan data

yang benar

kemudian klik

masuk

Username :

(Benar)

Password :

(Benar)

sistem menerima akses

masuk dan kemudian

langsung

menampilkan menu

beranda admin


58

Tabel III.11. Hasil Pengujian Blackbox Testing Daftar Pelanggan

No. Skenario

Pengujian Tes Case

Hasil Yang

Diharapkan

Hasil

Pengamatan

Kesimpu

lan

1

Nama tidak diisi,

password, email,

alamat, provinsi,

kota, telepon

diisi. Kemudian

klik Daftar

Nama:

(kosong)

Email

Password

Alamat

Provinsi

Kota

Telepon

(Diisi)

Sistem akan menolak

akses dan

menampilkan pesan

“Please fill out this

field” pada textfield

Nama


2

Email tidak diisi,

Nama, password,

alamat, provinsi,

kota, telepon

diisi. Kemudian

klik Daftar

Email:

(kosong)

Nama

Password

Alamat

Provinsi

Kota

Telepon

(Diisi)

Sistem akan menolak

akses dan

menampilkan pesan



Email


3

Password tidak

diisi, Nama,

email, alamat,

provinsi, kota,

telepon diisi.

Kemudian klik

Daftar

Password:

(kosong)

Nama

Email

Alamat

Provinsi

Kota

Telepon

(Diisi)

Sistem akan menolak

akses dan

menampilkan pesan



password


4

Alamat tidak

diisi, Nama,

email, password,

provinsi, kota,

telepon diisi.

Kemudian klik

Daftar

Alamat:

(kosong)

Nama

Email

Password

Provinsi

Kota

Telepon

(Diisi)

Sistem akan menolak

akses dan

menampilkan pesan



alamat


5

Provinsi Kota

Telepon tidak

diiisi, Nama,

email, password,

alamat diisi.

Kemudian klik

Daftar

Provinsi

Kota

Telepon:

(kosong)

Nama

Email

Password

Alamat

(Diisi)

Sistem akan menolak

akses dan

menampilkan pesan



Provinsi, Kota,

Telepon


59

6

Semua diisi

lengkap.

Kemudian klik

Daftar

Semua

(Diisi)

sistem memproses

data pelanggan

tersimpan di database

dan menuju ke

halaman utama


Tabel III.12. Hasil Pengujian Blackbox Testing Tambah Produk

No. Skenario

Pengujian Tes Case

Hasil Yang

Diharapkan

Hasil


1

Semua filed

tidak terisi

kemudian klik

simpan

Filed:

(kosong)

Sistem akan menolak

untuk memproses dan

Text field yang kosong

akan berwarna merah

dan muncul peringatan

”Please fill this field”


2

Semua filed

terisi kemudian

klik simpan

Field:

(terisi)

Sistem memproses data

produk dan data

tersimpan di database.

Kemudian muncul

dialog sukses


Tabel III.13. Hasil Pengujian Blackbox Testing Edit Data Produk

No. Skenario

Pengujian Tes Case

Hasil Yang

Diharapkan

Hasil

Pengamata

n

Kesimpulan

1

Admin

melakukan Edit

Produk, salah

satu field tidak

terisi

Satu Field

(kosong)

Sistem akan

menolak proses dan

menampilkan pesan

”Please fill this

field” pada field

yang kosong

Sesuai

Harapan Valid

2

Admin

melakukan Edit

Produk, semua

field terisi

Semua Field

(terisi)

Sistem akan

melakukan proses

dan akan menu

halaman tampil

produk

Sesuai

Harapan Valid

61

BAB IV

PENUTUP

4.1 Kesimpulan

Berdasarkan penjelasan dan implementasi yang telah dilakukan penulis pada

bab-bab sebelumnya, ada beberapa kesimpulan yang dapat diambil yaitu sebagai

berikut:

1. Sistem informasi penjualan jam tangan pria berbasis web ini dirancang

sebagai solusi dalam transaksi penjualan yang mengedepankan pelayanan

yang cepat dan handal tanpa terbatas ruang dan waktu.

2. Sistem informasi penjualan jam tangan pria berbasis web ini bersifat tertutup,

artinya hanya administator yang dapat mengubah, menyimpan dan

menghapus data-data pada website ini.

3. Sistem informasi penjualan jam tangan pria berbasis web ini dirancang

sebagai sarana pembelajaran perancangan website yang efektif.

62

4.2 Saran

Saran yang penulis kemukakan dalam pembuatan sistem informasi penjualan

jam tangan pria berbasis web sebagai berikut:

1. Pihak pengembang sistem informasi dapat melakukan pengembangan website

secara berkala supaya tampilan website menjadi dinamis, baik itu desain

maupun struktur program didalamnya.

2. Dengan adanya pembaruan yang berkelanjutan diharapkan pengelola sistem

dapat melakukan pencadangan data (Back Up Data) guna menghindari

kehilangan data sehingga data yang sudah tersimpan menjadi lebih aman.

3. Administrator website harus mendapatkan pelatihan terlebih dahulu agar

mampu beradaptasi dengan program yang ada di dalam website, sehingga

terhindar dari human error.

4. Pengembang dan juga administrator harus lebih memikirkan keamanan pada

sistem dan website ini, mengingat akan jadi berbahaya jika website ini diretas

oleh pihak-pihak yang tidak bertanggung jawab.

5. Hendaknya dalam perancangan dan implementasi Sistem Informasi Penjualan

Jam Tangan berbasis website ini memperhatikan ketelitian baik dalam hal

pengkodean maupun perancangan tampilan website mengingat informasi yang

terdapat didalam website tersebut bersifat sensitif bagi beberapa pihak.

63

DAFTAR PUSTAKA

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

Berorientasi Objek. Informatika. Bandung.

Arief, M. Rudyanto. 2011. Pemrograman Web Dinamis Menggunakan PHP dan

MySQL. Yogyakarta: Andi Offset.

Binanto, Iwan. 2010. Multimedia Digital Dasar Teori dan Pengembanganya.

Yoyakarta: Andi Publisher.

Budilaksono, Sularso. 2009. Mahir Basis Data Dengan MySQL. Jakarta: Mitra

Wacana Media.

Fathansyah. 2007. Basis Data. Bandung: Informatika.

Ladjamudin, Bin Al-Bahra. 2006. Rekayasa Perangkat Lunak. Palembang: Maxikom.

Rizky, Soetam. 2011. Konsep Dasar Rekayasa Perangkat Lunak. Jakarta: PT. Prestasi

Pustakaraya.

Saputra, Agus. 2012. Web Tips PHP, HTML5 dan CSS3. Jakarta: Jaskom.

Sarwono, Jonathan, dan K. Prihartono, A.H. 2012. Perdagangan Online: Cara Bisnis

di Internet. Jakarta: Flex Media Komputindo.

Setiawan, Foni Agus. 2012. Pemrograman Internet. Yogyakarta: Graha Ilmu.

Suyanto, Asep Herman. 2008. Step by Step Web Design Theory and Practice Edisi II.

Yogyakarta: Andi Publisher.

Yakub. 2012. Pengantar Sistem Informasi. Yogyakarta: Graha Ilmu.

64

Documents

TUGAS AKHIR - repository.bsi.ac.id · TUGAS AKHIR Diajukan untuk memenuhi salah satu syarat kelulusan Diploma Tiga (D.III) LINGGIH LUKIS TRESNA NIM : 12136448 ... Akademi Manajemen