BAB IV ANALISIS DAN PERANCANGAN SISTEM

Transkripsi

1 BAB IV ANALISIS DAN PERANCANGAN SISTEM 4.1 Analisis Yang Berjalan Analisis sistem yang berjalan dilakukan dengan cara menganalisis pada objek-objek yang diperlukan untuk sistem yang akan dirancang, dimaksudkan untuk memfokuskan kepada fungsi sistem yang berjalan, tanpa menitik beratkan kepada alur proses dari sistem. Dan dari hasil analisis ini divisualisasi dan didokumentasiakan dengan UML melalui diagram use case, skenario use case dan aktifitas diagram, pertimbangan diagram tersebut ini karena dianggap mewakili secara keseluruhan sistem yang berjalan yang dapat dimengerti oleh user. Tahap pertama yang dilakukan agar bisa menghasilkan sistem informasi yang baik adalah dengan mempelajari bagaimana sistem yang sedang berjalan saat ini di perusahaan. Cara penggambaran sistem tersebut penulis menggunakan UML dengan menggunakan Diagram Use Case, Skenario Use Case dan Diagram Activity Use Case Penjualan Adapun kegiatan yang telah divisualisasikan ke dalam diagram use case adalah sebagai berikut: 66

2 67 System Pengadaan barang pengiriman <<include>> Penjualan Original Skate Shoes <<include>> Pembeli Pembayaran Gambar 4.1 Skenario Use Case Penjualan Yang sedang Berjalan a. Skenario Use Case Pengadaan Barang Skenario : Original Skate Shoes : Pengadaan stok barang Tabel 4.1 Skenario Use Case Pengadaan barang Original Skate Shoes 1. mengorder barang dari distributor 2. merekam data transaksi pembelian 3. mencatat data stok sepatu b. Skenario Use Case Pengiriman Skenario : Original Skate Shoes dan pembeli : Pengiriman sepatu kepada pembeli.

3 68 Tabel 4.2 Skenario Use Case Pengiriman Original Skate Shoes 1. Menyipkan sepatu yang akan dikirim 2. Mencatat data pengiriman 3. Mengirim sepatu Pembeli 4. Menerima kiriman sepatu c. Skenario Use Case Penjualan Skenario : Original Skate Shoes dan pembeli : Original Skate Shoes menjual sepatu kepada pembeli Tabel 4.3 Skenario Use Case Penjualan Original Skate Shoes 1. melakukan transaksi penjualan Pembeli 2. melakukan pemesanan sepatu d. Skenario Use Case Pembayaran Skenario : Original Skate Shoes dan pembeli : Original Skate Shoes mendapatkan pembayaran sepatu dari pembeli Tabel 4.4 Skenario Use Case Pembayaran Original Skate Shoes 1. Memberikan konfirmasi pembayaran 4. Menerima pembayaran Pembeli 2. Mendapatkan konfirmasi pembayaran 3. Membayar biaya pembelian

4 Activity Diagram Activity diagram mempunyai fungsi untuk menggambarkan kegiatankegiatan yang ada di dalam suatu sistem. Agar dapat lebih memahami tentang sistem yang telah berjalan maupun yang akan dibuat, maka perlu dibuatkan activity diagram. Berikut Activity diagram dari sebuah system yang telah berjalan pada Original skate shoes : a. Activity Pengadaan Barang Original Skate Shoes Order barang dari Distributor Merekam data Transaksi pembelian Mencatat data stok sepatu Gambar 4.2 Activity Diagram Pengadaan Barang

5 70 b. Activity Pengiriman Original Skate Shoes Pembeli menyiapkan sepatu yang akan dikirim mencatat data pengiriman mengirim sepatu menerima kiriman sepatu c. Activity Penjualan Gambar 4.3 Activity Diagram Pengiriman Original Skate Shoes Pembeli Melakukan transaksi penjualan Melakukan pemesanan Sepatu Gambar 4.4 Activity Diagram Penjualan

6 71 d. Activity Pembayaran Original Skate Shoes Pembeli Memberikan konfirmasi pembayaran Mendapatkan konfirmasi pembayaran Menerima pembayaran Membayar biaya pembelian Gambar 4.5 Activity Diagram Pembayaran

