Design rancangan antar muka

248

4.3.3 Design rancangan antar muka

Sign In User User ID Bagian Submit Password Reset Gambar Dan Logo Perusahaan Footer Gambar 4.81 Menu Sign In HEADER Tanggal : dd-mm-yyyy Footer Transaksi Cek Cetak Laporan Grafik Laporan Input Log out Tanggal : dd-mm-yyyy Gambar 4.82 Menu Utama 249 I n p u t HEADER Footer Input Data Supplier Pembelian Agenda Acara Retur barang Data Barang User Back Gambar 4.83 Form Input I n p u t HEADER Footer Transaksi Barang Keluar Nota Pembayaran TTB Retur barang Barang Masuk Back Gambar 4.84 Form Transaksi 250 I n p u t HEADER Footer Cetak laporan Laporan data supplier Laporan Pembelian PO Laporan barang masuk Laporan data barang Laporan barang keluar Laporan penerimaan barang Laporan retur barang Laporan agenda acara Back Gambar 4.85 Form Cetak Laporan I n p u t HEADER Footer Grafik Laporan Laporan Pembelian PO Laporan barang masuk Laporan agenda acara Laporan penerimaan barang Laporan retur barang Back Gambar 4.86 Form grafik Laporan 251 Save Display X-20-X X-20-X Kode Barang Nama Barang Merk Type Barang Rp 9,999,999 Harga Satuan X-10-X Satuan Barang Input Data Barang Add Back Stock Minim 99 Kode Nama Barang Merk Type Barang Satuan Barang Harga Satuan Stock minim Jumlah Barang Footer Aksi Edit || Delete NAMA PERUSAHAAN DAN LOGO Gambar 4.87 Input Data Barang Save Kode Supplier Nama Supplier Alamat Fax Telepon Supplier Add Back Kode Supplier Nama Supplier Alamat Telepon Fax Footer NAMA PERUSAHAAN DAN LOGO Aksi Edit || Delete Gambar 4.88 Input Data Supplier 252 Save Nomor PO Kode Supplier Alamat Fax Telepon Pembelian Add Back No PO Kode Supplier Nama Supplier Alamat Telepon Nama Supplier Kode Barang Stock Satuan Barang Harga Pesan Jumlah Harga Jumlah Pesan Nama Barang Fax Aksi DDMMYYYY Tgl Pembelian Kode Barang Nama barang Harga Pesan ‘jumlah pesan Aksi ‘jumlah Harga Barang || Print ||Delete BARANG Nama Perusahaan dan Logo Gambar 4.89 Input Data Pembelian PO add Nomor PO Kode Barang Nama Barang No Referensi SJ No TTB Add Back No TTB Tgl TTB No Referensi No PO Nama Supplier Footer Nama Supplier DDMMYYYY Tgl TTB Keterangan Aksi Barang Tanda Terima Barang Nama Perusahaan dan Logo Satuan Barang MerkType Barang Jumlah Kirim Jumlah Terima NoTTB Kode barang Nama Barang ‘jumlah Kirim ‘jumlah Terima Print || Edit ||Delete Gambar 4.90 Transaksi Tanda Terima Barang 253 Save DDMMYYYY Nomor Retur Tgl Pengembalian Nama Barang No TTB Add Back No Retur Tgl Pengembalian Tgl Rencana Kembali No TTB Print Delete Footer DDMMYYYY Jumlah Kembali Kode Barang Retur Barang Add DDMMYYYY Tgl Rencana barang kembali Keterangan No Retur Jumlah kembali Kode Barang Nama Perusahaan dan Logo Gambar 4.91 . Transaksi Retur 254 Save Total Bayar Nama Supplier No Nota Add Back Footer Kode Supplier DDMMYYYY Tgl Nota Nomor Pembelian Nota Pembayaran No Nota Tgl Nota No Pembelian Kode Supplier Nama Supplier Total Bayar Print Edit Delete Print || Edit ||Delete Gambar 4.92 Nota Pembayaran Save Nama Lengkap Nomor Induk Karyawan Add Back Footer Divisi User NIK Nama Divisi Delete Delete Password Username Gambar 4.93 Input Data User 255 bulan Footer Laporan Pembelian Tampil Tanggal PO Cetak Laporan Berdasarkan Tanggal Cetak Laporan Berdasarkan Bulan Cetak Laporan Berdasarkan Tahun Gambar dan Logo Perusahaan Gambar 4.94 Cetak Laporan Pembelian bulan Footer Laporan Barang Keluar Tampil Tanggal PO Cetak Laporan Berdasarkan Tanggal Cetak Laporan Berdasarkan Bulan Cetak Laporan Berdasarkan Tahun Gambar dan Logo Perusahaan Gambar 4.95 Cetak laporan barang keluar 256 Display Alamat Data Barang Logo Perusahaan Kode Barang Nama Barang Merk Type Barang Harga Satuan Satuan Barang Stock Minim Stock Gambar 4.96 Rancangan Cetak data barang Display Alamat Data Supplier Logo Perusahaan Kode Supplier Nama Supplier Alamat Fax Telp Keterangan Gambar 4.97 Rancangan Cetak data supplier 257 Display Alamat Purchase Order Logo Perusahaan Kode Barang Nama Barang Merk Type Barang Harga Satuan Satuan Barang Stock Minim Stock Tanggal : No PO : Kode Supplier : Nama Supplier : Telp Supplier : Alamat Supplier : Penerima Hormat Kami Gambar 4.98 Rancangan Cetak Pembelian PO Display Alamat barang masuk Logo Perusahaan Kode Barang Nama Barang Merk Type Barang Jumlah barang Satuan Barang Stock Harga satuan Kode supplier NoTransaksi : Tgl Transaksi : No TTB : Tgl TTB : Alamat Supplier : Gambar 4.99 Rancangan Cetak barang masuk 258 Display Alamat barang keluar Logo Perusahaan Kode Barang Nama Barang Jumlah barang keluar Sisa Stock Divisi : NoTransaksi : Tgl Transaksi : Penanggung jawab : Gambar 4.100 Rancangan Cetak barang keluar Display Alamat Penerimaan Barang Logo Perusahaan Kode Barang Nama Barang Merk Type Barang Satuan Barang Nama Supplier : NoTTB : Tgl TTB : Kode Supplier : No Referensi SJ : No pembelianPO : Jumlah Kirim Jumlah Terima Keterangan Gambar 4.101 Rancangan Cetak Penerimaan Barang 259 Display Alamat Retur Barang Logo Perusahaan Kode Barang Nama Barang Kode Supplier No Retur : Tgl Pengembalian : Tgl Rencana Kembali : No Referensi SJ : Nama Supplier Jumlah Kembali Keterangan No TTB : Tgl TTB : Bagian Peneriman Supplier Gambar 4.102 Rancangan Cetak retur barang Display Alamat Nota Pembayaran Logo Perusahaan Kode Barang Nama Barang Jumlah Kirim No Nota : No Pembelian : Tgl Nota Pembayaran : Kode Supplier : Jumlah Terima Harga Pesan Jumlah Harga Nama Supplier Bagian Penerimaan Supplier ______________ ______________ Total Gambar 4.103 Rancangan Nota Pembayaran 260

