24 BAB III PEMBAHASAN 3.1 Analisa Kebutuhan Dalam kesempatan ini penulis membuat sebuah website yang bertujuan untuk memberikan informasi mengenai perlengkapan bayi yang dijual pemilik kepada calon pembeli sehingga mempermudah calon pembeli untuk mendapatkan barang yang mereka inginkan. Penulis berharap dengan membaca setiap informasi yang di muat dalam website ini, para pengunjung web nantinya bisa mendapatkan gambaran mengenai perlengkapan bayi yang dijual. Bagi para calon pembeli bisa mendaftar dulu sebagai member untuk memudahkan proses transaksi, tapi juga bisa untuk hanya sekedar melihat lihat berbagai macam perlengkapan bayi yang ada di dalam website. Jika mereka minat, pasti mereka langsung memilih dan membelinya, namun bila sebaliknya pasti mereka akan meninggalkan website tersebut. Sedangkan bagi para pelanggan yang sudah mendaftar sebagi member bisa langsung memilih perlengkapan bayi yang mereka butuhkan kemudian melakukan transaksi di dalam website ini, setelah itu mereka juga dapat memberikan testimonial untuk menanyakan seputar perlengkapan bayi yang di jual atau sebagai kesan mereka terhadap proses transaksi yang sedang berjalan di dalam website ini.
25 3.2 Peracangan Perangkat Lunak 3.2.1 Rancangan Antar Muka Spesifikasi perangkat lunak ini merupakan langkah awal dari pengolah sebuah data untuk melakukan sebuah proses untuk menghasilkan sebuah output yang diinginkan. Adapun spesifikasi antar muka sebagai berikut: A. Spesifikasi Halaman Admin 1. Spesifikasi Rancangan Halaman Login Admin. Header Isi Footer Keterangan : Gambar III.1. Rancangan Halaman Login Admin Nama Program Akronim Fungsi Bahasa Program : Login : login.php : Untuk masuk ke halaman menu ke halaman utama admin : PHP Tampilan Program : Gambar III.16 Proses 1. Ketiklah alamat website (URL) : http://localhost/perlengkapan_bayi2/admin/ pada
26 address bar. Maka akan masuk ke halaman index. 2. Pada menu login masukkan username dan password, jika berhasil maka akan langsung ke halaman home admin. 2. Spesifikasi Rancangan Halaman Home Admin. Header Admin Produk Kategori Laporan Logout Footer Gambar III.2. Rancangan Halaman Home Admin Keterangan : Nama Program Akronim Fungsi Bahasa Program : Home : home.php : Sebagai awal halaman home admin. : PHP Tampilan Gambar : Gambar III.17 Proses :
27 Ketika mengklik login pada halaman awal, maka akan tampil halaman admin didalamnya terdiri dari menu Admin, Produk, Kategori, Laporan, Logout yang terdapat pada bagian kiri halaman. 3. Spesifikasi Rancangan Halaman Admin Header Admin Menu Admin Produk Kategori Username : Laporan Password : Logout Tabel Menu Admin Footer Keterangan : Gambar III.3. Rancangan Halaman Admin. Nama Program Akronim Fungsi Bahasa Program : Admin : admin.php : Mengubah password admin : PHP Tampilan Program : Gambar III.18 Proses :
28 1. Klik link admin,maka tampil ke halaman menu admin dengan tampilan daftar admin. 2. Untuk mengubah password admin,klik icon ubah password. Kemudian klik simpan. 4. Spesifikasi Rancangan Halaman Menu Produk Header Admin Menu Produk Produk Kategori Laporan Form Menu Produk Logout Footer Gambar III.4. Rancangan Halaman Menu Produk Keterangan : Nama Program Akronim Fungsi : Halaman Tambah Menu Produk : produk.php : Menambah, mengedit dan menghapus data produk yang sudah ada. Bahasa Program : PHP
29 Tampilan Program : Gambar III.19 Proses : 1. Klik link menu produk, maka tampil ke halaman menu produk dengan tampilan tambah produk. 2. Untuk menambahkan data kategori, isikan gambar dan keterangan di tambah. kemudian klik simpan. 3. Data produk telah tersimpan, lihat di bawah tambah menu produk yang terdapat daftar menu produk untuk melihat semua data-data produk. Di daftar produk tersebut ada edit dan hapus data produk. 5. Spesifikasi Rancangan Halaman Menu Kategori. Header Admin Menu Kategori : Produk Kategori Kategori : Laporan Logout Tabel Kategori Footer Gambar III.5. Rancangan Halaman Menu Kategori
30 Keterangan : Nama Program Akronim Fungsi Bahasa Program : Menu Kategori : kategori.php : Untuk menambah, menghapus, mengedit kategori : PHP Tampilan Program : Gambar III.20 Proses : Klik link menu kategori, maka akan tampil ke halaman kategori dengan tampilan table menu kategori. 7. Spesifikasi Rancangan Halaman Laporan Header Admin Produk Kategori Laporan Logout Table Menu Laporan Footer Gambar III.6. Rancangan Halaman Laporan
31 Keterangan : Nama Program Akronim Fungsi : Halaman Menu Laporan : laporan.php : Untuk mendownload setiap laporan yang sudah terlaksana. Bahasa program : PHP Bentuk Tampilan : Gambar III.21 Proses : 1. Kilik link laporan, maka tampil ke halaman laporan dengan tampilan download laporan. 2. Untuk mendapatkan hasil laporan transaksi. Kemudian klik gambar PDF. 8. Spesifikasi Halaman Menu Logout Header Admin Produk Kategori Laporan Logout Footer Gambar III.7. Rancangan Logout / Keluar
32 Keterangan : Nama Program Akronim Fungsi : Halaman keluar : logout.php : Untuk keluar dari halaman admin Bahasa Program : PHP Bentuk Lampiran : Gambar III.22 Proses : Klik logout maka akan keluar dari halaman admin dan kembali ke halaman Login.
33 B. Spesifikasi Rancangan Halaman user 1. Spesifikasi Rancangan Halaman Home Header Home Product Cara Order Download About Us Contact Us User : Slider.. Keranjang Belanja : Password : Kategori : Isi Home Best Sellers : News : Gambar III.9. Testimonial : Informasi : Rancangan Halaman Home Footer Keterangan : Gambar III.8. Rancangan Halaman Home Nama Program Akronim Fungsi Bahasa Program : Halaman Home : index.php : Untuk menampilkan halaman home website. : PHP
34 Tampilan Program : Proses : Untuk menampilkan halaman home, klik menu Home yang terdapat pada pilihan menu. 2. Spesifikasi Rancangan Halaman Product. Header Home Product Cara Order Download About Us Contact Us User : Slider.. Keranjang Belanja : Password : Kategori : Isi Product Best Sellers : News : Testimonial : Informasi : Gambar III.10. Rancangan Halaman Footer Product. Gambar III.9. Rancangan Halaman Produk
35 Keterangan : Nama Program Akronim Fungsi Bahasa Program : Halaman Product : produk.php : Untuk menampilkan halaman product di website. : PHP Tampilan Program : Proses : Untuk menampilkan halaman product, klik menu Product yang terdapat pada pilihan menu.
36 3. Spesifikasi Rancangan Halaman Cara Order. Header Home Product Cara Order Download About Us Contact Us User : Belanja : Password : Slider.. Isi Cara Order Keranjang Kategori : Best Sellers : News : Testimonial : Informasi : Footer Keterangan : Gambar III.10. Rancangan Halaman Cara Order. Nama Program Akronim Fungsi Bahasa Program : Halaman Cara Oder : caraorder.php : Untuk menampilkan halaman cara order di website. : PHP Tampilan Program :
37 Proses : Untuk menampilkan halaman cara order, klik menu Cara Order yang terdapat pada pilihan menu. 4. Spesifikasi Rancangan Halaman Download. Header Home Product Cara Order Download About Us Contact Us User : Slider.. Keranjang Belanja : Password : Kategori : Isi Download Best Sellers : News : Testimonial : Informasi : Footer Gambar III.11. Rancangan Halaman Download.
38 Keterangan : Nama Program Akronim Fungsi Bahasa Program : Halaman Download : download.php : Untuk menampilkan halaman download di website. : PHP Tampilan Program : Proses : Untuk menampilkan halaman download, klik menu Download yang terdapat pada pilihan menu.
39 5. Spesifikasi Rancangan Halaman About Us. Header Home Product Cara Order Download About Us Contact Us User : Slider.. Keranjang Belanja : Password : Kategori : Isi About Us Best Sellers : News : Testimonial : Informasi : Footer Keterangan : Gambar III.12. Rancangan Halaman About Us. Nama Program Akronim Fungsi Bahasa Program : Halaman About Us : about.php : Untuk menampilkan halaman about us di website. : PHP
40 Tampilan Program : Proses : Untuk menampilkan halaman about us, klik menu About Us yang terdapat pada pilihan menu. 6. Spesifikasi Rancangan Halaman Contact us. Header Home Product Cara Order Download About Us Contact Us User : Slider.. Keranjang Belanja : Password : Kategori : Isi Contact Us Best Sellers : News : Gambar III.14. Testimonial : Rancangan Halaman Contact Informasi Us. : Keterangan : Footer Gambar III.13. Rancangan Halaman Contact Us
41 Nama Program Akronim Fungsi Bahasa Program : Halaman Contact Us : contact.php : Untuk menampilkan halaman contact us di website. : PHP Tampilan Program : Proses : Untuk menampilkan halaman contact us. 3.2.2. Rancangan Basis Data A. Entity Relationship Diagram Entity Relationship Diagram merupakan notasi grafis dalam pemodelan data konseptual yang mendeskripsikan hubungan antara penyimpanan. Entity Relationship Diagram digunakan untuk memodelkan struktur data dan hubungan antar data, karena hal ini realtif kompleks.
42 Alamat Id Alamat Nama Nama Telepon Nama Email Id Email 1 1 1 M Member Baru Punya Pelanggan Punya Testimonial Re- Password Password User Harga Email Stok Kategori Gambar Ukuran Password 1 Punya M Barang M Punya Telepon Username Id Nama Deskripsi Warna Testimonial Tanggal M Notransaksi Username Transaksi Password M Punya Sub Total Jumlah 1 Notransaksi Transaksi Rinci Id Nama Harga Username Gambar III.14. Rancangan Entity Relationship Diagram (ERD) B. Logical Relationship Structure (LRS) Logical Relationship Structure dibentuk dengan nomor dari tipe record. Beberapa tipe record digambarkan oleh kotak empat persegi panjang dan dengan nama yang unik. Beda LRS dengan Entity Relationship Diagram nama tipe record diluar kotak field tipe record ditempatkan.
43 Member Baru Pelanggan Nama Alamat Telepon Email User Password Re-Password 1 1 Id Nama Alamat Email Telepon Username Password 1 1 M Testimonial Id Nama Email Tanggal Testimonial Id Nama Email Detail 1 Barang M Id Nama Deskripsi Warna Ukuran Kategori Harga Stok Gambar M 1 Transaksi Id Notransaksi Username Password M 1 Transaksi Rinci Notransaksi Username Id Nama Harga Jumlah Sub Total 1 Gambar III.15. Rancangan Logical Relationship Structure (LRS)
44 C. Spesifikasi File Dalam aplikasi ini menggunakan satu buah file database dengan nama perlengkapan_bayi2, dengan 11 table diantaranya yaitu : 1. Spesifikasi File Admin Nama File Akronim Fungsi Tipe File Organisasi File Akses File Media Panjang Record Kunci File Software : Admin : admintbl : Untuk menyimpan file admin : File Master : Indexed Sequential : Random : Hardisk : 46 karakter : id : MySQL Tabel III.1. Spesifikasi File Admin No Elemen Data Nama Field Tipe Size Keterangan 1. Id Id Int 11 Primary Key 2. Username Username Varchar 35
45 3. password Password Text 2. Spesifikasi File Barang Nama File : Barang Akronim Fungsi Tipe File Organisasi File Akses File Media Panjang Record Kunci File Software : barangtbl : Untuk menyimpan file barang : File Master : Indexed Sequential : Random : Hardisk : 183 karakter : id : MySQL Tabel III.2. Spesifikasi File Barang No Elemen Data Nama Field Tipe Size Keterangan 1. Id Id Int 11 Primary Key 2. nama nama Varchar 35 3. Deskripsi Deskripsi Text 4. Warna Warna Varchar 25
46 5. Ukuran Ukuran Varchar 15 6. Kategori Kategori Varchar 25 7. harga harga Int 11 8. Stock Stock Int 11 9. gambar gambar Varchar 50 3. Spesifikasi File Testimonial Nama File Akronim Fungsi Tipe File Organisasi File Akses File Media Panjang Record Kunci File Software : Testimonial : testimonialtbl : Untuk menyimpan file testimonial : File Master : Indexed Sequential : Random : Hardisk : 149 karakter : notransaksi : MySQL
47 Tabel III.3. Spesifikasi File Tetimonial No Elemen Data Nama Field Tipe Size Keterangan 1. Notransaksi Notransaksi Varchar 25 Primary Key 2. Username Username Varchar 20 3. Id Id Int 11 4. Nama Nama Varchar 60 5. Harga Harga Int 11 6. Jumlah Jumlah Int 11 7. Subtotal Subtotal Int 11 4. Spesifikasi File Super Admin Nama File Akronim Fungsi Tipe File Organisasi File Akses File Media Panjang Record Kunci File Software : Super Admin : testimonialtbl : Untuk menyimpan file super admin : File Master : Indexed Sequential : Random : Hardisk : 91 karakter : id : MySQL
48 Tabel III.4. Spesifikasi Super Admin No Elemen Data Nama Field Tipe Size Keterangan 1. Id Id Int 11 2. Username Username Varchar 20 3. password password Text 5. Spesifikasi File Transaksi Nama File Akronim Fungsi Tipe File Organisasi File Akses File Media Panjang Record Kunci File Software : Transaksi : transaksitbl : Untuk menyimpan file transaksi : File Master : Indexed Sequential : Random : Hardisk : 32 karakter : notransaksi : MySQL
49 Tabel III.5. Spesifikasi Transaksi No Elemen Data Nama Field Tipe Size Keterangan 1. Notransaksi Notransaksi Int 11 Primary Key 2. Username Username Varchar 20 3. Status Status Tinyint 1 6. Spesifikasi File Transaksi Rinci Nama File Akronim Fungsi Tipe File Organisasi File Akses File Media Panjang Record Kunci File Software : Transaksi Rinci : transaksirincitbl : Untuk menyimpan file transaksi rinci : File Master : Indexed Sequential : Random : Hardisk : 149 karakter : notransaksi : MySQL
50 Tabel III.6. Spesifikasi Transaksi Rinci No Elemen Data Nama Field Tipe Size Keterangan 1. Notransaksi Notransaksi Varchar 25 Primary Key 2. Username Username Varchar 20 3. Id Id Int 11 4. Nama Nama Varchar 60 5. Harga Harga Int 11 6. Jumlah Jumlah Int 11 7. Subtotal Subtotal Int 11
51 3.2.3. Rancangan Struktur Navigasi A. Rancangan Struktur Navigasi pada Halaman User Menggunakan Struktur Navigasi Non-Linier Gambar III.16. Struktur Navigasi Halaman User
52 B. Rancangan Struktur Navigasi Halaman Admin Menggunakan Struktur Navigasi Non-Linier Gambar III.17. Struktur Navigasi Halaman Admin
53 3.3 Implementasi dan Pengujian Unit 3.3.1. Implementasi A. Implementasi Rancangan Antar Muka Implementasi rancangan antar muka pada aplikasi ini berdasarkan hasil rancngan antar muka diantaranya sebagai berikut : 1. Halaman Login Admin Admin harus melakukan login terlebih dahulu untuk dapat menngunakannya. Jika login berhasil, maka admin akan masuk kehalaman admin dan dapat langsung menggunakan sesuai dengan kebutuhan. Gambar III. 18. Gambar Halaman Login Admin
54 2. Halaman Home Admin Ketika sudah berhasil masuk tanpa ada kesalahan saat memasukan username dengan password akan muncul tampilan home admin, sebagai tampilan halaman. Gambar III. 19. Gambar Halaman Home Admin
55 3. Halaman Admin Admin dapat mengubah password di halaman admin ini. Gambar III. 20. Gambar Halaman Admin
56 4. Halaman Produk Admin dapat menambahkan produk-produk baru dan admin juga dapat mengubah/mengedit atau menghapus data produk yang sudah ada. Gambar III. 21. Gambar Halaman Menu Produk
57 5. Halaman Kategori Admin dapat menambahkan kategori-kategori baru dan admin juga dapat mengubah/mengedit atau menghapus data kategori yang sudah ada. Gambar III. 22. Gambar Halaman Menu Kategori
58 6. Halaman Menu Laporan Menu ini menyediakan data laporan setiap kegiatan yang berlangsung di dalam website. Gambar III.23. Gambar Halaman Laporan
59 7. Halaman Menu Logout Admin harus mengklik menu logout apabila ingin keluar dari halam admin. Gambar III. 24. Gambar Halaman Keluar
60 8. Halaman User Home Gambar III.25. Gambar Halaman User Home
61 9. Halaman Product Gambar III.26. Gambar Halaman Product
62 10. Halaman Cara Order Gambar III.27. Gambar Halaman Cara Order
63 11. Gambar Halaman Download Gambar III.28. Gambar Halaman Download
64 12. Gambar Halaman About Us Gambar III. 29. Gambar Halaman About Us
65 13. Gambar Halaman Contact Us Gambar III.30. Gambar Halaman Contact Us
66 C. Spesifikasi Sistem Komputer Berikut ini adalah spesifikasi perangka keras dan perangkat lunak minimum yang dibutuhkan untuk mengimplementasikan aplikasi e-commerce untuk perancangan sistem informasi penjualan perlengkapan bayi berbasis web. 1. Spesifikasi Perangkat Keras a. Server 1. CPU a. Processor Intel Core i3 3220 CPU b. RAM DDR3 4 GB c. Hard Disk 500 GB 2. Mouse 3. Keybord 4. Monitor dengan resolusi layar minimum 1024x768 5. Koneksi internet dengan kecepatan 7,2 Mbps b. Client 1. CPU a. Processor Intel Pntium 4 b. RAM DDR3 1 GB c. Hard Disk 250 GB 2. Mouse 3. Keybord
67 4. Monitor dengan layar minimum 1024x768 5. Koneksi internet dengan kecepatan 2 Mbps 2. Spesifikasi Perangkat Lunak 1. Server a. Microsoft Windows 7 Ultimate 32 bit b. Xamp, yang terdiri dari beberapa komponen, diantaranya : 1. Aplikasi Apache 1.6.4 (32-bit) 2. Aplikasi phpmyadmin v2. 11.1 3. Aplikasi MySQL v5.0.45 c. Google Chrome dan Mozilla Firefox 2. Client a. Microsoft Windows 7 Ultimate 32-bit b. Google Chrome dan Mozilla Firefox
68 3.3.2. Pengujian Unit A. Pengujian Terhadap Form Login Tabel III. 7. Hasil Pengujian Black-Box Testing Halaman Login No Skenario Pengujian Test Case Hasil yang di harapkan Hasil Pengujian Kesimpulan 1. Username dan Username: Sistem akan menolak password tidak di (kosong) dan menampilkan isi kemudian klik Password: Maaf username dan tombol login (kosong) password yang anda Sesuai harapan Valid input salah harap login kembali 2. Mengetikan Username: Sistem akan menolak username dan Lina dan menampilkan password salah (salah) Maaf username dan kemudian klik Password: password yang anda login. Rahman input salah harap login (salah) kembali Sesuai harapan Valid 3. Mengetikan Username Sistem menerima username dan : admin akses login dan password benar, (benar) kemudian langsung kemudian klik Password : menampilkan menu
69 login. admin utama. (benar) Sesuai harapan Valid B. Pengujian Terhadap Form Admin Tabel III. 8. Hasil Pengujian Blak-Bos Testing Halaman Admin No Skenario Pengujian Test Case Hasil yang diharapkan Hasil Pengujian Kesimpulan 1. Password lama Username Sistem akan menolak tidak sama dengan : Admin dan menampilkan Password lama Password password lama anda yang sebelumnya Lama : tidak sama harap isi kemudian klik admin dengan benar tombol Ubah (salah) Password baru : masuk Sesuai harapan Valid 2. Password lama Username Sistem akan menerima sama dengan : admin dan menampilkan password lama Pasword password berhasil
70 yang sebelumnya lama : diubah kemuadian tombol Ubah klik adminlogin (benar) Password baru : Lina Sesuai harapan Valid