T1__BAB III Institutional Repository | Satya Wacana Christian University: Sistem Penelusuran Barang Menggunakan Barcode Berbasis Web T1 BAB III

BAB III
PERANCANGAN ALAT
Pada bab ini akan dijelaskan mengenai perancangan dan realisasi dari perangkat
lunak dari sistem penelusuran barang menggunakan barcode
3.1.

Gambaran Alat
Sistem yang akan direalisasikan dalam skripsi ini adalah sebuah sistem

penelusuran barang menggunakan barcode. Sistem terdiri dari beberapa divisi yang
terhubung dengan koneksi internet untuk mengakses virtual computer Amazon Web
Service (AWS) yang terdapat pada cloud. Virtual computer AWS tersebut akan
digunakan sebagai web server sekaligus database server pada sistem sehingga laman
web sistem yang dibangun bisa diakses secara online. Komputer di setiap divisi kecuali

divisi pertama akan dilengkapi dengan sebuah perangkat barcode scanner yang
terhubung dengan koneksi USB. Pada komputer di divisi pertama akan dilengkapi
dengan sebuah barcode printer yang juga terhubung dengan koneksi USB. Gambar 3.1
menunjukkan keseluruhan sistem yang dirancang.

Gambar 3.1. Diagram blok sistem yang akan direalisasikan.


8

Divisi pertama bertugas untuk mencatat segala atribut keterangan barang produksi
untuk mendapatkan sebuah barcode sticker yang akan ditempelkan pada bahan mentah
barang produksi yang akan diproses. Barcode sticker yang berupa representasi 16 digit
angka tracking number merupakan identitas dari barang produksi tesebut. Selanjutnya
bahan mentah barang produksi beserta barcode sticker tersebut akan dikirimkan ke
divisi kedua dan seterusnya untuk dikerjakan sesuai dengan spesialisasi divisi tersebut
sampai divisi terakhir.
Setiap memasuki sebuah divisi baru, operator di divisi tersebut bertugas untuk
melakukan scanning pada sticker barcode yang bertujuan untuk mencatat tanggal dan
waktu barang tersebut masuk ke divisinya secara otomatis oleh sistem. Dengan begini,
kita bisa bisa melakukan pelacakan lokasi terakhir maupun riwayat pemrosesan barang
produksi berdasarkan pencatatan-pencatatan yang dilakukan oleh tiap-tiap divisi.

3.2.

Perancangan dan Realisasi Perangkat Lunak
Pada bagian ini akan dijelaskan mengenai perancangan perangkat lunak.


Perancangan perangkat lunak yang akan dijelaskan dibagi menjadi dua bagian yaitu
perancangan perangkat lunak user interface dan perangkat lunak program database.
3.2.1. Navigasi Web Pada Sistem
Web navigasi dari sistem yang ditunjukkan oleh Gambar 3.2 menjelaskan alur
navigasi web yang terdapat pada sistem yang akan dibangun.

Gambar 3.2. Navigasi web dari sistem.
9

Pada Home page terdapat dua buah fitur yang tersedia yaitu fitur pelacakan untuk
melacak riwayat proses pengerjaan barang produksi dan fitur login untuk menampilkan
tiga buah laman yang berbeda sesuai dengan kode divisi yang dimiliki oleh operator
(Administrator, Divisi 1, dan selain Divisi 1). Role tersebut telah ditentukan oleh
administrator saat pembuatan akun. Administrator akan secara otomatis diarahkan
menuju laman administrator, operator dengan kode Divisi 1 akan secara otomatis
diarahkan menuju laman divisi registrasi, sedangkan operator dengan kode divisi selain
Divisi 1 akan secara otomatis diarahkan ke laman divisi pengerjaan.
Pada laman administrator terdapat 4 buah fitur yang tersedia yaitu:
1. Tambah user untuk melakukan registrasi akun yang nantinya akan digunakan

oleh operator baik operator di divisi 1 atau selain divisi 1.
2. Edit user untuk merubah divisi operator.
3. Tambah divisi untuk membuat jenis divisi baru.
4. Edit divisi untuk merubah nama sebuah divisi.
Pada laman divisi persiapan, terdapat fitur registrasi barang untuk melakukan
pencatatan identitas barang produksi yang akan dikerjakan. Ketika operator telah
melakukan penginputan identitas, sistem akan secara otomatis melakukan cetak barcode
sticker. Selain itu juga terdapat fitur untuk melakukan edit identitas barang untuk

