bab iv rancangan sistem dan program usulan · b. use case diagram use case diagram administrator...

32
29 BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4.1 Analisa Kebutuhan Software Kebutuhan perangkat lunak merupakan kondisi kriteria, syarat atau kemampuan yang harus dimiliki oleh perangkat lunak untuk memenuhi apa yang disyaratkan atau diinginkan pemakai. A. Tahapan Analisis Sistem penjualan secara online berbasis web memungkinkan penjual dan pembeli melakukan transaksi jual-beli tanpa bertatap muka secara langsung. Calon pembeli dapat melakukan pembelian melalui media browser dan penjual dapat menerima order pembelian produk setiap waktu. Berikut ini spesifikasi kebutuhan system requirement dari sistem E-commerce : Halaman Pelanggan : A1. Pelanggan harus mengisi data member terlebih dahulu sebelum menjadi member. A2. Pelanggan dapat memilih produk karena telah menjadi member A3. Pelanggan memilih produk yang akan dibeli dan ditambahkan ke keranjang belanja A4. Pelanggan bisa melakukan pembayaran dan cetak bukti pembayaran Halaman Administrator : B1. Administrator dapat mengelola Kategori Produk B2. Administrator dapat mengelola Data Produk B3. Administrator dapat mengelola Order B4. Administrator dapat mengelola Laporan Penjualan B5. Administrator dapat mengelola Konfirmasi Pembayaran

Upload: dinhque

Post on 31-May-2019

288 views

Category:

Documents


1 download

TRANSCRIPT

29

BAB IV

RANCANGAN SISTEM DAN PROGRAM USULAN

4.1 Analisa Kebutuhan Software

Kebutuhan perangkat lunak merupakan kondisi kriteria, syarat atau kemampuan yang harus

dimiliki oleh perangkat lunak untuk memenuhi apa yang disyaratkan atau diinginkan pemakai.

A. Tahapan Analisis

Sistem penjualan secara online berbasis web memungkinkan penjual dan pembeli

melakukan transaksi jual-beli tanpa bertatap muka secara langsung. Calon pembeli dapat

melakukan pembelian melalui media browser dan penjual dapat menerima order

pembelian produk setiap waktu. Berikut ini spesifikasi kebutuhan system requirement dari

sistem E-commerce :

Halaman Pelanggan :

A1. Pelanggan harus mengisi data member terlebih dahulu sebelum menjadi member.

A2. Pelanggan dapat memilih produk karena telah menjadi member

A3. Pelanggan memilih produk yang akan dibeli dan ditambahkan ke keranjang belanja

A4. Pelanggan bisa melakukan pembayaran dan cetak bukti pembayaran

Halaman Administrator :

B1. Administrator dapat mengelola Kategori Produk

B2. Administrator dapat mengelola Data Produk

B3. Administrator dapat mengelola Order

B4. Administrator dapat mengelola Laporan Penjualan

B5. Administrator dapat mengelola Konfirmasi Pembayaran

30

B6. Administrator dapat mengelola Costumer

B7. Administrator dapat mengelola Inbox

B8. Administrator dapat mengelola SlideShow

B9. Administrator dapat mengelola Rekening Bank

B10. Administrator dapat mengelola Ongkos Kirim

B11. Administrator dapat mengelola Password

B. Use Case Diagram

Use Case Diagram Administrator

Gambar IV.1. Use Case Diagram Halaman Admin User

31

Tabel IV.1. Deskripsi Use Case Diagram Halaman Administrator

Use Case Name Use Case Diagram Admin User

Requirements B.1 – B.11

Goal Administrator dapat mengelola laporan penjualan serta produk-produk yang akan dijual

Pre-conditions Administrator akan mengelola data produk, kategori, order, konfirmasi pembayaran, dan membuat laporan

Post-conditions Administrator melakukan pengolahan data produk, transaksi dan membuat laporan

Failed end condition

