perancangan sistem informasi penjualan ......ix abstrak muhammad ikbal (12146779), ”perancangan...

110
PERANCANGAN SISTEM INFORMASI PENJUALAN KOMPUTER DAN AKSESORIS PADA REKA GADGETS STORE JAKARTA TUGAS AKHIR Diajukan untuk memenuhi salah satu syarat kelulusan Program Diploma III MUHAMMAD IKBAL NIM: 12146779 Program Studi Manajemen Informatika AMIK BSI Jakarta 2017

Upload: others

Post on 25-Nov-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

PERANCANGAN SISTEM INFORMASI PENJUALAN

KOMPUTER DAN AKSESORIS PADA

REKA GADGETS STORE

JAKARTA

TUGAS AKHIR Diajukan untuk memenuhi salah satu syarat kelulusan Program Diploma III

MUHAMMAD IKBAL

NIM: 12146779

Program Studi Manajemen Informatika

AMIK BSI

Jakarta

2017

Page 2: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 3: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 4: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 5: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 6: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 7: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 8: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam
Page 9: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

ix

ABSTRAK

Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan

Komputer dan Aksesoris Pada Reka Gadgets Store”

Dalam era globalisasi sekarang ini, teknologi informasi melaju dengan cepatnya.

Adapun komputer yang merupakan peralatan yang diciptakan untuk mempermudah

pekerjaan manusia, saat mencapai kemajuan baik di dalam pembuatan hardware

maupun software. Reka Gadgets Store membutukan sekali adanya suatu sistem

informasi yang menunjang dan memberikan pelayanan yang memuaskan bagi para

customer. Untuk itulah penulis mencoba membuat Tugas Akhir mengenai sistem

penjualan barang di Reka Gadgets Storeyang sampai saat ini belum terkomputerisasi.

Pada saat ini Reka Gadgets Store hanya berupa perusahaan yang bergerak dalam

bidang penjualan computer dan aksesoris. Sistem yang ada pada Reka Gadgets Store

ini masih dilakukan secara manual, mulai dari pencatatan customer yang membeli

barang, sampai penyimpanan data-data lainnya yang berhubungan dengan proses

penjualan hingga sampai pembuatan laporan, sehingga memungkinkan pada saat

proses berlangsung terjadi kesalahan dalam pencatatan, kurang akuratnya laporan

yang dibuat dan keterlambatan dalam pencarian data-data yang diperlukan. Dalam

merancang sistem ini digunakan metode penelitian pengembangan perangkat lunak

waterfall serta metode pengumpulan data observasi, wawancara dan studi pustaka.

Perancangan sistem informasi ini merupakan solusi yang terbaik untuk memecahkan

permasalahan- permasalahan yang ada pada perusahaan ini, serta dengan sistem yang

terkomputerisasi dapat tercapai suatu kegiatan yang efektif dan efisien dalam

menunjang aktifitas pada perusahaan ini. Sistem yang terkomputerisasi lebih baik

dari sistem yang manual agar berjalan lebih efektif dan efisien serta sistem

penjualan yang sekarang lebih kondusif dibandingkan dengan sistem yang terdahulu.

Kata Kunci: Perancangan Sistem Informasi, Sistem Penjualan Komputer.

Page 10: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

x

ABSTRACT

Muhammad Ikbal (12146779), The Aplication of Selling Information System of

Trading Product in Reka Gadgets Store Jakarta.

Right now in this era of globalization, the information technology accelerates so fast.

Meanwhile with the presence of computer which is one of many sophisticated

instruments made by people is really helpful and to ease people’s work due to the

emerging of both the hardware and software. Reka Gadgets Store fully needs an

information system which supports and gives contented services to all customers.

That is why the writer tries to make her Final Assignment concerning with the

goods selling system in Reka Gadgets Store which is up to now the company has

not applied the computerized system yet. At this moment, Reka Gadgets Store is a

company which is operating in Computer and Accesoris sales fields. The system

which is being applied now in this company still done manually, starting from the

registration of customers who buy goods, the handling of other records or data

related to the selling process until the phase of making the reports, one of those

phases might trigger some mistakes in doing the registration, less of accurateness

from the reports made by and the lateness in finding required data or

documents. In the preparation of this system used research methods development of

waterfall software along methods of data observation, interviews and literature

study. The computerized system is not only the best solution to solve some problems

appeared in this company, but also with this computerized system the company would

attain enermous advantages since they are capable of doing those activities

effectively and efficiently. The use of computerized system is so much better than the

manual one because it can make the system runs smoothly, effectively and efficiently

and indeed, the current selling system is more conducive than the prior system.

Keywords: Design Information System, Trading Computer.

Page 11: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

xi

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

Abstrak .................................................................................................................. ix

Daftar Isi ................................................................................................................ xi

Daftar Simbol ........................................................................................................

xiii

Daftar Gambar .......................................................................................................

xiv

Daftar Tabel ...........................................................................................................

xvi

BAB I PENDAHULUAN

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

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

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

1.4. Ruang Lingkup ............................................................................. 4

1.5.Sistematika Penulisan .................................................................... 5

BAB II LANDASAN TEORI

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

2.2. Teori Pendukung ........................................................................... 12

BAB III PEMBAHASAN 3.1. Tinjauan Perusahaan ................................................................... 20

3.1.1. Sejarah Institusi ................................................................ 20

3.1.2. Struktur Organisasi .......................................................... 20

3.2. Analisa Kebutuhan ..................................................................... 23

3.3. Perancangan Perangkat Lunak .................................................... 25

3.3.1.Rancangan AntarMuka ...................................................... 25

3.3.2.Rancangan Basis Data ........................................................ 54

3.3.3.Rancangan Struktur Navigasi ............................................. 61

3.4. Implementasi dan Pengujian Unit ............................................... 62

3.3.1.Implementasi ..................................................................... 62

3.3.2.Pengujian Unit ................................................................... 80

Page 12: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

xii

BAB IV PENUTUP 4.1. Kesimpulan ................................................................................ 90

4.2. Saran ......................................................................................... 90

DAFTAR PUSTAKA ......................................................................................... 92

DAFTAR RIWAYAT HIDUP ............................................................................ 93

SURAT KETERANGAN RISET/PKL .............................................................. 94

Page 13: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

xiii

DAFTAR SIMBOL

Entitas / Entity

Entitas adalah suatu objek yang dapat

diidentifikasi dalam lingkungan pemakai

Relasi

Relasi Menunjukkan adanya hubungan di

antara sejumlah entitas yang berbeda

Atribut

Atribut berfungsi mendeskripsikan

karakter entitas (atribut yang berfungsi

sebagai key diberi garis bawah)

Garis

Garis sebagai penghubung antara relasi

dengan entitas atau dengan atribut

Page 14: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

xiv

DAFTAR GAMBAR Halaman

Gambar II. 1 Model Waterfall ..................................................................... 10

Gambar II. 2 Navigasi Linier ....................................................................... 13

Gambar II. 3 Navigasi Hirearki ................................................................... 13

Gambar II. 4 Navigasi Non Linier ............................................................... 14

Gambar II. 5 Navigasi Campuran ................................................................ 15

Gambar III.1 Struktur Organisasi ................................................................. 21

Gambar III.2 Rancangan Halaman Login Admin ......................................... 26

Gambar III.3 Rancangan Halaman Dashboard Admin ................................. 27

Gambar III.4 Rancangan Menu Cara Pembelian Admin .............................. 28

Gambar III.5 Rancangan Menu Ganti Password Admin ............................... 30

Gambar III.6 Rancangan Menu Data Produk ............................................... 31

Gambar III.7 Rancangan Menu Data Subproduk ......................................... 33

Gambar III.8 Rancangan Menu Data Kategori ............................................. 34

Gambar III.9 Rancangan Menu Data Ongkos Kirim .................................... 36

Gambar III.10 Rancangan Menu Data Komentar ........................................... 37

Gambar III.11 Rancangan Menu Data Order Masuk ...................................... 39

Gambar III.12 Rancangan Halaman File Konfirmasi Admin .......................... 40

Gambar III.13 Rancangan Halaman Home Website ....................................... 41

Gambar III.14 Rancangan Halaman Kategori Produk ..................................... 42

Gambar III.15 Rancangan Halaman Cara Pembelian ..................................... 43

Gambar III.16 Rancangan Rancangan Halaman Produk ................................. 45

Gambar III.17 Rancangan Halaman Pendaftaran ........................................... 46

Gambar III.18 Rancangan Halaman Contact .................................................. 47

Gambar III.19 Rancangan Halaman Keranjang Belanja ................................. 49

Gambar III.20 Rancangan Checkout .............................................................. 50

Gambar III.21 Rancangan Status Order ........................................................ 52

Gambar III.22 Rancangan Halaman Konfirmasi User .................................... 53

Gambar III.23 Entity Relationship Diagram (ERD) ....................................... 54

Gambar III.24 Logical Relational Structure (LRS) ......................................... 55

Gambar III.25 Rancangan Struktur Navigasi Untuk Admin ........................... 61

Gambar III.26 Rancangan Struktur Navigasi Untuk Pengunjung.................... 61

Gambar III.27 Rancangan Struktur Navigasi Untuk User ............................... 62

Gambar III.28 Tampilan Halaman Login Admin ............................................ 63

Gambar III.29 Tampilan Halaman Panel Admin ............................................ 64

Gambar III.30 Tampilan Menu Cara Pembelian Admin ................................. 65

Gambar III.31 Tampilan Menu Ganti Password Admin ................................. 65

Gambar III.32 Tampilan Menu Data Produk .................................................. 66

Gambar III.33 Tampilan Menu Data Subproduk ............................................ 67

Gambar III.34 Tampilan Menu Data Kategori ................................................ 67

Gambar III.35 Tampilan Menu Data Ongkos Kirim ....................................... 68

Gambar III.36 Tampilan Menu Data Komentar .............................................. 69

Page 15: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

xv

Gambar III.37 Tampilan Menu Data Order Masuk ......................................... 69

Gambar III.38 Tampilan Halaman File Konfirmasi Admin ............................ 70

Gambar III.39 Tampilan Halaman Home Website.......................................... 71

Gambar III.40 Tampilan Halaman Kategori Produk ....................................... 72

Gambar III.41 Tampilan Halaman Cara Pembelian ........................................ 73

Gambar III.42 Tampilan Halaman Produk ..................................................... 74

Gambar III.43 Tampilan Halaman Form Pendaftaran ..................................... 75

