Desain Input dan Output

3.2.8 Desain Input dan Output

Desain input atau output merupakan rancangan input atau output berupa form untuk menu utama, login, master, transaksi, laporan dan stok tabung. Desain input atau output juga merupakan acuan pembuat aplikasi dalam Sistem Informasi Penjualan Gas pada CV. Berkat Alam Sejahtera. A. Desain Form Menu Utama Form menu utama terdapat menu utama yang terdiri dari menu yang mengarah ke halaman master, transaksi, inventori dan laporan. Desain form menu utama dapat dilihat pada Gambar 3.28. Menu Utama LOGO Master Transaksi Laporan Stok Tabung Exit Gambar 3.28 Desain UI Form Menu Utama B. Desain Form Login Form login digunakan pertama kali saat membuka sistem, digunakan untuk proses autentifikasi pengguna sebagaimana digambarkan pada Gambar 4.29. Login username password USERNAME PASSWORD LOGO Login Gambar 4.29 Desain UI Form Login C. Desain Form Master 1. Desain Form Master Jenis Gas Form Master Jenis Gas digunakan untuk mengatur data jenis gas yang ada di jual oleh CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.30. Master Jenis Gas ID Gas Nama Gas Id gas Nama gas Text Text Text Text Text Text ID Gas Nama Gas Simpan Bersih Gambar 4.30 Desain UI Form Master Jenis Gas 2. Desain Form Master Ukuran Tabung Form Master Ukuran Tabung digunakan untuk mengatur data ukuran tabung yang ada di jual oleh CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.31. Master Ukuran Tabug ID Ukuran Ukuran Tabung ID Ukuran Ukuran Tabung Text Text Text Text Text Text ID Ukuran Ukuran Tabung m3 Simpan Bersih Gambar 4.31 Desain UI Form Master Ukuran Tabug 3. Desain Form Master Tabung Form Master Harga digunakan untuk mengatur data tabung baru di CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.32. Master Tabung ID Gas Nama Gas Ukuran Tabung Merk Tanggal Beli Nama gas Ukuran tabung Text Text Text Text Text Text Jumlah Id mulai Id terakhir Text Text Text Tanggal beli Text Text Text Merk Text Text Text Nama Gas Ukuran Tabung Simpan Batal Jumlah Buat ID ID Tabung Mulai ID Tabung Terakhir Tanggal Beli Merk Gambar 4.32 Desain UI Form Master Tabung 4. Desain Form Master Harga Form Master Harga digunakan untuk mengatur data harga masing-masing jenis gas dan ukuran tabung yang ada di jual oleh CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.33. Master Harga ID Harga Nama Gas Ukuran Tabung Harga Beli Harga Jual Tanggal Update ID Harga Nama gas Text Text Text Text Text Text Ukuran tabung m3 Tanggal Update Text Text Text Harga Text Text Text Text Text Text Harga Text Text Text ID Harga Nama Gas Simpan Bersih Ukuran Tabung Tanggal Update Harga Beli Harga Jual Gambar 4.33 Desain UI Form Master Harga 5. Desain Form Master Pelanggan Form Master Pelanggan digunakan untuk mengatur data pelanggan baru di CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.34. Master Pelanggan ID Pelanggan Nama Alamat Wilayah No Telp Fax Email Tanggal Daftar Id pelanggan Nama perusahaan Text Text Text Text Text Text Alamat No telp Text Text Text Wilayah Text Text Text Text Text Text Fax Terdaftar Sejak Email Text Text Text Text Text Text Text Text Text ID Pelanggan Nama Perusahaan Simpan Batal Alamat No telp Wilayah Fax Tanggal Daftar Email Gambar 4.34 Desain UI Form Master Pelanggan D. Desain Form Penjualan Gas Form Penjualan Gas digunakan untuk mencatat penjualan gas pada CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.35. Penjualan Gas Jenis Gas Ukuran Jumlah Harga Subtotal Id Penjualan ID Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Ukuran Tabung Jenis Gas Jumlah Harga Nama Pelanggan Tanggal Penjualan Jumlah Harga Total ID Penjualan ID Pemesanan Simpan Ukuran Tabung Jenis Gas Jumlah Harga ... Tanggal Penjualan Batal Total Biaya Kirim Total Tambah Ubah Hapus Gambar 4.35 Desain UI Form Penjualan Gas E. Desain Form Pembayaran Gas Form pembayaran gas digunakan untuk melakukan input data pembayaran gas. Desain form pembayaran gas dapat dilihat pada Gambar 3.36. Pembayaran Gas ID_Penjualan Tanggal Penjualan ID_Pelanggan Nama Pelanggan Total Total Pembayaran Sisa Hutang Jatuh tempo Id Pembayaran Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Nama Pelanggan Tanggal Pembayaran Jumlah Pembayaran Denda Text Text Text Text Text Text Text Text Text ID Pembayaran Simpan Nama Pelanggan Periode sd Tanggal Pembayaran Batal Jumlah Pembayaran Denda Histori Pembayaran Gambar 3.36 Desain Form Pembayaran Gas F. Desain Form Peminjaman Tabung Form Peminjaman Tabung digunakan untuk mencatat peminjaman tabung gas oleh sebagaimana digambarkan pada Gambar 4.37. Peminjaman Tabung ID Tabung Id Peminjaman Text Text Text ID Penjualan Tanggal Peminjaman Jumlah Tabung ID Pelanggan ID Peminjaman ID Penjualan Simpan ... Pelanggan Batal Tanggal Peminjaman Jumlah Tabung Tambah Hapus Gambar 4.37 Desain UI Form Peminjaman Tabung G. Desain Form Cek Stok Tabung Form Cek Stok Tabung digunakan untuk melihat stok tabung yang tersedia di gudang pada CV. Berkat Alam Sejahtera sebagaimana digambarkan pada Gambar 4.38. Master Ukuran Tabug Jenis Gas Ukuran Tabung Stok Text Text Text Text Text Text Text Text Text Cek Stok Tabung Gambar 4.38 Desain UI Form Cek Stok Tabung H. Desain Form Reminder Jatuh Tempo Piutang Form Reminder Jatuh Tempo Piutang digunakan untuk pengingat kepada admin penjualan jika ada jatuh tempo piutang selama satu minggu kedepan yang akan muncul secara otomatis setelah admin penjualan login sebagaimana digambarkan pada Gambar 4.39. Reminder Jatuh Tempo Piutang ID_Penjualan Tanggal Penjualan ID_Pelanggan Nama Pelanggan Total Sisa Piutang Jatuh tempo Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Gambar 4.39 Desain Form Reminder Jatuh Tempo Piutang I. Desain Form Laporan 1. Desain Form Faktur Penjualan Gambar 3.40 Desain Faktur Penjualan Form Laporan Faktur Penjualan digunakan untuk melihat laporan penjualan ke pelanggan tertentu dan sebagai bukti lunas jika pelanggan melakukan transaksi secara tunai. Desain form laporan faktur penjualan dapat dilihat pada Gambar 3.40. 2. Desain Form Surat Jalan Form surat jalan digunakan untuk bukti serah terima tabung gas dari perusahaan kepada pelanggan. Desain form surat jalan dapat dilihat pada Gambar 3.41 Gambar 3.41 Desain Surat Jalan 3. Desain Form Laporan Pelanggan Baru Form laporan pelanggan baru digunakan laporan kepada owner jika ada pelanggan baru. Desain form laporan pelanggan baru dapat dilihat pada Gambar 3.42. Gambar 3.42 Desain Laporan Pelanggan Baru 4. Desain Form Laporan Penjualan Form laporan penjualan digunakan untuk melihat laporan laporan penjualan selama periode tertentu. Desain form laporan data warna aset dapat dilihat pada Gambar 3.43. Gambar 3.43 Desain Laporan Penjualan 5. Desain Form Laporan Perubahan Harga Form laporan perubahan harga digunakan untuk laporan kepada owner berupa grafik jika ada perubahan harga produk. Desain form laporan perubahan harga dapat dilihat pada Gambar 3.44. Gambar 3.44 Desain Laporan Perubahan Harga 6. Desain Form Nota Pembayaran Form Nota Pembayaran digunakan untuk bukti pembayaran penjualan secara kredit. Desain form Nota Pembayaran dapat dilihat pada Gambar 3.45. Gambar 3.45 Desain Nota Pembayaran

3.3 Pembuatan Program