Administrator salah memasukan username atau

password dan keluar dari sistem (log out)

Primary Actors Administrator

Main Flow/Basic Path

1. Administrator melakukan login 2 Administrator mengelola data produk 3. Administrator mengelola data transaksi 4. Administrator membuat laporan penjualan

Invariant A:

32

C. Activity Diagram

Activity Diagram Pembelian Produk

Gambar IV.2. Activity Diagram Pembelian Produk

33

Activity Diagram Login Administrator

Gambar IV.3. Activity Diagram Halaman Login

34

4.2 Desain

Pada tahap ini akan dijelaskan tentang desain database, desain software architecture, dan

desain interface.

4.2.1 Database

1. Entity Relationship Diagram

Berikut adalah Entity Relationship Diagram sistem usulan :

Kategorimemilikiproduk

id_produk

nama_produk

deskripsi

harga

stock

berat

tgl_masuk

gambargambar2

Mkustomer

id_kustomer

password

nama_lengkap

avatar

alamat

email

telpon

about

fbtw

hobi

Mmembeli

id_kustomer

id_produk

orders

id_orders

status_order

tgl_orderjam_order

alamat_tujuan

M

Melakukan

Memiliki

detail_orders Terdapat

id_produkid_orders

jumlah

Id_kategori Nama_kategori

N

1

N

M

1

1

M

Gambar IV.4. Entity Relationship Diagram Sistem Usulan

35

2. Logical Relational Structure

Gambar IV.5. Logical Relational Structure Sistem Usulan

36

3. Spesifikasi File

Untuk perancangan sistem informasi website-ecommerce Toko Galaxy Motor ini, penulis

membuat database dengan nama sparepart dengan spesifikasi file yang digunakan adalah

sebagai berikut :

1. Spesifikasi File Produk

Nama File : Produk

Akronim : produk.frm, produk.myi, produk.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 135 karakter

Media : Harddisk

Field kunci : id_produk

Software : MySQL

Tabel IV.1

Struktur Tabel Produk

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Produk id_produk Int 5 Primary Key

2 Id Kategori id_kategori Int 5 -

3. Nama Produk nama_produk Varchar 50 -

4. Deskripsi deskripsi Text - -

6. Harga harga Int 20 -

37

2. Spesifikasi File Kategori

Nama File : Tabel Kategori

Akronim : kategori.frm, kategori.myi, kategori.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 55 karakter

Media : Hardisk

Field kunci : id_kategori

Software : MySQL

Tabel IV.2

Struktur Tabel Kategori

3. Spesifikasi File Konfirmasi

No Elemen Data Nama Field Tipe Panjang Keterangan

6. Stok stocks Int 5 -

7. Berat berat Decimal - -

8. Tanggal Masuk tgl_masuk Date - -

9. Gambar Gambar Varchar 50 -

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Kategori id_kategori Int 5 Primary Key

2 Nama Kategori nama_kategori Varchar 50 -

38

Nama File : Konfirmasi

Akronim : konfirmasi.frm, konfirmasi.myi, konfirmasi.myd

Tipe file : FileTransaksi

Organisasi File : Random access

Panjang Record : Maksimal 169 karakter

Media : Harddisk

Field kunci : no

Software : MySQL

Tabel IV.3

Struktur Tabel Konfirmasi

4. Spesifikasi File Kustomer

No Elemen Data Nama Field Tipe Panjang Keterangan

1 No no Int 4 Primary Key

2 Nama Pengunjung Nama Varchar 30 -

3. No.Invoice no_invoice Int 11 -

4. Tanggal tgl Date - -

5. Besar Bayar besar_bayar Int 12 -

6. Bank Transfer bank_transfer Varchar 10 -

7. Rekening Rek Int 30 -

8. Bank Tujuan bank_tujuan Varchar 15 -

9. Notes Notes Varchar 50 -

39

Nama File : Kustomer