Gambar III.44 Tampilan Halaman Contact ..................................................... 76

Gambar III.45 Tampilan Halaman Keranjang Belanja .................................... 77

Gambar III.46 Tampilan Halaman Detail Checkout ....................................... 78

Gambar III.47 Tampilan Halaman Status Order User ..................................... 79

Gambar III.48 Tampilan Halaman File Konfirmasi ........................................ 80

Page 16: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

xvi

DAFTAR TABEL

Halaman

Tabel III.1 Spesifikasi Tabel Admin ............................................................... 56

Tabel III.2 Spesifikasi Tabel Kategori ............................................................ 57

Tabel III.3 Spesifikasi Tabel Customer .......................................................... 57

Tabel III.4 Spesifikasi Tabel Produk .............................................................. 58

Tabel III.5 Spesifikasi Tabel Order ................................................................ 59

Tabel III.6 Spesifikasi Tabel Detail Order ...................................................... 60

Tabel III.7 Hasil Pengujian Black Box Testing Halaman Login User............... 80

Tabel III.8 Hasil Pengujian Black Box Testing Halaman Login Admin ........... 82

Tabel III.9 Hasil Pengujian Black Box Testing Halaman Daftar Member ........ 83

Tabel III.10 Hasil Pengujian Black Box Testing Halaman Data Produk ........... 84

Tabel III.11 Hasil Pengujian Black Box Testing Halaman Data Kategori ........ 85

Tabel III.12 Hasil Pengujian Black Box Testing Pembelian Produk ................ 86

Tabel III.13 Hasil Pengujian Black Box Testing Status Order ......................... 87

Page 17: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

1

BAB I

PENDAHULUAN

1.1 Latar Belakang

Reka Gadgets Store merupakan salah satu perusahaan yang bergerak di bidang

penjualan produk komputer dan aksesoris gadget yang menjual spare part komputer

seperti RAM, Mainboard, VGA dan lain sebagainya yang terletak di Jl. Mangga No.21

Perumahan Harapan Baru Bekasi Barat. Sebagaimana dengan perusahaan pada

umumnya, Reka Gadgets Store memiliki proses perkembangan dalam merintis

usahanya yang pada awalnya mempromosikan produk komputer dan aksesoris gadget

terbarunya hanya melalui poster yang dipasang tepat di depan halaman tokonya. Pada

Reka Gadgets Store juga customer masih harus datang ke lokasi langsung untuk

mengetahui informasi produk serta mengantri untuk melakukan pembelian.

Pada tugas akhir ini penulis bertujuan untuk memperbaiki sistem pemasaran dan

penjualan yang ada pada Reka Gadgets Store dengan menggunakan media internet

lewat konsep penjualan online. Artinya, masyarakat tidak perlu untuk mendatangi

lokasi penjualan dan bisa bertransaksi secara online. Selain itu, produk terbaru dari

Reka Gadgets Store dapat diketahui tidak hanya oleh penduduk yang tinggal di

sekitar lokasi penjualan tapi juga masyarakat luas.

Manfaat dari pembuatan situs penjualan online ini diharapkan mampu

memecahkan permasalahan yang dialami oleh Reka Gadgets Store dan konsumen

seperti konsumen dapat mengefektifkan waktu, tempat, sarana, dan tanpa harus

bertatapan langsung dengan penjual ataupun sebaliknya. Konsumen atau pelanggan

Page 18: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

2

dilihat dari segi waktu, dapat memesan barang pada saat kapanpun mereka inginkan,

dari penjual sendiri dapat melihat jumlah pemesanan barang pada saat itu juga tanpa

harus selalu menunggu pembeli datang ke toko. Dari segi tempat dilihat, pembeli atau

konsumen yang berada cukup jauh dari toko tidak harus datang langsung, dapat

memesan dan barang akan diantar melalui jasa pengiriman dengan ketentuan yang

ditetapkan.

Kendala yang dialami oleh para penjual dan pembeli seperti waktu, jarak, tempat

seperti itu yang ingin penulis coba atasi dengan membuat Tugas Akhir dengan judul

“Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka

Gadgets Store”

1.2 Maksud dan Tujuan

Maksud dari penulisan tugas akhir ini adalah sebagai berikut:

1. Mencoba menuangkan dan mempraktekan ilmu yang telah didapat selama

dalam menjalani proses perkuliahan baik secara teoritis maupun praktikum.

2. Merancang sebuah sistem informasi penjualan komputer dan aksesoris yang

menyediakan fasilitas bagi pihak Reka Gadgets Store dan Konsumen untuk

melakukan transaksi yang lebih efektif dan efisisen.

Sedangkan tujuan dari penulisan Tugas Akhir ini adalah sebagai salah satu syarat

untuk kelulusan Diploma Tiga (DIII) Program studi Manajemen Informatika pada

Akademi Manajemen Informatika dan Komputer Bina Sarana Informatika (AMIK

BSI).

Page 19: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

3

1.3 Metode Penelitian

Untuk mendapatkan data-data yang dapat menunjang penyusunan Tugas Akhir,

Penulis menggunakan metode pengumpulan data untuk penyusunan laporan Tugas

Akhir yaitu :

A. Metode Pengembangan Perangkat Lunak

Metode yang digunakan pada pengembangan perangkat lunak ini menggunakan

model water fall yang terbagi menjadi tiga tahapan, yaitu:

1. Analisis Kebutuhan

Tahapan ini menekankan pada masalah pengumpulan kebutuhan data

pengguna. Kebutuhan Admin: laporan penjualan, data pendaftaran user.

Kebutuhan User: data produk, data ongkos kirim.

2. Perancangan Sistem dan Perangkat Lunak

Proses perancangan sistem menggunakan perangkat lunak pendukung. PHP

untuk bahasa pemograman, Bracket 1.8 untuk editor, MySQL untuk database

dan XAMPP untuk web servernya. Sedangkan dalam perancagan dan

penggambaran entitas dan struktur database mengunakan rancangan ERD dan

LRS.

3. Implementasi Dan Pengujian Unik

Pada tahap ini, perancangan perangkat lunak direalisasikan sebagai web e-

commerce penjualan komputer dan aksesorisnya. Serta pengujian unitnya

menggunakan blackbox testing.

Page 20: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

4

B. Pengumpulan Data

1. Observasi

Pengumpulan data yang dilakukan dengan sengaja dan secara sistematis.

Penulis terjun langsung ke Reka Gadgets Store mengamati sistem dan cara

kerja karyawan, kemudian dilakukan pencatatan guna mendapatkan data

yang dibutuhkan oleh penulis dalam menyusun tugas akhir ini.

2. Wawancara

Penulis melakukan terhadap kepala cabang, dan para karyawan (khususnya

yang dibagian marketing dan IT) Reka Gadgets Store.

3. Studi Pustaka

Penulis mempelajari sumber-sumber data yang ada dan sesuai dengan

bahan dan objek penelitian dan dari catatan-catatan selama penulis

mengikuti perkuliahan. Penulis mengutip sumber-sumber data yang sudah

tertulis dan jelas sumber datanya guna melengkapi tugas akhir.

1.4 Ruang Lingkup

Tulisan ini membahas tentang pembuatan situs penjualan online Reka

Gadgets Store. Situs ini dibuat menggunakan PHP dan MySQL sebagai

databasenya. Dalam situs penjualan Reka Gadgets Store ini terdapat halaman

penjualan produk komputer yang pada segmen pertama user atau member harus

melakukan registrasi member pada menu daftar apabila ingin melakukan

pemesanan produk pada situs, dan selanjutnya member dapat melakukan lihat

Page 21: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

5

produk komputer pada halaman produk di situs, lalu setelah melakukan pemesanan

komputer maka member diharuskan untuk melakukan proses checkout agar

administrator dari website segera melakukan pengecekan proses pemesanan dari

member di halaman Administrator.

1.5 Sistematika Penulisan

Untuk memberi gambaran secara keseluruhan dari penulisan Tugas

Akhir ini, maka penulis membagi sistematika penulisan kedalam empat bab,

dimana satu dengan lainnya saling berhubungan. Adapun sistematika dari

penulisan ini adalah sebagai berikut:

BAB I : PENDAHULUAN

Bab ini membahas tentang latar belakang masalah , maksud

dan tujuan, metode penelitian, ruang lingkup dan sistematika

penulisan yang dipakai pada penulisan tugas akhir ini.

BAB II : LANDASAN TEORI

Bab ini membahas tentang teori-teori yang digunakan penulis

sebagai dasar untuk menyusun tugas akhir ini.

BAB III : PEMBAHASAN

Bab ini membahas tentang implementasi penjualan pada Reka

Gadgest Store dan spesifikasi software yang dipakai, serta

Page 22: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

6

analisa hasil aplikasi toko online yang dibagi menjadi 3

interface, yaitu antar muka admin, user dan pengunjung.

BAB IV : PENUTUP

Bab ini membahas tentang kesimpulan dan saran yang penulis

ambil dari penulisan tugas akhir ini.

Page 23: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

7

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Dalam merancang sebuah website, pertama-tama kita harus mengetahui apa

konsep dasarnya agar ide dan gagasan yang kita inginkan dapat termuat di halaman

web yang akan kita buat. Selain itu juga diperlukan suatu teori pendukung yang

berhubungan dengan perancangan dan pembuatan sebuah website. Adapun konsep

dasar yang penulis gunakan adalah sebagai berikut:

A. Website

Yuhefizar (2013:2) mengatakan “Secara definisi, website adalah kumpulan

halaman yang mengandung informasi”. Sebuah website dipanggil melalui nama

domain-nya dan halaman pertama dari sebuah website disebut dengan homepage.

Website mempunyai keunggulan yakni dapat diakses oleh siapa saja, di mana

saja, kapan saja tanpa terkendala oleh waktu, tempat dan jarak dan semua itu bisa

diakses dengan bantuan teknologi internet melalui perangkat web yakni browser,

server dan lain sebagainya.

B. Bahasa Pemrograman

1. PHP

Menurut Pratama (2015:5) ”PHP merupakan Bahasa pemrograman web yang

digunakan untuk men-generate atau menghasilkan kode HTML.”

Untuk membuat website yang dinamis dibutuhkan kemampuan bahasa

pemrograman yang sifatnya mudah diintegrasi ke dalam database, dan PHP

memiliki kemampuan tersebut. PHP sudah tidak diragukan lagi memiliki

Page 24: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

8