7 Evaluasi yang Berjalan Berdasarkan hasil gambaran dan analisis system yang telah berjalan di atas, yang ditinjau melalui use case dan Activity diagram dapat digambarkan beberapa kelemahan yang muncul dari sistem informasi pemasaran, pemesanan dan penjualan pada Original Skate Shoes, berikut yang telah penulis uraikan melalui tabel : Tabel 4.5 Evaluasi yang Berjalan Identifikasi masalah Worker Kesimpulan Pengolahan data dan informasi yang sebagian besar hanya mengandalkan proses manual seperti dalam pencatatan data transaksi penjualan dan data stok barang. Original Skate Shoes Perlunya aplikasi yang bisa mengelola data dan informasi dengan lebih baik lagi yaitu dengan adanya fasilitas database Pangsa pasar yang ada di Original skate Shoes sangat terbatas dikarenakan kurangnya media promosi yang baik Proses pemesanan yang kurang efektif dan efisien sehingga perusahaan masih mengandalkan proses pemesanan manual lewat sms atau telepon. Original Skate Shoes Original Skate Shoes Perlunya media pemasaran yang jelas dan terorganisasi dengan baik sehingga pangsa pasar penjualan bisa lebih terarah dan luas maka dibangun lah system informasi penjualan berbasis E-Commerce Perlunya menerapkan metode pemesanan yang lebih efektif lagi dengan memberikan layanan pemesanan yang mudah dan jelas.

8 Perancangan Perancangan sistem ini dibuat sebagai tahapan untuk mempersiapkan proses implementasi sistem yang akan dirancang, dan selain itu bertujuan untuk menggambarkan secara jelas proses - proses yang diinginkan oleh pengguna (user) pada Original Skate Shoes. Sesuai dengan metode pendekatan yang akan digunakan adalah pendekatan object oriented, maka model yang digunakan penulis untuk menggambarkan seluruh proses dan objek adalah dengan menggunakan UML Tujuan Perancangan Perancangan sistem ini bertujuan untuk memberikan gambaran secara umum kepada pengguna (user) tentang sistem yang akan dibangun dan mengidentifikasikan komponen-komponen sistem informasi yang akan didesain secara rinci. Tujuan perancangan sistem informasi penjualan online ini akan diuraikan sebagai berikut : 1. Untuk memenuhi dan memperbaiki kebutuhan sistem yang lebih baik lagi 2. Untuk memberikan gambaran yang jelas dan rancang bangun yang lengkap untuk memudahkan penulis dalam melakukan pemrograman. 3. konsumen dapat berinteraksi secara langsung dengan sistem informasi penjualan dimana dan kapan saja karena system ini berbasis web dan tidak terbatas ruang dan waktu. 4. Untuk memudahkan user atau perusahaan untuk mengelola managemen perusahaan dan pengelolaan penjualan dengan lebih baik lagi. 5. Untuk mengembangkan kualitas dan kuantitas penjualan pada perusahaan.

9 Gambaran Umum yang Diusulkan Gambaran umum dari sistem yang akan diusulkan dan kemudian akan dibangun guna untuk pengembangan dari sistem yang sebelumnya dimana sistem yang sebelumnya belum berbasis e-commerce dan sistem yang diusulkan kini berbasis e-commerce Perancangan Prosedur yang Diusulkan Perancangan prosedur yang diusulkan adalah dengan menggunakan metode perancangan berorientasi objek dengan menggunakan notasi UML yang berfungsi sebagai dokumentasi dan visualisasi rancangan yang akan diusulkan. Berikut adalah rancangan prosedur baru yang akan penulis usulkan untuk memperbaharui rancangan prosedur yang lama Use Case Yang Diusulkan Melihat katalog sepatu System login admin register <<include>> User non member pembayaran Login Member Administrator User pengiriman <<include>> <<extend>> pemesanan sepatu User member Gambar 4.6 Skenario Use Case Penjualan Yang diusulkan

10 75 a. Skenario Use Case Login Admin Skenario : Administrator : Melakukan login dengan mengisi identitas untuk pembuka hak akses, seperti dan password. Tabel 4.6 Skenario Use Case Login Admin 1. Masuk halaman login administrator 2. Mengisikan dan password pada login administrator. 3. Verifikasi username dan password pada database. 4. Jika akun valid, maka secara otomatis akan masuk ke halaman Utama administrator, jika tidak ada data yang dimaksud (data invalid), maka akan kembali ke halaman login administrator. 5. menampilkan halaman utama administrator b. Skenario Use Case Melihat Katalog Sepatu Skenario : User Member dan User Non Member : Melihat katalog sepatu Original Skate Shoes Tabel 4.7 Skenario Use Case Melihat Katalog Sepatu 1. Masuk Ke halaman utama website 2. Memilih menu katalog sepatu yang diinginkan 3. Menampilkan katalog sepatu yang dipilih c. Skenario Use Case Register