Akronim : kustomer.frm, kostomer.myi, kustomer.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 375 karakter

Media : Harddisk

Field kunci : id_kustomer

Software : MySQL

Tabel IV.4

Struktur Tabel Kustomer

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Kustomer id_kustomer Int 5 Primary Key

2 Password password Varchar 50 -

3. Nama Lemgkap nama_lengkap Varchar 50 -

4. Avatar avatar Varchar 50 -

5. Alamat alamat Text - -

6. E-Mail email Varchar 50 -

7. Telepon telpon Varchar 20 -

8. About about Text - -

9. Hobi hobi Varchar 50 -

10. Facebook fb Varchar 50 -

11. Twitter tw Varchar 50 -

40

5. Spesifikasi File Admin

Nama File : Admins

Akronim : admins.frm, admins.myi, admins.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 226 Karakter

Media : Harddisk

Field kunci : username

Software : MySQL

Tabel IV.5

Struktur Tabel Admin

6. Spesifikasi FileHubungi

Nama File :Hubungi

No Elemen Data Nama Field Tipe Panjang Keterangan

1. User Name username Varchar 50 Primary Key

2. Password password Varchar 50 -

3. Nama Lengkap nama_lengkap Varchar 50 -

4. E-Mail Email Varchar 50 -

5. No.Telepon no_telp Varchar 20 -

6. Level level Varchar 6 -

41

Akronim : hubungi.frm, hubungi.myi, hubungi.myd

Tipe file : FileTransaksi

Organisasi File : Random access

Panjang Record : 155 Karakter

Media : Harddisk

Field kunci : id_hubungi

Software : MySQL

Tabel IV.6

Struktur Tabel Hubungi

7. Spesifikasi FileHeader

Nama File : Header

Akronim : header.frm,header.myi, header.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 255 karakter

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Hubungi id_hubungi Int 5 Primary Key

2 Nama Pengunjung Nama Varchar 50 -

3. E-Mail Email Varchar 50 -

4. Subjek Pesan subjek Varchar 50 -

5. Pesan Pesan Text - -

6. Tanggal tanggal Date - -

42

Media : Hardisk

Field kunci : id_header

Software : MySQL

Tabel IV.7

Struktur Tabel Header

8. Spesifikasi File Mod Bank

Nama File : mod_bank

Akronim : mod_bank.frm,mod_bank.myi, mod_bank.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 255 karakter

Media : Hardisk

Field kunci : id_bank

Software : MySQL

Tabel IV.8

Struktur Tabel Mod_Bank

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Header id_header Int 5 Primary Key

2 Judul judul Varchar 50 -

3. Url url Varchar 100 -

4. Gambar gambar Varchar 100 -

No Elemen Data Nama Field Tipe Panjang Keterangan

43

9. Spesifikasi FileOrders

Nama File : Orders

Akronim : orders.frm,orders.myi, orders.myd

Tipe file : FileTransaksi

Organisasi File : Random access

Panjang Record : 60 karakter

Media : Hardisk

Field kunci : id_orders

Software : MySQL

Tabel IV.9

Struktur Tabel Orders

1 Id Bank id_bank Int 5 Primary Key

2 Nama Bank nama_bank Varchar 50 -

3. Cabang Cabang Varchar 50 -

4. No.Rekening no_rekening Varchar 50 -

5. Pemilik Pemilik Varchar 50 -

6. Gambar Gambar Varchar 50 -

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Orders id_orders Int 5 Primary Key

2 Status Order status_order Varchar 50 -

3. Tanggal Order tgl_order Date - -

4. Jam Order jam_order Time - -

44

10. Spesifikasi FileOrders Detail

Nama File : Orders_detail

Akronim : orders_detail.frm,orders_detail.myi, orders_detail.myd

Tipe file : File Transaksi

Organisasi File : Random access

Panjang Record : 15 karakter

Media : Hardisk