kemampuannya tergabung dengan berbagai macam jenis database, mulai dari

dbase, ODBC, MySQL, sampai ke Oracle. PHP mempunyai fungsi sendiri

untuk mengakses semua jenis database tersebut. Database yang banyak

digunakan dengan PHP yaitu MySQL. PHP dan MySQL ialah satu kesatuan

yang apabila digabungkan dapat menciptakan sebuah aplikasi website yang

sangat tangguh.

2. HTML

Menurut Saputra (2012:1) “HTML bisa disebut bahasa yang digunakan

untuk menampilkan dan mengelola hyper text”. HTML mempunyai kepanjangan

Hyper Text Markup Language, yaitu suatu bahasa pemrograman hyper text.

HTML ini memiliki fungsi untuk membangun kerangka ataupun format web

berbasis HTML.

3. CSS

Menurut Masrur (2016:24) “ CSS (Cascading Style Sheet) merupakan sebuah

standar penggunaan dan pembuatan style pada suatu dokumen halaman web”.

CSS direkomendasikan oleh W3C pada tahun 1996 sebagai akibat munculnya

berbagai presentation HTML tags (tag-tag HTML yang berfungsi mengatur

tampilan informasi dalam webpage) yang ‘mencemari’ HTML sebagai bahasa

struktur.

C. Basis Data

Anhar (2010:45) mengatakan bahwa “Database adalah sekumpulan tabel-tabel

yang berisi data dan merupakan kumpulan dari field atau kolom”.

Page 25: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

9

Basis data digunakan sebagai suatu tempat untuk menampung beberapa objek

tabel, query, form, Report, dan lainnya. Beberapa aturan untuk merancang basis data

yang baik antara lain:

1. Tabel dalam database tidak boleh mengandung record (data) ganda, atau

dengan kata lain tidak boleh ada redudancy data.

2. Setiap tabel dalam database harus memiliki field (kolom) yang unik. Field ini

disebut sebagai Primary Key.

3. Tabel harus sudah normal.

4. Besar atau ukuran database hendaknya dibuat seminimal mungkin. Hal ini

ditentukan oleh pemilihan tipe data yang tepat.

5. Merancang database hendaknya memperhatikan apakah rancangan dapat

menampung data (record) sesuai yang dibutuhkan aplikasi.

Salah satu dari bentuk basis data yang banyak digunakan saat ini adalah SQL

(Structured Query Language) atau dalam hal ini yang penulis gunakan adalah

MySQL.

Menurut Prayudi dkk (2012:24) “SQL (Structured Query Language) adalah

sebuah bahasa yang dapat digunakan untuk mengakses data dalam basis data

relasional”. SQL merupakan suatu bahasa permintaan yang telah terstruktur.

Dikatakan terstruktur karena pada penggunaannya SQL memiliki beberapa aturan

yang yang telah distandarkan oleh asosiasi yang bernama ANSI. Saat ini hampir

semua semua server basis data yang ada telah mendukung bahasa ini untuk

melakukan manajemen datanya.

Page 26: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

10

Menurut Nugroho (2013:1) “MySQL adalah Relational Database Management

System (RDBMS), yaitu database relasi yang memiliki perintah standar adalah SQL

(Structured Query Language)”. MySQL termasuk Database Server karena

mendukung perintah SQL secara penuh dan dapat diakses dalam jaringan (bisa

sebagai Server dan Client).

D. Model Pengembangan Perangkat Lunak

Model yang digunakan pada pengembangan perangkat lunak ini

menggunakan model waterfall. Model SDLC air terjun (waterfall) sering juga disebut

model linear (sequential linear) atau alur hidup klasik (classic life cycle). Model air

terjun menyediakan pendekatan alur hidup perangkat lunak secara sekuensial atau

terurut dimulai dari analisis, perancangan dan pengujian. Rosa dan Shalahuddin

(2016:28)

Ilustrasi Model Waterfall dapat dilihat di Gambar II.1.

Sumber : Rosa dan Shalahuddin (2016:29)

Gambar II.1. Model Waterfall

Model waterfall Rosa dan Shalahuddin (2016:29) pada gambar diatas setiap

langkahnya akan dirinci sebagai berikut :

Analisis Perancanga

n

Pengujian

Page 27: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

11

1. Analisa kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk mespesifikasikan

kebutuhan perangkat lunak agar dapat dipahami perangkat lunak seperti apa yang

dibutuhkan oleh user. Spesifikasi kebutuhan perangkat lunak pada tahap ini perlu

didokumentasikan.

2. Perancangan Sistem Perangkat Lunak

Perancangan sistem perangkat lunak adalah proses multi langkah yang fokus pada

Design pembuatan program perangkat lunak termasuk struktur data, arsitektur

perangkat lunak, representasi antar muka, dan prosedur pengodean.

3. Implementasi dan Pengujian Unit

Pengujian fokus pada perangkat lunak secara dari segi logic dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk meminimalisir

kesalahan (error) dan memastikan keluaran yang dihasilkan sesuai dengan yang

diinginkan.

Dari kenyataan yang terjadi sangat jarang model air terjun dapat dilakukan

sesuai alurnya karena sebagai berikut :

a. Perubahan spesifikasi perangkat lunak terjadi ditengah alur pengembangan.

b. Sangat sulit bagi pelanggan untuk mendefinisikan semua spesifikasi diawal alur

pengembangan. Pelanggan sering kali contoh (prototype) untuk menjabarkan

spesifikasi kebutuhan sistem lebih lanjut.

c. Pelanggan tidak mungkin bersabar mengakomodasi perubahan yang diperlukan di

akhir alur pengembangan.

Page 28: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

12

Dengan berbagai kelemahan yang dimiliki model air terjun tapi model ini

telah menjadi dasar dari model-model yang lain dalam melakukan perbaikan model

pengembangan perangkat lunak.

Model air terjun sangat cocok digunakan kebutuhan pelanggan sudah sangat

dipahami dan kemungkinan terjadinya perubahan kebutuhan selama pengembangan

perangkat lunak kecil. Hal positif dari model air terjun adalah struktur tahap

pengembangan sistem jelas, dokumentasi dihasilkan di setiap tahap pengembangan,

dan sebuah tahap dijalankan setelah tahap sesbelumnya selesai dijalankan (tidak ada

tumpang tindih pelaksanaan tahap).

2.2. Teori Pendukung

A. Struktur Navigasi

Kehadiran struktur navigasi pada sebuah website sangat berguna. Karena

dengan adanya struktur navigasi maka akan dapat mempermudah dalam mengakses

halaman-halaman yang tersedia pada sebuah website.

Binanto (2010:268) mengatakan “Struktur navigasi adalah gabungan dari struktur

refrensi informasi situs web dan mekanisme link yang mendukung pengunjung untuk

melakukan penjelajahan situs”. Ada empat macam bentuk dasar struktur navigasi

yaitu:

1. Struktur Navigasi Linier

Struktur navigasi linier hanya mempunyai satu rangkaian cerita yang berurut yang

menampilkan satu demi satu tampilan layar secara berurut menurut urutannya.

Tampilan yang dapat ditampilkan pada struktur jenis ini adalah satu halaman

Page 29: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

13

sebelumnya atau satu halaman sesudahnya, tidak dapat dua halaman sebelumnya atau

dua halaman sesudahnya, pengguna akan melakukan navigasi secara berurutan,

dalam frame atau byte informasi satu ke yang lainnya.

Ilustrasi struktur navigasi linier dapat dilihat di Gambar II.2.

Sumber : Binanto (2010:269)

Gambar II.2. Navigasi Linier

2. Struktur Navigasi Hierarki

Struktur dasar ini disebut juga struktur linier dengan percabangan karena pengguna

melakukan navigasi disepanjang cabang pohon struktur yang terbentuk logika isi.

Ilustrasi struktur navigasi hirarki dapat dilihat di Gambar II.3.

Sumber : Binanto (2010:269)

Gambar II.3. Navigasi Hierarki

3. Struktur Navigasi Tidak Berurut (Non-Linier)

Struktur navigasi non-linier merupakan pengembangan dari struktur navigasi linier.

Pada struktur ini diperkenankan membuat navigasi bercabang. Percabangan yang

dibuat pada struktur non-linier ini berbeda dengan percabangan pada struktur hirarki,

karena pada percabangan non-linear ini walaupun terdapat percabangan tetap tiap-

Page 30: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

14

tiap tampilan mempunyai kedudukan yang sama yaitu tidak ada Master Page dan

Slave Page, pengguna akan melakukan navigasi dengan bebas melalui isi proyek

dengan tidak terikat dengan jalur yang sudah ditentukan sebelumnya.

Ilustrasi struktur navigasi non-linier dapat dilihat di Gambar II.4.

Sumber : Binanto (2010:270)

Gambar II.4. Navigasi non-linier

4. Struktur Navigasi Campuran (Composite)

Struktur navigasi pengguna akan melakukan navigasi dengan bebas (secara non-

linier), tetapi terkadang dibatasi presentasi linier film atau informasi penting dan pada

data yang paling terorganisasi secara logis pada suatu hirarki. Ilustrasi struktur

navigasi campuran dapat dilihat di Gambar II.5.

Page 31: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

15

Sumber : Binanto (2010:270)

Gambar II.5. Navigasi Campuran

B. ERD (Enterprise Relationship Diagram)

1. Pengertian ERD

Pengertian Entity Relationship Diagram (ERD) secara umum adalah suatu model

untuk menjelaskan mengenai hubungan antar data dalam basis data berdasarkan

objek-objek dasar data yang memiliki hubungan antar relasi. Entity Relationship

Diagram oyi untuk memodelkan struktur data serta hubungan antar data, untuk dapat

menggambarkannya digunakan beberapa notasi serta simbol.

Menurut Sutanta (2011:91) “Entity Relationship Diagram (ERD) merupakan

suatu model data yang dikembangkan berdasarkan objek.” Entity Relationship

Diagram (ERD) digunakan untuk menjelaskan hubungan antar data dalam basis data

kepada pengguna secara logis. Entity Relationship Diagram (ERD) didasarkan pada

suatu persepsi bahwa real world terdiri atas obyek-obyek dasar tersebut.

2. Komponen ERD

Komponen Entity Relationship Diagram adalah sebagai berikut :

Page 32: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

16

a. Entitas

Entitas merupakan suatu objek yang dapat dibedakan dari lainnya yang dapat

diwujudkan dalam basis data. Objek dasar dapat berupa orang, benda, atau hal yang

