Visualisasi Tiga Dimensi (3D) Penyusunan Barang Pada Gudang Menggunakan Algoritma Steepest Ascent Hill Climbing
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 2014
(2)
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 2014
(3)
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,
M. Anggia Muchtar, S.T., MM.IT. NIP 19800110 200801 1 010
(4)
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
Stela Maris Harefa 091402058
(5)
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.
Penulis menyadari bahwa masih banyak kekurangan dalam skripsi ini, untuk itu penulis mengharapkan saran dan kritik yang bersifat membangun dari semua pihak demi kesempuranaan skripsi ini. Akhir kata penulis ucapkan terima kasih.
(6)
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.
Kata kunci: steepest ascent hill climbing, visualisasi tiga dimensi (3D), penyusunan barang
(7)
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 (3D), preparation goods, warehouse.
(8)
vii
DAFTAR ISI
Halaman
PERSETUJUAN ii
PERNYATAAN iii
UCAPAN TERIMA KASIH iv
ABSTRAK v
ABSTRACT vi
DAFTAR ISI vii
DAFTAR TABEL ix
DAFTAR GAMBAR x
BAB 1 PENDAHULUAN 1
1.1. Latar Belakang 1
1.2. Rumusan Masalah 2
1.3. Batasan Masalah 2
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
(9)
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
(10)
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
(11)
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
(12)
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.
Kata kunci: steepest ascent hill climbing, visualisasi tiga dimensi (3D), penyusunan barang
(13)
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 (3D), preparation goods, warehouse.
(14)
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
(15)
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 barang yang disimpan pada gudang secara tiga dimensi (3D) sehingga dapat
(16)
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 telah disusun dalam gudang dengan algoritma.
(17)
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 memberikan saran agar bermanfaat untuk pengembangan sistem selanjutnya.
(18)
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:
(19)
(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 kemungkinan solusi yang terbaik dari beberapa kemungkinan tersebut, sedangkan
(20)
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 &
(21)
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
(22)
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.
Tukar 2, 3 ACBD = 4 + 6 + 5 = 15.
Tukar 3, 4 ABDC = 9 + 5 + 7 = 21.
Tukar 4, 1 DBCA = 5 + 6 + 4 = 15.
Tukar 2, 4 ADCB = 8 + 7 + 6 = 21.
Tukar 1, 3 CBAD = 6 + 9 + 8 = 23.
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.
(23)
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 Mulai
Tujuan
Keadaan Awal -> Keadaan Sekarang Tidak
Tentukan SUCC
Bentuk Keadaan Baru
Tujuan Tidak
Ya Keadaan Baru ->
SUCC
SUCC > Keadaan Sekarang
Ya Keadaan Sekarang -> SUCC
Selesai
Ya
Keadaan Baru > SUCC
Ya
Tidak
SUCC = SUCC Tidak
(24)
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
(25)
- 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 fitur yang penting dari setiap web browser di market. Tidak hanya terikat untuk
(26)
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., Julistiono, I.K. & Hariyanto, B. (2003)
Optimasi Pola Penyusunan Barang dalam Ruang Tiga Dimensi menggunakan
Metode Genetic
Algorithms
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 sedikit ruang kosong yang tersisa.
(27)
Tabel 2.1. Penelitian Terdahulu (lanjutan) Peneliti (Tahun) Judul Penelitian Keterangan
Putmawa, F. & Santosa, B. (2011)
Pengembangan Algoritma Bee Swarm Optimization untuk Penyelesaian Container Stowage Problem
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. &
Munir, R. (2012)
Pengembangan
Algoritma Greedy
untuk Optimalisasi Penataan Peti Kemas pada Kapal
Pengangkut
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 dikirim.
(28)
15
Tabel 2.1. Penelitian Terdahulu (lanjutan) Peneliti (Tahun) Judul Penelitian Keterangan
Hambali, A. (2011)
Sistem Alokasi Penyimpanan
Barang Pada Gudang
membuat sebuah sistem yang dapat
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). Lim, R., Gunadi,
K & Gang, O.W. (2004)
Optimasi
Pengambilan dan Penataan Ulang Barang di Gudang dengan Penerapan
Stack menggunakan
Metode Genetic
Algorithm
membuat aplikasi untuk
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 fitness cost diatas 90%.
(29)
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
(30)
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 titik asal (0, 0, 0). Sumbu z merupakan poin positif dari layar terhadap mata pengamat.
(31)
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) yang dapat dilihat pada gambar 3.3.
(32)
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 dilihat pada gambar 3.5.
(33)
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 tabel-tabel yang dibuat:
(34)
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
id_user integer 11
panjang integer 11
tinggi integer 11
lebar integer 11
- Tabel_barang menyimpan data panjang, lebar, tinggi serta bobot/berat barang. Struktur tabel barang dapat dilihat pada Tabel 3.2.
Tabel 3.2. Rancangan Tabel Barang
Nama_Field Tipe_Data Ukuran_Field
id integer 11
id_user integer 11
panjang integer 11
tinggi integer 11
lebar integer 11
berat 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
id int 11
id_user int 11
id_barang int 11
panjang int 11
tinggi int 11
lebar int 11
(35)
- 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
(36)
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
(37)
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 sementara. Rancangan tabel dapat dilihat pada Tabel 3.9.
(38)
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 max_tpkn = max_tumpukan
(39)
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 Tabel 3.12.
(40)
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
(41)
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
(42)
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
Tukar 2 3 Tukar 3 4 Tukar 4 5 Tukar 5 6 Tukar 6 7 Tukar 7 8 Tukar 8 9 Tukar 9 1
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
(43)
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 : 60-60-60-30-30-20-20-10-5.
(44)
31
Mulai
Input panjang, tinggi, lebar(m) dan
berat(kg) barang
Urutkan barang berdasarkan berat/
massa tertinggi dengan algoritma
steepest ascent hill climbing
Edit Data Barang
Update Data Barang Ganti Ukuran
Ruangan
Update Ukuran Ruangan
Ya
Tidak
Ya
Hapus Data Barang
Ya
Tidak Menentukan barang yang dapat
masuk dan tidak dapat masuk ke dalam gudang
Tampilkan Visualisasi 3D Tidak
Selesai
(45)
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
(46)
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 masuk ke dalam data barang masuk Tidak
Barang masuk ke dalam data barang yang tidak
dapat masuk 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 Tidak
Barang disusun ke samping Index_x++
Tidak
Panjang barang berikutnya <= panjang [index_x]
Barang disusun ke depan Index_z++ Ya Index_x=0 index_y=0 index_z=0 Tidak Ya
(47)
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 berdasarkan berat/
massa tertinggi dengan algoritma steepest ascent hill
climbing
Menentukan barang yang dapat
masuk dan tidak dapat masuk ke dalam gudang
Tampilkan Visualisasi 3D Input ukuran
barang(m) dan berat(kg) barang
Input ukuran ruangan(m)
User
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 yaitu sebagai user. Rancangan use case sistem dapat dilihat pada Gambar 3.5.
(48)
35
Login
Home
Proses
Tabel Barang Yang Telah Dimasukkan
Input Ukuran dan Berat Barang
Input Ukuran Ruangan
Tabel Barang Yang Telah Dimasukkan
Tabel Barang Yang Tidak Masuk Tabel Posisi dan Maksimal Tumpukan
Barang
Data Proses Penyusunan Barang Dengan Algoritma
Steepest Ascent Hil Climbing Edit, Tambah, Hapus <<include>> <<include>> <<include>> <<include>> <<include>> <<include>> <<include>> <<extend>> <<extend>> <<extend>> <<extend>> Logout <<extend>>
Tabel Posisi dan Batas Maksimal Tumpukan <<include>> Konfigurasi <<extend>> Visualisasi 3D <<include>> User
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,
(49)
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
11 Data Proses
Penyusunan Barang Menggunakan Algoritma Steepest Ascent Hill Climbing
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 Gambar 3.11
(50)
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 user dapat mengedit serta menghapus data barang yang telah dimasukkan. Pada
(51)
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
Panjang Ruangan : Lebar Ruangan : Tinggi Ruangan :
Panjang Barang : Lebar Barang : Tinggi Barang :
Berat Barang :
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.
(52)
39
Footer
Footer
PENYUSUNAN BARANG PADA GUDANG 3D PENYUSUNAN BARANG PADA GUDANG 3D
Konfigurasi
Tabel Data Panjang, Tinggi, Lebar dan Berat Barang
Tabel Data Panjang, Tinggi, Lebar dan Berat Barang
HOME
KONFIGURASI
PROSES
LOGOUT
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
Gambar 3.14. Rancangan Halaman Utama User
3.5.5. Rancangan halaman hasil proses pengurutan dengan algoritma steepest ascent hill climbing
Halaman Proses berisi tentang data hasil pengurutan barang berdasarkan barang yang
memiliki berat/massa terbesar menggunakan algoritma Steepest Ascent Hill Climbing.
Rancangan dapat dilihat pada Gambar 3.15.
Footer
Footer
PENYUSUNAN BARANG PADA GUDANG 3D PENYUSUNAN BARANG PADA GUDANG 3D
HOME
KONFIGURASI
LOGOUT PROSES
PENYUSUNAN BARANG DENGAN ALGORITMA STEEPEST ASCENT HILL CLIMBING
PENYUSUNAN BARANG DENGAN ALGORITMA STEEPEST ASCENT HILL CLIMBING
Data Pengurutan Berat Barang Menggunakan Algoritma
Data Pengurutan Berat Barang Menggunakan Algoritma
(53)
3.5.6. Rancangan halaman visualisasi 3D
Pada halaman visualisasi, aplikasi akan menampilkan hasil visual penyusunan barang dalam bentuk 3D (tiga dimensi), selain itu aplikasi juga menampilkan data id_barang berdasarkan urutan barang yang pertama kali disusun. Rancangan dapat dilihat pada Gambar 3.16.
Data Id Barang
Gambar Barang Visualisasi 3D
Gambar Barang Visualisasi 3D 1 : 10 x 10 x 10
15 : 20 x 5 x 15 5 : 6 x 6 x 10 10 : 7 x 7 x 4
(1)
LAMPIRAN KODE PROGRAM
1. proses.php
function rotasi_operator($array_nilai) { $temp = 0;
$counter_index = 0;
for ($i = 0; $i < count($array_nilai); $i++) { $array_nilai_temp = $array_nilai;
if (($counter_index) < count($array_nilai) - 1) { $temp = $array_nilai_temp[$counter_index];
$array_nilai_temp[$counter_index] = $array_nilai_temp[$counter_index + 1];
$array_nilai_temp[$counter_index + 1] = $temp; $hasil[] = $array_nilai_temp;
} else {
$temp = $array_nilai_temp[0];
$array_nilai_temp[0] = $array_nilai_temp[count($array_nilai) - 1];
$array_nilai_temp[count($array_nilai) - 1] = $temp; $hasil[] = $array_nilai_temp;
}
$counter_index++; }
return $hasil; }
2. database.php
function konfigurasi_item($id_user) {
//kosongkan tabel_temp_barang, karena isinya harus dinamis mysql_query("DELETE FROM tabel_temp_barang WHERE
id_user=$id_user") or die("Kosongkan tabel_temp_barang : " . mysql_error());
mysql_query("DELETE FROM tabel_barang_sisa WHERE
id_user=$id_user") or die("Kosongkan tabel_temp_barang : " . mysql_error());
// mysql_query(" TRUNCATE TABLE tabel_temp_barang") or die("Kosongkan Temp : " . mysql_error());
//untuk ruangan
$q_ruangan = mysql_query("SELECT * FROM tabel_ukuran_ruangan WHERE id_user=$id_user") or die(mysql_error());
$row_ruangan = mysql_fetch_array($q_ruangan); $panjang_ruangan = $row_ruangan ['panjang']; $tinggi_ruangan = $row_ruangan ['tinggi']; $lebar_ruangan = $row_ruangan ['lebar']; $x_nol_ruangan = -$panjang_ruangan / 2; $y_nol_ruangan = -$tinggi_ruangan / 2; $z_nol_ruangan = -$lebar_ruangan / 2; $x_max_ruangan = $panjang_ruangan / 2; $y_max_ruangan = $tinggi_ruangan / 2; $z_max_ruangan = $lebar_ruangan / 2; @$x_sekarang = $x_nol_ruangan;
(2)
@$z_sekarang = $z_nol_ruangan; $hc = hill_climbing($id_user); // print_r($hc);
for ($i = 0; $i < count($hc); $i++) { $id = $hc[$i][0];
$q_kotak = mysql_query("SELECT * FROM tabel_barang WHERE id_barang=$id") or die("tampil tabel_barang : " .
mysql_error());
while ($row = mysql_fetch_array($q_kotak)) { $id_barang = $row['id_barang'];
$panjang = $row['panjang']; $tinggi = $row['tinggi']; $lebar = $row['lebar']; $berat = $row['berat'];
$id_kotak = $row['id_barang']; //informasi barang saat ini yang diproses
$informasi_barang = pengaturan_barang($id_user, $panjang, $tinggi, $lebar, $berat, $id_kotak);
if ($informasi_barang != 0) { @$kotak[] = array(
id => $id_barang,
sp_size => $panjang . " x " . $tinggi . " x " . $lebar, sp_size_1 => $panjang,
sp_size_2 => $tinggi, sp_size_3 => $lebar,
x_origin_in_bin => $informasi_barang[0], y_origin_in_bin => $informasi_barang[1], z_origin_in_bin => $informasi_barang[2], constraints => 0
); } }
}
// echo json_encode(@$kotak); return json_encode(@$kotak); }
function konfigurasi_ruangan($id_user) {
$q_ruangan = mysql_query("SELECT * FROM tabel_ukuran_ruangan WHERE id_user=$id_user") or die(mysql_error());
$row_ruangan = mysql_fetch_array($q_ruangan); return json_encode(array($row_ruangan['panjang'], $row_ruangan['tinggi'], $row_ruangan['lebar'])); }
function pengaturan_barang($id_user, $panjang, $tinggi, $lebar, $berat, $id_kotak) {
$q_ruangan = mysql_query("SELECT * FROM tabel_ukuran_ruangan WHERE id_user=$id_user") or die(mysql_error());
$row_ruangan = mysql_fetch_array($q_ruangan);
$panjang_ruangan_min = -$row_ruangan ['panjang'] / 2; $tinggi_ruangan_min = -$row_ruangan ['tinggi'] / 2;
(3)
$lebar_ruangan_min = -$row_ruangan ['lebar'] / 2; $panjang_ruangan_max = $row_ruangan ['panjang'] / 2; $tinggi_ruangan_max = $row_ruangan ['tinggi'] / 2; $lebar_ruangan_max = $row_ruangan ['lebar'] / 2;
if ($panjang <= $panjang_ruangan_max - ($panjang_ruangan_min) && $tinggi <= ($tinggi_ruangan_max - ($tinggi_ruangan_min)) && $lebar <= ($lebar_ruangan_max - ($lebar_ruangan_min))) {
$q_cek_temp = mysql_query("SELECT * FROM tabel_temp_barang WHERE id_user=$id_user") or die("cek temp kotak : " .
mysql_error());
if (mysql_num_rows($q_cek_temp) > 0) {
$hasil = keatas($id_user, $panjang, $tinggi, $lebar, $berat, $panjang_ruangan_max, $tinggi_ruangan_max, $lebar_ruangan_max, $id_kotak);
if (is_array($hasil)) {
$x = $hasil[0]; $y = $hasil[1]; $z = $hasil[2];
} else {
$hasil = kesamping($id_user, $panjang, $tinggi, $lebar, $berat, $panjang_ruangan_max, $tinggi_ruangan_max, $lebar_ruangan_max, $id_kotak);
if (is_array($hasil)) { $x = $hasil[0]; $y = $hasil[1]; $z = $hasil[2]; } else {
$hasil = kedalam($id_user, $panjang, $tinggi, $lebar, $berat, $panjang_ruangan_max, $tinggi_ruangan_max, $lebar_ruangan_max, $id_kotak);
if (is_array($hasil)) { $x = $hasil[0]; $y = $hasil[1]; $z = $hasil[2]; } else {
//jika sudah penuh
mysql_query("INSERT INTO tabel_barang_sisa(id_barang, id_user, panjang, tinggi, lebar, berat) VALUES($id_kotak, $id_user, $panjang, $tinggi, $lebar, $berat)") or die("Error Insert Kotak sisa :" . mysql_error());
// break; }
} } } else {
$hasil = kotak_pertama($id_user, $panjang, $tinggi, $lebar, $panjang_ruangan_min, $tinggi_ruangan_min, $lebar_ruangan_min, $berat, $id_kotak);
$x = $hasil[0]; $y = $hasil[1]; $z = $hasil[2]; }
if (isset($x) && isset($y) && isset($z)) { return Array($x, $y, $z);
} else {
//kembalikan 0 untuk dicek, agara tidak ditambah pada array posisi kotak
return 0; }
(4)
} else {
mysql_query("INSERT INTO tabel_barang_sisa(id_user, panjang, tinggi, lebar, berat) VALUES($id_user, $panjang, $tinggi, $lebar, $berat)") or die("Error Insert Kotak sisa :" . mysql_error()); }
} /*
* panjang <= panjang sebelumnya * lebar <= lebar sebelumnya * total panjang <= l
* total tinggi <= tinggi ruang * total lebar <= lebar ruang *
* update atas sebelumnya F * y tambah
* x tetap * z tetap */
function keatas($id_user, $panjang, $tinggi, $lebar, $berat, $panjang_ruangan_max, $tinggi_ruangan_max, $lebar_ruangan_max, $id_kotak) {
$q_cek_atas = mysql_query("SELECT * FROM tabel_temp_barang WHERE id_user=$id_user AND $panjang<=panjang AND $lebar<=lebar AND $berat<=max_tumpukan AND atas='T' ORDER BY id_barang ASC") or die("Tampil 1: " . mysql_error());
while ($temp = mysql_fetch_array($q_cek_atas)) { $id_temp = $temp['id_barang'];
$x_temp = $temp['x']; $y_temp = $temp['y']; $z_temp = $temp['z'];
$panjang_temp = $temp['panjang']; $tinggi_temp = $temp['tinggi']; $lebar_temp = $temp['lebar']; $berat_temp = $temp['berat']; $index_x = $temp['index_x']; $index_y = $temp['index_y']; $index_z = $temp['index_z'];
$max_tumpukan = $berat_temp - $berat;
if ($y_temp + $tinggi_temp / 2 + $tinggi <= $tinggi_ruangan_max) {
$x = $x_temp;
$y = $y_temp + $tinggi_temp / 2 + $tinggi / 2;
$z = $z_temp;
mysql_query("UPDATE tabel_temp_barang SET atas='F' WHEREid_barang=$id_temp") or die("Update 1" . mysql_error());
mysql_query("INSERT INTO tabel_temp_barang
(id_user, id_barang, x,y,z,panjang,tinggi,lebar, berat, atas,kanan,dalam, index_x, index_y, index_z, max_tumpukan) VALUES($id_user, $id_kotak, $x,$y,$z, $panjang,$tinggi,$lebar, $berat, 'T', 'F', 'F', $index_x, $index_y+1, $index_z,$max_tumpukan)") or die("Insert 1" . mysql_error());
return Array($x, $y, $z); break;
(5)
} else { continue; }
} }
function kesamping($id_user, $panjang, $tinggi, $lebar, $berat, $panjang_ruangan_max, $tinggi_ruangan_max, $lebar_ruangan_max, $id_kotak) {
// $q_cek_atas = mysql_query("SELECT * FROM tabel_temp_barang WHERE id_user=$id_user AND $panjang<=panjang AND $lebar<=lebar AND $berat<=max_tumpukan
//AND kanan='T' ORDER BY id_barang ASC ") or die("Tampil 1: " . mysql_error()); $q_cek_atas = mysql_query("SELECT * FROM
tabel_temp_barang WHERE id_user=$id_user AND $lebar<=lebar AND $berat<=max_tumpukan AND kanan='T' ORDER BY id_barang ASC ") or die("Tampil 1: " . mysql_error());
while ($temp = mysql_fetch_array($q_cek_atas)) { $id_temp = $temp['id_barang'];
$x_temp = $temp['x']; $y_temp = $temp['y']; $z_temp = $temp['z'];
$panjang_temp = $temp['panjang']; $tinggi_temp = $temp['tinggi']; $lebar_temp = $temp['lebar']; $index_x = $temp['index_x']; $index_y = $temp['index_y']; $index_z = $temp['index_z']; $max_tumpukan = $berat;
if ($x_temp + $panjang_temp / 2 + $panjang <= $panjang_ruangan_max) {
$x = $x_temp + $panjang_temp / 2 + $panjang / 2; $y = $y_temp - $tinggi_temp / 2 + $tinggi / 2; $z = $z_temp - $lebar_temp / 2 + $lebar / 2;
mysql_query("UPDATE tabel_temp_barang SET kanan='F' WHERE id_barang=$id_temp") or die("Update 1" . mysql_error()); mysql_query("INSERT INTO tabel_temp_barang (id_user, id_barang,x,y,z,panjang,tinggi,lebar, berat,
atas,kanan,dalam, index_x, index_y, index_z, max_tumpukan) VALUES($id_user, $id_kotak,$x,$y,$z, $panjang,$tinggi,$lebar, $berat, 'T', 'T', 'T', $index_x+1, $index_y, $index_z,
$max_tumpukan)") or die("Insert 1" . mysql_error()); return Array($x, $y, $z);
} else { continue; }
} }
function kedalam($id_user, $panjang, $tinggi, $lebar, $berat, $panjang_ruangan_max, $tinggi_ruangan_max, $lebar_ruangan_max, $id_kotak) {
$q_cek_atas = mysql_query("SELECT * FROM tabel_temp_barang WHERE id_user=$id_user AND $panjang<=panjang AND $lebar<=lebar AND
(6)
$berat<=max_tumpukan AND dalam='T' ORDER BY index_x ASC, id_barang ASC LIMIT 1") or die("Tampil 1: " . mysql_error()); while ($temp = mysql_fetch_array($q_cek_atas)) {
$id_temp = $temp['id_barang']; $x_temp = $temp['x'];
$y_temp = $temp['y']; $z_temp = $temp['z'];
$panjang_temp = $temp['panjang']; $tinggi_temp = $temp['tinggi']; $lebar_temp = $temp['lebar']; $index_x = $temp['index_x']; $index_y = $temp['index_y']; $index_z = $temp['index_z']; $max_tumpukan = $berat;
if ($z_temp + $lebar_temp / 2 + $lebar <= $lebar_ruangan_max && $panjang <=$panjang_temp) {
$x = $x_temp - $panjang_temp / 2 + $panjang / 2; $y = $y_temp - $tinggi_temp / 2 + $tinggi / 2; $z = $z_temp + $lebar_temp / 2 + $lebar / 2;
mysql_query("UPDATE tabel_temp_barang SET dalam='F' WHERE id_barang=$id_temp") or die("Update 1" . mysql_error()); mysql_query("INSERT INTO tabel_temp_barang (id_user, id_barang, x,y,z,panjang,tinggi,lebar, berat,
atas,kanan,dalam, index_x, index_y, index_z, max_tumpukan) VALUES($id_user, $id_kotak,$x,$y,$z, $panjang,$tinggi,$lebar, $berat, 'T', 'F', 'T', $index_x+1, $index_y, $index_z+1, $max_tumpukan)") or die("Insert 1" . mysql_error()); return Array($x, $y, $z);
} else { continue; }
} }
//jika tabel_temp_barang masih kosong
function kotak_pertama($id_user, $panjang, $tinggi, $lebar, $panjang_ruangan_min, $tinggi_ruangan_min, $lebar_ruangan_min, $berat, $id_kotak) {
$x = $panjang_ruangan_min + $panjang / 2; $y = $tinggi_ruangan_min + $tinggi / 2; $z = $lebar_ruangan_min + $lebar / 2; $max_tumpukan = $berat;
mysql_query("INSERT INTO tabel_temp_barang (id_user, id_barang, x,y,z,panjang,tinggi,lebar, berat, atas,kanan,dalam, index_x, index_y, index_z, max_tumpukan) VALUES($id_user, $id_kotak, $x,$y,$z, $panjang,$tinggi,$lebar, $berat, 'T', 'T', 'T', 0,0,0, $max_tumpukan)") or die("Insert 1" . mysql_error());
return Array($x, $y, $z); }