BAB 3 ANALISIS DAN PERANCANGAN SISTEM
3.2. Perancangan Sistem
3.2.3 Perancangan Antarmuka
3.2.3.2 Perancangan Antarmuka Pegawai
Perancangangan antarmuka pegawai dirancang untuk tampilan antarmuka untuk pegawai.
1. Perancangan Antarmuka Login Pegawai
T01
Latar belakang : Custom Resolusi : 1024 x 768 Deskripsi : Halaman login
§ Masukan username ke field username
§ Masukan password ke field
§ Klik tombol login untuk login
login username password
login
Gambar 3.38 Perancangan Antarmuka Login Pegawai
2. Perancangan Antarmuka Beranda
Berikut perancangan antarmuka beranda untuk pegawai. T02
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman beranda admin
§ Klik gambar barang untuk masuk ke pengolahan data barang (T03)
§ Klik gambar pegawai untuk masuk ke pengolahan data pegawai (T04)
§ Klik gambar supplier untuk masuk ke pengolahan data supplier (T05)
§ Klik gambar pelanggan untuk masuk ke pengolahan data pelanggan (T06)
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik gambar daftar faktur penjualan untuk menuju (T15)
§ Klik gambar daftar faktur pembelian untuk menuju (T16)
Pengolahan data master
Transaksi
laporan menu
gambar gambar gambar gambar
gambar gambar gambar gambar · Data barang · Data pegawai · Data supplier · Data pelanggan · Transaksi penjualan · Transaksi pembelian
barang pegawai supplier pelanggan
pembelian penjualan
Daftar faktur penjualan Daftar faktur
pembelian
Beranda Data Master Transaksi Laporan Log Out
3. Perancangan Antarmuka Pengolahan Data Barang
Berikut perancangan antarmuka untuk pengolahan data barang.
T03
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman pengolahan data barang
§ Klik gambar barang untuk masuk ke pengolahan data barang (T03)
§ Klik gambar pegawai untuk masuk ke pengolahan data pegawai (T04)
§ Klik gambar supplier untuk masuk ke pengolahan data supplier (T05)
§ Klik gambar pelanggan untuk masuk ke pengolahan data pelanggan (T06)
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik tombol masukan data baru untuk memanggil dialog form data baru
§ Pilih aksi hapus untuk memanggil dialog konfirmasi hapus
§ Pilih aksi ubah untuk memanggil dialog form ubah data barang
§ Pilih field yang akan di urutkan kemudian pilih jenis pengurutan untuk mengurutka data barang
Pengolahan data barang menu · Data barang · Data pegawai · Data supplier · Data pelanggan no Kode barang Kode gudang Nama
barang stok merk kategori Harga beli Harga jual Tanggal entry aksi pengurutan kode ASC go operasi Masukan data baru
Beranda Data Master Transaksi Laporan Log Out
Gambar 3.40 Perancangan Antarmuka Pengolahan Data Barang
4. Perancangan Antarmuka Pengolahan Data Supplier
Berikut perancangan antarmuka untuk pengolahan data supplier.
T05
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman pengolahan data supplier
§ Klik gambar barang untuk masuk ke pengolahan data barang (T03)
§ Klik gambar pegawai untuk masuk ke pengolahan data pegawai (T04)
§ Klik gambar supplier untuk masuk ke pengolahan data supplier (T05)
§ Klik gambar pelanggan untuk masuk ke pengolahan data pelanggan (T06)
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik tombol masukan data baru untuk memanggil dialog form data baru
§ Pilih aksi hapus untuk memanggil dialog konfirmasi hapus
§ Pilih aksi ubah untuk memanggil dialog form ubah data supplier
§ Pilih field yang akan di urutkan kemudian pilih jenis pengurutan untuk mengurutka data supplier
Pengolahan data supplier menu
· Data barang
· Data pegawai
· Data supplier
· Data pelanggan no nama perusahaan alamat No_telpon aksi
pengurutan kode ASC go
operasi Masukan data baru
Beranda Data Master Transaksi Laporan Log Out
5. Perancangan Antarmuka Pengolahan Data Pelanggan
Berikut perancangan antarmuka untuk pengolahan data pelanggan.
T06
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman pengolahan data pelanggan
§ Klik gambar barang untuk masuk ke pengolahan data barang (T03)
§ Klik gambar pegawai untuk masuk ke pengolahan data pegawai (T04)
§ Klik gambar supplier untuk masuk ke pengolahan data supplier (T05)
§ Klik gambar pelanggan untuk masuk ke pengolahan data pelanggan (T06)
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik tombol masukan data baru untuk memanggil dialog form data baru
§ Pilih aksi hapus untuk memanggil dialog konfirmasi hapus
§ Pilih aksi ubah untuk memanggil dialog form ubah data planggan
§ Pilih field yang akan di urutkan kemudian pilih jenis pengurutan untuk mengurutka data pelanggan
Pengolahan data pelanggan menu
· Data barang
· Data pegawai
· Data supplier
· Data pelanggan no nama alamat
Jumlah
utang No_telpon aksi pengurutan
kode ASC go operasi Masukan data baru
Tanggal daftar Beranda Data Master Transaksi Laporan Log Out
Gambar 3.42 Perancangan Antarmuka Pengolahan Data Pelanggan
6. Perancangan Antarmuka Transaksi Pembelian
Berikut perancangan antarmuka transaksi pembelian
T07
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman transaksi pembelian
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik tombol tambah untuk menambah record pembelian baru
§ Klik tombol delete untuk menghapus record pembelian
§ Klik submit untuk mengkonfirmasi transaksi
§ Isikan nama supplier pada field nama supplier
Transaksi pembelian menu
· Transaksi penjualan
· Transaksi pembelian Kode barang Jumlah barang Harga satuan Nama supplier
tambah delete submit
Beranda Data Master Transaksi Laporan Log Out
7. Perancangan Antarmuka Transaksi Penjualan
Berikut perancangan antarmuka transaksi penjualan
T08
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman transaksi penjualan
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik tombol tambah untuk menambah record penjualan baru
§ Klik tombol delete untuk menghapus record penjualan
§ Klik submit untuk mengkonfirmasi transaksi
§ Isikan nama pelanggan pada field nama pelanggan
Transaksi penjualan menu
· Transaksi penjualan
· Transaksi pembelian Kode barang Jumlah barang Harga satuan Nama pelanggan
tambah delete submit
Beranda Data Master Transaksi Laporan Log Out
Gambar 3.44 Perancangan Antarmuka Transaksi Penjualan
8. Perancangan Antarmuka Daftar Faktur Penjualan
Berikut perancangan antarmuka daftar faktur penjualan
T15
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman daftar faktur penjualan
Daftar faktur penjualan menu
no No.faktur Waktu transaksi Nama pegawai Nama pelanggan Total transaksi detail Beranda Data Master Transaksi Laporan Log Out
· Laporan Pembelian
· Laporan Penjualan
· Log
· Peramalan
· Barang Kritis
§ Klik gambar barang untuk masuk ke pengolahan data barang (T03)
§ Klik gambar pegawai untuk masuk ke pengolahan data pegawai (T04)
§ Klik gambar supplier untuk masuk ke pengolahan data supplier (T05)
§ Klik gambar pelanggan untuk masuk ke pengolahan data pelanggan (T06)
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik gambar daftar faktur penjualan untuk menuju (T15)
§ Klik gambar daftar faktur pembelian untuk menuju (T16)
pengurutan
Lihat laporan Go
tampilkan
9. Perancangan Antarmuka Daftar Faktur Pembelian
Berikut ini perancangan antarmuka daftar faktur pembelian
T16
Latar belakang : Custom Resolusi : 1024 x 768
Deskripsi : Halaman daftar faktur pembelian
Daftar faktur pembelian menu
no No.faktur Waktu transaksi Nama pegawai Nama supplier Total transaksi detail Beranda Data Master Transaksi Laporan Log Out
· Laporan Pembelian
· Laporan Penjualan
· Log
· Peramalan
· Barang Kritis
§ Klik gambar barang untuk masuk ke pengolahan data barang (T03)
§ Klik gambar pegawai untuk masuk ke pengolahan data pegawai (T04)
§ Klik gambar supplier untuk masuk ke pengolahan data supplier (T05)
§ Klik gambar pelanggan untuk masuk ke pengolahan data pelanggan (T06)
§ Klik link transaksi pembelian untuk masuk ke halaman transaksi pembelian (T07)
§ Klik link transaksi penjualan untuk masuk ke halaman transaksi penjualan (T08)
§ Klik gambar daftar faktur penjualan untuk menuju (T15)
§ Klik gambar daftar faktur pembelian untuk menuju (T16)
pengurutan
Lihat laporan Go
tampilkan
Gambar 3.46 Perancangan Antarmuka Daftar Faktur Pembelian