TUGAS AKHIR - repository.bsi.ac.idUntuk itulah penulis mencoba untuk membuat tugas akhir mengenai perancangan sistem informasi penjualan sepatu berbasis web pada toko Salfa Jakarta

PERANCANGAN SISTEM INFORMASI PENJUALAN

SEPATU BERBASIS WEB PADA TOKO SALFA

JAKARTA

TUGAS AKHIR

Diajukan untuk memenuhi salah satu syarat kelulusan Diploma Tiga (D.III)

RAIH PRATAMA

NIM: 12141081

Program Studi Manajemen Informatika

AMIK BSI JAKARTA

Jakarta

2017

ii

iii

iv

v

vi

vii

viii

ix

ABSTRAK Raih Pratama (12141081), Perancangan Sistem Infromasi Penjualan Sepatu

Berbasis Web Pada Toko Salfa akarta

Dengan adanya perkembangan pada dunia mode yang semakin pesat membuat

sepatu kini tidak sekedar hanya berfungsi melindungi kaki saja, tetapi juga menjadi

penyempurnaan dari busana yang tidak terpisahkan. Saat ini sistem penjualan

produk melalui internet sedang berkembang pesat, banyak perusahaan

memanfaatkan teknologi berbasis web sebagai suatu strategi perusahaan dalam

menawarkan produk mereka kepada masyarakat tanpa di batasi oleh ruang dan

waktu. Mulai dari perusahaan besar hingga usaha yang kecil dan menengah telah

menjadikan sistem penjualan secara online sebagai sarana promosi yang murah dan

terjangkau. toko Salfa Jakarta ini merupakan bergerak di bidang bisnis penjualan

sepatu masih belum terkenal luas karna masih terbilang baru di dunia bisnis ini, dan

menghadapi ketatnya persaingan dalam dunia bisnis fashion sepatu hanya dengan

melakukan promosi yang dianggap kurang berpengaruh terhadap angka penjualan.

Untuk itulah penulis mencoba untuk membuat tugas akhir mengenai perancangan

sistem informasi penjualan sepatu berbasis web pada toko Salfa Jakarta.

Perancangan sistem informasi penjualan ini menghasilkan sebuah website penjualan

dan merupakan solusi yang di harapkan para pembeli dapat mampu membantu

meningkatkan dan memperluas penjualan sepatu agar dapat menghemat banyak

waktu.

Kata Kunci: Perancangan Sistem Informasi , Perancangan Website, Sistem

Penjualan Barang

x

ABSTRACT

Raih Pratama (12141081), Design of Information Systems Web Based Shoes Sales

At Salfa Store Jakarta

With the development of the world of fashion is increasingly rapidly making shoes

now not only serves only to protect the feet, but also a refinement of the clothing that

is not separated. Currently the product sales system through the internet is growing

rapidly, many companies use web-based technology as a strategy of the company in

offering their products to the public without being limited by space and time. Starting

from large companies to small and medium enterprises has made online sales system

as a means of promotion is cheap and affordable. Store Salfa Jakarta is a move in the

field of shoes sales business is still not well known because it is still fairly new in the

business world, and facing the tight competition in the world of fashion shoes

business just by doing promotions that are considered to have less effect on sales

figures. That's why the author tries to make the final task about the design of

information systems sales of web-based shoes on store Salfa Jakarta. The design of

this sales information system produces a sales website and is a solution that is

expected buyers can be able to help increase and expand sales of shoes in order to

save a lot of time.

Keywords: Information System Design, Website Design, Goods Sales System

xi

DAFTAR ISI

Lembar Judul Tugas Akhir ................................................................................... i

Lembar Pernyataan Keaslian Tugas Akhir ............................................................ ii

Lembar Pernyataan Persetujuan Publikasi Karya Ilmiah ....................................... iii

Lembar Persetujuan dan Pengesahan Tugas Akhir ................................................ iv

Lembar Konsultasi Tugas Akhir ........................................................................... v

Kata Pengantar ..................................................................................................... vii

Abstrak ................................................................................................................ ix

Daftar Isi .............................................................................................................. xi

Daftar Simbol ...................................................................................................... xiii

Daftar Gambar ..................................................................................................... xiv

Daftar Tabel ......................................................................................................... xvii

Daftar Lampiran ................................................................................................... xviii

BAB I PENDAHULUAN ................................................................................ 1

1.1. Latar Belakang Masalah ............................................................... 1

1.2. Maksud dan Tujuan ................................................................ 3

1.3. Metode Penelitian ........................................................................ 4

1.4. Ruang Lingkup ............................................................................ 6

1.5. Sistematika Penulisan................................................................... 7

BAB I LANDASAN TEORI ............................................................................ 9

2.1. Konsep Dasar Web ............................................................. 9

2.1.1. Website .............................................................................. 10

2.1.2. Bahasa Pemrograman ......................................................... 12

2.1.3. Basis Data .......................................................................... 14

2.1.4. Pengembangan Perangkat Lunak ........................................ 15

2.2. Teori Pendukung ........................................................................... 18

2.2.1. Struktur Navigasi................................................................ 18

2.2.2. ERD (Entity Relationship Diagram) ................................... 20

2.2.3. LRS (Logical Record Structure) ......................................... 25

2.2.4. Pengujian Website .............................................................. 25

BAB III PEMBAHASAN ................................................................................... 26

3.1.Tinjauan Perusahaan ...................................................................... 26

3.1.1. Sejarah Perusahaan .............................................................. 26

3.1.2. Struktur Organisasi dan Fungsi ............................................ 28

3.2. Analisa Kebutuhan ........................................................................ 29

3.2.1. Kebutuhan Pengguna .......................................................... 30

3.2. Perancangan Perangkat Lunak ....................................................... 32

3.3.1. Rancangan Antar Muka. ...................................................... 32

xii

3.3.2. Rancangan Basis Data ......................................................... 51

3.3.3. Rancangan Struktur Navigasi .............................................. 60

3.2. Implementasi dan Pengujian Unit .................................................. 61

3.3.1. Implementasi. ...................................................................... 61

3.3.1. Pengujian Unit. ................................................................... 79

BAB IV PENUTUP ............................................................................................ 90

4.1. Kesimpulan ................................................................................ 90

4.2. Saran ......................................................................................... 91

DAFTAR PUSTAKA ........................................................................................... 92

DAFTAR RIWAYAT HIDUP ............................................................................. 94

SURAT KETERANGAN PKL ............................................................................ 95

LAMPIRAN-LAMPIRAN ................................................................................... 96

xiii

DAFTAR SIMBOL

Entity Relationship Diagram

Entitas atau Objek Data

Kumpulan objek atau sesuatu yang dapat dibedakan

atau dapat diidentifikasi secara unik.

Relationship

Hubungan yang terjadi antar satu entitas atau lebih.

Atribut atau Elemen data

Karakteristikdalam entity atau relationship yang mengerjakan

penjelasan detail tentang entity atau relationship atau disebut

kumpulan elemen data yang membentuk suatu entitas.

Weak Entity

Suatu entity dimana keberadaan dari entity tersebut tergantung

dari entity lain.

Atribut Multivalue

Atribut yang memiliki nilai lebih dari satu.

Connection

Digunakan sebagai penghubung entitas yang

membedakan entitas tersebut dengan entitas lainnya.

xiv

DAFTAR GAMBAR Halaman

Gambar II.1 Struktur Navigasi Linier ..................................................................... 18

Gamabr II.2 Struktur Navigasi Hirarki ................................................................... 19

Gambar II.3 Struktur Navigasi Non-Linier ............................................................. 19

Gambar II.4 Struktur Navigasi Campuran .............................................................. 20

Gambar II.5 Contoh Unary degree ......................................................................... 22

Gambar II.6 Contoh Binary degree ........................................................................ 22

Gambar II.7 Contoh Tenary degree ........................................................................ 23

Gambar II.8 Contoh Cardinality one to one ........................................................... 23

Gambar II.9 Contoh Cardinality one to many ......................................................... 24

Gambar II.10 Contoh Cardinality many to one ....................................................... 24

Gambar II.11 Contoh Cardinality many to many .................................................... 24

Gambar III.1 Struktur Organisasi Toko Salfa jakarta .............................................. 28

Gambar III.2 Rancangan antar muka login admin................................................... 33

Gambar III.3 Rancangan antar muka halaman beranda administrator ..................... 33

Gambar III.4 Rancangan antar muka halaman data administrator ........................... 34

Gambar III.5 Rancangan antar muka halaman data pelanggan ................................ 34

Gambar III.6 Rancangan antar muka halaman data kota ......................................... 35

Gambar III.7 Rancangan antar muka halaman data kategori .................................. 35

Gambar III.8 Rancangan antar muka halaman data barang ..................................... 36

Gambar III.9 Rancangan antar muka halaman data pemesanan............................... 36

Gambar III.10 Rancangan antar muka halaman data konfirmasi ............................. 37

Gambar III.11 Rancangan antar muka halaman beranda pengunjung ...................... 37

Gambar III.12 Rancangan antar muka halaman barang pengunjung ....................... 38

Gambar III.13 Rancangan antar muka halaman semua kategori pengunjung ........... 38

Gambar III.14 Rancangan antar muka halaman sepatu snaker dan skate ................. 39

Gambar III.15 Rancangan antar muka halaman sepatu formal pengunjung ............. 39

Gambar III.16 Rancangan antar muka halaman sepatu boots pengunjung ............... 40

Gambar III.17 Rancangan antar muka halaman memo pengunjung ........................ 40

Gambar III.18 Rancangan antar muka halaman tentang toko pengunjung ............... 41

Gambar III.19 Rancangan antar muka halaman cara pembelian pengunjung ........... 41

Gambar III.20 Rancangan antar muka halaman cara pembayaran pengunjung ........ 42

Gambar III.21 Rancangan antar muka halaman testimoni pengunjung .................... 42

Gambar III.22 Rancangan antar muka halaman login pengunjung .......................... 43

Gambar III.23 Rancangan antar muka halaman register pengunjung ...................... 43

Gambar III.24 Rancangan antar muka halaman beranda pelanggan ........................ 44

Gambar III.25.Rancangan antar muka halaman barang pelanggan .......................... 44

Gambar III.26 Rancangan antar muka halaman semua kategori pelanggan ............. 45

Gambar III.27 Rancangan antar muka halaman sepatu snaker dan skate ................. 45

Gambar III.28 Rancangan antar muka halaman sepatu formal pelanggan ............... 46

Gambar III.29 Rancangan antar muka halaman sepatu boots pelanggan ................. 46

Gambar III.30 Rancangan antar muka halaman memo pelanggan ........................... 47

xv

Gambar III.31 Rancangan antar muka halaman tentang toko pelanggan ................. 47

Gambar III.32 Rancangan antar muka halaman cara pembelian pelanggan ............. 48

Gambar III.33 Rancangan antar muka halaman cara pembayaran pelanggan .......... 48

Gambar III.34 Rancangan antar muka halaman testimoni pelanggan ...................... 49

Gambar III.35 Rancangan antar muka halaman data transaksi pelanggan ............... 49

Gambar III.36 Rancangan antar muka halaman profil pelanggan ............................ 50

Gambar III.37 Rancangan antar muka halaman login pelanggan ............................ 50

Gambar III.38 Entity relationship diagram............................................................. 51

Gambar III.39 Logical record structure ................................................................. 52

Gambar III.40 Struktur navigasi pelanggan ............................................................ 60

Gambar III.41 Struktur navigasi admin .................................................................. 61

Gambar III.42 Implementasi halaman login admin ................................................. 61

Gambar III.43 Implementasi halaman beranda admin ............................................. 62

Gambar III.44 Implementasi halaman data administrator........................................ 62

Gambar III.45 Implementasi halaman data pelanggan ............................................ 63

Gambar III.46 Implementasi halaman data kota ..................................................... 63

Gambar III.47 Implementasi halaman data kategori .............................................. 64

Gambar III.48 Implementasi halaman data barang.................................................. 64

Gambar III.49 Implementasi halaman data pemesanan ........................................... 65

Gambar III.50 Implementasi halaman data konfirmasi ........................................... 65

Gambar III.51 Implementasi halaman beranda pengunjung .................................... 66

Gambar III.52 Implementasi halaman barang pengunjung ..................................... 66

Gambar III.53 Implementasi halaman tentang toko pengunjung ............................. 67

Gambar III.54 Implementasi halaman cara pembelian pengunjung ......................... 67

Gambar III.55 Implementasi halaman cara pembayaran pengunjung ...................... 68

Gambar III.56 Implementasi halaman testimoni pengunjung .................................. 68

Gambar III.57 Implementasi halaman login pengunjung ........................................ 69

