RANCANG BANGUN APLIKASI PENJUALAN ONLINE
PERLENGKAPAN ANAK PADA CV. PERMATA
TUGAS AKHIR
Program Studi S1 Sistem Informasi
Oleh:
Radix Ardi Guntoro 09.41010.0183
FAKULTAS TEKNOLOGI DAN INFORMATIKA
x
DAFTAR ISI
Halaman
ABSTRAK ... vii
KATA PENGANTAR ... viii
DAFTAR ISI ... x
DAFTAR TABEL ... xii
DAFTAR GAMBAR ... xiv
BAB I PENDAHULUAN ... 1
1.1 Latar Belakang ... 1
1.2 Perumusan Masalah ... 3
1.3 Batasan Masalah ... 3
1.4 Tujuan ... 4
1.5 Manfaat ... 4
1.6 Sistematika Penulisan ... 5
BAB II LANDASAN TEORI ... 7
2.1 Web ... 7
2.2 Toko Online ... 8
2.3 Analisa dan Perancangan Sistem ... 8
2.4 Konsep Basis Data ... 10
2.4.1 Sistem Basis Data ... 10
2.4.2 Database Management System ... 11
2.5 PHP Hypertext Preprocessor ... 13
2.6 Waterfall ... 14
xi
Halaman
2.8 Hypertext Markup Language (HTML) ... 16
BAB III ANALISIS DAN PERANCANGAN SISTEM ... 17
3.1 Identifikasi dan Analisis Sistem ... 17
3.2 Perancangan Sistem ... 17
3.2.1 Menganalisis Kebutuhan Sistem ... 18
3.2.2 Desain Sistem ... 19
BAB IV IMPLEMENTASI DAN EVALUASI ... 58
4.1 Implementasi ... 58
4.1.1 Kebutuhan Implementasi ... 55
4.1.2 Kebutuhan Hosting ... 59
4.1.3 Implementasi Sistem ... 60
4.2 Uji Coba dan Evaluasi Sistem ... 72
4.2.1 Uji Coba Sistem ... 72
4.2.2 Evaluasi Sistem ... 87
BAB V PENUTUP ... 90
5.1 Kesimpulan ... 90
5.2 Saran ... 90
1
PENDAHULUAN
1.1 Latar Belakang Masalah
Pertumbuhan pangsa pasar e-commerce di Indonesia tergolong cukup
pesat. Pertumbuhan ini didukung dengan data dari Menkominfo yang
menyebutkan bahwa nilai transaksi e-commerce pada tahun 2013 mencapai angka
Rp130 triliun. (Kemekominfo, 2013). Sedangkan data dari lembaga
riset ICD memprediksi bahwa pasar e-commerce di Indonesia akan tumbuh 42%
dari tahun 2012-2015. Angka ini lebih tinggi jika dibandingkan negara lain seperti
Malaysia (14%), Thailand (22%), dan Filipina (28%). Fakta ini menunjukkan
bahwa terdapat peluang yang sangat baik bagi investor untuk berinvestasi, baik
dari dalam maupun luar negeri.
CV. Permata merupakan usaha toko perlengkapan anak dengan nama
toko Nikita Baby Shop yang berlokasi di jalan Gotong Royong No. 25E, Babat
Lamongan. Toko ini menjual pakaian anak, mainan, boneka dan perlengkapan
bayi. Toko ini berdiri pada tanggal 29 Juni 2013.
Pada tahun 2015 penjualan CV. Permata cenderung mengalami
ketidakstabilan. Pada bulan Juli penjualan mengalami peningkatan yang cukup
pesat dibanding bulan-bulan lainnya. Berdasarkan wawancara, pemilik CV.
Permata berharap penjualan meningkat seperti bulan Juli 2015 bahkan bisa
melebihi. Untuk meningkatkan penjualannya, CV. Permata harus memperluas
Lamongan tetapi berasal dari luar kota bahkan luar pulau. CV. Permata berniat
membuka cabang di luar kota ataupun luar pulau tapi belum terealisasi karena
membutuhkan biaya yang sangat besar. Grafik penjualan pada tahun 2015 ini
dapat dilihat pada gambar 1.1.
Gambar 1.1 Grafik Penjualan Tahun 2015
Berdasarkan wawancara, pemilik tidak ingin menggunakan media sosial
seperti facebook dan instagram untuk menjual produknya karena, media sosial
tersebut memiliki banyak kekurangan. Kekurangan media sosial seperti facebook
dan instagram yaitu pelanggan akan mengalami kesulitan dalam pencarian barang
karena pada media sosial tersebut hanya berisi foto-foto saja dan dalam
pemesanan pelanggan harus menuliskan data barang dengan lengkap mulai dari
nama lengkap, kategori, warna dan ukuran. Di sisi lain pemilik juga mengalami
kesulitan dalam pembuatan laporan transaksi penjualan.
Saat ini, aplikasi penjualan offline yang ada hanya bisa mencetak laporan
tidak bisa memberikan laporan mengenai barang terlaris, pelanggan yang sering
berbelanja dan stok barang.
Dari permasalahan tersebut, maka CV. Permata membutuhkan aplikasi
penjualan online yang memiliki fitur-fitur seperti katalog produk, add to cart,
laporan barang terlaris, pelanggan yang sering berbelanja, stok barang dan
lain-lain. Dengan adanya aplikasi penjualan online ini, CV. Permata dapat memperluas
pasar di seluruh kota yang berada di Indonesia tanpa membangun atau membuka
cabang di luar kota maupun luar pulau.
Berdasarkan latar belakang di atas maka dibuat suatu penelitian dengan
membuat aplikasi penjualan online. Dengan adanya aplikasi ini diharapkan dapat
memberikan informasi data member, stok barang, laporan barang terlaris, laporan
pelanggan paling sering belanja, laporan penjualan harian, laporan penjualan
bulanan, laporan penjualan tahunan, invoice penjualan dan list pembayaran
dengan tujuan memberikan informasi yang dapat membantu penjualan CV.
Permata. Selain itu, aplikasi diharapkan dapat memberikan peluang untuk
memperoleh keuntungan yang lebih besar bagi perusahaan.
1.2 Perumusan Masalah
Berdasarkan uraian latar belakang masalah tersebut, maka perumusan
masalahnya adalah bagaimana membuat dan merancang suatu sistem aplikasi
penjualan online perlengkapan anak pada CV. Permata?
1.3 Batasan Masalah
Adapun yang menjadi batasan-batasan masalah dalam pembuatan aplikasi
1. Sistem ini tidak menangani proses pembayaran secara online dengan kartu
kredit, pembayaran di lakukan secara (offline payment) yaitu transfer antar
rekening bank.
2. Pengiriman produk ditangani oleh pihak ketiga yaitu jasa pengiriman dan
tidak dibahas di sistem ini.
3. Sistem tidak menangani pengembalian produk karena pengembalian
produk dilakukan secara manual by phone, sms, chatting.
4. Keamanan dalam sistem ini, password pada akun member menggunakan
md5.
1.4 Tujuan
Berdasarkan perumusan masalah tersebut di atas, maka tujuan dalam
tugas akhir ini yang akan dicapai adalah menghasilkan rancang bangun aplikasi
penjualan online perlengkapan anak pada CV. Permata.
1.5 Manfaat
Setelah proyek Tugas Akhir ini selesai, akan diperoleh manfaat bagi:
a. CV. Permata
Dengan adanya penerapan aplikasi penjualan online perlengkapan anak di
CV. Permata memperoleh:
1. Informasi laporan penjualan per periode.
2. Pendapatan meningkat.
3. Kemudahan pihak CV. Permata untuk melakukan pendataan member produk
b. Pelanggan
Dengan adanya penerapan aplikasi penjualan online perlengkapan anak di
CV. Permata, pelanggan memperoleh:
1. Informasi tentang produk.
2. Informasi harga yang akan dibayar.
3. Kemudahan pelanggan dalam mencari dan memesan produk.
1.6 Sistematika Penulisan
Secara garis besar sistematika penulisan pada laporan ini adalah
sebagai berikut:
Bab I : Pendahuluan
Pada bab ini akan menjelaskan mengenai latar belakang
permasalahan yang terjadi, perumusan masalah yang di dapat
dari latar belakang, batasan masalah, tujuan dilakukannya
penelitian, manfaat yang akan diberikan kepada perusahaan,
serta penjelasan mengenai sistematika penulisan pada
penelitian ini.
Bab II : Landasan Teori
Pada bab ini akan menjelaskan mengenai teori-teori yang
mendukung atau digunakan sebagai bahan acuan pada saat,
setelah ataupun sebelum melakukan penelitian antara lain
bahasa pemrograman yang digunakan, analisis dan
perancangan sistem, proses pengembangan model waterfall,
Bab III : Analisis dan Perancangan Sistem
Dalam bab akan menjelaskan bagaimana awal proses
penelitian ini dilakukan sehingga menghasilkan sebuah
perancangan yang diperoleh melalui beberapa tahapan seperti,
pengumpulan data, identifikasi permasalahan, analisis
permasalahan, solusi permasalahan yang diberikan, sampai
dengan perancangan system flow, data flow diagram, desain
ERD baik berupa conceptual data model maupun physical
data model, struktur basis data, dan interface dari aplikasi
yang dirancang dan dibangun.
Bab IV : Implementasi dan Evaluasi
Pada bab ini akan menjelaskan mengenai uji coba dari aplikasi
yang dirancang dan dibangun. Pada bab ini juga membahas
evaluasi dari aplikasi yang dirancang dan dibangun. Evaluasi
ini menjelaskan bagaimana pelanggan melakukan pendaftaran,
pelanggan melakukan transaksi dan konfirmasi, pemilik
menyetujui dan mengetahui laporan penjualan, pelanggan,
barang.
Bab V : Penutup
Pada bab terakhir yaitu bab penutup, akan dijelaskan mengenai
kesimpulan yang diperoleh dari penelitian yang dilakukan ini,
yaitu hasil dari evaluasi, serta saran terkait dengan sistem yang
7
LANDASAN TEORI
2.1 Web
Menurut Shelly dan Vermalat (2010), Web adalah koleksi dokumen
elektronik milik semua orang di dunia yang mengaksesnya melalui internet
menggunakan web browser, Menurut simamarta (2010), Aplikasi web adalah
sebuah sistem informasi yang mendukung interaksi pengguna melalui antarmuka
berbasis web. Fitur-fitur aplikasi web biasanya berupa data persistence,
mendukung transaksi dan komposisi halaman web dinamis yang dapat
dipertimbangkan sebagai hibridasi, antara hipermedia dan sistem informasi.
Aplikasi web adalah bagian dari client-side yang dapat dijalankan oleh browser
web. Client-side mempunyai tanggung jawab untuk pengeksekusian proses bisnis.
Interaksi web menurut Simamarta (2010), dibagi dalam tiga langkah
utama, yaitu:
1. Permintaan
Pengguna mengirimkan permintaan ke server web,melalui halaman web yang
ditampilkan pada browser web.
2. Pemrosesan
Server web menerima permintaan yang dikirimkan oleh pengguna, kemudian
memproses permintaan tersebut.
3. Jawaban
2.2 Toko Online
Toko oniline adalah proses dimana konsumen langsung memesan produk
atau jasa dari seorang penjual secara real-time, tanpa perantara layanan, melalui
internet. Ini adalah bentuk perdagangan elektronik. Sebuah toko online atau
dikenal dengan istilah lain e-shop, internet shop, web shop, web store, online
shop, atau virtual store membangkitkan analogi masyarakat bahwa untuk
memesan suatu produk atau jasa di toko atau di pusat perbelanjaan tidak perlu
dating ke tempat tersebut. Proses ini disebut Business-to-Customer (B2C) toko
online. (Josip, 2011).
Ketika mengunjungi sebuah toko online pelanggan dapat melihat
item-item yang ditawarkan sebuah toko online, menambahkan item-item ke keranjang
belanja dan kemudian membayar dengan kartu kredit atau mentransfer antar
rekening bank. (Balles, Louise, 2012). Anda dapat memesan apa pun yang anda
inginkan secara online. Beberapa toko online tidak menerima paypal sementara
beberapa menolak kartu kredit.
2.3 Analisis dan Perancangan Sistem
Analisa sistem dilakukan dengan tujuan untuk dapat mengidentifikasi dan
mengevaluasi permasalahan yang terjadi dan kebutuhan yang diharapkan,
sehingga dapat diusulkan perbaikannya. Perancangan sistem merupakan
penguraian suatu sistem informasi yang utuh ke dalam bagian komputerisasi yang
dimaksud, mengidentifikasi, dan mengevaluasi permasalahan, menentukan
kriteria, menghitung konsistensi terhadap kriteria yang ada, serta mendapat hasil
atau tujuan dari masalah tersebut serta mengimplementasikan seluruh kebutuhan
Menurut Kendall (2003) Analisa dan Perancangan Sistem dipergunakan
untuk menganalisis, merancang, dan mengimplementasikan
peningkatan-peningkatan fungsi bisnis yang dapat dicapai melalui penggunaan sistem
informasi terkomputerisasi.
Berikut ini merupakan proses dalam analisis dan perancangan system:
Entity Relationship Diagram (ERD)
Entity Realationship Diagram (ERD) adalah gambaran pada system
dimana di dalamnya terdapat hubungan antara entity beserta relasinya. Entity
merupakan sesuatu yang ada dan terdefinisikan di dalam suatu organisasi, dapat
abstrak dan nyata. Untuk setiap entity biasanya mempunyai attribute yang
merupakan ciri entity tersebut. Relasi adalah hubungan antar entity yang berfungsi
sebagai hubungan yang mewujudkan pemetaan antar entity.
Data Flow Diagram (DFD)
Pada tahap ini, penggunaan notasi dapat membantu komunikasi dengan
pemakai/user sistem untuk memahami sistem tersebut secara logika. Diagram
yang menggunakan notasi-notasi untuk menggambarkan arus dari data sistem ini
dikenal dengan nama Diagram Arus Data (Data Flow Diagram). DFD berfungsi
untuk menggambarkan proses aliran data yang terjadi di dalam sistem dari tingkat
yang tertinggi sampai yang terendah, yang memungkinkan untuk melakukan
dekomposisi, mempartisi atau membagi sistem ke dalam bagian-bagian yang lebih
2.4 Konsep Basis Data
Database menurut Yuswanto (2005), database merupakan sekumpulan
data yang berisi informasi yang saling berhubungan. Pengertian ini sangat berbeda
antara database Relasional dan Non Relasional. Pada database Non Relasional,
sebuah database hanya merupakan sebuah file.
Sedangkan menurut Marlinda (2004), menyatakan database adalah suatu
susunan/kumpulan data operasional lengkap dari suatu organisasi/perusahaan
yang diorganisir dan disimpan secara terintegrasi dengan menggunakan metode
tertentu menggunakan komputer sehingga mampu menyediakan informasi optimal
yang diperlukan pemakainya.
Penyusunan satu database digunakan untuk mengatasi masalah-masalah
pada penyusunan data yaitu redundansi dan inkonsistensi data, kesulitan
pengaksesan data, isolasi data untuk standarisasi, multiple user (banyak pemakai),
masalah keamanan (security), masalah integrasi (kesatuan), dan masalah data
independence (kebebasan data).
2.4.1 Sistem Basis Data
Sistem basis data adalah suatu sistem menyusun dan mengelola
record-record menggunakan komputer untuk menyimpan atau merekam serta
memelihara dan operasional lengkap sebuah organisasi/perusahaan sehingga
mampu menyediakan informasi optimal yang diperlukan pemakai untuk proses
mengambil keputusan. (Marlinda, 2004).
Pada sebuah sistem basis data terdapat komponen-komponen utama yaitu
Perangkat Keras (Hardware), Sistem Operasi (Operating System), Basis Data
(DBMS), Pemakai (User), dan Aplikasi (Perangkat Lunak) lain (bersifat
opsional).
Kelebihan sistem basis data adalah:
1. Mengurangi kerangkapan data, yaitu data yang sama disimpan dalam berkas
data yang berbeda-beda sehingga update dilakukan berulang-ulang.
2. Mencegah ketidak-konsistenan.
3. Keamanan data dapat terjaga, yaitu data dapat dilindungi dari pemakai yang
tidak berwenang.
4. Integritas dapat dipertahankan.
5. Data dapat dipergunakan bersama-sama.
6. Menyediakan recovery.
7. Memudahkan penerapan standarisasi.
8. Data bersifat mandiri (data independence).
9. Keterpaduan data terjaga, memelihara keterpaduan data berarti data harus
akurat. Hal ini sangat erat hubungannya dengan pengontrolan kerangkapan
data dan pemeliharaan keselarasan data.
Kekurangan sistem basis data adalah:
1. Diperlukan tempat penyimpanan yang besar.
2. Diperlukan tenaga yang terampil dalam mengolah data.
3. Kerusakan sistem basis data dapat mempengaruhi departemen yang terkait.
2.4.2 Database Management System
Menurut Marlinda (2004), Database Management System (DBMS)
merupakan kumpulan file yang saling berkaitan dan program untuk pengelolanya.
sendiri dalam suatu paket program yang komersial untuk membaca data,
menghapus data, dan melaporkan data dalam basis data.
Bahasa-bahasa yang terdapat dalam DBMS adalah sebagai:
1. Data Definition Language (DDL)
Pola skema basis data dispesifikasikan dengan satu set definisi yang
diekspresikan dengan satu bahasa khusus yang disebut DDL. Hasil kompilasi
perintah DDL adalah satu set tabel yang disimpan di dalam file khusus yang
disebut data dictionary/directory.
2. Data Manipulation Language (DML)
Bahasa yang memperbolehkan pemakai mengakses atau memanipulasi data
sebagai yang diorganisasikan sebelumnya model data yang tepat.
3. Query
Pernyataan yang diajukan untuk mengambil informasi. Merupakan bagian
DML yang digunakan untuk pengambilan informasi.
Fungsi DBMS ialah:
1. Data Definition
DBMS harus dapat mengolah data definition atau pendefinisian data.
2. Data Manipulation
DBMS harus dapat menangani permintaan-permintaan dari pemakai untuk
mengakses data.
3. Data Security dan Integrity
DBMS dapat memeriksa security dan integrity data yang didefinisikan oleh
4. Data Recovery dan Concurrency
a. DBMS harus dapat menangani kegagalan-kegagalan pengaksesan basis
data yang dapat disebabkan oleh kesalahan sistem, kerusakan disk, dan
sebagainya.
b. DBMS harus dapat mengontrol pengaksesan data yang konkuren yaitu
bila satu data diakses secara bersama-sama oleh lebih dari satu pemakai
pada saat yang bersamaan.
5. Data Dictionary
DBMS harus menyediakan data dictionary atau kamus data.
2.5 PHP Hypertext Preprocessor
Menurut dokumen resmi PHP, PHP merupakan singkatan dari PHP
Hypertext Preprocessor. Ia merupakan bahasa berbentuk scrip yang ditempatkan
dalam server dan diproses di server. Hasilnyalah yang dikirimkan ke klien tempat
pemakai menggunakan browser.
Secara khusus PHP dirancang untuk membentuk aplikasi web dinamis.
Artinya, ia dapat membentuk suatu tampilan berdasarkan perintaan terkini.
Misalnya, bisa menampilkan isi database ke halaman web. Pada prinsipnya PHP
mempunyai fungsi yang sama dengan skrip-skrip seperti ASP (Active Server
Page), Cold Fusion, ataupun Pearl. Namun, perlu diketahui bahwa PHP
sebenarnya bisa dipakai secara command line. Artinya, skrip PHP dapat
dijalankan tanpa melibatkan web server maupun browser.
Pada awalnya, PHP dirancang untuk diintegrasikan dengan web server
Apache. Namun, belakangan PHP juga dapat bekerja dengan web server seperti
Untuk mencoba PHP tidak perlu menggunakan komputer berkelas server. Hanya
dengan sebuah komputer biasa bisa mempelajari dan mempraktikkan PHP.
PHP bersifat bebas dipakai. Tidak perlu membayar apa pun untuk
menggunakan perangkat lunak ini alias free. Untuk dapat mendownloadnya
melalui situs http://www.php.net. PHP tersedia dalam bentuk kode biner maupun
kode sumber yang lengkap.
2.6 Waterfall
Menurut (Presman, 2015, p42), model waterfall adalah model klasik
yang bersifat sistematis menggunakan pendekatan secara sekuensial untuk
mengembangkan software yang dimulai dengan permintaan spesifikasi dari
pelanggan dan melewati progres planning, modeling, construction, dan
deployment dengan tujuan utama untuk membantu penyelesaian software. Berikut
adalah urutan proses model waterfall menurut Pressman:
Gambar 2.1 Waterfall model
Berikut adalah definisi dari setiap proses waterfall model:
1. Communcation
Langkah tersebut merupakan analisis terhadap kebutuhan software, dan dalam
proses tersebut merupakan tahap untuk melakukan pengumpulan data dengan
melakukan pertemuan dengan calon user, maupun mengumpulkan data-data
2. Planning
Proses tersebut merupakan lanjutan dari proses communication. Tahap ini akan
menggunakan dokumen user requirement atau bisa dikatakan sebagai data
yang berhubungan dengan keinginan user dalam pembuatan software.
3. Modelling
Proses tersebut menerjemahkan user requirement ke sebuah perancangan
software yang dapat diperkirakan sebelum dibuat coding. Pada tahapan
tersebut akan menghasilkan dokumen yang disebut software requirement.
4. Construction
Tahap tersebut adalah proses membuat kode. Coding atau pengkodean
merupakan terjemahan desain dalam bahasa yang dapat dimengerti oleh
computer. Setelah pengkodean selesai maka akan dilakukan testing terhadap
sistem yang telah diperbuat. Tujuan dari testing sendiri adalah menemukan
kesalahan-kesalahan terhadap sistem tersebut untuk kemudian diperbaiki.
5. Deployment
Tahapan ini bisa dikatakan tahap akhir dalam pembuatan software atau sistem.
Setelah melakukan analisis, desain dan pengkodean maka sistem yang sudah
jadi boleh digunakan oleh user. Setelah itu baru bisa dilakukan pemeliharaan
sistem secara berkala.
2.7 World Wide Web (WWW)
World Wide Web merupakan jaringan dokumentasi yang sangat besar
yang saling berhubungan satu dengan yang lain. Satu set protocol yang
mendefinisikan bagaimana sistem bekerja dan mengirim data dan sebuah software
multimedia yang membuat internet mudah digunakan dijelajahi dan
dikontribusikan.
Web merupakan sistem hypermedia yang berarea luas yang ditujukan
untuk akses secara universal. Salah satu kuncunya adalah kemudahan tempat
seseorang atau perusahaan dapat menjadi bagian dari web berkontribusi pada web
(Hanson, 2000).
Web merupakan sistem yang menyebabkan pertukaran data di internet
menjadi mudah dan efisien. Web terdiri atas 2 komponen dasar:
1. Server Web: Sebuah komputer dan software yang menyimpan dan
mendistribusikan data ke komputer lainnya melalui internet.
2. Brower Web: Software yang dijalankan pada komputer pemakai atau client
yang meminta informasi dari server web yang menampilkannya sesuai dengan
file data itu sendiri. (Hanson, 2000).
2.8 Hypertext Markup Language (HTML)
Menurut Winarno (2011), Hypertext Markup Language (HTML) adalah
sebuah bahasa untuk menampilkan konten di web. HTML sendiri adalah bahasa
pemrograman yang bebas, artinya tidak dimiliki oleh siapa pun,
pengembangannya dilakukan oleh banyak orang diberbagai negara dan bisa
dikatakan sebagai sebuah bahasa yang dikembangkan bersama-sama secara
17
ANALISIS DAN PERANCANGAN SISTEM
Berdasarkan hasil survey, wawancara dan pengamatan yang dilakukan
pada CV. Permata, maka didapatkan proses-proses yang terjadi dalam kegiatan
penjualan. Diantaranya adalah proses registrasi pelanggan, transaksi penjualan
dan konfirmasi pembayaran.
3.1 Identifikasi dan Analisis Sistem
CV. Permata merupakan usaha toko perlengkapan anak dengan nama
toko Nikita Baby Shop. Toko ini menjual pakaian anak, mainan, boneka dan
perlengkapan bayi. Untuk meningkatkan penjualannya, CV. Permata harus
memperluas. CV. Permata membutuhkan aplikasi yang bisa membantu
penjualannya secara online. Saat ini, aplikasi penjualan offline yang ada hanya
bisa mencetak laporan transaksi penjualan bulanan dan tahunan saja. Aplikasi
offline yang saat ini ada tidak bisa memberikan laporan mengenai barang terlaris,
pelanggan yang sering berbelanja dan stok barang.
3.2 Perancangan Sistem
Perancangan sistem adalah proses menyusun atau mengembangkan
sistem atau aplikasi yang baru. Dalam tahap ini harus dapat dipastikan bahwa
semua persyaratan untuk menghasilkan sistem atau aplikasi yang baru dapat
dipenuhi. Hasil sistem atau aplikasi yang dirancang harus sesuai dengan
Dari hasil identifikasi dan analisis untuk membantu CV. Permata
menyelesaikan permasalahan yang ada, maka perlu dibuatkan aplikasi dalam
Rancang Bangun Aplikasi Penjualan Online Perlengkapan Anak pada CV.
Permata yang dapat memberikan informasi penjualan dan mempermudah
pelanggan untuk melakukan pembelian. Untuk membantu pembuatan sistem
tersebut maka diperlukan langkah-langkah sebagai berikut:
1. Menganalisis Kebutuhan Sistem.
2. Mendesain Sistem (Block Diagram, System Flow, Context Diagram, Jenjang
Proses (HIPO), Data Flow Diagram (DFD), ERD, struktur tabel desain I/O
(input-output), desain Interface).
3.2.1 Menganalisis Kebutuhan Sistem
Sebelum mendesain sistem, langkah pertama kali yang akan dilakukan
adalah menganalisis kebutuhan sistem. Dalam tahap ini analisis bersisikan proses
identifikasi data transaksi penjualan pada CV. Permata.
Dari data penjualan pada CV. Permata langkah berikutnya adalah
mengidentifikasi data-data tersebut agar dapat dirumuskan solusi-solusi yang
akan ditawarkan untuk mengatasi permasalahan yang ada pada CV. Permata. dari
perumusan tersebut, kemudian menggambarkan output yang akan dihasilkan dari
solusi yang didapat.
Setelah gambaran singkat solusi yang diberikan kepada pemilik
perusahaan CV. Permata, maka langkah selanjutnya yaitu mendesain sistem dari
System Flow, Context Diagram, Data Flow Diagram (DFD), ERD, Struktur Tabel
3.2.2 Desain Sistem
Pada perancangan aplikasi penjualan online perlengkapan anak pada CV.
Permata ini memiliki beberapa sub desain yaitu Block Diagram, System Flow,
Context Diagram, Data Flow Diagram (DFD), ERD, Struktur Tabel Desain I/O
(input-output), Desain Interface.
1. Block Diagram
Dalam merancang sistem informasi ini, penulis mengumpulkan
informasi yang diperlukan. Data inputan diantaranya: data-data yang berkaitan
dengan pengguna, data barang, nomor resi dan data penjualan. Kemudian data
tersebut diproses menghasilkan data pelanggan, stok barang dan laporan. Blok
diagram sistem penjualan online dapat dilihat pada gambar 3.1.
Blok Diagram
Input Prose s Output
Phas
e
Transaksi Penjualan
Data Penjualan
Laporan Pelanggan paling sering belanja Laporan dan Grafik Barang Paling Laris
List Transaksi Barang Dikirim No. Resi
Poin Member
Histori Member
2. System Flow
Perancangan desain sistem yang akan menjadi solusi dari permasalahan
pada CV. Permata yang akan dibahas pada sub bab berikut ini:
A. System Flow Registrasi Customer
Registrasi
Mengirim email member premium telah disetujui
dan aktif
Mengirim email member premium ditolak
System flow registrasi pelanggan ini menggambarkan alur sistem baru
yang telah dibuat. Customer meng-input diri ke sistem dan kemudian sistem
mengecek status pendaftaran customer. Ada 2 macam jenis pendaftaran member
customer yaitu member gratis dan member prabayar, member prabayar ini akan
memberikan point disetiap pembelanjaan apabila pelanggan telah berbelanja
dengan minimum nominal Rp. 100.000. Point yang diberikan dapat ditukarkan
sebagai voucher pembelanjaan. Customer yang telah mendaftar akan
mendapatkan pesan email yang berisi link aktivasi dan mengklik link tersebut
untuk mengaktifkan akun yang telah dibuat. Apabila status pendaftaran customer
adalah member prabayar, maka customer harus melakukan pembayaran dan
melakukan konfirmasi. Admin akan mengecek konfirmasi pembayaran member,
apabila pembayaran valid, maka admin akan mengubah status member menjadi
premium member dan mengirim pesan ke email customer yang berisi pendaftaran
premium member telah berhasil. Apabila pembayaran tidak valid, maka admin
mengirim pesan ke email customer yang berisi pendaftaran gagal dan ditolak
B. System Flow Login
Gambar 3.3 System Flow Login
System flow login ini menggambarkan alur sistem customer yang
melakukan login. Customer meng-input username dan password, kemudian
sistem akan mengecek inputan username dan password tersebut. Apabila
username dan password tidak valid maka sistem akan memberikan notifikasi
kepada customer bahwa login gagal dan apabila inputan username dan password
valid, maka sistem akan memberikan notifikasi kepada customer bahwa login
C. System Flow Penjualan Transaksi Penjualan
Customer Sistem Raja Ongkir
Mulai customer sudah
melakukan login?
Apakah pelanggan sudah mendaftar sebagai
member?
Tidak (Total harga belanja Menghitung potongan harga – (poin*1000)) Ya
System flow transaksi penjualan ini menggambarkan kegiatan customer
saat mulai dari melakukan pencarian barang, menambahkan ke keranjang belanja,
melakukan pembayaran. Customer dapat melakukan 2 cara untuk mencari produk,
cara pertama customer dapat memanfaatkan search untuk mencari produk dan
kedua customer dapat mengunjungi menu produk untuk melihat katalog produk
yang tersedia. Customer memilih produk dan menekan tombol add to cart untuk
menambahkan produk ke keranjang belanja. Untuk melakukan proses selanjutnya,
customer menekan tombol icon keranjang belanja untuk melihat daftar belanja
customer. Setelah masuk ke halaman keranjang belanja, customer mengisi data
pengiriman dan memilih lokasi tujuan, kemudian kurir akan memberikan
informasi harga kirim sesuai tujuan. Customer memilih paket pengiriman yang
tersedia, kemudian sistem menghitung total belanja yang harus dibayar. Sebelum
melakukan proses checkout, sistem akan mengecek status member customer.
Untuk status member prabayar, customer dapat menggunakan poin sebagai
potongan harga dan customer juga mendapatkan poin di setiap pembelanjaan
minimal Rp. 100.000. Di setiap poin yang digunakan memiliki nilai Rp. 1000,
maka total harga akan dikurangi dengan total potongan harga yang diperoleh dari
perhitungan poin tersebut. Customer menekan tombol checkout untuk menyimpan
order ke tabel order dan sistem akan memberikan notifikasi pada halaman website
D. System Flow Konfirmasi Pembayaran
mencoba lagi? Ya 1 1
Gambar 3.5 System Flow Konfirmasi Pembayaran
System flow konfirmasi pembayaran ini menggambarkan alur Customer
yang melakukan konfirmasi pembayaran. Customer meng-input nomor invoice,
tidak valid, maka sistem akan memberikan notifikasi gagal kepada customer dan
jika inputan berhasil, maka sistem akan menyimpan data konfirmasi ke tabel
payment confirmation. Admin akan mengecek data konfirmasi. Apabila data
tidak valid, maka admin menekan tombol reject dan sistem akan mengubah status
order menjadi rejected dan apabila valid, maka admin menekan tombol confirm
dan sistem akan mengubah status order menjadi paid.
3. Context Diagram
Context Diagram merupakan langkah pertama yang menggambarkan asal
data dalam menunjukkan aliran data tersebut yang terdiri dari 2 external entity,
yaitu customer dan admin. Context diagram ditunjukkan pada gambar 3.6.
Hasil Pencarian Produk Data Username dan Password Data Konfirmasi Pembayaran
Rancang Bangun Aplikasi Penjualan Online Perlengkapan
Anak pada CV Permata
+
Customer
Admin
4. DFD Level 0
Pada DFD level 0 dibawah ini merupakan penjabaran dari context
diagram. Pada level 0 ini terdapat 4 proses yaitu registrasi member, analisa
penjualan, pengolahan data dan pelaporan.
Simpan Data Penjualan Lihat Data Penjualan
Simpan Data Konfirmasi Pembayaran
Lihat Produk Terlaris [Data Username dan Password]
Update Data Customer
4 Tabel Order Detail
5 Tabel Payment Confirmation
5. DFD Level 1 Registrasi
Pada DFD level 1 registrasi terdapat 2 proses yaitu mengecek status
registrasi member dan mengkonfirmasi member, proses di bawah ini adalah hasil
penjabaran dari DFD level 0 dari proses registrasi.
[Info Member]
[Update Data Customer] [Data Persetujuan Member]
[Lihat Data Customer] [Data Diri Customer]
Customer
1 Tabel Customers 1.1
Mengecek Status Registrasi Member
1.2
Mengkonfirmasi Member
Admin
Gambar 3.8 DFD Level 1 Registrasi
6. DFD Level 1 Penjualan
Pada DFD level 1 penjualan terdapat 6 proses yaitu menampilkan produk
terbaru, menampilkan produk terlaris, mencari produk, melakukan login,
menambahkan ke keranjang belanja dan mengkonfirmasi penjualan, proses di
[Simpan Data Konfirmasi Pembayaran]
[Data Username dan Password] [Data Produk Terlaris]
5 Tabel Payment
Confirmation
3 Tabel Order
Gambar 3.9 DFD Level 1 Penjualan
7. DFD Level 1 Pembuatan Laporan
Pada DFD level 1 pengolahan data hanya terdapat 3 proses yaitu
pembuatan laporan penjualan, pembuatan laporan barang terlaris dan pembuatan
laporan pembeli terbanyak, proses di bawah ini adalah hasil penjabaran dari DFD
[Lihat Produk Terlaris]
[Lihat Pembeli Terbanyak] [Laporan Pembeli Terbanyak]
[Lihat Data Penjualan]
[Laporan Produk Terlaris]
[Laporan Penjualan] Admin
3 Tabel Order 4.1
Pembuatan Laporan Penjualan
4.2
Pembuatan Laporan Barang Terlaris
4.3
Pembuatan Laporan Pembeli Terbanyak
4 Tabel Order Detail
Gambar 3.10 DFD Level 1 Pembuatan Laporan
8. Entity Relationship Diagram (ERD)
Entity Relationship Diagram (ERD) adalah suatu desain sistem yang
digunakan untuk menentukan kebutuhan-kebutuhan sistem pemrosesan database.
Pada gambar berikut akan dijelaskan relasi-relasi atau hubungan antar tabel
rancang bangun aplikasi penjualan online perlengkapan anak pada CV. Permata
A. Conceptual Data Model (CDM)
o FILE_NAME Variable characters (300)
product_details
# WISHLIST_ID Variable characters (25) Relationship_11 Relationship_12 # PRODUCT_SIZE Variable characters (10) province
B. Physical Data Model (PDM)
9. Struktur Tabel
Rancang bangun aplikasi penjualan online perlengkapan anak pada CV.
Permata memiliki struktur tabel yang saling terintegrasi dan memberikan
informasi yang cukup lengkap bagi pengguna sistem. Tabel-tabel yang digunakan
pada sistem yang telah dibuat ini sebagaimana terdapat pada Physical Data
Model. Berikut penjelasan struktur dari tiap tabel:
A. Tabel Master Customers
Primary Key : CUSTOMER_ID, CUSTOMER_EMAIL
Foreign Key : CITY_ID
Fungsi : Menyimpan dan melihat data customer
Tabel 3.1 Tabel Master Customers
Field Type Data Length Constraint
CUSTOMER_ID Varchar 25 Primary Key
CUSTOMER_FIRST_NAME Varchar 50 -
CUSTOMER_LAST_NAME Varchar 50 -
CUSTOMER_EMAIL Varchar 50 -
CITY_ID Varchar 25 Foreign Key
CUSTOMER_GENDER Varchar 50 -
CUSTOMER_BIRTHDATE Date - -
Field Type Data Length Constraint
CUSTOMER_MEMBER_STATUS Varchar 20 -
CUSTOMER_POINT Int - -
CUSTOMER_CREATED Datetime - -
CUSTOMER_MODIFIED Datetime - -
B. Tabel Master Categories
Primary Key : CATEGORY_ID
Foreign Key : -
Fungsi : Menyimpan dan melihat data category
Tabel 3.2 Tabel Master Customers
Field Type Data Length Constraint
CATEGORY_ID Varchar 25 Primary Key
CATEGORY _NAME Varchar 50 -
CATEGORY_SLUG Varchar 100 -
CATEGORY_PARENT Varchar 100 -
C. Tabel Master Products
Primary Key : PRODUCT_ID
Foreign Key : CATEGORY_ID, USER_ID
Fungsi : Menyimpan dan melihat data product
Tabel 3.3 Tabel Master Products
Field Type Data Length Constraint
PRODUCT_ID Varchar 25 Primary Key
CATEGORY _ID Varchar 25 Foreign Key
USER_ID Varchar 25 Foreign Key
PRODUCT_NAME Varchar 100 -
PRODUCT_DESCRIPTION Text - -
PRODUCT_GENDER Varchar 25 -
PRODUCT_PRICE Int - -
PRODUCT_CREATED Datetime - -
PRODUCT_MODIFIED Datetime - -
D. Tabel Master City
Primary Key : CITY_ID
Foreign Key : PROVINCE_ID
Tabel 3.4 Tabel Master City
Field Type Data Length Constraint
CITY_ID Varchar 25 Primary Key
PROVINCE _ID Varchar 25 Foreign Key
CITY_NAME Varchar 25 -
E. Tabel Master Size
Primary Key : PRODUCT_SIZE
Foreign Key : -
Fungsi : Menyimpan dan melihat data size
Tabel 3.5 Tabel Master Size
Field Type Data Length Constraint
PRODUCT_SIZE Varchar 10 Primary Key
F. Tabel Master Province
Primary Key : PROVINCE_ID
Foreign Key : -
Fungsi : Menyimpan dan melihat data province
Tabel 3.6 Tabel Master Province
Field Type Data Length Constraint
PROVINCE_ID Varchar 25 Primary Key
G. Tabel Users
Primary Key : USER_ID
Foreign Key : CUSTOMER_ID, CUSTOMER_EMAIL
Fungsi : Menyimpan dan melihat data user
Tabel 3.7 Tabel Users
Field Type Data Length Constraint
USER_ID Varchar 25 Primary Key
CUSTOMER _ID Varchar 25 Foreign Key
CUSTOMER_EMAIL Varchar 25 Foreign Key
USER_NAME Varchar 50 -
USER_PASSWORD Varchar 50 -
USER_GROUP Smallint - -
USER_CONFIRM_STATUS Smallint - -
H. Tabel Product Detail
Primary Key : PRODUCT_SKU
Foreign Key : PRODUCT_ID
Tabel 3.8 Tabel Product Detail
Field Type Data Length Constraint
PRODUCT_SKU Varchar 25 Primary Key
PRODUCT_ID Varchar 25 Foreign Key
PRODUCT_SIZE Varchar 10 Foreign Key
PRODUCT_QTY Varchar Int -
PRODUCT_WEIGHT Varchar Int -
I. Tabel Thumbnails
Primary Key : -
Foreign Key : PRODUCT_ID
Fungsi : Menyimpan dan melihat data thumbnails
Tabel 3.9 Tabel Thumbnails
Field Type Data Length Constraint
PRODUCT_ID Varchar 25 Foreign Key
FILE_NAME Varchar 300 -
J. Tabel Orders
Primary Key : ORDER_ID
Foreign Key : CUSTOMER_ID, CITY_ID
Tabel 3.10 Tabel Orders
Field Type Data Length Constraint
ORDER_ID Varchar 25 Primary Key
CUSTOMER_ID Varchar 25 Foreign Key
CITY_ID Varchar 25 Foreign Key
ORDER_ADDRESS_DESTINATION Varchar 300 -
ORDER_RECEIVER Varchar 100 -
ORDER_NOTE Text - -
ORDER_COURIER Varchar 50 -
ORDER_TOTAL_PRICE Int - -
ORDER_CREATED Date - -
ORDER_STATUS Varchar 10 -
K. Tabel Order Detail
Primary Key : -
Foreign Key : PRODUCT_ID, PRODUCT_SKU, ORDER_ID,
PRODUCT_SIZE
Tabel 3.11 Tabel Order Details
Field Type Data Length Constraint
PRODUCT_SKU Varchar 25 Foreign Key
PRODUCT_ID Varchar 25 Foreign Key
ORDER_ID Varchar 25 Foreign Key
PRODUCT_SIZE Varchar 10 Foreign Key
ORDER_DETAIL_PRICE Int - -
ORDER_DETAIL_QTY Int - -
ORDER_SUBTOTAL Int - -
ORDER_SHIPPING_COST Int - -
L. Tabel Payment Confirmation
Primary Key : -
Foreign Key : ORDER_ID
Fungsi : Menyimpan data payment confirmation, melihat
status pembelian dan konfirmasi pembayaran
Tabel 3.12 Tabel Payment Confirmation
Field Type Data Length Constraint
ORDER_ID Varchar 25 Foreign Key
Field Type Data Length Constraint
PAYMENT_ACCOUNT Varchar 25 -
PAYMENT_ACCOUNT_NAME Varchar 100 -
PAYMENT_TRANSFER_DATE Date - -
PAYMENT_TRANSFER_COST Int - -
PAYMENT_NOTE Text - -
M. Tabel Wishlist
Primary Key : WISHLIST_ID
Foreign Key : CUSTOMER_ID, PRODUCT_SKU, PRODUCT_ID,
PRODUCT_SIZE
Fungsi : Menyimpan dan melihat data wishlist
Tabel 3.13 Tabel Wishlist
Field Type Data Length Constraint
WISHLIST_ID Varchar 25 Primary Key
CUSTOMER_ID Varchar 25 Foreign Key
PRODUCT_ID Varchar 25 Foreign Key
PRODUCT_SKU Varchar 25 Foreign Key
N. Tabel Customer History
Primary Key : WISHLIST_ID
Foreign Key : CUSTOMER_ID, ORDER_ID
Fungsi : Melihat data customer history
Tabel 3.14 Tabel Customer History
Field Type Data Length Constraint
ORDER_ID Varchar 25 Foreign Key
CUSTOMER_ID Varchar 25 Foreign Key
HISTORY_STATUS Varchar 50 -
HISTORY_POINT Int - -
HISTORY_CREATED Datetime - -
10. Desain I/O
Pembuatan desain I/O merupakan desain input dan output gambaran
aplikasi yang akan dibuat. Desain I/O dibuat semudah mungkin agar tidak
mempersulit pengguna.
A. Desain I/O Tampilan Registration
Rancang desain I/O berikut ini merupakan tampilan registrasi. Form ini
digunakan untuk pendaftaran data diri customer. Desain I/O registrasi dapat
Gambar 3.13 Desain I/O Registration
Berikut ini adalah tampilan desain I/O setelah berhasil melakukan
pendaftaran sebagi member. Desain I/O halaman saat berhasil melakukan
registrasi dapat dilihat pada gambar 3.14.
B. Desain I/O Tampilan Login
Rancang desain I/O berikut ini merupakan tampilan login. Pada form ini
terdapat input text username dan password yang harus diisi pengguna. Desain I/O
login dapat dilihat pada gambar 3.15.
C. Desain I/O Tampilan Home
Rancang desain I/O berikut ini merupakan tampilan home. Pada halaman
ini, customer yang mengunjungi web akan mendapatkan informasi mengenai
produk terbaru dan terlaris. Desain I/O home dapat dilihat pada gambar 3.16.
D. Desain I/O Tampilan Product
Rancang desain I/O berikut ini merupakan tampilan product. Pada
halaman ini, customer dapat melihat produk yang dijual. Desain I/O product dapat
dilihat pada gambar 3.17.
E. Desain I/O Tampilan Product Detail
Rancang desain I/O berikut ini merupakan tampilan product detail. Pada
halaman ini, customer dapat melihat detil produk termasuk penjelasan tentang
spesifikasi produk. Desain I/O product detail dapat dilihat pada gambar 3.18.
F. Desain I/O Tampilan Cart
Rancang desain I/O berikut ini merupakan tampilan cart. Pada halaman
ini, customer dapat melihat produk yang akan dibeli dan jumlah total harga yang
harus dibayar. Desain I/O cart dapat dilihat pada gambar 3.19.
Gambar 3.19 Desain I/O Cart
Berikut ini adalah tampilan desain I/O setelah berhasil melakukan
pembelanjaan. Desain I/O halaman saat berhasil melakukan pembelanjaan dapat
Gambar 3.20 Desain I/O Success Page Order
G. Desain I/O Tampilan Payment Confirmation
Rancang desain I/O berikut ini merupakan tampilan payment
confirmation. Form ini digunakan untuk melakukan konfirmasi pembayaran.
Desain I/O payment confirmation dapat dilihat pada gambar 3.21.
H. Desain I/O Tampilan History
Rancang desain I/O berikut ini merupakan tampilan history. Pada
halaman ini, customer dapat melihat histori transaksi pembelian produk. Desain
I/O history dapat dilihat pada gambar 3.22.
I. Desain I/O Tampilan Wishlist
Rancang desain I/O berikut ini merupakan tampilan wishlist. Pada
halaman ini, customer dapat melihat produk yang telah disimpan pada tabel
wishlist. Desain I/O wishlist dapat dilihat pada gambar 3.23.
J. Desain I/O Tampilan Admin Product List
Rancang desain I/O berikut ini merupakan tampilan product list. Pada
halaman ini, admin dapat melihat daftar produk dan mencari produk yang akan
diubah. Desain I/O product list dapat dilihat pada gambar 3.24.
K. Desain I/O Tampilan Admin Product Create
Rancang desain I/O berikut ini merupakan tampilan product create. Form
ini digunakan untuk mengisi data produk. Desain I/O product create dapat dilihat
pada gambar 3.25.
L. Desain I/O Tampilan Admin Category List
Rancang desain I/O berikut ini merupakan tampilan category list. Pada
halaman ini, admin dapat melihat daftar produk dan mencari produk yang akan
diubah. Desain I/O category list dapat dilihat pada gambar 3.26.
Gambar 3.26 Desain I/O Category List
M. Desain I/O Tampilan Admin Category Create
Rancang desain I/O berikut ini merupakan tampilan category create.
Form ini digunakan untuk mengisi data kategori. Desain I/O category create
dapat dilihat pada gambar 3.27.
N. Desain I/O Tampilan Admin Order List
Rancang desain I/O berikut ini merupakan tampilan order list. Pada
halaman ini, admin dapat melihat daftar order dan menyetujui atau menolak
kofnrimasi order. Desain I/O order list dapat dilihat pada gambar 3.28.
Gambar 3.28 Desain I/O Order List
O. Desain I/O Tampilan Admin Laporan Penjualan
Rancang desain I/O berikut ini merupakan tampilan laporan penjualan.
Pada halaman ini, admin dapat melihat laporan penjualan berdasarkan jarak
tanggal yang diisikan. Desain I/O laporan penjualan dapat dilihat pada gambar
Gambar 3.29 Desain I/O Laporan Penjualan
P. Desain I/O Tampilan Admin Laporan Produk
Rancang desain I/O berikut ini merupakan tampilan laporan produk. Pada
halaman ini, admin dapat melihat laporan produk berdasarkan jarak tanggal yang
diisikan. Desain I/O laporan produk dapat dilihat pada gambar 3.30.
Q. Desain I/O Tampilan Admin Laporan Customer
Rancang desain I/O berikut ini merupakan tampilan laporan customer.
Pada halaman ini, admin dapat melihat laporan customer berdasarkan jarak
tanggal yang diisikan. Desain I/O laporan customer dapat dilihat pada gambar
3.31.
58
IMPLEMENTASI DAN EVALUASI SISTEM
4.1 Implementasi
Pada tahap ini, desain yang telah dibuat pada tahap sebelumnya
diimplementasikan dalam bentuk kode-kode program. Perangkat lunak lain
dibutuhkan pengembang untuk menuliskan kode-kode program dan juga
dibutuhkan pengembang untuk membangun database dari desain yang telah
dibuat pada tahap sebelumnya.
4.1.1 Kebutuhan Implementasi
Sistem yang dibangun oleh pengembang berbasiskan web. Untuk dapat
menjalankan sistem dengan baik, dibutuhkan beberapa persyaratan perangkat
keras dan perangkat lunak yang harus dipenuhi. Kebutuhan perangkat keras dan
perangkat lunak tersebut dibagi menjadi dua, yaitu kebutuhan perangkat keras dan
perangkat lunak untuk server dan kebutuhan perangkat keras dan perangkat lunak
untuk client.
A. Kebutuhan Perangkat Keras
Agar sistem yang telah dibangun berjalan dengan baik, server
membutuhkan spesifikasi perangkat keras yang memadai. Berikut ini adalah
spesifikasi server dari penyedia layanan hosting JAGOAN HOSTING:
1. Processor Intel Xeon E3-1270V3/E3-1241V3 3.5 GHz 4 Core
2. Memory RAM 16 Gb (up to 32 Gb)
Berikut ini adalah kebutuhan spesifikasi perangkat keras client untuk
mengakses website toko online:
1. PC atau Notebook dengan monitor resolusi 1280 x 800
2. Koneksi internet internet dengan kecepatan rata-rata 28Kbps – 128Kbps
B. Kebutuhan Perangkat Lunak
Pengguna tidak perlu memenuhi kebutuhan perangkat lunak server,
melainkan hanya kebutuhan perangkat lunak client. Berikut ini adalah kebutuhan
perangkat lunak server:
1. Linux CentOS 64 bit
2. Web Server: LAMPP
3. Database: MYSQL versi 5 keatas
4. Bahasa Pemrograman: PHP versi 5 keatas
5. Teknologi perangkat lunak pendukung: HTML, CSS, Javascript/JQuery
Sedangkan kebutuhan perangkat lunak untuk client untuk mengakses web
adalah Browser Mozilla Firefox versi terbaru dan Google Chrome versi terbaru.
4.1.2 Kebutuhan Hosting
Kebutuhan hosting website pada aplikasi penjualan online Nikita Baby
Shop ini menggunakan jasa layanan penyedia hosting dari JAGOAN HOSTING,
berikut ini adalah spesifikasi hosting yang digunakan dalam website penjualan
online Nikita Baby Shop:
1. Disk Space: 1 Gb
4.1.3 Implementasi Sistem
Pada sub bab ini akan dibahas tentang mengimplementasikan rancangan
sistem kedalam website Nikita Baby Shop. Berikut ini penjelasan dari
implementasi sistem.
A. Tampilan Registration Form
Tampilan registrasi digunakan untuk pendaftaran customer sebagai
member yang nantinya customer dapat melangkah ke tahap selanjutnya yaitu
tahap berbelanja secara online. Tampilan registrasi dapat dilihat pada gambar 4.1.
Gambar 4.1 Tampilan Registration Form
Berikut ini adalah tampilan halaman setelah berhasil melakukan
Gambar 4.2 Tampilan Success Page Registration
Setelah berhasil melakukan registrasi, customer wajib melakukan
aktivasi. Link aktifasi telah dikirim ke email yang telah didaftarkan. Tampilan
link aktivasi dapat dilihat pada gambar 4.3.
Berikut ini adalah tampilan halaman setelah berhasil melakukan verifikasi
pendaftaran member. Tampilan halaman berhasil verifikasi dapat dilihat pada
gambar 4.4.
Gambar 4.4 Tampilan Verification Success
B. Tampilan Login
Tampilan login digunakan customer untuk mengakses website ke tahap
pembelanjaan secara online. Tampilan login dapat dilihat pada gambar 4.5.
C. Tampilan Home
Tampilan home memberikan informasi kepada pengunjung website
mengenai produk terbaru dan produk terlaris. Tampilan home dapat dilihat pada
gambar 4.6.
D. Tampilan Product
Tampilan product ini merupakan daftar macam produk yang dijual.
Tampilan produk dapat dilihat pada gambar 4.7.
Gambar 4.7 Tampilan Product
E. Tampilan Product Detail
Tampilan product detail merupakan penjelasan spesifikasi tentang produk
yang dijual. Tampilan product detail dapat dilihat pada gambar 4.8.
F. Tampilan Cart
Tampilan cart digunakan untuk menyimpan data order yang dilakukan
oleh customer dan memberikan informasi daftar produk yang dibeli serta jumlah
total harga yang harus dibayar. Tampilan cart dapat dilihat pada gambar 4.9.
Gambar 4.9 Tampilan Cart
Setelah berhasil melakukan checkout, customer akan mendapatkan pesan
email yang berisi invoice pembelian produk. Tampilan invoice dapat dilihat pada
gambar 4.10.
G. Tampilan Payment Confirmation
Tampilan payment confirmation digunakan customer untuk melakukan
konfirmasi pembayaran. Tampilan payment confirmation dapat dilihat pada
gambar 4.11.
Gambar 4.11 Tampilan Payment Confirmation
H. Tampilan History
Tampilan history merupakan data histori transaksi pembelian yang
dimiliki tiap customer. Pada tabel history, customer dapat melihat status transaksi.
Gambar 4.12 Tampilan History
I. Tampilan Wishlist
Tampilan wishlist berfungsi untuk menyimpan data rencana produk yang
akan dibeli oleh customer. Tampilan wishlist dapat dilihat pada gambar 4.13.
J. Tampilan Admin Product List
Tampilan product list berfungsi untuk mencari data produk yang akan
diubah. Tampilan product list dapat dilihat pada gambar 4.14.
Gambar 4.14 Tampilan Product List
K. Tampilan Admin Category List
Tampilan category list berfungsi untuk mencari data kategori yang akan
diubah. Tampilan category list dapat dilihat pada gambar 4.15.
L. Tampilan Admin Product Create
Tampilan product create berfungsi untuk mengisi data produk. Tampilan
product create dapat dilihat pada gambar 4.16.
M. Tampilan Admin Category Create
Tampilan category create berfungsi untuk mengisi data kategori.
Tampilan category create dapat dilihat pada gambar 4.17.
Gambar 4.17 Tampilan Category Create
N. Tampilan Admin Order List
Tampilan order list digunakan admin untuk menyetujui atau menolak
order. Tampilan order list dapat dilihat pada gambar 4.18.
Gambar 4.18 Tampilan Order List
O. Tampilan Admin Laporan Penjualan
Tampilan laporan penjualan digunakan admin untuk melihat penjualan
berdasarkan jarak tanggal yang diisikan. Tampilan laporan penjualan dapat dilihat
Gambar 4.19 Tampilan Laporan Penjualan
P. Tampilan Admin Laporan Produk
Tampilan laporan produk digunakan admin untuk melihat penjualan
berdasarkan jarak tanggal yang diisikan. Tampilan laporan produk dapat dilihat
pada gambar 4.20.
Gambar 4.20 Tampilan Laporan Produk
Q. Tampilan Admin Laporan Customer
Tampilan laporan customer digunakan admin untuk melihat penjualan
berdasarkan jarak tanggal yang diisikan. Tampilan laporan customer dapat dilihat
pada gambar 4.21.
4.2 Uji Coba dan Evaluasi Sistem
Setelah sistem diimplementasikan, langkah berikutnya adalah melakukan
uji coba dan evaluasi sistem. Tujuan dari uji coba dan evaluasi sistem adalah
untuk mengetahui apakah sistem telah dibuat berjalan dengan baik sesuai output
dan tujuan yang telah diharapkan.
4.2.1 Uji Coba Sistem
Berikut ini adalah tabel rencana uji coba website penjualan online. Tabel
rencana uji coba website penjualan online dapat dilihat pada tabel 4.1.
Tabel 4.1 Rencana Uji Coba Website Penjualan Online
Requirement yang diuji Fungsi yang diuji
Registrasi Melakukan pendaftaran identitas diri
Login Melakukan login
Pencarian Produk Melakukan pencarian produk
Pemesanan Produk Melakukan transaksi penjualan
Konfirmasi Pembayaran Melakukan konfrmasi pembayaran
Kelola Data Produk Melakukan operasi create, read, update
pada data produk
Kelola Data Kategori Melakukan operasi create, read, update
pada data kategori
Kelola Data Order Melakukan operasi accept or reject pada
data order
Laporan Menampilkan laporan penjualan
Menampilkan laporan customer
A. Desain Uji Coba Registrasi
Proses uji coba registrasi dilakukan melalui dua test case. Test case yang
pertama adalah melakukan input data diri customer dengan mengisi Email, Nama,
Password, Jenis Kelamin, Tanggal Lahir, Alamat, Kota, Nomor Telepon. Test
case yang kedua adalah dengan melakukan input email yang sama yang akhirnya
sistem memberikan notifikasi kepada customer. Hasil uji coba registrasi dapat
dilihat pada tabel 4.2.
Tabel 4.2 Uji Coba Registrasi
Test Case ID : 1
Tujuan Yang Ingin Dicapai : Memasukkan data diri customer
Input : Email, Nama, Password, Jenis Kelamin,
Tanggal Lahir, Alamat, Kota, Nomor Telepon
Output yang diharapkan : Data customer berhasil disimpan dan sistem
mengirimkan link aktivasi ke email.
Test Case ID : 2
Tujuan Yang Ingin Dicapai : Memasukkan data diri customer dengan email yang sama
Input : Email, Nama, Password, Jenis Kelamin,
Tanggal Lahir, Alamat, Kota, Nomor Telepon
Output yang diharapkan : Muncul notifikasi bahwa email sudah terdaftar.
Status : Terpenuhi
B. Desain Uji Coba Login
Proses uji coba login dilakukan melalui dua test case. Test case yang
pertama adalah melakukan input username dan password yang telah terdaftar.
Test case yang kedua adalah dengan melakukan input username atau password
yang salah atau belum terdaftar yang akhirnya sistem memberikan notifikasi
Tabel 4.3 Uji Coba Login
Test Case ID : 1
Tujuan Yang Ingin Dicapai : Mengecek username dan password yang telah terdaftar
Input : Username dan Password
Output yang diharapkan : Berhasil login sebagai member yang terdaftar
Test Case ID : 2
Tujuan Yang Ingin Dicapai : Mengecek username dan password yang belum terdaftar
Input : Username dan Password
Output yang diharapkan : Muncul notifikasi username atau password
salah
C. Desain Uji Coba Pencarian Produk
Proses uji coba pencarian produk dilakukan melalui dua test case. Test
case yang pertama adalah melakukan input nama produk telah terdaftar. Test case
yang kedua adalah dengan melakukan input nama produk yang salah atau belum
terdaftar yang akhirnya sistem memberikan notifikasi kepada customer. Hasil uji
coba pencarian produk dapat dilihat pada tabel 4.4.
Tabel 4.4 Uji Coba Pencarian Produk
Test Case ID : 1
Tujuan Yang Ingin Dicapai : Melakukan pencarian produk dengan format yang benar.
Input : Nama Produk
Output yang diharapkan : Menampilkan data produk
Status : Terpenuhi
Test Case ID : 2
Tujuan Yang Ingin Dicapai : Melakukan pencarian produk dengan format yang salah.
Input : Nama Produk
Output yang diharapkan : Tidak menampilkan data produk
D. Desain Uji Coba Pemesanan Produk
Proses uji coba pemesanan produk dilakukan dengan masuk ke halaman
detil produk dan menambahkan produk ke keranjang belanja. Setelah itu,
customer masuk ke keranjang belanja untuk mengetahui total harga pembelanjaan
dan melakukan proses checkout. Hasil uji coba pemesanan produk dapat dilihat
pada tabel 4.5.
Tabel 4.5 Uji Coba Pemesanan Produk
Test Case ID : 1
Tujuan Yang Ingin Dicapai : Memasukkan data penjualan.
Input : Menekan tombol add to cart pada detil produk
Output yang diharapkan : Jumlah cart bertambah
E. Desain Uji Coba Konfirmasi Pembayaran
Proses uji coba konfirmasi pembayaran dilakukan dengan memasukkan
nomor invoice, bank, nama pemilik rekening, nomor rekening, tanggal transfer,
jumlah transfer dan catatan. Setelah itu, customer menunggu persetujuan order
dari admin. Hasil uji coba pemesanan produk dapat dilihat pada tabel 4.6.
Tabel 4.6 Uji Coba Konfirmasi Pembayaran
Test Case ID : 1
Tujuan Yang Ingin Dicapai : Memasukkan data transfer.
Input : Nomor invoice, bank, nama pemilik rekening,
nomor rekening, tanggal transfer, jumlah
transfer dan catatan
Output yang diharapkan : Status order
F. Desain Uji Coba Kelola Data Produk
Proses uji coba kelola data produk dilakukan untuk menguji create, read,
update pada data produk. Hasil uji coba kelola data produk dapat dilihat pada
Tabel 4.7 Uji Coba Kelola Data Produk
Test Case ID : 1
Tujuan Yang Ingin Dicapai : Menampilkan data produk.
Input : Memilih menu produk pada menu sidebar admin
Output yang diharapkan : Data produk
Status : Terpenuhi
Test Case ID : 2
Tujuan Yang Ingin Dicapai : Memasukkan data produk.
Input : Nama Produk, Gambar, Deskripsi, Jenis
Kelamin, Ukuran, Qty, Berat
Output yang diharapkan : Data produk berhasil disimpan dan ditampilkan
pada tabel produk