keterangannya perlu disimpan didalam basis data. Untuk menggambarkan sebuah

entitas digunakan aturan sebagai berikut :

1) Entitas dinyatakan dengan simbol persegi panjang.

2) Nama entitas dituliskan didalam simbol persegi panjang.

3) Nama entitas berupa kata benda, tunggal.

4) Nama entitas sedapat mungkin menggunakan nama yang mudah

dipahami dan dapat menyatakan maknanya dengan jelas.

b. Atribut

Atribut merupakan keterangan-keterangan yang terkait pada sebuah entitas yang

perlu disimpan dalam basis data. Atribut berfungsi sebagai penjelas pada sebuah

entitas. Untuk menggambarkan atribut digunakan aturan sebagai berikut:

1) Atribut digambarkan dengan simbol ellips.

2) Nama atribut dituliskan didalam simbol ellips.

3) Nama atribut merupakan kata benda, tunggal.

4) Nama atribut sedapat mungkin menggunakan nama yang mudah dipahami

dan dapat menyatakan maknanya dengan jelas.

c. Relasi

Relasi merupakan hubungan antara sejumlah entitas yang berasal dari himpunan

entitas yang berbeda. Aturan penggambaran relasi adalah sebagai berikut :

1) Relasi dinyatakan dengan simbol belah ketupat.

Page 33: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

17

2) Nama relasi dituliskan didalam simbol belah ketupat

3) Nama relasi berupa kata kerja aktif.

4) Nama relasi sedapat mungkin menggunakan nama yang mudah

dipahami dan dapat menyatakan maknanya dengan jelas

3. LRS

Menurut Hasugian dan Shidiq (2012:608) memberikan batasan bahwa LRS

adalah “Sebuah model sistem yang digambarkan dengan sebuah ERD akan mengikuti

pola / aturan pemodelan tertentu dalam kaitannya dengan konversi ke LRS”.

LRS (Logical Record Structure) adalah representasi dari struktur record-record

pada tabel-tabel yang terbentuk dari hasil antar himpunan entitas. Logical record

structure dibentuk dengan nomor dari tipe record. Logical record structure terdiri

dari link-link diantara tipe record. Link ini menunjukan arah dari satu tipe record

lainnya. Banyak link dari LRS yang diberi tanda field-field yang kelihatan pada kedua

link tipe record.

Penggambaran LRS mulai dengan menggunakan model yang dimengerti. Dua

metode yang dapat digunakan, dimulai dengan hubungan kedua model yang dapat

dikonversikan ke LRS. Metode yang lain dimulai dengan ERD dan langsung

dikonversikan ke LRS.

a. One to One (1-1)

Tingkat hubungan ini menunjukkan hubungan satu ke satu, dinyatakan dengan satu

kejadian pada entitas pertama, dan hanya mempunyai satu hubungan dengan satu

kejadian pada entitas yang kedua dan sebaliknya.

b. One to Many (1-M)

Page 34: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

18

Tingkat hubungan satu ke banyak adalah sama dengan banyak ke satu, tergantung

dari arah mana hubungan tersebut dilihat. Untuk satu kejadian pada entitas yang

pertama dapat mempunyai banyak hubungan dengan kejadian pada entitas yang

kedua. Sebaliknya, satu kejadian pada entitas yang kedua hanya dapat mempunyai

satu hubungan dengan satu kejadian pada entitas yang pertama.

c. Many to Many (M-M)

Tingkat hubungan banyak ke banyak terjadi jika tiap kejadian pada sebuah entitas

akan mempunyai banyak hubungan dengan kejadian pada entitas lainnya, dilihat dari

sisi entitas yang pertama maupun dilihat dari sisi yang kedua.

C. Pengujian Web

Dalam testing dan implementasi yang akan dipergunakan yaitu Pengujian

Black-Box. Menurut Sukamto dan Shalahuddin (2013:275) “Black-Box Testing

(pengujian kotak hitam) yaitu menguji perangkat lunak dari segi spesifikasi

fungsional tanpa menguji desain 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

spesifikasi yang dibutuhkan. Kasus ini yang dibuat untuk melakukan pengujian kotak

hitam harus dibuat dengan kasus benar atau kasus salah, misalkan untuk kasus proses

login maka kasus uji yang dibuat adalah :

Page 35: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

19

a. Jika user mamasukan nama pemakai (username) dan kata sandi (password) yang

benar.

b. Jika user memasukan nama pemakai (username) dan kata sandi (password) ang salah,

misalnya nama pemakai benartapi sandi salah atau sebaliknya, atau keduanya salah.

Ciri-ciri dari Black-Box Testing sebagai berikut :

a. Black-Box Testing berfokus pada kebutuhan fungsional pada software berdasarkan

pada spesifikasi kebutuhan dari software.

b. Black-Box Testing bukan teknik alernatif dari pada white-box testing. Lebih dari pada

itu, ia merupakan pendekatan pelengkap dalam mencakup error dengan kelas yang

berbeda dari metode white-box testing

c. Black-Box Testing merupakan pengujian tanpa pengetahuan detil struktur internal

dari sistem atau komponen yang dites, juga disebut sebagai behavioral testing,

specification-based testing, input atau output testing dan fungsional testing.

Page 36: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

20

BAB III

PEMBAHASAN

3.1. Tinjauan Perusahaan

3.1.1. Sejarah Perusahaan

Reka Gadget Store merupakan salah satu perusahaan yang bergerak di

bidang perdagangan gadget dan komputer. Perusahaan ini berdiri sejak tanggal 21

Februari 2008. Lokasi Reka Gadget Store terbilang strategis yakni berada di wilayah

Depok. Reka Gadget Store didirikan karena memiliki berbagai tujuan yakni ingin

menjadikan produk gadget dan teknologi sebagai peluang usaha dan menciptakan

lapangan pekerjaan bagi orang lain. Awalnya, Reka Gadget Store hanya menjual

beberapa barang produk gadget dan aksesoris komputer saja, terutama untuk jenis

Handphone dan komputer desktop. Akan tetapi saat ini, Reka Gadget Store

memperluas jenis produk hingga menjual speaker audio, printer, notebook dan lain-

lain. Oleh karena itu, Reka Gadget Store berupaya sekali untuk melakukan berbagai

cara dalam proses penjualan terhadap produk yang dipasarkan. Salah satunya yakni

dengan strategi marketing atau pemasaran online melalui sistem komputerisasi yang

bisa diakses oleh semua orang.

Page 37: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

21

3.1.2. Struktur Organisasi

Struktur Organisasi Reka Gadget Store dapat dilihat pada gambar III.1

Sumber: Reka Gadget Store (2017)

Gambar III. 1

Struktur Organisasi Reka Gadget Store

Fungsi dan Tanggung Jawab

Berdasarkan sturktur organisasi yang terdapat pada gambar III.1 dapat

dijelaskan mengenai tugas dan tanggung jawab dari masing-masing bagian, yakni:

a. Pemilik (Owner)

Tugas dan tanggung jawab pemilik antara lain:

1. Menyediakan sarana prasarana dan modal produksi

2. Menentukan kebijakan atau aturan yang berlaku di perusahaan

Page 38: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

22

b. Manager

Tugas dan tanggung jawab manager antara lain:

1. Merencanakan target produksi perusahaan yang akan dicapai

2. Menyusun anggaran atau budgeting perusahaan

3. Melakukan inovasi terhadap produk gadget dan teknologi yang akan

dijual.

c. Supervisor

Tugas dan tanggung jawab supervisor antara lain:

1. Membantu manager dalam melakukan tugas operasional sehari-hari

2. Melakukan control dan evaluasi terhadap kinerja masing-masing staff

3. Menganalisa laporan hasil penjualan produk yang sudah terjual

d. Staff Administrasi

Tugas dan tanggung jawab staff administrasi antara lain:

1. Mengarsipkan segala bentuk kegiatan administratif perusahaan

2. Menyediakan berbagai keperluan alat tulis kantor bagi perusahaan

e. Staff Keuangan

Tugas dan tanggung jawab staff keuangan antara lain:

1. Mengatur pemasukan dan pengeluaran keuangan perusahaan

2. Melaksanakan anggaran atau budgeting perusahaan yang sudah ditetapkan

3. Membuat laporan keuangan perusahaan

f. Staff Marketing

Tugas dan tanggung jawab staff marketing antara lain:

Page 39: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

23

1. Merencanakan strategi penjualan

2. Memberikan informasi secara lengkap terhadap produk gadget dan

teknologi tersebut seperti harga, model, dll.

g. Staff IT

Tugas dan tanggung jawab staff IT antara lain:

1. Melakukan pemeliharaan perangkat komputer Perusahaan.

2. Melakukan guidence produk ke konsumen.

3.2. Analisis Kebutuhan

3.2.1 Pengguna

Dalam Toko Online Reka Gadgets Store yang dibuat ini memiliki tiga jenis

pengguna yaitu :

a. Admin

1) Admin dapat login ke halaman admin dengan cara mengisi username dan

password.

2) Admin dapat menambah, mengubah dan menghapus produk.

3) Admin dapat mengubah status order.

4) Admin dapat menambah kategori produk.

5) Admin dapat menambah melihat komentar dan file konfirmasi.

b. User / Member / Customer

1) User membeli produk.

2) User dapat memberikan komentar pada produk.

3) User dapat melihat keseluruhan produk di katalog.

Page 40: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

24

4) User dapat upload file konfirmasi.

5) User dapat melihat informasi kontak toko.

c. Pengunjung Biasa / Pengguna Belum Terdaftar

1) Pengunjung dapat melihat keseluruhan produk di katalog.

2) Pengunjung dapat mendaftar menjadi user / member.

3) Pengunjung dapat melihat informasi kontak took.

3.2.2 Data Untuk Kebutuhan Sistem

Dalam Toko Online Reka Gadgets Store yang dibuat ini membutuhkan data-data

dari pihak toko seperti :

1) Data pendaftaran member untuk pengunjung yang berminat. (nama,

alamat, telepon, email, username dan password).

2) Daftar produk yang dijual pihak toko.

3) Laporan transaksi pembelian dan penjualan produk dari pihak toko.

4) Data harga jasa pengiriman yang digunakan toko.

5) Data informasi kontak Reka Gadgets Store seperti alamat, nomor telepon

yang bisa dihubungi dan informasi detail lainnya.

6) Bukti pembayaran dari konsumen setelah melakukan pembayaran terhadap

produk yang dibeli.

