bab iv rancangan sistem dan program usulan

(1)

4.1. Analisis Kebutuhan Software A. Tahapan Analisis

Sistem pemesanan tas online berbasis web dimana penjual dan pembeli tidak bertatap muka secara langsung. Calon pembeli melakukan pemesanan tas melalui media browser. Berikut ini spesifikasi kebutuhan (system requirement) dari sistem e-commerce.

Halaman Front-page:

A.1. User dapat memilih barang yang akan dibeli dan ditambahkan ke keranjang belanja.

A.2. User dapat melakukan konfirmasi pembayaran.

A.3 Sistem dapat melakukan kalkulasi jumlah pemesanan dan total pembelian.

A.4. User dapat melakukan checkout Halaman Admin:

B.1. Admin dapat mengelola data produk tas.

B.2. Admin dapat mengelola data transaksi pemesanan tas.

B.3. Admin dapat menyaring pesan yang masuk.

B.4. Admin dapat membuat laporan pemesanan tas.

20

(2)

B. Use Case Diagram

Use case diagram adalah deskripsi fungsi dari sebuah sistem perspektif pengguna. Use case terdiri dari sekumpulan skenario yang dilakukan oleh seorang actor

1. Use Case Diagram Belanja Online Halaman User

Gambar IV.1.

Use Case Diagram Belanja Online Halaman User Tabel IV.1

Deskripsi Use Case Diagram Belanja Online Halaman User

Use Case Name Checkout

Requirements A.2, A.3, A.4, A.5 Goal

User dapat melakukan pembelian secara online via web

Pre-Conditions User memilih barang

Post-Conditions -

Failed end Conditions

User membatalkan checkout, kemungkinan user ingin menambah barang kembali atau membatalkan pembelian.

Primary Actors User

Main Flow/Basic Path

1) User memilih icon checkout.

2) System menampilkan rincian belanja.

3) User memasukan alamat pengiriman dan melanjutkan.

4) System menampilkan pilihan metode pembayaran.

5) User memilih metode pembayaran dan melanjutkan.

6) System memproses penjualan dan mengirimkan rincian penjualan ke email user.

Invariant A: -

(3)

Gambar IV.2.

Use Case Diagram Penjualan Online Halaman Admin Tabel IV.2

Deskripsi Use Use Case Diagram Pemesanan Online Halaman Admin Use Case Name Mengelola Data Barang

Requirements -

Goal -

Pre-Conditions - Post-Conditions - Failed end Conditions - Primary Actors - Main Flow/Basic Path -

Alternate

Flow/Invariant A

A.2. Admin mengetikkan nama barang atau kode barang

A.3. Admin memilih tombol “Search”

A.2. System menampilkan data barang yang dicari.

A.2.Admin memilih tombol “Edit”

A.2.System menampilkan form data barang.

A.2.Admin mengedit data barang.

Invariant B:

B.2. Admin memilih barang.

B.3.Admin memilih tombol hapus.

B.4. System menampilkan dialog konfirmasi penghapusan.

B.5. Admin memilih tombol “YES”

B.6. System menghapus data barang.

(4)

C. Activity Diagram

1. Activity Diagram Belanja Online Halaman Front Page

Gambar IV.3.

Activity Diagram Belanja Online Halaman Front Page

2. Activity Diagram Belanja Online Halaman Admin

Gambar IV.4.

Activity Diagram Belanja Online Halaman Admin

(5)

Pada tahapan ini akan menjelaskan tentang desain database, desain software architecture, dan desain interface dari sistem yang sedang dibuat.

4.2.1. Database

Menggambarkan hubungan antar tabel yang dibuat beserta relasi antar tabel. Dalam penggambarannya penulis menggunakan ERD (Entity Relationship Diagram) dan spesifikasi filenya.

1. Entity Relationship Diagram

Entity Relationship Diagram atau diagram hubungan entitas dari sistem penjualan yang diusulkan berfungsi untuk menggambarkan model basis data yang akan dipakai. Model basis data yang digunakan adalah basis data relasional, dimana setiap entitas saling memiliki hubungan dengan entitas lain. Entitas dan hubungan yang digambarkan dalam model ERD tersebut nantinya akan dipakai untuk merancang basis data sistem penjualan. Berikut ERD sistem usulan :

