komputerisasi sistem penjualan barang reklame · surat pernyataan persetujuan publikasi karya ......
TRANSCRIPT
i
APLIKASI PENJUALAN MEUBEL BERBASIS WEB
PADA PERUSAHAAN MULIA MEUBEL
KLATEN
TUGAS AKHIR
Diajukan untuk memenuhi salah satu syarat kelulusan Program Diploma III
EMANG DANI WIDYONO
NIM : 12140361
Program Studi Manajemen Informatika
Akademi Manajemen Informasi dan Komputer Bina Sarana Informatika
Jakarta
2017
ii
SURAT PERNYATAAN KEASLIAN TUGAS AKHIR
Yang bertanda tangan di bawah ini: Nama : Emang Dani Widyono
NIM : 12140361
Program Studi : Manajemen Informatika
Perguruan Tinggi : AMIK BSI Jakarta
Dengan ini menyatakan bahwa tugas akhir yang telah saya buat dengan judul:
“Aplikasi Penjualan Meubel B erbasis Web Pada Perusahaan Mulia Meubel
Klaten”, adalah asli (orsinil) atau tidak plagiat (menjiplak) dan belum pernah
diterbitkan/dipublikasikan dimanapun dan dalam bentuk apapun.
Demikianlah surat pernyataan ini saya buat dengan sebenar-benarnya tanpa
ada paksaan dari pihak manapun juga. Apabila dikemudian hari ternyata
saya memberikan keterangan palsu dan atau ada pihak lain yang mengklaim
bahwa tugas akhir yang telah saya buat adalah hasil karya milik seseorang atau
badan tertentu, saya bersedia diproses baik secara pidana maupun perdata dan
kelulusan saya dari AMIK BSI Jakarta dicabut/dibatalkan.
Dibuat di : Jakarta
Pada tanggal : 10 Juli 2017
Yang menyatakan,
Emang Dani Widyono
iii
SURAT PERNYATAAN PERSETUJUAN PUBLIKASI KARYA
ILMIAH UNTUK KEPENTINGAN AKADEMIS Yang bertanda tangan di bawah ini, saya:
Nama : Emang Dani Widyono
NIM : 12140361
Program Studi : Manajemen Informatika
Perguruan Tinggi : AMIK BSI Jakarta
Dengan ini menyetujui untuk memberikan ijin kepada pihak AMIK BSI
Jakarta, Hak Bebas Royalti Non- Eksklusif (Non-exclusive Royalti-Free Right)
atas karya ilmiah kami yang berjudul: “Aplikasi Penjualan Meubel Berbasis Web
Pada Perusahaan Mulia Meubel Klaten”, beserta perangkat yang diperlukan
(apabila ada).
Dengan Hak Bebas Royalti Non-Eksklusif ini pihak AMIK BSI Jakarta
berhak menyimpan, mengalih-media atau format-kan, mengelolaannya dalam
pangkalan data (database), mendistribusikannya dan menampilkan atau
mempublikasikannya di internet atau media lain untuk kepentingan akademis
tanpa perlu meminta ijin dari kami selama tetap mencantumkan nama kami
sebagai penulis/pencipta karya ilmiah tersebut.
Saya bersedia untuk menanggung secara pribadi, tanpa melibatkan pihak AMIK
BSI Jakarta, segala bentuk tuntutan hukum yang timbul atas pelanggaran Hak
Cipta dalam karya ilmiah saya ini.
Demikian pernyataan ini saya buat dengan sebenarnya.
Dibuat di : Jakarta
Pada tanggal : 10 Juli 2017
Yang menyatakan,
Emang Dani Widyono
iv
PERSETUJUAN DAN PENGESAHAN TUGAS AKHIR
Tugas Akhir ini diajukan oleh:
Nama : Emang Dani Widyono
NIM
Program Studi
Jenjang
Judul Tugas Akhir
: 12140361
: Manajemen Informatika
: Diploma III
: Aplikasi Penjualan Meubel Berbasis Web Pada
.Perusahaan Mulia Meubel Klaten
Untuk dipertahankan pada periode I-2017 dihadapan penguji dan diterima sebagai
bagian persyarat an yang diperlukan untuk memperoleh Diploma Ahli Madya
(A.Md) pada Program Diploma III Program Studi Manajemen Informatika di
AMIK BSI Jakarta.
Jakarta, 10 Juli 2017
PEMBIMBING TUGAS AKHIR
Dosen Pembimbing : Budi Sudrajat, M.Kom .................................
Asisten Pembimbing : Hasta Herlan Asymar, ST, MM .................................
D E W A N P E N G U J I
Penguji I : .......................................... .................................
Penguji II : ......................................... .................................
v
KATA PENGANTAR
Puji syukur atas kehadirat Tuhan Yang Maha Esa, yang telah
melimpahkan rahmat dan karunia-Nya, sehingga pada akhirnya penulis dapat
menyelesaikan tugas akhir ini dengan baik. Dimana tugas akhir ini penulis sajikan
dalam bentuk buku yang sederhana. Adapun judul tugas akhir yang penulis
ambil sebagai berikut, “Aplikasi Penjualan Meubel Berbasis Web Pada
Perusahaan Mulia Meubel Klaten”.
Tujuan penulisan tugas akhir ini dibuat sebagai salah satu syarat kelulusan
program Diploma III Akademi Manajemen Informatika dan Komputer Bina
Ssarana Informatika Jakarta. Sebagai bahan penulisan diambil berdasarkan hasil
penelitian (eksperimen), observasi dan beberapa sumber literatur yang mendukung
penulisan ini. Penulis menyadari bahwa tanpa bimbingan dan dorongan dari
semua pihak, maka penulisan tugas akhir ini tidak akan lancar. Oleh karena
itu pada kesempatan ini, izinkanlah penulis menyampaikan ucapan terima kasih
kepada:
1. Direktur AMIK BSI Jakarta.
2. Ketua Program Studi Manajemen Informatika AMIK BSI Jakarta.
3. Bapak Budi Sudrajat, M.Kom selaku Dosen Pembimbing Tugas Akhir.
4. Bapak Hasta Herlan Asymar, ST, MM. selaku Asisten Pembimbing Tugas Akhir.
5. Staff / karyawan / dosen dilingkungan AMIK BSI Jakarta.
6. Bapak Kornelius Prihatin selaku Pemilik Mulia Meubel Klaten.
7. Staff / karyawan dilingkungan Mulia Meubel Klaten.
8. Orang tua tercinta yang telah memberikan dukungan moral maupun spiritual.
9. Keluarga kecil tercinta yang telah menjadi penyemangat.
10. Rekan-rekan mahasiswa kelas 12.6C.25.
Serta semua pihak yang terlalu banyak untuk disebut satu persatu
sehingga terwujudnya penulisan ini. Penulis menyadari bahwa penulisan tugas akhir
ini masih jauh dari sempurna, untuk itu penulis mohon kritik dan saran yang bersifat
membangun demi kesempurnaan penulisan dimasa yang akan datang.
Akhir kata semoga tugas akhir ini dapat berguna bagi penulis khususnya dan
bagi para pembaca yang berminat pada umumnya.
Jakarta, 10 Juli 2017
Penulis
Emang Dani Widyono
ABSTRAK Emang Dani Widyono (12140361), Aplikasi Penjualan Meubel Berbasis Web
Pada Perusahaan Mulia Meubel Klaten
Dalam era globalisasi sekarang ini, teknologi informasi melaju dengan cepatnya.
Adapun komputer yang merupakan peralatan yang diciptakan untuk
mempermudah pekerjaan manusia, saat mencapai kemajuan baik di dalam
pembuatan hardware maupun software. Mulia Meubel Klaten sangat
membutuhkan adanya suatu sistem informasi yang menunjang dan memberikan
pelayanan yang memuaskan bagi para customer. Untuk itulah penulis mencoba
membuat Tugas Akhir mengenai sistem penjualan barang di Mulia Meubel Klaten
yang sampai saat ini belum terkomputerisasi. Pada saat ini Mulia Meubel Klaten
hanya berupa perusahaan yang bergerak dalam bidang meubel atau furniture.
Sistem yang ada pada Mulia Meubel Klaten ini masih dilakukan secara manual,
mulai dari pencatatan customer yang membeli barang, sampai penyimpanan data-
data lainnya yang berhubungan dengan proses penjualan hingga sampai
pembuatan laporan, sehingga memungkinkan pada saat proses berlangsung
terjadi kesalahan dalam pencatatan, kurang akuratnya laporan yang dibuat dan
keterlambatan dalam pencarian data-data yang diperlukan. Perancangan
sistem informasi ini merupakan solusi yang terbaik untuk memecahkan
permasalahan- permasalahan yang ada pada perusahaan ini, serta dengan sistem
yang terkomputerisasi dapat tercapai suatu kegiatan yang efektif dan efisien dalam
menunjang aktifitas pada perusahaan ini. Sistem yang terkomputerisasi lebih baik
dari sistem yang manual agar berjalan lebih efektif dan efisien serta sistem
penjualan yang sekarang lebih kondusif dibandingkan dengan sistem yang
terdahulu. Kata Kunci: Perancangan Sistem Informasi, Sistem Penjualan Barang
ABSTRACT
Emang Dani Widyono (12140361), The Application sales furniture web
based on Mulia Meubel Klaten.
Now a day in era of globalization, the information technology accelerates so fast.
Meanwhile with the presence of computer which is one of many sophisticated
instruments made by people is really helpful and to ease people’s work due to the
emerging of both the hardware and software. Mulia Meubel Klaten fully needs an
information system which supports and gives contented services to all customers.
That is why the writer tries to make her Final Assignment concerning with the
goods selling system in Mulia Meubel Klaten which is up to now the company
has not applied the computerized system yet. At this moment, Mulia Meubel Klaten
is a company which is operating in designs and multimedia fields. The system
which is being applied now in this company still done manually, starting from the
registration of customers who buy goods, the handling of other records or data
related to the selling process until the phase of making the reports, one of those
phases might trigger some mistakes in doing the registration, less of
accurateness from the reports made by and the lateness in finding required data
or documents. The computerized system is not only the best solution to solve some
problems appeared in this company, but also with this computerized system the
company would attain enermous advantages since they are capable of doing those
activities effectively and efficiently. The use of computerized system is so much
better than the manual one because it can make the system runs smoothly,
effectively and efficiently and indeed, the current selling system is more conducive
than the prior system.
Key Words: Selling Information System, Trading Product
DAFTAR ISI Halaman
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 Gambar ................................................................................ xiii
Daftar Tabel .......................................................................................... xiv
Daftar Lampiran .............................................................................................. xv
BAB I PENDAHULUAN ....................................................................... 1
1.1. Latar Belakang .......................................................................... 1
1.2. Maksud dan Tujuan ............................................................... 2
1.3. Metode Penelitian .................................................................. 3
1.4. Ruang Lingkup ...................................................................... 5
1.5. Sistematika Penulisan ............................................................ 6
BAB II LANDASAN TEORI ................................................................... 7
2.1. Konsep Dasar Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
A. Website ........................................................................................................................ 7
B. Bahasa Pemrograman ...................................................................... 13
C. Basis Data .......................................................................... 17
D. Model Pengembangan Perangkat Lunak ........................... 19
2.2. Teori Pendukung (Tools Program) ......................................... 21
A. Struktur Navigasi .................................................... 21
B. Pengertian Entity Relationship Diagram ........................... 25
C. Pengertian Logical Record Structure................................. 25
D. Pengujian Web .................................................................. 26
BAB III PEMBAHASAN ............................................................................. 28
3.1. Tinjauan Kasus ..................................................................................... 28
3.2. Analisa Kebutuhan ................................................................ 29
3.3. Perancangan Perangkat Lunak ............................................... 30
3.3.1. Rancangan Antar Muka ................................................ 30
3.3.2. Rancangan Basis Data .................................................. 58
A. Entity Relationship Diagram ..................................... 59
B. Logical Record Structure ........................................... 60
C. Spesifikasi File .......................................................... 60
3.3.3. Rancangan Struktur Navigasi ....................................... 69
3.4 Implementasi dan Pengujian Unit ........................................... 70
3.4.1. Implementasi ................................................................. 70
A. Implementasi Rancangan Antar Muka ..................... 70
B. Spesifikasi Sistem Komputer .................................. 85
3.4.2. Pengujian Unit .............................................................. 87
BAB IV PENUTUP ................................................................................... 99
4.1. Kesimpulan ......................................................................... 99
4.2. Saran ................................................................................... 100
DAFTAR PUSTAKA ..................................................................................................................................... 101
DAFTAR RIWAYAT HIDUP .................................................................... 103
SURAT KETERANGAN RISET .................................................................. 104
DAFTAR SIMBOL
A. Simbol Entity Relationship Diagram (ERD)
ENTITAS / ENTITY
Digunakan untuk menggambarkan entitas atau table
pada basis data (database).
ATRIBUT
Digunakan untuk menggambarkan field dalam suatu
entitas atau table.
RELASI
Digunakan untuk menggambarkan relasi atau
hubungan antar entitas.
ASOSIASI / ASSOCIATION
Digunakan untuk penghubung antara relasi dan
entitas.
1 0…*
DAFTAR GAMBAR Halaman
Gambar II.1 Model Waterfall .............................................................................. 21
Gambar II.2 Struktur Navigasi Linear ................................................................. 22
Gambar II.3 Struktur Navigasi Hirarki ............................................................... 23
Gambar II.4 Struktur Navigasi Non Linear......................................................... 23
Gambar II.5 Struktur Navigasi Campuran (Composite) ..................................... 24
Gambar III.1 Rancangan Antar Muka Halaman Index ....................................... 31
Gambar III.2 Rancangan Antar Muka Halaman Profil ....................................... 32
Gambar III.3 Rancangan Antar Muka Halaman Barang ..................................... 33
Gambar III.4 Rancangan Antar Muka Halaman Panduan .................................. 34
Gambar III.5 Rancangan Antar Muka Halaman Konfirmasi .............................. 35
Gambar III.6 Rancangan Antar Muka Halaman Pendaftaran Pelanggan ........... 36
Gambar III.7 Rancangan Antar Muka Halaman Home Member ........................ 37
Gambar III.8 Rancangan Antar Muka Halaman Koleksi Barang ....................... 38
Gambar III.9 Rancangan Antar Muka Halaman Keranjang Belanja .................. 39
Gambar III.10 Rancangan Antar Muka Halaman Tampilan Transaksi .............. 40
Gambar III.11 Rancangan Antar Muka Halaman Konfirmasi Belanja ............... 41
Gambar III.12 Rancangan Antar Muka Halaman Login Admin......................... 42
Gambar III.13 Rancangan Antar Muka Halaman Home Admin ........................ 43
Gambar III.14 Rancangan Antar Muka Halaman Ganti Password Admin ......... 44
Gambar III.15 Rancangan Antar Muka Halaman Biaya Kirim .......................... 45
Gambar III.16 Rancangan Antar Muka Halaman Data Kategori ........................ 46
Gambar III.17 Rancangan Antar Muka Halaman Data Barang .......................... 47
Gambar III.18 Rancangan Antar Muka Halaman Data Pelanggan ..................... 48
Gambar III.19 Rancangan Antar Muka Halaman Pemesanan Barang ................ 49
Gambar III.20 Rancangan Antar Muka Halaman Konfirmasi Transfer ............. 50
Gambar III.21 Rancangan Antar Muka Halaman Laporan ................................. 51
Gambar III.22 Rancangan Antar Muka Halaman Laporan Data Area
Pengiriman .................................................................................. 52
Gambar III.23 Rancangan Antar Muka Halaman Laporan Data Kategori ......... 53
Gambar III.24 Rancangan Antar Muka Halaman Laporan Data Barang ............ 54
Gambar III.25 Rancangan Antar Muka Halaman Laporan Data Pelanggan ....... 55
Gambar III.26 Rancangan Antar Muka Halaman Laporan Pemesanan Masuk
- Periode ...................................................................................... 56
Gambar III.27 Rancangan Antar Muka Halaman Laporan Pemesanan Lunas
- Tanggal ..................................................................................... 57
Gambar III.28 Rancangan Antar Muka Halaman Laporan Pemesanan Lunas
- Periode ...................................................................................... 58
Gambar III.29 Entity Relationship Diagram (ERD) ........................................... 59
Gambar III.30 Logical Record Structure ............................................................ 60
Gambar III.31 Struktur Navigasi Halaman Web Pengunjung ............................ 69
Gambar III.32 Struktur Navigasi Halaman Web Home Member ....................... 69
Gambar III.33 Struktur Navigasi Halaman Web Admin .................................... 70
Gambar III.34 Tampilan Halaman Index (Home) Pengunjung .......................... 71
Gambar III.35 Tampilan Halaman Profil ............................................................ 72
Gambar III.36 Tampilan Halaman Barang.......................................................... 72
Gambar III.37 Tampilan Halaman Panduan ....................................................... 73
Gambar III.38 Tampilan Halaman Konfirmasi ................................................... 73
Gambar III.39 Tampilan Halaman Pendaftaran Pelanggan ................................ 74
Gambar III.40 Tampilan Halaman Home Member ............................................. 74
Gambar III.41 Tampilan Halaman Koleksi Barang ............................................ 75
Gambar III.42 Tampilan Halaman Keranjang Belanja ....................................... 75
Gambar III.43 Tampilan Halaman Tampilan Transaksi ..................................... 76
Gambar III.44 Tampilan Halaman Konfirmasi Belanja ...................................... 76
Gambar III.45 Tampilan Halaman Login Admin ............................................... 77
Gambar III.46 Tampilan Halaman Home Admin ............................................... 77
Gambar III.47 Tampilan Halaman Ganti Password Admin ................................ 78
Gambar III.48 Tampilan Halaman Biaya Kirim ................................................. 78
Gambar III.49 Tampilan Halaman Data Kategori............................................... 79
Gambar III.50 Tampilan Halaman Data Barang ................................................. 79
Gambar III.51 Tampilan Halaman Data Pelanggan ............................................ 80
Gambar III.52 Tampilan Halaman Pemesanan Barang ....................................... 80
Gambar III.53 Tampilan Halaman Konfirmasi Transfer .................................... 81
Gambar III.54 Tampilan Halaman Laporan ........................................................ 81
Gambar III.55 Tampilan Halaman Laporan Data Area Pengiriman ................... 82
Gambar III.56 Tampilan Halaman Laporan Data Kategori ................................ 82
Gambar III.57 Tampilan Halaman Laporan Data Barang ................................... 83
Gambar III.58 Tampilan Halaman Laporan Data Pelanggan.............................. 83
Gambar III.59 Tampilan Halaman Laporan Pemesanan Masuk - Periode ......... 84
Gambar III.60 Tampilan Halaman Laporan Pemesanan Lunas - Tanggal .......... 84
Gambar III.61 Tampilan Halaman Laporan Pemesanan Lunas - Periode .......... 85
DAFTAR TABEL
Halaman
Tabel III.1 Spesifikasi File Admin ................................................................... 61
Tabel III.2 Spesifikasi File Barang .................................................................. 62
Tabel III.3 Spesifikasi File Kategori ................................................................ 63
Tabel III.4 Spesifikasi File Konfirmasi ........................................................... 63
Tabel III.5 Spesifikasi File Pelanggan ............................................................. 64
Tabel III.6 Spesifikasi File Pemesanan ............................................................ 65
Tabel III.7 Spesifikasi File Pemesanan Item ................................................... 66
Tabel III.8 Spesifikasi File Pengiriman ........................................................... 67
Tabel III.9 Spesifikasi File Keranjang Belanja ................................................ 68
Tabel III.10 Form Login Pelanggan ................................................................... 87
Tabel III.11 Hasil Pengujian Black Box Testing Halaman Login Admin ......... 89
Tabel III.12 Hasil Pengujian Black Box Testing Tombol Beli .......................... 90
Tabel III.13 Hasil Pengujian Black Box Testing Halaman Konfirmasi
Belanja ........................................................................................... 91
Tabel III.14 Hasil Pengujian Black Box Testing Halaman Pendaftaran Baru ... 94
BAB I
PENDAHULUAN
1.1. Latar Belakang
Perkembangan bisnis property dari tahun ke tahun senantiasa mengalami
peningkatan, bahkan pembangunan akan komplek hunian baru sering terlihat dari
daerah perkotaan hingga pinggiran kota. Hal ini tentu saja berimbas pada
permintaan akan barang furniture atau meubel yang pastinya menjadi pelengkap
setiap property yang ada. Selain untuk memenuhi permintaan akan hunian baru,
barang-barang meubel juga memiliki pasar tersendiri terutama bagi pemilik rumah
yang menginginkan barang meubel baru dirumahnya untuk menambah atau
mengganti barang yang sudah lama atau rusak bahkan yang sudah tidak bisa dipakai
lagi. Adapun yang termasuk dalam barang furniture atau meubel meliputi: meja,
kursi, lemari, dan lain sebagainya. Tentu saja setiap rumah hingga perkantoran serta
tempat-tempat lainnya pasti memiliki benda-benda tersebut.
Kemudahan tentang karakteristik barang-barang meubel juga menjadi ciri
khas tersendiri. Biasanya pada suatu daerah akan memiliki model desain ataupun
ukiran yang sama, hal ini seperti menjadi jatidiri dari suatu daerah. Hal ini
menyebabkan permintaan barang-barang meubel kerap kali datang dari daerah yang
sama. Namun tak jarang juga ada permintaan dari luar daerah hingga mencapai
pasar mancanegara. Tentu saja semua itu tergantung dari peminat serta bagaimana
cara memasarkannya.
Perkembangan penjualan berbasis web dewasa ini semakin pesat. Saat ini
website dibutuhkan untuk menunjang dan menyampaikan suatu informasi termasuk
1
2
dalam bidang penjualan, sehingga dapat diakses dengan cepat dan mudah. Dengan
menggunakan kecanggihan teknologi informasi, hal ini tentu saja akan menjadi
peluang bisnis yang sangat besar, Website merupakan salah satu media yang
dianggap bisa menjadi informasi yang mudah diperoleh oleh masyarakat.
Dengan meluasnya media internet sebagai sistem informasi proses promosi
sekaligus transaksi marketing menjadikan setiap perusahaan penjualan khususnya
disini meubel perlu memiliki website penjualan untuk menunjang berjalannya
proses promosi dan marketing perusahaan tersebut. Oleh karena itu penulis
berencana untuk merancang website penjualan atau e-commerce agar produk-
produk meubel dapat dipasarkan lebih luas dan promosi yang lebih efektif. Maka
dari itu, penulis tertarik untuk mengambil permasalahan tersebut dalam penulisan
tugas akhir ini dan mencoba memberikan solusi dengan membuat website e-
commerce yang mengambil judul “APLIKASI PENJUALAN MEUBEL
BERBASIS WEB PADA PERUSAHAAN MULIA MEUBEL KLATEN”.
1.2. Maksud dan Tujuan
Maksud dari penulisan Tugas Akhir ini adalah sebagai berikut:
1. Membuat aplikasi e-commerce atau penjualan melalui media internet untuk
mempermudah promosi dan penjualan pada perusahaan Mulia Meubel.
2. Memberikan kenyamanan bagi konsumen untuk dapat melihat dan
berbelanja barang meubel secara online.
3. Mengurangi biaya promosi lewat media visual, seperti spanduk dan brosur.
3
Sedangkan tujuan penulisan tugas akhir ini adalah sebagai salah satu syarat
kelulusan Program Diploma Tiga (D.III) pada jurusan Manajemen Informatika
pada Akademik Manajemen Informatika dan Komputer Bina Sarana Informatika
(AMIK BSI).
1.3. Metode Penelitian
Dalam usaha pengumpulan data-data yang dapat membantu tugas akhir ini
penulis telah mengunakan metode penelitian sebagai berikut :
A. Metode Pengembangan Perangkat Lunak
Metode yang digunakan pada pengembangan perangkat lunak ini
menggunakan model water fall dengan tahapan sebagai berikut :
1. Analisis kebutuhan
Pada tahap ini, analisis kebutuhan sistem dilakukan untuk membantu
menjabarkan kebutuhan pengguna menjadi desain sistem yang
kemudian akan dibuat menjadi program aplikasi. Dalam hal ini, admin
memiliki hak akses untuk masuk ke halaman admin dengan cara
melakukan logika terlebih dahulu, dan mengola semua data yang ada di
halaman admin. Sedangkan user (pengguna) tidak berhak masuk ke
halaman admin. User (pengguna) hanya memiliki hak akses seperti,
melihat produk yang di jual dan melakukan transaksi penjualan ketika
jadi member untuk membeli sebuah produk meubel.
2. Perancangan sistem dan perangkat lunak
Pada tahap desain, penulis menggunakan Cascading style sheet (CSS)
yang terdapat dalam software Adobe Dreamweaver CS6. Untuk
4
perancangan aplikasinya penulis menggunakan struktur navigasi
campuran. Pada tahap perancangan basis data, penulis menggunakan
Entry Relational Database (ERD) sebagai alat untuk merancang relasi
antar tabel dalam database untuk kemudian dikonversi ke dalam bentuk
Logical Record Structure (LRS). Pada tahap pembuatan kode program,
penulis menggunakan Bahasa pemograman PHP dan MYSQL yang
dituangkan kedalam software Adobe Dreamweaver CS6 dengan
menggunakan XAMPP sebagai web server.
3. Implementasi dan pengujian unit
Dalam melakukan pemrograman, penulis melakukan pengujian
terhadap kode-kode program untuk memastikan kebenaran tersebut.
Pengujian ini dilakukan untuk mencari kesalahan yang ditimbulkan
karena salah tulis atau kesalahan pemrograman. Dalam pengujian
System E-Commerce, penulis menggunakan metode Black Box Testing.
Hal ini dilakukan untuk mencari posisi kesalah (Error) dan memastikan
keluaran yang dihasilkan sesuai dengan yang diinginkan.
B. Teknik pengumpulan Data
Teknik pengumpulan data yang diigunakan oleh penulis dalam
pembuatan Tugas Akhir adalah :
1. Metode Pengamatan Langsung (Observasi)
Penulis melakukan pengamatan secara langsung segala sesuatu yang
berkaitan dengan objek penelitian. Penulis menggunakan teknik
observasi di dalam pengumpulan data agar dapat melihat proses atau
5
prosedur kerja secara langsung dan juga untuk dapat mengetahui secara
pasti segala sesuatu yang diperlukan pada saat terjadinya proses.
2. Metode Wawancara
Tujuan penulis menggunakan teknik wawancara adalah
untuk mencari dan memeriksa kebenaran suatu
informasi juga mendapatkan informasi yang spesifik dan
jelas dari orang yang memiliki pengetahuan yang
berhubungan dengan penulisan Tugas Akhir ini.
3. Metode Studi Pustaka
Sebagai pendukung untuk mencari berbagai informasi, penulis
menggunakan teknik studi pustaka dengan mengambil beberapa materi
berupa buku, referensi, dan catatan-catatan yang berkaitan dengan
penulisan Tugas Akhir.
1.4. Ruang Lingkup
Ruang lingkup masalah yang akan dibahas dalam tugas akhir ini adalah
mengenai mempromosikan produk dan transaksi penjualan barang meubel. Maka
penulisan membatasi pembahasan hanya dalam ruang lingkup barang meubel
dengan halaman Admin meliputi login Admin untuk masuk kehalaman Admin agar
dapat update produk, update kategori, update ongkos kirim, manage user, edit,
hapus, dan lihat data rincian laporan transaksi. Adapun halaman pengunjung
meliputi, Halaman Produk, Cara order, Download katalog produk, Kategori, Login
user, dan Keranjang Belanja.
6
1.5. Sistematika Penulisan
Dalam penulisan laporan Tugas Akhir (TA) ini penulis menyajikan laporan
beberapa bab yang mengambarkan secara tersendiri setiap bab yang nantinya dapat
menggambarkan dan menjelaskan laporan secara menyeluruh. Adapun sistematika
yang disajikan adalah sebagai berikut :
BAB I PENDAHULUAN
Dalam bab ini penulis menjelaskan tentang konsep dasar sistem yang
dibahas dalam ruang lingkup penulisan dan memberikan penjelasan
teoritis tentang peralatan yang dibutuhkan dalam sistem web.
BAB II LANDASAN TEORI
Dalam bab ini membahas mengenai konsep dasar web yang meliputi
pengertian website, bahasa pemrograman, basis data, model
pengembangan perangkat lunak dan teori pendukung yang meliputi
struktur navigasi, Entity Relational Diagram (ERD), Logical
Relational Structure (LRS) dan pengujian web.
BAB III PEMBAHASAN
Dalam bab ini membahas tinjauan perusahaan, analisa kebutuhan,
perancangan perangkat lunak, basis data serta implementasi dan
pengujian web.
BAB IV PENUTUP
Pada bab ini terdiri dari kesimpulan dan saran-saran penulis, yang
penulis buat berdasarkan bab-bab sebelumnya
7
BAB II
LANDASAN TEORI
2.1. Konsep Dasar Web
Pada umumnya sebuah situs web ditempatkan setidaknya pada sebuah
server web yang dapat diakses melalui jaringan seperti internet, ataupun jaringan
wilayah local melalui alamat internet yang dikenal sebagai url. Gabungan atas
semua situs yang dapat diakses secara luas di internet disebut juga sebagai world
wide web atau lebih dikenal dengan singkatan www. Pada bab ini diuraikan
beberapa konsep dasar web, diantaranya adalah sebagai berikut :
A. Website
Web merupakan jaringan komputer yang terdiri dari kumpulan situs internet
yang menyajikan tampilan berupa teks, grafik, suara serta sumber daya animasi
melalui protokol transfer hypertext. Secara umum web dikenal dengan istilah
WWW (world wide web), hingga saat ini World Wide Web merupakan layanan
internet yang paling popular. Internet sendiri mulai dikenal secara luas dan mulai
digunakan diberbagai belahan dunia setelah adanya layanan WWW. WWW adalah
halaman-halaman website yang dapat saling terkoneksi satu dengan lainnya
(hyperlink) yang membentuk sebuah informasi. WWW berjalan dengan protokol
HyperText Transfer Protokol (HTTP).
World Wide Web (WWW) menurut menurut Wardana (2010:12) adalah
suatu ruang informasi yang dipakai oleh pengenal global yang disebut
Pengidentifikasi Sumber Seragam untuk mengenal sumber daya yang berguna.
WWW sering dianggap sama dengan internet secara keseluruhan, walaupun
8
sebenarnya ia hanyalah bagian daripada internet. WWW merupakan kumpulan
peladen web dari seluruh dunia yang mempunyai kegunaan untuk menyediakan
data dan informasi agar dapat digunakan bersama.
WWW adalah bagian paling menarik dari internet. Melalui web, para
pengguna dapat mengakses informasi-informasi yang tidak hanya berupa teks tetapi
bias juga berupa gambar, suara, video dan animasi. Kegunaan ini tergolong masih
baru dibandingkan surat elektronik, sebenarnya WWW merupakan kumpulan
dokumen yang tersimpan di peladen web, dan yang peladennya tersebar di lima
benua termasuk Indonesia yang terhubung menjadi satu melalui jaringan internet.
Dokumen-dokumen informasi ini dibuat atau disimpan dengan format HyperText
Transfer Protokol (HTML). Suatu halaman dokumen informasi dapat terdiri atas
teks yang saling terkait dengan teks lainnya atau bahkan terkait dengan dokumen
lain. Keterkaitan halaman lewat teks ini disebut pranala (link). Dokumen informasi
ini tidak hanya terdiri dari teks tetapi dapat juga berupa gambar, mengandung suara
bahkan klip video. Kaitan antar dokumen yang seperti itu biasa disebut hypermedia.
Jadi dapat disimpulkan bahwa WWW adalah sekelompok dokumen multimedia
yang saling bertautan dengan menggunakan tautan hiperteks. Dengan mengeklik
pada pranala (hyperlinks) maka para pengguna bisa berpindah dari satu dokumen
ke dokumen lainnya.
World Wide Web (WWW) adalah suatu program yang ditemukan oleh Tim
Berners-Lee pada tahun 1991. Awalnya Berners-Lee hanya ingin menemukan cara
untuk menyusun arsip-arsip risetnya. Untuk itu, beliau mengembangkan suatu
9
sistem untuk keperluan pribadi. Sistem itu adalah program piranti perangkat lunak
yang diberi nama Enquire. Dengan program itu, Berners-Lee berhasil menciptakan
jaringan yang menautkan berbagai arsip sehingga memudahkan pencarian
informasi yang dibutuhkan. Hal ini kelak menjadi dasar dari sebuah perkembangan
pesat yang dikenal sebagai www.
Pada tahun 1989 Berners-Lee membuat pengajuan untuk proyek pembuatan
hiperteks global, kemudian pada bulan Oktober 1990, world wide web sudah dapat
dijalankan dalam lingkunan CERN (pusat penelitian fisikan partikel Eropa). Pada
musim panas tahun 1991, www secara resmi digunakan secara luas pada jaringan
internet.
Menurut Yuhefizar (2013:2) “website adalah keseluruhan halaman-halaman
web yang terdapat dari sebuah domain yang mengandung informasi. Sebuah
website biasanya dibangun atas banyak halaman web yang saling berhubungan.
Hubungan antara satu halaman web dengan halaman web yang lainnya disebut
dengan hyperlink sedangkan teks yang dijadikan media penghubung disebut
hypertext”.
Sedangkan menurut Hidayat (2010:2) “website dapat diartikan sebagai kumpulan
halaman-halaman yang digunakan untuk menampilkan informasi teks, gambar diam atau gerak,
animasi, suara, dan atau gabungan dari semuanya, baik yang bersifat statis maupun dinamis yang
membentuk satu rangkaian “.
Untuk mengakses website diperlukan perangkat lunak yang disebut
broswser. Beberapa jenis browser yang popular saat ini di antaranya : internet
Exspoler yang diproduksi oleh Microsoft, Mozila Firefox, Opera dan Safari yang
diperoduksi oleh Aplle. Browser (perambah) adalah aplikasi yang mampu
menjalankan dokumen-dokumen web dengan cara diterjemahkan. Prosesnya
10
dilakukan oleh komponen yang terdapat didalam aplikasi browser yang biasa
disebut web engine. Semua dokumen web ditampilkan dengan cara diterjemahkan.
Menurut Supardi (2010:2) “Browser merupakan perangkat lunak untuk
menjalankan program atau script web. Contoh browser adalah internet explore,
Opera, Mozilla FireFox dan lain-lain nya”.
Ditinjau aspek konten atau isi, web dapat dibagi menjadi 2 jenis, yaitu :
1. Web Statis
Merupakan suatu halaman yang berisi skrip HTML editor dan disimpan
sebagai file .htm atau .HTML. Disebut statis karena laman pada web tersebut dari
waktu kewaktu isinya tidak berubah. Kerena halaman web statis ini tidak
memerlukan pemprosesan diserver, pembuatnya dapat dilakukan menggunakan
editor HTML dan hasilnya dapat dilihat pada web browser. Contoh web statis di
antaranya adalah web profil perusahan yang lebih dominan mengunakan animasi
flash atau HTML, web kumpulan produk animasi.
2. Web Dinamis.
Merupakan web yang kontennya berubah-berubah. Pembuatan halaman web
dinamis dapat dilakukan dengan dua cara yaitu secara client side atau secara server
side. Penggunaan client side dan server side tidak saling bertentangan melainkan
saling melengkapi. Seorang web developer harus dapat menentukan bagian mana
yang diletakan secara client side dan mana yang diletakan secara server side.
Contoh situs web dinamis diantaranya adalah situs web berita, situs web E-
Commerce dan situs web E-Banking.
Didalam sebuah website, ada beberapa komponen pendukung agar sebuah
website dapat diakses oleh pemakai, diantaranya:
11
1. Internet
Menurut Wardana (2010:1) “Internet adalah suatu dunia yang di bangun
oleh berbagai website yang jumlahnya banyak sekali dan terus akan bertambah
jumlahnya”.
2. Pengertian Web Server
Menurut Supardi (2010:2) “Web Server merupakan perangkat lunak yang
mengelola (mengatur) permintaan user dari browser dan hasilnya dikembalikan
kembali ke browser. Contoh Web server, adalah IIS (Internet Information Service)
Produk Microsoft Corp”. Web browser seperti explorer atau navigator
berkomunikasi melalui jaringan (termasuk jaringan internet) dengan web server,
mengunakan HHTP. Browser akan mengirimkan request ke server untuk meminta
dokumen tertentu atau layanan lain yang disediakan oleh server. Server
memberikan dokumen atau layanan jika tersedia juga dengan mengunakan protocol
HTTP.
Jadi, dapat disimpulkan web server merupakan sebuah aplikasi yang
digunakan untuk menampilkan halaman-halaman website yang disimpan pada
localhost agar dapat di baca oleh penguna.
Contoh web server yang dipakai adalah:
1. XAMPP
Menurut Nugroho (2014:1) “XAMPP merupakan tool yang menyediakan
paket perangkat lunak ke dalam satu buah paket Dengan menginstal XAMPP, anda
tidak perlu lagi melakukan instalasi dan konfigurasi web server, Apache, PHP, dan
MYSQL secara manual”. XAMPP akan menginstal dan mengkonfigurasinya secara
otomatis untuk anda.
12
Sedangkan menurut Wardana (2010:8) “XAMPP adalah paket softwarer
yang didalamnya sudah terkandung Web Server Apache, data base MySql dan PHP
Interpreter, Software ini gratis dan dapat di download untuk versi windows”
2. IIS (Internet Informations Services)
IIS atau Internet Information Services menurut Suhartanto (2013:98) adalah
sebuah HTTP web server yang digunakan dalam sistem operasi server Windows,
mulai dari Windows NT 4.0 Server, Windows 2000 Server atau Windows Server
2003. Layanan ini merupakan layanan terintegrasi dalam Windows 2000 Server,
Windows Server 2003 atau sebagai add-on dalam Windows NT 4.0. Layanan ini
berfungsi sebagai pendukung protokol TCP/IP yang berjalan dalam lapisan aplikasi
(application layer). IIS juga menjadi fondasi dari platform Internet dan Intranet
Microsoft, yang mencakup Microsoft Site Server, Microsoft Commercial Internet
System dan produk-produk Microsoft BackOffice lainnya..
3. PWS (Personal Web Server)
PWS atau Personal Web Server menurut Rivai dan Sukadi (2013:20) adalah
perangkat lunak yang dirancang untuk membuat dan mengelola sebuah server di
sebuah komputer desktop. PWS bisa digunakan untuk belajar bagaimana mengatur
dan mengelola sebuah website, dan juga dapat berfungsi sebagai sebuah situs untuk
pengujian halaman web dinamis. Salah satu cara fungsi PWS adalah untuk menjadi
tempat menguji program mereka dan halaman web. Oleh karena itu, sebuah PWS
mendukung lebih umum server-side pemrograman pendekatan yang dapat
digunakan dengan produksi web server.
B. Bahasa Pemrograman (Pemrograman Web)
13
Menurut Munir (2011:13) “ Bahasa Pemrograman adalah bahasa komputer
yang digunakan dalam menulis program”. Bahasa pemrograman (programming
language) adalah sebuah instruksi standar untuk memerintah komputer agar
mempunyai fungsi tertentu. Bahasa pemrograman ini merupakan suatu himpunan
dari aturan sintaks dan semantik yang dipakai untuk mendefinisikan program
komputer. Bahasa ini memungkinkan seorang programmer dapat menentukan
secara persis data mana yang akan diolah oleh komputer, bagaimana data ini akan
disimpan/diteruskan, dan jenis langkah apa secara persis yang akan diambil dalam
berbagai situasi.
Pemrograman web merupakan bahasa pemrograman yang dijalankan
aplikasinya melalui media web dan internet. Ada beberapa hal yang harus diketahui
dan ini terkait dengan tugas ahkir yang penulis susun seperti bahasa pemrograman
HTML, PHP, CSS , Javascript serta JQuery dan Software dalam pembuatan website
dengan Adobe Dreamweaver CS 6.
1. HTML (HyperText Markup Language)
Menurut Suhartanto (2010:56) “HTML atau HyperText Makup Language
merupakan salah satu format yang digunakan dalam pembuatan dokumen dan
aplikasi yang berjalan dihalam web”.
Menurut Sibero (2014:19), “HTML (Hyper Text Markup Language) adalah
bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran
dokumen web”.
Berdasarkan pendapat para ahli yang dikemukakan di atas dapat ditarik
kesimpulan bahwa HTML adalah HTML adalah bahasa yang sangat tepat dipakai
untuk menampilkan informasi pada halaman web, karena HTML menampilkan
14
informasi dalam bentuk hypertext dan juga mendukung sekumpulan perintah yang
dapat digunakan untuk mengatur tampilnya informasi tersebut, sesuai dengan
namanya, bahasa ini menggunakan tanda (markup) untuk menandai perintah-
perintahnya.
2. Personal Home Page (PHP)
Menurut Nugroho (2014:1) “PHP adalah kompilator skrip PHP supaya
dapat dijalankan pada browser seperti Internet Explorer dan Mozila FireFox ”.
Adapun kelebihan-kelebihan dari PHP yaitu:
a. PHP merupakan sebuah bahasa script yang tidak melakukan sebuah kompilasi
dalam penggunaannya. Tidak seperti halnya bahasa pemrograman aplikasi
yang lainnya.
b. Web Server yang mendukung PHP dapat ditemukan dimana – mana dari mulai
apache, IIS, Lighttpd, hingga Xitami dengan konfigurasi yang relatif mudah.
c. Karena sifatnya yang open source, maka perubahan dan perkembangan
interpreter pada PHP lebih cepat dan mudah, karena banyak milis-milis dan
developer yang siap membantu pengembanganya.
d. Jika dilihat dari segi pemahaman, PHP memiliki referensi yang begitu banyak
sehingga sangat mudah untuk dipahami.
e. PHP dapat berjalan pada 3 operating sistem, yaitu: Linux, unux, dan windows,
dan juga dapat dijalankan secara runtime pada suatu console.
f. PHP bersifat bebas dipakai (free).
15
3. CSS (Cascading Style Sheet)
CSS atau Cascading Style Sheet menurut Nugroho (2014:15) merupakan
aturan untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih
terstruktur dan seragam. CSS bukan merupakan bahasa pemograman.
Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft Word
yang dapat mengatur beberapa style, misalnya heading, subbab, bodytext, footer,
images, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa
berkas (file). Pada umumnya CSS dipakai untuk memformat tampilan halaman web
yang dibuat dengan bahasa HTML dan XHTML.
CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks,
warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over,
spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter
lainnya. CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan
dokumen. Dengan adanya CSS memungkinkan kita untuk menampilkan halaman
yang sama dengan format yang berbeda.
4. Java Script
Pengertian Java Script menurut Suhartanto (2010:87) adalah bahasa
pemrograman tingkat tinggi dan dinamis. JavaScript populer di internet dan dapat
bekerja di sebagian besar penjelajah web populer seperti Internet Explorer (IE),
Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam
halaman web menggunakan tag SCRIPT.
JavaScript pertama kali dikembangkan oleh Brendan Eich dari Netscape di
bawah nama Mocha, yang nantinya namanya diganti menjadi LiveScript, dan
akhirnya menjadi JavaScript.
16
Navigator sebelumnya telah mendukung Java untuk lebih bisa dimanfaatkan
para programmer yang non-Java. Maka dikembangkanlah bahasa pemrograman
bernama LiveScript untuk mengakomodasi hal tersebut. Bahasa pemrograman
inilah yang akhirnya berkembang dan diberi nama JavaScript, walaupun tidak ada
hubungan bahasa antara Java dengan JavaScript. JavaScript bisa digunakan untuk
banyak tujuan, misalnya untuk membuat efek rollover baik di gambar maupun teks,
dan yang penting juga adalah untuk membuat AJAX. JavaScript adalah bahasa yang
digunakan untuk AJAX.
5. JQuery
Menurut Sigit (2011:1) “JQuery adalah salah library atau kumpulan kode
javaScript siap pakai. Keungulan mengunakan jquery dibandingkan dengan
javascript standar, yaitu menyederhanakan kode javascript dengan cara memanggil
fungsi-fungsi yang disediakan oleh jquery”. Secara standar, apabila penulisan kode
javascript mengunakan script yang cukup panjang bahkan sangat sulit dipahami,
dengan menggunakan jQuery mempersingkat script dari javascript.
Kesimpulannya jQuery menyederhanakan kode javascript. Hal ini sesuai dengan
slogannya “Write less, do more” cukup menulis sedikit tetapi dapat melakukan
banyak hal.
6. Dreamweaver CS 6
Menurut Madcoms (2013:1) “Adobe Dreamweaver CS 6 adalah perangkat
lunak terkemuka untuk desain web yang menyediakan kemampuan visual yang
intulitif termasuk pada tingkat kode, yang dapat akan untuk membuat dan mengedit
website HTML serta aplikasi mobile seperti iphone, tablet, dan perangkat lainnya”.
17
Dengan adanya fitur layaout Fluid Grid dirancang khusus untuk memungkinkan
lintas platform, maka akan membuat menjadi adaptif atau dapat menyesuaikan
dengan browser yang dipakai. Anda dapat melihat hasil sementara desain dengan
fasilitas Multiscreen Preview yang mengalami banyak perubahan dan peningkatan
fusionalitasnya.
C. BASIS DATA
1. Pengertian Basis Data
Database atau basis data adalah sekumpulan data yang memiliki hubungan
secara logika dan diatur dengan susunan tertentu serta disimpan dalam media
penyimpanan komputer. Data itu sendiri adalah representasi dari semua fakta yang
ada pada dunia nyata. Database sering digunakan untuk melakukan proses terhadap
data-data tersebut unutk menghasilkan informasi tertentu.
Basis Data adalah sekumpulan data yang berelasi atau terhubungyang
disimpan secara bersama-sama pada suatu media, untuk mengaskses dan
memproses data yang disimpan dalam sebuah database komputer, diperlukan
database manajemen seperti MySQL Server”.
Basis data dapat didefinisikan dalam berbagai sudut pandang seperti
berikut :
a. Himpunan kelompok data yang saling berhubungan yang diorganisasi
sedemikian rupa sehingga kelak dapat dimanfaatkan dengan cepat dan mudah.
b. Kumpulan data yang saling berhubungan yang disimpan secara bersama
sedemikian rupa tanpa pengulangan(redundancy) yang tidak perlu, untuk
memenuhi kebutuhan.
18
c. Kumpulan file/table/arsip yang saling berhubungan yang disimpan dalam media
penyimpanan electronik.
2. MySQL
Menurut Nugroho (2014:1) “MySQL adalah software database server untuk
menyimpan data”.
Menurut Arief (2011:152) “MySQL adalah salah satu jenis database server
yang sangat terkenal dan banyak digunakan untuk membangun aplikasi web yang
menggunakan database sebagai sumber dan pengolahan datanya”.
1. Perintah Dasar MySQL
a. Create Database, perintah untuk membuat database.
b. Use, perintah menggunakan database
c. Create Table, perintah untuk membuat tabel.
d. Drop Database, perintah untuk menghapus database.
2. Perintah MySQL pada sub DML
DML (Data Manipulation Language) adalah paket bahasa yang digunakan
untuk melakukan manipulasi terhadap data pada sebuah basis data. Manipulasi data
meliputi kegiatan menambah, mengedit, mengambil, dan menghapus data. Berikut
perintah-perintah MySQL pada sub DML:
a. Insert, perintah untuk memasukkan data.
b. Select, perintah untuk menampilkan data.
c. Update, perintah untuk mengubah atau mengedit data.
d. Delete, perintah untuk menghapus data.
19
D. Model Pengembangan Prangkat Lunak
1. Model Water Fall
Menurut Sukamto dan Shalahudin (2013:28) “Model waterfall adalah
Model SDLC yang paling sederhana”. Model ini hanya cocok untuk pengembangan
perangkat lunak dengan spesifikasi yang tidak berubah-ubah. Model SDLC air
terjun (waterfall) sering juga disebut model sekuensial linier (sequential linear)
atau alurhidup 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).
Langkah-langkah penting yang terdapat pada model waterfall adalah :
a. Analisa Kebutuhan
Proses pengumpulan kebutuhan diintensifkan dan difokuskan, khususnya
pada perangkat lunak. Untuk memahami sifat program yang dibangun, rekayasa
perangkat lunak (analisis) harus memahami domain informasi, tingkah laku, unjuk
kerja dan antar muka (interface) yang diperlukan. Kebutuhan baik untuk sistem
maupun perangkat lunak di dokumentasikan dan dilihat dengan pelanggan.
b. Desain
Desain perangkat lunak sebenarnya adalah proses multi langka yang
berfokus pada empat atribut sebuah program yang berbeda; struktur data, asitektur
perangkat lunak, representasi interface dan detail (algoritma) prosedural. Proses
desain menerjemahkan syarat/kebutuhan kedalam sebuah representasi perangkat
lunak yang dapat di perkirakan demi kualitas sebelum dimulai pemunculan kode.
Sebagaimana persyaratan, desain didokumentasikan dan menjadi bagian dari
konfigurasi perangkat lunak.
20
c. Penulisan kode program
Desain harus diterjemahkan dalam bentuk mesin yang bisa di baca. Langkah
pembuatan kode melakukan tugas ini. Jika desain dilakukan dengan cara yang
lengkap, pembuatan kode dapat diselesaikan secara mekanis.
d. Pengujian
Proses pengujian dilakukan pada logika internal untuk memastikan semua
pernyataan sudah diuji. Pengujian eksternal fungsional untuk menemukan
kesalahan-kesalahan dan memastikan bahwa input akan memberikan hasil yang
aktual sesuai yang dibutuhkan
e. Pemeliharaan
Perangkat lunak yang sudah disampaikan kepada pelanggan pasti akan
mengalami perubahan. Perubahan tersebut bisa karena mengalami kesalahan karena
perangkat lunak harus menyesuaikan dengan lingkungan (periperal atau sistem
operasi baru) baru, atau karena pelanggan membutuhkan perkembangan fungsional
atau unjuk kerja.
Sumber : Sukamto (2013:28)
Gambar II.1. Model Waterfall
21
2.2 Teori Pendukung (Tools Program)
A. Struktur Navigasi
Menurut Kurniawan (2010:213) pada pengembangan aplikasi berbasis web,
tentunya dalam membuat lebih dari satu halaman web, bahkan bisa ratusan jika
aplikasi yang dibangun kompleks. Oleh karenanya navigasi adalah fitur yang harus
disediakan. Navigasi berfungsi untuk berpindah dari satu halaman ke halaman yang
lain pada suatu aplikasi berbasis web, yang juga digunakan untuk memberikan
informasi lokasi halaman yang sedang dibuka.
Ada 4 macam bentuk dasar dari navigasi yang bisa digunakan dalam proses
pembuatan web, yaitu:
a. Linear (satu arah)
Linear adalah informasi berjalan secara berurutan dari frame satu ke frame
lain, atau dari tampilan satu ketampilan berikutnya. Pengguna tidak dapat
mengakses tampilan yang dikehendaki atau meloncat ke tampilan yang
dibutuhkan”.
Linear (satu alur) merupakan struktur yang hanya mempunyai satu
rangkaian cerita yang berurut. Dengan kata lain struktur ini hanya hanya dapat
menampilkan satu demi satu tampilan layar secara berurut menurut urutannya.
Tampilan yang dapat ditampilkan pada struktur jenis ini adalah satu halaman
sebelum atau satu halaman sesudah dan tidak dapat menampilkan dua halaman
sebelumnya atau dua halaman sesudahnya. Salah satu yang terpenting dari sturktur
ini adalah tidak diperkenankan terjadinya percabangan.
22
Sumber : Kurniawan (2010:213)
Gambar II.2. Struktur Navigasi Linear
b. Hierarchical (Hirarki)
Dengan Hierarchical (Hirarki), pengguna dapat membuat navigasi dengan
percabangan sebagai struktur pohon. Struktur navigasi ini sesuai untuk aplikasi
kebutuhan organisasi”.
Struktur Hierarchical ini percabangan untuk menampilkan data
berdasarkan kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai
master page (halaman utama kesatu), halaman utama ini akan mempunyai halaman
percabangan yang dikatakan slave page (halaman pendukung). Jika salah satu
halaman pendukung dipilih atau diaktifkan, maka tampilan tersebut akan bernama
master page (halaman utama kedua) dan seterusnya. Yang terpenting dari struktur
penjejakan ini tidak diperkenankan adanya tampilan secara linear.
Sumber : Kurniawan (2010:214)
Gambar II.3. Struktur Navigasi Hirarki
23
c. Non Linear (Tidak Berurut)
Dengan Non Linear, pengguna dapat membuat navigasi dengan bebas
dalam seluruh tampilan”. Struktur penjejakan non linear (tidak berurut) merupakan
pengembangan diri struktur penjejakan linear. Pada struktur ini diperkenankan
membuat penjejakan bercabang. Pemakai bebas menelusuri website tanpa dibatasi
oleh suatu rute dimana kontrol navigasi dapat mengakses ke semua halaman
manapun. Percabangan yang dibuat pada struktur non linear ini berbeda dengan
percabangan pada Hierarchical, karena pada percabangan, tetapi tiap-tiap tampilan
mempunyai kedudukan yang sama tidak ada Master page dan Slave page.
Sumber : Kurniawan (2010:215)
Gambar II.4. Struktur Navigasi Non Linear
d. Composite (Campuran)
Dengan composite, pengguna dapat membuat navigasi bebas dan juga dapat
memiliki struktur pohon. Namun, kadang-kadang dengan percabangan yang teraku
kompleks dapat membingungkan untuk kembali ke tampilan sebelumnya”.
24
Sumber : Kurniawan (2010:215)
Gambar II.5. Struktur Navigasi Campuran (Composite)
Composite (campuran) atau disebut juga struktur penjejakan bebas
merupakan gabungan dari ketiga struktur sebelumnya yaitu Linear, Non Linear, dan
Hierarchical. Jika suatu tampilan membutuhkan percabangan, maka dapat dibuat
percabangan, dan bila dalam percabangan tersebut terdapat suatu tampilan yang
sama kedudukannya maka dapat dibuat struktur Linear dalam percabangan
tersebut. Setiap struktur peta penjejakan seperti yang baru dibahas mempunyai
fungsi dan tujuan tersendiri, tidak ada yang lebih baik atau lebih buruk. Pengguna
peta penjejakan bergatung kepada kebutuhan dan tujuan dari Web yang hendak
dibuat. Semakin kompleks peta penjejakan yang digunakan, maka semakin sulit
pembuatan Page dari peta penjejakan tersebut.
B. Pengertian Entity Relationship Diagram (ERD)
Menurut Simarmata dan Paryudi (2010:67) “Entity Relationship Diagram
adalah pemodelan data utama dan akan membantu mengorganisasi data dalam suatu
proyek ke dalam entitas-entitas dan menentukan hubungan antarentitas. Proses
25
memungkinkan analis menghasilkan struktur basis data yang baik sehingga data
dapat disimpan dan diambil secara efisien”. ERD terdiri dari 3 komponen
diantaranya adalah sebagai berikut :
1) Entitas (Entity)
Entitas adalah suatu objek didunia nyata yang dapat dibedakan dengan
objek lainnya, objek tersebut dapat berupa orang, benda ataupun hal lainnya. Entitas
digambarkan dalam bentuk persegi panjang.
2) Atribut
Atribut merupakan semua informasi yang berkaitan dengan entitas. Atribut
sering dikenal dengan properti dari suatu entitas atau objek. Atribut digambarkan
dalam bentuk lingkaran elips.
3) Relasi
Relasi adalah suatu aturan yang memasangkan anggota himpunan satu ke
himpunan yang lain. Relasi digambarkan dalam bentuk belah ketupat.
C. Pengertian Logical Record Structure (LRS)
Menurut Hasugian dan Shidiq (2012:608) memberikan batasan
bahwa LRS adalah “sebuah model sistem yang digambarkan dengan sebuah
diagram-ER akan mengikuti pola / aturan permodelan tertentu dalam kaitannya
dengan konversi ke LRS”. Perubahan yang terjadi yaitu mengikuti aturan-aturan
sebagai berikut (Hasugian dan Shidiq, 2012:608) :
1) Setiap entitas akan diubah kebentuk kotak
2) Sebuah atribut relasi disatukan dalam sebuah kotak bersama entitas jika
hubungan yang terjadi pada diagram-ER 1:M (relasi bersatu dengan
26
cardinality M) atau tingkat hubungan 1:1 (relasi bersatu dengan cardinality
yang paling membutuhkan referensi).
Sebuah relasi dipisah dalam sebuah kotak tersendiri (menjadi entitas baru)
jika tingkat hubungannya M:M (many to many) dan memiliki foreign key sebagai
key yang di ambil dari kedua entitas yang sebelumnya saling berhubungan.
D. Pengujian Web
Menurut Simarmata (2010:323) “Pengujian adalah sebuah proses terhadap
aplikasi/ program untuk menemukan segala kesalahan dan segala
kemungkinan yang akan menimbulkan kesalahan sesuai dengan spesifikasi
perangkat lunak yang telah ditentukan sebelum aplikasi tersebut diserahkan kepada
pelanggan”.
Pengujian merupalam proses eksekusi program yang telah selesai dibuat
yang bertujuan untuk menemukan kesalahan. Pengujian yang baik adalah yang
dilakukan dengan probabilitas penemuan kesalahan yang tidak diduga, sedangjan
pengujian yang sukses adalah pengujian yang berhasil mengatasi penyelsaian
penemuan kesalahan yang tidak diduga.
Ada beberapa jenis dan strategi dalam pengujian perangkat lunak yang
semuanya memiliki satu tujuan yang sama, yaitu meningkatkan kepercayaan diri
pengembangan perangkat lunak terhadap fungsi-fungsi perangkat lunaknya.
Beranjak dari tujuan ini, suatu perangkat lunak dapat diuji untuk menerima
berbagai perlakuan.
Adapun pendekatan pengujian untuk validasi salah satunya adalah Black
Box Testing (pengujian kotak hitam). Pada black box testing, cara pengujian hanya
27
dilakukan dengan menjalankan atau mengeksekusi unit atau modul, kemudian
diamati apakah hasil dari unit itu sesuai denganproses bisnis yang diinginkan”. Jika
ada unit yang tidak sesuai outputnya maka untuk menyelsaikannya, diteruskan pada
pengujian yang kedua yaitu white box testing.
White box testing adalah cara pengujian dengan melihat kedalam modul
unutk meneliti kode-kode program yang ada, dan menganalisis apakah ada
kesalahan atau tidak”. Jika ada modul yang menghasilkan output yang tidak sesuai
dengan proses bisnis yang dilakukan, maka baris-baris program, variable dan
parameter yang terlibat pada unit tersebut akan dicek satu peprsatu dan diperbaiki,
kemudian di-compile ulang.
28
BAB III
PEMBAHASAN
3.1 Tinjauan Kasus
Transaksi jual beli sejauh ini masih dilakukan dipasar atau showroom,
dengan transaksi jual beli yang menggunakan sistem pembayaran tunai. Dalam
proses transaksi jual beli antara penjual dan pembeli biasanya terjadi negosiasi
harga. Negosiasi harga seringkali terjadi pada toko yang menjual barang-barang
dengan harga yang terbilang cukup tinggi seperti toko meubel.
Dengan semakin pesatnya persaingan bisnis disemua segmen pasar, maka
pemanfaatan teknologi informasi dirasa perlu untuk memperluas daerah atau
jangkauan pemasaran seperti bentuk pengembangan dalam menghadapi persaingan
lainnya.
Dalam bidang ini, pemanfaatan website merupakan solusi terbaik untuk
memecahkan permasalahan-permasalahan yang ada pada perusahan meubel ini.
Dengan pemanfaatan website diharapkan citra perusahan akan naik atau dengan
kata lain kepercayaan masyarakat terhadap perusahan ini akan meningkat dan tidak
diragukan lagi. Setidaknya dengan pemanfaatan website dapat menjadikan
Perusahaan Mulia Meubel Klaten melebarkan sayap, dalam arti memperluas area
promosi produk-produk meubel, sehingga nantinya Perusahaan Mulia Meubel
Klaten akan dikenal sampai kedaerah-daerah lain karena dapat diakses melalui
website. Oleh karena itu untuk meningkatkan bisnis dari penjualan barang meubel
ini perlu dibuat sistem informasi berbasis web dengan tujuan sebagai media promosi
dan juga mempermudah para pembeli untuk berbelanja atau sekedar untuk
29
mengetahui jenis barang, tampilan serta harga yang ditawarkan sebelum pelanggan
membeli langsung ke showroom Mulia Meubel Klaten.
3.2 Analisa Kebutuhan
Proses analisa kebutuhan rancangan website yang penulis buat pada
dasarnya adalah suatu bentuk upaya dan harapan kepada pengunjung website agar
mengenal dan mengetahui tentang penjualan barang meubel yang diproduksi oleh
Perusahaan Mulia Meubel Klaten. Sistem penjualan pada website ini menjadikan
calon pembeli tidak harus bertatap muka secara langsung kepada penjual untuk
melakukan transaksi pembelian. Proses ini dirasa kurang efektif karena banyak
membuang waktu pembeli, terutama bagi pembeli yang memiliki kesibukan dalam
kesehariannya.
Hal pertama yang perlu dilakukan dalam analisa kebutuhan adalah
mengidentifikasi kebutuhan yang diperoleh berdasarkan kebutuhan pengguna dan
kebutuhan sistem. Berikut adalah tahapan Analisa kebutuhan sistem :
a. Administrator
1. Admin dapat menambah, mengubah dan menghapus nama kategori.
2. Admin dapat menambah, mengubah, dan menghapus produk.
3. Admin dapat menambah, mengubah dan menghapus biaya ongkos kirim.
4. Admin dapat melihat data user atau konfirmasi dari member.
b. User
1. User dapat melihat produk meskipun tidak harus login untuk menjadi
member.
2. User harus login terlebih dahulu jika ingin membeli produk.
30
3. User harus login terlebih dahulu jika ingin mengisi form konfirmasi
pembayaran.
c. Kebutuhan Sistem Untuk Member
1. Menyediakan form pendaftaran untuk pengunjung agar dapat melakukan
pembelian produk.
2. Memberi informasi tentang cara pembayaran dan cara pembelian produk.
3. Menyediakan layanan transaksi pembelian produk.
4. Setelah melakukan transaksi pembelian produk, member dapat mengisi
form konfirmasi pembayaran.
3.3 Perancangan Prangkat Lunak
A. Rancangan Antar Muka
1. Rancangan Antar Muka Halaman Home (Index)
Index adalah halamam depan dari semua halaman yang ada pada tampilan
website. Halaman ini Juga dapat disebut sebagai halaman pembuka karena pada saat
website dibuka maka tampilan inilah yang akan muncul terlebih dahulu. Rancangan
halaman Index (Home) adalah sebagai berikut :
31
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
KOLEKSI BARANG
TELEPON
LOGIN
KATEGORI
Gambar Barang Deskripsi
Beli
Gambar Barang Deskripsi
Beli
BANNER
Gambar III.1
Rancangan Antar Muka Halaman Index
2. Rancangan Antar Muka Halaman Profil
Halaman Profil dirancang untuk menampilkan profil dari Mulia Meubel
Klaten. Selain itu tertera juga nomor rekening yang dipakai untuk transaksi
pembelian pada website Mulia Meubel. Serta daftar kontak dari Perusahaan Mulia
Meubel Klaten yang dapat dihubungi, seperti: email, facebook, dan nomor
handphone. Rancangan halaman Profil adalah sebagai berikut :
32
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
Profil singkat, nomor rekening dan kontak Mulia Meubel KlatenEMAIL
TELEPON
LOGIN
KATEGORI
Gambar III.2
Rancangan Antar Muka Halaman Profil
3. Rancangan Antar Muka Halaman Barang
Halaman Barang pada website ini berisi data-data barang yang dijual pada
website penjualan Mulia Meubel Klaten. Data tersebut mencakup nama barang,
harga barang, keterangan barang dan juga dilengkapi gambar dari barang yang
dijual tersebut. Rancangan halaman Barang adalah sebagai berikut:
33
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
KOLEKSI BARANGEMAIL
TELEPON
LOGIN
KATEGORI
Gambar Barang Deskripsi
Beli
Gambar Barang Deskripsi
Beli
Gambar III.3
Rancangan Antar Muka Halaman Barang
4. Rancangan Antar Muka Halaman Panduan
Halaman Panduan berisi tahap-tahap cara melakukan pembelian atau
panduan belanja di website ini, Rancangan halaman Panduan adalah sebagai
berikut:
34
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
PANDUAN BELANJAEMAIL
TELEPON
LOGIN
KATEGORI
Gambar III.4
Rancangan Antar Muka Halaman Panduan
5. Rancangan Antar Muka Halaman Konfirmasi
Halaman Konfirmasi merupakan halaman yang dirancang untuk
memberikan informasi konfirmasi transfer dari pembeli kepada Mulia Meubel
Klaten. Setelah melakukan pembayaran, pembeli harus melakukan konfirmasi
transfer untuk mempermudah admin dalam melakukan transaksi selanjutnya.
Rancangan Konfirmasi adalah sebagai berikut:
35
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
KONFIRMASI PEMBAYARAN
No. Pemesanan :
Nama Pengirim/ :Bank Pengirim
Jumlah Transfer :(Rp.)
Keterangan :
TELEPON
LOGIN
KATEGORI
KIRIM
Gambar III.5
Rancangan Antar Muka Halaman Konfirmasi
6. Rancangan Antar Muka Halaman Pendaftaran Pelanggan
Halaman Pendaftaran Pelanggan dirancang untuk pengguna agar dapat
melakukan pendaftaran pelanggan baru untuk selanjutnya memiliki username dan
password, sehinga penguna dapat melakukan transaksi pembelian. Rancangan
halaman Pendaftaran Pelanggan adalah sebagai berikut:
36
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
PENDAFTARAN PELANGGAN
Nama Pelanggan :
Kelamin :
E-Mail :
No. Telepon :
DATA LOGIN
Username :
Password :
Password (Lagi) :
TELEPON
LOGIN
KATEGORI
Daftar
Gambar III.6
Rancangan Antar Muka Halaman Pendaftaran Pelanggan
7. Rancangan Antar Muka Halaman Home Member
Halaman Home Member adalah halaman awal yang terdapat pada ruang
member setelah member berhasil login pada halaman login member . Rancangan
halaman Home Member sebagai berikut:
37
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
KOLEKSI BARANGEMAIL
TELEPON
TRANSAKSI
KATEGORI
Gambar Barang Deskripsi
Beli
Gambar Barang Deskripsi
Beli
Gambar III.7
Rancangan Antar Muka Halaman Home Member
8. Rancangan Antar Muka Halaman Koleksi Barang
Halaman Koleksi Barang dimana member bisa melihat deskripsi dari barang
yang dijual. Rancangan halaman koleksi barang adalah sebagai berikut:
38
Gambar Barang Deskripsi
Beli
Gambar Barang Deskripsi
Beli
KOLEKSI BARANG
Gambar Barang Deskripsi
Beli
Gambar Barang Deskripsi
Beli
Gambar III.8
Rancangan Antar Muka Halaman Koleksi Barang
9. Rancangan Antara Muka Halaman Keranjang Belanja
Halaman Keranjang Belanja dirancang agar member dapat melakukan
transaksi beli yang sedang dilakukan, termasuk didalamnya untuk menambah
jumlah barang yang akan dibeli. Rancangan Halaman Keranjang Belanja adalah
sebagai berikut:
39
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
KERANJANG BELANJA
Gambar Nama Barang Harga (Rp) Jumlah Total (Rp) Tools
____________ Rp_______ Rp_______ delete
Kategori : _________
GRAND TOTAL Rp________
TELEPON
LOGIN
KATEGORI Ubah Data
Lanjutkan
Gambar III.9
Rancangan Antar Muka Halaman Keranjang Belanja
10. Rancangan Antara Muka Halaman Tampilkan Transaksi
Halaman Tampilkan Transaksi dirancang agar member dapat melihat
pesanan atau melihat barang apa saja yang sudah dipesan, untuk kemudian
melakukan transaksi transfer dan kemudian melakukan konfirmasi pembayaran.
Rancangan halaman Akun Belanja adalah sebagai beikut:
40
HEADER
HOME | PROFIL | BARANG | PANDUAN | KONFIRMASI
Cari Barang :________________________________________Cari
FOOTER
No. | No. Pesan | Tanggal | Nama Penerima | Total (Rp) | Biaya Kirim (Rp) | Status | Tools
DAFTAR PEMESANANEMAIL
TELEPON
TRANSAKSI
KATEGORI
Gambar III.10
Rancangan Antar Muka Halaman Tampilkan Transaksi
11. Rancangan Antar Muka Halaman Konfirmasi Belanja
Halaman Konformasi Belanja dirancang untuk member agar dapat
memberikan konfirmasi atas barang yang sudah dibeli. Rancangan halaman
Konfirmasi Belanja adalah sebagai berikut:
41
KONFIRMASI PEMBAYARAN
No. Pemesanan :
Nama Pengirim/ :Bank Pengirim
Jumlah Transfer :(Rp.)
Keterangan :
KIRIM
Gambar III.11
Rancangan Antar Muka Halaman Konfirmasi Belanja
12. Rancangan Antar Muka Halaman Login Admin
Halaman Login Admin dirancang untuk masuk kedalam ruang admin,
sekaligus memproteksi halaman admin dari para pengguna yang tidak berhak
mengakses halaman admin. Rancangan halaman Login Admin adalah sebagai
berikut:
42
Halaman Admin
• Login
LOGIN ADMIN
Username :
Password :
Login
Gambar III.12
Rancangan Antar Muka Halaman Login Admin
13. Rancangan Antar Muka Halaman Home Admin
Halaman Home Admin adalah halaman awal yang terdapat pada ruang admin
setelah admin berhasil login. Rancangan halaman Home Admin adalah sebagai
berikut :
43
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
Selamat DatangAnda masuk sebagai Administrator
Gambar III.13
Rancangan Antar Muka Halaman Home Admin
14. Rancangan Antar Muka Halaman Ganti Password Admin
Halaman Ganti Password Admin dirancang untuk admin agar dapat
mengganti atau mengubah password yang digunakan untuk login ke ruang admin.
Rancangan halaman kategori adalah sebagai berikut:
44
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
GANTI PASSWORD ADMIN
Username : admin
Password Lama :
Password Baru :
Simpan
Gambar III.14
Rancangan Antar Muka Halaman Ganti Password Admin
15. Rancangan Antar Muka Halaman Biaya Kirim
Halaman Biaya Kirim dirancang untuk admin agar dapat menambahkan,
meng-edit atau menghapus area pengiriman yang berhubungan dengan biaya kirim
setiap produknya. Rancangan halaman Biaya Kirim adalah sebagai berikut:
45
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
BIAYA KIRIM
No. | Area Pengiriman | Biaya Kirim (Rp) | Tools
___ __________________________ _____________ edit delete
___ __________________________ _____________ edit delete
___ __________________________ _____________ edit delete
___ __________________________ _____________ edit delete
___ __________________________ _____________ edit delete
Add Data
Gambar III.15
Rancangan Antar Muka Halaman Biaya Kirim
16. Rancangan Antar Muka Halaman Data Kategori
Halaman Data Kategori dirancang agar admin bisa menambahkan, meng-
edit atau menghapus data kategori barang, sehingga dapat mempermudah baik bagi
konsumen maupun admin sendiri dalam mengelompokkan barang-barang meubel
berdasarkan kategorinya. Rancangan halaman Data Kategori adalah sebagai
berikut:
46
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
DATA KATEGORI
No. | Nama Kategori | Tools
___ __________________________ edit delete
___ __________________________ edit delete
___ __________________________ edit delete
___ __________________________ edit delete
___ __________________________ edit delete
Add Data
Gambar III.16
Rancangan Antar Muka Halaman Data Kategori
17. Rancangan Antar Muka Halaman Data Barang
Halaman Data Barang dirancang untuk admin agar dapat menambah, meng-
edit, atau menghapus barang-barang meubel yang dijual di website Mulia Meubel.
Rancangan halaman Data Barang adalah sebagai berikut :
47
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
DATA BARANG
No. | Kode | Nama Barang | Stok | Harga (Rp) | Tools
___ _____ ____________________ ____ _________ edit delete
___ _____ ____________________ ____ _________ edit delete
___ _____ ____________________ ____ _________ edit delete
___ _____ ____________________ ____ _________ edit delete
___ _____ ____________________ ____ _________ edit delete
Add Data
Gambar III.17
Rancangan Antar Muka Halaman Data Barang
18. Rancangan Antar Muka Halaman Data Pelanggan
Halaman Data Pelanggan dirancang untuk admin agar dapat melihat data
member atau pelanggan yang sudah melakukan pendaftaran pelangan baru.
Rancangan halaman Data Pelanggan adalah sebagai berikut :
48
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
DAFTAR PELANGGAN
Cari Nama :
No. | Kode | Nama Pelanggan | Kelamin | No. Telepon | Username | Tools
___ _____ _________________ ______ _________ __________ edit delete
___ _____ _________________ ______ _________ __________ edit delete
___ _____ _________________ ______ _________ __________ edit delete
___ _____ _________________ ______ _________ __________ edit delete
___ _____ _________________ ______ _________ __________ edit delete
Cari
Gambar III.18
Rancangan Antar Muka Halaman Data Pelanggan
19. Rancangan Antar Muka Halaman Pemesanan Barang
Halaman Pemesanan Barang dirancang untuk admin agar dapat melihat
daftar pemesanan dari member atau pelanggan baik yang telah melakukan
pembayaran ataupun belum, untuk selajutnya admin memprosesnya dan melakukan
pengiriman. Rancangan halaman Pemesanan Barang adalah sebagai berikut :
49
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
DAFTAR PEMESANAN
FILTER DATA
Periode :
No. | No Pesan | Tanggal | Nama Pelanggan | Total Transfer| Status | Set Bayar | Tools
___ _______ ________ _______________ ___________ ______ ___________ lihat
___ _______ ________ _______________ ___________ ______ ___________ lihat
___ _______ ________ _______________ ___________ ______ ___________ lihat
___ _______ ________ _______________ ___________ ______ ___________ lihat
___ _______ ________ _______________ ___________ ______ ___________ lihat
Tampilkan
Gambar III.19
Rancangan Antar Muka Halaman Pemesanan Barang
20. Rancangan Antar Muka Halaman Konfirmasi Transfer
Halaman Konfirmasi Transfer dirancang untuk admin agar dapat melihat
member atau pelanggan yang telah melakukan konfirmasi transfer. Rancangan
halaman Konfirmasi Transfer adalah sebagai berikut :
50
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
KONFIRMASI TRANSFER
No. | Tanggal |No. Pemesanan | Nama Pelanggan | Transfer (Rp) | Keterangan | delete
___ _______ _____________ _________________ ____________ __________ delete
___ _______ _____________ _________________ ____________ __________ delete
___ _______ _____________ _________________ ____________ __________ delete
___ _______ _____________ _________________ ____________ __________ delete
___ _______ _____________ _________________ ____________ __________ delete
Gambar III.20
Rancangan Antar Muka Halaman Konfirmasi Transfer
21. Rancangan Antar Muka Halaman Laporan
Halaman Laporan dibuat agar admin dapat melihat dan mencetak semua
semua jenis laporan yang ada di website Mulia Meubel. Rancangan antar muka
halaman Laporan adalah sebagai berikut :
51
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
• Laporan Data Area Pengiriman
• Laporan Data Kategori
• Laporan Data Barang
• Laporan Data Pelanggan
• Laporan Data Pemesanan Masuk - Periode
• Laporan Data Pemesanan Lunas - Tanggal
• Laporan Data Pemesanan Lunas - Periode
Gambar III.21
Rancangan Antar Muka Halaman Laporan
22. Rancangan Antar Muka Halaman Laporan Data Area Pengiriman
Halaman Laporan Data Area Pengiriman dirancang untuk admin agar
melihat lengkap biaya kirim penjualan barang di semua area pengiriman.
Rancangan antar muka halaman Laporan Data Area Pengiriman admin adalah
sebagai berikut:
52
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN DATA AREA PENGIRIMAN
No. | Area Pengiriman | Biaya Kirim (Rp)
___ ___________________________ ______________
___ ___________________________ ______________
___ ___________________________ ______________
___ ___________________________ ______________
___ ___________________________ ______________
Gambar III.22
Rancangan Antar Muka Halaman Laporan Data Area Pengiriman
23. Rancangan Antar Muka Halaman Laporan Data Kategori
Halaman Laporan Data Kategori dirancang untuk admin agar dapat
mengetahui data lengkap dari kategori barang yang dijual pada website Mulia
Meubel. Rancangan antar muka halaman Laporan Data Kategori adalah sebagai
berikut:
53
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN DATA KATEGORI
No. | Kode | Nama Kategori
___ _______________ ______________________
___ _______________ ______________________
___ _______________ ______________________
___ _______________ ______________________
___ _______________ ______________________
Gambar III.23
Rancangan Antar Muka Halaman Laporan Data Kategori
24. Rancangan Antar Muka Halaman Laporan Data Barang
Halaman Laporan Data Barang dirancang untuk admin agar dapat
mengetahui data lengkap dari data barang yang dijual pada website Mulia Meubel.
Rancangan antar muka halaman Laporan Data Barang adalah sebagai berikut:
54
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN DATA BARANG
KATEGORI BARANG
Pilih Kategori :
No. | Kode | Nama Pelanggan | Stok | H. Modal (Rp) | H. Jual (Rp)
___ _______ _______________________ _____ _____________ ____________
___ _______ _______________________ _____ _____________ ____________
___ _______ _______________________ _____ _____________ ____________
___ _______ _______________________ _____ _____________ ____________
___ _______ _______________________ _____ _____________ ____________
Tampilkan
Gambar III.24
Rancangan Antar Muka Halaman Laporan Data Barang
25. Rancangan Antar Muka Halaman Laporan Data Pelanggan
Halaman Laporan Data Pelanggan dirancang untuk admin agar dapat
mengetahui data lengkap dari setiap pelanggan yang di website Mulia Meubel.
Rancangan antar muka halaman Laporan Data Pelanggan adalah sebagai berikut:
55
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN DATA PELANGGAN
No. | No. Pelanggan | Nama Pelanggan |Kelamin | No. Telepon | E-Mail | Username
___ _____________ ___________________ _______ __________ _______ ________
___ _____________ ___________________ _______ __________ _______ ________
___ _____________ ___________________ _______ __________ _______ ________
___ _____________ ___________________ _______ __________ _______ ________
___ _____________ ___________________ _______ __________ _______ ________
Gambar III.25
Rancangan Antar Muka Halaman Laporan Data Pelanggan
26. Rancangan Antar Muka Halaman Laporan Pemesanan Masuk - Periode
Halaman Laporan Pemesanan Masuk – Periode dirancang untuk admin agar
dapat mengetahui data lengkap dari transaksi penjualan barang yang dijual pada
website Mulia Meubel berdasarkan periode penjualan. Rancangan antar muka
halaman Laporan Pemesanan Masuk – Periode adalah sebagai berikut:
56
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN PEMESANAN MASUK
FILTER DATA
Periode :
No. | Tanggal | Kode Plg | Nama Pelanggan | Total Barang | Total Bayar | Status | Tools
___ _______ ________ _______________ ___________ _________ _________ lihat
___ _______ ________ _______________ ___________ _________ _________ lihat
___ _______ ________ _______________ ___________ _________ _________ lihat
___ _______ ________ _______________ ___________ _________ _________ lihat
___ _______ ________ _______________ ___________ _________ _________ lihat
Tampilkan
Gambar III.26
Rancangan Antar Muka Halaman Laporan Pemesanan Masuk - Periode
27. Rancangan Antar Muka Halaman Laporan Pemesanan Lunas - Tanggal
Halaman Laporan Pemesanan Lunas – Tanggal dirancang untuk admin agar
dapat mengetahui data transaksi pembayaran dari pembelian barang yang dilakukan
oleh pelanggan pada website Mulia Meubel berdasarkan tanggal pembayaran.
Rancangan antar muka halaman Laporan Pemesanan Lunas – Tanggal adalah sebagai
berikut:
57
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN PEMESANAN LUNAS PER TANGGAL
FILTER DATA
Tanggal
Transaksi :
No. |Tanggal | No. Pemesanan | Kode Plg | Nama Pelanggan | Total Brg | Total Belanja | Tools
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
GRAND TOTAL : ________ __________
Tampilkan
Gambar III.27
Rancangan Antar Muka Halaman Laporan Pemesanan Lunas - Tanggal
28. Rancangan Antar Muka Halaman Laporan Pemesanan Lunas - Periode
Halaman Laporan Pemesanan Lunas – Periode dirancang untuk admin agar
dapat mengetahui data transaksi pembayaran dari pembelian barang yang dilakukan
oleh pelanggan pada website Mulia Meubel berdasarkan periode penjualan.
Rancangan antar muka halaman Laporan Pemesanan Lunas – Periode adalah
sebagai berikut:
58
Halaman Admin
• Home
• Password Admin
• Biaya Kirim
• Data Kategori
• Data Barang
• Data Pelanggan
• Pemesanan Barang
• Konfirmasi Transfer
• Laporan
• Logout
LAPORAN PEMESANAN LUNAS PER PERIODE
FILTER DATA
Periode s/d
Transaksi :
No. |Tanggal | No. Pemesanan | Kode Plg | Nama Pelanggan | Total Brg | Total Belanja | Tools
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
__ _______ _____________ ________ _______________ ________ __________ lihat
GRAND TOTAL : ________ __________
Tampilkan
Gambar III.28
Rancangan Antar Muka Halaman Laporan Pemesanan Lunas - Periode
3.3.2. Rancangan Basis Data
Perancangan basis data menghasilkan pemetaaan label–label yang
digambarkan dengan Entity Relatonship Diagram (ERD).
59
A. Entity Relationship Diagram (ERD)
pelanggan pesanarea
pengiriman
kategori
konfirmasi
admin
pesan_detail barang
MEMILIKI
MELAKUKAN MEMPUNYAI
MEMBERIKAN MEMILIKI
MEMPUNYAIDIPROSES
Kd_pelanggan
nm_pelanggan
kelamin
no_telepon
username
password
kd_areaalamatnm_area
no_telp
nm_pnrm
tgl_pesan kd_pos
kd_plgn
st_bayarno_pesan kd_area
nm_area
biaya_kirim
kd_barang
jumlah
harga
id
no_pemesanan
harga_jual
harga_modal
nm_barang
kd_barang
kd_kategori
file_gambar
keterangan
stok
nm_kategorikd_kategori
nm_pelanggan
id
keterangan
jumlah_transfer
no_pemesanan
tanggal
passwordusername
Gambar III.29
Entity Relationship Diagram (ERD)
60
B. Logical Record Structure (LRS)
kd_pelanggannm_pelanggan
no_teleponkelamin
emailusernamepassword
kd_pelangganno_pemesanantanggal_pesan
nama_penerimaalamat
kd_areakota
kd_posno_telepon
st_bayar
nm_areabiaya_kirim
kd_area
idno_pemesanannm_pelanggan
tanggaljumlah_transfer
keterangan
idno_pemesanan
kd_barangjumlahharga
kd_barangnm_barang
harga_modalharga_jual
stokfile_gambarkd_kategoriketerangan
kd_kategorinm_kategori
usernamepassword
Gambar III.30
Logical Record Structure (LRS)
C. Spesifikasi File
Menjelaskan tentang File atau tabel-tabel yang terbentuk dari transformasi
ERD (dan atau file-file penunjang website). File-file ini tersimpan pada nama
database dengan parameter-parameter tersebut :
1. Spesifikasi File Admin
Nama Database : mulia_meubel.sql
Nama File : File admin
Akronim : admin.MYD
61
Fungsi : Untuk menampilkan data admin
Tipe File : File Master
Media : Hard Disk
Panjang record : 232 karakter
Kunci Field : id
Software : MYSQL
Tabel III.1
Spesifikasi File Admin
No Elemen Data Nama Field Tipe Size Keterangan
1. Id Admin id int 2 Primary Key
2. User Name username varchar 30
3. Password Admin password varchar 200
2. Spesifikasi File Barang
Nama Database : mulia_meubel.sql
Nama File : File barang
Akronim : Barang.MYD
Fungsi : Untuk menampilkan data barang
Tipe File : File Master
Media : Hard Disk
Panjang record : 237 karakter
Kunci Field : kd_barang
Software : MYSQL
62
Tabel III.2
Spesifikasi File Barang
No Elemen Data Nama Field Tipe Size Keterangan
1. Kode Barang kd_barang Char 5 Primary key
2. Nama Barang nm_barang varchar 100
3. Harga Modal harga_modal int 12
4. Harga Jual harga_jual int 12
5. Stok stok int 4
6. Keterangan keterangan text -
7. File Gambar file_gambar varchar 100
8. Kode Kategori kd_kategori char 4
3. Spesifikasi File Kategori
Nama Database : mulia_meubel.sql
Nama File : File kategori
Akronim : Kategori.MYD
Fungsi : Untuk menampilkan kategori barang
Tipe File : File Master
Media : Hard Disk
Panjang record : 104 karakter
63
Kunci Field : kd_kategori
Software : MYSQL
Table III.3
Spesifikasi File Kategori
No Elemen Data Nama Field Tipe Size Keterangan
1. Kode Kategori kd_kategori char 4 Primary key
2. Nama Kategori nm_kategori varchar 100
4. Spesifikasi File Konfirmasi
Nama Database : mulia_meubel.sql
Nama File : File konfirmasi
Akronim : Konfirmasi. MYD
Fungsi : Untuk menampilkan konfirmasi pembelian
Tipe File : File Transaksi
Media : Hard Disk
Panjang record : 124 karakter
Kunci Field : id
Software : MYSQL
Tabel III. 4
Spesifikasi File Konfirmasi
64
No Elemen Data Nama Field Tipe Size Keterangan
1. Id Pemesanan Id int 4 Primary key
2. Nomor Pemesanan no_pemesanan varchar 8
3. Nama Pelanggan nm_pelanggan varchar 100
4. Jumlah Transfer jumlah_transfer int 12
5. Keterangan Keterangan text -
6. Tanggal Pesan tanggal date -
5. Spesifikasi File Pelanggan
Nama Database : mulia_meubel.sql
Nama File : File pelanggan
Akronim : Pelanggan.MYD
Fungsi : Untuk menampilkan data pelanggan
Tipe File : File Master
Media : Hard Disk
Panjang record : 346 karakter
Kunci Field : kd_pelanggan
Software : MYSQL
Tabel III.5
Spesifikasi File Pelanggan
65
No Elemen Data Nama Field Tipe Size Keterangan
1. Kode Pelanggan kd_pelanggan char 6 Primary Key
2. Nama Pelanggan nm_pelanggan Varchar 100
3 Jenis Kelamin kelamin
enum (‘Laki-
laki’,’Perempuan’)
-
4. Alamat Email email varchar 100
5. Nomor Telepon no_telepon varchar 20
6. User Name username varchar 20
7. Password password varchar 100
8. Tanggal Daftar tgl_daftar date -
6. Spesifikasi File Pemesanan
Nama Database : mulia_meubel.sql
Nama File : File pemesanan
Akronim : Pemesanan.MYD
Fungsi : Untuk menampilkan data pemesanan barang
Tipe File : File Transaksi
Media : Hard Disk
Panjang record : 403 karakter
Kunci Field : no_pemesanan
Software : MYSQL
66
Tabel III.6
Spesifikasi File Pemesanan
No Elemen Data Nama Field Tipe Size Keterangan
1. Nomor Pemesanan no_pemesanan char 8 Primary key
2. Kode Pelanggan kd_pelanggan char 6
3 Tanggal Pemesanan tgl_pemesanan date -
4. Nama Penerima nama_penerima varchar 60
5. Alamat Lengkap alamat_lengkap varchar 200
6. Kode Area kd_area char 3
7. Kota kota varchar 100
8. Kode Pos kode_pos varchar 6
9. Nomor Telepon no_telepon varchar 20
10. Status Pembayaran status_bayar
enum (‘Pesan’,
‘Lunas’,‘Batal’)
-
7. Spesifikasi File Pemesanan Item
Nama Database : mulia_meubel.sql
Nama File : File pemesanan_item
Akronim : pemesanan_item.MYD
Fungsi : Untuk menampilkan data pemesanan item
67
Tipe File : File Transaksi
Media : Hard Disk
Panjang record : 32 karakter
Kunci Field : id
Software : MYSQL
Tabel III.7
Spesifikasi File Pemesanan Item
No Elemen Data Nama Field Tipe Size Keterangan
1. Id Barang id int 4 Primary key
2. Nomor Pemesanan no_pemesanan char 8
3. Kode Barang kd_barang char 5
4. Harga Barang harga int 12
5. Jumlah Barang jumlah int 3
8. Spesifikasi File Pengiriman
Nama Database : mulia_meubel.sql
Nama File : Table pengiriman
Akronim : Pengiriman.MYD
Fungsi : Untuk menampilkan data biaya kirim
Tipe File : File Master
Media : Hard Disk
Panjang record : 115 karakter
68
Kunci Field : kd_area
Software : MYSQL
Tabel III.8
Spesifikasi File Pengiriman
No Elemen Data Nama Field Tipe Size Keterangan
1. Kode Area Pengiriman kd_area char 3 Primary Key
2.
Nama Area
Pengiriman
nm_area varchar 100
3. Biaya Pengiriman biaya_kirim int 12
9. Spesifikasi File Keranjang Belanja
Nama Database : mulia_meubel.sql
Nama File : File tmp_keranjang
Akronim : Keranjang.MYD
Fungsi : Untuk menampilkan keranjang belanja
Tipe File : File transaksi
Media : Hard Disk
Panjang record : 31 karakter
Kunci Field : id
Software : MYSQL
Tabel III.9
69
Spesifikasi File Keranjang Belanja
No Elemen Data Nama Field Tipe Size Keterangan
1. Id Pemesanan id int 5 Primary Key
2. Kode Barang kd_barang char 5
3. Harga Barang harga int 12
4. Jumlah Barang jumlah int 3
5. Tanggal Pesan tanggal date -
6. Kode pelanggan kd_pelanggan char 6
3.3.3 Rancangan Struktur Navigasi
Struktur navigasi website ini merupakan unsur yang sangat penting dalam
banyak halaman web. Tujuannya terutama agar pengunjung merasa mudah dalam
mengakses suatu halaman web. Biasanya komponen navigasi tersebut berupa
fasilitas untuk berpindah kehalaman lain dalam web, yang diwujudkan dalam
berbagai macam cara. Adapun penulis mengunakan bentuk dari peta Navigasi
Linear dan untuk Admin Navigasi Non- Linear di gambarkan sebagai berikut:
70
Index
Home Profil Barang Panduan Konfirmasi LOGINPendaftaran
Baru
Koleksi Barang
Index
Home Profil Barang Panduan Konfirmasi LOGINPendaftaran
Baru
Koleksi Barang
Gambar III.31
Struktur Navigasi Halaman Web Pengunjung
Halaman Member
Home Profil Barang Panduan Konfirmasi Log Out
Beli
Login Member
Halaman Member
Home Profil Barang Panduan Konfirmasi Log Out
Beli
Login Member
Gambar III.32
Struktur Navigasi Halaman Web Home Member
71
Halaman Admin
HomePassword
AdminBiaya Kirim
Data Kategori
Data BarangData
Pelanggan
Ganti Password
Login Admin
Pemesanan Barang
Konfirmasi Transfer
Laporan Logout
Add Edit Delete
Add Edit Delete
Add Edit Delete
Delete Bayar / Batalkan
Lihat Delete
Laporan Data Area Pengiriman
Laporan Data Kategori
Laporan Data Barang
Laporan Data Pelanggan
Laporan Pemesanan Masuk - Periode
Laporan Pemesanan Lunas - Tanggal
Laporan Pemesanan Lunas - PeriodeLihat
Lihat
Halaman Admin
HomePassword
AdminBiaya Kirim
Data Kategori
Data BarangData
Pelanggan
Ganti Password
Login Admin
Pemesanan Barang
Konfirmasi Transfer
Laporan Logout
Add Edit Delete
Add Edit Delete
Add Edit Delete
Delete Bayar / Batalkan
Lihat Delete
Laporan Data Area Pengiriman
Laporan Data Kategori
Laporan Data Barang
Laporan Data Pelanggan
Laporan Pemesanan Masuk - Periode
Laporan Pemesanan Lunas - Tanggal
Laporan Pemesanan Lunas - PeriodeLihat
Lihat
Gambar III.33
Struktur Navigasi Halaman Web Admin
3.4 Implementasi dan Pengunjian Unit
3.4.1 Implementasi
A. Implementasi Rancangan Antar Muka
Berikut adalah implementasi rancangan antar muka pada website Mulia
Meubel Klaten berdasarkan hasil rancangan antar muka.
72
1. Tampilan Halaman Index (Home) Pengunjung.
Gambar III.34
Tampilan Halaman Index (Home) Pengunjung
73
2. Tampilan Halaman Profil.
Gambar III.35
Tampilan Halaman Profil
3. Tampilan Halaman Barang.
Gambar III.36
Tampilan Halaman Barang
74
4. Tampilan Halaman Panduan.
Gambar III.37
Tampilan Halaman Panduan
5. Tampilan Halaman Konfirmasi.
Gambar III.38
Tampilan Halaman Konfirmasi
75
6. Tampilan Halaman Pendaftaran Pelanggan.
Gambar III.39
Tampilan Halaman Pendaftaran Pelanggan
7. Tampilan Halaman Home Member.
Gambar III.40
Tampilan Halaman Home Member
76
8. Tampilan Halaman Koleksi Barang.
Gambar III.41
Tampilan Halaman Koleksi Barang
9. Tampilan Halaman Keranjang Belanja.
Gambar III.42
Tampilan Halaman Keranjang Belanja
77
10. Tampilan Halaman Tampilkan Transaksi.
Gambar III.43
Tampilan Halaman Tampilkan Transaksi
11. Tampilan Halaman Konfirmasi Belanja.
Gambar III.44
Tampilan Halaman Konfirmasi Belanja
78
12. Tampilan Halaman Login Admin.
Gambar III.45
Tampilan Halaman Login Admin
13. Tampilan Halaman Home Admin.
Gambar III.46
Tampilan Halaman Home Admin
79
14. Tampilan Halaman Ganti Password Admin
Gambar III.47
Tampilan Halaman Ganti Password Admin
15. Tampilan Halaman Biaya Kirim.
Gambar III.48
Tampilan Halaman Biaya Kirim
80
16. Tampilan Halaman Data Kategori.
Gambar III.49
Tampilan Halaman Data Kategori
17. Tampilan Halam Data Barang.
Gambar III.50
Tampilan Halaman Data Barang
81
18. Tampilan Halaman Data Pelanggan.
Gambar III.51
Tampilan Halaman Data Pelanggan
19. Tampilan Halaman Pemesanan Barang.
Gambar III.52
Tampilah Halaman Pemesanan Barang
82
20. Tampillan Halaman Konfirmasi Transfer.
Gambar III.53
Tampilan Halaman Konfirmasi Transfer
21. Tampilan Halaman Laporan.
Gambar III.54
Tampilan Halaman Laporan
83
22. Tampilan Halaman Laporan Data Area Pengiriman.
Gambar III.55
Tampilan Halaman Laporan Data Area Pengiriman
23. Tampilan Halaman Laporan Data Kategori.
Gambar III.56
Tampilan Halaman Laporan Data Kategori
84
24. Tampilan Halaman Laporan Data Barang.
Gambar III.57
Tampilan Halaman Laporan Data Barang
25. Tampilan Halaman Laporan Data Pelanggan.
Gambar III.58
Tampilan Halaman Laporan Data Pelanggan
85
26. Tampilan Halaman Laporan Pemesanan Masuk - Periode.
Gambar III.59
Tampilan Halaman Laporan Pemesanan Masuk - Periode
27. Tampilan Halaman Laporan Pemesanan Lunas - Tanggal.
Gambar III.60
Tampilan Halaman Laporan Pemesanan Lunas - Tanggal
86
28. Tampilan Halaman Laporan Pemesanan Lunas - Periode.
Gambar III.61
Tampilan Halaman Laporan Pemesanan Lunas - Periode
B. Spesifikasi Sistem Komputer
Berikut ini adalah spesifikasi perangkat keras dan perangkat lunak
minimum yang dibutuhkan untuk mengimplementasikan aplikasi website penjualan
Mulia Meubel Klaten.
1. Spesifikasi Prangkat Keras
Perangkat Keras (hardware) adalah suatu bagian terpenting yang digunakan
dalam menjalankan software, pemilihan perangkat keras (hardware) apa saja yang
dibutuhkan untuk menjalankan aplikasi tersebut, sehingga program yang telah di
hasilkan dapat berjalan dengan baik.
Dalam hal ini perangkat keras (hardware) yang digunakan penulis dalam
penulisan dan pembuatan Tugas Akhir ini adalah sebagai berikut:
1) Processor : Intel(R) Celeron(R) CPU 1007U @1.50 GHz
2) Memory : 4 GB on board
87
3) Harddisk : HDD 320 GB
4) Monitor : 11,9” Inch
5) Keyboard : Standard (83 keys)
6) Mouse : Standard Mouse
2. Perangkat Lunak (Software)
Bagian terpenting yang lain yang mendukung program adalah perangkat
lunak (software) yang digunakan dengan menjalankan web serta sistem operasi
yang digunakan untuk menjalankan program tersebut.
Adapun perangkat lunak yang digunakan penulis dalam pembuatan program
Tugas Akhir ini adalah :
1) Sistem operasi Microsoft Windows 7 Ultimate
Sistem operasi windows telah banyak digunakan oleh para pengguna komputer
dalam membantu penggunaannya. Sistem operasi windows merupakan sistem
operasi yang sangat mudah digunakan.
2) Paket Program XAMPP
Paket program ini berisi:
a. Xampp web server yang berfungsi untuk menerima dan mengolah
permintaan browser web.
b. PHP editor yang berfungsi untuk mengolah dan menterjemahkan kode-kode
HTML.
c. MySQL yang berfungsi sebagai database untuk menyimpan dan mengolah
data yang dinamis dari sebuah aplikasi web.
88
3) Adobe Dreamweaver CS6
Program ini digunakan untuk menuliskan kode-kode pemrograman.
4) Adobe Photoshop CS6
Program ini digunakan untuk meng-edit gambar atau foto yang akan ditampilan
pada halaman web.
5) Google Chrome
Web browser ini digunakan sebagai wadah untuk melihat hasil dari website
yang telah selesai dibuat.
3.4.2. Pengujian Unit
Pengujian terhadap program yang dibuat oleh penulis menggunakan
blackbox testing yang fokus terhadap proses masukan dan keluaran program.
1. Pengujian Terhadap Form Login pelanggan
Tabel III.10
Form Login Pelanggan
No
Skenario
Pengujian
Test case Hasil yang diharapkan
Hasil
pengujian
Kesimpulan
1 Username dan
password
tidak diisi
kemudian klik
Login
Username
: kosong
Password
:kosong
Sistem akan menolak
akses dan menampilkan
“LOGIN ANDA
SALAH”
Beserta detail kesalahan
Sesuai
harapan
Valid
2 Username
diisi dan
Username
: Axelle
Sistem akan menolak
akses dan menampilkan
Sesuai
harapan
Valid
89
password
kosong
kemudian klik
Login
Password
: kosong
“LOGIN ANDA
SALAH”
Beserta detail kesalahan
3 Username
kosong dan
password diisi
kemudian klik
Login
Username
: kosong
Password
: Axelle
Sistem akan menolak
akses dan menampilkan
“LOGIN ANDA
SALAH”
Beserta detail kesalahan
Sesuai
harapan
Valid
4 Memasukan
salah satu
kondisi salah
pada
username atau
password
kemudian klik
Login
Username
: Axelle
Password
: axelle
Sistem akan menolak
akses dan menampilkan
“LOGIN ANDA
SALAH”
Beserta detail kesalahan
Sesuai
harapan
Valid
5 Memasukan
username dan
password
dengan data
yang benar
Username
: Axelle
Password
: Axelle
Sistem menerima akses
login dan kemudian
langsung menampilkan
halaman barang.
Sesuai
harapan
Valid
90
2. Pengujian Terhadap Login Admin
Tabel III.11
Hasil Pengujian Black Box Testing Halaman Login Admin
No
Skenario
pengujian
Test Case
Hasil yang
diharapkan
Hasil
pengujian
Kesimpulan
1 Username dan
password tidak
diisi kemudian
klik tombol login
Username :
(kosong)
Password :
(kosong)
Sistem akan
menolak akses user
dan menampilakan
“Error”
Beserta keterangan
Sesuai
harapan
Valid
2 Username diisi
kemudian
password tidak
diisi
(dikosongkan)
Username : admin
Password :
(kosong)
Sistem akan
menolak akses user
dan menampilakan
“Error”
Beserta keterangan
Sesuai
harapan
Valid
3 Username tidak
diisi dan
password diisi
kemudian klik
tombol login
Username :
(kosong)
Password : admin
Sistem akan
menolak akses user
dan menampilakan
“Error”
Beserta keterangan
Sesuai
harapan
Valid
4 Mengetikan
salah satu
kondisi salah
pada username
atau password
kemudian klik
tombol login
Username : admin
(benar)
Password :
123
(salah)
Sistem akan
menolak akses user
dan menampilakan
halaman login awal
Sesuai
harapan
Valid
91
5 Mengetikan
username dan
password dengan
benar kemudian
klik tombol login
Username : admin
Password : admin
Sistem menerima
akses login
kemudian langsung
menampilkan
halaman utama
administrator
Sesuai
harapan
Valid
3. Pengujian Terhadap Tombol Pembelian
Tabel III.12
Hasil Pengujian Black Box Testing Tombol Beli
No
Skenario
pengujian
Test Case
Hasil yang
diharapkan
Hasil
pengujian
Kesimpulan
1 Pengunjung
ingin melakukan
pembelian tapi
tidak melakukan
login terdahulu
Pengunjung :
menekan tombol
beli tapi belum
mendaftar.
Sistem akan
menolak akses
pengunjung dan
menampilkan
“Maaf Akses Anda
Ditolak!”
Sesuai
harapan
Valid
2 Pengunjung
sudah melakukan
daftar menjadi
member tapi
tidak melakukan
login terdahulu
Pengunjung :
menekan tombol
beli yang sudah
melakukan daftar
Sistem akan
menolak akses
pengunjung dan
menampilkan
“Maaf Akses Anda
Ditolak!”
Sesuai
harapan
Valid
3 Pengunjung telah
melakukan login
terdahulu dengan
Pengunjung :
login terdahulu dan
menekan tombol
beli
Sistem menerima
kemudian langsung
menampilkan
Sesuai
harapan
Valid
92
benar kemudian
tekan tombol beli
halaman pembelian
keranjang belanja
4. Pengujian Terhadap Form Konfirmasi Pembayaran
Tabel III.13.
Hasil Pengujian Black Box Testing Halaman Konfirmasi Belanja
No
Skenario
pengujian
Test Case
Hasil yang
diharapkan
Hasil
pengujian
Kesimpulan
1 Nama
penerima tidak
diisi kemudian
data yang
lainnya diisi
lalu klik
Simpan &
Lanjutkan
Transaksi
Nama Penerima :
(kosong)
Alamat Tujuan :
(Banyuripan)
Area Pengiriman :
(Klaten Selatan)
Kecamatan :
(Bayat)
Kode Pos :
(51357)
No Telepon :
(08562574848)
Sistem akan
menolak akses
dan akan
menampilkan
“Error”
Beserta
Keterangan
Sesuai
harapan
Valid
2 Alamat tujuan
tidak diisi
kemudian data
yang lainnya
diisi lalu klik
Simpan &
Lanjutkan
Transaksi
Nama Penerima :
(Lemuel Axelle)
Alamat Tujuan :
(kosong)
Area Pengiriman :
(Klaten Selatan)
Kecamatan :
(Bayat)
Kode Pos :
Sistem akan
menolak akses
dan akan
menampilkan
“Error”
Beserta
Keterangan
Sesuai
harapan
Valid
93
(51357)
No Telepon :
(08562574848)
4 Area
pengiriman
tidak dipilih
kemudian data
yang lainnya
diisi lalu klik
Simpan &
Lanjutkan
Transaksi
Nama Penerima :
(Lemuel Axelle)
Alamat Tujuan :
(Banyuripan)
Area Pengiriman :
(tidak dipilih)
Kecamatan :
(Bayat)
Kode Pos :
(51357)
No Telepon :
(08562574848)
Sistem akan
menolak akses
dan akan
menampilkan
“Error”
Beserta
Keterangan
Sesuai
harapan
Valid
5 Kecamatan
tidak diisi
kemudian data
yang lainnya
diisi lalu klik
Simpan &
Lanjutkan
Transaksi
Nama Penerima :
(Lemuel Axelle)
Alamat Tujuan :
(Banyuripan)
Area Pengiriman :
(Klaten Selatan)
Kecamatan :
(kosong)
Kode Pos :
(51357)
No Telepon :
(08562574848)
Sistem akan
menolak akses
dan akan
menampilkan
“Error”
Beserta
Keterangan
Sesuai
harapan
Valid
6 Kode Pos tidak
diisi kemudian
Nama Penerima :
(Lemuel Axelle)
Sistem akan
menolak akses
Sesuai
harapan
Valid
94
data yang
lainnya diisi
lalu klik
Simpan &
Lanjutkan
Transaksi
Alamat Tujuan :
(Banyuripan)
Area Pengiriman :
(Klaten Selatan)
Kecamatan :
(Bayat)
Kode Pos :
(kosong)
No Telepon :
(08562574848)
dan akan
menampilkan
“Error”
Beserta
Keterangan
7 No. Telepon
tidak diisi
kemudian data
yang lainnya
diisi lalu klik
Simpan &
Lanjutkan
Transaksi
Nama Penerima :
(Lemuel Axelle)
Alamat Tujuan :
(Banyuripan)
Area Pengiriman :
(Klaten Selatan)
Kecamatan :
(Bayat)
Kode Pos :
(51357)
No Telepon :
(kosong)
Sistem akan
menolak akses
dan akan
menampilkan
“Error”
Beserta
Keterangan
Sesuai
harapan
Valid
8 Semua data
diisi kemudian
klik Simpan &
Lanjutkan
Transaksi
Nama Penerima :
(Lemuel Axelle)
Alamat Tujuan :
(Banyuripan)
Area Pengiriman :
(Klaten Selatan)
Kecamatan :
Sistem akan
mengakses dan
akan memproses
ke halaman
selanjjutnya
Sesuai
harapan
Valid
95
(Bayat)
Kode Pos :
(51357)
No Telepon :
(kosong)
5. Pengujian Terhadap Form Pendaftaran Baru.
Tabel III.14.
Hasil Pengujian Black Box Testing Halaman Pendaftaran Baru
No
Skenario
pengujian
Test Case
Hasil yang
diharapkan
Hasil
pengujian
Kesimpulan
1. Nama tidak diisi
kemudian data
lainnya diisi
Nama :
(kosong)
Jenis Kelamin :
Laki-laki
Email :
No. Telepon :
085721594395
Username :
Beckham
Password :
Beckham
Password (lagi) :
Beckham
Sistem akan menolak
akses pendaftaran
dan menampilakan
“Error”
Beserta Keterangan
Sesuai
harapan
Valid
2. Jenis Kelamin
tidak dipilih
Alamat :
Nama :
(David Beckham)
Sistem akan menolak
akses pendaftaran
Sesuai
harapan
Valid
96
kemudian data
lainnya diisi
Jenis Kelamin :
(kosong)
Email :
No. Telepon :
085721594395
Username :
Beckham
Password :
Beckham
Password (lagi) :
Beckham
dan menampilakan
“Error”
Beserta Keterangan
3. Email tidak diisi
kemudian data
lainnya disi
Nama :
(David Beckham)
Jenis Kelamin :
(Laki-laki)
Email :
(kosong)
No. Telepon :
085721594395
Username :
Beckham
Password :
Beckham
Password (lagi) :
Beckham
Sistem akan menolak
akses pendaftaran
dan menampilakan
“Error”
Beserta Keterangan
Sesuai
harapan
Valid
4. No. Telepon
tidak diisi
Nama :
(David Beckham)
Jenis Kelamin :
Sistem akan menolak
akses pendaftaran
Sesuai
harapan
Valid
97
kemudian data
lainnya diisi
Laki-laki
Email :
No. Telepon :
(kosong)
Username :
Beckham
Password :
Beckham
Password (lagi) :
Beckham
dan menampilakan
“Error”
Beserta Keterangan
5. Username tidak
diisi dan data
lainnya diisi
Nama :
(David Beckham)
Jenis Kelamin :
Laki-laki
Email :
No. Telepon :
085721594395
Username :
(kosong)
Password :
Beckham
Password (lagi) :
Beckham
Sistem akan menolak
akses pendaftaran
dan menampilakan
“Error”
Beserta Keterangan
Sesuai
harapan
Valid
6. Password tidak
diisi kemudian
data lainnya diisi
Nama :
(David Beckham)
Jenis Kelamin :
Laki-laki
Sistem akan menolak
akses pendaftaran
dan menampilakan
“Error”
Sesuai
harapan
Valid
98
Email :
No. Telepon :
085721594395
Username :
Beckham
Password :
(kosong)
Password (lagi) :
Beckham
Beserta Keterangan
7. Password (lagi)
tidak diisi
kemudian data
lainnya diisi
Nama :
(David Beckham)
Jenis Kelamin :
Laki-laki
Email :
No. Telepon :
085721594395
Username :
Beckham
Password :
Beckham
Password (lagi) :
(kosong)
Sistem akan menolak
akses pendaftaran
dan menampilakan
“Error”
Beserta Keterangan
Sesuai
harapan
Valid
8. Semua data diisi
dengan benar
sesuai kriteria
Nama :
(David Beckham)
Jenis Kelamin :
Laki-laki
Email :
Sistem akan menolak
akses pendaftaran
dan menampilakan
“Error”
Beserta Keterangan
Sesuai
harapan
Valid
99
No. Telepon :
085721594395
Username :
Beckham
Password :
Beckham
Password (lagi) :
Beckham
9. Nama : (An Nur)
Alamat Lengkap
: (Semanan)
Telepon:
(085655544900)
Email :
(nunciess@gmail
.com)
User : (anur)
password : (anur)
Sistem menerima
akses pendaftaran
dan menampilkan
halaman koleksi
barang
Sesuai
harapan
Valid
100
BAB IV
PENUTUP
4.1 Kesimpulan
Dari pembahasan mengenai perancangan website penjualan pada
perusahaan Mulia Meubel Klaten ini, penulis menyimpulkan dari keseluruhan
pokok bahasan yaitu sebagai berikut:
a. Aplikasi e-commerce ini merupakan sebuah aplikasi yang bermanfaat dalam
bisnis perdagangan barang meubel, terutama sebagai bentuk perkembangan
teknologi dan informasi.
b. Dengan adanya website e-commerce ini maka konsumen tidak perlu datang ke
lokasi pembuatan atau show room untuk melihat atau bahkan mendapatkan
produk yang dinginkan, tetapi cukup dengan mengakses situs resmi Mulia
Meubel Klaten melalui media internet
c. Aplikasi e-commerce ini dapat menjadi penghubung dalam memperluas
jangkauan marketing dan/atau promosi pada perancangan website penjualan
barang meubel.
d. Dengan adanya aplikasi website e-commerce ini dapat meningkatkan efektifitas
dan efisiensi dalam bisnis perdagangan dari segi tenaga, waktu dan biaya seperti
harga sewa web hosting yang tidak terlalu mahal dan mengurangi biaya
operasional lainnya.
101
4.2 Saran
Menurut pengalaman yang telah penulis dapat selama berlangsungnya
proses perancangan aplikasi penjualan meubel berbasis web pada perusahaan Mulia
Meubel Klaten ini, penulis ingin memberikan beberapa saran, antara lain:
1. Dalam merancang atau membangun sebuah website, sebaiknya memperhatikan
konsep dari perancangan sebuah website, meliputi susunan isi website
berdasarkan jenis website, maupun menyangkut berbagai hal yang ada di dalam
website.
2. Untuk pengisian konten dalam website dirancang, sebaiknya menggunakan
kata-kata yang mudah dimengerti dan bahasa dipakai secara umum, supaya
dapat memberikan kesan baik pada website saat sedang dikunjungi.
3. Sebaiknya melakukan optimasi konten pada website yang dirancang, hal ini
akan berguna untuk menarik lebih banyak pengunjung lewat mesin pencari
(search engine).
102
DAFTAR PUSTAKA
Arief, M.Rudianto. 2011. Pemrograman Web Dinamis Menggunakan Php dan
Mysql. Yogyakarta: ANDI
Hasugian, H., dan Shidiq, A.N. 2012. Rancang Bangun Sistem Informasi Industri
Kreatif Bidang Penyewaan Sarana Olahraga (Semantik)
Hidayat, Deddy. 2010. “Definisi Sistem” Tangerang: Jurnal Cyber Raharja.
Hidayat, Rahmat. 2010. Cara Praktis Membangun Website Gratis. Jakarta: PT Elex
Media Komputindo.
Kurniawan, Erick. 2010.Cepat Mahir ASP.NET 3.5 untuk Aplikasi
Web Interaktif. Yogyakarta: Andi Publisher.
Madcoms. 2013. Kupas Tuntas Adobe Dreamweaver Dengan
Pemrograman PHP dan MySQL CS6. Yogyakarta: Andi Offse
Munir. 2011. Algoritma dan Pemrograman dalam Bahasa Pascal dan C. Jakarta :
PT Elex Media Komputindo.
Nugroho, Bunafit. 2014. Panduan Proyek Membuat Website Toko Online dengan
PHP, MySQL, Dreamweaver. Yogyakarta : PT. Alif Media.
Sibero, Alexander. 2014. Web Programming Power Pack. Yogyakarta : Buku Seru
Sigit, Aloyslus. 2011. Website Super Canggih Dengan Plugin JQuery Terbaik.
Jakarta: Media Kita.
Simarmata, Janner dan Iman Paryudi. 2010. Rekayasa Web. Yogyakarta: Andi
Offset
Suhartanto, Eko. 2010. Technopreneurship. Jakarta : PT Elex Media Komputindo.
Sukamto, Rossa Ariani dan M.Shalahudin. 2013. Rekayasa Perangkat Lunak
Terstruktur dan Berorientasi Objek. Bandung: Informatika
Supardi, Yuniar. 2010. Web My Profile dengan Joomla. Jakarta: PT. Elex Media
Komputindo.
103
Wardana Lingga, dan Nuraksa Makodian. 2010. Technopreneur. Jakarta : PT Elex
Media Komputindo.
Yuhefizar. 2008. 10 Jam Menguasai Internet dan Aplikasinya. Jakarta: Media
Komputindo.
Yuhefizar. 2013. Cara Mudah Dan Murah Membangaun Dan Mengelola Website.
Yogyakarta: Graha Ilmu.
104
DAFTAR RIWAYAT HIDUP
A. Biodata Mahasiswa
NIM : 12140361
Nama Lengkap : Emang Dani Widyono
Tempat/Tanggal Lahir : Kendal, 2 Februari 1992
Alamat Lengkap : Perumahan Ditjen Perhubungan Udara Blok G/6
Kec.Benda Kota Tangerang
B. Riwayat Pendidikan Formal dan Non-Formal
1. SD N 2 Puguh Lulus Tahun 2003
2. SMP N 1 Pegandon Lulus Tahun 2006
3. SMA N 1 Pegandon Lulus Tahun 2009
Jakarta, 10 Juli 2017
Emang Dani Widyono
105