3.2.3 Kebutuhan Sistem Untuk Pengguna

Dalam Toko Online Reka Gadgets Store yang dibuat ini kebutuhan system

pengguna seperti :

1) Menyediakan form pendaftaran.

2) Menyediakan layanan komentar pada produk.

Page 41: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

25

3) Menyediakan layanan transaksi pembelian produk.

4) Memberikan infomasi tentang produk-produk toko.

5) Memberikan panduan cara pembelian produk.

3.3. Perancangan Perangkat Lunak

3.3.1. Rancangan Antar Muka

Rancangan antar muka (Interface) dimaksudkan untuk memudahkan

pengguna toko online atau website ini diharapkan dapat digunakan oleh banyak

pengguna dari berbagai latar belakang dan juga karena tidak semua pengguna adalah

orang yang mengerti dan ahli dalam bidang pengoperasian komputer. Berikut adalah

rancangan tampilan antar muka dari toko online Reka Gadgets Store.

1. Rancangan Tampilan Halaman Untuk Admin

A. Rancangan Halaman Login Admin

Nama Program : login admin

Akronim : cek_login.php

Fungsi : Sebagai halaman akses admin untuk mengelola

website

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.2

Proses Program :

1) Mengetikan alamat /url_website/paneladmin khusus untuk dapat mengakses

halaman admin

2) Mengisi form login yang ada yakni dengan menginput username dan

password admin yang benar/sesuai.

Page 42: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

26

Gambar III.2

Rancangan Halaman Login Admin

B. Rancangan Halaman Panel Admin

Nama Program : Panel Admin

Akronim : home.php

Fungsi : Sebagai halaman awal saat admin berhasil melakukan

login

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.3

Proses Program :

Page 43: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

27

1) Setelah admin berhasil login, maka akan muncul halaman beranda sebagai

tampilan pertama halaman admin

2) Di halaman beranda ini tersedia menu dashboard, cara pembelian,

manajemen produk, komentar dan menu transaksi.

Gambar III.3

Rancangan Halaman Panel Admin

C. Rancangan Menu Cara Pembelian

Nama Program : Cara Pembelian

Akronim : carabeli.php

Fungsi : Sebagai halaman kelola cara pembelian.

Page 44: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

28

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.4

Proses Program :

1) Admin akan meng-klik menu cara pembelian pada kolom menu link bagian

kiri.

2) Lalu akan muncul menu cara pembelian pada kolom bagian kanan.

3) Pada menu ini admin dapat mengubah atau memperbarui tata cara pembelian

untuk ditampilkan di website.

Gambar III.4

Rancangan Menu Cara Pembelian Admin

Page 45: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

29

D. Rancangan Menu Ganti Password Admin

Nama Program : Ganti Password

Akronim : gantipass.php

Fungsi : Sebagai menu ubah password admin.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.5

Proses Program :

1) Admin akan meng-klik menu cara ubah password pada kolom menu link

bagian kiri.

2) Lalu akan muncul menu ubah password pada kolom bagian kanan.

3) Pada menu ini admin dapat mengubah password lama jika dibutuhkan untuk

alasan keamanan.

Page 46: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

30

Gambar III.5

Rancangan Menu Ganti Password Admin

E. Rancangan Menu Data Produk

Nama Program : Data Produk

Akronim : produk.php

Fungsi : Sebagai halaman kelola data master produk.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.6

Proses Program :

Page 47: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

31

1) Admin akan meng-klik menu manajemen produk pada kolom menu link

bagian kiri.

2) Lalu akan muncul menu dropdown pilihan, admin akan memilih menu

produk.

3) Pada menu ini admin dapat mengelola data produk yang terdiri dari nama

produk, harga dan stok. Admin juga bisa melakukan aksi ingin mengeditnya

atau menghapusnya.

Gambar III.6

Rancangan Menu Data Produk

Page 48: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

32

F. Rancangan Menu Data Subproduk

Nama Program : Data Subproduk

Akronim : subproduk.php

Fungsi : Sebagai menu kelola gambar data produk.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.7

Proses Program :

1) Admin akan meng-klik menu manajemen produk pada kolom menu link

bagian kiri.

2) Lalu akan muncul menu kategori pada kolom bagian kanan.

3) Pada menu produk admin hanya menginput data detail produknya saja tidak

dengan gambar produknya, setelah admin menambahkan suatu data produk,

makan produk tersebut tidak ada gambarnya pada halaman menu ini.

Kemudian admin dapat menambahkan gambar produk tersebut dengan aksi

mengeditnya. Admin juga dapat memperbaruhi gambar produk dan

menghapusnya.

Page 49: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

33

Gambar III.7

Rancangan Menu Data Subproduk

G. Rancangan Menu Data Kategori

Nama Program : Data Kategori

Akronim : kategori.php

Fungsi : Sebagai menu kelola data master kategori.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.8

Proses Program :

Page 50: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

34

1) Admin akan meng-klik menu kategori pada kolom menu link bagian kiri.

2) Lalu akan muncul menu dropdown pilihan, admin akan memilih menu

subproduk.

3) Pada menu ini admin dapat mengelola data kategori produk, yang mana

nanti produk dapat digolongkan bedasarkan kategori

Gambar III.8

Rancangan Menu Data Kategori

Page 51: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

35

H. Rancangan Menu Jasa Pengiriman

Nama Program : Data Ongkos Kirim

Akronim : jasakirim.php

Fungsi : Sebagai menu kelola data ongkos kirim pengiriman.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.9

Proses Program :

1) Admin akan meng-klik menu manajemen produk pada kolom menu link

bagian kiri.

2) Lalu akan muncul menu dropdown pilihan, admin akan memilih menu jasa

pengiriman.

3) Pada menu ini admin dapat mengelola data ongkos kirim, yang mana nanti

data tersebut akan menentukan ongkos kirim pembelian produk oleh user

tergantung alamat kota tempat tinggal user.

Page 52: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

36

Gambar III.9

Rancangan Menu Data Ongkos Kirim

I. Rancangan Menu Data Komentar

Nama Program : Data Komentar

Akronim : datakomentar.php

Fungsi : Sebagai menu kelola data komentar user.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.10

Proses Program :

Page 53: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

37

1) Admin akan meng-klik menu manajemen produk pada kolom menu link

bagian kiri.

2) Lalu akan muncul menu kelola data komentar pada kolom bagian kanan.

3) Pada menu ini admin dapat mengelola data komentar yang berisi komentar-

komentar user tentang produk, yang mana telah diinput pada kolom komentar

setiap produk.

Gambar III.10

Rancangan Menu Data Komentar

Page 54: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

38

J. Rancangan Menu Order Masuk

Nama Program : Order Masuk

Akronim : order.php

Fungsi : Sebagai Menu kelola setiap order masuk dan

mengubah status order user.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.11

Proses Program :

1) Admin akan meng-klik menu transaksi pada kolom menu link bagian kiri.

2) Lalu akan muncul menu dropdown pilihan, admin akan memilih menu order

masuk.

3) Pada menu ini admin dapat mengelola data order masuk dari penjualan

produk, Admin juga dapat mengubah status order untuk setiap order yang

telah dibayar user dan order yang produknya siap dikirim.

Page 55: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

39

Gambar III.11

Rancangan Data Order Masuk

K. Rancangan Halaman File Konfirmasi Admin

Nama Program : File Konfirmasi

Akronim : download_kofirmasi.php

Fungsi : Sebagai Menu pencarian file konfirmasi yang

diupload user.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.12

Proses Program :

Page 56: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

40

1) Admin akan meng-klik menu transaksi pada kolom menu link bagian kiri.

2) Lalu akan muncul menu dropdown pilihan, admin akan memilih menu file

konfirmasi

3) Pada halaman ini dapat mencari file konfirmasi yang telah diupload oleh

user.

Gambar III.12

Rancangan Halaman File Konfirmasi Admin

2. Rancangan Tampilan Halaman Untuk Pengunjung

A. Rancangan Tampilan Halaman Home Website

Nama Program : Index Home

Akronim : home.php

Fungsi : Sebagai halaman utama atau awal saat pengunjung

mengunjungi situs

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.13

Page 57: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

41

Proses Program :

1) User mengetikan alamat /url_website dari toko online Reka Gadgets Store

2) Setelah di tekan enter maka akan tampil halaman beranda yang merupakan

halaman awal dari website Reka Gadgest Store dan terdapat beberapa menu

link website ditampilannya.

Gambar III.13

Rancangan Halaman Home Website

Page 58: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

42

B. Rancangan Tampilan Halaman Kategori

Nama Program : Kategori

Akronim : media .php

Fungsi : Sebagai halaman kategori yang berisikan produk-

produk sesuai kategori.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.14

Proses Program :

1) Pengunjung mengarahkan cursor ke menu link kategori pada bagian header

website.

2) Setelah diarahkan maka akan muncul menu dropdown pilihan kategori

produk pada menu kategori, seperti gambar berikut ini.

Gambar III.14

Rancangan Halaman Kategori Produk

Page 59: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

43

C. Rancangan Tampilan Halaman Cara Pembelian

Nama Program : Cara Pembelian

Akronim : cara-beli.php

Fungsi : Sebagai halaman tata cara pembelian

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.15

Proses Program :

1) Pengunjung meng-klik menu cara pembelian pada bagian menu link.

2) Setelah di-klik maka akan tampil menu cara pembelian, disana pengunjung

akan bisa melihat informasi tata cara pembelian.

Gambar III.15

Rancangan Halaman Cara Pembelian

Page 60: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

44

D. Rancangan Tampilan Halaman Produk

Nama Program : Produk

Akronim : produk_list.php

Fungsi : Sebagai halaman prdouk yang berisikan informasi

detail dan dekripsi produk.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.16

Proses Program :

1) Pengunjung memilih produk yang ingin dilihat.

2) Setelah pengunjung memilih produk, lalu pengunjung akan meng-klik

produk tersebut. Kemudian pengunjung akan diarahkan ke halaman produk,

seperti gambar berikut ini.

Page 61: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

45

Gambar III.16

Rancangan Halaman Produk

E. Rancangan Tampilan Halaman Pendaftaran

Nama Program : Pendaftaran

Akronim : daftar.php

Fungsi : Sebagai halaman form pendaftaran pengunjung biasa

yang ingin menjadi user.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.17

Page 62: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

46

Proses Program :

1) Bagi user yang ingin mendaftar menjadi anggota maka user dapat meng-klik