Gambar IV.5.

Diagram ERD

(6)

2. Logical Record Structure

Gambar IV.6.

Logical Record Structure Penjualan Online

3. Spesifikasi File

Spesifikasi file yang terdiri dari tabel-tabel yang terintegrasi pada database rolex group data tersebut diproses untuk mendapatkan hasil yang menunjang sistem kerja yang diinginkan. Adapun penjelasan dan spesifikasi file tersebut adalah sebagai berikut :

a. Spesifikasi File Tabel Customers Nama Database : toko

Nama File : customers

Akronim : customers.myd

Tipe File : File Master

Akses File : Random Access File Panjang Record : 224 byte

Kunci Field : id konsumen

(7)

Tabel IV.3

Spesifikasi File Tabel Customers

No Elemen Data Nama Field Type Size Keterangan

(collation)

1 Id konsumen id konsumen Varchar 13 Primary

Key

2 Nama Nama Varchar 50

3 Alamat Alamat Text

4 Propinsi Propinsi Varchar 50

5 Kota Kota Varchar 50

6 Kodepos Kodepos Varchar 5

7 Phone Phone Varchar 20

8 Email Email Varchar 50

9 Nama_bank nama_bank Varchar 40

10 Cabang Cabang Varchar 40

11 Atas_nama atas_nama Varchar 50

12 Rekening Rekening Varchar 20

b. Spesifikasi File Tabel Orders Nama Database : toko

Nama File : orders

Akronim : orders.myd

Akses File : Random Access File Panjang Record : 547byte

(8)

Kunci Field : no_faktur

Tabel IV.4

Spesifikasi File Tabel Orders

(collation)

1 No_faktur no_faktur Varchar 13 Primary Key

2 Idkonsumen idkonsumen Varchar 13

3 Id_product id_product Int 11

4 Jumlah Jumlah Int 5

5 Subtotal Subtotal Double

6 Tanggal Tanggal Date

7 Status Status Varchar 1

c. Spesifikasi File Tabel Carts Nama Database : toko Nama File : carts

Akronim : carts.myd

Kunci Field :

(9)

Tabel IV.5

Spesifikasi File Tabel Carts

(collation)

1 Id Id Int 5

2 Nofaktur Nofaktur Varchar 13

3 Jumlah jumlah Int 3

4 Id_product id_product Int 11

5 Subtotal subtotal Double

d. Spesifikasi File Tabel Categories Nama Database : toko

Nama File : categories

Akronim : categories.myd

Kunci Field : no

Tabel IV.6

Spesifikasi File Categories

1 Id Id_category Int 11

2 Category Category Varchar 30

e. Spesifikasi File Tabel Product Nama Database : toko

(10)

Nama File : product

Akronim : product.myd

Kunci Field : id_produk

Tabel IV.7

Spesifikasi File Tabel Product

(collation)

1 Id_product id_product Int 11 Primary Key

2 Id_category id_category Int 11

3 Nama Nama Varchar 100

4 Id_merk id_merk Int 11

5 Gambar gambar Text

6 Harga harga Double

7 Stok Stok Int 5

8 Spesifikasi spesifikasi Text

9 Keterangan keterangan Text

10 Tanggal_masu k

tanggal_masu k

Datetim e

4.2.2. Software Architecture A. Component Diagram

(11)

piranti lunak, termasuk ketergantungan diantaranya. Component Diagram juga dapat berupa interface yang berupa kumpulan layanan yang disediakan oleh komponen untuk komponen lainnya.

Gambar IV.7 Component Diagram

B. Deployment Diagram

(12)

deployment Deployment

Workstation

Windows 7 Mozilla Firefox

WebServer

Apache

Database Server

PHP

Deployment diagram menyediakan gambaran bagaimana sistem secara fisik akan terlihat. Sistem terdiri dari node-node dimana setiap node diwakili untuk sebuah kubus. Garis yang menghubungkan antara 2 kubus menunjukkan hubungan diantara kedua node tersebut. Berikut gambaran deployment diagram.

Gambar IV.8 Deployment Diagram

4.2.3. User Interface

Menggambarkan tampilan program dari sistem usulan.