Gambar III.58 Implementasi halaman register pengunjung ..................................... 69

Gambar III.59 Implementasi halaman semua kategori pengunjung ......................... 70

Gambar III.60 Implementasi halaman sepatu snaker dan skate ............................... 70

Gambar III.61 Implementasi halaman sepatu formal pengunjung ........................... 71

Gambar III.62 Implementasi halaman sepatu boots pengunjung ............................. 71

Gambar III.63 Implementasi halaman memo pengunjung ....................................... 72

Gambar III.64 Implementasi halaman beranda pelanggan ...................................... 72

Gambar III.65.Implementasi halaman barang pelanggan ........................................ 73

Gambar III.66 Implementasi halaman tentang toko pelanggan................................ 73

Gambar III.67 Implementasi halaman cara pembelian pelanggan ........................... 74

Gambar III.68 Implementasi halaman cara pembayaran pelanggan ........................ 74

Gambar III.69 Implementasi halaman testimoni pelanggan .................................... 75

Gambar III.70 Implementasi halaman login Pelanggan........................................... 75

Gambar III.71 Implementasi halaman transaksi pelanggan ..................................... 76

Gambar III.72 Implementasi halaman profil pelanggan .......................................... 76

Gambar III.73 Implementasi halaman semua kategori pelanggan ........................... 77

Gambar III.74 Implementasi halaman sepatu snaker dan skate ............................... 77

Gambar III.75 Implementasi halaman sepatu formal pelanggan .............................. 78

xvi

Gambar III.76 Implementasi halaman sepatu boots pelanggan................................ 78

Gambar III.77 Implementasi halaman memo pelanggan ......................................... 79

xvii

DAFTAR TABEL

Halaman

Tabel III.1 Tabel admin.......................................................................................... 53

Tabel III.2 Tabel barang ......................................................................................... 53

Tabel III.3 Tabel detail_pesanan ............................................................................ 54

Tabel III.4 Tabel kategori....................................................................................... 55

Tabel III.5 Tabel keranjang .................................................................................... 55

Tabel III.6 Tabel konfirmasi .................................................................................. 56

Tabel III.7 Tabel pelanggan ................................................................................... 57

Tabel III.8 Tabel kota ............................................................................................ 58

Tabel III.9 Tabel pesanan ....................................................................................... 58

Tabel III.10 Tabel buku_tamu ................................................................................ 59

Tabel III.11 Tabel testimoni ................................................................................... 60

Tabel III.12 Hasil pengujian black box testing halaman form login administrator .. 79

Tabel III.13 Hasil pengujian black box testing halaman form login pelanggan ........ 81

Tabel III.14 Hasil pengujian black box testing halaman daftar pelanggan ............... 83

Tabel III.15 Hasil pengujian black box testing halaman pemesanan ........................ 85

Tabel III.16 Hasil pengujian black box testing halaman konfirmasi pembayaran .... 87

xviii

DAFTAR LAMPIRAN

Halaman

A1. Surat Keterangan Riset .................................................................................... 95

B1. Siup Toko Salfa Jakarta ................................................................................... 96

1

BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

Sepatu adalah suatu jenis alas kaki (footwear) yang biasanya terdiri bagian-

bagian sol, hak, kap, tali dan lidah yang fungsinya sebagai alas kaki. Pengelompokan

sepatu biasanya dilakukan berdasarkan fungsinya, seperti sepatu santai (kasual),

sepatu olah raga dan sepatu kerja. Dengan adanya perkembangan pada dunia mode

yang semakin pesat membuat sepatu kini tidak sekedar hanya berfungsi untuk

melindungi kaki saja, tetapi juga menjadi penyempurna dari busana yang tidak

dipisahkan. Desain sepatu, merk, warna, hingga harga menjadi pertimbangan bagi

mereka penggemar fashion sepatu. Demi memakai sepatu bak model-model di

majalah fashion, tak jarang penggemar fashion ini rela merogoh kantong dari harga

ratusan ribu hingga jutaan rupiah. Bahkan, orang rela berburu sepatu hingga ke negri

tetangga, singapura, malaysia, atau ke eropa.

Saat ini sistem penjualan produk melalui internet sedang berkembang pesat.

Banyak perusahaan yang memanfaatkan teknologi berbasis web sebagai suatu strategi

perusahaan dalam menawarkan produk mereka kepada masyarakat tanpa di batasi

oleh ruang dan waktu. Mulai dari perusahaan besar hingga usaha yang kecil dan

menengah telah menjadikan sistem penjualan secara online sebagai sarana promosi

yang murah dan terjangkau. Produk yang ditawarkan salah satu produk yang sangat

memungkinkan dan sangat mudah untuk dijual secara online adalah sepatu.

2

Toko Salfa Jakarta ini merupakan sebuah toko yang bergerak di bidang bisnis

penjualan sepatu, didirikan pada 17 september 1995. Toko yang saat ini berlamat di

lokasi pasar jaya palmeriem lantai blok A no 11 masih belum terkenal luas karna

masih terbilang baru di dunia bisnis ini. merek sepatu yang menjadi andalan Toko

Salfa Jakarta ini diantaranya adalah warrior, dallas, nb, att, nike, adidas, vans dan

berbagai macam merek sepatu lainnya. Selama ini toko salfa ini mengahadapi

ketatnya persaingan dalam dunia bisnis fashion sepatu hanya dengan melakukan

promosi yang dianggap pemilik masih kurang berpengaruh terhadap angka penjualan.

Promosi hanya dilakukan dengan memasarkan produk-produknya di toko. Hal ini

tentunya berhubungan dengan masalah pemasaran yang masih dirasakan kurang

efektif. Ruang lingkup pemasaran yang dilakukan dengan memasarkan produknya di

toko dan dari mulut ke mulut ini dianggap hanya dapat menarik dari kalangan tertentu

saja. Bahkan untuk mendapat informasi pembeli harus datang langsung ke toko dan

ini menjadi kurang efektif. Tidak hanya mendapatkan informasi, transaksi sampai

dengan pembayaran pun saat ini harus dilakukan di toko. Selain itu, lokasi toko ini

yang masih berada di satu lokasi dan belum memilik cabang juga membuat kurang

dikenalnya toko ini di masyarakat luas. Maka dari itu, agar lebih menjangkau

masyarakat luas diperlukan sebuah sarana pemasaran sekaligus penyedia informasi

mengenai produk-produk yang dijual yang bersifat efisien, tidak dibatasi ruang dan

waktu. Salah satunya melalui website.

Atas dasar uraian di atas makan akan dibahas tugas akhir tentang bagaimana

membuat suatu sarana sistem berbasis web yang dapat membantu Toko Salfa Jakarta

3

ini dalam hal memasarkan sepatunya secara online dengan judul “Perancangan

Sistem Informasi Penjualan Sepatu Berbasis Web Pada Toko Salfa Jakarta”.

1.2 Maksud dan Tujuan

Maksud dalam penulisan tugas akhir ini adalah sebagai berikut :

1. Mengimplementasikan website sehingga mempermudah para pengguna internet

dalam memperoleh informasi dan bisa memilih jenis sepatu di Toko Salfa Jakarta.

2. Memberikan kemudahan kepada para pengguna internet dalam melakukan

transaksi pemesanan sepatu secara online melaui website yang responsif dan

petunjuk penggunaan yang mudah dipahami.

3. Untuk mempermudah para pengguna internet agar bisa bertransaksi 24 jam penuh.

4. Memudahkan Toko Salfa Jakarta untuk memasarkan sepatunya agar lebih dikenal

Di masyarakat lebih luas.

5. Mempermudah untuk membuat laporan penjualan lebih transparan dan mengurangi

human error dalam transaksi penjualan di toko Salfa Jakarta.

Sedangkan tujuan penulisan tugas akhir adalah sebagi salah satu syarat

kelulusan pada program Diploma Tiga (D.III) untuk program studi Manajemen

Informatika di Akademi Manajemen Informatika dan Komputer Bina Sarana

Informatika (AMIK BSI).

4

1.3 Metode penilitian

Dalam penulisan tugas akhir ini, menggunakan Metode Pengembangan Perangkat

Lunak dan Teknik Pengumpulan Data.

A. Metode pengembangan perangkat Lunak.

Metode yang digunakan pada pengembangan perangkat lunak ini menggunakan

waterfall (Rosa 2013:28) yang meliputi:

1. Analisa kebutuhan Perangkat Lunak.

Pada proses ini penulis lebih mengutamakan mengenai proses pemesanan produk

sepatu secara online. Hal ini dilakukan untuk mempermudah proses transaksi

penjualan dan memberikan kemudahan tersendiri kepada para pengguna internet

yang akan memesan maupun memperoleh informasi mengenai produk pada

website penjualan sepatu.

2. Desain

Pada proses ini merupakan tahapan dimana dilakukan penuangan pemikiran dan

perancangan sistem terhadap solusi dari permasalahan yang ada dengan

menggunakan perangkat pemodelan sistem seperti diagram alir data (data flow

diagram). Diagram hubungan entitas (entity relationship diagram) serta, struktur

dan bahasan data.

3. Pembuatan Kode Program

Pembuatan kode program atau coding merupakan penerjemahan design dalam

bahasa yang bisa dikenal oleh komputer. Dilakukan oleh programmer yang akan

menerjemahkan transaksi yang diminta user. Tahapan inilah yang merupakan

5

tahapan secara nyata dalam mengerjakan suatu sistem dalam artian penggunaan

komputer akan dimaksimalkan dalam tahapan ini. Setelah pengkodean selesai

maka akan dilakukan testing terhadap sistem yang telah dibuat tadi. Tujuan

testing adalah menentukan kesalahan-kesalahan terhadap sistem tersebut dan

kemudian bisa diperbaiki.

4. Implementasi dan pengujian unit.

Pada proses ini perancangan perangkat lunak direalisasikan sebagai serangkaian

program atau unit program. desain interface perangkat lunak pada Website Toko

Online direalisasikan sebagai serangkaian program atau sebuah unit program.

dilakukan juga unit pengujian program Website Toko Online yang melibatkan

verifikasi sistem, bahwa setiap unit telah memenuhi spesifikasinya.

5. Penerapan Program dan Pemeliharaan.

Perangkat lunak yang sudah dibuat dan diterapkan pada perangkat lain akan

mengalami perubahan. Perubahan tersebut bisa karena mengalami kesalahan

karena perangkat lunak harus menyesuaikan dengan lingkungan (periperal atau

sistem baru) atau karena user membutuhkan perkembangan fungsional.

B. Teknik pengumpulan Data.

Teknik pengumpulan data yang digunakan oleh penulis dalam melakukan

pengumpulan data untuk Tugas Akhir adalah :

6

1. Observasi

Penulis melakukan pengamatan-pengamatan secara langsung di Toko Salfa

Jakarta terhadap Sistem penjualan Saat ini untuk mendapat data yang akurat.

2. Wawancara

Penulis melakukan wawancara terhadap owner di Toko Salfa Jakarta untuk

mengetahui sejarah toko, proses penjualan sepatu dan melengkapi hasil observasi.

3. Studi Pusaka (Library research).

Dalam metode ini penulis mengumpulkan dan memperoleh data dari membaca

buku-buku literatur, laporan-laporan atau bacaan lain yang berkaitan dengan

materi yang akan dibahas.

1.4 Ruang Lingkup

Dalam pembuatan Website Toko Sepatu Salfa Jakarta ini diperlukan batasan

masalah, agar permasalahan yang ditinjau tidak terlalu luas dan sesuai dengan

maksud dan tujuan yang dicapai. Adapun batasan - batasan yang di buat melingkupi 3

(tiga) akses diantaranya yaitu admin, pelanggan dan penggunjung.

Pada halaman admin terdiri dari halaman beranda admin, halaman data admin,

halaman data pelanggan, halaman data barang, halaman data pemesanan, halaman

data konfrimasi, halaman data kategori, halaman data kota.

Sedangkan halaman pelanggan terdiri dari halaman beranda, halaman barang,

halaman tentang toko, halaman cara pembayaran, halaman cara pembelian, halaman

testimoni, halaman login, halaman data transaksi, halaman profil member, halaman

7

semua kategori, halaman sepatu snaker dan skate, halaman sepatu formal, halaman

sepatu boots dan halaman memo.

Yang terakhir pada halaman pengunjung terdiri dari halaman beranda,

halaman barang, halaman tentang toko, halaman cara pembayaran, halaman

testimoni, halaman cara pembelian, halaman login, halaman register, halaman semua

kategori, halaman sepatu snaker dan skate, halaman sepatu formal, halaman sepatu

boots dan halaman memo.

1.5 Sistematika Penulisan.

Untuk memberikan gambaran singakat tentang isi dari penulisan Tugas Akhir ini,