tombol Daftar.

2) Setelah diklik, maka akan tampil halaman form pendaftaran anggota yang

dapat diisi oleh user/pengunjung seperti gambar berikut ini

Gambar III.17

Rancangan Halaman Pendaftaran

Page 63: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

47

F. Rancangan Tampilan Halaman Contact

Nama Program : Kontak

Akronim : contact.php

Fungsi : Sebagai halaman form pendaftaran pengunjung biasa

yang ingin menjadi user.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.18

Proses Program :

1) Bagi pengunjung yang ingin menanyakan informasi terkait tentang informasi

detail toko atau seputar produk, user bisa meng-klik menu contact.

2) Setelah diklik, maka akan tampil halaman contact with us, dimana

pengunjung bisa menghubungi pihak toko dengan mengisikan nama, email

dan pesan yang ingin disampaikan.

Gambar III.18

Rancangan Halaman Contact

Page 64: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

48

3. Rancangan Tampilan Halaman Untuk User

Selain kelima rancangan pengunjung tadi, user memiliki rancangan yang lebih

banyak dibandingkan pengunjung. User adalah pengunjung yang telah mendaftar

pada form pendaftaran. Berikut adalah rancangan tampilan halaman untuk user

yang tidak ada pada pengunjung.

A. Rancangan Halaman Keranjang Belanja / shopingchart

Nama Program : Keranjang Belanja

Akronim : cart.php

Fungsi : Sebagai halaman keranjang belanja, tempat melihat

detail daftar produk yang telah dibeli user.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.19

Proses Program :

1) User telah melakukan pembelian produk, maka sebelum checkout.

2) User akan diarahkan ke menu halaman keranjang belanja. Disana user dapat

melihat informasi total harga dan produk yang dibeli. Seperti gambar berikut

ini.

Page 65: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

49

Gambar III.19

Rancangan Halaman Keranjang Belanja

B. Rancangan Halaman Checkout

Nama Program : Checkout

Akronim : simpantransaksi.php

Fungsi : Sebagai halaman detail order yang akan dibayar user

setelah memilih dan belanja produk.

Bahasa Program : PHP

Page 66: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

50

Bentuk Tampilan : Gambar III.20

Proses Program :

1) User telah melakukan pembelian produk.

2) User akan diarahkan ke menu keranjang belanja.

3) Kemudian user akan meng-klik tombol checkout, lalu akan keluar rancangan

seperti gambar berikut ini.

Gambar III.20

Rancangan Halaman Checkout

Page 67: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

51

C. Rancangan Halaman Status Order User

Nama Program : Status Order

Akronim : order_user.php

Fungsi : Sebagai halaman mengecek informasi status order.

Bahasa Program : PHP

Bentuk Tampilan : III.21

Proses Program :

1) User meng-klik menu Halo User pada bagian pojok kanan atas website.

2) User akan diarahkan ke halaman Status order, di halaman tersebut terdapat

dua menu, status order anda dan file konfirmasi.

3) User memilih menu status order dengan meng-kliknya.

4) Setelah memilihnya user akan melihat informasi detail status order, dan juga

tercatat data history transaksi user selama pembelian.

Page 68: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

52

Gambar III.21

Rancangan Halaman Status Order

D. Rancangan Halaman Konfirmasi

Nama Program : Konfirmasi

Akronim : form_upload.php

Fungsi : Sebagai halaman konfirmasi pembayaran, user akan

meng-upload file konfirmasi bukti pembayaran.

Bahasa Program : PHP

Bentuk Tampilan : Gambar III.22

Proses Program :

Page 69: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

53

1) User meng-klik menu Halo User pada bagian pojok kanan atas website.

2) User akan diarahkan ke halaman Status order, di halaman tersebut terdapat

dua menu, status order anda dan file konfirmasi.

3) User memilih menu file konfirmasi dengan meng-kliknya.

4) User akan diarahkan ke halaman menu konfirmasi, disitu user akan meng-

upload bukti pembayaran dan mencatumkan keterangan nama user dan nomor

order. Seperti gambar berikut ini.

Gambar III.22

Rancangan Halaman Konfirmasi User

Page 70: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

54

3.3.2. Rancangan Basis Data

A. Entity Relationship Diagram (ERD)

Gambar III.23

Gambar Rancangan ERD

Page 71: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

55

B. Logical Relational Structure (LRS)

Gambar III.24

Gambar Rancangan LRS

C. Spesifikasi FIle

Disini akan dijelaskan tentang gambaran rancangan pembuatan situs yang

terperinci tersusun dari sub-sub bab dimulai dari spesifikasi bentuk masukan dan

keluaran spesifikasi file.

a. Spesifikasi Tabel admin

Nama File : Admin

Akronim : Admin

Fungsi : Untuk menyimpan data admin

Tipe File : File Master

Page 72: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

56

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 56 Karakter

Kunci Field : id_admin

Software : Mysql

Tabel III.1 Spesifikasi Tabel Admin

No Nama Field Type Size Keterangan

1 Id_admin Int 6 Primary Key

2 Username Varchar 25 Username

3 Password Varchar 25 Password

b. Spesifikasi Tabel Kategori

Nama File : Kategori

Akronim : Kategori

Fungsi : Untuk menyimpan data kategori produk

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 30 Karakter

Kunci Field : id_kategori

Software : Mysql

Page 73: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

57

Tabel III.2 Spesifikasi Tabel kategori

No Nama Field Type Size Keterangan

1 id_kategori Int 5 Primary Key

2 nama_kategori Varchar 25 Nama kategori

c. Spesifikasi Tabel Customer

Nama File : Customer

Akronim : Customer

Fungsi : Untuk menyimpan data customer

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 150 Karakter

Kunci Field : id_customer

Software : Mysql

Tabel III.3 Spesifikasi Tabel customer

No Nama Field Type Size Keterangan

1 id_customer Int 5 Primary Key

2 Password Varchar 25 password

3 nama_lengkap Varchar 50 Nama lengkap

4 Alamat Text alamat

5 Email Varchar 50 email

Page 74: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

58

6 Telpon Varchar 20 telpon

d. Spesifikasi Tabel Produk

Nama File : Produk

Akronim : Produk

Fungsi : Untuk menyimpan data produk

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 145 Karakter

Kunci Field : id_produk

Software : Mysql

Tabel III.4 Spesifikasi Tabel produk

No Nama Field Type Size Keterangan

1 id_produk Int 5 Primary Key

2 id_kategori Int 5 Foreign Key

3 nama_produk Varchar 100 Nama produk

4 Deskripsi Text Deskripsi

5 Harga Int 20 Harga

6 Stok Int 5 stok

7 Berat decimal 5 berat

8 Diskon Int 5 diskon

Page 75: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

59

e. Spesifikasi Tabel Order

Nama File : Order

Akronim : Order

Fungsi : Untuk menyimpan data pesanan / order

Tipe File : File Transaksi

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 45 Karakter

Kunci Field : id_order

Software : Mysql

Tabel III. 5 Spesifikasi Tabel order

No Nama Field Type Size Keterangan

1 id_orders Int 5 Primary Key

2 status_order Varchar 25 Status order

3 tgl_order Date Tanggal order

4 jam_order Time Jam order

5 id_customer Int 5 Foreign Key

6 total Int 10 Total Order

f. Spesifikasi Tabel Detail Order

Nama File : Detail Order

Akronim : Detail Order

Fungsi : Untuk menyimpan data detail pesanan / order

Page 76: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

60

Tipe File : File Transaksi

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 25 Karakter

Kunci Field : -

Software : Mysql

Tabel III.6 Spesifikasi Tabel detail_order

No Nama Field Type Size Keterangan

1 id_order Int 5 Foreign Key

2 id_produk Int 5 Foreign Key

3 jumlah Int 5 Jumlah Order

4 subtotal Int 10 Subtotal Order

3.3.3. Rancangan Struktur Navigasi

Rancangan struktur navigasi digunakan untuk menggambarkan secara garis

besar isi dari seluruh website bagaimana menggambarkan hubungan antara isi-isi

website atau portal tersebut. Struktur navigasi website atau toko online ini adalah

struktur navigasi hirarki. Melalui struktur navigasi ini terlihat bagaimana isi dan

susunan dari website secara menyeluruh.

Page 77: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

61

A. Struktur Navigasi Administrator

Gambar III.25

Struktur Navigasi Untuk Admin

B. Struktur Navigasi Pengunjung

Gambar III.26

Struktur Navigasi Untuk Pengunjung

Page 78: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

62

C. Struktur Navigasi User

Gambar III.27

Struktur Navigasi Halaman User

3.4. Implementasi dan Pengujian Unit

3.4.1. Implementasi

A. Implementasi Rancangan Antar Muka Admin

Implementasi rancangan antar muka pada toko online reka gadgets store

berdasarkan hasil rancangan antar muka admin.

1. Tampilan Halaman Login Panel Admin

Administrator harus melakukan login terlebih dahulu untuk dapat

menggunakan menu-menu yang tersedia. Jika login berhasil, maka menu-menu yang

tersedia akan ditampilkan.

Page 79: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

63

Gambar III.28

Tampilan Halaman Login Admin

2. Tampilan Halaman Dashboard Admin

Ini adalah halaman ketika admin berhasil login. Admin akan diarahkan ke

beranda yang berisi dashboard panel admin.

Page 80: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

64

Gambar III.29

Tampilan Halaman Dashboard Admin

3. Tampilan Menu Cara Pembelian di Panel Admin

Pada menu ini admin bisa mengedit tata cara pembelian yang akan

ditampilkan pada website nya.

Page 81: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

65

Gambar III.30

Tampilan Menu Cara Pembelian Admin

4. Tampilan Menu Ganti Password di Panel Admin

Pada menu ini admin akan mengubah password admin yang lama.

Gambar III.31

Tampilan Menu Ganti Password Admin

Page 82: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

66

5. Tampilan Menu Kelola Data Produk di Panel Admin

Pada menu ini admin dapat mengelola data produk. Admin dapat

menambahkan produk baru, menghapus produk lama serta mengubahnya.

Gambar III.32

Tampilan Menu Data Produk

6. Tampilan Menu Kelola Data Subproduk di Panel Admin

Pada menu ini admin mengelola gambar untuk produk yang ditampilkan.

Page 83: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

67

Gambar III.33

Tampilan Menu Data Subproduk

7. Tampilan Menu Kelola Data Kategori di Panel Admin

