Rancangan halaman utama user Rancangan halaman visualisasi 3D

38 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. Rancangan dapat dilihat pada Gambar 3.14. Universitas Sumatera Utara 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 beratmassa 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 Gambar 3.15. Rancangan Halaman Proses Algoritma Universitas Sumatera Utara 40

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 Gambar 3.16. Rancangan Halaman Visualisasi 3D Universitas Sumatera Utara

BAB 4 IMPLEMENTASI DAN PENGUJIAN

4.1. Implementasi Sistem

Setelah penganalisisan dan perancangan sistem, maka dilakukan pengimplementasian dan pengujian terhadap sistem penyusunan barang pada gudang dengan menggunakan bahasa pemrograman PHP dan JavaScript.

4.1.1. Spesifikasi perangkat keras dan perangkat lunak yang digunakan

Sistem dibangun dengan perangkat keras yang memiliki spesifikasi sebagai berikut: 1. Processor Intel® Core™ i3 CPU M 350Hz4 CPUs, 2.3GHz 2. RAM yang digunakan 2048MB 3. Kapasitas Hardisk 320 GB Sistem juga dibangun dengan perangkat lunak yang memiliki spesifikasi sebagai berikut: 1. Windows 7 Ultimate 32-bit 2. XAMPP 1.8.3 3. Netbeans IDE 7.0

4.1.2. Implementasi Perancangan Antarmuka

Implementasi perancangan antarmuka sistem adalah sebagai berikut:

a. Tampilan Halaman Konfigurasi

Pada halaman konfigurasi ini terdapat input box untuk meng-input data panjang, tinggi, lebar barang dalam satuan meter m dan berat barang dalam satuan kilogramkg. Pada halaman konfigurasi ini juga terdapat input box ukuran ruangan yang sudah diset default panjang ruangan: 100, lebar ruangan: 100 dan tinggi ruangan: 100, dan ukuran ruangan juga dapat diganti dengan tombol “ganti ukuran ruangan”. Tampilan dapat dilihat pada Gambar 4.1. Universitas Sumatera Utara