penulis membagi dalam empat bab, yaitu :

BAB I PENDAHULUAN

Dalam bab ini berisi tentang latar belakang masalah, maksud dan

tujuan, metode penelitian, ruang lingkup dan sistematika penulisan

Tugas Akhir.

BAB II LANDASAN TEORI

Pada bab ini membahas tentang konsep dasar web dan teori

pendukung meliputi struktur navigasi, Entity Relationship Diagram

atau ERD, Logical Record Structure atau LRS dan pengujian web

sebagai pendukung dalam menyusun Tugas Akhir ini.

BAB III PEMBAHASAN

8

Dalam bab ini menjelaskan analisa kebutuhan, perancangan perangkat

lunak, serta implementasi dan pengujian unit.

BAB IV PENUTUP

Bab terakhir berisikan kesimpulan dan saran yang dapat diberikan oleh

penulis sehubungan dengan telah diselesaikannya rangkaian kegiatan

dalam penyusunan Tugas Akhir.

9

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Dengan adanya internet dan website menjawab kebutuhan manusia akan

teknologi saat ini, mendorong pola pikir mereka untuk terus meningkatkan standar

kebutuhan informasi dan telekomunikasi. Bukan hanya perusahaan atau instansi

pemerintahan saja, tetapi hampir semua organisasi yang ada, telah menggunakan

media informasi berbasis website karena dinilai lebih efisien dan mudah diakses

dimana saja. Sehingga hal ini lebih memudahkan dalam proses pencarian informasi,

transfer data,atau promosi.

Menurut Hidayat (2010:3) Jenis-jenis web berdasarkan sifat atau style-nya

sebagai berikut:

1. Website dinamis

Merupakan sebuah website yang menyediakan content atau isi yang selalu

berubah-ubah setiap saat. Bahassa pemrograman yang digunakan antara lain

PHP, ASP, .NET dan memanfaatkan database MySQL atau MS SQL. Misalnya

website www.artikel-it.com, www.detik.com, dan lain-lain.

2. Website Statis

Website yang content nya sangat jarang diubah. Bahasa pemrograman yang

digunakan adalah HTML dan belum memanfaatkan database. Misalnya: web

profile organisasi dan lain-lain.

http://www.artikel-it.com/

10

A. Website

Menurut Simarmata (2010:47), “Website adalah sebuah sistem dengan

informasi yang disajikan dalam bentuk teks, gambar, suara, dan lain-lain yang

tersimpan dalam sebuah webserver internet yang disajikan dalam bentuk hypertext”.

Arief (2011:7), mendefinisikan “Website adalah salah satu aplikasi yang

berisikan dokumen-dokumen multimedia (teks, gambar, suara, animasi, video) di

dalamnya yang menggunakan protokol HTTP (hypertext transfer protocol) dan untuk

mengaksesnya menggunakan perangkat lunak yang disebut browser”.

Berdasarkan beberapa pendapat yang dikemukakan diatas, maka dapat

disimpulkan website adalah sebuah tempat di internet, yang menyajikan informasi

dengan berbagai macam format data seperti text, image, bahkan video dan dapat

diakses menggunakan berbagai aplikasi client sehingga memungkinkan penyajian

informasi yang lebih menarik dan dinamis dengan pengelolaan yang terorganisasi.

1. Internet

Sibero (2011:10) menjelaskan bahwa “internet (Interconnected Network) adalah

jaringan komputer yang menghubungkan antar jaringan secara global, internet dapat

juga disebut jaringan dalam suatu jaringan yang luas. Seperti hal nya jaringan

komputer lokal maupun jaringan komputer area, internet juga menggunakan protokol

komunikasi yang sama yaitu TCP/IP (Transmission Control Protocol/Internet

Protocol)”.

Sedangkan Menurut Darma (2009:1) “Internet ialah rangkaian komputer yang

terhubung satu sama lain. Hubungan melalui suatu sistem antar perangkat komputer

untuk lalu lintas itulah yang dinamakan network”.

11

Berdasarkan kutipan diatas dapat disimpulkan internet adalah seluruh jaringan

komputer yang dapat terhubung untuk melayani pengguna di seluruh dunia.

2. Web Server

Menurut Supardi (2010:181) menjelaskan bahwa “Web Server merupakan

perangkat lunak yang mengatur atau mengelola program berdasarkan permintaan

browser dan dikirimkan kembali ke browser”. Pada penggunaan sehari-hari banyak

web server mengimplementasikan fitur-fitur berikut:

a. Otentifikasi ,fitur untuk mengotorisasi suatu permintaan dari klien sebelum

menggunakan sumber daya yang dimiliki oleh web server (biasanya User dan

Password).

b. Dukungan HTTPS (dengan SSL, atau TSL) yang memungkinkan koneksi

yang aman (dengan enkripsi) ke server pada port 433 berbeda dengan koneksi

HTTP biasa di port.

c. Pengatur Bandwith (Bandwith throttling) yang berfungsi untuk membatasi

kecepatan respon dengan tujuan tidak membanjiri jaringan dan menghemat pita

data (bandwith) agar dapat melayani klien lebih banyak.

Setiap server web telah menentukan batas beban yang dapat ditanggung,

sehingga setiap server web mempunyai batasan jumlah klien yang terhubung pada

satu waktu (umumnya antara 2 s.d. 60.000, secara bawaan (default) maksimal 500

atau 1000). Jika server web sudah mendekati batas limit yang mampu ditangani maka

server menjadi kelebihan beban sehingga lambat dalam memberikan respon.

12

3. Web Browser

Menurut Limantara (2009:1) menjelaskan bahwa “web browser merupakan

aplikasi perangkat lunak yang memungkinkan pengguna untuk berinteraksi dengan

teks, image, video, games, dan informasi lainnya yang berlokasi pada halaman web

pada Word Wide Web (WWW) atau Local Area Network (LAN)”. Teks dan image

pada halaman web dapat berisi hyperlink ke halaman web lain pada website yang

sama maupun berbeda.

Dengan web browser seorang pengguna bisa mengakses informasi yang

disediakan pada banyak website secara cepat dan mudah. Meskipun browser pada

umumnya digunakan untuk mengakses Word Wide Web, browser juga bisa digunakan

untuk mengakses informasi yang disediakan web server pada jaringan privat atau

pada system file. Contoh web browser: Microsoft Internet Explorer, Mozilla Firefox,

Opera, Google Chrome, dan lain-lain.

B. Bahasa Pemrograman

Munir (2011:13) mengemukakan bahwa “Bahasa pemrograman adalah bahasa

komputer yang digunakan dalam menulis program.” Untuk mendukung pengerjaan

tugas akhir ini penulis menggunakan bahasa pemrograman sebagai berikut :

1. Personal Home Page (PHP)

Bernadhed (2013:10), menjelaskan bahwa “PHP adalah sebuah bahasa

pemograman yang berjalan dalam sebuah web-server (server side)”. Sedangkan

menurut Oktavian (2010:11), “Web Server adalah aplikasi yang berguna untuk

menerima permintaan informasi dari pengguna melalui web browser, dan

13

mengirimkan permintaan kembali informasi yang diminta melalui HTTP (HyperText

Transfer Protocol)”.

Berdasarkan pengertian di atas dapat ditarik kesimpulan bahwa PHP adalah

suatu bahasa pemrograman script yang dimengerti oleh komputer secara langsung

dengan hak cipta terbuka (open source) yang digunakan untuk membuat halaman

website yang dinamis dan pengembangan web.

2. Cascading Style Sheet (CSS)

Menurut Wiswakarma (2010:1), “CSS (Cascading Style Sheet) adalah salah

satu bahasa pemrograman desain web (style sheetlanguage) yang mengontrol format

tampilan sebuah halaman web yang ditulis dengan menggunakan bahasa penanda

(markup language)”.

Tujuan utama penggunaan CSS antara lain untuk membedakan konten (isi) dari

dokumen dan dari tampilan dokumen. Dengan adanya perbedaan tersebut

memudahkan pembuatan atau pemrograman ulang web. Bagian yang termasuk dalam

desain web meliputi warna, ukuran dan formatting.

3. Javascript

Menurut Kustiyahningsih (2011:65), “Java script adalah bahasa yang berbentuk

kumpulan script berjalan pada suatu dokumen HTML. Bahasa ini adalah bahasa

pemograman untuk memberikan kemampuan tambahan terhadap bahasa HTML

dengan mengizinkan pengeksekusian perintah-perintah di sisi user artinya di sisi

browser bukan di sisi server web”.

14

4. HTML

Menurut Kustiyahningsih (2011:13), “HTML kependekan Hyper Text Markup

Language. Dokumen HTML adalah text file murni yang dapat dibuat dengan editor

teks sembarang. Dokumen ini dikenal sebagai web page”.

Menurut Sutarman (2012:163), “HTML (Hypertext Markup Language) adalah

bahasa standar yang digunakan untuk pembuatan halaman web atau word wide web,

dengan hypertext dan informasi lain yang akan ditampilkan pada halaman web”.

C. Basis Data

Menurut Raharjo (2011:3), “ Basis data atau Database adalah kumpulan data

yang terintegrasi dan diatur sedemikian rupa sehingga data tersebut dapat

dimanipulasi, diambil, dan dicari secara cepat”.

Menurut Kustiyaningsih (2011:146), “Basis data atau Database adalah struktur

penyimpanan data. Untuk menambah, mengakses dan memperoses data yang

disimpan dalam sebuah database komputer, diperlukan sistem manajemen database

seperti MYSQL Server”.

Berdasarkan beberapa pendapat para ahli yang dikemukakan di atas dapat

ditarik kesimpulan bahwa database adalah sekelompok data yang mempunyai ciri-ciri

khusus dan dapat dikelola sedemikian rupa sehingga bisa menghasilkan sebuah

format data yang baru.

Pembuatan web pada tugas akhir ini, penulis menggunakan Structured Query

Language (SQL)sebagai bahasa pengolahan database, dan XAMPP sebagai aplikasi

pengolahan database.

15

1. MYSQL

Menurut Raharjo (2011:21), “MySQL merupakan RDBMS (server database)

yang mengelola database dengan cepat menampung dalam jumlah sangat besar dan

dapat diakses oleh banyak user”. Sedangkan Kadir (2010:2) mendefinisikan,

“MySQL adalah sebuah software open source yang digunakan untuk membuat

sebuah database.”

Berdasarkan pendapat yang dikemukakan di atas dapat ditarik kesimpulan

bahwa MySQL adalah suatu software atau program yang digunakan untuk membuat

sebuah database yang bersifat open source.

2. XAMPP

Menurut Wicaksono (2008:7) menjelaskan bahwa “XAMPP adalah sebuah

software yang berfungsi untuk menjalankan website berbasis PHP dan menggunakan

pengolah data MYSQL di komputer lokal”. XAMPP berperan sebagai server web

pada komputer lokal. XAMPP juga dapat disebut sebuah Cpanel server virtual, yang

dapat membantu melakukan preview sehingga dapat dimodifikasi website tanpa harus

online atau terakses dengan internet.

D. Model Pengembangan Perangkat Lunak

Menurut Rosa dan M. Shalahudin (2013:25) menjelaskan bahwa “pada awal

pengembangan perangkat lunak, para pembuat program (programmer) langsung

melakukan pengkodean perangkat lunak tanpa menggunakan prosedur atau tahapan

pengembangan perangkat lunak”. Dan ditemuilah kendala-kendala seiring dengan

perkembangan skala sistem-sistem perangkat yang semakin besar.

16

1. SDLC

SDLC atau Software Development Life Cycle atau sering disebut juga System

Development Life Cycle adalah proses mengembangkan atau mengubah suatu sistem

perangkat lunak dengan menggunakan model-model dan metodologi yang digunakan

orang untuk mengembangkan sistem-sistem perangkat lunak sebelumnya

(berdasarkan best practice atau cara-cara yang sudah teruji baik). Seperti halnya

proses metamorfosis pada kupu-kupu, untuk menjadi kupu-kupu yang indah maka

dibutuhkan beberapa tahap untuk dilalui, sama halnya dengan membuat perangkat

lunak, memiliki daur tahapan yang dilalui agar menghasilkan perangkat lunak yang

berkualitas.

2. Waterfall

Dalam perancangan aplikasi pada tugas akhir ini penulis menggunakan SDLC

model Water fall. Menurut Rosa dan M. Shalahudin (2013:28) menjelaskan bahwa

“model SDLC air terjun (water fall) sering juga disebut model sekuensial linier

(sequential linear) atau alur hidup klasik (classic life cycle)”. Model air terjun

menyediakan pendekatan alur hidup perangkat lunak secara sekuensial atau terurut