Pada menu ini admin mengelola kategori untuk setiap produk. Admin dapat

menambahkan kategori baru, menghapus kategori lama serta mengubahnya.

Page 84: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

68

Gambar III.34

Tampilan Menu Data Kategori

8. Tampilan Menu Kelola Data Ongkos Kirim di Panel Admin

Pada menu ini admin mengelola data ongkos kirim untuk setiap pengiriman

order produk. Admin dapat menambahkan data ongkos kirim baru, menghapus

data ongkos kirim lama serta mengubahnya.

Gambar III.35

Tampilan Menu Data Ongkos Kirim

Page 85: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

69

9. Tampilan Menu Kelola Data Komentar di Panel Admin

Pada menu ini admin mengelola data komentar yang telah dikirim oleh user,

pada setiap kolom komentar produk.

Gambar III.36

Tampilan Menu Data Komentar

10. Tampilan Menu Kelola Data Order Masuk

Pada menu ini admin mengelola data order masuk setiap pembelian produk

oleh user. Admin dapat melihat dan mengubah status order masuk kepada user.

Gambar III.37

Page 86: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

70

Tampilan Menu Data Order Masuk

11. Halaman File Konfirmasi Admin

Pada halaman ini admin dapat mencari file bukti pembayaran order user untuk

keperluan status konfirmasi order.

Gambar III.38

Tampilan Halaman File Konfirmasi Admin

B. Implementasi Rancangan Antar Muka Pengunjung

Implementasi rancangan antar muka pada toko online reka gadgets store

berdasarkan hasil rancangan antar muka pengunjung.

1. Halaman Home Website

Page 87: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

71

Halaman ini adalah halaman utama saat saat mengunjungi website.

Gambar III.39

Tampilan Halaman Home Website

2. Halaman Kategori Produk

Pada halaman ini user bisa melihat berbagai jenis kategori dan user juga dapat

melihat popular product pada bagian footer nya.

Page 88: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

72

Gambar III.40

Tampilan Halaman Kategori Produk

3. Halaman Cara Pembelian User

Pada halaman ini user bisa melihat tata cara pembelian pada toko online reka

gadgetshop.

Page 89: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

73

Gambar III.41 Tampilan Halaman Cara Pembelian

4. Halaman Produk

Ketika user meng-klik salah satu gambar barang maka user akan diarahkan

pada halaman beli barang, dimana user akan dapat memesan dan membeli barang

tersebut dan user juga bisa melihat deskripsi barang tersebut secara lengkap.

Page 90: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

74

Gambar III.42

Tampilan Halaman Produk

5. Halaman Pendaftaran.

Pengunjung yang belum terdaftar dapat mendaftar di form pendaftaran, dengan

meng-klik tombol login lalu pilih daftar baru. Berikut tampilan form

pendaftaran user.

Page 91: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

75

Gambar III.43

Tampilan Halaman Form Pendaftaran

6. Halaman Pendaftaran.

Jika ada pertanyaan seputar informasi produk maupun toko, pengunjung dapat

menghubungi pihak Reka Gadgets Store pada halaman contact. Berikut

halaman contact with us.

Page 92: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

76

Gambar III.44

Tampilan Halaman Contact

C. Implementasi Rancangan Antar Muka User

Berbeda dengan rancangan antar muka pengunjung, ada beberapa halaman dan

menu yang tidak ada di rancangan pengunjung tetapi ada di rancangan antar muka

user. Untuk mengakses rancangan antar muka user, pengunjung harus terdaftar

terlebih dahulu dan melakukan login.

Page 93: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

77

1. Halaman Keranjang Belanja / shopchart

Setelah meng-klik tombol beli pada halaman beli barang, user akan diarahkan

ke halaman shopchart. Pada halaman ini user akan melakukan pembelian dan

membayar sejumlah dana sesuai keterangan barang yang dibeli.

Gambar III.45

Tampilan Halaman Keranjang Belanja

2. Halaman Detail Checkout

Setelah melakukan checkout user akan mendapatkan detail order yang akan

dibayar serta ongkos kirim dan alamat pengiriman user.

Page 94: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

78

Gambar III.46

Tampilan Halaman Detail Checkout

3. Halaman Status Order User

Pada halaman ini user dapat melihat perkembangan status barang yang telah

dibeli, apakah barang sudah dikirim atau baru tahap konfirmasi pembayaran.

Page 95: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

79

Gambar III.47

Tampilan Halaman Status Order User

4. Halaman File Konfirmasi

Pada halaman ini user akan melakukan konfirmasi pembayaran dengan

melampirkan bukti pembayaran dari order yang telah dilakukan.

Gambar III.48

Halaman File Konfirmasi

Page 96: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

80

3.4.2. Pengujian Website

Dalam pembuatan website informasi dan penjualan aksesoris komputer pada

toko online Gadgets Store ini, diperlukan pengujian-pengujian tertentu untuk menguji

kemampuan dari sistem yang terdapat dalam aplikasi ini. Pengujian dilakukan dengan

metode Black Box Testing, dimana program diuji coba secara langsung untuk

mengetahui bug-bug yang terdapat dalam aplikasi.

Berikut adalah beberapa hasil pengujian terhadap website informasi dan

penjualan aksesoris komputer pada toko online Reka Gadgets Store :

A. Pengujian Terhadap Form Login

Tabel III.7

Hasil Pengujian Black Box Testing Halaman Login User

No Skenario

Pengujian Test Case

Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Username dan

Password

username :

(kosong)

Sistem akan

menolak

Sesuai

Harapan Valid

tidak diisi

kemudian klik

tombol masuk

password:

(kosong)

akses user dan

akan

menampilkan

"Login Gagal,

silahkan isi

Username dan

Password anda

dengan Benar

"

2

Mengetikkan

username

username :

ikbal

Sistem akan

menolak

Sesuai

Harapan Valid

tetapi

password tidak

password:

(kosong)

akses user dan

akan

diisi kemudian

klik

menampilkan "

Login Gagal,

silahkan isi

Username dan

Page 97: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

81

Password anda

dengan Benar

tombol Masuk "

3

Username

benar dan

username :

ikbal (benar)

Sistem akan

menolak

Sesuai

Harapan Valid

password salah

kemudian

password:

153(salah)

akses user dan

akan

menampilkan "

Login Gagal,

silahkan isi

Username dan

Password anda

dengan Benar”

4 Mengetikkan

username :

bale (salah)

Sistem akan

menolak

Sesuai

Harapan Valid

Username

salah dan

password

benar

kemudian klik

tombol Login

password:

123(benar)

akses user dan

akan

menampilkan "

Login Gagal,

silahkan isi

Username dan

Password anda

dengan Benar”

5

Mengetikkan

Username

username :

ikbal (benar)

Sistem

menerima akses

Sesuai

Harapan Valid

dan Password

dengan

password:

123(benar)

login dan

menampilkan

(Selamat

datang Ikbal,

klik OK untuk

melanjutkan

belanja)

kemudian

data yang

benar

Kemudian

Klik Tombol

Login

langsung masuk

ke Halaman

Beranda

Page 98: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

82

Tabel III.8

Hasil Pengujian Black Box Testing Halaman Login Admin

No Skenario

Pengujian Test Case

Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Username dan

Password

username :

(kosong)

Sistem akan

menolak

Sesuai

Harapan Valid

tidak diisi

kemudian

password:

(kosong)

akses admin

dan akan

klik tombol

masuk

menampilkan

"Username

dan Password

Masing

Kosong

"

2

Mengetikkan

username

username :

admin

Sistem akan

menolak

Sesuai

Harapan Valid

tetapi

password

tidak

password:

(kosong)

akses admin

dan akan

diisi kemudian

klik

menampilkan

"Username

atau password

anda salah

tombol Masuk "

3

Username

kosong dan

username :

(kosong)

Sistem akan

menolak

Sesuai

Harapan Valid

password diisi

kemudian

password:

admin(benar)

akses admin

dan akan

klik Masuk

menampilkan

"Username

atau password

anda salah

"

4

Mengetikkan

salah satu

username :

admi (salah)

Sistem akan

menolak

Sesuai

Harapan Valid

kondisi salah

pada

password:

admin(benar)

akses admin

dan akan

Page 99: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

83

username atau

password

menampilkan

"Username

atau password

anda salah

kemudian klik

Masuk "

5

Mengetikkan

Username

username :

admin(benar)

Sistem

menerima

akses

Sesuai

Harapan Valid

dan Password

dengan

password:

admin(benar)

login dan

kemudian

data yang

benar

langsung

masuk ke

kemudian klik

Masuk Beranda

B. Pengujian Terhadap Form Daftar Member

Tabel III.9

Hasil Pengujian Black Box Testing Halaman Daftar Member

No Skenario

Pengujian Test Case

Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Jika ada salah

satu field /

kolom dari

form daftar

yang belum

diisi

kemudian di

klik Daftar

Nama lengkap :

John Stamp

username :

Jono33

password :

jono33

Alamat lengkap :

(kosong)

email : (kosong)

telepon :

(kosong)

kota tujuan:

(kosong)

Sistem akan

menolak

akses dan

akan

menampilkan

"Data yang

anda isikan

belum

lengkap

"

Sesuai

Harapan

Valid

2

Semua field /

kolom yang

ada pada form

Nama

Lengkap:John

Stamp

Sistem

menerima

akses

Sesuai

Harapan

Valid

Page 100: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

84

Daftar diisi

semua dan

kemudian klik

daftar

Username:

jono33

Password:

jono33

Alamat lengkap :

Kwitang no.1

Email:

[email protected]

Telepon:

0811123232

Kota tujuan:

Jakarta

Pendaftaran

Dan

menampilkan

“Pendaftaran

berhasil, Klik

Ok untuk

melanjutkan”

kemudian

Langsung

diarahkan

kembali

halaman

beranda

C. Pengujian Terhadap Halaman Kelola Data Master

Tabel III.10

Hasil Pengujian Black Box Testing Halaman Data Produk

No Skenario

Pengujian Test Case

Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Jika salah

satu

kolom

produk

tidak diisi

kemudian

di klik

tambah

Nama Produk:

Handphone Esia

harga: 500000

stok: 3

berat: 1kg

Diskon: 10

kategori:

Smartphone

Gambar:

(kosong)

Sistem akan

menolak

akses dan data

tidak akan

tersimpan,

Dan

menampilkan

“Data yang

anda isikan

belum

lengkap”

Sesuai

Harapan

Valid

Page 101: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

85

2

Jika

