Institutional Repository | Satya Wacana Christian University: Perancangan Web Sistem Informasi Penjualan Kuningan dan Handicraft Berbasis PHP Responsif Adaptif serta Multi Platform T0 562013002 BAB IV

57

4.1.

Hasil Karya / Implementasi

Dari tahap-tahap perancangan yang telah dilakukan maka hasil karya yang diciptakan adalah sebuah aplikasi web sistem informasi penjualan kuningan dan barang-barang karya seni lain yang berisi informasi detail penjualan barang beserta pengolahan data penyedia layanan yang dilakukan oleh operator sehingga mampu mempermudah penyedia layanan barang yang akan menjual produk seni kepada pembeli.

Aplikasi web sistem informasi penjualan kuningan

dan handicraft menggunakan php dan sql server didukung

dengan penggunaan html dan css pada setiap struktur penulisan kode program serta memanfaatkan responsivitas sehingga aplikasi ini mampu mengkoordinasi setiap data dan perubahan tampilan baik data penjualan, pembelian, dan pengolahan itu sendiri.

Perancangan aplikasi web ini mampu mempermudah sekaligus mempercepat dalam pengolahan data setiap transaksi. Semua hasil masukan data akan disimpan ke dalam database engine dengan menggunakan sql server. Data yang diterima akan lebih aman karena transaksi yang terjadi tidak akan hilang dan mempermudah dalam

pembuatan laporan. Perancangan aplikasi web ini diharapkan akan membantu penjual dalam layanan penjualan produknya untuk mempermudah dan mempercepat dalam memberikan pelayanan kepada

customer. Dari tahap-tahap perancangan yang telah

dilakukan sebelumnya, maka dihasilkan aplikasi web sistem informasi penjualan kuningan dan handicraft. Berikut adalah tampilan saat aplikasi dijalankan :

a. Form Login

 Tampilan ini menampilkan menu untuk operator melakukan aktivitas pengolahan data penjualan. Dengan aktivitas pertama yang dilakukan oleh operator untuk login, maka sistem akan memeperbarui penjualan barang sesuai dengan aktivitas pengolahan barang yang dilakukan oleh operator karena disini operator atau penyedia layanan barang akan melakukan update dan input data penjualan barang.

 Operator dapat mengolah data dalam siklus transaksi. mulai dari insert, update, delete barang yang dijual kemudian memvalidasi pengiriman. Aktivitas bisnis yang dilakukan oleh operator pada

menu login menjadi kunci utama proses bisnis dilakukan. Apabila tidak ada data yang tidak dipaparkan oleh operator, maka sistem akan kosong.

Gambar 4.1 Tampilan Login Operator

b. Menu Utama

 Setelah operator menegolah data penjualan dan memasukkan segala jenis barang yang dijual, maka terdapat tampilan menu utama yang dapat diakses oleh pengunjung.

 Tampilan ini menyediakan menu kategori barang yang dijual dan setiap barang yang dijual dapat dilihat rincian penjualannya oleh pengunjung dengan mengakses tombol view details.

 Tampilan ini didukung oleh fitur pencarian sehingga apabila pengunjung mencari nama produk yang diinginkan sistem akan otomatis langsung menyaring data penjualan dan menampilkan sesuai hasil pencarian. Apabila sistem tidak menampilkan hasil maka karakter yang dimasukkan ke dalam fitur

pencarian barang tidak sesuai dengan kategori ataupun nama produk mana pun yang ada pada

database server. Sistem akan terotomatisasi

memberikan kepada pengguna bahwa karakter yang dimasukkan tidak cocok dengan semua data yang disimpan oleh sistem.

Gambar 4.2 Tampilan Menu Utama

c. Tentang Kami

 Pada tamplan ini menampilkan informasi mengenai profil perusahaan yang berisi alamat dan akses informasi yang bisa dihubungi oleh pelanggan.

 Pengunjung dapat melihat informasi perusahaan apabila ingin mengunjungi perusahaan untuk membeli produk secara langsung.



Gambar 4.4 Tampilan Tentang Kami

d. Responsivitas sistem

 Sistem web yang dirancang sudah mempunyai fitur responsif, dimana apabila tampilan web diperkecil, tata letak setiap menu yang disediakan tidak berantakan. Dalam arti lain, menu-menu yang ada akan menyesuaikan lagi dan memberikan tampilan baru yang bersesuaian.

 Pada gambar di bawah, menu yang disediakan berdasarakan kategori masih bisa diakses dan