dimulai dari analisis, desain, pengodean, pengujian dan tahap pendukung (support).

Berikut penjelasannya:

a. Analisis kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

mespesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat

lunak seperti apa yang dibutuhkan oleh user. Spesifikasi kebutuhan perangkat

lunak pada tahap ini perlu untuk didokumentasikan.

17

b. Desain

Desain perangkat lunak adalah proses multi langkah yang fokus pada desain

pembuatan program perangkat lunak termasuk struktur data, arsitektur

perangkat lunak, representasi antarmuka, dan prosedur pengodean. Tahap ini

mentranslasi kebutuhan perangkat lunak dari tahap analisis kebutuhan ke

representasi desain agar dapat diimplementasikan menjadi program pada tahap

selanjutnya. Desain perangkat lunak yang dihasilkan pada tahap ini juga perlu

didokumentasikan.

c. Pembuatan kode program

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari tahap

ini adalah program komputer sesuai dengan desain yang telah dibuat pada tahap

desain.

d. Pengujian

Pengujian fokus pada perangkat lunak secara segi logika dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan

sesuai dengan yang diinginkan.

e. Pendukung (support) atau pemeliharaan (maintenance)

Tidak menutup kemungkinan sebuah perangkat lunak mengalami perubahan

ketika sudah dikirimkan ke user. Perubahan bisa terjadi karena adanya

kesalahan yang muncul dan tidak terdeteksi saat pengujian atau perangkat lunak

harus beradaptasi dengan lingkungan baru.

18

2.2. Teori Pendukung

Teori pendukung merupakan sebujah konsep yang tepat untuk digunakan

sebagai penggambaran model logika dari suatu program, model logika dari program

lebih menjelaskan dari pemakai tentang bagaimana nantinya fungsi-fungsi dari

program secara logika akan bekerja. Dalam proses pembuatan program kali ini

penulis membutuhkan beberapa peralatan pendukung (tool system),yaitu :

A. Struktur Navigasi

Menurut Suyanto (2008:62) “Struktur navigasi dalam situs web melibatkan

sistem navigasi situs web secara keseluruhan dan desain interface situs web tersebut,

navigasi memudahkan jalan yang mudah ketika menjelajahi situs web”.

Menurut Binanto (2010: 269-270), menyatakan bahwa terdapat empat struktur

dasar navigasi yang digunakan pada produk multimedia, yaitu:

1. Struktur Navigasi Linier

Struktur navigasi linier hanya mempunyai satu rangkaian cerita yang berurut

yang menampilkan satu demi satu tampilan layar secara berurut menurut urutannya.

Tampilan yang dapat ditampilkan pada struktur jenis ini adalah satu halaman

sebelumnya atau satu halaman sesudahnya, tidak dapat dua halaman sebelumnya atau

dua halaman sesudahnya, pengguna akan melakukan navigasi secara berurutan, dalam

frame atau byte informasi satu ke yang lainnya.

Sumber : Binanto (2010: 269)

Gambar II.1. Struktur Navigasi Linier

19

2. Struktur Navigasi Hirarki

Struktur dasar ini disebut juga struktur linier dengan percabangan karena

pengguna melakukan navigasi disepanjang cabang pohon struktur yang terbentuk

oleh logika isi.


Gambar II.2. Struktur Navigasi Hirarki

3. Struktur Navigasi Tidak Berurut (Non-Linier).

Struktur navigasi non-linier merupakan pengembangan dari struktur navigasi

linier. Pada struktur ini diperkenankan membuat navigasi bercabang. Percabangan

yang dibuat pada struktur non-linier ini berbeda dengan percabangan pada struktur

hirarki, karena pada percabangan non-linear ini walaupun terdapat percabangan tetap

tiap-tiap tampilan mempunyai kedudukan yang sama yaitu tidak ada Master Page dan

Slave Page, pengguna akan melakukan navigasi dengan bebas melalui isi proyek

dengan tidak terikat dengan jalur yang sudah ditentukan sebelumnya.


Gambar II.3. Struktur Navigasi Tidak Berurut (Nonlinier)

http://ehnanda.blogspot.com/


20

4. Struktur Navigasi Campuran (Composite)

Struktur Navigasi Campuran (Composite) Struktur navigasi pengguna akan

melakukan navigasi dengan bebas (secara non-linier), tetapi terkadang dibatasi

presentasi linier film atau informasi penting dan pada data yang paling terorganisasi

secara logis pada suatu hirarki.


Gambar II.4. Struktur Navigasi Campuran (Composite)

B. ERD

Sutanta (2011:91) menjelaskan bahwa "Entity Relationship Diagram (ERD)

merupakan suatu model data yang dikembangkan berdasarkan objek".

1. Komponen ERD

Sutanta (2011:91) juga menjabarkan Komponen Entity Relationship Diagram

adalah sebagai berikut :

a. Entitas

Entitas merupakan suatu objek yang dapat dibedakan dari lainnya yang dapat

diwujudkan dalam basis data. Objek dasar dapat berupa orang, benda, atau hal


21

yang keterangannya perlu disimpan didalam basis data. Untuk menggambarkan

sebuah entitas digunakan aturan sebagai berikut :

1) Entitas dinyatakan dengan simbol persegi panjang.

2) Nama entitas dituliskan didalam simbol persegi panjang.

3) Nama entitas berupa kata benda, tunggal.

4) Nama entitas sedapat mungkin menggunakan nama yang mudah dipahami

dan dapat menyatakan maknanya dengan jelas.

b. Atribut

Atribut merupakan keterangan-keterangan yang terkait pada sebuah entitas

yang perlu disimpan dalam basis data. Atribut berfungsi sebagai penjelas pada

sebuah entitas. Untuk menggambarkan atribut digunakan aturan sebagai

berikut:

1) Atribut digambarkan dengan simbol ellips.

2) Nama atribut dituliskan didalam simbol ellips.

3) Nama atribut merupakan kata benda, tunggal.

4) Nama atribut sedapat mungkin menggunakan nama yang mudah dipahami


c. Relasi

Relasi merupakan hubungan antara sejumlah entitas yang berasal dari

himpunan entitas yang berbeda. Aturan penggambaran relasi adalah sebagai

berikut :

1) Relasi dinyatakan dengan simbol belah ketupat.

2) Nama relasi dituliskan didalam simbol belah ketupat.

22

3) Nama relasi berupa kata kerja aktif.

4) Nama relasi sedapat mungkin menggunakan nama yang mudah dipahami


2. Derajat Relationship

Derajat relationship yang menjelaskan jumlah entity yang bervariasi dalam

suatu relationship. Dalam derajat relationship terbagi dari tiga tingkatan yaitu:

a. UnaryDegree( Derajat Satu ) Unary atau derajat satu adalah satu buah

relationship menghubungkan satu buah entity.

Manusia Menikah

Sumber : Nugroho (2009:17)

Gambar II.5. Contoh Unary Degree

Keterangan : Manusia menikah dengan manusia, relationship menikah hanya

meghubungkan entity manusia.

b. Binary Degree ( Derajat Dua ) Binary Degree atau derajat dua adalah satu

buah relationship yang menghubungkan dua buah entity.

Pegawai Memiliki Kendaraan


Gambar II.6. Contoh Binary Degree

Keterangan : Pegawai memiliki kendaraan, sebuah relationship memilih

menghubungkan menghubungkan entity Pegawai dan entity Kendaraan.

23

c. Ternary Degree ( Derajat Tiga ) Termary Degree (derajat tiga) adalah satu

buah relationship menghubungkan tiga buah entity.

Pegawai Bekerja Proyek

KOTA


Gambar II.7. Contoh Ternary Degree

Keterangan : Pegawai pada kota tertentu mempunyai suatu proyek. Entity

Bekerja menghubungkan Entity Pegawai, Proyek, dan kota.

3. Cardinality Ratio Constraint

Menunjukkan jumlah maksimum entitas yang dapat berelasi dengan entitas

pada himpunan entitas yang lain.

a. One To One (1:1)

Yaitu perbandingan antara entity pertama dengan entity kedua berbanding satu

berbanding satu.

Pasien Ditempatkan Kendaraan1 1


Gambar II.8. Contoh Cardinality One To One

24

b. One To One (1:M)

Yaitu perbandingan antara entity pertama dengan entity kedua berbanding

satu berbanding banyak.

Pegawai Bekerja Proyek1 M

Sumber :Nugroho (2009:23)

Gambar II.9. Contoh Cardinality One To Many

c. Many To One (M:1)

Yaitu perbandingan antara entity pertama dengan entity kedua berbanding

banyak berbanding satu.

Sumber :Nugroho (2009:27)

Gambar II.10. Contoh Cardinality Many To One

d. Many To Many (M:M)

Yaitu perbandingan antar entity pertama dengan entity kedua berbanding

banyak berbanding banyak.


Gambar II.11. Contoh Cardinality Many To Many

25

C. LRS

Prihartoni menjabarkan (2008:81) “Logical record structure (LRS) dibentuk

dengan nomor dari tipe record, beberapa record digambarkan oleh kotak empat

persegi panjang dan dengan nama yang unik”. Perbedaan LRS dengan diagram E-R

nama tipe record berada diluar kotak field tipe record ditempatkan, Logical record

structure terdiri dari link-link diantara tipe record. Link ini menunjukkan arah dari

satu tipe record lainnya.

Dua metode yang digunakan, dimulai dengan hubungan kedua model yang

dapat dikonversikan ke LRS, metode yang lain dimulai dengan ERD dan langsung

dikonversikan ke LRS.

D. Pengujian web

Menurut Simarmata (2011:283) “Pengujian perangkat lunak adalah sebuah

proses terhadap aplikasi atau program untuk menemukan segala kesalahan dan segala

kemungkinan yang akan menimbulkan kesalahan sesuai spesifikasi perangkat lunak

yang telah ditentukan sebelum aplikasi tersebut diserahkan kepada customer”.

Pengertian Black Box testing Menurut Rizky (2011:264), “black box testing

adalah tipe testing yang memperlakukan perangkat lunak yang tidak diketahui kinerja

internalnya. Dengan demikian black box testing dapat disimpulkan sebagai jenis

pengujian perangkat lunak layaknya seperti "kotak hitam" yang tidak penting dilihat

isinya, tapi cukup dikenal proses testing di bagian luar”.

26

BAB III

PEMBAHASAN

3.1 Tinjauan Perusahaan

Toko Salfa Jakarta adalah industri perorangan yang didirikan oleh bapak

Masril pada tahun 1995 dan saat ini berlokasi di Jl. Ps. Palmeriam Kios blok A No.

77 Kelurahan Palmeriam Kecamatan Matraman Jakarta Timur. Toko Salfa Jakarta

merupakan industry kecil yang bergerak di bidang penjualan sepatu. Kegiatan

operasional industri kecil ini berdasarkan atas pesanan yang diterima dari

konsumen (Job Order). Pendirian usaha ini berawal dari niat sang pemilik yang

pada saat itu berprofesi sebagai Karyawan di perusahaan swasta yang

berkeinginan mencoba berkecimpung di dunia bisnis. Melirik peluang pasar yang

cukup menjanjikan di bidang sepatu, pemilikpun menjatuhkan pilihannya untuk

membuka usaha di bidang ini. Pada awal usahanya perusahaan ini hanya menjual

sepatu sekolah saja yang mayoritas merupakan pembeli dari Jakarta. Namun

seiring berjalannya waktu permintaan pasarpun semakin beragam.

Hal ini memaksa Toko Salfa Jakarta untuk dapat mengikuti selera konsumen

agar tetap terus bertahan. Hingga saat ini Toko salfa Jakarta telah menjual

berbagai jenis Sepatu seperti warrior, dallas, nb ,nike ,att ,adidas, vans, dan lain

sebagainya.

A. Sejarah Industri/Perusahaan

Industri kecil Toko Salfa Jakarta ini dengan nomor siup 06811-

05/PK/1.824.271 dinamakan langsung oleh pemiliknya. Di namakan Salfa karena

27

memiliki arti Salsa dan Fahmi. Menurutnya alasan kenapa harus dinamakan Salfa

karena saat didirikannya toko tersebut telah lahir anak ke 2 (Dua) dari Bapak

Masril telah lahir dan diberi nama Fahmi, lalu beliau langsung menamakan toko

tersebut terinspirasi dari nama kedua anaknya. oleh sebab itu Salfa menurutnya

adalah nama yang tepat untuk industri kecil tersebut. Berdiri pada tanggal 17

September 1995, berawal dari percobaan menjual sepatu untuk sekolah dan

dilihatnya menarik untuk di kembangkan serta mengambil pendapat dari beberapa

rekan menurutnya bagus pada saat itu juga pemilik tersebut melihat peluang yang

