VISUALISASI TIGA DIMENSI (3D) PENYUSUNAN BARANG
PADA GUDANG MENGGUNAKAN ALGORITMA
STEEPEST ASCENT HILL CLIMBING
SKRIPSI
STELA MARIS HAREFA 091402058
PROGRAM STUDI S1 TEKNOLOGI INFORMASI
FAKULTAS ILMU KOMPUTER DAN TEKNOLOGI INFORMASI
UNIVERSITAS SUMATERA UTARA
MEDAN
VISUALISASI TIGA DIMENSI (3D) PENYUSUNAN BARANG
PADA GUDANG MENGGUNAKAN ALGORITMA
STEEPEST ASCENT HILL CLIMBING
SKRIPSI
Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh ijazah Sarjana Teknologi Informasi
STELA MARIS HAREFA
091402058
PROGRAM STUDI S1 TEKNOLOGI INFORMASI
FAKULTAS ILMU KOMPUTER DAN TEKNOLOGI INFORMASI
UNIVERSITAS SUMATERA UTARA
MEDAN
PERSETUJUAN
Judul : VISUALISASI TIGA DIMENSI (3D)
PENYUSUNAN BARANG PADA GUDANG
MENGGUNAKAN ALGORITMA STEEPEST
ASCENT HILL CLIMBING
Kategori : SKRIPSI
Nama : STELA MARIS HAREFA
Nomor Induk Mahasiswa : 091402058
Program Studi : SARJANA (S1) TEKNOLOGI INFORMASI
Departemen : TEKNOLOGI INFORMASI
Fakultas : ILMU KOMPUTER DAN TEKNOLOGI
INFORMASI (FASILKOM-TI) UNIVERSITAS
SUMATERA UTARA
Diluluskan di
Medan, 29 Agustus 2014
Komisi Pembimbing :
Pembimbing 2 Pembimbing 1
Syahril Efendi, S.Si,M.I.T. M. Andri Budiman, S.T.,M.Comp.Sc,M.E.M.
NIP 19671110 199602 1 001 NIP 19751008 200801 1 011
Diketahui/Disetujui oleh
Program Studi S1 Teknologi Informasi Ketua,
iii
PERNYATAAN
VISUALISASI TIGA DIMENSI (3D) PENYUSUNAN BARANG PADA GUDANG
MENGGUNAKAN ALGORITMA STEEPEST ASCENT HILL CLIMBING
SKRIPSI
Saya mengakui bahwa skripsi ini adalah hasil karya saya sendiri, kecuali beberapa
kutipan dan ringkasan yang masing-masing telah disebutkan sumbernya.
Medan, 29 Agustus 2014
UCAPAN TERIMA KASIH
Segala puji dan syukur penulis sampaikan kepada Tuhan Yesus yang telah memberikan berkat-Nya yang melimpah sehingga penulis dapat menyelesaikan skripsi ini dengan baik untuk memperoleh gelar Sarjana Teknologi Informasi, Program Studi S1 Teknologi Informasi Universitas Sumatera Utara.
Dengan segala kerendahan hati penulis ucapkan terima kasih kepada:
1. Ayah penulis, Drs. Nehemia Harefa M.BA, ibu penulis, Sari Isa Harefa, S.E.,
dan kakak penulis Ribka Sola Gratia Harefa, S.E., adik penulis Norman Chris Lalasaro Harefa yang telah memberikan doa dan dukungan moral kepada penulis untuk menyelesaikan skripsi ini beserta keluarga besar yang telah turut mendoakan penulis.
2. Bapak M. Andri Budiman, S.T.,M.Comp.Sc,M.E.M. dan Bapak Syahril
Efendi, S.Si,M.I.T. selaku dosen pembimbing penulis yang telah meluangkan waktu, pikiran, saran, dan kritiknya untuk penulis dalam menyelesaikan skripsi ini.
3. Ibu Sarah Purnamawati, S.T., M.Sc dan Bapak Dani Gunawan, S.T., M.T.
yang telah bersedia menjadi dosen penguji dan memberikan saran dan kritik yang membangun dalam penyelesaian skripsi ini.
4. Ketua dan Sekretaris Program Studi S1 Teknologi Informasi, Bapak M.
Anggia Muchtar, S.T., MM.IT. dan Bapak Mohammad Fadly Syahputra, B.Sc., M.Sc.IT.
5. Seluruh dosen yang mengajar serta Ibu Delima dan Bang Faisal, sebagai staf Tata Usaha Program Studi Teknologi Informasi Universitas Sumatera Utara.
6. Sahabat-sahabat yang selalu mendukung dan memberi semangat kepada
penulis, Fida Elvi Anderia Sebayang, S.TI, Ade Chania Sion Sagala, S.TI, Cynthia Arilla Sembiring, S.TI, Riska Vinesia Butarbutar, S.TI, Jihan Meutia Fauzen, S.TI, Annifa Iqramitha, S.TI, Anggreiny WAF Br. Ginting dan semua teman angkatan 2009, Jhohanes Purba, Josua Sinaga.
7. Sahabat penulis Melva Vicensia Gulo, S.E., Albenia Gulo, S.Pd. dan Belina Lis Wardani Zebua, S.Ked. yang selalu mendoakan dan memberi semangat.
8. Seluruh rekan kuliah sejawat yang tidak dapat disebutkan satu persatu.
v
ABSTRAK
Dewasa ini penyusunan barang pada gudang masih sering dilakukan secara manual
dan sembarangan sehingga dapat menyebabkan penggunaan ruang tambahan serta
dapat mengakibatkan rusaknya barang-barang yang ditumpuk karena tidak
memperhatikan daya tampung masing-masing barang serta tidak mengetahui tata letak
barang yang telah berada dalam ruangan. Dengan adanya perkembangan teknologi
saat ini dapat memudahkan manusia untuk menyelesaikan permasalahan tersebut.
Oleh karena itu dibuatlah sebuah aplikasi yang berfungsi untuk menampilkan
penyusunan barang pada gudang. Aplikasi ini menampilkan barang yang disusun
dengan menggunakan parameter berat dan volume barang. Penelitian ini
menggunakan teknologi WebGL untuk membangun objek 3D (tiga dimensi) pada web
browser serta algoritma Steepest Ascent Hill Climbing untuk menentukan urutan
barang yang akan disusun dalam gudang. Hasil pengujian menyimpulkan bahwa
algoritma Steepest Ascent Hill Climbing dapat menentukan urutan barang yang akan
disusun dalam gudang berdasarkan parameter berat barang. Selain menampilkan
barang yang telah disusun dalam gudang secara tiga dimensi (3D) aplikasi ini juga
dapat menentukan tata letak barang yang akan disusun dalam gudang dengan
membandingkan parameter panjang, tinggi dan lebar barang kepada panjang, tinggi
dan lebar ruangan. Aplikasi ini juga menampilkan data barang yang telah diinputkan
user, data barang yang tidak dapat masuk ke dalam gudang serta menampilkan data
kapasitas maksimal tumpukan masing-masing barang.
VISUALIZATION OF THREE DIMENSIONAL (3D) PACKING GOODS
IN WAREHOUSE USING STEEPEST ASCENT HILL
CLIMBING ALGORITHM
ABSTRACT
Nowdays of goods in the warehouse is still done manually and carelessly that can
cause ineffective spacing and cause additional space and alsodamage to the goods
stacked for not paying capacity of each item and knowing the layout of the items are
already in the room. By the current technology developments makes the people to
solve these problems. Therefore we need an application that serves us to show the
preparation goods in the warehouse. This application displays the prepared items by
the parameters of the weight and the volume of goods. This research uses the
technology WebGL to build 3D (three dimensional) object and Steepest Ascent Hill
Climbing Algorithm to determine the order of the goods which will be arraged in the
warehouse. The results concluded that the Steepest Ascent Hill Climbing Algorithm
can determine the order of goods which will be arranged in the warehouse based on
the weight of the item parameters. In addition to display the goods in three dimensions
(3D) this application also determine the layout of items that will be arranged in the
warehouse and displays the input data items, items that can not fit into the data
warehouse and displays the maximum capacity of each pile of stuff.
Keywords: steepest ascent hill climbing algorithm, visualization of three dimensional
vii
DAFTAR ISI
Halaman
PERSETUJUAN ii
PERNYATAAN iii
UCAPAN TERIMA KASIH iv
ABSTRAK v
1.4. Tujuan Penelitian 2
1.5. Manfaat Penelitian 3
1.6. Metodologi Penelitian 3
1.7. Sistematika Penulisan 4
BAB 2 LANDASAN TEORI 5
2.1. Visualisasi 5
2.2. Gudang 5
2.3. Grafika Komputer 5
2.3.1. Grafik 3 dimensi (3D) 6
2.4. Penyusunan Barang menggunakan Block Stacking 6
2.5. Teori Dasar Algoritma Hill Climbing 6
2.5.1. Algoritma simple hill climbing 7
2.5.2. Algoritma steepest ascent hill climbing 7
2.6. Relevansi Steepest Ascent Hill Climbing Algorithm
Pada Pola Penyusunan Barang 11
2.7. Teknologi WebGL 11
2.8. HTML5 12
2.9. Javascript 12
2.9.1. Library 13
2.10. Penelitian Terdahulu 13
BAB 3 ANALISIS DAN PERANCANGAN SISTEM 17
3.1. Perancangan Objek 3D (tiga dimensi) 17
3.2. Perancangan Database 20
3.2.1. Data barang 23
a. Tabel barang 23
b. Tabel barang sisa 24
d. Tabel hc barang 26
e. Tabel user 26
3.2.2. Data ruangan 26
3.3. Analisis Sistem 27
3.3.1. Proses user 27
3.3.2. Analisis algoritma steepest ascent hill climbing pada
Aplikasi penyusunan barang pada gudang 3D (tiga dimensi) 28
3.3.3.Penentuan barang yang masuk pada gudang
visualisasi 3D (tiga dimensi) 32
3.4. Perancangan Sistem 34
3.4.1. Arsitektur umum (general architecture) 34
3.4.2. Diagram use case 34
3.4.3. Realisasi definisi use case 35
3.5. Perancangan Tampilan Antarmuka 36
3.5.1. Rancangan halaman login user 38
3.5.2. Rancangan halaman registrasi user 37
3.5.3. Rancangan halaman konfigurasi 37
3.5.4. Rancangan halaman utama user 38
3.5.5. Rancangan halaman hasil proses pengurutan
algoritma steepest ascent hill climbing 39
3.5.6. Rancangan halaman visualisasi 3D 40
BAB 4 IMPLEMENTASI DAN PENGUJIAN 41
4.1. Implementasi Sistem 41
4.1.1. Spesifikasi perangkat keras dan
perangkat lunak yang digunakan 41
4.1.2. Implementasi Perancangan Antarmuka 41
a. Tampilan halaman konfigurasi 42
b. Tampilan halaman utama user 43
c. Tampilan halaman proses algoritma
steepest ascent hill climbing 42
d. Tampilan halaman visualisasi 3D 43
4.2. Pengujian Sistem 46
4.2.1. Pengujian pada proses yang dilakukan user 47
4.2.2. Pengujian pada proses yang dilakukan sistem 47
4.2.3. Pengujian kinerja sistem 48
BAB 5 KESIMPULAN DAN SARAN 49
5.1. Kesimpulan 49
5.2. Saran 49
DAFTAR PUSTAKA 50
ix
DAFTAR TABEL
Halaman
Tabel 2.1. Penelitian Terdahulu 15
Tabel 3.1. Rancangan Tabel Ukuran Ruangan 21
Tabel 3.2. Rancangan Tabel Barang 21
Tabel 3.3. Rancangan Tabel Barang Sisa 21
Tabel 3.4. Rancangan Tabel User 22
Tabel 3.5. Rancangan Tabel Temp Barang 22
Tabel 3.6. Rancangan Tabel hc_berat 23
Tabel 3.7. Tabel Barang 24
Tabel 3.8. Tabel Barang Sisa 24
Tabel 3.9. Tabel Temp Barang 25
Tabel 3.10. Tabel HC Berat 26
Tabel 3.11. Tabel User 26
Tabel 3.12. Tabel Ukuran Ruangan 27
Tabel 3.13. Tabel Successor 1 28
Tabel 3.14. Tabel Successor SUCC 1 29
Tabel 3.15. Tabel Successor 2 30
DAFTAR GAMBAR
Halaman
Gambar 2.1. Graf TSP (Traveling Salesman Problem) 8
Gambar 2.2. Flowchart Algoritma Steepest Ascent Hill Climbing 10
Gambar 3.1. Sistem Koordinat 17
Gambar 3.2. Perspective Camera 18
Gambar 3.3. Ruangan 19
Gambar 3.4. Letak Barang Pertama 19
Gambar 3.5. Letak Barang Kedua 20
Gambar 3.6. Letak Barang Berikutnya 20
Gambar 3.7. Flowchart Proses User 29
Gambar 3.8. Flowchart Penentuan Barang Yang Masuk Pada Gudang 33
Gambar 3.9. General Architecture 34
Gambar 3.10. Diagram Use case 35
Gambar 3.11. Rancangan Halaman Login User 37
Gambar 3.12. Rancangan Halaman Registrasi User 37
Gambar 3.13. Rancangan Halaman Konfigurasi 38
Gambar 3.14. Rancangan Halamn Utama User 39
Gambar 3.15. Rancangan Halaman Proses User 39
Gambar 3.16. Rancangan Halaman Visualisasi 3D 40
Gambar 4.1. Tampilan Halaman Konfigurasi 42
Gambar 4.2. Tampilan Halaman Utama User 43
Gambar 4.3. Tampilan Halaman Proses 43
Gambar 4.4. Tampilan Halaman Visualisasi 3D 44
Gambar 4.5. Tampilan Halaman Visualisasi 3D(dari depan) 44
Gambar 4.6. Tampilan Halaman Visualisasi 3D(dari kanan) 45
Gambar 4.7. Tampilan Halaman Visualisasi 3D(dari kiri) 45
Gambar 4.8. Tampilan Halaman Visualisasi 3D(dari atas) 46
Gambar 4.9. Tampilan Halaman Visualisasi 3D(dari bawah) 46
Gambar 4.10. Database Tabel hc_berat
(algoritma Steepest Ascent Hill Climbing) 47
v
ABSTRAK
Dewasa ini penyusunan barang pada gudang masih sering dilakukan secara manual
dan sembarangan sehingga dapat menyebabkan penggunaan ruang tambahan serta
dapat mengakibatkan rusaknya barang-barang yang ditumpuk karena tidak
memperhatikan daya tampung masing-masing barang serta tidak mengetahui tata letak
barang yang telah berada dalam ruangan. Dengan adanya perkembangan teknologi
saat ini dapat memudahkan manusia untuk menyelesaikan permasalahan tersebut.
Oleh karena itu dibuatlah sebuah aplikasi yang berfungsi untuk menampilkan
penyusunan barang pada gudang. Aplikasi ini menampilkan barang yang disusun
dengan menggunakan parameter berat dan volume barang. Penelitian ini
menggunakan teknologi WebGL untuk membangun objek 3D (tiga dimensi) pada web
browser serta algoritma Steepest Ascent Hill Climbing untuk menentukan urutan
barang yang akan disusun dalam gudang. Hasil pengujian menyimpulkan bahwa
algoritma Steepest Ascent Hill Climbing dapat menentukan urutan barang yang akan
disusun dalam gudang berdasarkan parameter berat barang. Selain menampilkan
barang yang telah disusun dalam gudang secara tiga dimensi (3D) aplikasi ini juga
dapat menentukan tata letak barang yang akan disusun dalam gudang dengan
membandingkan parameter panjang, tinggi dan lebar barang kepada panjang, tinggi
dan lebar ruangan. Aplikasi ini juga menampilkan data barang yang telah diinputkan
user, data barang yang tidak dapat masuk ke dalam gudang serta menampilkan data
kapasitas maksimal tumpukan masing-masing barang.
VISUALIZATION OF THREE DIMENSIONAL (3D) PACKING GOODS
IN WAREHOUSE USING STEEPEST ASCENT HILL
CLIMBING ALGORITHM
ABSTRACT
Nowdays of goods in the warehouse is still done manually and carelessly that can
cause ineffective spacing and cause additional space and alsodamage to the goods
stacked for not paying capacity of each item and knowing the layout of the items are
already in the room. By the current technology developments makes the people to
solve these problems. Therefore we need an application that serves us to show the
preparation goods in the warehouse. This application displays the prepared items by
the parameters of the weight and the volume of goods. This research uses the
technology WebGL to build 3D (three dimensional) object and Steepest Ascent Hill
Climbing Algorithm to determine the order of the goods which will be arraged in the
warehouse. The results concluded that the Steepest Ascent Hill Climbing Algorithm
can determine the order of goods which will be arranged in the warehouse based on
the weight of the item parameters. In addition to display the goods in three dimensions
(3D) this application also determine the layout of items that will be arranged in the
warehouse and displays the input data items, items that can not fit into the data
warehouse and displays the maximum capacity of each pile of stuff.
Keywords: steepest ascent hill climbing algorithm, visualization of three dimensional
BAB 1
PENDAHULUAN
1.1. Latar Belakang
Proses kerja sebuah pabrik atau perusahaan saat ini tidak terlepas dari penggunaan
fungsi gudang sebagai tempat penyimpanan barang-barang. Karena tingginya tingkat
penggunaan gudang sebagai tempat penyimpanan barang maka efisiensi peletakan
(tata letak) barang pada ruang gudang sangat dibutuhkan.
Pada proses penyusunan barang dalam gudang, sering sekali tidak
dipertimbangkan aturan peletakan atau penyusunan barang yang dapat mengakibatkan
penggunaan gudang tambahan serta rusaknya barang karena ditumpuk tanpa
memperhitungkan batas maksimal tumpukan barang-barang. Salah satu penyebab
penyusunan barang yang sembarangan adalah karena kurangnya informasi tentang tata
letak barang yang telah tersimpan dalam gudang. Oleh karena itu dibutuhkan
visualisasi untuk penyusunan barang-barang yang akan dimasukkan ke dalam gudang
saat proses penyimpan barang di dalam gudang.
Pesatnya perkembangan teknologi saat ini khususnya pada bidang komputer
grafik memampukan pembuatan visualisasi yang semakin baik. Visualisasi adalah
rekayasa dalam pembuatan gambar, diagram serta animasi untuk menampilkan suatu
informasi. Perkembangan animasi juga telah banyak membantu dalam bidang
visualisasi yang lebih kompleks dan canggih. Visualisasi juga merupakan konversi
data relasi diantara item data atau atribut yang dapat dianalisis atau dilaporkan
(Mardhoko, 2011).
Kemajuan teknologi saat ini membuat banyak aplikasi yang dapat
memudahkan aktivitas manusia dalam pekerjaan sehari-hari. Salah satunya yaitu
aplikasi web yang merupakan aplikasi yang dapat diakses melalui jaringan internet
menggunakan teknologi web browser. Pada tugas akhir ini akan dibuat sebuah aplikasi
visualisasi tiga dimensi (3D) untuk penyusunan barang pada gudang yang berbasiskan
Aplikasi ini dapat membantu penyusunan barang dalam gudang dengan
menampilkan penyusunan barang secara tiga dimensi (3D) menggunakan PHP dan
MySql, JavaScript, HTML5 dan WebGL. Dalam pembuatan aplikasi ini penulis
menggunakan algoritma Steepest Ascent Hill Climbing.
Beberapa penelitian sebelumnya mengenai aplikasi penyusunan barang serta
visualisasi tiga dimensi (3D) yaitu: Optimasi Pola Penyusunan Barang dalam Ruang
Tiga Dimensi menggunakan Metode Genetic Algorithms (Gunadi, Julistiono &
Hariyanto, 2003), Pengembangan Algoritma Bee Swarm Optimization untuk
Penyelesaian Container Stowage Problem (Putmawa & Santosa, 2011),
Pengembangan Algoritma Greedy untuk Optimalisasi Penataan Peti Kemas pada
Kapal Pengangkut(Angga & Munir, 2012), Sistem Alokasi Penyimpanan Barang pada
Gudang(Hambali, 2011), Optimasi Pengambilan dan Penataan Ulang Barang di
Gudang dengan Penerapan Stack menggunakan Metode Genetic Algorithm(Lim,
Gunadi & Gang), Penerapan Teknologi WebGL pada Virtual Aquarium Berbasis Tiga
Dimensi (3D) (Hendry, 2011), dan Pembuatan Simulasi Pergerakan Objek 3D (Tiga
Dimensi) Menggunakan OpenGL (Suhardiman, D., et al. 2012).
1.2. Rumusan Masalah
Penyusunan barang dalam gudang yang sering dilakukan sembarangan sehingga dapat
menyebabkan rusaknya barang yang ditumpuk. Berdasarkan latar belakag di atas
maka rumusan masalah pada tugas akhir ini yaitu bagaimana mengetahui tata letak
barang yang disusun dalam gudang.
1.3. Batasan Masalah
Adapun batasan masalah dalam penelitian ini adalah:
1. Input yang dimasukkan adalah ukuran ruangan, ukuran barang, berat barang.
2. Jenis barang yang digunakan berbentuk kubus dan balok.
3. Diasumsikan barang masuk dari atas ruangan.
4. Tidak memperhatikan jenis barang serta cara keluar dan masuknya barang.
1.4. Tujuan Penelitian
Tujuan dari penelitian ini adalah untuk menampilkan dalam bentuk visual penyusunan
3
mengetahui tata letak barang yang disusun di dalam gudang berdasarkan algoritma
Steepest Ascent Hill Climbing.
1.5. Manfaat Penelitian
Manfaat dari penelitian ini yaitu:
1. Pengguna dapat mengetahui tata letak barang yang telah dimasukkan ke dalam
gudang melalui visualisasi 3D.
2. Sarana pembelajaran mengenai konsep algoritma Steepest Ascent Hill Climbing
pada proses penyusunan barang pada gudang dan penerapannya pada lingkungan
web browser.
3. Sarana pembelajaran mengenai pengembangan aplikasi tiga dimensi (3D)
berbasis web browser.
1.6. Metodologi Penelitian
Adapun metodologi yang digunakan pada penelitian ini adalah:
1. Studi Literatur
Pada tahap ini peneliti mencari algoritma yang berbeda dari yang telah
digunakan sebelumnya untuk penyusunan barang pada gudang. Memahami
lebih dalam mengenai penyusunan barang pada gudang serta pembuatan
visualisasi 3D (tiga dimensi) melalui referensi-referensi dari buku maupun
melalui situs internet.
2. Desain Sistem
Pada tahap ini, peneliti membuat flowchart system, use case, dan arsitektur
umum dari sistem yang akan dibuat.
4. Pembuatan Sistem
Pada tahap ini peneliti memulai mengkodekan sistem dengan menggunakan
bahasa pemrograman PHP, JavaScript, dengan database MySQL pada
HTML5 dan WebGL.
5. Pengujian Sistem
Pada tahap ini, peneliti melakukan pengujian dari sistem yang telah dibuat.
Pengujian akan menampilkan gambar visual tiga dimensi (3D) barang yang
6. Dokumentasi
Pada tahap ini peneliti menyusun laporan terhadap sistem yang telah dibuat.
1.7. Sistematika Penulisan
Adapun bagian utama dari sistematika penulisan skripsi ini, yaitu:
BAB 1. PENDAHULUAN
Bab ini berisikan latar belakang diangkatnya judul skripsi, perumusan masalah yang
diambil, batasan-batasan masalahnya, tujuan, dan manfaat penelitian, metodologi
penulisan, serta sistematika penulisan dari penyusunan skripsi ini.
BAB 2. TINJAUAN PUSTAKA
Bab ini menjelaskan mengenai landasan teori dan penelitian terdahulu.
BAB 3. ANALISIS DAN PERANCANGAN SISTEM
Bab ini menjelaskan analisis dari metode/algoritma yang akan digunakan yaitu
algoritma Steepest Ascent Hill Climbing dan perancangan aplikasi yang akan dibuat
yaitu aplikasi visualisasi tiga dimensi (3D) penyusunan barang pada gudang berbasis
web.
BAB 4. IMPLEMENTASI DAN PENGUJIAN
Bab ini menjelaskan implementasi dari analisis yang dilakukan dan pengujian
terhadap sistem.
BAB 5. KESIMPULAN DAN SARAN
Bab ini menguraikan rangkuman dari masing-masing subbab yang ada serta
BAB 2
LANDASAN TEORI
Pada bab ini akan dijelaskan tentang landasan dari konsep dan teori yang digunakan
untuk mendukung pembuatan aplikasi yang dibuat. Landasan teori serta konsep yang
akan dijelaskan meliputi penjelasan mengenai grafika komputer, algoritma Steepest
Ascent Hill Climbing, WebGL dan Three.js.
2.1. Visualisasi
Visualisasi merupakan pengungkapan suatu gagasan atau perasaan dengan
menggunakan bentuk gambar, tulisan (kata dan angka), peta, grafik dan lain
sebagainya (KBBI, 2012).
2.2. Gudang
Menurut Kamus Besar Bahasa Indonesia (KBBI), gudang merupakan sebuah rumah
atau bangsal tempat untuk menyimpan barang-barang, baik itu berupa barang-barang
kimia, kumpulan surat/arsip-arsip, sesuatu yang mudah dibekukan, tempat menyimpan
senjata, dan lain-lain. Menurut Oxford Dictionaries, Warehouse merupakan sebuah
bangunan besar tempat penyimpanan bahan-bahan mentah ataupun barang-barang
manufaktur yang akan didistribusikan untuk dijual.
2.3. Grafika Komputer
Grafika komputer sering dikenal dengan istilah visualisasi data. Grafika komputer
merupakan bagian dari ilmu komputer yang berkaitan dengan pembuatan serta
manipulasi gambar (visual) secara digital. Awalnya grafika komputer memiliki bentuk
yang masih sederhana yaitu dua dimensi (2D), kemudian berkembang menjadi tiga
dimensi (3D), pemrosesan citra (image processing) dan pengenalan pola (pattern
recognition). Menurut Hudjuli (2012) bagian dari grafika komputer meliputi:
(2) Animasi: mempelajari tentang cara menggambarkan dan memanipulasi
gerakan.
(3) Rendering: mempelajari tentang algoritma untuk menampilkan efek cahaya.
(4) Citra (Imaging): mempelajari tentang cara mengambil dan menyunting
gambar.
2.3.1. Grafik 3 dimensi (3d)
Menurut Basuki dan Nana (2009) objek tiga dimensi (3D) merupakan kumpulan
titik-titik 3D (x, y, z) yang kemudian membentuk luasan-luasan (face) yang digabungakan
menjadi satu kesatuan. Face merupakan gabungan titik-titik yang membentuk luasan
tertentu atau sering dinamakan dengan sisi.
2.4. Penyusunan Barang menggunakan metode Block Stacking
Pada aplikasi ini penyusunan barang menggunakan metode block stacking, dimana
penyusunan barang mengacu pada penyusunan barang yang ditumpuk ke arah atas
dengan ketinggian tertentu (Yahya, 2013). Oleh karena itu penyusunan barang dimulai
dari sebelah kiri ruangan kemudian disusun ke atas dengan syarat barang yang disusun
di atas memiliki bobot/berat lebih kecil atau sama dengan bobot/berat barang yang
berada di bawah serta memiliki panjang dan lebar yang lebih kecil atau sama dengan
barang yang berada di bawahnya. Apabila barang yang telah ditumpuk telah mencapai
batas maksimal tumpukan (total berat barang yang ditumpuk kecil atau sama dengan
barang dibawahnya) maka barang akan disusun ke samping kanan. Jika barang yang
telah disusun tidak dimungkinkan lagi untuk disusun ke samping maka barang
berikutnya akan disusun di depan barang yang sebelumnya telah disusun, susunan
dimulai dari sebelah kiri ruangan dan begitu seterusnya.
2.5. Teori Dasar Algoritma Hill Climbing
Algoritma Hill Climbing merupakan salah satu algoritma pencarian lokal. Algoritma
hill climbing dimulai dengan memilih sembarang lintasan dan membuat iterasi
perubahan kecil pada solusi, setiap langkah mencari solusi yang terbaik, ketika
algoritma tidak dapat melihat perbaikan lagi maka berhenti. Pada saat itulah
ditemukan solusi tebaik. Kelebihan algoritma hill climbing yaitu algoritma ini dapat
menentukan beberapa kemungkinan solusi yang terjadi sehigga dapat dicari
7
kelemahannya yaitu algoritma ini membutuhkan waktu yang relatif lama karena harus
menghitung kemungkinan solusi yang banyak. Algoritma hill climbing dibedakan
menjadi dua, yaitu : algoritma Simple Hill Climbing dan algoritma Steepest Hill
Climbing (Mufarricha, 2010).
2.5.1. Algoritma simple hill climbing
Algoritma Simple Hill Climbing melakukan proses pengujian dengan menggunakan
fungsi heuristik. Pembangkitan keadaan berikutnya sangat bergantung terhadap
feedback dari prosedur pengetesan. Proses kerja algoritma simple hill climbing adalah
sebagai berikut (Kusumadewi & Purnomo, 2005) :
1. Dimulai dari keadaan awal, dilakukan pengujian. Jika merupakan tujuan maka
berhenti, jika tidak maka lanjutkan dengan keadaan sekarang sebagai keadaan
awal.
2. Lanjutkan langkah-langkah berikut hingga tujuan tercapai atau hingga iterasi
tidak memberikan perubahan pada keadaan sekarang:
a. Cari operator yang belum pernah digunakan; gunakan operator ini
untuk mendapatkan keadaan baru.
b. Evaluasi keadaan baru tersebut.
i. Jika keadaan baru tersebut merupakan tujuan, keluar.
ii. Jika bukan tujuan, namun nilainya lebih baik daripada keadaan
sekarang, maka jadikan keadaan baru tersebut menjadi keadaan
sekarang.
iii.Jika keadaan baru tersebut tidak lebih baik daripada keadaan
sekarang, maka lanjutkan iterasi.
2.5.2. Algoritma Steepest Ascent Hill Climbing
Algoritma Steppest Ascent Hill Climbing hampir sama dengan algoritma Simple Hill
Climbing, perbedaannya terdapat pada pencarian yang dilakukan algoritma Steepest
Ascent Hill Climbing tidak dimulai dari posisi paling kiri, melainkan gerakan
selanjutnya dicari berdasarkan nilai heuristic terbaik. Dalam hal ini urutan dari
penggunaan operator tidak menentukan penemuan solusi. Cara kerja algoritma
Steepest Ascent Hill Climbing adalah sebagai berikut sekarang (Kusumadewi &
1. Dimulai dari keadaan awal, dilakukan pengujian. Jika merupakan tujuan maka
berhenti, jika tidak maka lanjutkan dengan keadaan sekarang sebagai keadaan
awal.
2. Lanjutkan langkah-langkah berikut hingga tujuan tercapai atau hingga iterasi
tidak memberikan perubahan pada keadaan sekarang:
a. Tentukan SUCC sebagai nilai heuristik terbaik dari
successor-successor.
b. Kerjakan untuk tiap operator yang digunakan oleh keadaan sekarang.
i. Gunakan operator tersebut dan bentuk keadaan baru.
ii. Evaluasi keadaan baru tersebut. Jika merupakan tujuan maka
keluar, jika bukan maka bandingkan nilai heuristiknya dengan
SUCC. Jika nilai heuristiknya lebih baik dari nilai SUCC, maka
jadikan nilai heuristik tersebut sebagai SUCC, namun jika nilai
heuristik tidak lebih baik dari nilai SUCC maka nilai SUCC tidak
berubah.
c. Jika SUCC lebih baik daripada nilai heuristik keadaan sekarang, ubah
node SUCC menjadi keadaan sekarang.
Keterangan: SUCC adalah nilai heuristik terbaik dari
successor-successor.
Contoh implementasi Algoritma Steepest Ascent Hill Climbing pada persoalan TSP
(Traveling Salesman Problem):
Seorang tourist ingin mengunjungi n kota. Jarak antar tiap-tiap kota sudah diketahui.
Yang ingin dicari adalah jarak terpendek dimana setiap kota hanya boleh dikunjungi
tepat 1 kali. Misalkan terdapat 4 kota dengan jarak tiap-tiap kota sebagai berikut:
9
4 5
8 6
7
Gambar 2.1. Graf TSP(Traveling Salesman Problem)
C
A B
9
Solusi-solusi yang mungkin dengan menyusun kota-kota dalam urutan abjad,
misalkan:
A – B – C – D : dengan panjang lintasan = 9+6+7 = 22.
B – A – C – D : dengan panjang lintasan = 9+4+7 = 20.
C – B – A – D : dengan panjang lintasan = 6+9+8 = 23.
D – B – C – A : dengan panjang lintasan = 5+6+4 = 15.
(1) Algoritma Simple Hill Climbing
Operator digunakan untuk menukar posisi kota yang bersebelahan. Fungsi
heuristik yang digunakan adalah panjang lintasan yang terjadi. Maka
penggunaan operator pada lintasan adalah sebagai berikut:
Tukar 1,2 tukar urutan posisi kota ke-1 dengan kota ke-2
Tukar 2,3 tukar urutan posisi kota ke-2 dengan kota ke-3
Tukar 3,4 tukar urutan posisi kota ke-3 dengan kota ke-4
Tukar 4,1 tukar urutan posisi kota ke-4 dengan kota ke-1
Tukar 2,4 tukar urutan posisi kota ke-2 dengan kota ke-4
Tukar 1,3 tukar urutan posisi kota ke-1 dengan kota ke-3
Algoritma Steepest Ascent Hill Climbing hampir sama dengan Simple Hill
Climbing, hanya saja gerakan pencarian tidak dimulai dari kiri melainkan
berdasarkan nilai heuristik terbaik.
Keadaan awal lintasan ABCD (22).
Tukar 1, 2 BACD = 9 + 4 + 7 = 20.
Dipilih nilai terkecil dari graf tersebut. Karena nilai yang terkecil pertama
adalah ACBD(15), maka langkah selanjutnya dimulai dari ACBD(15).
Tukar 1, 2 CABD = 4 + 9 + 5 = 18.
Tukar 2, 3 ABCD = 9 + 6 + 7 = 22.
Tukar 3, 4 ACDB = 4 + 7 + 5 = 16.
Tukar 2, 4 ADBC = 8 + 5 + 6 = 19.
Tukar 1, 3 BCAD = 6 + 4 + 8 = 18.
Karena tidak terdapat nilai yang lebih kecil dari ACBD(15), maka solusi akhir
yang di dapat adalah ACBD(15).
(Sumber:http://www.slideshare.net/ceezabramovic/metode-pencarian-heuristik).
Flowchart algoritma Steepest Ascent Hill Climbing dapat dilihat pada Gambar 2.1.
Inisialisasi Awal
11
2.6. Relevansi Steepest Ascent Hill Climbing Algorithm Pada Pola Penyusunan
Barang
Algoritma Steepest Ascent Hill Climbing digunakan untuk menyelesaikan
permasalahan tata letak penyusunan barang pada ruang tiga dimensi dengan tujuan
mendapatkan pola penyusunan barang yang terbaik. Parameter optimal atau tidaknya
penyusunan barang pada gudang diukur berdasarkan sisa ruang kosong yang tersisa
ketika masih terdapat barang yang tidak dapat lagi dimuat/dimasukkan dalam ruangan
tersebut. Semakin sedikit ruang kosong yang terdapat pada suatu pola penyusunan
barang maka pola penyusunan tersebut merupakan solusi terbaik.
Pada proses penyusunan barang pada gudang 3D (tiga dimensi), salah satu
parameter yang menentukan pola penyusunan barang adalah berat barang. Barang
yang memiliki berat paling besar akan disusun pertama, kemudian diikuti dengan
barang yang memiliki berat lebih kecil dari barang sebelumnya tersebut.
2.7. Teknologi WebGL
Beberapa teknologi selain WebGL yang dapat membangun objek 3D (tiga dimensi),
yaitu: Unity 3D, Flash Stage 3D, Silverlight 3D, Direct 3D, OpenGL dan OpenGL ES
(Boesch, F. 2013). Kelebihan dari WebGL yaitu WebGL dapat berjalan di banyak
browser, seperti: Chrome, Firefox, Safari dan Opera. Selain itu untuk dapat
membangun sebuah objek 3D (tiga dimensi) pada WebGL, user tidak perlu menginstal
plug-in terlebih dahulu.
Teknologi WebGL berawal dari pengembangan OpenGL ES 2.0. Beberapa
contoh pengembangan OpenGL antara lain berbasis web, real-time rendering yang
memungkinkan pembuatan tiga dimensi (3D) di web, visualisasi scientific dan medical
imaging. Pembuatan rendering grafik komputer pada WebGL dapat dibuat dengan
hanya menggunakan javascript, web browser, serta HTML5 canvas. WebGL
merupakan library grafis yang merupakan standar untuk grafik tiga dimensi (3D) di
web browser yang memungkinkan browser untuk membuat adegan tiga dimensi (3D).
Elemen yang menyusun bagian dari adegan tiga dimensi (3D) didownload dari server,
akan tetapi semua proses untuk mendapatkan gambar dilakukan secara lokal
menggunakan hardware grafis client. Beberapa komponen aplikasi WebGL yaitu
- Canvas : tempat komponen objek yang akan diletakkan dan merupakan
elemen standar HTML5 yang dapat diakses menggunakan Document
Object Model (DOM) melalui JavaScript.
- Object : entitas 3D yang membentuk bagian dari adegan itu.
- Lights : pencahayaan dalam 3D.
- Camera : berfungsi sebagai viewport (untuk melihat dan mengeksplorasi
adegan 3D dalam canvas)
Menurut Demeuse, J. (2013), dalam WebGL terdapat : mesh, camera, dan lighting.
2.8. HTML5
HTML5 adalah iterasi dari HTML(HyperText Markup Language). HTML pertama kali
distandarisasi tahun 1993 dan digunakan pada World Wide Web. HTML digunakan
untuk menentukan isi dari suatu halaman web dengan menggunakan tag “< >”.
HTML5 Canvas adalah sebuah area bitmap pada layar yang dapat dimanipulasi
menggunakan JavaScript dengan cara me-render pixel pada canvas di layar. Dasar
HTML5 Canvas API (Application Program Interface) mencakup konteks 2D (dua
dimensi) yang memungkinkan programmer menggambar berbagai bentuk, text render,
dan menampilkan gambar langsung ke area tertentu dari jendela browser serta dapat
menerapkan warna, rotasi, transparansi alpha, manipulasi pixel dan berbagai jenis
garis, kurva, dan kotak untuk mendapatkan bentuk, teks dan gambar yang ditempatkan
ke canvas (Fulton, S & Fulton, J. 2011).
2.9. JavaScript
JavaScript pertama kali muncul pada tahun 1995. Tujuan utamanya adalah untuk
menangani beberapa validasi input yang sebelumnya pernah diserahkan kepada
bahasa server-side seperti Pearl. Pada saat itu sebuah round-trip ke server diperlukan
untuk menentukan apakah sebuah field yang diperlukan memang berisi kosong atau
nilai yang dimasukkan ke dalam field tidak valid. Netscape Navigator berusaha untuk
mengubahnya dengan pengenalan JavaSript. Kemampuan untuk mengatasi beberapa
validasi dasar pada client merupakan fitur baru yang menarik pada saat penggunaan
modem telepon telah meluas. Sejak saat itu JavaScript berkembang menjadi sebuah
13
validasi data sederhana, JavaScript saat ini telah berinteraksi dengan hampir semua
window browser dan isinya (Zakas, N.C. 2012).
2.9.1. Library
Beberapa library yang dapat digunakan pada WebGL yaitu : O3D, GLGE, Three.js,
Curve3D, CubicVR, CopperLicht, Kuda, OSGJS, PhiloGL, SceneJS, SpiderGL dan
TDL (Diggins, C. 2011). Dari antara beberapa library tersebut, penulis memilih untuk
menggunakan Three.js. Three.js adalah sebuah library JavaScript API (Application
Program Interface) yang digunakan untuk membuat dan menampilkan animasi
komputer grafis tiga dimensi (3D) pada sebuah web browser. Skrip Three.js dapat
digunakan bersama dengan HTML5 canvas, SVG atau WebGL.
2.10. Penelitian Terdahulu
Beberapa penelitian terdahulu tentang penyusunan barang, yaitu dapat dilihat pada
tabel 2.1.
Tabel 2.1. Penelitian Terdahulu
Peneliti (Tahun) Judul Penelitian Keterangan
Gunadi, K.,
bertujuan untuk mendapatkan solusi
yang optimal pada pola penyusunan
barang dalam kontainer dengan input
spesifikasi ruang dan barang serta
probabilitas ketiga operator algoritma
genetik (operator reproduksi, pindah
silang dan mutasi).
Dalam penelitian ini suatu pola
dikatakan optimal ketika semakin
Tabel 2.1. Penelitian Terdahulu (lanjutan)
Peneliti (Tahun) Judul Penelitian Keterangan
Putmawa, F. &
menyelesaikan masalah penyusunan
kontainer dalam kapal dengan aturan
penyusunan: kontainer yang berat
diletakkan di bawah kontainer yang
ringan dan penyusunan kontainer
harus sesuai (sama) tipe dan
ukurannnya dengan
mempertimbangkan keseimbangan
kapal.
penelitian ini menghasilkan waktu
pembongkaran (penyusunan ulang
barang) yang lebih minimum.
Angga, C. &
membantu pembuatan stowage plan
atau penataan peti kemas pada suatu
kapal pengangkut didasari algoritma
greedy agar proses bongkar muat
dapat dilakukan dengan efisien serta
tidak mengganggu stabilitas kapal
pengangkut. Data yang digunakan
merupakan berat dan ukuran
standard peti kemas sesuai dengan
stardard ISO (International
Organization for Standarization).
output dari aplikasi ini akan
menampilkan tabel data letak barang
serta tujuan barang yang akan
15
Tabel 2.1. Penelitian Terdahulu (lanjutan)
Peneliti (Tahun) Judul Penelitian Keterangan
Hambali, A.
mengalokasikan urutan barang yang
masuk ke dalam gudang secara
optimal sehingga dapat menghemat
ruang dengan menggunakan
algoritma semut.
menggunakan parameter panjang,
lebar, tinggi serta panjang line
gudang. Hasil dari penelitian
tersebut berupa blok diagram dengan
nilai β = 2 (performa hasil yang terbaik) dan nilai β = 0,5 (performa
hasil paling buruk).
menampilkan tata letak barang yang
disimpan dalam palet-palet pada rak
di gudang secara 2 dimensi dan 3
dimensi dengan menggunakan
OpenGL serta algoritma genetik.
parameter yang digunakan yaitu
batas minimum dan maksimum
ukuran gudang, ukuran dan jumlah
rak, ukuran dan jumlah palet serta
ukuran barang. Hasil uji penelitian
tersebut menunjukkan nilai rata-rata
Tabel 2.1. Penelitian Terdahulu (lanjutan)
Peneliti (Tahun) Judul Penelitian Keterangan
Henry (2011) Penerapan Teknologi
WebGL pada Virtual
Aquarium Berbasis
Tiga Dimensi (3D)
membuat web penjualan ikan yang
dibuat dalam objek 3D dengan
memanfaatkan animasi.
dalam pembuatan aplikasi ini penulis
menggunaan HTML5 dan WebGL.
Hasil dari penelitian ini yaitu
menampilkan gambar serta bentuk
ikan 3D serta dapat menampilkan
format audio dan video pada
halaman web tanpa menggunakan
plug-in.
Suhardi, D., et al
(2012)
Pembuatan Simulasi
Pergerakan Objek
3D (Tiga Dimensi)
Menggunakan
OpenGL.
membuat sebuah simulasi
pergerakan objek 3D (tiga dimensi)
menggunakan OpenGL yang di
compile menggunakan C++.
hasil dari aplikasi ini berupa
BAB 3
ANALISIS DAN PERANCANGAN SISTEM
3.1.Perancangan Objek 3D (Tiga Dimensi)
Pada perancangan objek 3D (tiga dimensi) dengan WebGL, library Three.js
menggunakan sistem koordinat tangan kanan.
Gambar 3.1. Sistem Koordinat
Pada gambar 3.1, layar komputer bertepatan dengan bidang xy dan berpusat di
Gambar 3.2. Perspective Camera
Pada penentuan perspektif pemandangan (gambar 3.2) 3D menggunakan Three.js,
penulis menggunakan parameter sebagai berikut: “ camera = new
THREE.PerpectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
”, dalam script tersebut terdapat empat parameter, yaitu:
1. Parameter pertama (60) mendefinisikan bidang vertikal sudut pandang camera
dalam derajat (dari bawah ke atas pandangan). Inilah bagian yang dapat
terlihat di layar. FOV(Field of View) horizontal dihitung dengan menggunakan
FOV vertical.
2. Parameter kedua (window.innerWidth / windowHeight) mendefinisikan aspek
rasio camera, lebar elemen dibagi dengan tingginya.
3. Parameter ketiga (1) mendefinisikan pesawat camerafrustum (area pandangan
mata) yang dekat (“Near” pada gambar 3.2).
4. Parameter keempat (1000) mendefinisikan pesawat camera frutum yang jauh
(“Far” pada gambar 3.2). Dalam hal ini ketika sebuah objek bergerak melewati lebih kurang 1.000 unit, maka dianggap di luar dunia Three.js sehinngga akan
terpotong dari pandangan.
Dalam pembuatan objek 3D (tiga dimensi) pada aplikasi ini, perhitungan koordinat
ruang dimulai dari sudut paling kiri ruangan sebagai titik (x, y, z dengan nilai 0, 0, 0)
19
X, Y, Z (0,0,0)
Gambar 3.3. Ruangan
Karena proses penyusunan barang dimulai dari paling sebelah kiri ruangan, maka
peletakan barang pertama dapat dilihat pada gambar 3.4.
A
Gambar 3.4. Letak Barang Pertama
Kemudian barang kedua akan disusun dengan metode block stacking, maka barang
akan disusun diatas barang sebelumnya dengan syarat barang yang akan ditumpuk
sesuai dengan parameter yang telah ditentukan. Bentuk penyusunan berikutnya dapat
A B
Gambar 3.5. Letak Barang Kedua
Setelah itu barang berikutnya akan disusun diatas barang sebelumnya jika syarat
tinggi dan maksimal tumpukan terpenuhi, jika tidak, maka barang akan disusun di
sampingnya, begitu seterusnya. Letak barang berikutnya dapat dilihat pada gambar
3.6.
A
B
C
Gambar 3.6. Letak Barang Berikutnya
3.2.Perancangan Database
Pada aplikasi ini database yang digunakan adalah MySQL, berikut spesifikasi
21
- Tabel_ukuran_ruangan menyimpan data panjang, lebar, tinggi ruang serta
kapasitas / daya tampung maksimal total berat barang. Struktur tabel ruangan dapat
dapat dilihat pada Tabel 3.1.
Tabel 3.1. Rancangan Tabel Ukuran Ruangan
Nama_Field Tipe_Data Ukuran_Field
id integer 11
Struktur tabel barang dapat dilihat pada Tabel 3.2.
Tabel 3.2. Rancangan Tabel Barang
Nama_Field Tipe_Data Ukuran_Field
id integer 11
- Tabel_barang_sisa menyimpan data barang yang tidak dapat masuk ke dalam
gudang. Struktur tabel_barang_sisa dapat dilihat pada Tabel 3.3.
Tabel 3.3 Rancangan Tabel Barang Sisa
Nama_Field Tipe_Data Ukuran_Field
- Tabel_user menyimpan data user dan password. Struktur tabel user dapat dapat
dilihat pada tabel 3.4.
Tabel 3.4. Rancangan Tabel User
Nama_Field Tipe_Data Ukuran_Field
id_user integer 11
username varchar 50
password varchar 25
confirm varchar 25
- Tabel_temp_barang menyimpan data koordinat-koordinat serta letak sementara
barang dalam ruangan. Struktur tabel_temp_barang dapat dilihat pada Tabel 3.5.
Tabel 3.5. Rancangan Tabel Temp Barang
Nama_Field Tipe_Data Ukuran_Field Keterangan
id integer 11 Id
id_user integer 11 Id User
id_barang integer 11 Id Barang
x double Koordinat x barang
y double Koordinat y barang
z double Koordinat z barang
panjang double Ukuran x (panjang) barang
tinggi double Ukuran y (tinggi) barang
lebar double Ukuran z (lebar) barang
berat int 11 Ukuran berat (bobot) barang
atas varchar 5 Barang yang ditumpuk ke atas
kanan varchar 5 Barang yang disusun ke samping
dalam varchar 5 Barang yang disusun ke depan
index_x integer 11 Posisi x barang
index_y integer 11 Posisi y barang
index_z integer 11 Posisi z barang
23
- Tabel_hc_berat menyimpan data temporary urutan berat barang berdasarkan
algoritma Steepest Ascent Hill Climbing. Struktur hc_barang dapat dilihat pada
Tabel 3.6.
Tabel 3.6. Rancangan Tabel hc_berat
Nama_Field Tipe_Data Ukuran_Field Keterangan
id integer 11 Id
index1 integer 11 Indeks barang iterasi pertama urutan
pertama
index2 integer 11 Indeks barang iterasi pertama urutan
kedua
index3 integer 11 Indeks barang iterasi pertama urutan
ketiga
index4 integer 11 Indeks barang iterasi pertama urutan
keempat
index5 integer 11 Indeks barang iterasi pertama urutan
kelima
3.2.1. Data barang
Data barang dalam penelitian ini merupakan data yang diinputkan user. Data yang
diinputkan oleh user berupa ukuran panjang, tinggi lebar dan berat barang, sedangkan
untuk ukuran ruangan defaultnya adalah 100. Untuk ukuran barang serta ukuran
ruangan user dapat mengedit / menggantinya dengan munggunakan tombol update. Isi
dari database untuk data barang, yaitu:
a. Tabel barang
Barang yang datanya diinputkan oleh user akan tersimpan dalam database barang
yang dapat dilihat pada Tabel 3.7.
Tabel 3.7. Tabel Barang
id_barang id_user panjang tinggi lebar berat
2 1 25 30 25 60
Tabel 3.7. Tabel Barang (lanjutan)
id_barang id_user panjang tinggi lebar berat
6 1 25 35 25 60
7 1 25 30 25 30
8 1 23 15 20 10
9 1 25 30 25 30
10 1 25 20 25 20
11 1 25 20 25 20
12 1 23 15 25 5
b. Tabel barang sisa
Tabel barang sisa berisi daftar barang yang tidak dapat masuk ke dalam gudang.
Rancangan tabel dapat dilihat pada Tabel 3.8.
Tabel 3.8. Tabel Barang Sisa
id_barang id_user panjang tinggi lebar berat
9 1 25 30 25 30
c. Tabel temp barang
Tabel temp barang berisi data letak/posisi barang serta maksimal tumpukan barang
Tabel 3.9. Tabel Temp Barang
id_brg id_user x y z pjg tgg lbr brt atas kanan dalam idx_x idx_y idx_z max_tpkn
2 1 12.5 -10 -12.5 25 30 25 60 F T F 1 0 0 60
3 1 -12.5 -12.5 12.5 25 25 25 60 F F T 1 0 1 60
6 1 -12.5 -7.5 -12.5 25 35 25 60 F F F 0 0 0 60
7 1 12.5 -10 12.5 25 30 25 30 F F T 2 0 1 30
8 1 -12.5 17.5 -12.5 23 15 20 10 T F F 0 1 0 50
10 1 12.5 15 -12.5 25 20 25 20 T F F 1 1 0 40
11 1 -12.5 10 12.5 25 20 25 20 T F F 1 1 1 40
12 1 12.5 -12.5 12.5 23 15 25 5 T F F 2 1 1 25
Keterangan:
id_brg = id_barang
pjg = panjang
lbr = lebar
brt = berat
idx_x, idx_y, idx_z = index_x, index_y, index_z
d. Tabel hc berat
Tabel hc_berat berisi data temporary hasil pengurutan barang berdasarkan berat
menggunakan algoritma Steepest Ascent Hill Climbing. Rancangan tabel dapat dilihat
pada Tabel 3.10.
Tabel 3.10. Tabel HC Berat
id index1 index2 iindex3 index4 index5 index6 index7 index8 index9
1 6 2 3 7 9 10 11 8 12
2 2 3 6 7 9 10 11 8 12
3 2 6 7 3 9 10 11 8 12
4 2 6 3 9 7 10 11 8 12
5 2 6 3 7 10 9 11 8 12
6 2 6 3 7 9 11 10 8 12
7 2 6 3 7 9 10 8 11 12
8 2 6 3 7 9 10 11 12 8
9 12 6 3 7 9 10 11 8 2
e. Tabel user
Tabel User berisi tentang data user yang berupa id_user, username dan password.
Rancangan tabel dapat dilihat pada Tabel 3.11.
Tabel 3.11. Tabel User
id_user username password confirm
1 stella stella stella
2 test123 test123 test123
3.2.2.Data ruangan
Data ruangan dalam penelitian ini merupakan data default yaitu 100 dengan satuan m.
(meter), akan tetapi user juga dapat mengganti ukuran ruangan menggunakan tombol
edit ukuran ruangan. Data yang diinputkan oleh user berupa ukuran panjang, tinggi
dan lebar ruangan. Isi dari database untuk data ruangan yaitu:
a. Tabel Ukuran Ruangan
Tabel ukuran barang berisi data ukuran ruangan . Rancangan tabel dapat dilihat pada
27
Tabel 3.12. Tabel Ukuran Ruangan
id id_user panjang lebar tinggi
1 1 50 50 50
2 2 10 10 10
3.3.Analisis Sistem
Proses analisis sistem diperlukan sebagai dasar perancangan sistem. Analisis sistem
bertujuan untuk mengidentifikasi sistem yang akan dibuat. Pada penelitian ini, yang
akan diidentifikasi adalah proses yang akan dilakukan oleh user.
3.3.1. Proses user
Tahapan proses yang dilakukan user adalah sebagai berikut:
1. Masukkan data panjang, tinggi, lebar dalam satuan meter(m) dan berat
barang dalam satuan kilogram(kg).
2. Kemudian sistem akan menyimpan data barang (panjang, tinggi, lebar dan
berat) ke dalam database sesuai dengan id user yang menginputkan data.
3. Ukuran ruangan diset default 100 X 100 X 100. User dapat mengedit
ukuran barang menggunakan tombol “Ganti Ukuran Ruangan”.
4. Setelah itu sistem melakukan proses penyusunan dengan algoritma
Steepest Ascent Hill Climbing, dimana barang yang diinputkan akan
diurutkan mulai dari barang yang memiliki berat/massa tertinggi.
5. Setelah diurutkan dengan algoritma Steepest Ascent Hill Climbing, maka
sistem akan menampilkan hasil barang beserta id dari masing-masing
barang yang akan dimasukkan.
6. Setelah selesai tahapan pengurutan dengan algoritma, berikutnya sistem
akan memilah barang yang dapat masuk ke dalam gudang dengan cara
membandingkan ukuran gudang dengan ukuran barang yang masuk.
Kemudian sistem akan menampilkan data tabel barang-barang yang masuk
dan data barang-barang yang tidak dapat masuk. Selain itu sistem juga
akan menampilkan data posisi/letak barang yang disusun.
7. Kemudian pada tabel data masuk user dapat mengedit ataupun menghapus
data barang yang telah diinputkan. Setelah proses pengeditan juga
penghapusan data barang, aplikasi akan kembali mengurutkan barang yang
8. Selanjutnya sistem akan menampilkan Visualisasi 3D beserta dengan
informasi barang yang telah diurutkan tadi. Adapun bentuk flowchart dari
tahapan yang dilakukan user dapat dilihat pada Gambar 3.7.
3.3.2. Analisis algoritma steepest ascent hill climbing pada aplikasi penyusunan
barang pada gudang 3D (tiga dimensi)
Pada proses algoritma Steepest Ascent Hill Climbing, data berat/massa barang dari
database diurutkan dengan cara:
1. Inisialisasi state/keadaan awal. Pada proses ini data berat/massa barang diurutkan
sesuai dengan id barang yang masuk terlebih dahulu:
id_barang: 2 | berat: 60
id_barang: 3 | berat: 60
id_barang: 6 | berat: 60
id_barang: 7 | berat: 30
id_barang: 8 | berat: 10
id_barang: 9 | berat: 30
id_barang: 10 | berat: 20
id_barang: 11 | berat: 20
id_barang: 12 | berat: 5
- Maka urutan awal / Keadaan Sekarang, yaitu: 60, 60, 60, 30, 10, 30, 20, 20, 5,
dengan urutan id_barang: 2, 3, 6, 7, 8, 9, 10, 11, 12.
- Dilakukan pengujian. Karena urutan tersebut bukan merupakan tujuan maka
keadaan sekarang dijadikan sebagai keadaan awal.
2. a. Tentukan SUCC sebagai nilai terbaik dari successor-successor.
Keadaan sekarang = 60, 60, 60, 30, 10, 30, 20, 20, 5, dengan id_barang = 2, 3, 6,
7, 8, 9, 10, 11, 12. Maka, SUCC merupakan nilai terbaik dari
successor-successor pada Tabel 3.13.
Tabel 3.13. Tabel Successor 1
Operator Urutan Berat/Massa Barang Urutan ID Barang
Tukar 1 dengan 2 60-60-60-30-10-30-20-20-5 3-2-6-7-8-9-10-11-12
29
Tabel 3.13. Tabel Successor 1 (lanjutan)
Operator Urutan Berat/Massa Barang Urutan ID Barang
Tukar 3 dengan 4 60-60-30-60-10-30-20-20-5 2-3-7-6-8-9-10-11-12
Tukar 4 dengan 5 60-60-60-10-30-30-20-20-5 2-3-6-8-7-9-10-11-12
Tukar 5 dengan 6 60-60-60-30-30-10-20-20-5 2-3-6-7-9-8-10-11-12
Tukar 6 dengan 7 60-60-60-30-10-20-30-20-5 2-3-6-7-8-10-9-11-12
Tukar 7 dengan 8 60-60-60-30-10-30-20-20-5 2-3-6-7-8-9-11-10-12
Tukar 8 dengan 9 60-60-60-30-10-30-20-5-20 2-3-6-7-8-9-10-12-11
Tukar 9 dengan 1 5-60-60-30-10-30-20-20-60 12-3-6-7-8-9-10-11-2
SUCC = 60-60-60-30-30-10-20-20-5, dengan id_barang = 2-3-6-7-9-8-10-11-12.
b. Operator: Tukar 1 2
c. Operator tersebut digunakan untuk membentuk keadaan baru. Kedaan baru
merupakan nilai terbaik dari successor-successor SUCC
(60-60-60-30-30-10-20-20-5) dengan id_barang (2-3-6-7-9-8-10-11-12) yang dapat dilihat pada Tabel
3.14.
Tabel 3.14. Tabel Successor SUCC 1
Operator Urutan Berat/Massa Barang Urutan ID Barang
Tukar 1 dengan 2 60-60-60-30-30-10-20-20-5 3-2-6-7-9-8-10-11-12
Tukar 2 dengan 3 60-60-60-30-30-10-20-20-5 2-6-3-7-9-8-10-11-12
Tukar 3 dengan 4 60-60-30-60-30-10-20-20-5 2-3-7-6-9-8-10-11-12
Tukar 4 dengan 5 60-60-60-30-30-10-20-20-5 2-3-6-9-7-8-10-11-12
Tukar 5 dengan 6 60-60-60-30-10-30-20-20-5 2-3-6-7-8-9-10-11-12
Tabel 3.14. Tabel Successor SUCC 1(lanjutan)
Operator Urutan Berat/Massa Barang Urutan ID Barang
Tukar 7 dengan 8 60-60-60-30-30-10-20-20-5 2-3-6-7-9-8-11-10-12
Tukar 8 dengan 9 60-60-60-30-30-10-20-5-20 2-3-6-7-9-8-10-12-11
Tukar 9 dengan 1 5-60-60-30-30-10-20-20-60 12-3-6-7-9-8-10-11-2
Keadaan baru = 60-60-60-30-30-20-10-20-5 dengan id_barang =
2-3-6-7-9-10-8-11-12. Akan tetapi Keadaan Baru tersebut masih bukan merupakan tujuan, maka
nilai Keadaan Baru(60-60-60-30-30-20-10-20-5) dibandingkan dengan nilai
SUCC(60-60-60-30-30-10-20-20-5). Karena nilai Keadaan Baru lebih baik dari pada
nilai SUCC, maka nilai Keadaan Baru menjadi nilai SUCC, SUCC =
60-60-60-30-30-20-10-20-5 dengan urutan id_barang = 2-3-6-7-9-10-8-11-12.
Kemudian nilai SUCC(60-60-60-30-30-20-10-20-5) dibandingkan dengan nilai
Keadaan Sekarang(60, 60, 60, 30, 10, 30, 20, 20, 5). Karena nilai SUCC lebih baik,
maka nilai Keadaan Sekarang diganti menjadi nilai SUCC, Keadaan Sekarang =
60-60-60-30-30-20-10-20-5 dengan id_barang = 2-3-6-7-9-10-8-11-12.
Karena Keadaan Sekarang bukan merupakan tujuan, maka tentukan kembali
SUCC. Tabel SUCC berikutnya dapat dilihat pada Tabel 3.15
Tabel 3.15. Tabel Successor 2
Operator Urutan Berat/Massa Barang Urutan ID Barang
Tukar 1 dengan 2 60-60-60-30-30-20-10-20-5 3-2-6-7-9-10-8-11-12
Tukar 2 dengan 3 60-60-60-30-30-20-10-20-5 2-6-3-7-9-10-8-11-12
Tukar 3 dengan 4 60-60-30-60-30-20-10-20-5 2-3-7-6-9-10-8-11-12
Tukar 4 dengan 5 60-60-60-30-30-20-10-20-5 2-3-6-9-7-10-8-11-12
Tukar 5 dengan 6 60-60-60-30-20-30-10-20-5 2-3-6-7-10-9-8-11-12
Tukar 6 dengan 7 60-60-60-30-30-10-20-20-5 2-3-6-7-9-8-10-11-12
Tukar 7 dengan 8 60-60-60-30-30-20-20-10-5 2-3-6-7-9-10-11-8-12
Tukar 8 dengan 9 60-60-60-30-30-20-10-5-20 2-3-6-7-9-10-8-12-11
Tukar 9 dengan 1 5-60-60-30-30-20-10-20-60 12-3-6-7-9-10-8-11-2
SUCC = 60-60-60-30-30-20-20-10-5 dengan id_barang = 2-3-6-7-9-10-11-8-12
merupakan tujuan, maka proses berhenti. Maka, urutan barang yang disusun dimulai
dari id_barang : 2-3-6-7-9-10-11-8-12 dengan berat barang :
31
3.3.3. Penentuan barang yang masuk pada gudang visualisasi 3D (tiga dimensi)
Proses penentuan barang yang masuk pada visualisasi 3D adalah sebagai berikut:
1. Dari data yang diinput oleh user, cek panjang, tinggi serta lebar barang.
2. Jika panjang barang, tinggi barang dan lebar barang lebih kecil atau sama
dengan panjang ruangan, tinggi ruangan dan lebar ruangan, maka barang
akan dikenali sebagai index_x awal (panjang barang), index_y (tinggi
barang), index_z (lebar barang), dan langsung masuk ke dalam tabel data
barang yang masuk ke ruangan. Jika tidak maka barang akan masuk ke
dalam tabel data barang yang tidak dapat masuk.
3. Kemudian jika ada barang yang akan diinputkan oleh user lagi, maka
sistem akan mengecek, apakah panjang barang berikutnya lebih kecil atau
sama dengan panjang ruangan dikurang total panjang barang dan tinggi
barang berikutnya lebih kecil atau sama dengan tinggi ruangan-total tinggi
barang dan lebar barang berikutnya lebih kecil atau sama dengan lebar
ruagan dikurang total lebar barang.
4. Jika ya, maka barang akan disusun ke atas barang sebelumnya dan akan
langsung masuk ke dalam tabel data barang yang dapat masuk.
5. Jika tidak maka sistem akan mengecek apakah panjang barang berikutnya
tersebut lebih kecil atau sama dengan panjang ruangan dikurang panjang
barang sebelumnya.
6. Jika ya, maka barang akan disusun ke samping barang yang sebelumnya
dan barang akan masuk ke dalam tabel data barang yang masuk.
7. Jika tidak maka sistem akan mengecek panjang barang berikutnya tersebut,
apakah panjang barang berikutnya tersebut lebih kecil atau sama dengan
panjang barang index_x. Jika ya, maka barang akan disusun ke depan
barang sebelumnya dan barang akan masuk ke dalam tabel data barang
yang dapat masuk.
8. Jika tidak maka barang akan dimasukan ke dalam tabel data barang yang
tidak dapat masuk.
Proses penentuan barang yang masuk dalam gudang dapat juga dilihat pada flowchart
Mulai
Panjang, tinggi dan lebar barang(m), index_x, index_y,
index_z
Panjang barang <= Panjang ruangan && Tinggi barang <= tinggi ruangan && lebar barang <= lebar ruangan
Ya Barang yang akan masuk
lagi
Tidak
Selesai
Ya panjang barang && tinggi barang berikutnya <= tinggi Panjang barang berikutnya <= panjang ruangan-total ruangan-total tinggi barang && lebar barang berikutnya
<= lebar ruangan-total lebar barang
Barang disusun ke atas Index_y++
Ya
Panjang barang berikutnya <= panjang maksimal ruangan-panjang barang sebelumnya
Panjang barang berikutnya <= panjang [index_x]
Barang disusun ke
3.4.Perancangan Sistem
3.4.1. Arsitektur umum (general architecture)
Arsitektur umum merupakan desain arsitektur kasar dari sebuah sistem. Pada desain
ini digambarkan bagaimana setiap proses berlangsung sehingga terbentuk sebuah
sistem yang terorganisasi dengan baik. Rancangan arsitektur umum dari sistem dapat
dilihat pada Gambar 3.4.
Urutkan barang
Gambar 3.9. General Architecture
3.4.2. Diagram use case
Use case merupakan sebuah model pergerakan suatu sistem perangkat lunak secara
fungsional (Simarmata, 2010). Dengan adanya use case diharapkan pengguna atau
peneliti selanjutnya dapat mengerti alur kerja sistem sehingga sistem dapat digunakan
sebaik mungkin. Sistem yang dibangun peneliti menggunakan 1 aktor yang berperan
35
Tabel Posisi dan Batas Maksimal Tumpukan
Gambar 3.10. Diagram Use case
3.4.3. Realisasi definisi use case
Realisasi definisi use case dimaksudkan untuk menjelaskan setiap kegiatan yang
dilakukan aktor dalam use case. Terdapat kegiatan use case include yang berarti aktor
dapat melakukan kegiatan yang dituju arah panah. Dan kegiatan use case extend yang
berarti aktor dapat melakukan kegiatan jika kondisi kegiatan sebelumnya sudah
terpenuhi, dapat dilihat pada Tabel 3.16.
Tabel 3.16. Realisasi Definisi Use case
No Use case Deskripsi
1 Halaman Utama Menampilkan halaman utama dari sistem,
Tabel 3.16. Realisasi Definisi Use case (lanjutan)
No Use Case Deskripsi
2 Login Proses masuk ke dalam sistem, digunakan oleh user
3 Tabel Barang yang
Telah Masuk
Menampilkan tabel data barang yang telah
diinputkan oleh user
4 Tabel Posisi dan Batas
Maksimal Tumpukan
Menampilkan tabel data posisi dan batas maksimal
tumpukan masing-masing barang
5 Input Ukuran dan Berat
Barang
Menampilkan input box yang digunakan oleh user
untuk meng-input data ukuran dan berat barang
6 Input Ukuran Ruangan Menampilkan input box yang digunakan oleh user
untuk meng-input data ukuran ruangan
7 Tabel Barang yang
Tidak Masuk
Menampilkan tabel data barang yang tidak dapat
masuk ke dalam ruangan
8 Visualisasi 3D Menampilkan halaman tampilan animasi
penyusunan barang dalam ruang (dalam bentuk
3D/tiga dimensi)
9 Logout Proses keluar dari sistem hanya jika sudah login
10 Proses Melakukan proses pengurutan barang menggunakan
algoritma
Menampilkan proses pengurutan barang
menggunakan algoritma Steepest Ascent Hill
Climbing
12 Edit, Tambah, Hapus Proses edit, tambah, dan hapus untuk setiap isi tabel
3.5. Perancangan Tampilan Antarmuka
Tampilan antarmuka dari sistem yang akan dirancang adalah desain awal dari
interface sistem.
3.5.1. Rancangan halaman login user
Pada halaman login, user harus mengisikan username dan password yang sesuai agar
dapat mengakses sistem dari aplikasi ini. Rancangan halaman login dapat dilihat pada
37
Footer
Footer
PENYUSUNAN BARANG PADA GUDANG 3D PENYUSUNAN BARANG PADA GUDANG 3D
Username :
Password:
Login
Gambar 3.11. Rancangan Halaman LoginUser
3.5.2. Rancangan halaman registrasi user
Pada halaman registrasi, user dapat mendaftarkan diri dengan mengisi username dan
password serta confirm password untuk dapat mengakses sistem dari aplikasi ini.
Rancangan halaman registrasi dapat dilihat pada Gambar 3.12.
Footer Footer
PENYUSUNAN BARANG PADA GUDANG 3D
PENYUSUNAN BARANG PADA GUDANG 3D
Username :
Password:
Confirm Password:
Register Reset
Gambar 3.12. Rancangan Halaman Registrasi User
3.5.3. Rancangan halaman konfigurasi
Pada halaman konfigurasi, user dapat menginput ukuran panjang, tinggi, lebar serta
berat barang. User juga dapat menginput panjang, tinggi, lebar ruangan. Kemudian
halamn ini user juga dapat melihat tabel data barang yang telah dimasukkan serta
tabel data posisi dan batas maksimal tumpukan masing-masing barang. Rancangan
dapat dilihat pada Gambar 3.13.
Footer
Footer
PENYUSUNAN BARANG PADA GUDANG 3D PENYUSUNAN BARANG PADA GUDANG 3D
HOME PROSES LOGOUT
Ganti Ukuran Ruangan Masukkan Barang
Visualisasi 3D
Tabel Data Panjang, Tinggi, Lebar dan Berat Barang
Tabel Data Panjang, Tinggi, Lebar dan Berat Barang
Barang Yang Telah Dimasukan
Posisi dan Batas Maksimal Tumpukan
Tabel Data Posisi dan Batas Maksimal Tumpukan masing-masing Barang
Tabel Data Posisi dan Batas Maksimal Tumpukan masing-masing Barang
Tabel data barang yang tidak masuk
Tabel data barang yang tidak masuk
Barang Yang Tidak Masuk
EDIT HAPUS
Gambar 3.13. Rancangan Halaman Konfigurasi
3.5.4. Rancangan halaman utama user
Pada halaman utama user akan ditampilkan tabel data barang yang telah dimasukkan
user serta tabel data posisi dan batas maksimal tumpukan masing-masing barang.Pada
halaman utama juga terdapat tombol “Konfigurasi”, tombol ini akan mengarahkan
user ke halaman konfigurasi dimana user dapat meng-input data barang dan ruangan.