menyesuaikan seberapa kecil tampilan yang ada. Setiap komponen baik itu menu, gambar, latar bersesuaian dengan baik dan berfungsi dengan baik.

Gambar 4.5 Tampilan Responsifitas web

e. Detail produk

 Pada pilihan gambar barang yang dijual, pelanggan dapat melihat detail produk mengenai harga dan deksripsi barang secara lebih terperinci.

 Detail produk juga memberikan fitur validasi untuk membeli barang. Dengan kata lain setelah pelanggan menekan tombol ini, maka sistem akan mentransfer

data pembelian produk yang telah di klik untuk ditampilkan di keranjang belanja.

Gambar 4.6 Tampilan Detail Produk

f. Transaksi

 Pelanggan dapat mengkases menu keranjang belanja untuk memvalidasi pembelian barang. Apabila keranjang belanja belum diakses, maka pelanggan hanya akan memasukkan barang ke dalam daftar pembelian, namun tidak membeli barang tersebut.  Dalam tampilan yang ada pada gambar 4.7, apabila

pelanggan sudah memilih barang dan memasukkannya ke dalam keranjang belanja maka untuk proses selanjutnya pelanggan harus menekan tombol “check out”. Tombol ini merupakan tombol bukti validasi supaya setelahnya pelanggan dapat memasukkan identitasnya mengenai alamat yang menjadi tujuan pengiriman barang.

 Di menu keranjang belanja ini pelanggan dapat menetukan jumlah kuantitas barang yang dibeli. Pelanggan juga bisa membatalkan pembelian produk yang sebelumnya sudah dipilih. Kemudian pelanggan akan memilih ulang pada tampilan utama apabila masih belum sesuai.

 Tombol “empty cart” berfungsi untuk mengosongkan keranjang belanja. Dengan kata lain pelanggan membatalkan semua pemilihan barang yang ingin dibeli, dan dapat memilih barang ulang di menu utama bila ingin benar-benar melakukan pembelian.

 Setelah menekan tombol “check out” maka pelanggan akan ditempatkan oleh sistem pada tampilan berikutnya dimana pelanggan harus memasukkan identitas secara lengkap. Dalam menu tampilan ini pelanggan diberi kesempatan untuk melakukan pembayaran. Pembayaran yang dilakukan adalah “pay on delivery”. Setelah selesai memasukkan semua identitas secara lengkap, pelanggan wajib menekan tombol “submit” sebagai pengesahan bahwa pelanggan benar-benar membeli barang yang telah dipilihnya.  Menu Textbox sudah terotomatisasi oleh sistem bahwa pemasukkan setiap datanya harus sesuai dengan kaidah yang ada pada sistem.

a. Kontak yang bisa Dihubungi

 Dalam sistem web yang dirancang, terdapat menu

contact dimana menu ini ditujukan untuk pelanggan

dan berfungsi untuk mengirimkan pesan kepada pihak operator.

 Terdapat menu Textbox di tampilan contact ini, dimana pelanggan memasukkan nama, email, subject, dan juga isi pesan yang ingin disampaikan. Setelah selesai melakukan pengisian pelanggan harus menekan tombol submit untuk mengirim pesan.

Gambar 4.9 Tampilan contact us

b. Menu operator setelah login

 Tampilan pertama ketika operator melakukan login, maka operator dapat melakukan 3 (tiga) aktivitas utama yang berkaitan dengan products, orders, dan

category. Operator dapat mengakses dan mengolah data yang ada dalam setiap 3 menu tersebut.

 Terdapat button logout apabila operator telah selesai mengolah data.

Gambar 4.101 Tampilan Login Sistem product

 Tampilan di atas merupakan tampilan pertama setelah

login dan sistem akan otomatis masuk pada menu

pertama yakni products. Dalam menu ini operator dapat menambah barang melalui button add product di sebelah kanan kolom pencarian.

 Operator juga dapat mengolah data yang sudah dimasukkan. Data yang diisi dan diolah yakni mengenai nama produk, deskripsi, harga, kategori, dan gambar yang mewakili produk

 Selain itu dalam produk yang telah tersedia, operator dapat menghapusnya apabila produk yang dipasarkan tidak jadi dijual.

c. Daftar pelanggan

 Ketika tampilan ini dibuka maka secara otomatis pada bagian tengah utama akan menampilkan daftar data Pegawai secara keseluruhan dalam datagridview.  Secara garis besar 3 menu utama terdiri dari

komponen tabel yang sama dimana tabel memuat data pengujung mengenai nama pengunjung, tanggal akses dan status pembayaran.

