1
TOKO KUE ONLINE (STUDI KASUS PADA TOKO QANITA PASTRY) Sumarsono
Abstrak Semakin berkembangnya ilmu teknologi didalam dunia industri dan perdagangan saat ini, menyebabkan banyak perusahaan yang memanfaatkannya untuk memasarkan barang dan jasa. Perkembangan teknologi yang pesat membuat kita lebih mudah untuk memasarkan produk yang kita hasilkan dan juga memperkenalkannya melalui dunia internet, sebab memasarkan produk melalui media internet dapat sangat mempercepat proses pemasaran itu sendiri, dikarenakan melalui media tersebut jangkauan menjadi sangat luas dan seolah tak terbatas, dapat diakses dari mana saja dan dimana saja. Disamping itu biaya dapat menjadi sangat murah. Qanita Pastry merupakan sebuah usaha rumahan yang bergerak dalam pembuatan kue yang beberapa tahun belakangan ini baru memberanikan diri untuk memulai mengembangkan usahanya tersebut, namun sistem yang dimilikinya masih merupakan sistem manual. Qanita Pastry tertarik untuk membuat sistem pemesanan dan penjualan secara online dengan membangun sebuah website yang dapat menjual produknya dengan cepat sehingga pelanggan tidak perlu bersusah payah datang ke toko Qanita Pastry untuk membeli produk-produk kue nya. Website penjualan ini dibuat untuk memasarkan sekaligus pula mempercepat proses pemesanan. Website ini dibuat menggunakan bahasa pemograman HTML, PHP dan MySQL. Website ini diharapkan dapat membantu dalam memasarkan produk-produk dari Qanita Pastry, dan membatu pelanggan dalam melakukan transaksi pemasanan dan pembelian. Untuk dapat menjaga performance website ini, agar dapat dilakukan maintenance dan pembaruan yang teratur, dengan demikian diharapkan dapat tetap eksis dan selaras dengan kebutuhan yang akan datang. Kata kunci : Internet, website, toko, online, kue
1.
Pendahuluan Dengan perkembangan teknologi yang
memang memiliki prospek kedepan yang cukup
tentunya sudah semakin maju, dan semakin
baik. Ide pembuatan sistem pemesanan dan
membaiknya sistem kurir yang ada, maka penulis
penjualan online ini memiliki pertimbangan agar
mempunyai
sistem
calon pembeli dapat melihat katalog kue yang
pemesanan dan penjualan online yang muncul
dijual secara online dan melakukan pembelian
ketika bersilaturahmi kerumah seorang kawan
langsung tanpa harus datang ketempat usaha kue
yang sedang mengelola sebuah bisnis berjualan
tersebut, sehingga tentunya dapat membuat
macam-macam, nama usahanya diberi nama
segala sesuatu menjadi sangat mudah dan efisien.
sebuah
ide
pembuatan
Qanita Pastry merupakan sebuah usaha rumahan yang dikelola oleh sebuah keluarga yang sangat
2.
Metode Pengumpulan Data
kreatif untuk menciptakan dan membuat berbagai
Fase yang digunakan hanya pengumpulan
kue terutama berjenis pastry. Penulis melihat
data, desain, implementasi (coding) dan yang
bahwa saat ini kue juga merupakan bisnis yang
terakhir adalah pengujian sistem.
2
1.
Pengumpulan data
awalnya hanya dari hobi seorang ibu rumah
Pada tahap ini dilakukan pengumpulan
tangga, yang pada akhirnya berkembang menjadi
data dan informasi, apasaja yang memang
sumber penghasilan. Kue kue yang dibuat
diperlukan
mempunya ciri khas rasa yang unik dan pastinya
pada
saat
melakukan
pemesanan kue antara pihak pelanggan
mempunyai harga yang ekonomis pula.
dengan pihak Qanita Pastry 3.1 2.
Desain dan pembuatan database
Internet Internet berasal dari kata Interconnection
Pada tahapan ini mencoba menterjemahkan
Networking yang merupakan hubungan komputer
keinginan dari pelanggan menjadi sebuah
dengan berbagai tipe yang membentuk sistem
desain
jaringan yang mencakup seluruh dunia (jaringan
dan
kerangka
yang
akan
diimplementasikan oleh programmer.
komputer
global)
dengan
melalui
jalur
telekomunikasi telepon, radio link, satelit, dan 3.
lainnya.
Coding Dalam tahapan ini programmer melakukan pembuatan program yang telah didesain
3.2
XAMMP Adalah sebuah web server yang mudah
dengan menggunakan bahasa pemograman PHP dan menggunakan database MySQL,
digunakan,
bersifat
karena PHP adalah bersifat open source
disebarluaskan. XAMPP digunakan oleh para
dan sangat mudah digunakan pada semua
pengembang
operating system
menguji dan melakukan validasi sebuah halaman
dan
gratis
programmer
dan
web
dapat
untuk
web tanpa harus terhubung dengan internet. 4.
Pengujian
XAMMP tersedia untuk Microsoft Windows,
Pengujian dilakukan secara real time dan
Linux, Mac, OS dan Sun Solaris.
online.
Pengujian
ini
nantinya
akan
dilakukan dengan mencoba semua fitur
3.3
HTML Hypertext Markup Language atau biasa
yang ada, diharapkan dapat menemukan dapat
disebut singkat dengan HTML merupakan bahasa
menghasilkan program atau sistem yang
standar yang digunakan untuk membuat suatu
teruji secara fungsional dan keseluruhan.
dokumen
masalah
yang
ada,
sehingga
web.
HTML
sendiri
mempunyai
elemen-elemen (tags) dimana setiap elemen 3.
Landasan Teori
memiliki fungsi yang berbeda.
Usaha Qanita Pastry merupakan sebuah usaha rumahan (home industri) yang bergerak
3.4
Javascript
dalam hal pembuatan dan penjualan berbagai
Javascript merupakan scripting language
macam jenis kue terutama jenis pastry. Pada
yang terintegrasi dengan web browser untuk
3
bagi
relasional adalah database yang dikelompokkan
programmer untuk mengontrol element-element
kedalam beberapa tabel dimana masing-masing
dalam halaman web.
tabel saling berhubungan antara tabel yang satu
memberikan
fleksibilitas
tambahan
dengan tabel yang lainnya. 3.5
Cascade Style Sheet (CSS)
Cascade style sheet (CSS) adalah suatu bahasa
3.9
Data Flow Diagram (DFD)
style sheet yang digunakan untuk mengatur
Data Flow Diagram adalah sebuah teknis
tampilan dan tata letak suatu dokumen yang
grafis yang menggambarkan aliran informasi dan
ditulis dalam bahasa markup. Penggunaan yang
transformasi
paling umum adalah untuk mengatur tampilan
bergerak dari input menjadi output.
yang
diaplikasikan
pada
saat
situs web yang ditulis dengan format HTML dan XHTML seperti mengatur ukuran, warna, dan
3.10 ERD Entity Relationship Diagram (ERD) adalah
jenis huruf.
suatu model jaringan menggunakan susunan data 3.6
yang disimpan dalam sistem secara abstrak.
PHP Preprocessor)
Model Data E-R (Entity Relation) didasarkan
adalah sebuah bahasa interpreter yang memiliki
pada persepsi terhadap dunia nyata yang tersusun
kemiripan dengan bahasa C dan Perl, mempunyai
atas kumpulan objek-objek dasar yang disebut
kesederhanaan dalam perintah dan digunakan
entitas
untuk pembuatan aplikasi web dinamis. Kaya
menunjukkan jumlah maksimum entitas yang
akan fitur yang membuat perancangan web dan
dapat berelasi dengan entitas pada himpunan
pemograman menjadi lebih mudah.
entitas yang lain.
PHP
3.7
(PHP
Hypertext
4.
MySQL
manajemen
database
yang
populer
relasi.
ANALISA
DAN
Kardinalitas
relasi
PERANCANGAN
SISTEM
MySQL merupakan salah satu software sistem
dan
4.1
Gambaran sistem saat ini
dikalangan web programmer. Kepopulerannya ini
Pada saat ini Qanita Pastry menggunakan
dikarenakan MySQL sebuah software open
sistem penjualan yang hanya dapat dilayani di
source yang bersifat gratis, memiliki performa
toko atau di rumah, dimana pembeli harus datang
query
ke toko untuk meminta informasi dan melakukan
database
yang
cepat
dan
jarang
bermasalah.
pembelian. Pada proses pemesanan manual pertama pelanggan memilih kue yang ada
3.8
Relational Database Management System
didaftar menu, jika telah selesai melakukan
(RDBMS)
pemilihan, daftar menu yang dipesan tadi
Relational Database Management System
diserahkan
(RDBMS) atau sistem manajemen database
kepada
kasir,
lalu
kasir
menjumlahkan harga menu yang telah dipesan,
4
setelah itu pelanggan membayar sesuai dengan
dilakukan termasuk pembayaran dan tempat
jumlah pesanan dan kasir membuat bukti
pengiriman pesanan.
pembayaran dengan bukti kertas rangkap dua, salah satu nya diserahkan ke pelanggan dan yang
4.2.2 Desain awal perencanaan pemesanan
lainnya disimpan sebagai bukti penjualan untuk User melakukan pemilihan barang yang akan dibeli dan memasukkan jumlah barang yang dipesan
laporan. 4.2
Sistem yang akan di bangun Proses pemesanan pada web (Sistem Yang
Akan Dibangun)
User memberikan konfirmasi akan pemesanan yan dilakukan dan memberikan data personal serta data pembelian
4.2.1 Desain awal cara kerja sistem Seperti pada situs belanja online lainnya,
User melakukan pemilihan cara pembayaran yang akan dilakukan
maka blok diagram dari sistem adalah seperti pada gambar
Toko akan memberikan invoice dan cara pembayaran
Gambar 2. Blok Diagram Pemesanan Kue
Langkah-langkah yang dilakukan pengunjung situs adalah :
Gambar 1. Blok Diagram Sistem Secara Keseluruhan
- Pengunjung
melihat
katalog
kue,
dapat
langsung memasukkan kedalam keranjang Pada desain awal sistem ini maka
belanja
pengunujung dari situs tidak harus melakukan
- Calon pembeli melakukan konfirmasi dan
regristrasi dan login terlebih dahulu untuk
memberikan data-data yang lengkap dan
melakukan
akurat
transaksi.
Setelah
melakukan
pemesanan dan melakukan konfirmasi, langkah selanjutnya yang dilakukan oleh user adalah memberikan identitas dirinya serta memilih metode
pembayaran
yang
Pemberian identitas ini
akan
dilakukan.
dimaksudkan untuk
kepentingan verifikasi dari transaksi yang akan
- Calon pembeli diminta untuk memilih metode pembayaran - Pembeli menerima invoice dan konfirmasi pembelian.
5
pembeli akan mendapatkan informasi tentang rekening serta batas akhir pembayaran diterima
Pembeli akan melakukan pembayaran
konfirmasi setelah pembayaran diterima, maka barang akan dikirim
Gambar 6. Blok Diagram Transfer Antar Bank
4.2.3 Entity Relationship Diagram
Gambar 4. Flowchart Pemilihan Cara Pembayaran
Pada gambar diatas merupakan flowchart dari cara pembayaran yang dapat dilakukan pada situs ini. Situs ini memiliki 2 cara melakukan pembayaran, yaitu secara transfer antar bank dan COD (Cash On Delivery) Gambar 7. Entity Relationship Diagram Setelah melakukan add to chart dan pengisian data, maka pembeli menentukan tanggal pembeliannya
Penjual melakukan konfirmasi tempat & tanggal pengiriman terhadap pembeli
Pada waktu yang ditentukan maka barang akan diantar dan pembayaran dilakukan ditempat
Gambar 5. Blok Diagram Cash On Delivery
6
5.
IMPLEMENTASI
1.
Tampilan home
3.
Tampilan cara pemesanan
Gambar 10. Tampilan Cara Pemesanan Gambar 8. Tampilan Home
2.
4.
Tampilan pemesanan
Tampilan profile
Gambar 11. Tampilan Pemesanan Gambar 9. Tampilan Profile
7
5.
6.
Tampilan lihat pemesanan
7.
Tampilan konfirmasi pembayaran
Gambar 12.
Gambar 14.
Tampilan Lihat Pemesanan
Tampilan Konfirmasi Pembayaran
Tampilan konfirmasi data
8.
Tampilan konfirmasi pembayaran
Gambar 13.
Gambar 15.
Tampilan Konfirmasi Data
Tampilan Konfirmasi Pesanan
8
9.
Tampilan akhir pemesanan
11.
Gambar 16.
Gambar 18.
Tampilan Akhir Pemesanan
Tampilan Antar Muka Admin
12. 10.
Implementasi antar muka admin
Tampilan pesanan
Tampilan invoice
Gambar 17. Tampilan Invoice
Gambar 19. Tampilan Pesanan
9
13.
14.
Tampilan produk
15.
Tampilan promo
Gambar 20.
Gambar 22.
Tampilan Produk
Tampilan Promo
Tampilan kategori
16.
Tampilan antar muka owner
Gambar 21.
Gambar 23.
Tampilan Kategori
Tampilan Antar Muka Owner
10
17.
1.
Tampilan laporan invoice
Website ini menyediakan aneka kue, terutama jenis pastry.
2.
Website ini menyediakan semua informasi
mengenai
Toko
Kue
Qanita Pastry.
6.2 Saran 1.
Bahwa untuk selalu dipercaya oleh customer hendaknya pemilik Toko dalam hal ini pengelola Qanita Pastry selalu cepat dan tepat aktif dan responsif dalam menangani
Gambar 24.
pesanan
Tampilan Laporan Invoice
maupun
keluhan
yang
sekiranya akan dihadapi setiap saat 2. 18.
Tampilan laporan menu
Perlu
adanya
pengembangan
lanjutan dari beberapa fitur yang sudah dibuat, agar dapat selalu berkembang menuju kemudahan. DAFTAR PUSTAKA
F.K. Sibere, Alexander. (2012). Kitab Suci Web Programming. Jakarta : MediaKom Hakim, Lukmanul, & Musalini, Uus. (2003). 150 rahasia dan trik Menguasai PHP. Gambar 25.
Jakarta: Elex Media Komputindo.
Tampilan Laporan Menu
Haryanto, Steven. (2004). PHP : Kumpulan resep pemograman. Jakarta : Dian Rakyat
6.
PENUTUP
Kadir, Abdul. (2003). Pemograman web
6.1 Kesimpulan Berdasarkan
mencakup; Html, Css, Javascript & PHP. analisis,
perancangan
dan pengujian website pemesanan dan penjualan kue online, maka dapat diambil kesimpulan sebagai berikut :
Yogyakarta: Andi. Tim EMS. (2012). Web Programming for Beginners. Jakarta : Elex Media Komputindo.