melakukan koreksi data identitas barang jika ada kesalahan data. Operator dapat
kembali ke laman utama dengan melakukan click pada tombol logout yang telah
tersedia.
Pada laman divisi pengerjaan, terdapat fitur scanning barcode untuk melakukan
pencatatan riwayat barang produksi yang menyatakan bahwa barang produksi tersebut
telah diterima oleh divisi yang bersangkutan. Operator dapat kembali ke laman utama
dengan melakukan click pada tombol logout yang telah tersedia.

3.2.2. Diagram Use Case Pada Sistem
Diagram Use Case


dari sistem yang ditunjukkan pada Gambar 3.3

mendeskripsikan fungsi yang dapat dilakukan oleh setiap komponen yang berkaitan
dengan sistem.

10

Gambar 3.3. Diagram use case dari sistem.
Diagram use case menggambarkan aktifitas yang dilakukan oleh operator suatu
sistem dari sudut pandang pengamatan luar, dapat ditunjukkan seperti pada Gambar 3.3.
Dalam sistem terdapat 4 jenis operator yang terlibat, yaitu :
1. Divisi persiapan (divisi pertama)
Divisi persiapan adalah divisi pertama yang bertugas untuk menginputkan
identitas barang dan mencetak sticker barcode.
2. Divisi ke 2 dan seterusnya
Divisi ke 2 dan seterusnya bertugas untuk melakukan scanning barcode
sebagai sarana untuk pencatatan riwayat barang oleh sistem.
11

3. Administrator bertugas untuk membuat akun yang akan digunakan oleh

operator, mengganti divisi yang dimiliki oleh user, menambah jenis divisi
baru, dan mengganti nama divisi yang sudah ada.
4. User merupakan pengunjung laman utama web dapat melakukan pencarian
riwayat barang tanpa perlu melakukan login.
3.2.3. Diagram Aktivitas Pada Sistem

Gambar 3.4. Diagram aktivitas divisi pertama saat melakukan input
identitas barang.

12

Gambar 3.5. Diagram aktivitas divisi pertama saat mengedit identitas barang.
13

Gambar 3.6. Diagram aktivitas divisi ke 2 dan selanjutnya saat melakukan
pencatatan riwayat barang.
14

Gambar 3.7. Diagram aktivitas administrator saat menambah akun.


15

Gambar 3.8. Diagram aktivitas administrator saat mengedit kode divisi
akun.
16

Gambar 3.9. Diagram aktivitas administrator saat menambah divisi.

17

Gambar 3.10. Diagram aktivitas administrator saat mengedit nama divisi.
18

3.2.4. Perangkat Lunak User Interface
Pada bagian ini akan dijelaskan mengenai perancangan aplikasi desktop yang
digunakan sebagai program user interface yang meliputi cara kerja program user
inteface dan penjelasan tampilan program user inteface.

3.2.4.1.Laman Utama
Laman utama merupakan laman yang akan pertama kali dijumpai oleh user.

Laman utama memuat konten berupa fasilitas pelacakan barang berdasarkan tracking
number dan juga login site seperti yang ditunjukkan pada Gambar 3.11.

Gambar 3.11. Tampilan laman utama.
Gambar 3.12 menunjukkan diagram alir program pelacakan barang ketika button
Cari ditekan, sedangkan Gambar 3.13 menunjukkan diagram alir program login ketika
button Login ditekan.

19

Gambar 3.12. Diagram alir pelacakan.

Gambar 3.13. Diagram alir login.
20

3.2.4.2.Laman Divisi Pertama
Laman divisi pertama memuat konten berupa textbox yang akan digunakan untuk
pencatatan atribut keterangan barang produksi seperti yang ditunjukkan oleh Gambar
3.14.


Gambar 3.14. Tampilan laman untuk divisi pertama.
Pada laman divisi pertama, terdapat informasi berupa kode divisi dan nama divisi
sesuai dengan username yang melakukan login. User wajib untuk melengkapi semua
atribut keterangan barang produksi untuk melakukan registrasi barang produksi. Setelah
registrasi sukses, tracking number akan langsung dihasilkan oleh sistem secara otomatis
berdasarkan kondisi sebagai berikut:


Jika barang produksi merupakan barang produksi pertama yang
diregistrasikan pada hari tersebut, maka tracking number yang dihasilkan
berupa 8 digit pertama merupakan tanggal barang tersebut diregistrasikan
disusul dengan 8 digit angka 0. Contoh jika barang diregistrasikan pada

21

tanggal 5 Maret 2017, maka tracking number yang dihasilkan oleh sistem


adalah 2017030500000000.
Jika pada hari tersebut sudah ada barang lain yang diregistrasikan, maka

tracking number dihasilkan dari increament tracking number terakhir yang

dihasilkan pada hari barang produksi tersebut diregistrasikan. Contoh jika
barang terakhir memiliki tracking number 2017030500000000, maka
tracking