baik untuk di kembangkannya kemampuan tersebut dalam usaha industri kecil

sepatu. Pada awal usahanya industry kecil ini hanya menjual sepatu untuk sekolah

saja yang mayoritas merupakan pembeli dari Jakarta.

Semua hal Penjualan awalnya diproses di rumah sendiri yang beralamatkan di

Jl. Keramat Asam No. 12 RT. 010 RW. 006 Kelurahan Utan Kayu Selatan

Kecamatan Matraman Jakarta Timur karena alasan modal untuk menyewa tempat

belum dimiliki oleh pemilik industri kecil tersebut. Namun karena tempat di

rumah tidak memungkinkan akhirnya setelah berjalannya industri kecil tersebut

selama 2 tahun mulailah pemilik mencari lokasi yang strategis untuk

mengembangkan usahanya dikarenakan permintaan dari hari kehari semakin pesat.

Pada akhir juli akhirnya pemilik menyewa kios di daerah Jl. Ps. Palmeriam Kios

blok A No. 11 Kelurahan Palmeriam Kecamatan Matraman Jakarta Timur. Toko

Salfa Jakarta adalah sebuah industri kecil usaha yang bergerak di bidang sepatu

yang dalam praktek usahanya Toko Salfa Jakarta melakukan kegiatan penjualan

berdasarkan atas spesifikasi yang ditentukan oleh pembeli. Dalam menjalankan

kegiatan usahanya Toko Salfa Jakarta selalu berusaha mengutamakan kepuasan

28

konsumen dengan memberikan kualitas produk yang baik dan sesuai keinginan

konsumen.

B. Struktur Organisasi dan Fungsi

Pada dasarnya suatu perusahaan atau industry kecil perlu membuat struktur

organisasi yang secara rinci menjelaskan mengenai tugas, tanggung jawab, dan

wewenang tiap- tiap fungsi yang terdapat di dalamnya. Dengan dibentuknya

struktur organisasi dimaksudkan agar dapat mengarahkan semua anggota

organisasi dalam menjalankan tugasnya untuk mencapai tujuan perusahaan atau

industri yang diharapkan.

Struktur organisasi pada manajemen Toko Salfa Jakarta masih tergolong

sederhana. Pemilik perusahaan menjabat sebagai pemimpin yang langsung

membawahi bagian keuangan, dan bagian umum. Berikut gambaran struktur

organisasi Toko Salfa Jakarta:

Sumber : Pemilik Toko Salfa Jakarta

Gambar III.1

Struktur Organisasi Toko Salfa Jakarta

Pemilik

Bagian

Keuangan

Bagian

Umum

29

Berdasarkan struktur organisasi pada pembahasan diatas, penulis mencoba

menerangkan uarian tugas dan fungsi pada bagian Struktur Organisasi.

1. Pemilik

Berdasarkan jenis usahanya yaitu perorangan, pemilik bertanggung jawab

penuh atas assets, kewajiban, dan modal industry kecil ini. Dalam aktivitas

usahanya pemilik sebagai pemimpin industri ini bertanggungjawab dalam

mengawasi dan mengontrol seluruh kegiatan operasional industri.

2. Bagian Keuangan

Yang bertanggung jawab dalam mencatat setiap transaksi dan membuat

pembukuan atas penerimaan dan pengeluaran kas.

3. Bagian Umum

Yang bertanggung jawab atas kegiatan seperti menerima order, melakukan

penawaran, dan melayani konsumen.

3.2 Analisa Kebutuhan

Dalam rekayasa sistem dan rekayasa perangkat lunak, analisis kebutuhan

mencakup pekerjaan-pekerjaan penentuan kebutuhan atau kondisi yang harus

dipenuhi dalam suatu produk baru atau perubahan produk, yang

mempertimbangkan berbagai kebutuhan yang bersinggungan antar berbagai

pemangku kepentingan. Kebutuhan dari hasil analisis ini harus dapat

dilaksanakan, diukur, diuji, terkait dengan kebutuhan bisnis yang teridentifikasi,

serta didefinisikan sampai tingkat detai yang memadai untuk desain sistem.

Sistem informasi dalam aplikasi ini terdapat tiga pengguna yaitu pengunjung,

30

pelanggan, administrator memiliki karateristik interaktif dengan sistem yang

berbeda-beda dan memiliki kebutuhan yang berbeda-beda, seperti:

A. Kebutuhan Pengguna

Pada sistem infromasi ini terdapat 3 pengguna, yaitu admin, pengunjung dan

pelanggan dengan mempunyai masing-masing kebutuhan sebagai berikut:

1. Administrator

a. Mengelola data barang

b. Mengelola data admin

c. Mengelola data pelanggan

d. Mengelola data kota

e. Mengelola data kategori

f. Mengelola data konfirmasi

g. Mengelola data pemesanan

h. Mengola data laporan penjualan

2. Pengunjung

a. Menampilkan beranda pengunjung

b. Menampilkan form barang berupa spesifikasi gambar, harga dan

deskripsi mengenai keterangan dari produk tersebut.

c. Menampilkan form pendaftaran jika ingin menjadi member dan dapat

memesan produk yang diinginkan.

d. Menampilkan form Tentang toko mengenai sejarah singkat toko

e. Menampilkan form cara pembelian jika ingin memesan barang yang di

minati

31

f. Menampilkan form cara pembayaran untuk melunasi harga barang yang

telah di pesan

g. Menampilkan form testimoni untuk request barang yang di inginkan

h. Menampilkan form semua kategori jika ingin mellihat semua barang

yang di jual

i. Menampilkan form sepatu snaker dan skate jika ingin melihat sepatu

dengan satu model tertentu

j. Menampilkan form sepatu formal jika ingin melihat sepatu dengan satu

model tertentu

k. Menampilkan form sepatu boots jika ingin melihat sepatu dengan satu

model tertentu

l. Menampilkan form memo bila ingin member masukan tampilan website

agar lebihbaik lagi

3. Pelanggan

a. Menampilkan beranda pelanggan

b. Menampilan from data transaksi untuk melihat status pembelian menjadi

lunas jika sudah di konfirmasi oleh admin.

c. Menampilkan form barang berupa spesifikasi gambar, harga dan

deskripsi mengenai keterangan dari produk tersebut

d. Menampilkan form Tentang toko mengenai sejarah singkat toko

e. Menampilkan form cara pembelian jika ingin memesan barang yang di

minati

32

f. Menampilkan form cara pembayaran untuk melunasi harga barang yang

telah di pesan

g. Menampilkan form testimoni untuk request barang yang di inginkan

h. Menampilkan form semua kategori jika ingin mellihat semua barang

yang di jual

i. Menampilkan form sepatu snaker dan skate jika ingin melihat sepatu

dengan satu model tertentu

j. Menampilkan form sepatu formal jika ingin melihat sepatu dengan satu

model tertentu

k. Menampilkan form sepatu boots jika ingin melihat sepatu dengan satu

model tertentu

l. Menampilkan form profil pelanggan

m. Menampilkan form data transaksi jika ingin melihat informasi status

pembayaran

n. Menampilkan form memo bila ingin member masukan tampilan website

agar lebihbaik lagi

3.3. Perancangan Perangkat Lunak

Adapun perancangan perangkat lunak yang penulis gunakan dalam

pembuatan website sebagai berikut:

A. Rancangan Antar Muka Administrator

Pada rancangan antar muka (interface) ini penulis akan menggambarkan

semua rancangan tampilan yang ada.

33

a. Rancangan Antar Muka Login Administrator

Gambar III.2. Rancangan Antar Muka Login Administrator

b. Rancangan Antar Muka Halaman Beranda Administrator

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>BERANDA

>>Admin

>>Pelanggan

>>Kota

>>Kategori

>>Barang

>>Pemesanan

>>Konfirmasi

Selamat Datang

Selamat datang di Toko Salfa Jakarta Administrator

Gambar III.3. Rancangan Antar Muka Beranda Administrator

From Login

Password

Username

XXXXX

XXXXX

34

c. Rancangan Antar Muka Halaman Data Administrator

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>ADMIN

>>Pelanggan

>>Kota

>>Kategori

>>Barang

>>Pemesanan

>>Konfirmasi

Admin

Tambah Admin

No Nama Username Password Tools

X

X

XXXXXXXXX

XXXXXXXXX

XXXXXXXXX

XXXXXXXXX

XXXXXXXXX

XXXXXXXXX

Halaman : [ 1 ]

Gambar III.4. Rancangan Antar Muka Halaman Data Administrator

d. Rancangan Antar Muka Halaman Data Pelanggan

Apabila berhasil login, akan menampilkan halaman Pelanggan, berikut

rancangannya:

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>Admin

>>PELANGGAN

>>Kota

>>Kategori

>>Barang

>>Pemesanan

>>Konfirmasi

Pelanggan

No Kota

Halaman : [ 1 ]

Nama Email No. Telepon Alamat

XXXXXX

XXXXXX

999999999

999999999

XXXXXXXXXXX

XXXXXXXXXXX

X

X XXXXXX

XXXXXX XXXXX

XXXXX

Gambar III.5. Rancangan Antar Muka Halaman Data Pelanggan

35

e. Rancangan Antar Muka Halaman Data Kota

Apabila berhasil login, akan menampilkan halaman Kota, berikut

rancangannya:

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>Admin

>>Pelanggan

>>KOTA

>>Kategori

>>Barang

>>Pemesanan

>>Konfirmasi

Kota

Tambah Kota

No Tools

Halaman : [ 1 ]

Nama Kota Ongkos Kirim (Rp)

999999

999999

X

X

XXXXXXX

XXXXXXX

Gambar III.6. Rancangan Antar Muka Halaman Data Kota

f. Rancangan Antar Muka Halaman Data Kategori

Apabila berhasil login, akan menampilkan halaman Kategori, berikut

rancangannya:

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>Admin

>>Pelanggan

>>Kota

>>KATEGORI

>>Barang

>>Pemesanan

>>Konfirmasi

Kategori

Tambah Data

No Tools

Halaman : [ 1 ]

Nama Kategori

X

X

XXXXXXX

XXXXXXX

Gambar III.7. Rancangan Antar Muka Halaman Data Kategori

36

g. Rancangan Antar Muka Halaman Data Barang

Apabila berhasil login, akan menampilkan halaman Barang, berikut

rancangannya:

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>Admin

>>Pelanggan

>>Kota

>>Kategori

>>BARANG

>>Pemesanan

>>Konfirmasi

Barang

Tambah Data

No Tools

Halaman : [ 1 ]

Gambar Id Barang Nama Barang Harga Stok

9999

9999

9999

9999

XXX

XXX

XXXXXXXX

XXXXXXXX

X

X

gambar

gambar

Gambar III.8. Rancangan Antar Muka Halaman Data Barang

h. Rancangan Antar Muka Halaman Data Pemesanan

Apabila berhasil login, akan menampilkan halaman Pememesan, berikut

rancangannya:

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>Admin

>>Pelanggan

>>Kota

>>Kategori

>>Barang

>>PEMESANAN

>>Konfirmasi

Data Transaksi

Laporan

No Status Tools

XXX

XXX

Halaman : [ 1 ]

No.

PemesanNama Tanggal

Total bayar

(Rp)

Ongkos Kirim

(Rp)

9999

9999

9999

9999

X99

X99

XXX

XXX

YY-MM-DD

YY-MM-DD

X

X

Gambar III.9. Rancangan Antar Muka Halaman Data Pemesanan

37

i. Rancangan Antar Muka Halaman Data Konfirmasi

Apabila berhasil login, akan menampilkan halaman Konfirmasi, berikut

rancangannya:

FOOTER

HEADER

<<LOGOUT

MENU-----------------------

>>Beranda

>>Admin

>>Pelanggan

>>Kota

>>Kategori

>>Barang

>>Pemesanan

>>KONFIRMASI

Konfirmasi

No Keterangan

Halaman : [ 1 ]

No.

PesananAtas Nama No. Rekening Rek. Tujuan Transfer (Rp)

9999999

9999999

XXXXX

XXXXX

XXXXX

XXXXX

99999999999

99999999999

X

X X9999

X9999 XXXXX

XXXXX

Gambar III.10. Rancangan Antar Muka Halaman Data Konfirmasi

B. Rancangan Antar Muka Pengunjung

a. Apabila pengunjung membuka http://localhost/web_sepatu/index.php akan

melihat gambaran web, berikut rancangannya:

Gambar

0

BERANDA Barang Tentang Toko Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori

>>Sepatu Snaker & Skate

>>Sepatu Formal

>>Sepatu Boots

>>Memo

Informasi Kontak-------------------------------------------------

BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar

Copyright ©2017 SalfaJakarta.Com

Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Gambar

