SISTEM INFORMASI INVENTORY DAN PENJUALAN
PADA TOKO KOMPUTER GO_IT BERBASIS WEB DENGAN
TEKNOLOGI SINGLE PAGE APPLICATION (SPA)
PUBLIKASI ILMIAH
Disusun sebagai salah satu syarat menyelesaikan Jenjang Strata I
pada Program StudiInformatika Fakultas Komunikasi dan Informatika
Oleh:
PUTUT SANJAYA
L 200 120 118
PROGRAM STUDI INFORMATIKA
FAKULTAS KOMUNIKASI DAN INFORMATIKA
UNIVERSITAS MUHAMMADIYAH SURAKARTA
2017
1
SISTEM INFORMASI INVENTORY DAN PENJUALAN PADA TOKO KOMPUTER
GO_IT BERBASIS WEB DENGAN TEKNOLOGI SINGLE PAGE APPLICATION (SPA)
Abstrak
Selama ini sistem persediaan barang dan penjualan pada toko komputer Go_iT masih
dilakukan secara konvensional, sehingga terjadi kesulitan dan ketidakakuratan dalam
menghitung banyaknya jumlah barang maupun harga barang. Untuk mempermudah
dalam proses pengolahan data tersebut, diperlukan pembangunan sistem informasi
penjualan barang yang terkomputerisasi. Dengan sistem inventory dan penjualan barang
yang terkomputerisasi, maka data yang dihasilkan akan lebih cepat dan akurat. Tujuan
dari penelitian ini adalah merancang sistem inventory dan penjualan yang
terkomputerisasi sehingga dapat mempermudah kegiatan operasional toko. Tahapan
dalam penyelesaian penelitian ini terdiri dari analisis kebutuhan, desain sistem,
implementasi, pengujian sistem dan penerapan sistem. Aplikasi ini dibuat dengan bahasa
pemograman PHP dan database mysql. Berdasarkan kuisioner yang telah dibagikan
kepada responden, dihasilkan bahwa 85% menyatakan kinerja website cepat dan
responsif, serta 80% menyatakan sistem dapat mempermudah pembuatan laporan
pendapatan serta faktur dengan cepat. Hasil akhir dari sistem yang telah selesai dibuat
adalah berupa sistem inventory dan penjualan toko yang dapat mengelola data barang
seperti, manajemen penjualan barang, pembuatan faktur dan pembuatan laporan
pendapatan. Dengan adanya katalog pada website toko akan mempermudah konsumen
untuk melihat persediaan barang tanpa harus pergi ke toko. Selain itu, penggunaan
teknologi single page application juga akan membantu kinerja website agar lebih cepat
dan responsif.
Kata Kunci: sistem persediaan barang, penjualan, katalog toko komputer, aplikasi satu
halaman
Abstract
All this time, the inventory and selling system in Go_iT computer store is conventionally
carried out. Thus, it result in difficulties and inaccuracy of calculating both the total
amounts of items and the price. To ease the data processing, it need a building of
computerized item selling information system. With the compurized inventory and
selling system, the data produced will be more accelerated and accurate. This research
aims at designing an inventory and selling system which is computerized, so that it can
ease the operational activities of the store. Stage in the completion of this research
consists of need analysis, system design, implementation, system test, and system
application. This application is made by using PHP programming language and mysql
database. Based on the questionnaires distributed to the respondents, it is found that 85%
of the respondents state that the performance of the website is fast and responsive, and
80% of them state that the system can ease the making of the income report and invoice
quickly. The final result of the system which has been made is an inventory and store
selling system which can proced the item data such as item selling management, invoice
making, and income report making. With the catalogue in the store’s website, it can ease
the costumers to see the stocks available without coming to the store. Besides, the use of
single page application technology will also help the website’s performance in order to
make it faster and more responsive.
Keyword: inventory system, selling, computer store’s catalogue, single page application
2
1. PENDAHULUAN
1.1. Latar Belakang
Toko komputer GO_iT adalah sebuah toko komputer yang sedang berkembang dan bergerak dalam
bidang penjualan aksesoris dan perlengkapan komputer. Berdasarkan hasil wawancara dengan
pihak toko, maka didapat informasi tentang pengolahan data barang yang masih dilakukan secara
manual mulai dari transaksi penjualan barang, laporan penjualan barang, transaksi pembelian
barang, laporan pembelian barang, dan seluruh laporan kegiatan sistem pembukuannya masih
kurang tersetruktur. Kendala yang muncul dengan menggunakan sistem yang manual yaitu masalah
waktu dimana dalam melakukan pembukuan atau pengecekkan data barang terlalu lama dan juga
masalah pengontrolan stok barang yang tersedia kurang begitu teratur secara baik.
Masalah-masalah tersebut di atas mengharuskan pihak toko untuk menerapkan sistem
inventory dan penjualan yang mampu memproses data secara cepat, akurat dan secara otomatis
mampu menyimpan serta menampilkan data transaksi.
Dari masalah yang dijabarkan di atas maka penelitian ini bertujuan untuk merancang sistem
inventory dan penjualan yang terkomputerisasi untuk memudahkan kegiatan operasional toko
sehingga transaksi dapat dilakukan secara cepat dan akurat serta memudahkan operator dalam
melakukan proses transaksi.
1.2. Tinjauan Pustaka
Putranto (2014) dalam penelitiannya yang berjudul “Pengembangan Aplikasi Database
Persediaan Barang Berbasis Web pada Wahana Komputer Semarang” menyatakan bahwa sistem
inventory memegang peranan penting agar perusahaan dapat berjalan dengan baik. Persediaan yang
tinggi memungkinkan perusahaan untuk memenuhi permintaan yang mendadak, untuk itu
diperlukan pengelolaan terhadap persediaan barang secara cepat dan akurat.
Firmansyah (2014) dalam penelitiannya yang berjudul “Sistem Informasi Inventory
Tembakau Berbasis Web Pada Gudang PT. Djarum Kendal” menyatakan bahwa sistem informasi
inventory dapat memudahkan pekerjaan dan pengolahan data yang berkaitan dengan kegiatan
pembelian maupun pengiriman yang dapat menghemat waktu dan ruang dalam bekerja.
Supriyono (2016) dalam penelitiannya terkait sistem informasi presensi, proses pembuatan
dan pengembangan sistem dilakukan dengan menggunakan metode waterfall yang terdiri dari
beberapa tahap, yaitu tahap analisis kebutuhan, tahap perancangan, tahap pengembangan atau
implementasi, tahap pengujian dan tahap penerapan sistem.
3
Chase dkk. (2006:589) mendefinisikan prsediaan barang sebagai kumpulan (stok) untuk
setiap item sumber daya yang digunakan di dalam organisasi. Dengan demikian, sebuah sistem
persediaan barang berarti sebuah kumpulan dari kebijakan-kebijakan dan pengendalian yang
memonitor tingkat persediaan barang dan menentukan pada tingkat berapa persediaan barang harus
dijaga, kapan stok harus diisi dan seberapa besar order yang harus dilakukan.
Kowal dan Roztocki (2013) dalam penelitiannya terkait sistem informasi dan ekonomi
menyatakan bahwa negara yang banyak melibatkan sistem informasi sebagai alat bantu dalam
penyelesaian pekerjaan adalah negara dengan tingkat ekonomi tinggi atau negara maju, dapat
disimpulkan bahwa teknologi informasi sangat berperan penting dalam meningkatkan pertumbuhan
ekonomi, dengan memanfaatkan komputer pekerjaan akan semakin mudah dan dapat diselesaikan
dengan lebih cepat.
Joseph (2015) dalam hasil penelitiannya yang berjudul “Single Page Application and
Canvas Drawing” menyimpulkan bahwa dengan menggunakan teknologi single page application
kinerja website menjadi lebih ringan dan hanya membutuhkan bandwidth sedikit sehingga
kecepatan akses website menjadi meningkat.
2. METODE
Waterfall Model merupakan salah satu model proses perangkat lunak yang mengambil
kegiatan proses dasar seperti spesifikasi, pengembangan, validasi dan evolusi dengan
mempresentasikannya sebagai fase-fase proses yang berbeda seperti analisis kebutuhan, desain
sistem, implementasi, pengujian dan penerapan program. (Sommerville, 2013). Gambaran metode
waterfall menurut Sommerville dapat dilihat pada Gambarr 2.1.
Gambar 2.1. Metode waterfall Sommerville
4
2.1.Waktu dan Tempat
Pembuatan aplikasi sistem informasi inventory dan penjualan ini kurang lebih 4 bulan (Oktober
2016 sampai dengan Januari 2017). Penelitian dan pengujian dilakukan di toko komputer GO_iT
yang beralamat di Ngiri RT.01 RW.07 Sapen, Mojolaban, Sukoharjo.
2.2.Alat dan Bahan
Peralatan utama dalam penelitian ini adalah berupa laptop dengan spesifikasi sebagai berikut: (a)
Prosesor AMD A6, 1,8GHz (b) RAM 4 GB (c) Sistem operasi Windows 8.1 64-bit. Dalam
pembuatannya, perancangan aplikasi ini menggunakan software Sublime Text karena software
tersebut memakan sedikit memori, ringan dijalankan dan juga memiliki banyak fitur. Sedangkan
bahasa pemograman yang digunakan adalah PHP, karena PHP berjalan secara web base yang
artinya semua sistem operasi termasuk handphone yang memiliki web browser juga dapat
menjalankan program yang dibuat menggunakan PHP.
2.3.Analisis Kebutuhan
Penelitian ini dilakukan untuk menerapkan pengelolaan data pada toko komputer GO_iT yang
sebelumnya masih menggunakan cara konvensional menjadi pengelolaan data yang
terkomputerisasi, sehingga diharapkan manajemen inventory dan penjualan produk di toko
komputer GO_iT dapat menjadi lebih baik, ringkas, dan transaksi beserta faktur termasuk laporan
menjadi lebih mudah dan efisien.
2.4.Perancangan Sistem
Perancangan sistem memiliki tujuan mendisain sistem baru yang dapat menyelesaikan masalah-
masalah yang dihadapi oleh pemilik toko yang diperoleh dari pemilihan alternatif sistem yang baik.
Berikut adalah perancangan yang dilakukan:
a).Use Case Diagram
Use Case merupakan fungsionalitas yang disediakan sistem sebagai unit-unit yang saling bertukar
pesan antar unit atau aktor (Sugiarti, 2013).
Perancangan Use Case pada sistem ini dibagi menjadi 3 (tiga) aktor user, yaitu user admin,user
operator dan user visitor web.
Pertama, use case user admin dibagi menjadi 7 (tujuh) akses, yaitu akses untuk login,
mengelola penjualan, pembuatan faktur, mengelola data inventory toko, mengelola data karyawan,
mengelola laporan pendapatan dan akses untuk memanajemen web. Use case user admin dapat
dilihat pada gambar 2.2.
5
Gambar 2.2. Use case user admin
Kedua, use case user operator terbagi menjadi 4 (empat) akses, yaitu akses untuk login,
mengelola penjualan barang, membuat faktur, dan melihat laporan pendapatan. Use case user
operator dapat dilihat pada Gambar 2.3.
Gambar 2.3. Use case user operator
Ketiga, use case user visitor web terbagi menjadi 3 (tiga) akses, yaitu akses untuk melihat
katalog toko, melihat persediaan barang pada toko, dan melihat profil toko. Use case user visitor
web dapat dilihat pada gambar 2.4.
Gambar 2.4. Use case user visitor web
Operator
6
b). Flowchart
Flowchart merupakan bagan (chart) yang menunjukkan alir (flow) di dalam program atau prosedur
sistem secara logika (Supardi, 2013:51).
Penelitian sistem inventory dan penjualan di toko komputer GO_iT melalui beberapa proses, hal ini
dilakukan supaya penelitian yang dihasilkan lebih baik dan sesuai dengan tujuan dari manajemen
sistem. Proses/tahapan dari penelitian digambarkan dalam sebuah diagram alir/flowchart. Flowchart
dapat dilihat pada Gambar 2.5 dan Gambar 2.6.
Gambar 2.5. Flowchart user admin Gambar 2.6. Flowchart user operator
c). Entity Relationship Diagram (ERD)
Entity Relationship Diagram (ERD) merupakan model data konseptual tingkat tinggi untuk
perancangan basis data. Model data konseptual adalah himpunan konsep yang mendeskripsikan
struktur basis data, transaksi pengambilan dan pembaruan basis data. Rancangan ERD dapat dilihat
pada gambar 2.7.
7
Gambar 2.7. Entity Relationship Diagram (ERD)
d). User Interface
Berikut merupakan rancangan user interface yang akan dibuat dengan tujuan untuk
memudahkan user dalam pengoperasian sistem. Rancangan user interface dapat dilihat pada Gambar
2.8 dan Gambar 2.9.
Gambar 2.8. Rancangan halaman utama Gambar 2.9. Rancangan halaman admin
Berikut adalah penjelasan mengenai desain sistem di atas: 1). Merupakan bagian navigasi
menu yang terdiri dari Produk, Profil, Kontak dan Login. 2). Merupakan pesan awal bertuliskan
nama toko ketika mengunjungi website. 3). Merupakan kolom pencarian produk untuk memudahkan
visitor dalam mencari produk. 4). Merupakan katalog produk yang berisi tentang spesifikasi produk
dan jumlah produk yang masih tersedia. 5). Merupakan menu manage yang memiliki submenu baru
ketika login sebagai admin,submenu ini terdiri dari inventory, pengelolaan admin, transaksi dan
laporan pendapatan. 6). Merupakan menu inventory yang terdiri dari kode produk, gambar, stok,
8
harga dan history produk. 7). Merupakan kolom tombol aksi seperti edit, delete, ganti gambar, dll.
8). Bagian ini adalah tombol untuk menambah data, tombol ini berfungsi untuk memanggil form
input data.
2.5. PengujianSistem
Pengujian sistem menggunakan metode kuisioner, dimana ada 7 (tujuh) pernyataan yang akan diisi
oleh pihak toko sebagai admin dan 6 (enam) pernyataan yang akan diisi oleh masyarakat atau
pelanggan sebagai visitor. Rancangan kuisioner yang dibagikan kepada admin dan visitor dapat
dilihat pada Tabel 2.1 dan Tabel 2.2.
Tabel 2.1. Tabel kuisioner untuk admin
Tabel 2.2. Tabel kuisioner untuk visitor
Keterangan
SS = Sangat Setuju N = Netral STS = Sangat Tidak Setuju
S = Setuju TS = Tidak Setuju
9
3. HASIL DAN PEMBAHASAN
3.1. Implementasi
a. Halaman Utama
Halaman utama merupakan halaman yang muncul pertama kali ketika membuka website.
Halaman utama ini terdiri dari beberapa bagian, diantaranya: Menu website, katalog produk, profil,
informasi kontak, danlogin. Pada bagian bawah menu juga terdapat nama toko sebagai pesan
pembuka saat mengunjungi website. Tampilan halaman utama pada website dapat dilihat pada
gambar 3.1.
Gambar 3.1. Halaman utama website
b. Halaman Katalog Produk
Halaman katalog produk berisi tentang produk yang tersedia pada toko. Katalog barang
dilengkapi dengan kolom pencarian sehingga memudahkan user dalam mencari produk yang
diinginkan. Tampilan halaman katalog produk dapat dilihat pada gambar 3.2.
Gambar 3.2. Halaman katalog produk
10
c. Halaman manajemen
Halaman manajemen hanya bisa diakses oleh user admin atau user operator dengan cara
memasukkan username dan password masing-masing. Fungsi halaman manajemen meliputi:
1.) Melakukan input barang pada menu inventory, tahap ini dapat dilakukan dengan cara masuk
ke menu tambah produk. Pada menu tambah produk akan muncul beberapa kolom yang wajib diisi,
yaitu Kode Produk, Nama Produk, Stok, Harga, Deskripsi, serta Gambar yang akan ditampilkan
pada katalog. Menu inventory dan input produk dapat dilihat pada gambar 3.3 dan 3.4.
Gambar 3.3. Manajemen inventory Gambar 3.4. Input produk
2.) Membuat user operator pada menu admin. Pada tahap ini admin dapat membuat beberapa
user operator serta dapat melakukan perubahan password padauser admin dan user operator. Menu
admin dapat dilihat pada Gambar 3.5 dan Gambar 3.6.
Gambar 3.5. Manajemen admin Gambar 3.6. Tambah operator
3.) Melakukan proses transaksi pada menu transaksi. Pada tahap ini, user admin dan operator
dapat menambahkan, mengurangi, atau membatalkan barang yang akan dibeli oleh pelanggan.
11
Apabila transaksi sukses, admin atau operator dapat melakukan pencetakan faktur. Menu transaksi
dan pencetakan faktur dapat dilihat pada Gambar 3.7 dan 3.8.
Gambar 3.7. Menu transaksi Gambar 3.8. Pencetakan faktur
4.) Untuk Pembuatan laporan pendapatan toko dapat dilakukan dengan cara memilih menu
laporan penjualan pada menubar kemudian masukkan tanggal transaksi yang diinginkan. Tampilan
hasil cetak laporan pendapatan dapat dilihat pada Gambar 3.9.
Gambar 3.9. Hasil cetak laporan pendapatan
3.2. Pengujian dan Pembahasan
Tahap pengujian aplikasi ini dilakukan dengan metode kuisioner.
Kuisioner atau angket adalah metode pengumpulan data penelitian dengan menggunakan daftar
pertanyaan yang harus dijawab oleh responden (Walgito, 1999:35).
12
Dalam penelitian “Sistem Informasi Inventory dan Penjualan pada Toko Komputer GO_iT Berbasis
Web dengan Teknologi Single Page Application (SPA)” ini, kuisioner dibagi menjadi 2 (dua), yaitu
kuisioner untuk user admin sebanyak 2 responden dari pihak toko dan kuisoner untuk user visitor
sebanyak 12 responden dari masyarakat atau pembeli. Bobot nilai pada masing-masing jawaban
yaitu:
SS bobot = 5 N bobot = 3 STS bobot = 1
S bobot = 4 TS bobot = 2
Hasil rekapitulasi admin yang sudah dibagikan dapat dilihat pada tabel 3.1.
Tabel 3.1. Rekapitulasi kuisioner admin
Dari hasil rekapitulasi user admin di atas mendapat rata-rata nilai 4,14 dengan keterangan
jawaban setuju.
Hasil prosentase diperoleh dengan menjumlahkan skor dari setiap responden kemudian
dibagi dengan keseluruhan jumlah responden yang sebelumnya sudah dikalikan dengan bobot
maximal. Hasil yang sudah didapat kemudian dikalikan dengan 100%. Untuk mencari hasil
prosentase dapat dirumuskan seperti berikut:
𝑃 =𝑎
(𝑏 x 𝑐) x100%
Keterangan
𝑃= Prosentase 𝑏 = Jumlah Responden
𝑎 = Jumlah Skor 𝑐 = Bobot Maximal
Hasil prosentase user admin secara keseluruhan pada masing-masing pernyataan dapat
dilihat pada Tabel 3.2 dan Gambar 3.10.
Tabel 3.2. Data prosentase penilaian responden admin
13
Gambar 3.10. Diagram representasi penilaian admin
Berdasarkan tabel dan diagram di atas maka pengisian kuisioner dari responden admin
mendapatkan hasil prosentase sebagai berikut:
P1) 90% menyatakan tampilan sistem jelas dan mudah dipahami,
P2) 80% menyatakan sistem mudah dioperasikan,
P3) 100% menyatakan kinerja website cepat dan responsif,
P4) 70% menyatakan komposisi warna website nyam,an untuk dilihat,
P5) 90% menyatakan sistem memberikan kemudahan dalam pengelolaan data barang,
P6) 80% menyatakan sistem dapat mencetak faktur dengan mudah dan cepat,
P7) 90% menyatakan sistem mampu menampilkan dan mencetak laporan pendapatan toko dengan
mudah dan cepat.
14
Penilaian user visitor merupakan penilaian terhadap kinerja website dalam memberikan
informasi kepada user. Kuisioner user visitor dibagikan kepada 12 responden. Hasil prosentase user
visitor pada tiap pernyataan kuisioner dapat dilihat pada Tabel 3.3 dan Gambar 3.11.
Tabel 3.3. Data prosentase penilaian user visitor
Gambar 3.11. Diagram representasi visitor
Berdasarkan tabel dan diagram di atas maka pengisian kuisioner dari responden user visitor
mendapatkan hasil prosentase yang menyatakan website sebagai berikut:
P1) 81,66% menyatakan tampilan jelas dan mudah dipahami,
P2) 66,66% menyatakan komposisi warna pada website nyaman untuk dilihat,
P3) 85% menyatakan kinerja website cepat dan responsif,
P4) 93,33% menyatakan website memberi informasi produk dengan jelas,
P5) 63,33% menyatakan website memberi informasi katalog toko dengan jelas,
P6) 83,33% menyatakan dapat mencari produk di katalog dengan mudah dan cepat.
15
4. PENUTUP
KESIMPULAN
Sistem informasi inventory dan penjualan yang dibuat ini dapat membantu pihak toko dalam hal
persediaan barang, seperti mengecek persediaan barang yang stoknya mulai menipis. Pendataan
barang dan pembuatan faktur akan lebih mudah dan cepat. Dengan sistem yang berbasis web, pihak
toko juga dapat mengecek langsung transaksi kapanpun dan dimanapun. Selain itu, calon pembeli
juga dapat memeriksa terlebih dahulu pada website terkait produk yang dicari tanpa harus pergi ke
toko.
DAFTAR PUSTAKA
Chase, R. B. dkk. (2006). Operations Management For Competitive Advantage, 9th ed. New York:
McGraw-Hill.
Firmansyah, Denis. (2014). Sistem Informasi Inventory Tembakau Berbasis Web Pada Gudang PT.
Djarum Kendal. Jurnal. STEKOM Semarang.
Joseph, R. J. (2015). Single Page Application And Canvas Drawing. International Journal of Web
& Sematic Technology. Vol.6, No.1.
Kowal, J. dan Roztocki, N. (2013). Information And Communication Technology Management For
Global Competitiveness And Economic Growth In Emerging Economies. The Elctronic
Journal on Information System in Developing Countries 57, 0, 1-12.
Putranto, Harmadi. (2014). Pengembangan Aplikasi Database Persediaan Barang Berbasis Web
Pada Wahana Komputer Semarang. Jurnal. STEKOM Semarang.
Sommerville, I. (2003). Rekayasa Perangkat Lunak. Edisi 6, diterjemahkan oleh: Hanum, Y.
Jakarta: Erlangga.
Sugiarti, Yuni. (2013). Analisis & Perancangan UML (Unified Modelling Language) Generated
VB.6. Yogyakarta: Graha Ilmu
Supardi, Yuniar. (2013). Koleksi Program Tugas Akhir Dan Skripsi Dengan FoxPro 9. Jakarta: PT
Elex Gramedia.
Supriyono, Heru. (2016). Rancang Bangun Sistem Informasi Presensi Berbasis SMS Gateway SMP
Muhammadiyah Kartasura. The 3rdUniversity Research Coloquium. ISSN 2407-9189.
Walgito, Bimo. (1999). Pengantar Psikologi Umum. Yogyakarta: Andi offset.
Top Related