BAB 2 TINJAUAN PUSTAKA
3.2. Perancangan Sistem
3.2.5 Perancangan Antar Muka
3.2.5.1 Perancangan Tampilan
Perancangan tampilan bertujuan untuk memberikan gambaran tentang sistem informasi yang akan dibangun. Sehingga akan mempermudah dalam mengimplementasikan sistem informasi. Rancangan Sistem Informasi Monitoring Material Proyek Di PT Serena Abadi yang akan dibuat adalah sebagai berikut :
DATA TRANSAKSI LAPORAN TENTANG KELUAR
· Klik menu Data maka akan muncul submenu Proyek, Pekerjaan, Sub Pekerjaan, Kemajuan Pekerjaan, Material, Supplier dan truck
· Klik menu Transaksi maka akan muncul submenu Pembelian dan Kirim material
· Klik menu Laporan maka akan muncul submenu Rekap Pembelian, Rekap Kirim Material dan Rekap Kemajuan Pekerjaan
· Klik menu tentang maka akan ditampilkan penjelasan mengenai aplikasi
· Klik keluar maka aplikasi akan ditutup
· Ukuran layar 1366 x 768
· Font family Arial
· Warna hijau, putih F01
Gambar 3.24 Tampilan Menu Utama
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F02 Kode Proyek Nama Proyek Lokasi Tanggal Proyek Cari Proyek Cari
Kode Proyek Nama Proyek Lokasi Tanggal Tambah Ubah Hapus Kategori Pencarian
DATA PROYEK
Pengurutan berdasarkan
Simpan Batal Refresh
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F03 Nama Proyek Cari Pekerjaan Cari Tambah Ubah Hapus Kategori Pencarian DATA PEKERJAAN Pengurutan berdasarkan Kode Pekerjaan Nama Pekerjaan
Kode Pekerjaan Nama Pekerjaan Nama Proyek Simpan Batal
Refresh
Gambar 3.26 Tampilan Menu Pengolahan Data Pekerjaan
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih F04
Nama Proyek Cari Pekerjaan
Cari
Tambah
Ubah
Hapus Kategori Pencarian
DATA SUB PEKERJAAN
Pengurutan berdasarkan Kode Sub Pekerjaan
Nama Pekerjaan
Nama Sub Pekerjaan
Besar Pekerjaan Satuan
Lama Pekerjaan hari
Kode Sub Pekerjaan Nama Sub Pekerjaan Besar Pekerjaan Satuan Lama Pekerjaan Nama Pekerjaan Nama Proyek
Simpan Batal
Refresh
· Klik Simpan maka akan muncul M01, M010 & M06
· Klik Proses maka akan muncul M04
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03 & M12
· Klik detail maka muncul F06
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih F05
Nama Proyek
Tambah Ubah Hapus
DATA KEMAJUAN PEKERJAAN
Nama Pekerjaan Nama Sub Pekerjaan
Kode Kemajuan Pekerjaan
Nama Kemajuan Pekerjaan
Selesai dikerjakan
Waktu terpakai
Persentase Pekerjaan
Status Pekerjaan
%
Kode Kemajuan PekerjaanNama Kemajuan Pekerjaan Selesai dikerjakan SatuanWaktu Terpakai PersentaseStatusNama ProyekNama Pekerjaan Nama Sub Pekerjaan
Cari Kemajuan Pekerjaan
Kategori Pencarian Cari
Tanggal Kemajuan Tanggal Simpan Batal Detail Refresh Proses
Gambar 3.28 Tampilan Menu Pengolahan Data Kemajuan Pekerjaan
· Klik Simpan maka akan muncul M01, M010 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F06
Nama Kemajuan Pekerjaan
Tambah Ubah Hapus
DATA DETAIL KEMAJUAN
Nama Material No Detail Kemajuan Stok Satuan Koefisien Jumlah Terpakai
Cari Detail Kemajuan Kategori Pencarian
Cari
Nama Material Satuan Jumlah Terpakai Stok Koefisien Simpan
Batal
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih F07 Cari Pekerjaan Cari Tambah Ubah Hapus Kategori Pencarian DATA MATERIAL Pengurutan berdasarkan Nama Material Satuan Harga Satuan
Kode Material Nama Material Satuan Harga Satuan
Simpan Batal
Refresh
Gambar 3.30 Tampilan Menu Pengolahan Data Material
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih F08 Cari Pekerjaan Cari Tambah Ubah Hapus Kategori Pencarian DATA SATUAN Pengurutan berdasarkan Nama Satuan
Kode Satuan Nama Satuan
Simpan Batal
Refresh
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F09 Cari Pekerjaan Cari Tambah Ubah Hapus Kategori Pencarian DATA SUPPLIER Pengurutan berdasarkan Nama Supplier
Kode Supplier Nama Supplier Alamat
No. Telp
Alamat No. Telp Simpan Batal
Refresh
Gambar 3.32 Tampilan Menu Pengolahan Data Supplier
· Klik Simpan maka akan muncul M01, M10 & M06
· Klik Ubah maka akan muncul M11 & M06
· Klik Cari maka akan muncul M02
· Klik Hapus maka akan muncul M03, M07 & M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F10
No Truck Cari Pekerjaan
Cari Tambah Ubah Hapus Kategori Pencarian DATA TRUCK Pengurutan berdasarkan Nama Supir
No Truck Nama Supir Nama Supplier Nama Supplier
Simpan Batal
Refresh
· Klik keluar maka akan kembali ke F01
· Klik belimaka akan muncul M13
· Klik Proses maka akan muncul M10
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F11
Nama Kemajuan Pekerjaan
Simpan PEMBELIAN MATERIAL Besar Pekerjaan Selesai dikerjakan Lama Pekerjaan Waktu terpakai hari hari Nama Material Satuan Jumlah Harga Satuan Subtotal
Nama Sub Pekerjaan Nama Pekerjaan
Nama Proyek No. Pembelian Tanggal
Biaya Total Nama Material Jumlah yang disarankan Jumlah yang dibeli
Batal Beli Supplier
Gambar 3.34 Tampilan Menu Pembelian
· Klik Simpan maka akan muncul M01 bila pemasukan informasi tidak lengkap (belum diisi) dan muncul M11 jika transaksi selesai
· Klik batal untuk membatalkan pengisian data pengiriman dan muncul pesan M12
· Klik keluar maka akan kembali ke F01
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F12 No Pembelian Simpan Kirim Material No Pengiriman Tanggal Kirim
Kode Material Nama Material SatuanJumlah
No Truck Nama Supir Nama Supplier
Nama Proyek Nama Pekerjaan Nama Sub Pekerjaan Nama Kemajuan Pekerjaan
Material
Tambah Batal
· Klik menu cari maka akan muncul M02
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F13
Rekap Pembelian Material
Tanggal Pembelian s/d
No Pembelian Nama Supplier Nama Proyek Nama Pekerjaan Nama Sub Pekerjaan Tanggal Total Bayar
Kode Material Nama Material Jumlah Satuan Harga
Cari Nama Proyek
Nama Pekerjaan
Nama Sub Pekerjaan
Gambar 3.36 Tampilan Menu Rekap Pembelian
· Klik menu Cari maka akan muncul M02
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F14
Rekap Pengiriman Material
Tanggal Pengiriman s/d Cari
No Pengiriman No Truck Nama Proyek Nama Pekerjaan Nama Sub Pekerjaan Tanggal
Kode Material Nama Material Jumlah Satuan Nama Supir
Nama Proyek Nama Pekerjaan Nama Sub Pekerjaan
· Klik menu Cari maka akan muncul M02
· Ukuran layar 1024 x 600
· Font family Arial
· Warna hijau, putih
F15
Keluar
Rekap Kemajuan Pekerjaan
Tanggal Kemajuan s/d Cari
Kode Kemajuan Pekerjaan Tanggal
Selesai Dikerjakan Satuan Waktu Terpakai Nama Kemajuan Pekerjaan
Nama Proyek Nama Pekerjaan Nama Sub Pekerjaan
Persentase Pekerjaan Status Pekerjaan
Gambar 3.38 Tampilan Menu Rekap Kemajuan Pekerjaan
3.2.5.2Perancangan Pesan
Dibawah ini adalah perancangan pesan yang ada pada Sistem Informasi Monitoring Material Proyek Di PT Serena Abadi :
M01 M02
M03 M04
M05 M06
Data belum lengkap Tidak ada data
Yakin data akan dihapus ? Harap Lembur !
Kode sudah ada isi dengan yang lain !
Nama ada yang sama isi dengan yang lain !
M07 M08
M09 M10
M11 M12
M13