Field kunci : -

Software : MySQL

Tabel IV.10

Struktur Tabel Orders_detail

11. Spesifikasi FileOrders Temp

Nama File : Orders_temp

Akronim : orders_temp.frm,orders_temp.myi, orders_temp.myd

Tipe file : FileTemporary

Organisasi File : Random access

5. Alamat Tujuan alamat_tujuan Text - -

6. Id Kustomer id_kustomer Int 5 -

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Order id_orders Int 5 -

2 Id Produk id_produk Int 5 -

3. Jumlah Jumlah Int 5 -

45

Panjang Record : Maksimal 120 karakter

Media : Hardisk

Field kunci : id_orders_temp

Software : MySQL

Tabel IV.11

Struktur Tabel orders_temp

12. Spesifikasi File Propinsi

Nama File : Propinsi

Akronim : propinsi.frm,propinsi.myi, propinsi.myd

Tipe file : FileMaster

Organisasi File : Random access

Panjang Record : 113 karakter

Media : Hardisk

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Id Order temp id_orders_temp Int 5 Primary Key

2 Id Produk id_produk Int 5 -

3. Id Session Id_session Varchar 100 -

4. Jumlah Jumlah Int 5 -

5.

Tanggal Order

Temp Tgl_order_temp Date - -

6.

Jam Order

Temp Jam_order_temp Time - -

7. Stok Temp Stok_temp Int 5 -

46

Field kunci : nomor

Software : MySQL

Tabel IV.12

Struktur Tabel Propinsi

4.2.2 Software Architecture

Software architecture merupakan struktur dari sebuah sistem, proses yang mendefinisikan

solusi yang terstruktur untuk memenuhi kebutuhan teknis dan operasional dari sebuah aplikasi

yang dibuat.

A. Class Diagram

Class Diagram adalah diagram yang digunakan untuk menampilkan beberapa kelas serta

paket-paket yang ada dalam sistem/perangkat lunak. Dalam penyusunan software yang dibuat

class diagram merupakan kumpulan obyek-obyek yang mempunyai struktur umum, relasi umum

dan semantic umum. Berikut adalah penggambaran hubungan antara class yang ada pada

aplikasi penjualan sparepart berbasis ecommerce.

No Elemen Data Nama Field Tipe Panjang Keterangan

1 Nomor Nomor Int 3 Primary Key

2 Kota Kota Varchar 50 -

3. Propinsi Propinsi Varchar 50 -

4. Biaya Biaya Int 10 -

47

Gambar IV.6. Class Diagram Sistem Usulan

48

B. Sequence Diagram

Sequence Diagram digunakan untuk menggambarkan perilaku pada sebuah skenario.

Diagram ini menunjukan sejumlah contoh obyek dan pesan (message) yang diletakan diantara

obyek-obyek ini di dalam use case.

1. Sequence Diagram Login

sd Sequence Diagram Login

Pengguna Login Antar MukaValidasi Koneksi Database

form login()

username dan password()

login()

open()

query cek login()

execute()

getResult()

username dan password pengguna()

close()

destroy()

destroy()

Gambar IV.7. Sequence Diagram Login

49

2. Sequence Diagram Penjualan Sparepart

Gambar IV.8. Sequence Diagram Penjualan Sparepart

50

C. Component Diagram

Component Diagram menggambarkan struktur dan hubungan antara komponen piranti

lunak, termasuk ketegantungan diantaranya, Component Diagram juga dapat berupa interface

yang berupa kumpulan layanan yang disediakan oleh komponen untuk komponen lainya.

cmp Component Diagram

User Interface

Entity

Data Access

Bussiness Logic MySQL Database

Gambar IV.9. Component Diagram Sistem Usulan

51

D. Deployment Diagram

Deployment Diagram menunjukan konfigurasi komponen dalam proses eksekusi aplikasi.

deployment Deployment Diagram

Client Tier