number

yang

akan

dihasilkan

oleh

sistem

adalah


2017030500000001.
Sistem akan secara otomatis mencetak sticker barcode yang sesuai dengan
representasi dari tracking number yang dihasilkan. Selain itu, sistem juga akan secara
otomatis melakukan pencatatan log barang produksi di database pada TabelLog.
Button Logout digunakan user untuk mengakhiri session dan kembali ke laman

utama.
3.2.4.3.Laman Divisi Ke 2 Dan Selanjutnya
Laman divisi lanjutan diperuntukkan untuk divisi kedua dan selanjutnya sampai
divisi terakhir dengan tampilan seperti yang ditunjukkan oleh Gambar 3.15.

Gambar 3.15. Tampilan laman untuk divisi ke 2 dan seterusnya.
Pada laman untuk divisi lanjutan juga terdapat keterangan kode divisi dan nama
divisi seperti yang terdapat pada laman untuk divisi pertama. Laman divisi ini terdapat
sebuah textbox yang digunakan sebagai input tracking number yang bisa diketik secara
manual maupun secara otomatis menggunakan barcode scanner. Gambar 3.16
menunjukkan diagram alir dari program ketika user menginputkan tracking number
untuk melakukan pencatatan log barang produksi.

22


Gambar 3.16. Diagram alir pencatatan barang produksi.

23

3.2.4.4.Laman Administrator Bagian Lihat UserName

Gambar 3.17. Tampilan laman untuk administrator melihat, membuat, dan
mengedit akun anggota.
3.2.4.5.Laman Administrator Bagian Lihat Divisi

Gambar 3.18. Tampilan laman untuk administrator melihat, membuat, dan
mengedit divisi.

24

3.2.5. Perangkat Lunak Database
Pada bagian ini akan dijelaskan mengenai perancangan database yang digunakan
sebagai media penyimpanan data.

3.2.5.1.Entity Relation Diagram (ERD)
Sistem memiliki 4 buah tabel utama untuk menyimpan informasi seperti yang
ditunjukkan oleh Gambar 3.19. TabelDiskripsi digunakan untuk menyimpan identitas
barang produksi yang dimiliki seperti Tracking Number yang berupa primary key,
Tanggal Input, Model, Warna, Ukuran, Bahan, dan Jumlah. Tabel login digunakan
untuk menyimpan identitas operator seperti UserName yang berupa primary key,
Password, Role, dan Kode Divisi. TabelLog merupakan enroll dari TabelDiskripsi dan
TabelLogin sehingga dapat menimbulkan kesan relasi many to many antara
TabelDiskripsi dan TabelLogin. TabelLog digunakan untuk menyimpan pencatatan
riwayat proses pengerjaan barang produksi. Untuk mengurangi redundancy pada
TabelLogin dimana akan ada banyak operator yang akan memiliki Kode Divisi dan
Nama Divisi yang sama, maka dibentuklah TabelDivisi sebagai penyimpan informasi
Nama Divisi tersebut. TabelDivisi dan TabelLogin memiliki relasi 1 to many dimana
dalam sebuah Nama Divisi akan muncul di TabelLogin lebih dari 1.

Gambar 3.19. Gambar ERD database yang akan digunakan.

3.2.6. Amazon EC2
Pada bagian ini akan dijelaskan mengenai persiapan yang dilakukan pada
komputer virtual Amazon EC2 untuk mendukung sistem yang akan dibangun. Segala

25

proses instalasi dan konfigurasi perangkat lunak dalam komputer virtual dilakukan
dengan menggunakan perangkat lunak Remote Desktop Connection yang tersedia
secara default pada operasi sistem Windows.

3.2.6.1.Sebagai Database Server
Supaya komputer virtual yang digunakan dapat berfungsi sebagai database server,
maka dilakukan instalasi perangkat lunak berupa Microsoft SQL Server Express versi
2016 dan juga Microsoft SQL Server Management Studio (SSMS) versi 17.1. Pada
tahap selanjutnya, database yang telah dibuat sebelumnya dilampirkan pada SQL server
melalui SSMS.

Gambar 3.20. Screenshot setelah dilakukan pelampiran database di SQL
Server Express.

3.2.6.2. Sebagai Web Server
Supaya komputer virtual yang digunakan dapat berfungsi sebagai web server ,
maka dilakukan instalasi perangkat lunak berupa Internet Information Service 7.0.
Setelah itu dilakukan pembuatan sites baru dengan merujuk sebuah folder sebagai
direktori acuan untuk menyimpan data website.

26

Gambar 3.21. Screenshot Sites baru yang telah dibuat.

Gambar 3.22. Screenshot tampilan direktori penyimpan data website.

27