11 76 Skenario : User Non Member : Pendaftaran User non member Tabel 4.8 Skenario Use Case Register 1. Pilih menu register. 4. menerima form registrasi 5. mengisi form register 9. Mendapatkan konfirmasi validasi Menerima request register 3. Menampilkan form register 6. Validasi register 7. Menyimpan data member baru 8. Memberi konfirmasi validasi registrasi berhasil. d. Skenario Use Case Login Member Skenario : User Member : Melakukan login dengan mengisi identitas penanda hak akses, seperti dan password. Tabel 4.9 Skenario Use Case Login Member 6. Masuk ke menu login 7. Mengisikan dan password pada login member. 8. Verifikasi username dan password pada database. 9. Jika akun valid, maka secara otomatis akan masuk ke halaman utama website sebagai member, jika tidak ada data yang dimaksud (data invalid), maka akan kembali ke halaman login member. 10. menampilkan halaman utama website

12 77 e. Skenario Use Case Pemesanan Sepatu Skenario : User Member : Pemesanan sepatu oleh user member di website Tabel 4.10 Skenario Use Case Pemesanan 1. masuk ke menu produk sepatu 3. Melihat sepatu yang akan dipesan 5. Memasukan sepatu yang akan dipesan (add to chart) 7. Melihat keranjang belanja 9. Mengklik Process to check out 11. Mengisi form check out 2. Menampilkan katalog produk sepatu 4. Menampilkan produk detail 6. Memasukan pemesanan sepatu ke dalam keranjang belanja 8. Menampilkan halaman keranjang belanja 10. Menampilkan form check out 12. Menyimpan daftar pemesanan. f. Skenario Use Case Pembayaran Skenario : User Member : Konsumen melakukan pembayaran barang yang telah dipilih untuk dibeli. Tabel 4.11 Skenario Use Case Pembayaran 1. User member melakukan pembayaran sejumlah biaya pemesanan dengan media transfer Bank. 2. Konfirmasi pembayaran dengan

13 78 masuk ke menu konfirmasi pembayaran. 4. mengisi form konfirmasi. 3. Menampilkan form konfirmasi pembayaran. 5. Mencatat data konfirmasi pembayaran ke dalam database confirmasi pembayaran. 6. Menampilkan halaman bahwa konfirmasi pembayaran akan segera di proses g. Skenario Pengiriman Skenario : Administrator : Melakukan pengiriman barang yang telah di pesan oleh konsumen. Tabel 4.12 Skenario Use Case Pengiriman 1. Periksa konfirmasi pembayaran dengan mengakses halaman konfirmasi pembayaran. 3. Mengecek data pemesanan user member. 5. Edit status pemesanan menjadi sukses dan memasukan 7. Melakukan pengiriman sepatu kepada konsumen. 2. Menampilkan daftar confirmasi pembayaran. 4. Menampilkan daftar pemesanan member. 6. Status pemesanan user member berubah menjadi transaksi pemesanan sukses.

14 Activity Diagram a. Activity diagram Login Admin Administrator Masuk ke menu login administrator Megisi dan password pada user login Veifikasi username dan password pada database False True Masuk ke halaman administrator menampilkan halaman utama administrator Gambar 4.7 Activity Diagram Login Admin b. Activity Diagram Melihat katalog Sepatu User Masuk ke halaman utama website memilih menu katalog sepatu yang diinginkan Menampilkan katalog sepatu yang dipilih Gambar 4.8 Activity Diagram melihat halaman Katalog Sepatu

15 80 c. Activity diagram Register User non member Pilih menu register menerima request register Menerima Form register Menampilkan halaman register Isi form register Validasi register False True Menyimpan data member baru Mendapatkan konfirmasi validasi Memberi konfirmasi validasi Gambar 4.9 Activity Diagram Register d. Activity diagram Login member User member Masuk ke menu login member Megisi dan password pada login member Veifikasi username dan password pada database False True menampilkan halaman utama website Gambar 4.10 Activity Diagram Login Member