User Interface Layer

Application Tier

Bussiness Logic Layer

Data Access layer

Data Tier

MySQL

Gambar IV.10. Deployment Diagram Sistem Usulan

52

4.2.3 User Interface

1. Halaman Login Admin

Gambar IV.11. Halaman Login

2. Halaman Muka (Dashboard)

Gambar IV.12. Halaman Muka (Dashboard)

53

3. Halaman Master

Gambar IV.13. Halaman Master

54

4. Halaman User

Gambar IV.14. Halaman User

5. Halaman Pembelian

Gambar IV.15. Halaman Belanja

55

6. Halaman Keranjang Belanja

Gambar IV.16. Halaman Keranjang Belanja

56

4.3 Code Generation

A. Form Login Admin

<?php

include "../config/koneksi.php";

function antiinjection($data){

$filter_sql = mysql_real_escape_string(stripslashes(strip_tags(htmlspecialchars($data,ENT_QUOTES))));

return $filter_sql;

}

$username = antiinjection($_POST[username]);

$pass = antiinjection(md5($_POST[password]));

$login=mysql_query("SELECT * FROM admins WHERE username='$username' AND

password='$pass'");

$ketemu=mysql_num_rows($login); $r=mysql_fetch_array($login);

// Apabila username dan password ditemukan if ($ketemu > 0){

session_start();

session_register("namauser");

session_register("namalengkap"); session_register("passuser");

session_register("leveluser");

$_SESSION[namauser] = $r[username];

$_SESSION[namalengkap] = $r[nama_lengkap];

$_SESSION[passuser] = $r[password]; $_SESSION[leveluser] = $r[level];

header('location:media.php?module=home');

} else{

echo "<link href='css/screen.css' rel='stylesheet' type='text/css'><link href='css/reset.css'

rel='stylesheet' type='text/css'>"; echo "<center><br><br><br><br><br><br><b>LOGIN GAGAL! </b><br>

Username atau Password Anda tidak benar.<br>

Atau account Anda sedang diblokir.<br><br>";

echo "<div> <a href='index.php'><img src='images/seru.png' height=147 width=176><br><br></a>

</div>";

echo "<input type=button class='tombol' value='ULANGI LAGI' onclick=location.href='index.php'></a></center>";

}

?>

57

B. Form Login Customer

<?php

echo " <div class='content_sec'>

<h3 class='heading colr'>Login</h3>

<div class='login'> <div class='registrd'>

<h5>Member Login</h5>

"; if($_SESSION['id_kustomer']==''){

echo "

<p>Jika anda sudah punya akun, silahkan masuk</p> <form name='form' action='login-user-aksi.html' method='POST'

onSubmit=\"return validasi(this)\">

<ul class='forms'>

<li class='txt bold'>Email Address <span class='req'>*</span></li> <li class='inputfield'><input type='text' name='email' class='bar' /></li>

</ul>

<ul class='forms'> <li class='txt bold'>Password <span class='req'>*</span></li>

<li class='inputfield'><input type='password' name='password' class='bar'

/></li>

</ul> <ul class='forms'>

<li class='txt'>&nbsp;</li>

<li> <input type='submit' class='simplebtn' value='Login'></li> </ul>

</form>

";

echo "

</div>

<div class='newcus'> <h5>DAFTAR MEMBER</h5>

<p>

Dengan membuat account, proses pembelanjaan akan menjadi lebih cepat dan anda dapat menyimpan alamat pengiriman, melihat pesanan Anda di account Anda.... </p>

<a href='daftar-user.html' class='simplebtn'>Daftar</a>

</div> ";

} else{

echo"<p>Kamu sudah login, apakah mau logout?

</p> <a href='logout.html' class='simplebtn'>Logout</a>

";

} echo"

</div>

</div>

";

?>

58

4.4 Testing

Pada bagian testing penulis akan melakukan hasil pengujian dari sistem yang akan dibuat,