a. Halaman Home

Gambar IV.9 Tampilan Halaman Home b. Halaman Tentang Kami

(13)

Gambar IV.10 Tampilan Tentang Kami c. Halaman Komentar

\

Gambar IV.11

Tampilan Halaman Komentar

(14)

d. Halaman Produk

Gambar IV.12 Tampilan Halaman Produk e. Halaman invoice online

Gambar IV.13

Tampilan Halaman Invoice Online

(15)

f. Halaman Login Admin

Gambar IV.14

Tampilan Halaman Login Admin

g. Halaman Beranda Admin

(16)

s Gambar IV.15

Tampilan Halaman Beranda Admin h. Halaman Produk Admin

Gambar IV.16

Tampilan Halaman Produk Admin i. Halaman Struk Pemesanan

(17)

Tampilan Halaman Daftar Pemesanan

j. Halaman Laporan

Gambar IV.18

Tampilan Halaman Laporan

4.3. Code Generation

Dalam program ini penulis menggunakan code generation permrograman terstrusktur. Pada tahapan ini penulis menampilkan listing program pada form yang terkait.

A. Listing Indeks

<?php $this->element('rupiah'); ?>

(18)

<tr>

Produk Baru </font> </h3>

<?php

foreach ($products as $product):

$gambar = $product['Product']['gambar'];

$nama = $product['Product']['nama'];

?>

<tr>

<?php

echo $this->Html->image("products/$gambar", array ('width' => 75, 'height' => 75)); ?></td>

<td valign="top"> <?php echo $this->Html-

>link($nama, array('action' => '../products/view', $product['Product']

['id_product'])); ?> <br>

Rp. <?php echo rupiah($product['Product']['harga']);

?> </td>

</tr>

</table>

<?php endforeach; ?>

</td>

(19)

color="#0000FF"> Promo Baru </font> </h3>

<?php

foreach ($promotions as $promotion):

$keterangan = $promotion['Promotion']['keterangan'];

$keterangan = substr ($keterangan, 0, 250);

$promo = $promotion['Promotion']['nama'];

?>

<tr>

<td align="justify"> <?php echo $this-

>Html->link($promo, array('action' => '../promotions/view',

$promotion['Promotion']['id'])); ?> <br>

<?php echo $keterangan; ?>

</td>

</tr>

</table>

</td>

</tr>

</table>

<table>

(20)

<tr>

BEST PRODUCTS </font> </h4> </td>

</tr>

<?php

$kolom = 2;

$i = 0;

foreach($orders as $order):

$image = $order['Product']['gambar'];

$isi = $order['Product']['spesifikasi'];

$isi = substr ($isi, 0, 250);

$harga = $order['Product']['harga'];

if ($i >= $kolom) { echo "<tr></tr>";

$i = 0;

}

$i++;

?>

<?php echo $this->Html->link($order['Product']['nama'], array('action' => '../products/view', $order['Product']['id_product'])); ?>

</div>

(21)

<tr>

<?php echo $this->Html-

>image("products/$image", array ('width' => 75, 'height' => 75)); ?>

</td>

</tr>

</table>

</td>

</table>

B. Listing Produk

<tr>

<th width=30> <?php echo $paginator->sort('id_product'); ?></th>

<th width=80> <?php echo $paginator->sort('id_category'); ?> </th>

<th width=150> <?php echo $paginator->sort('product'); ?> </th>

<th width=60> <?php echo $paginator->sort('harga'); ?> </th>

(22)

<th colspan=3> Action </th>

</tr>

<?php

foreach ($products as $product):

?>

<tr>

<td width=50 align=center> <?php echo $form->Html->link('View', array('action' => 'view', $product['Product']['id_product'])); ?> </td>

<td width=50 align=center> <?php echo $form->Html->link('Edit', array('action' => 'edit', $product['Product']['id_product'])); ?> </td>

<td width=50 align=center> <?php echo $form->Html->link('Delete', array('action' => 'delete', $product['Product']['id_product']), null, 'Are you sure you want to delete this product?'); ?> </td>

</tr>

</table>

<?php echo $this->element('paging'); ?>

C. Listing Login Admin

(23)

<tr>