16 81 e. Activity Diagram Pemesanan Sepatu User member Masuk ke produk sepatu Menampilkan katalog produk sepatu melihat sepatu yang akan dipesan Memasukan pemesanan sepatu kedalam keranjang belanja melihat keranjang belanja Menampilkan halaman keranjang belanja mengklik process to check out Menampilkan form check out Mengisi form check out Menyimpan daftar pemesanan Gambar 4.11 Activity Diagram Pemesanan f. Activity diagram Pembayaran User member Melakukan pembayaran Masuk ke menu konfirmasi pembayaran Menampilkan form konfirmasi pembayaran Mengisi form konfirmasi pembayaran mencatat data konfirmasi pembayaran kedalam database menampilkan halaman konfirmasi pembayaran akan di cek Gambar 4.12 Activity Diagram Pembayaran

17 82 g. Activity diagram Pengiriman Administrator Masuk ke halaman Administrator Masuk ke halaman konfirmasi pembayaran menampilkan daftar konfirmasi pembayaran Cek konfirmasi pembayaran user Melakukan pengiriman mengubah status pemesanan menjadi sukses Status pemesanan berubah menjadi sukses Gambar 4.13 Activity Diagram Pengiriman Sequence Diagram Sequence diagram menggambarkan interaksi antar objek di dalam dan disekitar sistem (termasuk pengguna, display, dan sebagainya) berupa message yang digambarkan terhadap waktu. Sequence diagram terdiri atar dimensi vertical (waktu) dan dimensi horizontal (objek-objek yang terkait). Sequence diagram biasa digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang dilakukan sebagai respons dari sebuah event untuk menghasilkan output tertentu. Diawali dari apa yang men-trigger aktivitas tersebut, proses dan perubahan apa saja yang terjadi secara internal dan output apa yang dihasilkan. Berikut adalah sequence diagram yang ada pada sistem penjualan sepatu pada Original Skate Shoes, yaitu:

18 83 a. Sequence Diagram Login Admin : Administrator halaman Login admin tabel admin halaman utama administrator 1 : Masuk() 2 : Login admin() 3 : Invalid() 4 : Tercatat sebagai admin() Gambar 4.14 Sequence Diagram Login Administrator b. Sequence Diagram Melihat Melihat Katalog Sepatu halaman utama halaman katalog sepatu : User non member 1 : masuk() 2 : masuk() 3 : lihat detail sepatu() Gambar 4.15 Sequence Diagram melihat katalog Sepatu

19 84 c. Sequence Diagram Register Halaman Utama Form Register Tabel Member Pendaftar : User Member 1 : Masuk() 2 : Masuk() 3 : Daftar member() 4 : Invalid() 5 : Simpan Daftar() 6 : Masuk() 7 : Login() 8 : Konfirmasi data member() 9 : Status fata member aktif() 10 : tampil status aktif() Gambar 4.16 Sequence Diagram Register d. Sequence Diagram Login Member Halaman Utama Login Form Tabel Member : User Member 1 : Masuk() 2 : masuk() 3 : Login Member() 4 : Invalid() 5 : Tercatat sebagai member() Gambar 4.17 Sequence Diagram Login Member

20 85 e. Sequence Diagram Pemesanan Sepatu katalog produk Detail produk Keranjang pemesanan halaman check out tabel transaksi : User member 1 : masuk() 2 : Pilih produk() 3 : masuk() 4 : Pilih ukuran dan quantity() 5 : Masuk() 6 : masuk() 7 : Invalid() 8 : Input alamat dan metode pembayaran() 9 : Input data pemesanan() 10 : simpan data pemesanan() 11 : Konfirmasi pemesanan telah di proses() Gambar 4.18 Sequence Diagram Pemesanan Sepatu f. Sequence Diagram Pembayaran Offline (transfer bank) halaman konfirmasi pembayaran tabel konfirmasi pembayaran : User member 1 : masuk() 2 : Isi data konfirmasi pembayaran() 3 : Input konfirmasi pembayaran() 4 : Invalid() 5 : Simpan data konfirmasi() 6 : konfirmasi pembayaran akan segera di cek dan di proses() Gambar 4.19 Sequence Diagram Pembayaran

21 86 g. Sequence diagram pembayaran online (paypal) : User member 1 : masuk() Halaman checkout paypal Tabel transaksi 2 : mengisi form pemesanan() 3 : masuk data pemesanan dan total bayar() 4 : login paypal() 5 : melakukan pembayaran() 6 : konfirmasi proses pembayaran sukses() 7 : Simpan data transaksi() 8 : Konfirmasi status pemesanan sukses() Gambar 4.20 Sequence Diagram Pembayaran Online (paypal) h. Sequence Diagram pengiriman : Administrator halaman daftar konfirmasi pembayaran Detail transaksi pembayaran Tabel transaksi 1 : masuk() 2 : Cek pembayaran() 3 : Melakukan pengiriman() 4 : Upadate status pemesanan sukses() 5 : Simpan data transaksi() 6 : Invalid() 7 : Konfirmasi status menjadi sukses() Gambar 4.21 Sequence Diagram Pengiriman