Gambar 4.11 Tampilan Daftar Pelanggan Login orders

 Apabila menu view item pada tampilan gambar 4.11 diakses maka akan sistem akan membuka tab baru dimana akan menampilkan perincian data pengunjung secara lengkap.

Gambar 4.12 Tampilan Informasi Daftar Pelanggan

4.2. Hasil Pengujian

Pengujian dilakukan dengan cara menjalankan aplikasi tersebut. Program dianggap berhasil apabila seluruh fungsi masukan, proses, dan keluaran aplikasi berjalan dengan baik sesuai dengan tujuan yang ingin dicapai.

Berdasarkan pengujian yang telah dilakukan, input yang diproses telah sesuai dengan hasil output yang dikendaki. Data–data penjualan dapat ditambahkan ke dalam database. Laporan–laporan juga telah tertampil dengan baik. Pihak pembeli hanya dapat mengakses menu penjualan barang dan identitas pemebelian pada tampilan utama. Pesan yang dikirim melalui juga telah berhasil terkirim. Secara garis besar aplikasi sudah berjalan cukup baik. Tabel Hasil pengujian dapat dilihat sebagai berikut :

Gambar 4.13 Tabel Hasil Pengujian

Login oleh operator/penyedia

barang-barang seni. Berhasil

Pengolahan data barang oleh operator

insert, update, dan delete baik pengolahan

gambar, deskripsi serta perhitungan harga.

Berhasil

Pengolahan identitas pembeli dan status

pengiriman oleh operator. Berhasil

Responsivitas tampilan web menyesuaikan

layar tampilan pada berbagai browser. Berhasil Adaptivitas tampilan web menyesuaikan

layar tampilan pada berbagai device. Tidak berhasil Akses keranjang belanja yang menamping

berbagai item pembelian oleh pembeli. Berhasil Kolom masukan mengenai pesan dan kritik

oleh pembeli kepada perusahaan serta akses jejaring sosial perusahaan.

Berhasil

Simpan data Pengunjung. Berhasil

Error handling pada pengisian karakter di

semua data pengunjung. Berhasil

Pengolahan data kuantitias barang oleh pembeli pada menu keranjang belanja serta kalkulasi perhitungan harga.

4.3. Analisis

Berdasarkan hasil pengujian yang dilakukan, aplikasi ini dapat bermanfaat untuk membantu dalam proses pengelolaan data barang dan pelaporan hasil penjualan sehingga lebih efisien serta penyebaran informasi penjualan kepada pembeli dapat dilakukan dengan lebih mudah.

Aplikasi ini memiliki kekurangan dimana aktivitas login hanya dapat dilakukan oleh operator/penyedia yang akan menjual barang-barang karya seni. Hal ini dikarenakan ketika aplikasi ini dibangun terdapat error pada module yang akan ditujukan untuk pengunjung. Dengan kata lain aktivitas dan data pengunjung langsung disimpan ke dalam login operator dan hanya dapat dilihat oleh operator.

Selain itu aplikasi ini juga belum dapat terintegrasi dengan tampilan pada device lain khususnya smartphone. Namun sistem ini sudah dibangun dengan baik dimana responsivitas tampilan web dapat menyesuaikan berbagai tampilan browser. Setiap menu yang ada di dalamnya akan menyesuaikan dan membentuk tampilan baru.

Keunggulan lain dari aplikasi sistem informasi web ini adalah segal fitur yang berfungsi dengan baik di dalamnya seperti yang sudah ditunjukkan pada tabel. Fitur

label, button, search button, dan lain-lain sudah terintegrasi

a. Kontak yang bisa Dihubungi

 Dalam sistem web yang dirancang, terdapat menu

contact dimana menu ini ditujukan untuk pelanggan

dan berfungsi untuk mengirimkan pesan kepada pihak operator.

 Terdapat menu Textbox di tampilan contact ini, dimana pelanggan memasukkan nama, email, subject, dan juga isi pesan yang ingin disampaikan. Setelah selesai melakukan pengisian pelanggan harus menekan tombol submit untuk mengirim pesan.

Gambar 4.9 Tampilan contact us

b. Menu operator setelah login

 Tampilan pertama ketika operator melakukan login, maka operator dapat melakukan 3 (tiga) aktivitas utama yang berkaitan dengan products, orders, dan

category. Operator dapat mengakses dan mengolah data yang ada dalam setiap 3 menu tersebut.

 Terdapat button logout apabila operator telah selesai mengolah data.

Gambar 4.101 Tampilan Login Sistem product

 Tampilan di atas merupakan tampilan pertama setelah