Produk Baru

Gambar Gambar Gambar Gambar

XXXXXXXXXXXX XXXXXXXXXXXX

Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-


XXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-

Metode Pengiriman------------------------------------------------

Gambar Gambar Gambar

Gambar III.11. Rancangan Antar Muka Beranda Pengunjung

http://localhost/web_sepatu/index.php

38

b. Rancangan Antar Muka Halaman Barang Pengunjung

Gambar

0

Beranda BARANG Tentang Toko Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.12. Rancangan Antar Muka Halaman Barang

Pengunjung

c. Rancangan Antar Muka Halaman Semua Kategori Pengunjung

Gambar

0

Beranda Barang Tentang Toko Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>SEMUA KATEGORI


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.13. Rancangan Antar Muka Halaman Semua Kategori

Pengunjung

39

d. Rancangan Antar Muka Halaman Sepatu Snaker dan Skate Pengunjung

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori

>>SEPATU SNAKER & SKATE

>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.14. Rancangan Antar Muka Halaman Sepatu Snaker dan

Skate Pengunjung

e. Rancangan Antar Muka Halaman Sepatu Formal Pengunjung

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>SEPATU FORMAL

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.15. Rancangan Antar Muka Halaman Sepatu Formal

Pengunjung

40

f. Rancangan Antar Muka Halaman Sepatu Boots pengunjung

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>SEPATU BOOTS

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.16. Rancangan Antar Muka Halaman Sepatu Boots

Pengunjung

g. Rancangan Antar Muka Halaman Memo Pengunjung

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>MEMO


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Buku Tamu



Komentar dan Saran Anda Sangat Kami Butuhkan

Untuk Meningkatkan Kualitas Situs Kami

Nama Anda

Email Anda

Komentar

:

:

:

XXXXXXXXXXXXXXXXXXXXXXXX








Kirim Batal

[ Lihat Buku Tamu ]

Gambar III.17. Rancangan Antar Muka Halaman Memo Pengunjung

41

h. Rancangan Antar Muka Halaman Tentang Toko Pengunjung

Gambar

0

Beranda Barang TENTANG TOKO Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Gambar

Sejarah Singkat Toko

TOKO SALFAJAKARTA.COMXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX







salfajakarta.com

Gambar III.18. Rancangan Antar Muka Halaman Tentang Toko

Pengunjung

i. Rancangan Antar Muka Halaman Cara Pembelian Pengunjung

Gambar

0

Beranda Barang Tentang Toko PEMBELIAN Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Pembelian

1. XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX



XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX






Gambar III.19. Rancangan Antar Muka Halaman Cara Pembelian

Pengunjung

42

j. Rancangan Antar Muka Halaman Cara Pembayaran Pembayaran

Gambar

0

Beranda Barang Tentang Toko Pembelian PEMBAYARAN Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Pembayaran






Daftar Rekening

Mandiri : 9999999999999

Bca : 9999999999999

Gambar III.20. Rancangan Antar Muka Halaman Cara Pembayaran

Pengunjung

k. Rancangan Antar Muka Halaman Testimoni Pengunjung

Gambar

0

Beranda Barang Tentang Toko Pembelian Pembayaran TESTIMONI Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Testimoni

No Nama Tanggal Testimoni

Halaman : [ 1 ]

Tulis Testimoni

1

1

XXXXXXXXXXXXX

XXXXXXXXXXXXX

YYYY-MM-DD

YYYY-MM-DD

XXXXXXXXXXXXX

XXXXXXXXXXXXX

Gambar III.21. Rancangan Antar Muka Halaman Testimoni

Pengunjung

43

l. Rancangan Antar Muka Halaman Login pengunjung

Gambar

0

Beranda Barang Tentang Toko Pembelian Pembayaran Testimoni LOGIN

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Login

Username

Password

Login

Register

Gambar III.22. Rancangan Antar Muka Halaman Login Pengunjung

m. Rancangan Antar Muka Halaman Register Pengunjung

Apabila pengunjung membuka form login lalu memilih register maka akan

tampil form register sebagai berikut :

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Form Pendaftaran

Nama Lengkap XXXXXXXXXXXXXXXXX

EmailXXXXXXXXXXXXXXXXXX

Simpan

Username

No. Telepon

Password

Alamat

Kode Pos

Kota

99999999

JL. XXXXXXXX KEC : XXX

KEL : XXXXX

XXXXXXXXXXXXXX

99999

XXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXX

Gambar III.23. Rancangan Antar Muka Halaman Register

Pengunjung

44

C. Rancangan Antar Muka Pelanggan

a. Apabila pelanggan membuka http://localhost/web_sepatu/index.php akan

melihat gambaran web, berikut rancangannya:

Gambar

0

BERANDA Barang Tentang Toko Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Gambar

Produk Baru



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar III.24. Rancangan Antar Muka Halaman Beranda Pelanggan

b. Rancangan Antar Muka Halaman Barang Pelanggan

Gambar

0

Beranda BARANG Tentang Toko Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.25. Rancangan Antar Muka Halaman Barang Pelanggan

http://localhost/web_sepatu/index.php

45

c. Rancangan Antar Muka Halaman Semua Kategori Pelanggan

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>SEMUA KATEGORI


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.26. Rancangan Antar Muka Halaman Semua Kategori

Pelanggan

d. Rancangan Antar Muka Halaman Sepatu Snaker dan Skate Pelanggan

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori

>>SEPATU SNAKER & SKATE

>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.27. Rancangan Antar Muka Halaman Sepatu Snaker dan

Skate Pelanggan

46

e. Rancangan Antar Muka Halaman Sepatu Formal Pelanggan

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>SEPATU FORMAL

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.28. Rancangan Antar Muka Halaman Sepatu Formal

Pelanggan

f. Rancangan Antar Muka Halaman Sepatu Boots Pelanggan

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>SEPATU BOOTS

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Barang



Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,- Rp. 99999,-

XXXXXXXXXXXX

Rp. 99999,-



Rp. 99999,- Rp. 99999,- Rp. 99999,- Rp. 99999,-



Gambar

Halaman : [ 1 ]

Gambar III.29. Rancangan Antar Muka Halaman Sepatu Boots

Pelanggan

47

g. Rancangan Antar Muka Halaman Memo Pelanggan

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>MEMO


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar

Buku Tamu



Komentar dan Saran Anda Sangat Kami Butuhkan

Untuk Meningkatkan Kualitas Situs Kami

Nama Anda

Email Anda

Komentar

:

:

:









Kirim Batal

[ Lihat Buku Tamu ]

Gambar III.30. Rancangan Antar Muka Halaman Memo Pelanggan

h. Rancangan Antar Muka Halaman Tentang Toko Pelanggan

Gambar

0

Beranda Barang TENTANG TOKO Pembelian Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Gambar

Sejarah Singkat Toko

TOKO SALFAJAKARTA.COMXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX








salfajakarta.com

Gambar III.31. Rancangan Antar Muka Halaman Tentang Toko

Pelanggan

48

i. Rancang Muka Antar Muka Halaman Cara Pembelian Pelanggan

Gambar

0

Beranda Barang Tentang Toko PEMBELIAN Pembayaran Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Pembelian










Gambar III.32. Rancangan Antar Muka Halaman Cara Pembelian

Pelanggan

j. Rancangan Antar Muka Halaman cara Pembayaran Pelanggan

Gambar

0

Beranda Barang Tentang Toko Pembelian PEMBAYARAN Testimoni Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Pembayaran






Daftar Rekening

Mandiri : 9999999999999

Bca : 9999999999999

Gambar III.33. Rancangan Antar Muka Halaman Cara Pembayaran

Pelanggan

49

k. Rancangan Antar Muka Halaman Testimoni Pelanggan

Gambar

0

Beranda Barang Tentang Toko Pembelian Pembayaran TESTIMONI Login

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Testimoni

No Nama Tanggal Testimoni

Halaman : [ 1 ]

Tulis Testimoni

1

1

XXXXXXXXXXXXX

XXXXXXXXXXXXX

YYYY-MM-DD

YYYY-MM-DD

XXXXXXXXXXXXX

XXXXXXXXXXXXX

Gambar III.34. Rancangan Antar Muka Halaman Testimoni

Pelanggan

l. Rancangan Antar Muka Halaman Data Transaksi Pelanggan

Gambar0

Beranda Barang Tentang Toko Pembelian Pembayaran Testimoni DATA TRANSAKSI

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Data Transaksi

No

1

1

Logout

Id Pesan Nama Total bayar (Rp) Ongkir (Rp) Subtotal (Rp) Status

X999

X999

XXXX 99999

XXXX 99999

99999

99999

99999

99999

XXXX

XXXX

Gambar III.35. Rancangan Antar Muka Halaman Data Transaksi

Pelanggan

50

m. Rancangan Antar Muka Halaman Profil Pelanggan

Gambar0

Beranda Barang Tentang Toko Pembelian Pembayaran Testimoni Data transaksi

CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Profil Pelanggan

Nama Lengkap

Logout

Email

No. telepon

Kota

Kode Pos

Username

Password

Alamat

XXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXX

JL. XXXXXX KEL : XXXX

KEC : XXXXXX

XXXXXXXXXXX

99999999

XXXXXXXXXXXX

XXXXXXXXXXXXX

Update

Gambar III.36. Rancangan Antar Muka Halaman Profil Pelanggan

n. Rancangan Antar Muka Halaman Login Pelanggan

Gambar

0


CariCari...

Kategori-----------------------------------------------

>>Semua Kategori


>>Sepatu Formal

>>Sepatu Boots

>>Memo


BBM

9999999

Telepon9999999999999

Email

XXXXXXXXXXXX

Metode Pembayaran

------------------------------------------------

Gambar Gambar


Media Sosial--------------------------------------------------

gambargambar gambar

gambar gambar



Login

Username

Password

Login

Register

Gambar III.37. Rancangan Antar Muka Halaman Login Pelanggan

51

D. Rancangan Basis Data

Rancangan basis data menghasilkan pemetaan tabel-tabel yang digunakan

dengan Entity Relationship Diagram (ERD).

a. Entitiy Relationship Diagram

PELANGGAN

Id_pelanggan

Nm_pelanggan

email

alamat

teleopn

Id_kota

MELAKUKAN PESANAN

Id_pesan

Tgl_pesan

Total_bayar

status

Id_pelanggan

1

TERDIRI

1

1

DETAIL

PESANANBERISI

BARANG

Id_detail

jumbel Id_barang

Id_pesan

Id_barang

Nm_barang

gambar

deskripsi

harga

stok

Tgl_upload

Id_kategori

MEMILIKI KATEGORI

Id_kategori Nm_kategori

KONFIRMASI

Id_konfirmasi

Id_pesan

nama

No_rek

Bank_tujuan

Jml_transfer

M

1

M

1

1 1

1Kode_pos

username

password

keterangan

Id_pesan

Id_pelanggan

Id_detail

Id_barang

Id_barangId_kategori

Id_pesanl

Id_detail

Memiliki

Id_pesan

Id_konfirmasi

Gambar III.38. Entitiy Relationship Diagram

52

b. Logical Record Structure (LRS)

Pelanggan Pesanan Detail_pesanan Barang

Id_pelanggan*

Nm_pelanggan

Email

Telepon

Alamat

Kode_pos

Username

password

Id_pesan*

Tgl_pesan

Total_bayar

status

Id_pelanggan

Id_detail*

Jumbel

Id_barang

Id_pesan

Id_keranjang

Id_barang*

Nm_barang

gambar

deskripsi

Harga

Tgl_upload

Stok

Id_kategori

Konfirmasi Kategori

Id_konfirmasi*

Id_pesan

Nama

No_rek

Bank_tujuan

Jml_transfer

Keterangan

Id_pelanggan

Id_admin

Id_Kategori*

Nm_kategori

1

1

M 1

1

1

1 M1 1

Gambar III.39. Logical Record Struktur

c. Spesifikasi File

Spesifikasi file yang digunakan dalam perancangan program penjualan

web ini terdiri dari satu database, yaitu:

1. Tabel Admin

Nama database : db_sepatu

Nama tabel : admin

Akronim : admin.MYD

Fungsi : untuk menyimpan data admin

53

Tipe : File Master

Organisasi File : Index Sequential

Media File : Harddisk

Panjang record : 53 byte

Kunci Field : id_admin

Software : MySQL

TABEL III.1. Tabel Admin

No Nama Field Type Panjang Keterangan

1 Id_admin Int 3 Primary Key

2 Nama Varchar 30

3 Username Varchar 10

4 Password Varchar 10

2. Tabel Barang


Nama tabel : barang

Akronim : barang.MYD

Fungsi : untuk menyimpan data barang

Tipe : File Master



