RANCANG BANGUN APLIKASI PENJUALAN
ONLINE PADA CV. ABILINDO MITRA SEJAHTERA
TUGAS AKHIR
Program Studi
S1 Sistem Informasi
Oleh:
YUDIYANTO SALAY
09.41010.0195
FAKULTAS TEKNOLOGI DAN INFORMATIKA
x
DAFTAR ISI
Halaman
ABSTRAK ... vii
KATA PENGANTAR ... viii
DAFTAR ISI ... x
DAFTAR GAMBAR ... xiv
DAFTAR TABEL ... xviii
BAB I PENDAHULUAN ... 1
1.1 Latar Belakang Masalah ... 1
1.2 Perumusan Masalah... 4
1.3 Batasan Masalah ... 4
1.4 Tujuan... 4
1.5 Manfaat... 5
1.6 Sistematika Penulisan ... 5
BAB II LANDASAN TEORI ... 7
2.8 Hypertext Markup Language (HTML) ... 12
xi
Halaman
2.10 MySQL ... 12
2.11 Testing dan Implementation ... 14
BAB III ANALISIS DAN PERANCANGAN SISTEM ... 15
3.1 Identifikasi Permasalahan ... 14
3.1.1 Analisis Permasalahan... 18
3.2 Analisis Kebutuhan Sistem ... 18
3.3 Perancangan Sistem ... 24
3.3.1 Arsitektur Sistem ... 25
3.3.2 System Flow... 25
3.3.3 Data Flow Diagram (DFD) ... 32
3.3.4 Entity Relationship Diagram (ERD) ... 39
3.3.5 Struktur Tabel ... 43
3.3.6 Desain Interface (Antarmuka Pengguna) ... 49
BAB IV IMPLEMENTASI DAN EVALUASI ... 66
4.1 Kebutuhan Sistem ... 66
4.1.1 Kebutuhan Perangkat Keras (Hardware) ... 66
4.1.2 Kebutuhan Perangkat Lunak (Software) ... 66
4.2 Implementasi ... 67
4.2.1 Tampilan Menu Utama ... 67
4.2.2 Tampilan Halaman Katalog Product... 68
4.2.3 Tampilan Halaman Product ... 68
4.2.4 Tampilan Daftar Pelanggan ... 69
xii
4.2.7 Tampilan Form Contact Us... 71
4.2.8 Tampilan Form Payment Confirmation ... 71
4.2.9 Tampilan Form History ... 72
4.2.10 Tampilan Form Login ... 73
4.2.11 Tampilan Form Barang ... 73
4.2.12 Tampilan Form Tambah Barang ... 74
4.2.13 Tampilan Form Kategori ... 75
4.2.14 Tampilan Form Supplier ... 76
4.2.15 Tampilan Form Penjualan ... 77
4.2.16 Tampilan Form Penerimaan Barang ... 77
4.2.17 Tampilan Form Pembayaran ... 78
4.2.18 Tampilan Form Pengiriman Barang ... 79
4.2.19 Tampilan Laporan Penjualan ... 79
4.2.20 Tampilan Laporan Stock... 80
4.2.21 Tampilan Laporan Pelanggan Paling sering Belanja ... 80
4.2.22 Tampilan Laporan Penerimaan Barang ... 81
4.2.23 Tampilan Laporan Pembayaran ... 81
4.2.24 Tampilan Laporan List Member ... 82
4.2.25 Tampilan Laporan Barang Dikirim ... 82
4.2.26 Tampilan Laporan Barang Paliing Laris ... 83
BAB V PENUTUP ... 91
xiii
Halaman
5.2 Saran ... 91
DAFTAR PUSTAKA ... 92
xiv
Gambar 3.13 DFD Level 1 Transaksi Penerimaan Barang ... 35
xv
Halaman
Gambar 3.22 Desain Interface Tampilan Halaman Produk ... 50
Gambar 3.23 Desain Interface Tampilan Halaman About Us ... 50
Gambar 3.24 Desain Interface Tampilan Halaman Contact Us ... 51
Gambar 3.25 Desain Input Tampilan Login Pelanggan ... 52
Gambar 3.26 Desain Input Tampilan Registrasi ... 52
Gambar 3.27 Desain Input Tampilan Keranjang Belanja ... 53
Gambar 3.28 Desain Input tampilan Payment Confirmation ... 54
Gambar 3.29 Desain Interface Tampilan History ... 54
Gambar 3.30 Desain Interface Tampilan Produk ... 55
Gambar 3.31 Desain Input Buat Produk ... 56
Gambar 3.32 Desain Interface Tampilan Kategori ... 56
Gambar 3.33 Desain Input Tampilan Supplier ... 57
Gambar 3.34 Desain Input Tampilan Penerimaan Barang ... 58
Gambar 3.35 Desain Interface Tampilan Penjualan ... 58
Gambar 3.36 Desain Interface Pembayaran ... 59
Gambar 3.37 Desain Interface Tampilan Pengiriman Barang ... 60
Gambar 3.38 Desain Output Tampilan Laporan Penjualan ... 61
Gambar 3.39 Desain Output Pelanggan Paling Sering Belanja ... 61
Gambar 3.40 Desain Output Tampilan Laporan Stok ... 62
Gambar 3.41 Desain Output Tampilan Laporan Penerimaan barang ... 63
Gambar 3.42 Desain Output Tampilan Laporan List Pembayaran ... 63
Gambar 3.43 Desain Output Tampilan Laporan List Member ... 64
xvi
Gambar 4.18 Tampilan Form Pengiriman barang ... 79
Gambar 4.19 Tampilan Laporan Penjualan ... 79
Gambar 4.20 Tampilan Laporan Stock ... 80
Gambar 4.21 Tampilan Laporan Pelanggan Paling sering belanja ... 80
xvii
Halaman
Gambar 4.23 Tampilan Laporan Pembayaran ... 81
Gambar 4.24 Tampilan Laporan List Member ... 82
Gambar 4.25 Tampilan Laporan Barang Dikirim ... 82
xviii
Tabel 2.1 Simbol Perancangan Sistem ... 10
Tabel 3.1 Analisis Kebutuhan Sistem ... 19
Tabel 3.2 Struktur Tabel Barang ... 43
Tabel 3.3 Struktur Tabel Kategori ... 43
Tabel 3.4 Struktur Tabel Pelanggan ... 44
Tabel 3.5 Struktur Tabel Supplier ... 45
Tabel 3.6 Struktur Tabel Users ... 45
Tabel 3.7 Struktur Tabel Image_temp ... 46
Tabel 3.8 Struktur Tabel Penerimaan_barang ... 46
Tabel 3.9 Struktur Tabel Detail Penerimaan Barang ... 46
Tabel 3.10 Struktur Tabel Penjualan barang ... 47
Tabel 3.11 Struktur Tabel Detail penjualan Barang... 48
1
1.1 Latar Belakang Masalah
Pada era globalisasi, saat ini Indonesia merupakan salah satu negara dengan
posisi strategis sekaligus konsumtif. Usaha dagang harus dipahami baik oleh pelaku
bisnis dengan masyarakat sebagai target konsumen. Salah satunya dengan
menerapkan teknologi informasi untuk mendukung pemasaran dan meningkatkan
kinerja usaha dagang agar dapat bersaing dengan perusahaan lain. Penerapan
teknologi informasi yang efektif dapat mengurangi biaya dan meningkatkan
fleksibilitas usaha dagang.
Menurut eMarketer (2013), penjualan online diperkirakan meningkat 17%
menjadi US$ 1,2 triliun. Peningkatan tersebut dipimpin oleh pertumbuhan dikawasan
Asia-Pasifik. Pertumbuhan penjualan online di Indonesia meningkat dari tahun 2011
sebesar $560,000 menjadi $1,04 juta di 2012 dan terus meningkat menjadi $1,79 juta
di tahun 2013. Hal ini menunjukan bahwa semakin banyaknya orang yang
melakukan pembelian online.
CV. Abilindo Mitra Sejahtera merupakan perusahaan importir perlengkapan
anak-anak berupa baju, sepatu, kaos kaki, tas dan aksesoris. CV. Abilindo Mitra
Sejahtera memasang foto produk pada jejaring sosial facebook. Jika pembeli tertarik
pada produk tersebut dapat menghubungi via telepon atau Blackberry Messenger
(BBM). Setelah itu produk tersebut akan dicek ketersediannya, jika ada maka CV.
Abilindo Mitra Sejahtera akan memberitahukan nomor rekening kepada pembeli.
Setelah pembeli melakukan transfer uang sesuai dengan transaksi penjualan dan
dikirim melalui jasa pengiriman. CV. Abilindo Mitra Sejahtera sebagai
perusahaan bergerak di bidang perlengkapan anak-anak sangat memerlukan
pemasaran produk yang interaktif guna meningkatkan pendapatan perusahaan.
Berdasarkan riset yang dilakukan Kementerian Komunikasi dan Informatika
terhadap penggunaan internet untuk belanja online pada Jabodetabek, Bandung
dan Yogyakarta tahun 2013 dengan total populasi sebesar 19.192.581, maka
jumlah sampel yang diambil sebesar 460 orang. Hasil dari riset tersebut diperoleh
bahwa ibu rumah tangga ditemukan 47 persen belum pernah melakukan belanja
online dan 53 persen pengguna pernah melakukannya. Target pemasaran produk
ialah ibu-ibu yang mempunyai kesibukan baik itu sebagai ibu rumah tangga
maupun sebagai wanita karir, seringkali tidak sempat melihat langsung produk
yang ditawarkan karena jarak toko konvensional dengan rumah pelanggan yang
jauh. Selain itu jika C.V Abilindo Mitra Sejahtera membangun toko di luar kota
akan mengeluarkan biaya yang besar.
Permasalahan yang dihadapi CV. Abilindo Mitra Sejahtera ialah
banyak comment dari calon pembeli berulang-ulang tentang hal yang sama
misalnya harga barang. Pada facebook, comment tersebut akan menumpuk yang
mengakibatkan sulit dibaca. Hal ini merepotkan pihak pemilik harus mencari satu
persatu. Respon terhadap tanggapan yang lambat seringkali mengakibatkan
hilangnya ketertarikan pelanggan. Ketika personal page mencapai 5000
pertemanan, personal page otomatis berubah menjadi halaman atau lebih dikenal
dengan fanspage, mengakibatkan hilangnya semua foto produk. Setiap melakukan
posting, tidak semua teman pada friendlist dapat melihatnya. Agar dilihat oleh
tersebut dikenakan biaya tambahan dari facebook sebesar $7 per postingan atau
sekitar Rp.93.590,00.
Masalah lainnya CV. Abilindo Mitra Sejahtera tidak dapat mengirim
pesan terlebih dahulu kepada orang-orang pada friendlist maka dengan sistem ini
pelanggan dapat menerima pesan informasi produk baru berupa broadcast email.
Selain itu dari segi penjualan nota penjualan sering hilang, mengakibatkan hasil
perhitungan pendapatan menjadi tidak sesuai dengan sebenarnya. Maka
kesimpulan permasalahan tersebut CV. Abilindo Mitra Sejahtera mengalami
kendala dalam promosi produk dan penjualan melalui media sosial facebook
karena dampak dari masalah tersebut informasi produk susah disampaikan ke
pelanggan.
Untuk mengatasi permasalahan tersebut, maka dibuat katalog produk.
Pelanggan dapat leluasa memilih produk yang ingin dibeli. Sedangkan CV.
Abilindo Mitra Sejahtera tidak dikenakan biaya dalam menambahkan produk juga
gambar produk tidak hilang seperti pada media sosial facebook. Dari penjualan
dibuat shopping cart untuk memproses produk yang dibeli pelanggan. Pada proses
penjualan dihasilkan laporan penjualan, dapat disimpan pada sistem maka
perhitungan pendapatan akan sesuai dengan penjualan.
Berdasarkan permasalahan, maka CV. Abilindo Mitra Sejahtera
membutuhkan aplikasi penjualan online yang dapat memberikan informasi data
member, laporan penerimaan barang, stok barang, laporan barang paling laris,
laporan pelanggan paling sering belanja, laporan penjualan harian, laporan
dan list barang kirim dengan tujuan memberikan informasi yang dapat membantu
penjualan CV. Abilindo Mitra Sejahtera.
1.2 Perumusan Masalah
Berdasarkan uraian latar belakang masalah tersebut, maka perumusan
masalahnya adalah bagaimana merancang dan membangun aplikasi penjualan
online pada CV. Abilindo Mitra Sejahtera.
1.3 Batasan Masalah
Adapun yang menjadi batasan-batasan masalah dalam perangkat lunak
ini, yaitu:
1. Sistem ini hanya menggunakan pembayaran secara transfer uang melalui
rekening.
2. Pelanggan melakukan konfirmasi melalui SMS (short message service)
setelah melakukan pembayaran.
3. Proses pengiriman menggunakan jasa JNE dan sistem hanya nomor resi saja.
4. Sistem ini tidak menangani pengembalian produk.
5. Sistem ini tidak membahas keamanan website.
1.4 Tujuan
Berdasarkan perumusan masalah tersebut di atas, maka tujuan dalam
tugas akhir ini adalah menghasilkan rancang bangun aplikasi penjualan online
1.5 Manfaat
Adapun manfaat dari aplikasi yang akan dibangun nantinya adalah untuk
membantu CV. Abilindo Mitra Sejahtera dalam melakukan penjualan barang
kepada pelanggan dan memberikan laporan penjualan yang sesuai dengan
kebutuhan CV. Abilindo Mitra Sejahtera.
1.6 Sistematika Penulisan
Sistematika penulisan laporan tugas akhir ini adalah sebagai berikut :
Bab I: PENDAHULUAN
Bab ini berisi latar belakang masalah, perumusan masalah, pembatasan
masalah,tujuan, dan sistematika penulisan dari rancang bangun aplikasi
penjualan online pada CV. Abilindo Mitra Sejahtera
Bab II: LANDASAN TEORI
Bab ini berisi teori yang berkaitan dengan penjualan, toko online, sistem,
analisis kebutuhan sistem dan sistem informasi serta metode waterfall.
Teori ini digunakan untuk menyelesaikan permasalahan pada rancang
bangun aplikasi penjualan online di CV. Abilindo Mitra Sejahtera.
Bab III: ANALISIS DAN PERANCANGAN SISTEM
Bab ini berisi tentang pengerjaan sistem mulai dari analisis dan
perancangan sistem yang nantinya digunakan untuk merancang bangun
aplikasi penjualan online pada CV. Abilindo Mitra Sejahtera yang
meliputi identifikasi permasalahan, Arsitektur Sistem, Document Flow,
System Flow, Context Diagram, Data Flow Diagram (DFD), Contextual
Bab IV: IMPLEMENTASI DAN EVALUASI SISTEM
Bab ini berisi tentang implementasi dari analisis dan aplikasi yang dibuat
beserta penjelasan rancangan input dan output dari form aplikasi yang
telah dibuat. Adapun isi dari bab ini berupa implementasi dan evaluasi
sistem dengan menggunakan black box untuk uji coba aplikasi.
Bab V: PENUTUP
Bab ini berisi kesimpulan dari rancang bangun aplikasi penjualan online
pada CV. Abilindo Mitra Sejahtera yang selesai dikerjakan dan juga
7
BAB II
LANDASAN TEORI
2.1 Toko Online
Menurut Sigit (2010), toko dapat diartikan sebagai pasar kecil, yang
berisi kegiatan berupa transaksi jual beli antara pedagang dan pembeli. Seiring
berjalannya waktu konsep toko selalu berkembang dari waktu ke waktu, mulai
dari warung, pasar tradisional, toko kelontong, minimarket, supermarket,
hypermart dan toko online. Dengan semakin padatnya ritme dan gaya hidup orang
perkotaan dan dengan semakin berkembangnya teknologi internet, maka aktivitas
pergi belanja ke toko perlahan-lahan sudah mulai tergantikan dengan aktivitas
belanja melalui dunia maya. Toko online merupakan sebuah konsep, ide atau
gagasan tentang cara bertransaksi yang praktis dan mudah.
2.2 Penjualan
Menurut Suryananta (2008), penjualan mempunyai pengertian secara
umum yaitu proses dimana terjadi perubahaan suatu produk berupa barang atau
jasa dari suatu perusahaan menjadi kas. Penjualan merupakan fungsi paling
penting dalam pemasaran karena terjadi tulang punggung kegiatan untuk
mencapai pasar.
Penjualan juga memiliki fungsi sebagai sumber pendapatan yang
diperlukan untuk menutup ongkos-ongkos dengan harapan bisa memberikan laba.
diusahakan sejauh mungkin agar barang atau jasa tersebut dapat terjual. Oleh
karena itu, perlu adanya berbagai macam cara untuk memajukan penjualan,
seperti periklanan, peragaan dan lain sebagainya.
2.3 Waterfall
Menurut Pressman (2015), 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:
Sumber: Pressman (2015)
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 pemilaharaan
sistem secara berkala.
2.4 Internet
Menurut Sibero (2011), internet (interconnected network) adalah
jaringan computer yang menghubungkan antar jaringan secara global, internet
lokal maupun jaringan komputer area, internet juga menggunakan protocol
komunikasi yang sama yaitu TCP/IP (transmission control protocol / internet
protocol).
2.5 Website
Menurut Sibero (2011), website adalah suatu sistem yang berkaitan
dengan dokumen digunakan sebagai media untuk menampilkan teks, gambar
multimedia, dan lainnya pada jaringan internet.
2.6 System Flow
Menurut Krismiaji (2010), System flow atau bagan alir sistem merupakan
bagan yang menunjukkan arus pekerjaan secara keseluruhan dari sistem. System
flow menunjukkan urutan-urutan dari prosedur yang ada di dalam sistem dan apa
yang dikerjakan sistem. Berikut ini merupakan simbol perancangan sistem:
Tabel 2.1 Simbol Perancangan Sistem
Simbol Keterangan
Menandakan dokumen , bisa dalam bentuk surat,
formulir, buku/bendel/berkas atau cetakan.
Multi dokumen
Proses manual
Simbol Keterangan
Menandakan dokumen yang diarsipkan (arsip manual).
Data penyimpanan (data storage)
Proses apa saja yang tidak terdefinisi termasuk aktivitas
fisik.
Terminasi yang mewakili simbol tertentu untuk
digunakan pada aliran lain pada halaman yang lain.
Pada aliran lain pada halaman terminasi yang mewakili
simbol tertentu untuk halaman yang digunakan sama.
Terminasi yang menandakan awal dan akhir dari suatu
aliran.
Pengambilan keputusan (decision).
Layar peraga (monitor).
Pemasukan data secara manual.
2.7 DFD
Menurut Jogiyanto (2005), “Data flow diagram (DFD)” merupakan
diagram yang menggunakan notasi-notasi (simbol-simbol) untuk menggambarkan
sistem yang sedang berjalan atau berlangsung dan juga menggambarkan sistem
baru yang diusulkan, secara logika data flow diagram menguraikan bagaimana
data berasal dan kemana akan menuju.
2.8Hypertext Markup Language (HTML)
Menurut Winarno dkk. (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
global. Sebuah dokumen HTML sendiri adalah dokumen teks yang dapat diedit
oleh editor teks apapun. Dokumen HTML punya beberapa elemen yang dikelilingi
oleh tag-teks yang dimulai dengan symbol < dan berakhir dengan symbol >.
2.9Hypertext Preprocessor (PHP)
Menurut Winarno dkk. (2011), PHP atau hypertext preprocessor adalah
sebuah bahasa pemrograman web berbasis server (server-side) yang mampu
memparsing kode php dari kode web dengan ekstensi .php, sehingga
menghasilkan tampilan website yang dinamis di sisi client (Browser). Dengan
PHP bisa menjadikan halaman HTML menjadi lebih powerful dan bisa dipakai
sebagai aplikasi lengkap, misalnya untuk beragam aplikasi cloud computing.
2.10 MySQL
Menurut Aditya (2011), MySQL adalah sebuah implementasi dari sistem
dibawah lisensi GPL (General Public License). MySQL sebenarnya merupakan
turunan salah satu konsep utama dalam basis data yang telah ada sebelumnya;
SQL (Structured Query Language). SQL adalah sebuah konsep pengoperasian
data dikerjakan dengan mudah secara otomatis.
MySQL memeliki beberapa keistimewaan, antara lain:
1. Portabilitas. MySQL dapat berjalan stabil pada berbagai sistem operasi
seperti windows, linux, mac os x server dan lain-lain.
2. Perangkat lunak sumber terbuka sehingga dapat digunakan secara gratis.
3. Multi-user. MySQL dapat digunakan oleh beberapa pengguna secara
bersamaan.
4. Performance tuning. MySQL memeliki kecepatan dalam menangani query
sederhana.
5. Ragam tipe data. MySQL memeliki ragam tipe data seperti signed/unsigned
integer, float, double, char, text, date, timestamp, dan lain-lain.
6. Perintah dan fungsi, MySQL memeliki operator dan fungsi secara penuh
mendukung perintah Select dan Where dalam perintah (query).
7. Keamanan. MySQL memliki beberapa lapisan keamanan seperti level
subnetmask, nama host, dan izin akses user dengan sistem perizinan yang
mendetail serta sandi terenskripsi.
8. Skalabilitas dan pembatasan. MySQL mampu menangani basis data dalam
skala besar, dengan jumlah rekaman (records) lebih besar dari 50 juta dan
60 ribu table serta 5 milyar baris.
9. Konektivitas. MySQL dapat melakukan koneksi dengan klien menggunakan
10. Lokalisasi. MySQL dapat mendeteksi pesan kesalahan pada klien dengan
menggunakan lebih dari 20 ribu bahasa.
11. Antar muka. MySQL memeliki antar muka (interface) terhadap berbagai
aplikasi dan bahasa pemrograman dengan menggunakan fungsi API
(Application Programming Interface).
12. Klien dan peralatan. MySQL dilengkapi dengan peralatan yang dapat
digunakan untuk administrasi basis data.
13. Struktur tabel. MySQL memeliki struktur tabel yang lebih fleksibel dalam
menangani alter table, dibandingkan basis data lainnya.
2.11 Testing dan Implementation
Menurut Romeo (2003), Testing software adalah proses mengoperasikan
software dalam suatu kondisi yang dikendalikan, untuk menverifikasi apakah
telah berlaku sebagaimana telah ditetapkan (menurut spesifikasi), mendeteksi
error, dan menvalidasi apakah spesifikasi yang telah ditetapkan sudah memenuhi
15 BAB III
ANALISIS DAN PERANCANGAN SISTEM
Pada bab ini akan dibahas tentang identifikasi masalah, analisis
permasalahan dan perancangan sistem dalam Rancang Bangun Aplikasi Penjualan
Online pada CV. Abilindo Mitra Sejahtera. Dalam melakukan identifikasi dan
analisis permasalahan menggunakan metode waterfall dengan tahapan yang
dilakukan secara berurutan. Adapun hasil dari identifikasi dan analisis sebagai
berikut.
3.1 Identifikasi Permasalahan
Untuk mengidentifikasi masalah yang terjadi maka dilakukan wawancara
dan observasi untuk memperoleh data permasalahan pada CV. Abilindo Mitra
Sejahtera.
Document flow penjualan merupakan transaksi penjualan yang masih
manual pada CV. Abilindo Mitra Sejahtera. Document flow penjualan di CV.
Abilindo Mitra Sejahtera dimulai dari admin mengunggah gambar barang di
Facebook kemudian menambahkan teman yaitu calon pelanggan. jika calon
pelanggan tertarik dapat melakukan konfirmasi barang via BBM (Blackberry
messenger), barang ada maka pelanggan melakukan pembayaran setelah itu
melakukan konfirmasi pembayaran. Maka admin akan membuat nota pembayaran
yang diberikan kepada pelanggan dan membuat laporan penjualan berdasarkan
nota pembayaran. Dari nota pembayaran admin menyiapkan barang yang siap
dikirim dan diserahkan pada jasa pengiriman barang. Lalu akan diberikan nomor
maka akan diarsipkan. Berikut ini merupakan dokumen flow penjualan pada CV.
Abilindo Mitra Sejahtera:
Dokumen flow penjualan
Pelanggan Admin owner Jasa Pengiriman JNE
P
Proses bisnis CV. Abilindo Mitra Sejahtera dimulai dengan admin
memasukan data produk berupa gambar pada media sosial facebook, kemudian
admin akan menambahkan pertemanan bagi calon pelanggan. Ketika calon
pelanggan tertarik dapat menghubungi CV. Abilindo Mitra Sejahtera via BBM.
Setelah itu produk tersebut dicek ketersediaannya, jika ada maka CV. Abilindo
Mitra Sejahtera akan memberitahukan nomor rekening kepada pembeli. Setelah
pembeli melakukan transfer uang dan konfirmasi ke CV. Abilindo Mitra Sejahtera
maka barang langsung dikirim melalui jasa pengiriman.
Permasalahan yang paling sering terjadi ialah banyak comment dari
calon pelanggan berulang-ulang tentang hal yang sama misalnya harga barang.
Pada Facebook, comment tersebut akan menumpuk yang mengakibatkan sulit
dibaca. Hal ini merepotkan pihak pemilik harus mencari satu persatu. Respon
terhadap tanggapan yang lambat seringkali mengakibatkan hilangnya ketertarikan
pelanggan. Ketika personal page mencapai 5000 pertemanan, personal page
otomatis berubah menjadi halaman atau lebih dikenal dengan fanspage,
mengakibatkan hilangnya semua foto produk. Setiap melakukan posting, tidak
semua teman pada friendlist dapat melihatnya. Agar dilihat oleh semua orang
harus menggunakan fitur khusus yang disediakan Facebook. Fitur tersebut
dikenakan biaya tambahan dari Facebook sebesar $7 per postingan atau sekitar
Rp.93.590,00. Selain itu dari segi penjualan nota penjualan sering hilang,
mengakibatkan hasil perhitungan pendapatan menjadi tidak sesuai dengan
3.1.1 Analisis Permasalahan
Analisis permasalahan pada CV. Abilindo Mitra Sejahtera dapat
disimpulkan mengalami kendala dalam pemasaran produk dan penjualan melalui
media sosial Facebook karena dampak dari masalah tersebut informasi produk
sulit disampaikan ke pelanggan. Berikut ini rincian hasil analisis permasalahan
pada CV. Abilindo Mitra Sejahtera:
Pertemanan di Facebook ketika mencapai 5000 pertemanan menjadikan
profil page menjadi fans page maka data gambar produk terhapus.
Nota penjualan sering hilang mengakibatkan hasil perhitungan pendapatan
tidak sesuai dengan sebenarnya.
Maka alternatif solusi yang ditawarkan yaitu perlu dibuat website penjualan
online pada CV. Abilindo Mitra Sejahtera.
3.2 Analisis Kebutuhan Sistem
Berdasarkan analisis permasalahan, hasil analisis berupa diperlukan suatu
aplikasi yang dapat menghasilkan informasi yang lengkap pada sistem penjualan
online pada CV. Abilindo Mitra Sejahtera. Pada halaman website frontend
pelanggan, shopping cart atau keranjang belanja dibuat untuk mempermudah
pelanggan untuk melakukan transaksi pembelian. Pada halaman backend, untuk
memproses laporan, aplikasi dapat mencetak laporan penjualan berdasarkan
periode, laporan penerimaan barang, laporan stok, laporan. Dapat dilihat pada
Tabel 3.1 Analisis Kebutuhan Sistem
No Pengguna Kebutuhan Informasi Yang dihasilkan
1 Admin
Data pelanggan
Data pengiriman barang
Data konfirmasi
pembayaran
Data penerimaan barang
Order dari pelanggan
Laporan list member
List transaksi barang
dikirim
List pembayaran
Laporan penerimaan
barang dan stock barang
2 Pelanggan
dijual via katalog halaman produk website
Data barang paling laris
Data pelanggan yang
paling sering belanja
Laporan penjualan harian,
bulanan, tahunan
Laporan barang paling
laris
Laporan pelanggan yang
paling sering belanja
Berdasarkan hasil analisis permasalahan dibutuhkan identifikasi
(input-proses-output) untuk mendukung fitur yang terdapat pada Rancang Bangun
Aplikasi Penjualan Online. Maka dirancang blok diagram pada penjualan online,
Blok Diagram
Gambar 3.2 Blok Diagram
Pada blok diagram diatas menampilkan proses berupa input, proses dan
output pada Rancang Bangun Aplikasi Penjualan Online dengan penjelasan
A. Input
1. Data Pelanggan
Data pelanggan digunakan sebagai input untuk menyimpan data informasi
pelanggan berupa nama pelanggan, alamat, nomot telepon, jenis kelamin,
kota dan email pelanggan.
2. Data Barang diterima
Data Barang diterima merupakan input dari proses penerimaan barang berupa
nama produk, jumlah, harga beli.
3. Data Supplier
Data Supplier merupakan input dari proses penerimaan barang berupa nama
supplier, alamat, nomor telepon.
4. Data Pelanggan
Data pelanggan pada input proses transaksi penjualan berfungsi agar
mengetahui pelanggan mana yang melakukan transaksi penjualan.
5. Data Penjualan
Data penjualan merupakan input transaksi pembayaran berupa data transaksi
barang yang dibeli pelanggan.
6. Data Pembayaran Transaksi
Data Pembayaran Transaksi merupakan input transaksi pembayaran berupa
nomor rekening, nama pemilik rekening, jumlah transfer dan tanggal transfer.
7. Nomor Resi
Nomor Resi merupakan input dari proses pengiriman barang yang akan
8. Tanggal Pengiriman Barang
Tanggal Pengiriman Barang merupakan input dari proses pengiriman barang
yang akan menjadi paramaeter menampilkan data pengiriman barang.
B. Proses
1. Daftar Member
Daftar member merupakan proses menyimpan data calon pelanggan yang
nanti nya menjadi pelanggan.
2. Transaksi Penerimaan Barang
Transaksi Penerimaan Barang merupakan proses masuk nya barang dari
supplier. Proses ini dapat menyimpan informasi tanggal penerimaan, nama
produk, jumlah, harga beli dan nama supplier.
3. Transaksi Penjualan
Transaksi Penjualan merupakan proses pelanggan melalukan pembelian
barang yang diproses melalu sistem berupa keranjang belanja atau shoping
cart.
4. Transaksi Pembayaran
Transaksi Pembayaran merupakan proses admin melakukan pengecekan data
pembayaran yang telah dilakukan pelanggan melalui payment confirmation
pada aplikasi penjualan online
10.Pengiriman Barang
Pengiriman Barang merupakan proses admin melakukan pengecekan barang
dikirm maka admin akan menginputkan nomor resi yang diterima dari jasa
pengiriman dan dikirimkan via email ke pelanggan.
C. Output
1. List Member
List Member merupakan output dari proses daftar member berupa list
pelanggan yang sudah terdaftar berupa nama pelanggan, alamat, email, jenis
kelamin, tanggal lahir.
2. Stok Barang
Stock Barang merupakan output dari proses penerimaan barang berupa
informasi barang yang ada.
3. Laporan Barang Paling Laris
Laporan Barang Paling Laris merupakan output dari proses transaksi
penjualan berupa informasi 5 barang yang paling laris dengan informasi nama
barang dan jumlah
4. Laporan Pelanggan Paling Sering Belanja
Laporan Pelanggan Paling Sering Belanja merupakaan output dari proses
transaksi penjualan menampilkan informasi nama pelanggan, email, dan
banyak belanja.
5. Laporan Penjualan Harian
Laporan Penjualan Harian merupakan output dari proses transaksi penjualan
6. Laporan Penjualan Bulanan
Laporan Penjualan Bulanan merupakan output dari proses transaksi penjualan
menampilkan informasi pendapatan perbulan.
7. Laporan Penjualan Tahunan
Laporan Penjualan Tahunan merupakan output dari proses transaksi
penjualan menampilkan informasi pendapatan pertahun.
8. Invoice Penjualan
Invoice Penjualan merupakan output dari proses transaksi penjualan berupa
rincian transaksi penjualan produk nama barang, harga, jumlah, subtotal dan
total harga yang dibayar.
9. List Pembayaran
List Pembayaran merupakan output dari proses transaksi pembayaran berupa
laporan pelanggan yang telah melakukan pembayaran.
10.List Transaksi Barang Dikirim
List Transaksi Barang Dikirim merupakan output dari proses pengiriman
barang berisi informasi data barang yang dikirim.
3.3 Perancangan Sistem
Dari hasil identifikasi dan analisis penjualan pada CV. Abilindo Mitra
Sejahtera dirancang aplikasi dalam Rancang Bangun Aplikasi Penjualan online
pada CV. Abilindo Mitra Sejahtera yang dapat memberikan informasi katalog
produk agar pelanggan dapat leluasa memilih produk dan shopping cart untuk
Maka perlu dilakukan langkah-langkah sebagai berikut:
1. Arsitektur Sistem
2. System Flow.
3. Context Diagram.
4. Data Flow Diagram (DFD).
5. ERD.
6. Desain Struktur Tabel
7. Desain Interface (Interface).
3.3.1 Arsitektur Sistem
Pada arsitektur sistem dijelaskan gambaran data diproses dan disimpan
pada aplikasi penjualan online CV. Abilindo Mitra Sejahtera.
Admin
Pelanggan Server
Pelanggan
Gambar 3.3 Arsitektur Sistem
3.3.2 System Flow
System Flow yang dirancang untuk menyelesaikan permasalahan di CV.
A. System Flow Daftar Member
Pada system flow daftar member ini merupakan alur proses pendaftaran
pelanggan. Proses yang ada pada sistem ini dimulai dengan pelanggan
memasukan data pelanggan, setelah itu sistem akan melakukan simpan data
pelanggan dan mengirim email konfirmasi. Langkah berikutnya pelanggan harus
melakukan konfirmasi email, Maka kemudian sistem akan melakukan update
status pelanggan pada tabel pelanggan. Proses system flow daftar member dapat
dilihat di gambar 3.4.
Sistem flow Daftar member
Gambar 3.4 System Flow Daftar Member
B. System Flow transaksi penerimaan barang
System flow transaksi penerimaan barang ini merupakan alur proses
dimulai ketika supplier memberikan data berupa nota penerimaan barang dan data
supplier. Admin menerima nota penerimaan barang dari supplier dan setelah itu
admin melakukan input data supplier dan data barang masuk data barang masuk
akan disimpan pada tabel penerimaan barang. Setelah itu sistem akan
memperbaharui tabel barang kemudian menampilkan laporan penerimaan barang
dan menampilkan laporan stok barang. Proses system flow penerimaan barang
dapat dilihat di gambar 3.5.
Sistem flow transaksi penerimaan barang
Supplier Sistem + Admin
data ba rang bara ng Deta il penerimaan
bara ng
Selesai
Gambar 3.5 System Flow Transaksi Penerimaan Barang
C. System Flow Transaksi Penjualan
System flow transaksi penjualan ini merupakan alur proses transaksi
penjualan yang dilakukan pelanggan. Pada system flow transaksi penjualan ini
proses dimulai saat pelanggan mencari data barang kemudian memasukan ke
sistem akan menampilkan display total bayar dan mengirimkan invoice penjualan
via email. Proses system flow penjualan dapat dilihat di gambar 3.6.
Sistem flow transaksi penjualan
Gambar 3.6 System Flow Transaksi Penjualan
D. System Flow Pembayaran
System flow pembayaran merupakan proses pelanggan melakukan
data pembayaran sesuai dengan invoice penjualan pada payment confirmation dan
admin akan melakukan pengecekan lalu mengubah status bayar pelanggan. Owner
dapat mencetak list pembayaran. Proses system flow pembayaran dapat dilihat di
gambar 3.7.
Sistem flow transaksi penerimaan barang
Supplier Sistem + Admin
Gambar 3.7 system flow Pembayaran
E. System Flow Pengiriman Barang
System flow pengiriman barang merupakan proses admin melakukan
perubahan status packing dan sistem akan mengirimkan nomor resi via email.
Proses ini dimulai dengan admin mengubah status packing dari paid menjadi
ready berdasarkan list pembayaran dan menginputkan data nomor resi maka status
dikirim diberikan ke jasa pengiriman JNE. Maka dari pihak jasa pengiriman akan
memberikan nomor resi barang yang nanti nya disimpan dan dikirim via email.
Proses system flow pengiriman barang dapat dilihat di gambar 3.8.
System flow pengiriman barang
Jasa Pengiriman Admin + sistem pelanggan
P
Gambar 3.8 system flow Pengiriman barang
F. System Flow Laporan
System flow laporan merupakan proses owner melihat hasil laporan. Proses
Sistem Flow laporan
3.3.3 Data Flow Diagram (DFD)
A.Context Diagram
Setelah melakukan perancangan desain system flow, langkah selanjutnya
yaitu merancang pembuatan Data Flow Diagram (DFD). Data flow diagram akan
digunakan pada studi kasus aplikasi penjualan online untuk memudahkan dalam
mengidentifikasi data yang dibutuhkan sebagai masukan proses dan informasi
keluaran dari proses. Dalam mengidentifikasi data tersebut dapat ditentukan pula
data apa saja yang akan disimpan dalam database, data-data tersebut dapat
digunakan dalam menentukan kolom yang berada pada tabel basis data.
Pada context diagram dideskripsikan entity yang saling berhubungan
dengan sistem dan aliran data secara terstruktur. Desain dari context diagram
analisis dan perancangan sistem penjualan online dapat dijelaskan pada gambar
3.10.
Laporan pelanggan paling s ering belanja
data Supplier Data s tatus Bayar Data Barang
nomor res i
Data pelanggan Data penerimaan barang
0
Rancang Bangun Aplikas i Penjualan Online Pada CV Abilindo Mitra Sejahtera
Pada context diagram dapat dijelaskan bahwa rancang bangun aplikasi
penjualan online memeliki 4 entity atau pihak yang berperan penting pada proses
bisnis penjualan online. Pihak pertama adalah pelanggan, untuk melakukan
transaksi penjualan diperlukan data pelanggan berupa informasi alamat dan nama
pelanggan dan data pembelian yang dilakukan pelanggan. Data tersebut akan
menjadi input pada sistem yang dirancang dan diproses menjadi output email
konfirmasi, email invoice penjualan, sedangkan email nomor resi diperoleh dari
nomor resi yang diolah pada sistem. Pihak Supplier, untuk transaksi penerimaan
barang diperlukan data barang diterima dan data supplier. Pihak jasa pengiriman
JNE, untuk proses pengiriman barang diperlukan data nomor resi. Pihak owner,
untuk proses pembayaran dan cetak laporan diperlukan status bayar dari
pelanggan dan data penjualan, data barang, data pembayaran yang akan diproses
menjadi laporan seperti laporan penjualan, laporan barang paling laris dan
sebagainya.
B.DFD Level 0
Rancang bangun aplikasi penjualan online di DFD level 0 mempunyai 7
proses. Proses daftar member, transaksi penjualan, transaksi penerimaan barang,
pembayaran, pengiriman barang, master dan laporan dapat dilihat dalam gambar
C.DFD Level 1 Daftar Member
Rancang bangun aplikasi penjualan online pada DFD level 1 daftar
member mempunyai 2 proses. Proses menyimpan data pelanggan dan mengirim
email konfirmasi dapat dilihat dalam gambar dibawah ini:
Gambar 3.12 DFD level 1 Daftar Member
D.DFD Level 1 Transaksi Penerimaan Barang
Rancang bangun aplikasi penjualan online pada DFD level transaksi
penerimaan barang mempunyai 2 proses. Proses menyimpan data barang masuk
dan memperbaharui data barang dapat dilihat dalam gambar dibawah ini:
E.DFD Level 1 Transaksi Penjualan
Rancang bangun aplikasi penjualan online pada DFD level 1 transaksi
penjualan mempunyai 3 proses. Proses melakukan login, menyimpan data
transaksi penjualan, mengirimkan invoice penjualan via email dapat dilihat dalam
gambar dibawah ini:
Gambar 3.14 DFD level 1 Transaksi Penjualan
F. DFD Level 1 Transaksi Pembayaran
Rancang bangun aplikasi penjualan online pada DFD level 1 transaksi
pembayaran mempunyai 2 proses. Proses memasukan data pembayaran,
Gambar 3.15 DFD level 1 Transaksi Pembayaran
G.DFD Level 1 Transaksi Pengiriman Barang
Rancang bangun aplikasi penjualan online pada DFD level 1 transaksi
pengiriman barang mempunyai 3 proses. Proses menampilkan list barang dikirim,
simpan nomor resi barang, mengirim email nomor resi dapat dilihat dalam gambar
dibawah ini:
H.DFD Level 1 Mencetak Laporan
Rancang bangun aplikasi penjualan online pada DFD level 1 mencetak
laporan mempunyai 8 proses. Mencetak laporan member, laporan barang paling
laris, laporan penerimaan barang, laporan pelanggan sering belanja, laporan
penjualan, laporan pembayaran, laporan stok barang, laporan barang dikirim dapat
dilihat dalam gambar dibawah ini:
I. DFD level 1 Maintenance Master
Rancang bangun aplikasi penjualan online pada DFD level 1
maintenance master mempunyai 4 proses. Proses pengelolaan data master barang,
kategori, supplier dapat dilihat dalam gambar di bawah ini:
Gambar 3.18 DFD Level 1 Maintenance Master
3.3.4 Entity Relationship Diagram (ERD)
Entity Relationship Diagram (ERD) adalah desain sistem yang
digunakan untuk menjelaskan, menentukan dan mendokumentasikan keperluan
untuk sistem pemrosesan database. Gambar berikut akan menjelaskan relasi-relasi
atau hubungan antar tabel rancang bangun aplikasi penjualan online di CV.
Abilindo Mitra Sejahtera dalam bentuk conceptual data model (CDM) dan
physical data model (PDM).
A. Conceptual Data Model (CDM)
Pada studi kasus aplikasi penjualan online ini, conceptual data model
B. Physical Data Model (PDM)
Pada studi kasus aplikasi penjualan online ini physical data model akan
menjelaskan lebih detail mengenai kebutuhan data serta menggambarkan
hubungan data-data tersebut dalam bentuk tabel-tabel. Physical data model
biasanya dapat digunakan untuk menghitung perkiraan penyimpanan termasuk
rincian alokasi penyimpanan khusus untuk sistem basis data tertentu. Data yang
diidentifikasi pada data flow diagram akan digunakan dalam menentukan
kolom-kolom tabel database pada physical data model.
Physical data model dapat dilihat pada gambar 3.20.
Daftar tabel hasil generate PDM adalah sebagai berikut :
1. Pelanggan
8. Detail penerimaan barang
9. Payment confirmation
10. Kategori
3.3.5 Struktur Tabel
Rancang bangun aplikasi penjualan online pada CV. Abilindo Mitra
Sejahtera ini terdapat 11 tabel. Berikut penjelasan struktur tabel dari setiap tabel:
1. Tabel Barang
Primary Key : Id_produk
Foreign Key : Id_kategori
Fungsi : Untuk menyimpan dan menampilkan data nama barang
Tabel 3.2 Struktur Tabel Barang
Field Type Data Length Constraint
Id_produk Varchar 25 Primary key
Id_kategori Varchar 25 Foreign key
Nama_produk Varchar 125 -
Primary Key : Id_ketegori
Foreign Key :-
Fungsi : Untuk menyimpan dan menampilkan data kategori
Tabel 3.3 Struktur Tabel Kategori
Field Type Data Length Constraint
id_kategori varchar 25 primary key
3. Tabel Data Pelanggan
Primary Key : email
Foreign Key :
Fungsi : Untuk menyimpan dan melihat data pelanggan
Tabel 3.4 Struktur Tabel Data Pelanggan
Field Type Data Length Constraint
Email Varchar 125 primary key
Id_pelanggan Integer - -
Nama_pelanggan Varchar 125 -
Jenis_kelamin Varchar 25 -
Tgl_lahir Date - -
Alamat_pelanggan Varchar 300 -
Phone Varchar 12 -
Password Varchar 60 -
Provinsi Varchar 125 -
Kota Varchar 125 -
Status_konfirm Varchar 125 -
Status_Member Varchar 125 -
4. Tabel Supplier
Primary Key : Id_supplier
Foreign Key : -
Tabel 3.5 Struktur Tabel Supplier
Field Type Data Length Constraint
Id_supplier Varchar 25 primary key
Nama_supplier Varchar 125 -
Alamat_supplier varchar 125 -
Phone varchar 25 -
5. Tabel users
Primary Key : Id_user
Foreign Key : -
Fungsi : Untuk menjadi data login
Tabel 3.6 Struktur Tabel Users
Field Type Data Length Constraint
Id_user varchar 25 foreign key
Username varchar 25 foreign key
Status Integer - -
Password Integer - -
Usr_group Integer - -
Email Varchar 50
6. Tabel image_temp
Primary Key : Id_gambar
Foreign Key : Id_produk
Tabel 3.7 Struktur Tabel image_temp
Field Type Data Length Constraint
Id_gambar Varchar 25 primary key
Id_produk Varchar 25 foreign key
Nama_file Varchar 30 -
7. Tabel Peneriman_barang
Primary Key : Id_penerimaan_barang
Foreign Key : Id_supplier
Fungsi : Untuk menyimpan dan melihat data pembelian
Tabel 3.8 Struktur Tabel Penerimaan Barang
Field Type Data Length Constraint
Id_penerimaan_barang Varchar 25 Primary key
Id_supplier Varchar 25 foreign key
Tgl_terima Date - -
8. Tabel Detail Penerimaan Barang
Primary Key : -
Foreign Key : Id_produk
Foreign Key : Id_penerimaan barang
Fungsi : Untuk menyimpan dan melihat data detail penerimaan
barang
Tabel 3.9 Struktur Tabel Detail Penerimaan Barang
Field Type Data Length Constraint
Id_produk Varchar 25 foreign key
Field Type Data Length Constraint
Jumlah Integer - -
Harga_beli Integer - -
9. Tabel Penjualan Barang
Primary Key : Id_order
Foreign Key : email
Fungsi : Untuk menyimpan transaksi penjualan barang
Tabel 3.10 Struktur Tabel Penjualan Barang
Field Type Data Length Constraint
Id_order varchar 25 primary key
10.Tabel Detail Penjualan Barang
Primary Key : Id_order
Primary Key : Id_produk
Foreign Key : -
Fungsi : Untuk menyimpan dan melihat data detail penjualan
Tabel 3.11 Struktur Tabel Detail Penjualan Barang
Field Type Data Length Constraint
Id_order Varchar 25 primary key
Id_produk Varchar 25 Primary key
Detail_subtotal Integer - -
Detail_jumlah Integer - -
Biaya_kirim Integer - -
11.Tabel Payment Confirmation
Foreign Key : Id_order
Fungsi : Untuk menyimpan payment confirmation
Tabel 3.12 Struktur Tabel payment confirmation
Field Type Data Length Constraint
Id_order varchar 25 Foreign key
Jenis_pembayaran Varchar 50 -
Bank Varchar 50 -
No_rekening Varchar 25 -
Pemilik_rekening Varchar 100 -
Tgl_transfer Date - -
Jumlah_transfer Integer - -
Catatan Long
varchar
3.3.6 Desain Interface (Antarmuka Pengguna)
Desain interface merupakan rancangan desain tampilan input dan output
yang digunakan sebagai masukan data dan keluaran data yang diproses oleh
sistem. Adapun desain interface yang ada sebagai berikut :
A.Desain Interface Frontend
Desain Interface frontend meruapakan desain tampilan input dan output
yang ditampilkan pada halaman depan website yaitu halaman website buat
pelanggan.
A.1 Desain Interface Tampilan Halaman Home
Rancangan desain interface berikut merupakan tampilan home. Pada
tampilan home terdiri dari header, slideshow, lastest product, best seller dan
footer merupakan tampilan awal ketika mengakses website littlebelle. Adapun
desain interface dapat dilihat pada gambar 3.21.
A.2 Desain Interface Tampilan Halaman Produk
Rancangan desain interface untuk halaman produk. Pada tampilan
halaman produk berisi penjelasan tentang produk seperti nama produk harga dan
stok. Adapun desain interface halaman produk dapat dilihat pada gambar 3.22.
Gambar 3.22 Desain Interface Tampilan Halaman produk
A.3 Desain Interface Tampilan Halaman About Us
Rancangan desain interface berikut merupakan penjelasan tentang CV.
Abilindo Mitra Sejahtera. Adapun desain interface halaman produk dapat dilihat
pada gambar 3.23.
A.4 Desain Interface Tampilan Halaman Contact Us
Rancangan desain Interface berikut merupakan informasi kontak yang
dapat dihubungi dari pihak CV. Abilindo Mitra Sejahtera. Adapun desain
Interface halaman produk dapat dilihat pada gambar 3.24.
Gambar 3.24 Desain Interface Tampilan Halaman Contact Us
A.5 Desain Input Tampilan Login Pelanggan
Rancangan desain input berikut merupakan tampilan input login
pelanggan. Pada tampilan input login ini berisi text box email, dan password.
Gambar 3.25 Desain Input Tampilan login Pelanggan
A.6 Desain Input Tampilan Registrasi
Rancangan desain input berikut merupakan tampilan input data
pelanggan. Pada tampilan input data barang ini berisi text box email, nama
lengkap, password, tanggal lahir, alamat, provinsi, kota, phonedata barang. Selain
text box ada juga radio button pada tampilan jenis kelamin. Adapun desain input
tampilan registrasi dapat dilihat pada gambar 3.26.
A.7 Desain Input Tampilan keranjang Belanja
Rancangan desain input berikut merupakan tampilan input keranjang
belanja. Pada tampilan input keranjang belanja ini berisi nama penerima, alamat
tujuan, catatan provinsi tujuan dan kota tujuan. Adapun desain input dapat dilihat
pada gambar 3.27.
Gambar 3.27 Desain Input Tampilan Keranjang Belanja
A.8 Desain Input Tampilan Payment Confirmation
Rancangan desain input berikut merupakan tampilan input payment
confirmation. Tampilan ini hanya muncul ketika pelanggan sudah melakukan
login. Pada tampilan input payment confirmation digunakan mengkonfirmasi
transaksi pembayaran yang telah dilakukan pelanggan. Terdapat 7 inputan text box
yang berisi no invoice, bank, nama pemilik rekening, tanggal transfer, no
rekening, jumlah transfer, dan catatan. Adapun desain input dapat dilihat pada
Gambar 3.28 Desain Input Tampilan payment confirmation
A.9 Desain Interface Tampilan History
Rancangan desain interface berikut merupakan tampilan history.
Tampilan ini akan muncul pada account jika pelanggan sudah melakukan login
dan melakukan transaksi penjualan sebelumnya. Pada tampilan history
menampilkan informasi transaksi yang sudah dilakukan pelanggan. Adapun
desain interface dapat dilihat pada gambar 3.29.
B.Desain Interface Backend
Desain interface backend meruapakan desain tampilan input dan output
yang ditampilkan pada halaman belakang dan dikhususkan buat admin dan owner.
B.1 Desain Interface Tampilan Produk
Rancangan desain interface berikut merupakan tampilan produk. Pada
tampilan list produk yang sudah disimpan di tabel home terdiri dari nama produk,
gambar, kategori, qty, harga. Pada tampilan produk terdapat 3 tombol tambah
stok, update, hapus. Desain interface dapat dilihat pada gambar 3.30.
Gambar 3.30 Desain Interface Tampilan Produk
B.2 Desain Input Buat Produk
Rancangan desain input untuk halaman buat memasukan produk baru.
Gambar 3.31 Desain Input Buat produk
B.3 Desain Interface Tampilan kategori
Rancangan desain interface berikut merupakan tampilan kategori. Pada
tampilan kategori ini terdiri dari nomor dan kategori. Pada tampilan kategori
terdapat 3 button yaitu tambah kategori, update kategori, dan hapus. Desain
Interface tampilan kategori dapat dilihat pada gambar 3.32.
B.4 Desain Input Tampilan Supplier
Rancangan desain input berikut merupakan tampilan input data supplier.
Pada tampilan input data supplier ini berisi text box id supplier, nama supplier,
alamat supplier dan phone. Adapun desain input tampilan Supplier dapat dilihat
pada gambar 3.33.
Gambar 3.33 Desain Input Tampilan Supplier
B.5 Desain Input Tampilan Penerimaan Barang
Rancangan desain input berikut merupakan tampilan penerimaan barang.
Pada tampilan input penerimaan barang ini terdiri dari tanggal terima, nama
produk, jumlah, harga beli, nama supplier. Adapun desain input dapat dilihat pada
Gambar 3.34 Desain Input Tampilan Penerimaan Barang
B.6 Desain Interface Tampilan Penjualan
Rancangan desain Interface berikut merupakan tampilan transaksi
penjualan yang terjadi. Data-data yang ditampilkan adalah id order, nama produk,
detail harga, Jumlah, Biaya kirim, subtotal, kode unik, total harga. Adapun desain
Interface dapat dilihat pada gambar 3.35.
B.7 Desain Interface Pembayaran
Rancangan desain Interface berikut merupakan tampilan pembayaran.
Pada tampilan pembayaran ini menampilkan data tanggal, id order, bank, no
rekening, pemilik rekening, status. Pada data status yang dijelaskan adalah data
pembayaran yg dilakukan pelanggan dapat berupa paid, unpaid, reject. Adapun
desain Interface dapat dilihat pada gambar 3.36 .
Gambar 3.36 Desain Interface Pembayaran
B.8 Desain Interface Tampilan Pengiriman Barang
Rancangan desain Interface berikut merupakan transaksi pengiriman
barang. Desain pengiriman barang ini terdiri dari Tanggal, id_order, nama
customer, alamat, telp, status. Tampilan ini digunakan untuk menampilkan status
pengiriman barang yang sudah dibeli oleh pelanggan. Status tersebut berupa
yang akan disimpan di database penjualan. Adapun desain Interface dapat dilihat
pada gambar 3.37.
Gambar 3.37 Desain Interface Tampilan Pengiriman Barang
B.9 Desain Output Tampilan Laporan Penjualan
Rancangan desain output berikut merupakan tampilan laporan penjualan.
Fungsi dari form ini untuk menampilkan laporan yang mempermudah owner
dalam memperoleh informasi pendapatan. Adapun desain output dapat dilihat
Gambar 3.38 Desain Output Tampilan laporan penjualan
B.10 Desain Output Tampilan Laporan Pelanggan Paling Sering Belanja
Rancangan desain output berikut merupakan desain laporan pelanggan
paling sering belanja. Tujuan dari laporan ini untuk mengetahui pelanggan yang
paling loyal dalam membeli barang yang dijual. Adapun desain output dapat
dilihat pada gambar 3.39.
B.11 Desain Output Tampilan Laporan Stock
Rancangan desain output baerikut meampilan laporan stok produk yang
keluar atau berhasil dijual. Tampilan hasil laporan stok ini dapat menjadi
informasi dalam mengendalikan stok barang. Adapun desain output dapat dilihat
pada gambar 3.40.
Gambar 3.40 Desain Output Tampilan Laporan Stock
B.12 Desain Output Tampilan Laporan Penerimaan Barang
Rancangan desain output berikut merupakan tampilan laporan
penerimaan barang. Dari tampilan laporan penerimaan barang tersebut dapat
diketahui informasi barang yang masuk dan dari supplier mana barang tersebut
Gambar 3.41 Desain Output Tampilan laporan Penerimaan Barang
B.13 Desain Output Tampilan Laporan List Pembayaran
Rancangan desain output berikut merupakan tampilan laporan list
pembayaran. Dari tampilan laporan list pembayaran dapat diperoleh informasi
pelanggan yang sudah melakukan pembayaran dan yang belum melakukan
pembayaran. Adapun desain output dapat dilihat pada gambar 3.42.
B.14 Desain Output Tampilan Laporan List member
Rancangan desain output berikut merupakan tampilan laporan data
pelanggan yang sudah mendaftar menjadi member. Adapun desain output dapat
dilihat pada gambar 3.43.
Gambar 3.43 Desain Output Tampilan laporan list member
B.15 Desain Output Tampilan Laporan Barang paling laku
Rancangan desain output berikut merupakan tampilan laporan barang
paling laku. Dari tampilan laporan penerimaan barang tersebut dapat diketahui
informasi barang yang paling favorite atau barang yang laris. Adapun desain
Gambar 3.44 Desain Output Tampilan laporan Barang paling laku
B.16 Desain Output Tampilan Laporan Barang Dikirim
Rancangan desain Output berikut merupakan tampilan laporan barang
dikirim. Dari tampilan laporan barang dikirim tersebut dapat diketahui informasi
barang yang sudah mendapat nomor resi dan berhasil dikirimkan menggunakan
jasa pengiriman JNE. Adapun desain output dapat dilihat pada gambar 3.45.
BAB IV
IMPLEMENTASI DAN EVALUASI
4.1 Kebutuhan Sistem
Dalam menerapkan aplikasi penjualan online ini dibutuhkan perangkat
keras (hardwere) dan perangkat lunak (Software) yang dapat menunjang
penggunaan aplikasi ini secara maksimal. Maka diperlukan spesifikasi perangkat
keras (hardwere) dan perangkat lunak (software) sebagai berikut :
4.1.1 Kebutuhan Perangkat Keras (Hardware)
Persyaratan kebutuhan perangkat keras yang disarankan untuk
menjalankan Aplikasi Penjualan Online adalah sebagai berikut :
1. Processor intel dengan spesifikasi Core 2 Duo atau diatasnya.
2. Monitor, keyboard, Mouse.
3. RAM memori minimal 2 GB.
4. VGA Card minimal 16 MB.
5. Hard Disk dengan free kapasitas penyimpanan 100 GB.
4.1.2 Kebutuhan Perangkat Lunak (Software)
Persyaratan kebutuhan perangkat lunak yang disarankan untuk
menjalankan Aplikasi Penjualan Online adalah sebagai berikut:
1. Operating System minimal Windows 7.
2. Sistem basis data untuk pengolahan data aplikasi menggunakan MYSQL
3. Tool yang digunakan dalam melakukan pemograman adalah sublime text dengan
menggunakan bahasa HTML serta PHP.
4. Membutuhkan Browser, dan disarankan Google Chrome.
5. Untuk perancangan sistem menggunakan Microsoft Visio dan Powerdesigner.
6. Web server untuk pengolahan data menggunakan XAMPP
4.2 Implementasi
Pada bagian ini akan dijelaskan fungsi-fungsi utama yang berjalan pada
aplikasi penjualan online. Dengan penjelasan yang mencakup tampilan pada
aplikasi dan fungsi yang mengatur aplikasi penjualan online ini.
4.2.1 Tampilan Menu Utama
Pada tampilan menu utama terdiri dari home, products, about us, contact
us, account dan icon keranjang belanja. Dapat terlihat pada gambar 4.1
4.2.2 Tampilan Halaman Katalog Product
Tampilan halaman katalog product menampilkan data product terbaru dan
produk yang best seller. Dapat terlihat pada gambar 4.2.
Gambar 4.2 Tampilan Halaman katalog product
4.2.3 Tampilan Halaman Product
Tampilan halaman product menampilkan data product yang dijual. Dapat
terlihat pada gambar 4.3.
4.2.4 Tampilan Daftar Pelanggan
Tampilan daftar pelanggan berguna bagi pelanggan untuk dapat
melakukan transaksi pembelian barang dengan cara mendaftarkan identitas
pelanggan. Form daftar pelanggan menghasilkan sebuah informasi bagi Admin
mengenai data-data pelanggan yaitu email, nama, alamat, password, jenis kelamin,
tanggal lahir, kota, telepon, provinsi, telepon dan capthca. Seperti terlihat pada
gambar 4.4.
Gambar 4.4 Tampilan Daftar Pelanggan
4.2.5 Tampilan Form Keranjang Belanja
Tampilan form keranjang belanja berfungsi untuk menampung data barang
yang akan dibeli pelanggan. Dalam form keranjang belanja, Pelanggan dapat
menambahkan barang dan menghapus barang. Dari form keranjang belanja
menghasilkan sebuah informasi transaksi penjualan. Seperti terlihat pada gambar
Gambar 4.5 Tampilan Form Keranjang Belanja
4.2.6 Tampilan Form About Us
Tampilan form about us berguna untuk menjelaskan latar belakang berdiri
nya perusahaan dan segala sesuatu mengenai CV. Abilindo Mitra Sejahtera. Seperti