dimana penulis akan menggunakan blackbox testing. Di bagian ini bisa dilihat apakah program

berjalan sesuai dengan yang di inginkan atau tidak.

1. Form Login Administrator

Tabel IV.13. Hasil Blackbox Testing

No Skenario

Pengujian Test Case

Hasil yang

diharapkan

Hasil

Pengujian Kesimpulan

1

Mengosongkan

semua isian pada

form login admin,

lalu Mengklik tombol„Login‟

Username:

(kosong)

Password: (kosong)

Sistem menolak

akses login dan

menampilkan

pesan “Anda belum

mengisikan

Username”

Sesuai

harapan Valid

2

Mengetikkan

Username dan

password tidak

diisi atau kosong kemudian klik

tombol login

Username

: antonius

Password :

(kosong)

Sistem akan

menolak akses

administrator

dan menampilkan

“Anda belum

mengisikan password”

Sesuai harapan

Valid

3

Mengetikkan salah

satu kondisi salah

pada username atau password

kemudian klik

tombol login

Username:

antonius

(benar) Password:

1234

(salah)

Sistem akan

menolak akses

administrator dan

menampilkan

halaman

“Username dan

password tidak

benar”

Sesuai

harapan Valid

4

Mengetikkan Username dan

password dengan

data yang benar kemudian klik

tombol login

Username: antonius

(benar)

Password: antonius

(benar)

Sistem menerima akses

login dan

kemudian langsung

menampilkan

halaman administrator.

Sesuai harapan

Valid

59

4.5 Support

4.5.1 Spesifikasi Hardware dan Software

Suatu sistem pada program tidak dapat berdiri sendiri, melainkan membutuhkan

sarana pendukung untuk dapat berjalan dengan baik. Sarana pendukung yang

dibutuhkan antara lain sebagai berikut: perangkat keras (hardware), perangkat lunak

(software) dan pengguna (brainware).

1. Spesifikasi Hardware

Perangkat keras yang dimaksud adalah seperangkat alat atau elemen elektronik yang

dapat membantu sistem yang diusulkan sehingga program yang diusulkan oleh

penulis dapat bekerja dengan baik. Berikut perangkat keras yang dibutuhkan dalam

pembuatan aplikasi ini:

a. Sistem Operasi : Windows 7

b. Processor : Pentium R Dual Core 2.30 Ghz

c. Memory Size (RAM) : 1GB DDRAM

d. Monitor : LCD 14”

e. Hard Disk : 250 GB

f. Keyboard : 108 keys

g. Mouse : Optical Standard

h. Printer : Cannon

2. Spesifikasi Software

Perangkat lunak adalah suatu rangkaian atau susunan intruksi yang harus benar-benar

sesuai dengan urutan yang benar. Fungsi software untuk menyiapkan aplikasi

60

program sehingga kinerja seluruh peralatan yang ada pada komputer dapat dikontrol.

Berikut perangkat lunak yang dibutuhkan dalam pembuatan aplikasi ini:

a. Sistem Operasi : Windows 7

b. Bahasa Script : PHP, HTML, CSS, JavaScript

c. Database Server : MySQL

d. Web Server : PhpMyAdmin, Apache

e. Web Browser : Mozilla Firefox,Google Chrome

f. Text Editor : Notepad ++

4.6 Spesifikasi Dokumen Sistem Usulan

Dalam spesifikasi sistem usulan ini, dibahas mengenai bentuk-bentuk dokumen yang

terlibat dalam pembuatan sistem usulan. Adapun spesifikasi dokumen tersebut adalah sebagai

berikut:

1. Nama Dokumen : Laporan Penjualan

Fungsi : Sebagai bukti dari order penjualan sparepart motor

Sumber : Administrator

Tujuan : Bendahara

Media : Tampilan

Frekuensi : Setiap periode (satu bulan)

Format : Lampiran B1