Panjang record : 158 byte

Kunci Field : id_barang

Software : MySQL

TABEL III.2. Tabel Barang


1 Id_barang Char 6 Primary Key

2 Nm_barang Varchar 30

3 Gambar Varchar 100

54

4 Deskrirpsi Text

5 Harga Double

6 Stok Int 11

7 Tgl_upload Date

8 Id_kategori Int 11 Foreign Key

3. Tabel Detail_Pesanan


Nama tabel : detail_pesanan

Akronim : detail_pesanan.MYD

Fungsi : untuk menyimpan data pesanan

Tipe : File Transaksi



Panjang record : 23 Byte

Kunci Field : id_detail

Software : MySQL

TABEL III.3. Tabel Detail_Pesanan


1 Id_detail Int 6 Primary Key

2 Jumbel Int 5

3 Id_barang Char 6 Foreign Key

4 Id_pesan Char 6 Foreign Key

4. Tabel Kategori


Nama tabel : kategori

Akronim : kategori.MYD

55

Fungsi : untuk menyimpan data kategori

Tipe : File Master




Kunci Field : id_kategori

Software : MySQL

Tabel III.4. Kategori


1 Id_kategori Int 3 Primary Key

2 Nm_kategori Varchar 30

5. Tabel Keranjang


Nama tabel : keranjang

Akronim : keranjang.MYD

Fungsi : untuk menyimpan data keranjang

Tipe : File Sementara




Kunci Field : id_keranjang

Software : MySQL

Tabel III.5. Keranjang


1 Id_kerajang Int 6 Primary Key

2 Id_barang Char 6 Foreign Key

3 Jumlah Int 5

56

4 Id_pelanggan Int 3 Foreign Key

6. Tabel Konfirmasi


Nama tabel : konfirmasi

Akronim : konfirmasi.MYD

Fungsi : untuk menyimpan data konfrimasi





Kunci Field : id_konfirmasi

Software : MySQL

Tabel III.6. Konfrimasi


1 Id_konfrimasi Int 3 Primary Key

2 Id_pesan Char 6 Foreign Key

3 Nama Varchar 30

4 No_rek Varchar 15

5 Bank_tujuan Varchar 20

6 Jml_transfer Double

7 Keterangan Text

7. Tabel Pelanggan


Nama tabel : pelanggan

Akronim : pelanggan.MYD

Fungsi : untuk menyimpan data pelanggan

57

Tipe : File Master




Kunci Field : id_pelanggan

Software : MySQL

Tabel III.7. Pelanggan


1 Id_Pelanggan Int 3 Primary Key

2 Nama_pelanggan Varchar 30

3 Email Varchar 30

4 Telepon Varchar 12

5 Alamat Text

6 Kode_pos Varchar 5

7 Username Varchar 12

8 Password Varchar 12

9 Id_kota Int 3 Foreign Key

8. Tabel Kota


Nama tabel : kota

Akronim : kota.MYD

Fungsi : untuk kota tujuan pengiriman barang

Tipe : File Master




Kunci Field : id_kota

58

Software : MySQL

Tabel III.8. Kota


1 Id_kota Int 3 Primary Key

2 Nm_kota Varchar 30

3 Ongkir Double

9. Tabel Pesanan


Nama tabel : pesanan

Akronim : pesanan.MYD

Fungsi : untuk menyimpan data pesanan





Kunci Field : id_pesan

Software : MySQL

Tabel III.9. Pesanan


1 Id_pesan Char 6 Primary Key

2 Tgl_pesan Date

3 Total_bayar Double

4 Status Enum

5 Id_pelanggan Int 3 Foreign Key

59

10. Tabel Buku_Tamu


Nama tabel : buku_tamu

Akronim : buku_tamu.MYD

Fungsi : untuk menyimpan data buku_tamu

Tipe : File Master




Kunci Field : id

Software : MySQL

Tabel III.10. Buku_Tamu


1 Id Int 3 Primary Key

2 Nama Varchar 30

3 Email Varchar 50

4 Pesan Text

11. Tabel Testimoni


Nama tabel : testimoni

Akronim : testimoni.MYD

Fungsi : untuk menyimpan data testimoni

Tipe : File Master




Kunci Field : id_testimoni

Software : MySQL

60

Tabel III.11. Testimoni


1 Id_testimoni Int 3 Primary Key

2 Nama Varchar 30

3 Tanggal Date

4 Isi_testimoni Text

E. Rancangan Struktur Navigasi

Index

Login

Beranda

Barang Tentang Toko Pembelian Pembayaran TestimoniData

TransaksiProfil Logout

Tulis

testimoni

Kirim Kembali

Cetak

Gambar III.40. Struktur Navigasi Pelanggan

61

Admin Pelanggan Kota Kategori Barang Pemesanan Konfirmasi Logout

Beranda

Login

Index

Tambah

Admin

Ubah Hapus

Tambah Kota

HapusUbah

Tambah Data

HapusUbah

Tambah Data

Ubah Hapus

Laporan

Proses LunasDetail

Transaksi

Gambar III.41. Struktur Navigasi Admin

3.4 Implementasi dan Pengujian Unit

A. Implementasi

a. Implementasi Rancangan Antar Muka Administrator

a. Halaman Login Administrator

Gambar III.42. Implementasi Halaman Login Administrator

62

b. Rancangan Antar Muka Halaman Beranda Administrator

Gambar III.43. Implementasi Halaman Beranda Administrator

c. Rancangan Muka Halaman Data Administrator

Gambar III.44. Implementasi Halaman Admin

63

d. Rancangan Antar Muka Halaman Data Pelanggan

Gambar III.45. Implementasi Halaman Data Pelanggan

e. Rancangan Antar Muka Halaman Data Kota

Gambar III.46. Implementasi Halaman Data Kota

64

f. Rancangan Antar Muka Halaman Data Kategori

Gambar III.47. Implementasi Halaman Data Kategori

g. Rancangan Antar Muka Halaman Data Barang

Gambar III.48. Implementasi Halaman Data Barang

65

h. Rancangan Antar Muka Halaman Data Pemesanan

Gambar III.49. Implementasi Halaman Data Pemesanan

i. Rancangan Antar Muka Halaman Data Konfirmasi

Gambar III.50. Implementasi Halaman Data Konfirmasi

66

B. Implementasi

a. Implementasi Rancangan Antar Muka Pengunjung

a. Rancangan Antar Muka Halaman Beranda Pengunjung

Gambar III.51. Implementasi Halaman Beranda Pengunjung

b. Rancangan Antar Muka Halaman Barang Pengunjung

Gambar III.52. Implementasi Halaman Beranda Pengunjung

67

c. Rancangan Antar Muka Halaman Tentang Toko Pengunjung

Gambar III.53. Implementasi Halaman Tentang Toko Pengunjung

d. Rancangan Antar Muka Halaman Cara Pembelian Pengunjung

Gambar III.54. Implementasi Halaman Cara Pembelian Pengunjung

68

e. Rancangan Antar Muka Halaman Cara Pembayaran Pengunjung

Gambar III.55. Implementasi Halaman Cara Pembayaran Pengunjung

f. Rancangan Antar Muka Halaman Testimoni Pengunjung

Gambar III.56. Implementasi Halaman Testimoni Pengunjung

69

g. Rancangan Antar Muka Halaman Login Pengunjung

Gambar III.57. Implementasi Halaman Login Pengunjung

h. Rancangan Antar Muka Halaman Register Pengunjung

Gambar III.58. Implementasi Halaman Register Pengunjung

70

i. Rancangan Antar Muka Halaman Semua Kategori Pengunjung

Gambar III.59. Implementasi Halaman Semua Kategori Pengunjung

j. Rancangan Antar Muka Halaman Sepatu Snaker dan Skate Pengunjung

Gambar III.60. Implementasi Halaman Sepatu Snaker dan Skate

Pengunjung

71

k. Rancangan Antar Muka Halaman Sepatu Formal Pengunjung

Gambar III.61. Implementasi Halaman Sepatu Formal Pengunjung

l. Rancangan Antar Muka Halaman Sepatu Boots Pengunjung

Gambar III.62. Implementasi Halaman Sepatu Boots Pengunjung

72

m. Rancangan Antar Muka Halaman Memo Pengunjung

Gambar III.63. Implementasi Halaman Sepatu Boots Pengunjung

C. Implementasi

a. Implementasi Rancangan Antar Muka Pelanggan

a. Rancangan Antar Muka Halaman Beranda Pelanggan

Gambar III.64. Implementasi Halaman Beranda Pelanggan

73

b. Rancangan Antar Muka Halaman Barang Pelanggan

Gambar III.65. Implementasi Halaman Barang Pelanggan

c. Rancangan Antar Muka Halaman Tentang Toko Pelanggan

Gambar III.66. Implementasi Halaman Tentang Toko Pelanggan

74

d. Rancangan Antar Muka Halaman Cara Pembelian Pengunjung

Gambar III.67. Implementasi Halaman Cara Pembelian Pelanggan

e. Rancangan Antar Muka Halaman Cara Pembayaran

Gambar III.68. Implementasi Halaman Cara Pembayaran Pelanggan

75

f. Rancangan Antar Muka Halaman Testimoni Pelanggan

Gambar III.69. Implementasi Halaman Testimoni Pelanggan

g. Rancangan Antar Muka Halaman Login Pelanggan

Gambar III.70. Implementasi Halaman Login Pelanggan

76

h. Rancangan Antar Muka Halaman Data Transaksi Pelanggan

Gambar III.71. Implementasi Halaman Data Transaksi Pelanggan

i. Rancangan Antar Muka Halaman Profil Pelanggan

Gambar III.72. Implementasi Halaman Profil Pelanggan

77

j. Rancangan Antar Muka Halaman Semua Kategori Pelanggan

Gambar III.73. Implementasi Halaman Semua Kategori Pelanggan

k. Rancangan Antar Muka Halaman Sepatu Snaker dan Skate Pelanggan

Gambar III.74. Implementasi Halaman Sepatu Snaker dan Skate

Pelanggan

78

l. Rancangan Antar Muka Halaman Sepatu Formal Pelanggan

Gambar III.75. Implementasi Halaman Sepatu Formal Pelanggan

m. Rancangan Antar Muka Halaman Sepatu Boots Pelanggan

Gambar III.76. Implementasi Halaman Sepatu Boots Pelanggan

79

n. Rancangan Antar Muka Halaman Memo Pelanggan

Gambar III.77. Implementasi Halaman Memo Pelanggan

D. Pengujuan Unit

Pengujian terhadap program yang dibuat menggunakan blackbox testing yang

focus terhdap proses masukan dan keluaran program.

a. Pengujian Terhadap from login admin

Tabel III.12. Hasil Pengujian Black Box Testing Halaman Form Login

Administrator

No Scenario Pengujian Test Case Hasil yang

diinginkan

Hasil

Pengujian

Kesimp

ulan

1 Username password

tidak diisi,

kemudian klik

Username:

(kosong)

password:

Sistem

memberikan

pesan,

Sesuai

harapan

Vaild

80

tombol login (kosong) username

dan

password

tidak boleh

kosong

2 Username diisi, dan

password tidak diisi,

kemudian klik

tombol login

Username:

Admin

(benar)

password:

(kosong)

Sistem

memberikan

pesan,

password

tidak boleh

kosong

Sesuai

harapan

Vaild

3 Username tidak

diisi, dan password

diisi, kemudian klik

tombol login

Username:

(kosong)

password:

Admin

(benar)

Sistem

memberikan

pesan,

password

tidak boleh

kosong

Sesuai

harapan

Vaild

4 Username dan

password diisi

dengn data salah,

kemudian klik

tombol login

Admin

(benar)

password :

adi (salah)

Sistem

menampilkan

kembali

halaman

login

Sesuai

harapan

Vaild

5 Username dan

password diisi

Admin

(benar)

Sistem

menerima

Sesuai

harapan

Vaild

81

dengn data benar,

kemudian klik

tombol login

password :

admin

(benar)

akses login,

dan menuju

menu utama

Tabel III.13. Hasil Pengujian Black Box Testing Halaman From Login

Pelanggan

No Scenario

Pengujian

Test Case Hasil yang

diinginkan

Hasil

Pengujian

Kesimpula

n

1 Username

password tidak

diisi, kemudian

klik tombol login

Username:

(kosong)

password:

(kosong)

Sistem

memberikan

pesan,

username

dan

password

kosong,

silakan isi

dengan benar

Sesuai

harapan

Vaild

2 Username diisi,

dan password

tidak diisi,

kemudian klik

tombol login

Username:

gatot

(benar)

password

(kosong)

Sistem

memberikan

pesan,

password

kosong,

silakan isi

Sesuai