login dan sistem akan otomatis masuk pada menu

pertama yakni products. Dalam menu ini operator dapat menambah barang melalui button add product

di sebelah kanan kolom pencarian.

 Operator juga dapat mengolah data yang sudah dimasukkan. Data yang diisi dan diolah yakni mengenai nama produk, deskripsi, harga, kategori, dan gambar yang mewakili produk

 Selain itu dalam produk yang telah tersedia, operator dapat menghapusnya apabila produk yang dipasarkan tidak jadi dijual.

c. Daftar pelanggan

 Ketika tampilan ini dibuka maka secara otomatis pada bagian tengah utama akan menampilkan daftar data Pegawai secara keseluruhan dalam datagridview.  Secara garis besar 3 menu utama terdiri dari

komponen tabel yang sama dimana tabel memuat data pengujung mengenai nama pengunjung, tanggal akses dan status pembayaran.

Gambar 4.11 Tampilan Daftar Pelanggan Login orders

 Apabila menu view item pada tampilan gambar 4.11 diakses maka akan sistem akan membuka tab baru dimana akan menampilkan perincian data pengunjung secara lengkap.

Gambar 4.12 Tampilan Informasi Daftar Pelanggan

4.2. Hasil Pengujian

Pengujian dilakukan dengan cara menjalankan aplikasi tersebut. Program dianggap berhasil apabila seluruh fungsi masukan, proses, dan keluaran aplikasi berjalan dengan baik sesuai dengan tujuan yang ingin dicapai.

Berdasarkan pengujian yang telah dilakukan, input

yang diproses telah sesuai dengan hasil output yang dikendaki. Data–data penjualan dapat ditambahkan ke dalam database. Laporan–laporan juga telah tertampil dengan baik. Pihak pembeli hanya dapat mengakses menu penjualan barang dan identitas pemebelian pada tampilan utama. Pesan yang dikirim melalui juga telah berhasil terkirim. Secara garis besar aplikasi sudah berjalan cukup baik. Tabel Hasil pengujian dapat dilihat sebagai berikut :

Gambar 4.13 Tabel Hasil Pengujian

Login oleh operator/penyedia

barang-barang seni. Berhasil

Pengolahan data barang oleh operator

insert, update, dan delete baik pengolahan

gambar, deskripsi serta perhitungan harga.

Berhasil

Pengolahan identitas pembeli dan status

pengiriman oleh operator. Berhasil

Responsivitas tampilan web menyesuaikan

layar tampilan pada berbagai browser. Berhasil

Adaptivitas tampilan web menyesuaikan

layar tampilan pada berbagai device. Tidak berhasil

Akses keranjang belanja yang menamping

berbagai item pembelian oleh pembeli. Berhasil Kolom masukan mengenai pesan dan kritik

oleh pembeli kepada perusahaan serta akses jejaring sosial perusahaan.

Berhasil

Simpan data Pengunjung. Berhasil

Error handling pada pengisian karakter di

semua data pengunjung. Berhasil

Pengolahan data kuantitias barang oleh pembeli pada menu keranjang belanja serta kalkulasi perhitungan harga.

4.3. Analisis

Berdasarkan hasil pengujian yang dilakukan, aplikasi ini dapat bermanfaat untuk membantu dalam proses pengelolaan data barang dan pelaporan hasil penjualan sehingga lebih efisien serta penyebaran informasi penjualan kepada pembeli dapat dilakukan dengan lebih mudah.

Aplikasi ini memiliki kekurangan dimana aktivitas login hanya dapat dilakukan oleh operator/penyedia yang akan menjual barang-barang karya seni. Hal ini dikarenakan ketika aplikasi ini dibangun terdapat error

pada module yang akan ditujukan untuk pengunjung. Dengan kata lain aktivitas dan data pengunjung langsung disimpan ke dalam login operator dan hanya dapat dilihat oleh operator.

Selain itu aplikasi ini juga belum dapat terintegrasi dengan tampilan pada device lain khususnya smartphone.

Namun sistem ini sudah dibangun dengan baik dimana responsivitas tampilan web dapat menyesuaikan berbagai tampilan browser. Setiap menu yang ada di dalamnya akan menyesuaikan dan membentuk tampilan baru.

Keunggulan lain dari aplikasi sistem informasi web

ini adalah segal fitur yang berfungsi dengan baik di dalamnya seperti yang sudah ditunjukkan pada tabel. Fitur

label, button, search button, dan lain-lain sudah terintegrasi