22 Collaboration Diagram Collaboration diagram memberi sebuah cara mengelompokkan potongan potongan behavior interaksi saat peran-peran dimainkan oleh class yang berbeda. Interaksi pendaftar dengan sistem pada proses pendaftaran tanpa penggambaran orientasi waktu, digambarkan oleh gambar collaboration diagram berikut : a. Collaboration Diagram Login Admin Gambar 4.22 Collaboration Diagram Login Admin b. Collaboration Diagram Melihat katalog sepatu Akses halaman produk 1 : masuk() 2 : Masuk() Halaman utama website halaman katalog : User Gambar 4.23 Collaboration Diagram melihat katalog sepatu

23 88 c. Collaboration Diagram Register Simpan daftar member 1 : masuk() 2 : masuk() halaman Utama Form registrasi 3 : Daftar member() tabel member : Administrator 4 : Invalid() Status data member aktif 5 : Masuk() 6 : Konfirmasi data member() Login pendaftar Gambar 4.24 Collaboration Diagram Register d. Collaboration Diagram Login Member 3 : Validasi() 1 : Masuk() 2 : Login member() Halaman Login Tabel login : User member 5 : Invalid() 4 : Masuk() Halaman utama website Gambar 4.25 Collaboration Diagram Login member

24 89 e. Collaboration Diagram Pemesanan Sepatu 1 : masuk() 2 : masuk() halaman utama website Halaman katalog produk memilih produk 3 : masuk() memilih ukuran & qty produk halaman detail produk : User member simpan pemesanan mengisi form pemesanan 4 : masuk() tabel transaksi 6 : pesan produk() Halaman Check out 5 : masuk() keranjang belanja 7 : Invalid() 8 : tampil daftar pesanan() halaman daftar pembelian Gambar 4.26 Collaboration Diagram Pemesanan Sepatu f. Collaboration Diagram Pembayaran Gambar 4.27 Collaboration Diagram Pembayaran

25 90 g. Collaboration Diagram Pembayaran Online (Paypal) Mengisi form pemesanan login paypal +Melakukan pembayaran 1 : masuk() halaman checkout paypal : User member 2 : data pemesanan dan total bayar() 3 : konfirmasi pembayaran sukses() 4 : Konfirmasi status pemesanan sukses() simpan data transaksi +Update status pemesanan sukses tabel transaksi Gambar 4.28 Collaboration Diagram Pembayaran Online ( Paypal ) h. Collaboration Diagram pengiriman 1 : masuk() 2 : cek pembayaran() halaman daftar konfirmasi pembayaran melakukan pengiriman +Update status pemesanan sukses 3 : simpan data transaksi() Detail transaksi pembayaran Tabel transaksi Menyimpan data transaksi : Administrator 4 : Invalid() 5 : Konfirmasi status menjadi sukses() Gambar 4.29 Collaboration Diagram Pengiriman Class Diagram Class adalah sebuah spesifikasi yang jika diinstansiasi akan menghasilkan sebuah objek dan merupakan inti dari pengembangan dan desain berorientasi objek. Class menggambarkan keadaan (atribut/properti) suatu sistem, sekaligus menawarkan layanan untuk memanipulasi keadaan tersebut (fungsi). Controller