semua

Kolom

produk

terisi

kemudian

di klik

tambah

Nama Produk:

Handphone Esia

harga: 500000

stok: 3

berat: 1kg

Diskon: 10

kategori:

Smartphone

Gambar:

image1.jpg

Sistem

menerima

akses

admin dan

kemudian

data produk

yang baru

sudah ada di

daftar

produk

Sesuai

Harapan Valid

Tabel III.11

Hasil Pengujian Black Box Testing Halaman Data Kategori

No Skenario

Pengujian Test Case

Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Jika kolom

kategori

tidak diisi

kemudian

di klik

tambah

Nama Kategori:

(kosong)

Sistem akan

menolak

akses dan data

tidak akan

tersimpan

“Data yang

anda isikan

belum

lengkap”

Sesuai

Harapan Valid

2

Jika semua

kolong

produk

terisi

kemudian

di klik

tambah

Nama Kategori:

Accesoris HP

Sistem

menerima

akses

admin dan

kemudian

data kategori

yang baru

sudah ada di

daftar

kategori

Sesuai

Harapan Valid

Page 102: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

86

D. Pengujian Terhadap Halaman Transaksi

Tabel III.12

Hasil Pengujian Black Box Testing Pembelian Produk

No Skenario

Pengujian Test Case

Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Jika

Pengunjung

belum

terdaftar

menjadi user

dan meng-

klik tombol

beli pada

salah satu

produk

Klik Tombol

Beli (Dengan

kondisi

belum login

sebagai user

terdaftar)

Akses ditolak

dan akan

menampilkan

(Email atau

password

anda salah,

atau anda

belum login)

Sesuai

Harapan Valid

2

Jika

Pengunjung

sudah

terdaftar

menjadi user

dan

melakukan

login lalu

meng-klik

tombol beli

pada salah

satu produk.

Klik Tombol

Beli (Dengan

kondisi

sudah login

sebagai user

terdaftar)

Sistem

menerima

request beli

user lalu user

akan

diarahkan ke

menu shoping

chart untuk

melakukan

transaksi

checkout

berikutnya

Sesuai

Harapan Valid

3

Jika user

tidak ingin

checkout,

tetapi ingin

belanja lagi

terlebih

dahulu

dengan meng-

klik tombol

belanja lagi

Klik tombol

belanja lagi

(setelah

melakukan

pembelian

produk)

Sistem

menerima

akses, lalu

user akan

diarahkan ke

halaman daftar

produk untuk

melakukan

pembelian

lagi.

Sesuai

Harapan Valid

Page 103: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

87

4

Jika user tidak

ingin

menambah

produk yang

dibeli

kedalam

keranjang,

kemudian

langsung klik

tombol

checkout

Klik Tombol

Checkout

setelah

pembelian

produk

Sistem

menerima

akses, lalu

menampilkan

detail

checkout

produk yang

telah dibeli

serta total

harga yang

harus dibayar.

Sesuai

Harapan Valid

Tabel III.13

Hasil Pengujian Black Box Testing Status Order User

No Skenario Pengujian Test Case Hasil Yang

Diharapkan

Hasil

Pengujian Kesimpulan

1

Setelah melakukan

pembelian produk,

user ingin

mengecek status

transaksi dengan

meng-klik menu

Halo User di

bagian atas kanan

website

Klik Menu

Halo User

Akses

diterima lalu

pengunjung

akan

diarahkan ke

halaman

status order

user.

Sesuai

Harapan Valid

2

Pada halaman

status order user

terdapat menu

transaksi dimana

terdapat menu

status order anda

dan konfirmasi

permbayaran. User

memilih menu

status order anda.

Klik Menu

Status order

anda Pada

pilihan

Menu

Transaksi

Sistem

menerima

akses,

kemudian

menampilka

n status

order masuk

user yang

berisi history

daftar

produk yang

Sesuai

Harapan Valid

Page 104: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

88

telah dibeli

user.

3

Jika user ingin

melihat detail

pembelian dari

daftar produk yang

ada pada menu

status order anda.

User akan meng-

klik tombol Baca

pada menu Aksi

pada produk yang

ingin dilihat.

Klik

Tombol

Baca pada

Kolom Aksi

Sistem

menerima

akses, lalu

user akan

menampilka

n order

detail. Yang

berisikan

detail

produk yang

dibeli seperti

nama

produk,

ongkos

kirim dan

total

harganya.

Sesuai

Harapan Valid

4

Jika user telah

melakukan

pembayaran dan

ingin

mengkonfirmasinya

. Pada halaman

yang sama user

akan memilih menu

konfirmasi

permbayaran pada

kolom menu

transaksi dibagian

kiri. Kemudian user

meng-kllik tombol

konfirmasi

pembayaran.

Klik

Tombol

Konfirmasi

pembayaran

pada pilihan

Menu

Transaksi.

Sistem

menerima

akses, lalu

User akan

diarahkan ke

halaman

upload file

konfirmasi.

Sesuai

Harapan Valid

Page 105: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

89

5

Pada halaman

upload file

konfirmasi user

ingin

mengkonfirmasi

pembayaran dengan

mengisi detail

produk yang telah

dibayar lalu klik

tombol choose file

untuk mengupload

bukti pembayaran.

Kemudian user

meng-klik tombol

Upload.

Meng-klik

tombol

choose file

untuk

mengupload

bukti

pembayaran

, kemudian

meng-klik

tombol

upload.

Sistem akan

menerima

akses, lalu

file bukti

pembayaran

akan

tersimpan

kemudian

sistem

menampilka

n keterangan

“Nama File:

image.jpg

berhasil di

upload”

Sesuai

Harapan Valid

Page 106: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

90

BAB IV

PENUTUP

4.1 Kesimpulan

Dari berbagai penjelasan yang telah diuraikan dalam laporan ini, maka dapat

disimpulkan beberapa hal sebagai berikut :

1. Terciptanya aplikasi website e-commerce atau toko online ini semoga dapat

memberikan manfaat bagi penulis, pihak toko dan masyarakat umum.

2. Dengan adanya website atau toko online ini pihak Reka Gadgets Store dan

Konsumen dapat melakukan transaksi penjualan secara online. Konsumen atau

calon pembeli tidak perlu lagi datang ke toko fisiknya langsung dan penyebaran

informasi produk Reka Gadgets Store menjadi lebih luas dengan adanya

website ini, sehingga transaksi yang dilakukan lebih efektif dan efisien.

4.2 Saran

Penulis mencoba memberikan saran-saran. Hal ini dimaksud untuk

mendukung agar situs dapat berjalan dengan baik. Saran-saran penulis adalah:

1. Demi keamanan dan kenyamanan diperlukan adanya backup data untuk

mengantisipasi hal-hal yang tidak diinginkan, seperti server rusak, crash, atau

kejadian lain yang tidak terduga.

2. Perlu adanya perawatan terhadap perangkat keras maupun perangkat lunak

yang dilakukan secara berkala.

3. Aplikasi dapat memberikan filter produk berdasarkan jumlah produk yang

Page 107: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

91

terjual serta menampilkan total jumlah produk yang terjual pada halaman

detail produk.

4. Dari sisi interface diharapkan ada perkembangan bukan hanya dari segi web

aplikasi tapi bisa juga mencakup mobile aplikasi sehingga para pengguna

dapat mengaksesnya melalui smartphone.

Page 108: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

DAFTAR PUSTAKA

Anhar. 2010. Panduan Menguasai PHP & MySQL secara Otodidak. Jakarta:

Mediakita.

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

Yoyakarta: Andi Publisher.

Hasugian, H. dan Ahmad Nur Shidiq. 2012. Rancang Bangun Sistem Informasi

Industri Kreatif Bidang Penyewaan Sarana Olahraga. Semantik 2012. pp. 606-

616. ISSN 979 - 26 - 0255 - 0. Diambil dari :

http://eprints.dinus.ac.id/id/eprint/202 (01 Juli 2017).

Masrur, Mukhamad. 2016. Pemrograman Web Dinamis Menggunakan Java Server

Pages dengan Database Relasional MYSQL. Yogyakarta: Andi.

Nugroho, Bunafit. 2013. Panduan Membuat PROGRAM TOKO dengan Visual Basic

dan MYSQL. Yogyakarta: Gava Media.

Prayudi, Budi, Eri Mardiani dan Nur Rahmansyah. 2012. Aplikasi Penjualan

Menggunakan VB.NET. Jakarta: Elex Media Komputindo.

Pratama, Andre. 2015. Ebook Panduan Belajar PHP Unruk Pemula.

Bandung: Duniailkom.

Rosa. A.S., dan Shalahuddin. M., 2016. “Rekayasa Perangkat Lunak”, 2nd ed,

Bandung: Informatika.

Saputra, Agus. 2012. Membuat Aplikasi Absensi dan Kuesioner untuk Panduan

Skripsi. Jakarta: Elex Media Komputindo.

Sukamto, R.A. dan Shalahuddin, M. 2013 Rekayasa Perangkat Lunak,

Bandung: Informatika.

Sutanta, Edhy. 2011. Basis Data Dalam Tinjauan Konseptual. Yogyakarta : Andi

Offset.

Yuhefizar. 2013. Mudah Membuat Web Profil Multibahasa.

Jakarta: Elex Media Komputindo.

Page 109: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam

DAFTAR RIWAYAT HIDUP

A. Biodata Mahasiswa

NIM : 12146779

Nama Lengkap : Muhammad Ikbal

Tempat &Tanggal Lahir : Jakarta, 21 Juli 1995

Alamat Lengkap : Jln. Pariaman Rt/Rw 02/02 No.1 Pasar Manggis,

Setiabudi, Jakarta Selatan 12970

B. Riwayat Pendidikan Formal & Non Formal

1. SDN 01 Pasar Manggis – Jakarta, lulud tahun 2007

2. SMP Negeri 280 – Jakarta, lulus tahun 2010

3. SMK Negeri 16 – Jakarta, lulus tahun 2013

C. Riwayat Pengalaman Ber-organisasi / Pekerjaan

1. IT Support di PT. Jatis Solutions

2. Staff Datacenter di PT. Indivara Group

Jakarta, 7 Juli 2017

Muhammad Ikbal

Page 110: PERANCANGAN SISTEM INFORMASI PENJUALAN ......ix ABSTRAK Muhammad Ikbal (12146779), ”Perancangan Sistem Informasi Penjualan Komputer dan Aksesoris Pada Reka Gadgets Store” Dalam