Activity Diagram Class Diagram

3. Sequence DiagramLaporan

F. Laporan Aktor Main:Menu Database Memilih Laporan Memilih jenis laporan Menampilkan jenis laporan yang dipilih Input periode laporan yang akan dicetak 6. Mengakses database Menampilkan preview Mencetak laporan 7. Akses database 8. Print Gambar 4.7 Sequence Diagram Laporan.

4.1.3.5. Collaboration Diagram

Berikut adalah collaboration diagramdari sistem yang diusulkan :

1. Collaboration DiagramPenjualan

Close Form 4. Connect Database 1. View Form Yang Dipilih 2. Input Data Penjualan 6. Nota Penjualan 3. Proses Data 5. Pesan Input Berhasil : Input Proses : Form Data User Gambar 4.8 Collaboration DiagramPenjualan.

2. Collaboration DiagramPengiriman

Close Form 4. Connect Database 1. View Form Yang Dipilih 2. Input Data Pengiriman 6. Surat Jalan 3. Proses Data 5. Pesan Input Berhasil : Input Proses : Form Data User Gambar 4.9 Collaboration DiagramPengiriman.

3. Collaboration DiagramLaporan

Close Form 4. Connect Database 1. View Form Laporan 2. Pilih Jenis Laporan 6. Message Box 3. Proses Laporan 5. Preview Laporan : Proses Laporan : Form Laporan User 6. Cetak Laporan : Print Gambar 4.10 Collaboration Diagram Laporan.

4.1.3.6. Class Diagram

+Add +Save +Edit +Cancel +Delete +Close +Search -Username -Password User +Save +Close +Cancel -no_nota -Tanggal Form Pengiriman +Save +Close +Cancel -no_nota -Tanggal -kd_barang -qty -subtotal Form Penjualan +Preview +Close -Periode -kd_brg -stok Laporan Stok Barang 1 1...n 1 1...n 1 1...n 1 1...n +Add +Save +Cancel +Delete +Close +Search -Kd_barang -Nama barang -hrg_jual -hrg_beli -stok Barang +Preview +Close -Periode -Total Laporan Penjualan 1 1...n Gambar 4.11 ClassDiagram.

4.1.3.7. Component Diagram

Component diagram menggambarkan struktur dan hubungan antar komponen peranti lunak, termasuk ketergantungan dependency.Pada umunya komponen terbentuk dari beberapa class dan package, tapi dapat juga dari komponen-komponen yang lebih kecil. Pemroses Data Security UI SI CV. Panji Putra Database Gambar 4.12 ComponentDiagram.

4.1.3.8. Deployment Diagram

Adalah diagram untuk mengembangkan dari suatu sistem yang telah diciptakan sehingga dapat ditelusuri apabila terjadi kesalahan baik dalam perancangan maupun implementasinya. Personal Computer XAMP Application Apache executable MySQL executable DB database JDBC SI CV. Panji Putra Gambar 4.13 DeploymentDiagram.

4.2 Perancangan Antar Muka

Perancangan antar muka interface merupakan suatu tahapan agar aplikasi yang dibuat lebih menarik dan tentunya lebih mudah digunakan.Tujuan dari perancangan antar muka pada adalah untuk mendapatkan suatu kriteria yang sangat penting dalam pengoprasian sebuah program aplikasi, yaitu aspek ramah dengan pengguna user friendly. Perancangan antar muka yang ada dalam sistem berdasarkan diagram- diagram UML yang telah dibuat sebelumnya. Adapun perancangan antar muka ini terdiri dari struktur menu, perancangan input dan perancangan output.

4.2.1. Perancangan Input

Perancangan input merupakan form interface tentang sistem masukan suatu proses dari pengguna sistem yang nantinya akan dijadikan sebagai laporan untuk admin. Adapun perancangan input sistem informasi ini adalah sebagai berikut: 1. Form Login Form login ini berfungsi sebagai keamanan sistem dimana user harus melakukan login terlebih dahulu untuk mengakses menu utama program. Username Password Login Close Gambar 4.14 PerancanganForm Login. 2. Form Barang Form ini berfungsi sebagai melihat dan mengolah data barang yang ada di gudang. Kode Barang Jenis Barang Nama Narang Harga Jual Stok Awal Harga Beli Tambah Hapus Simpan Tabel Barang Edit Batal Gambar 4.15 PerancanganForm Barang. 3. Form Penjualan Form ini berfungsi sebagai pengelolaan pemesanan barang apa saja yang di pesan oleh konsumen. No Nota ID Pembeli Nama No Telp Alamat Tanggal Tambah Simpan Tabel Barang Batal Kode Barang Jumlah Total Bayar Kembali Gambar 4.16 PerancanganForm Penjualan. 4. Form Pengiriman Form ini berfungsi dalam pengelolaan data pengiriman barang. No Nota ID Pembeli Nama No Telp Alamat Tanggal Tambah Simpan Tabel Barang Batal Gambar 4.17 PerancanganForm Pembayaran.