harapan

Vaild

82

dengan benar

3 Username tidak

diisi, dan password

diisi, kemudian

klik tombol login

Username:

(kosong)

password

1234

(benar)

Sistem

memberikan

pesan,

usernsme

kosong,

silakan isi

dengan benar

Sesuai

harapan

Vaild

4 Username

password diisi

dengn data salah,

kemudian klik

tombol login

Age

(salah)

password :

age

(salah)

Sistem

menampilkan

ata username

dan

password

yang

dimasukan

belum banar

Sesuai

harapan

Vaild

5 Username dan

password diisi

dengan data yang

benar, kemudian

klik tombol login

gatot

(benar)

password :

12345

(benar)

Sistem

menerima

akses login,

dan menuju

menu utama

Sesuai

harapan

Vaild

83

Tabel III.14. Hasil Pengujian BlackBox Testing Halaman Daftar Pelanggan

No Scenario

Penguji

Test Cas Hasil Yang

Diharapkan

Hasil

Pengujian

Kesimpulan

1 Tidak mengisi

Nama

Lengkap,

email,

no.telepon,

alamat, kota,

kode pos, data

login,

kemudian klik

tombol daftar

Nama pelanggan:

Email:

No. Tlp:

username:

password :

Sistem

memberikan

pesan. Data

masih

kosong

Sesuai

harapan

Vaild

2 Mengisi nama

pelanggan dan

username.

Lalu email,

no.tlp, tidak

diisi kemudian

klik tombol

daftar

Nama pelanggan

: gatot

Email

No.tlp

Username: gatot

Password

Sesuai

harapan

Vaild

3 Mengisi email Nama pelanggan Sistem Sesuai Vaild

84

lalu nama

pelanggan,

email, no.tlp

data login

tidak diisi,

kemudian klik

tombol daftar

: email:

[email protected]

no.tlp:

username:

password:

memberikan

pesan, nama

pelanggan,

no.tlp,

username,

password

masih

kosong

harapan

4 Mengisi

username dan

password, lalu

nama

pelanggan,

email, no.tlp,

kosong

kemudian klik

tombol daftar

Nama pelanggan:

email:

no.tlp:

username:

gatot

password: 1234

Sistem

memberikan

pesan,

email,

no.tlp,

username

password

masih

kosong

Sesuai

harapan

Vaild

5 Mengisi nama

pelanggan,

email, no.tlp,

datalogin,

kemudian klik

tombol daftar

Nama pelanggan:

gatot

Email :

[email protected]

No.tlp:

08979732892

Username: gatot

Sistem

menerima

akses daftar,

dan menuju

menu utama

Sesuai

harapan

Vaild

mailto:[email protected]

85

Password: admin

Tabel III.15. Hasil Pengujian BlackBox Testing Halaman Pemesanan

No Scenario

Penguji

Test Cas Hasil Yang

Diharapkan

Hasil

Penguji

an

Kesimpula

n

1 Jika di klik

beli maka

akan muncul

form

keranjang

belanja.

Lalu pilih

berapa jumlah

yg di beli lalu

klik update

maka harga

akan

terhitung dari

jumlah yang

di beli

Beli

Masukan jumlah

barang yg di beli :

2

update

Harga : Rp.

480000

Sistem

menerima

akses jumlah

beli dan siap

untuk di

konfirmasi

jika mengklik

tombol

selesai

belanja.

Jika ingin

membeli

brang lagi

maka klik

tombol lanjut

belanja.

Sesuai

harapan

Vaild

86

Jika di klik

tombol hapus

maka jumlah

barang yang

di beli akan

terhapus

2 Jika mengklik

tombol

selesai

belanja maka

akan tampil

form pesanan

yg terdiri dari

kode barang,

nama produk,

harga produk

,jumlah dan

subtotal

berserta nama

pemesan

,email

,telepon ,

alamat, kota

dank kode

No : 1

Kode produk :

SF0016

Nama produk :

nike

Harga :

Rp. 250000

Jumlah : 1

Subtotal : Rp.

500000

Nama Pemesan :

dinar

Email :

dinar@nusamandir

i.ac.id

alamat :

pamulang

Kota : Bogor

Sistem

menerima

akses

pembelian

dan siap di

konfirmasi

jika mengklik

tombol proses

dan akan

menampilkan

form data

transaksi.

Jika mengklik

lanjut belanja

maka akan

menampilkan

form barang.

Sesuai

harapan

Vaild



87

pos Kode pos :13333

Tabel III.16. Hasil Pengujian BlackBox Testing Halaman Konfirmasi

Pembayaran

No Scenario

Penguji

Test Case Hasil Yang

Diharapkan

Hasil

Pengujian

Kesimpulan

1 Tidak mengisi

no.pemesanan,

nama

pelanggan,

jumlah

transfer,

keterangan,

tidak diisi

kemudian klik

kirim

No.pemesanan:

Nama

pelanggan:

Jumlah

transfer:

Keterangan:

Sistem

memberikan

pesan. Semua

data masih

kosong

Sesuai

harapan

Vaild

2 mengisi

no.pemesanan,

lalu nama

pelanggan,

jumlah

transfer,

keterangan,

tidak diisi

kemudian klik

kirim

No.pemesanan:

SF0001

Nama

pelanggan:

Jumlah

transfer:

Keterangan:

Sistem

memberikan

pesan, nama

pelanggan,

jumlah

transfer,

keterangan

Sesuai

harapan

Vaild

88

tidak boleh

kosong

3 mengisi nama

pelanggan, dan

no.pemesanan,

jumlah

transfer,

keterangan,

tidak diisi

kemudian klik

kirim

No.pemesanan:

Nama

pelanggan:

gatot

Jumlah

transfer:

keterangan

Sistem

memberikan

pesan,

no.pemesanan,

jumlah

transfer,

keterangan

tidak boleh

kosong

Sesuai

harapan

Vaild

4 mengisi

jumlah

transfer, dan

no.pemesanan,

nama

penerima,

keterangan,

tidak diisi,

kemudian klik

kirim

No.pemesanan:

nama

pelanggan:

Jumlah

trasnfer:

100000

Keterangan:

Sistem

memberikan

pesan,

no.pemesanan,

nama

pelanggan,

keterangan,

tidak boleh

kosong

Sesuai

harapan

Vaild

5 Mengisi

no.pemesanan,

nama

pelanggan,

jumlah

transfer,

keterangan

kemudian klik

No.pemesanan:

SF0001

Nama

pelanggan:

Sistem

menerima

akses

konfirmasi,

Sesuai

harapan

Vaild

89

kirim gatot

jumlah transfer:

100000

Keterangan:

Yang cepet

sampai

dan menunggu

untuk di

konfirmasi

oleh admin

agar proses

status pesan

berubah

menjadi lunas

90

BAB IV

KESIMPULAN

4.1. Kesimpulan

Dengan selesainya penulisan tugas akhir ini yang menyangkut tentang

permasalahan yang terjadi pada penjualan sepatu salfa jakarta secara alternatif

pemecahan masalahnya yaitu dengan menerapkan sistem informasi penjualan sepatu

berbasis web pada toko salfa jakarta, maka pada bab ini penulis mengambil

kesimpulan atas apa yang telah dijabarkan pada bab-bab sebelumnya. Pada akhir

penulisan ini akan diuraikan secara garis besar dan apa yang telah dibahas mulai dari

sistem pengelolaan data master sampai dengan sistem transaksi penjualan yang secara

umum dapat disimpulkan secara berikut:

1. Perancangan sistem informasi penjualan sepatu berbasis web pada toko salfa

Jakarta digunakan sebagai alternatif pemecahan masalah yang dihadapi

selama ini, dengan adanya sistem ini kedepannya dapat membantu masyarakat

yang kesulitan dalam membeli barang yang dibutuhkan.

2. Dengan adanya perancangan sistem informasi penjualan sepatu berbasis web

pada toko salfa jakarta ini, penyajian informasi tentang penjualan sepatu toko

salfa Jakarta dapat disebarluaskan dengan mudah dan cepat.

3. Diharapkan dengan adanya website penjualan sepatu ini masyarakat dapat

terbantu dalam pembelian sepatu pada toko salfa jakarta.

4. Memberikan kemudahan Toko Salfa Jakarta untuk Mempromosikan Produk

91

4.2. Saran

Dengan kesimpulan diatas penulis memberikan beberapa saran diantaranya

adalah sebagai berikut:

1. Sistem berbasis komputer yang sebaiknya digunakan adalah perancangan

aplikasi penjualan sepatu berbasis web yang dipergunakannya lebih fleksibel

dan relatif lebih user interface. Dalam mengaksesnya pun lebih mudah karena

hanya memerlukan sebuah web browser dan koneksi internet.

2. Diharapkan agar selalu mengembangkan website ini, agar website ini menjadi

website yang lebih baik dan efisien.

3. Memperbaiki tampilan website yang masih kurang baik sehingga website ini

menjadi yang menarik dan usability.

4. Selalu mengupdate isi website penjualan sepatu ini agar website memiliki

informasi yang terbaru dan akurat.

92

DAFTAR PUSTAKA

Arif, M.Rudyanto. 2011. Pemograman Web Dinamis Menggunakan PHP &

MYSQL. Yogyakarta : Andi.

Binanto, Iwan 2010. Multimedia Digital Dasar Teori Dan Pengembangnya.

Yogyakarta : Andi Publisher.

Bernadhed. 2013. Sistem Informasi Pelayanan Produk Berbasis Vendor Berkart.

Yogyakarta : Prosiding Seminar Nasional Teknologi Informasi Dan

Multimedia (Semnasteknomedia).

Darma, Jarot S, dan Shenia Ananda. 2009. Buku Pintar Menguasai Internet.

Jakarta : Mediaki.

Hidayat, Rahmat. 2010. Jenis-Jenis Web Berdasarkan Style. Yogyakarta :

Erlangga.

Kadir, Abdul. 2009. Membuat Aplikasi Web Dengan PHP Dan Database MySQL.

Yogyakarta : Andi Offset.

Kustiyahningsih, Yeni. 2011. Pemrograman Basis Data Berbasis Web

Menggunakan PHP & MySQL. Jakarta: Graha Ilmu.

Limantara, Hans S. 2009. Jelajah Dunia Maya Dengan Cepat Dan Mudah. Jakarta :

PT. Elex Media Komputindo.

Munir, Rinaldi. 2001. Algoritma Dan Pemrograman Dalam Bahasa Pascal Dan C.

Bandung : CV. Informatika.

Nugroho, Adi. 2009. Rekayasa Perangkat Lunak Menggunakan UML Dan Java.

Yogyakarta : Andi.

Oktavian, Diar Puji. 2010. Menjadi Programmer Jempolan Menggunakan PHP.

Yogyakarta : Mediakom.

Prihartoni, Purnomo Vita. 2008. 100% Javascript. Jakarta : Dian Rakyat.

Raharjo, Budi. 2011. Belajar Otodidak Membuat Database Menggunakan MySQL.

Bandung : Informatika.

Rizky, 2011. Implementasi Dan Pengujian Perangkat Lunak. Bandung : Bumi

Aksara.

Rossa,A.S. dan M. Salahuddin. 2013. Rekayasa Perangkat Lunak. Bandung :

Informatika.

Sibero, Alexander F.K. 2011. Kitab Suci Web Programming. Jakarta : Mediakom.

Simarmata, 2010. Rekayasa Web. Yogyakarta : Andi.

93

Simarmata, Janer. 2011. Belajar Memahami Pengujian Testing. Jakarta : Graha

Ilmu.

Supriadi, Yuniar. 2010. Web My Profil Dengan Joomla. Jakarta : PT. Elex Media

Komputindo.

Sutanta, Edhy, 2011. Basis Data dalam Tinjauan Konseptual. Yogyakarta : Andi

Offset.

Sutarman, 2012. Pengantar Teknologi Informasi. Jakarta : Bumi Aksara.

Suyanto, Asep Herman. 2008. Step By Step Web Design Theory And Practice

Edisi II. Yogyakarta : Andi Pubisher.

Wicaksono, Yogi. 2008. Membangun Bisnis Onine Dengan Mambo. Jakarta : PT.

Elex Media Komputindo.

Wismakarma, Komang. 2010. Panduan Lengkap Menguasai Pemrograman CSS.

Yogyakarta : Lokomedia.

94

95

Lampiran A-1

Gambar IV.I Lampiran A-1

96

Lampiran B-1

Gambar IV.II Lampiran B-1

Documents

TUGAS AKHIR - repository.bsi.ac.idUntuk itulah penulis mencoba untuk membuat tugas akhir mengenai perancangan sistem informasi penjualan sepatu berbasis web pada toko Salfa Jakarta