<font color="#0033CC" size="3" face="Tahoma">Selamat Datang</font>

<font color="#0033CC"

size="2"><br>...

...</font></p>

</td>

</tr>

<tr>

<td width="90%" align="justify"><font face="Tahoma" size="2">Hai

<strong>Administrator</strong>, selamat datang di halaman Administrator website toko rolex group.

Silahkan klik menu pilihan yang berada di sebelah kiri untuk mengelola content website.</font></td>

</tr>

</table>

4.4. Testing

Toko Rolex Group telah menggunakan sistem web aplikasi penjualan online dimana produk disana sudah bisa dibeli secara online. Sistem disini harus

(24)

bisa menampilkan informasi pemesanan tas pada Toko Rolex Group secara online.

1. Pengujian Form Login Admin

Penulis menguji form pemesanan tas agar costumer bisa memilih dan memesan jenis-jenis tas yang ditampilkan pada sistem pemesanan di Toko Rolex Group

Tabel IV.14

Hasil Pengujian Black Box Testing Form Login Admin

No Skenario Pengujian Testcase Hasil yang di harapkan Hasil Pengujian Kesimpulan

1 Mengisi data username dan mengosongkan data password

Username: admin Password: (kosong)

Login gagal, Username dan Password Anda tidak bener

Sesuai Harapan Valid

2 Mengisi data password dan mengosongkan data username

Username: admin Password: admin

Login benar, Username dan Password Anda benar

Sesuai Harapan Valid

4.5. Support

4.5.1. Publikasi Web

Publikasi web portal Toko Rolex Group dilakukan dengan mempromosikan situs ke search engine (mesin pencari) local maupun dunia sehingga mempermudah masyarakat umum ataupun pihak-pihak yang berminat untuk mengetahui lebih jauh dan detail.

1. Nama Domain

(25)

pada www. dapurhosting .com yaitu salah satu web hosting yang cukup terjangkau dan handal telah banyak dipergunakan oleh pembuat web untuk menguji coba hasil karyanya.

Setelah mencoba mendaftar, telah didapatkan domain names sebagai berikut : www.rolex-group.com

2. Kapasitas Hosting

Kapasitas hosting yang penulis dapakan pada penggunaan web hosting ini sebesar 300 MB disk free untuk file, 50 MB MySQL space untuk penyimpanan database dan 1 GB bandwith.

4.5.2. Spesifikasi Hardware dan Software A. Spesifikasi Hardware

Perangkat keras yang dimaksud disini adalah seperangkat alat atau elemen elektronik yang dapat membantu sistem yang diusulkan sehingga program yang diusulkan oleh penulis dapat bekerja dengan baik.

Adapun perangkat keras minimal yang diperlukan adalah sebagai berikut : 1. Processor : Intel Core B960

2. Memory Size (RAM) : 2GB DDR3

3. Monitor : 14.0”

4. Harddisk : 320 GB

5. Keyboard : Standart Keyboard

6. Mouse : Standard Mouse

7. Printer : Canon

(26)

B. Spesifikasi Software

Perangkat lunak adalah suatu rangkaian atau susunan instruksi yang harus benar dengan urutan-urutan yang benar pula. Keberadaan perangkat lunak selalu menyertai perangkat lunak yang ada.

Adapun perangkat lunak minimal yang diperlukan adalah sebagai berikut : 1. Sistem Operasi : Microsoft Windows 7

2. Program Aplikasi : Macromedia Dreamweaver 8 MySQL, PHP

4.6. Spesifikasi Dokumen Sistem Usulan

Merupakan semua bentuk dokumen yang terlibat dengan system yang dibahas. Adapun sistem usulan yang penulis buat yaitu sebagai berikut :

1. Nama Dokumen : Invoice Online

Fungsi : Sebagai bukti transaksi pemesanan tas

Sumber : Admin

Tujuan : Customers

Media : Tampilan

Frekuensi : Setiap terjadi transaksi pemesanan

Format : Lampiran B.1

2. Nama Dokumen : Laporan Pemesanan

Fungsi : Sebagai bukti laporan

Sumber : Admin

(27)

Media : Tampilan

Frekuensi : Setiap laporan hasil penjualan

Format : Lampiran B.2