BAB IV IMPLEMENTASI DAN PENGUJIAN Setelah dilakukan tahap perancangan aplikasi maka tahap selanjutnya adalah implementasi dan pengujian pada aplikasi software. 4.1
Kebutuhan Perangkat Keras. Pada aplikasi yang penulis buat ini, kebutuhan perangkat keras
(Hardware) yang diperlukan dalam mengimplementasikan aplikasi ini adalah computer / laptop dengan bluetooth integrated, gadged berbasis andorid dan printer yang dapat disesuaikan berdasarkan kebutuhannya baik secara hardcopy maupun softcopy untuk nota barangnya. 4.2
Kebutuhan Perangkat Lunak Kebutuhan perangkat lunak (Software) yang diperlukan untuk membuat
aplikasi swalayan ini adalah:
Sistem Operasi Windows7 atau Windows8 dan Xampp local server.
PHP & MySQL yang digunakan sebagai penyimpanan basis data.
Dreamweaver CS6 untuk proses koding dan pembuatan design antarmuka.
Twegde V.3.0.0 untuk akuisisi data wedge perangkat lunak sebagai interface dalam mengumpulkan data dari perangkat seperti pembaca barcode scanner, melalui bluetooth dan data dari perangkat disimpan langsung kedalam basis data dan file juga disimulasikan sebagai penekanan tombol virtual.
Getblue apps untuk gadget android sebagai barcode scanner.
Star UML V.5.0.2.1570 untuk membuat design diagram sistem.
4.3
Implementasi Antarmuka Implementasi antarmuka merupakan interaksi antara pengguna dan sistem
dengan menampilkan berbagai antarmuka yang digunakan sebagai cara kerja dari
28
29
sistem itu sendiri. Adapun implementasi antarmuka pada aplikasi ini dapat dirinci dalam tabel berikut ini : Tabel 4.1 Implemantasi Antarmuka.
4.3.1
No.
Antar Muka
Nama File Fisik
Nama File Executable
1
Frame Utama
home.php
login.css
2
Frame Index
index.php
index.css
3
Frame Paging
paging.php
laporan.css
Impelementasi Antarmuka layar Utama Akses Login Aplikasi sistem Kasir di Gita swalayan di mulai saat petugas kasir (user)
menggunakan aplikasi ini dengan mengetikan link URL nya pada adress bar : http://localhost/minimarket/akses/login_toko.php link tersebut tidak mengunakan domain tertentu juga tanpa terhubung dengan internet sehingga alamat yang dapat di akses hanya pada localhost. Pada implementasi antarmuka pembuka ini merupakan layar utama muncul pada saat aplikasi dijalankan dengan gambar sebagai berikut :
30
Gambar 4.1 Tampilan Login Toko Pada gambar di atas dapat di lihat bahwa layar akses utama merupakan menu login berupa login nama toko di mana di dalam file tersebut memiliki sub menu untuk login user dengan metode yang digunakan adalah session yang berfungsi membatasi pengaksesan halaman oleh user sebagai petugas dan sebagai keamanan akses user terhadap aplikasi sistem seperti dapat dilihat pada gambar berikut ini :
31
Gambar 4.2 Tampilan Login User Tabel 4.2 Implementasi Properties Komponen TextField Component
Name
Type
textfield
kd_toko
single line
Textfield2
password
Password
Tabel 4.3 Implementasi Properties Button Component Button Button2
Name Value button_login Login button_reset Reset
Action Submit Form Reset Form
32
4.3.2
Impelementasi Antarmuka layar Menu Index Pada layar menu index adalah untuk menampilkan data index terhadap ID
User, Nama User dan data user yang disesuaikan antara menu dengan hak status pegawai tiap user-nya, bentuk tampilan layar seperti pada gambar berikut ini :
Gambar 4.3 Tampilan Menu Index Dalam pembuatan link terhadap menu – menu yang telah dibuat menggunakan Spry menu bar, serta syntax / kode PHP yang berfungsi untuk
33
memanggil halaman yang ingin ditampilkan pada halaman kerja index, dengan rincian menu link nya sebagai berikut : Tabel 4.4 Properti Link Spry Menu Bar Menu
Sub Menu
Index Data Master
User
Sub Menu
Sub
Link
Description
index.php?men
View, connection menu
u=home
utama
index.php?men
View, insert, update &
u=user
delete data user
Kategori
index.php?men
Barang
u=kategori
Satuan
index.php?men
Barang
u=satuan
Barang Supplier Toko
View, insert, update & delete
Gudang
Pembelian
kategori
barang View, insert, update & delete
data
satuan
barang
index.php?men
View, insert, update &
u=barang
delete data barang
index.php?men
View, insert, update &
u=supplier
delete data supplier
index.php?men
View, insert, update &
u=toko
delete data toko View,
Menu
data
insert,
index.php?men
update,delete & cetak
u=pembelian
laporan
pembelian
barang Stok Barang Menu Kasir
Mesin Kasir
index.php?men
View stok & harga jual
u=stok
barang
index.php?men
Mesin
u=penjualan
penjualan, cetak struk
transaki
34
pembelian & Id user di kasir Setoran Kasir Manager Toko
Stok Barang Laporan
u=setoran_kasir
kasir per user
index.php?men
View stok & harga jual
u=stok
barang
#
Pembelian
#
Penjualan
Cabang
View
Penjualan
Profit
Kontrol
index.php?men
# index.php?men
Stok Cabang
u=stok&view=c abang
Laporan
Penjualan
#
Pembelian
#
Profit Penjualan
#
setoran
harian
View laporan penjualan per user perhari View laporan pembelian per user perhari View
laporan
profit
penjualan View stok & harga jual barang cabang View laporan penjualan per user perhari View laporan pembelian per user perhari View stok & harga jual barang cabang
Keluar
akses/logout.ph
logout dan kembali ke
Aplikasi
p
login
4.3.3
Implementasi Antarmuka layar Stok Data Barang Antarmuka layar stok data barang merupakan containt dari menu index
untuk petugas gudang. Pada layar pengolahan data barang terdapat menu pilihan data untuk kategori, stok, kode toko, dan button submit serta all yang dapat menampilkan kode barang, nama barang, stok dan harga jual sebagai viewer kontrol terhadap barang dalam persiapan kasir untuk melakukan penjualan.
35
Berikut adalah bentuk tampilan menu gudang terhadap pengolahan data barang yang terdapat pada menu gudang dari link spry menu bar seperti pada gambar dibawah ini :
Gambar 4.4 Tampilan Stok Barang 4.3.4
Impelementasi Antarmuka layar Pembelian Barang Pada layar transaksi pembelian barang ini data stok barang akan ter-
update secara otomatis jika dilakukan entry data pembelian sudah benar dan sesuai dengan kebutuhan yang diinginkan. Berikut adalah bentuk layar menu pembelian barang yang menampilkan kode barang, nama barang, satuan barang,
36
harga, jumlah, sub total dan button add juga button selesai beli, seperti pada gambar dibawah ini :
Gambar 4.5 Tampilan Menu Pembelian Barang Tabel 4.5 Tabel Properties Antarmuka Data Barang Komponen
TextField
TextField
no_faktur
TextField2
id_user
Init Val
Keterangan echo
Menampilkan No Faktur
echo Menampilkan ID User
37
$_SESSION[‘id_use r’];?>
TextField3
tanggal
TextField4
nm_barang
Menampilkan Nama Barang
TextField5
satuan
Menampilkan Satuan Barang
TextField6
harga
Menampilkan Harga Barang
TextField7
jumlah
Menampilkan Jumlah Barang
TextField8
sub_total
Menampilkan Subtotal
m-y’);?>
Menampilkan Tanggal
Setelah transaksi pembelian selesai dilakukan dapat menampilkan faktur pembelian barang yang dapat dicetak sebagai dokumentasi dan prosedur administrasi faktur pembelian barang, seperti pada gambar berikut ini :
Gambar 4.6 Tampilan Faktur Pembelian Barang
38
4.3.5
Impelementasi Antarmuka layar Penjualan Barang Berikut merupakan layar menu mesin kasir digunakan untuk transaksi
penjualan yang dapat ditampilkan seperti pada gambar dibawah ini :
Gambar 4.7 Tampilan Mesin Kasir Pada layar transaksi penjualan mesin kasir dapat di integrasikan dengan barcode scanner dalam memasukan kode barang, namun tetap dapat menggunakan keyboard untuk menginput kode barang dan jumlah pembayaran secara tunai. Dengan memilih tombol hitung mesin akan mengkalkulasi hasil jumlah pembelian pada transaksi penjualan dikasir dan data akan tersimpan
39
didalam tabel sebagai item penjualan secara otomatis, sehingga printout struk belanja sebagai bukti transaksi calon pembeli dapat dicetak seperti pada gambar berikut ini :
Gambar 4.8 Printout Struk belanja 4.3.6 Impelementasi layar Paging Menu Laporan Barang Antarmuka menu paging pada laporan barang ini merupakan layar untuk menampilkan laporan transaksi barang dari inputan update barang yang telah diisi oleh petugas admin, petugas gudang dan petugas kasir pada layar data barang.
40
4.3.6.1 Impelementasi Laporan Transaksi Pembelian Laporan Pembelian untuk pengadaan barang akan menampilkan semua data transaksi pembelian yang dapat dipilih secara periode berdasarkan tanggal tertentu. Antarmuka bentuk laporan pembelian barang dapat dilihat pada gambar berikut :
Gambar 4.9 Laporan Pembelian Barang
41
4.3.6.2 Impelementasi Laporan Transaksi Penjualan Laporan penjualan barang akan menampilkan semua data transaksi penjualan yang dapat dipilih secara periode berdasarkan tanggal tertentu. Bentuk laporan penjualan barang dapat dilihat pada gambar berikut :
Gambar 4.10 Tampilan Laporan Penjualan 4.3.6.3 Impelementasi Laporan Profit Penjualan Laporan profit penjualan barang berisi informasi laba dari seluruh transaki penjualan yang terjadi dan menampilkan semua data transaksi penjualan yang
42
dapat dipilih secara periode berdasarkan tanggal tertentu. Bentuk laporan penjualan barang dapat dilihat pada gambar berikut ini :
Gambar 4.11 Tampilan Laporan Profit Penjualan 4.4 Metode Pengujian Apliksai Metode pengujian pada aplikasi ini dilakukan dengan menggunakan Dreamweaver untuk membentuk tampilan Aplikasi sistem kemudian PHP& MySQL adalah sebagai basisdata. Setelah perancangan ini selesai selanjutnya dilakukan proses pengujian pada aplikasinya, hal ini dilakukan untuk dapat mengetahui sejauh mana sistem ini dapat berfungsi dan dapat memenuhi kebutuhan user atau petugas kasir di swalayan tersebut. Kemudian menggunakan media interkatif untuk barcode scanner gadged andorid yaitu GetBlue yang menyediakan otomatis akuisisi data dan komunikasi perangkat pengguna
43
perangkat Bluetooth SPP, perangkat serial USB, TCP / IP, HTTP dan kamera barcode scanner. Overview: Versi lengkap dari GetBlue mengumpulkan data dari bluetooth SPP, serial USB, TCP / IP, HTTP dan scanner kamera secara otomatis di latar belakang. Data yang diambil diteruskan keperangkat yang disesuaikan dengan sasaran, file, spreadsheet online atau bahkan dimasukan kedalam aplikasi. Fungsi komunikasi pengguna untuk membaca dan menulis data juga tersedia. Rincian: Akuisisi data getblue dapat dioperasikan seperti cross-switch menangkap data dari sumber data yang disesuaikan dan diajukan kepada setiap target yang didukung. Berikut adalah perangkat dan protokol yang saat ini tersedia antara lain : •
Bluetooth SPP dan bluetooth RFCOMM Semua perangkat bluetooth seri yang mendukung Serial Port Profile (SPP seperti RFCOMM atau barcode scanner) dapat digunakan. GetBlue mendukung klien bluetooth dan server bluetooth, sehingga perangkat serta koneksi komputer yang digunakan dapat berinteraksi.
•
Serial USB kemungkinan tidak bekerja pada beberapa Android, namun terhadap FTDI dan chipset prolific dapat digunakan.
•
CP / IP juga menyediakan perangkat jenis socket TCP / IP tersebut.
•
HTTP GET dan permintaan HTTP POST dengan parameter dapat disesuaikan.
•
Cammera Scanner Setiap aplikasi kamera eksternal dapat digunakan.
•
Input data secara manual, perintah perangkat dapat dimasukkan secara manual. Data yang diambil dapat dikirimkan melalui perangkat bluetooth, USB, TCP / IP dan HTTP untuk setiap perangkat yang menjadi target pengoperasian sistem. Selain itu data yang dikumpulkan dapat juga melakukan beberapa fungsi terhadapat instruksi yang dijalankan, seperti :
1.
Menampilkan (HEX atau ASCII)
2.
Data dapat disimpan secara lokal di file (termasuk waktu secara akurasi)
3.
Upload ke Google Docs Spreadsheet
44
4.
Dapat dimasukan ke dalam aplikasi smartphone melalui soft-keyboard untuk getblue (operasi wedge keyboard).
4.4.1
Skenario Pengujian Aplikasi GetBlue digunakan sebagai keyboard yaitu memindai barcode dengan
scanner bluetooth dan menginput data barcode ke dalam aplikasi sebagai data logger otomatis (misalnya upload ditangkap data ke spreadsheet kedalam google docs atau menyimpannya ke dalam sebuah file lokal) untuk mengendalikan perangkat bluetooth, barcode scanner yang sudah terhubung ke komputer. Skenario Awal : Lakukan konfigurasi pada aplikasi barcode scanner untuk datasource menggunakan camera scanner dengan benar, kemudian datasinks menggunakan pilihan bluetooth, hidupkan perangkat bluetooth yang ada pada komputer sampai device dapat terhubung dan bisa berkomunikasi terhadap perangkat komputer yang digunakan.
Aplikasi getblue siap untuk
menerima barcode yang diregristari untuk mengirimkan data output berupa text kedalam sistem kasir dengan gambar seperti berikut :
45
Gambar 4.12 Tampilan Data Source Getblue. Data diambil dari bluetooth, kemudian pilih scanner kamera atau perangkat TCP secara otomatis akan disimpan atau dimasukan ke perangkat. Selain itu data perangkat dapat diteruskan melalui Bluetooth SPP, HTTP GET / POST atau TCP / IP terhadap soket untuk target yang disesuaikan. GetBlue juga mampu bekerja secara proxy antara perangkat yang berbeda atau melalui protokol.
46
Gambar 4.13 Tampilan K
onfigurasi Getblue Apps.
Skenario Akhir : Jalankan TWedge untuk mengakuisisi data wedge, perangkat lunak ini mengumpulkan data dari perangkat seperti pembaca barcode, scanner, alat pengukur dan skala elektronik melalui USB, port serial (RS232, RS485, virtual port COM), TCP, UDP dan bluetooth. Data perangkat disimpan langsung kedalam database dan file yang dapat disimulasikan sebagai penekanan tombol virtual, sehingga data barcode yang diregistrasi pada item barang yang akan dijual setiap kali melakukan scann barcode barang akan tertampung didalam database interface Twedge dengan hasil tampilan seperti pada gambar berikut ini :
47
Gambar 4.14 Tampilan Interface Twegde 4.4.2 Hasil Pengujian Buat barcode sesuai dengan kebutuhan sebagai ciri khusus trademark terhadapat barang yang kita miliki, setiap item barang sudah terdaftar agar barang lebih rapih sehingga data inventori dapat mudah diketahui dan memiliki kode tersendiri. Berikut contoh barcode yang digunakan pada gambar dibawah ini :
48
Gambar 4.15 Contoh barcode series code 128. Hasil akhir scann barcode terhadap item barang dapat dilihat pada log file setiap kali melakukan scann barcode hasil akhir pengujian terlihat pada gambar dibawah ini :
Gambar 4.16 Gambar hasil record barcode Getblue Apps.
49
4.4.3 Pengujian Kotak Hitam ( Black Box ) Pengujian kotak hitam tertuju pada persyaratan perangkat lunak yang digunakan dan dapat dilihat dalam tabel berikut ini :
Tabel 4.6 Pengujian Kotak Hitam ( Black Box )
No.
Aktor
Item Uji
Flow
Hasil Target
Hasil Pengujian
User memasukan username dan
User masuk kehalaman
password
selanjutnya
Sesuai
sesuai di 1
Admin
Login
database User memasukan ID, kode toko, nama user, hak
User kembali ke halaman login
Sesuai
akses Data staff
Tambah
2
Admin
yang
melakukan
dimasukan
tambah data
tersimpan
user
kedalam
Admin Manager
Sesuai
database Admin Edit
melakukan edit data user
Data staff yang diedit (modify) tersimpan
Sesuai
50
kedalam database Data staff
Hapus
Admin
yang
melakukan
dihapus
hapus data
tersimpan
user
kedalam
Sesuai
database Petugas gudang Tambah
melakukan pembelian dan tambah data barang
3
Admin
Gudang
Edit
View Stok Barang
Data barang yang dimasukan
Sesuai
tersimpan kedalam database
Petugas
Data
gudang
barang
melakukan
yang
pembelian
dimasukan
barang dan
tersimpan
input data
kedalam
barang
database
Petugas
Data
gudang
barang
melakukan
yang
kontrol data dimasukan pembelian
petugas
barang,
gudang
kode
akan
barang,
masuk dan
Sesuai
Sesuai
51
nama
tersimpan
barang,
kedalam
Stok barang
database
dan harga Jual
Petugas kasir Tambah
memasukan transaksi penjualan barang
4
Admin
Kasir Petugas kasir Update
mengupdate laporan penjualan barang
Data barang yang dimasukan
Sesuai
tersimpan kedalam database Data barang yang dimasukan tersimpan kedalam database
Sesuai