4.4 System Implementation

Pada tahapan implemtasi ini, Unified Modelling Language UML juga menyediakan diagram yang menggambarkan infrastruktur yang harus dibangun oleh sistem ini yaitu Deployment Diagram. Deployment diagram diagram penguraian digunakan untuk mendeskripsikan arsitektur fisik dalam istilah “node” untuk hardware dan software dalam sistem. Diagram ini menggambar konfigurasi komponen- komponen software run-time, processor, dan peralatan yang membentuk arsitektur sistem Whitten, 2004 . Pada tahap implementasi ini terdapat beberapa aktivitas yang dilakukan. Aktivitas-aktivitas yang dimaksud yaitu Kadir, 2003: a Pemrograman b Pengujian

4.4.1 Pemograman

Pemrograman adalah aktivitas pembuatan program atau sederetan intruksi yang digunakan untuk mengatur komputer agar bekerja sesuai dengan maksud masing-masing intruksi Kadir, 2003. Dalam tahap pembuatan aplikasi ini ada beberapa software pendukung yang digunakan seperti XAMPP versi 1.6.2 yang mencakup: Apache versi 2.2.4 untuk web server, PHP versi 5.2.2 untuk bahasa pemrograman dan MySQL versi 5.0.41 untuk database-nya. Selain itu,