26 91 class diagram menggambarkan class diagram untuk controller, seperti yang divisualisasikan pada gambar. ProdukDetail +idprodukdetail +Size +berat +stock +idproduk +read() +insert() +update() +delete() * 1 Produk +idproduk +NamaProduk +bahan +warna +Harga +Diskon +idkategoriproduk +read() +insert() +update() +delete() TransaksiDetail 1 * +idtransaksidetail +idprodukdetail +Size +Harga +Qty +EstimasiTotal +Diskon +total +subtotal +Idtransaksi * 1 * 1 +read() +insert() +delete() KategoriProduk +idkategori +NamaKategori +read() +insert() +delete() Transaksi +idtransaksi +TglTransaksi +idkonsumen +NamaDepan +NamaBelakang +Alamat +idprovinsi +IdKota +KodePos +Telp +BiayaKirim +BiayaPemesanan +JenisPembayaran +Id_JNE_Tracking +status +read() +insert() +update() 1 * * 1 KonfirmasiPembayaran +idkonfirmasipembayaran +TglKonfirmasi +No.Rekening +NamaBank +NamaPemilikBank +Nominal +Bank tujuan transfer +idtransaksi +idkonsumen +insert() +Update() UserMember +idkonsumen +NamaPanggilan + +password +read() +insert() +update() +delete() * 1 1 * Comment +IdComment +Comment +tanggal +IdKonsumen +Read() +Insert() +Update() Gambar 4.30 Class Diagram Object Diagram Diagram objek dalam Unified Modeling Language (UML), adalah diagram yang menunjukkan pandangan yang lengkap atau sebagian dari struktur suatu model sistem pada waktu tertentu. Diagram Object pada khusus mengatur tentang objek contoh dan atribut, dan hubungan antara contoh. Sebuah berkorelasi set diagram objek memberikan wawasan tentang bagaimana pandangan wewenang dari sistem diharapkan untuk berevolusi dari waktu ke waktu. Diagram objek lebih konkrit dari diagram kelas, dan sering digunakan untuk memberikan contoh, atau bertindak sebagai uji kasus untuk diagram kelas. Hanya aspek-aspek dari model yang menarik saat ini perlu ditampilkan pada diagram objek.

27 92 ProdukDetail +idprodukdetail: 1001_41 +Size: 41 +berat: 1 Kg +stock: 1 +idproduk: 1001 Produk +idproduk: NamaProduk: Nike Bruin +bahan: Leather/suede +warna: Black/mint/swan +Harga: Diskon: 0 +idkategoriproduk: 41 TransaksiDetail +idtransaksidetail: 51 +idprodukdetail: 1001_41 +Size: 41 +Harga: Qty: 1 +EstimasiTotal: Diskon: 0 +total: subtotal: Idtransaksi: KategoriProduk +idkategori: 41 +NamaKategori: NIKE SB Transaksi +idtransaksi: TglTransaksi: idkonsumen: 12 +NamaDepan: reza +NamaBelakang: william +Alamat: JL.bogor No 2 Bandung +idprovinsi: 11 +IdKota: KodePos: Telp: BiayaKirim: BiayaPemesanan: JenisPembayaran: Transfer +Id_JNE_Tracking: status: sukses Comment KonfirmasiPembayaran +idkonfirmasipembayaran: 1 +TglKonfirmasi: No.Rekening: NamaBank: mandiri +NamaPemilikBank: reza +Nominal: Bank tujuan transfer: BANK MANDIRI +idtransaksi: idkonsumen: 12 UserMember +idkonsumen: 12 +NamaPanggilan: reza william + rezawilliamhajj@yahoo.com +password: ****** +IdComment: - +Comment: - +tanggal: - +IdKonsumen: - Gambar 4.31 Object Diagram Component Diagram Component diagram menggambarkan struktur dan hubungan antar komponen piranti lunak, termasuk ketergantungan (dependency) di antaranya. Component Diagram yang ada terbagi menjadi 3 komponen yaitu Componen Diagram Administrator Web, Component Diagram Member dan Componen Diagram Non Member.

28 93 a. Component Diagram Administrator Website Login Admin halaman utama administrator Daftar Comment Daftar kategori produk Daftar produk Daftar customer Daftar transaksi Daftar konfirmasi pembayaran Edit account Edit harga dolar Biaya pengiriman Sign out Gambar 4.32 Component Diagram Administrator Website b. Component Diagram Non Member halaman utama web Lihat produk About Help Sign up Detail produk Cara pembelian keranjang cara pembayaran Retur pembelian Seputar pertanyaan Kntak kami Gambar 4.33 Component Diagram Non Member

29 94 c. Component Diagram Member halaman utama web Lihat produk About Help testimonial Log in Detail produk Cara pembelian My account Log out keranjang cara pembayaran konfirmasi pembayaran Retur pembelian Riwayat pembelian Seputar pertanyaan edit acoount Kntak kami edit alamat Gambar 4.34 Component Diagram Member Deployment Diagram Diagram ini memperlihatkan pemetaan software kepada hardware. Diagram ini menggambarkan detail bagaimana komponen deployment dalam infrastruktur system. web browser Internet explorer mozilla Firefox Web Server Apache HTML PHP Framework CSS Database Server MySQL Database Gambar 4.35 Deployment Diagram