MAKALAH PERANCANGAN WEB E-COMMERCE
PENJUALAN SEPATU ONLINE
DISUSUN OLEH : FITRI SUSANTI (12132842) RESHA BAYU H. (12133087) HELVIEN APRILIA (12133812) NDARU ANDIKA (12135213) AHMAD HASAN (12135320)
Program Studi Manajemen Informatika
Akademi Manajemen Informatika dan Komputer Bina Sarana Informatika Jakarta
2015
KATA PENGANTAR
Dengan mengucap puji syukur kehadirat Alloh SWT, karena atas rahmat dan hidayah-Nya kami selaku anggota kelompok dapat menyelesaikan tugas makalah perancangan web ini untuk memenuhi syarat nilai pengganti UAS mata kuliah
perancangan web. Dalam makalah yang kami buat ini, kami mendapatkan judul MAKALAH PERANCANGAN WEB E-COMMERCE PENJUALAN SEPATU ONLINE.
Dengan segala kerendahan hati kami sebagai anggota kelompok, menyadari bahwa penulisan di dalam makalah ini masih jauh dari kesempurnaan dan tidak luput dari kesalahan. Hal ini mengingat kemampuan dan pengalaman kami serta pengetahuan yang kami miliki sangat terbatas untuk menghasilkan karya tulis yang baik. Oleh karena itu saran dan kritik yang membangun dari semua pihak sangat kami harapkan.
Penulisan makalah ini tidak akan terwujud tanpa bantuan dari beberapa pihak, yaitu kepada kedua orang tua kami tercinta yang telah mengizinkan kami meluangkan waktu kami untuk belajar kelompok, Dosen kami Bapak Nur Alam yang telah membimbing kami dalam menyelesaikan makalah ini dengan sempurna. Semoga Alloh SWT senantiasa membalas kebaikan atas bantuannya kepada kami.
Aamiin WassalamualaikumWr. Wb. Penulis, Jakarta 2015 DAFTAR ISI Halaman Judul...i Kata Pengantar...ii Daftar Isi...iii Bab I PENDAHULUAN 1.1. Latar Belakang...1
1.2. Maksud dan Tujuan...2
1.3. Metode Penelitian...2
1.4. Ruang Lingkup...3
Bab II PEMBAHASAN 2.1. Analisis kebutuhan...4
2.2. Perancangan Perangkat Lunak...6
2.2.1. Rancangan Antar Muka...6
2.2.2. Rancangan Struktur Navigasi...9
2.2.3. Rancangan Basis Data (ERD, LRS, Spesifikasi File)...21
2.3. Implementasi dan Pengujian...31
Bab III PENUTUP 3.1. Kesimpulan...36
3.2. Saran...36
Daftar Pustaka...38
Lampiran...39
BAB I PENDAHULUAN 1.1 Latar Belakang
Semakin berkembangnya selera sepatu masyarakat sebagai salah satu bagian dari kebutuhan, sepatu juga kini menjadi trend fashion terbaru. Umumnya cara pemasaran dan penjualan produknya masih secara konvensional. Penjualan yang dilakukan hanya sebatas pada toko yang mereka miliki, dampak dari penjualan seperti ini adalah produk yang dijual terbatas pada pelanggan tertentu saja. Selain itu kurang tersedianya waktu pelanggan untuk datang melihat produk baru yang di sediakan.
Disamping itu saat ini juga sudah banyak peminat sepatu di indonesia, sehingga dengan sendirinya jumlah penggunaan sepatu juga akan semakin meningkat. Dengan adanya peluang penggunaan teknologi informasi khususnya internet untuk pelaku bisnis sepatu, maka diperlukan sebuah dukungan sistem atau aplikasi yang nantinya dapat mengatasi permasalahan yang ada, sehingga berdasarkan hal tersebut penulis tertarik untuk mengusulkan sebuah sistem berbasis web yang nantinya dapat diimplementasikan oleh pembisnis sepatu.
Perkembangan e-commerce pada saat ini juga dapat menjadi sesuatu yang menjanjikan. Hal ini dapat dilihat dari faktor kian bertambahnya pengguna internet. Electronic commerce (e-commerce) merupakan salah satu metode bisnis melalui internet. Dengan menggunakan metode ini para pengunjung atau calon pembeli dapat mengetahui info mengenai produk secara detail kapanpun dan dimanapun. Baik itu seperti harga, model, warna, ukuran, dan sebagainya. Selain itu, transaksi tetap dapat berjalan tanpa harus mendatangi lokasi penjualan.
Shoes Land merupakan usaha dagang yang bergerak di bidang penjualan sepatu berbagai merk. Dalam proses penjualannya, Shoes Land sudah menerapkan sistem online keseluruhan dan sudah tidak memakai sistem offline seperti beli di toko
atau bayar ditempat. Pengembangan aplikasi berbasis web ini akan penulis sajikan dalam bentuk makalah dengan judul “MAKALAH PERANCANGAN WEB E-COMMERCE PENJUALAN SEPATU ONLINE”.
1.2. Maksud dan Tujuan
Maksud dari perancangan web ini adalah untuk adalah mengembangkan sistem pemasaran di era global dengan menggunakan website sebagai salah satu cara memperluas dan mempermudah konsumen.
Tujuan dari perancangan web ini antara lain :
a. Mempermudah proses penjualan dan pemasaran
b. Mengontrol pengeolaan transaksi penjualan dan pemasaran c. Mempermudah konsumen dalam proses membeli
1.3. Metode Penelitian
Metode yang kami gunakan adalah : 1. Wawancara
Wawancara adalah proses memperoleh keterangan untuk tujuan peneliti dengan tanya jawab dan bertatap muka antara pewawancara dengan penjawab.
2. Studi Literatur
Metode ini bertujuan untuk mencari literature yang berisi teori-teori yang berkaitan dengan masalah yang akan dibahas. Dalam hal ini penulis melakukan pencarian serta pembelajaran dari berbagaimacam literatur dan dokumen yang berkaitan dengan website e-commerce.
1.4. Ruang Lingkup
Berdasarkan uraian diaatas, maka ruang lingkup penulis di batasi pada : 1.Pengelolaan transaksi penjualan
a.Katalog produk. b.New produk. 2. Pemesanan.
a. Cara pemesanan. 3. Pembayaran.
a. Transfer melalui bank b. Konfirmasi pembayaran c. History pembayaran.
d. Status barang / status pengiriman. e. History pemesanan
BAB II 2
PEMBAHASAN 2.1. Analisis Kebutuhan
Analisa kebutuhan adalah mengidentifikasi kebutuhan yang diperoleh berdasarkan kebutuhan pengguna dan kebutuhan sistem.
1. Analisis Kebutuhan Pengguna
Pengguna yang akan menggunakan web ini tediri dari tiga bagian yaitu admin, pelanggan dan pengunjung, dengan asumsi pengguna yang sudah terbiasa menggunakan web, sebagai berikut :
a. Admin
Admin adalah bagian pengguna sistem yang memiliki hak akses lebih dibandingkan dengan pelanggan dan pengunjung, dengan karakteristik sebagai berikut :
1) Mempunyai kemampuan dasar di bidang komputer.
2) Pemahaman yang cukup untuk mengelola dalam web serta memiliki pengetahuan tentang internet.
3) Memahami pelayanan transaksi pembelian secara langsung yang terjadi di toko Shoes Land.
4) Memiliki pengalaman lebih lama dlam menggunakan komputer. b. Pelanggan
Pelanggan adalah bagian pengguna sistem yang memiliki batasan hak akses, dengan karakteristik sebagai berikut :
1) Mempunyai kemampuan dasar dibidang komputer.
2) Mampu mengoperasikan komputer dan dapat melakukan browsing di internet.
c. Pengunjung
Pengunjung adalah bagian pengguna sistem yang memiliki batasan hak akses, dengan karakteristik sebagai berikut :
1) Mempunyai kemampuan dasar dibidang komputer.
2) Mampu mengoperasikan komputer dan dapat melakukan browsing di internet.
Berdasarkan karakteristik data diatas, pengguna yang ada di setiap bagian pada umumnya sudah bisa mengoperasikan komputer, dapat dilihat bahwa setiap pengguna minimal dapat melakukan browsing di internet dan dapat mengerti tentang e-commerce penjualan sepatu, dilihat dari latar belakang pendidikan dan pengalaman yang lebih lama dalam menggunakan komputer.
Analisis Kebutuhan Sistem
Perangkat lunak (Software) yag kami pakai dalam pembuatan web ini adalah sebagai beikut :
a. Komputer Tersedia
Sistem Operasi : Windows 7
Software : xampp-win32 versi 1.7.7, Adobe Dreamweaver CS5 b. Komputer yang disarankan
Sistem Operasi : Windows XP atau Windows 7
Software : xampp-win32 versi 1.7.7, Adobe Dreamweaver CS5, Google Chrome, Adobe Photoshop CS5
2.2 Perancangan Perangkat Lunak
LOGO
2.2.1 Rancangan Antar Muka
Menjelaskan rancangan antar muka (interface) yang terdapat pada web e-commerce pada Shoes Land.
a. Rancangan Antarmuka Login Admin
Username Password
Gambar II.1.
Rancangan Antarmuka Login Admin b. Rancangan Antarmuka Halaman Admin
Gambar II. 2
Rancangan antarmuka Halaman Admin a. Berisikan Menu pada halaman admin setelah melakukan login.
b. Main Content, disinilah nantinya semua halaman yang ada pada interface admin ditampilkan berdasarkan menu yang dipilih.
c. Rancangan Antarmuka Halaman User
5 LOGO
A SHOES LAND FOR EVERY SHOES LOVER
Beranda Profil Hubungi
kami Cara Pesan Register Produk Login LOGO Slider Produk Footer Search ADMIN M E N U MAIN CONTENT
Gambar II.2
Rancangan Antarmuka Halaman User
Gambar II.3
Rancangan Antar muka halaman user
2.2.2 Struktur Navigasi
Menurut Prihatna (2005:51) “Struktur Navigasi adalah susunan menu atau hoirarki dari suatu situs yang menggambarkan isi dari setiap halaman dan halaman dan link atau navigasi tiap halaman pada situs web”.
Struktur navigasi dapat di golongkan menurut kebutuhan objek, kemudahan pemakaian dan kemudahan membuatnyayang berpengaruh terhadap waktu pembuatan situs web. Bentuk dasar dari struktur navigasi adalah sebagai berikut:
1. Linier (satu alur)
Linear (satu alur) merupakan struktur yang hanya mempunyai satu
rangkaian serita yang berurut. Dengan kata lain struktur ini hanya menampilkan satu demi satu tampilan layar secara berurut menurut urutannya. Salah satu terpenting dari struktur ini adalah tidak di perkenankan terjadinya percabangan.
Sumber : Prihatna(2005:51) Gambar II.4 Stuktur Navigasi Linier
2. Hierarchical (hirarki)
Struktur Hierarchi (bercabang)ini percabangan untuk menampilkan data berdasarkan kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai
Master Page (halaman utama kesatu), halaman pertama ini akan mempunyai halaman
percabangan yang di sebut 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 tampilan secara linier.
Sumber : Prihatna (2005:51)
Gambar II.5
Struktur Navigasi Hierarchical (Hirarki)
3. Non Liner (Tidak berurut)
Struktur penjejakan Non Liner (tidak berurut) merupakan pegembangan dari strukur penjejakan Liner. Pada struktur ini diperkenankan membuat penjejakan bercabang. Pemakai bebas menelusuri website tanpa di batasi oleh suatu rute dimana
control navigasi dapat mengakses ke semua halaman manapun. Percabangan yang di
buat pada struktur Non Linear ini berbeda dengan percabangan yang di buat pada struktur Hirarchi. Karana pada percabangan Non Linear ini walaupun dapat percabangan, tetapi tiap-tiap tampilan mempunyai kedudukan yang sama tidak ada
Master Page dan Slave Page.
Sumber: Prihatna (2005:51)
Gambar II.6
Stuktur Non Linear
4. Composite (campuran)
Composite (campuran) atau disebut juga struktur penjejakan bebas merupakan gabungan dari ketiga struktur sebelumnya yaitu Linear,Non Linear,dan Hirarchi. Jika suatu tampilam membutuhkan percabangan, maka dapat dibuat
percabangan, dan bila dalam percabangan tersebut terdapat suatu tampilan yang sama kedudukannya maka dapaat dibuat struktur Linear dalam percabangan tersebut.
Pengguna peta penjejakan bergantung kepada kebutuhan dan tujuan dari
web yang hendak di buat. Semakin kompleks peta penjejakan yang digunakan, maka
semakin sulit pembuatan page dari peta penjejakan tersebut.
Sumber: Prihatna (2005:51) Gamabar II.7
Struktur Navigasi Composite
B. Enterprise Relation Diagram 1. Definisi ERD
Definisi menurut Al-Bahra (2005 A :142) menerangkan bahwa : “diagram relasi entitas merupakan suatu model jaringan yang menggunakan susunan data yang disimpan didalam system secara abstrak.”
Definisi Entity Relationship Diagram (ERD) menurut fatansyah (2004:79) “Model Entity relationship yang berisi komponen-komponen himpunan entitas dan himpunan relasi yang masing-masing di lengkapi dengan atribut-atribut yang mempresentasikan seluruh fakta dari dunia nyata yang kita tinjau, dapat digambarkan dengan lebih sistematis dengan menggunakan Entity Relationship (ERD).
Berdasarkan dua definisi tersebut penulis dapat menyimpulkan bahwa ERD adalah suatu model jaringan yang menggunakan susunan data yang tersimpan secara system atau teknik menggambar suatu skema database dimana setiap komponen yang terlihat dalam ERD memiliki atribut masing-masing yang mempresentasikan fakta dari dunia nyata yang sedang di tinjau.
2. Derajat Relationship (Relationship Degree)
Definisi derajat Relationship menurut Al-Bahra (2005 B :144) menyatakan bahwa: “Relationship Degree atau derajat Relationship adalah jumlah entitas yang berpartisipasi dalam satu relationship.” Derajat relationship yang sering dipakai di dalam ERD sebagai berikut:
a. Unary Relationship
Unary Relationship adalah model relationship yang terjadi antar
entity yang berasal dari entity set yang sama. Model ini juga sering di sebut
sebagai Rescursive Relationship atau Reflektive Relationship. Contoh:
10 Pegawai
Menika h
Sunmber: Al-Bahra (2005 :142) Gambar II.8
Diagram Relationship Unari
b. Binary Relationship
Binary Relationship adalah model relationship anata intance-intance dari satu tipe entitas (dua entity yang berasal dari entity yang sama).
Relasionship ini paling umum digunakan dalam pembuatan model data. Contoh :
N
Sumber Al-Bahra (2005:142) Gambar II.9
Diagram Relationship Binary
c. Ternary Relationship
Ternary Relationship merupakan relationship antara intance-intance
dari tiga tipe entitas secara serentak.
Contoh : 11 Dept Bekerj a untuk Pegwai Alat Pegawa i Pegawa i Bekerja untuk Jumlah
Sumber : Al-Bahra (2005:142) Gambar II.10
Diagram Ternary Relationship
1. Kardinalitas Relasi
Definisi kardinalitas menurut Al-Bahra (2005 B : 147) “Kardinalitas Relasi menunjukan jumlah maksimum tupel yang dapat berelasi dengan entitas yang lalin.” Terdapat 3 macam kardinalitas relasi yaitu sebagai berikut :
a. Relasi Satu ke Satu (One to One)
Tingkat hubungan ini menujukan hubungan satu ke satu, dinyatakan dengan satu kejadian pada entitas pertama, dan hanya mempunyai satu hubungan dengan satu kejadian pada entitas yang kedua dan sebaliknya. Contoh : 1 1 Sumber : Al-Bahra (2005-147) Gambar II.11 One to One 12 NID
Dosen Kepa Jurusan
la
b. Relasi Satu ke Banyak atau Banyak ke Satu (One to Many atau Many
toOne)
Tingkat hubungan satu ke banyak adalah sama dengan banyak ke satu, tergantung dari mana hubungan tersebut dilihat. Untuk satu kejadian pada entitas yang pertama dapat mempunyai banyak hubungan dengan kejadian pada entitas yang kedua. Sebaliknya, satu kejadian pada entitas yang kedua hanya dapat mempunyai satu hubungan dengan satu kejadian pada entitas yang pertama.
Contoh : 1 M Sumber : Al-Bahra (2005:147) Gambar II.12 One to Many Contoh : 13 NID Dosen Kuliah NID Kd Mk Belaj ar NID Kd Mk Nam a Nim Kuliah Mahasisw a Dia mbil
M 1
Sumber : Al-Bahra (2005:147)
Gambar II.13
One to Many
c. Relasi Banyak ke Banyak (Many to Many)
Tingkat hubungan banyak ke banyak terjad jika tiap kejadian pada sebuahentitas akan mempunyaibanyak hubungan dengan kejadian pada entitas lainnya, dilihat dari sisi entitas yang pertama maupun dilihat dari sisi entitas yang kedua.
Contoh :
Sumber : Al-Bahra (2005:147)
Gambar II.13
Many to Many
2. Definisi LRS
Menurut Priyadi (2014:40), LRS (Logical Record Structure) adalah representasi dari struktur record-record pad lebel-lebel yang terbentuk dari
14 NIM Kd Mk NIM Kd Mk Mahasisw a Kuliah Bela jar
hasil antar himpunan entitas. Menentukan kardinalitas, jumlah table dan
Foregn Key (FK).
Struktur navigasi pada Shoes Land adalah struktur navigasi campuran (composite) melalui struktu navigasi ini, dapat dilihat bagaimana isi dan susunan sebuah website secara menyeluruh.
Gambar II.14 Struktur Navigasi User
Gambar II.15
Struktur Navigasi Beranda
Gambar II.16 Struktur Navigasi Admin 2.2.3 Rancangan Basis Data (ERD, LRS, Spesifikasi File)
a. Entity Relationship Diagram
Perancangan basis data menghasilkan pemetaan tabel-tabel yang digambarkan dengan Entity Relationship Diagram (ERD)
Gambar II.17 ERD Structure b. LRS (Logical Record Sturcture)
Gambar II.18 LRS Structure c. Spesifikasi File
1.
a. Spesifikasi Table Register
Nama file : register
Akronim : register
Fungsi : Tempat penyimpanan data register
Tipe file : File Master
Organisasi File : Index Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 322
Kunci Fild : id_register
Software : Mysql
2.
b. Spesifikasi Table Transaksi Nama file : transaksi
Akronim : transaksi
Fungsi : Tempat penyimpanan data transaksi Tipe file : File transaksi
Organisasi File : Squencial Aksi File : Random
Media : Hardisk
Panjang Record : 155
Kunci Fild : id_transaksi Software : Mysql
3.
c. Spesifikasi Table Product
Nama file : product
Akronim : product
Fungsi : Tempat penyimpanan data product
Tipe file : File Master
Organisasi File : Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 259
Kunci Fild : id_product
Software : Mysql
4.
d. Spesifikasi Table Tipe
Nama file : tipe
Akronim : tipe
Fungsi : Tempat penyimpanan data tipe
Tipe file : File Master
Organisasi File : Index Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 41
Kunci Fild : id_tipe
Software : Mysql
5.
e. Spesifikasi Table Detail
Nama file : detail
Akronim : detail
Fungsi : Tempat penyimpanan data detail
Tipe file : File Master
Organisasi File : Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 122
Kunci Fild : id_detail
Software : Mysql
6.
f. Spesifikasi Table provinsi
Nama file : provinsi
Akronim : provinsi
Fungsi : Tempat penyimpanan data provinsi
Tipe file : File Master
Organisasi File : Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 211
Kunci Fild : id_provinsi
Software : Mysql
7.
g. Spesifikasi Table Ongkir
Nama file : ongkir
Akronim : ongkir
Fungsi : Tempat penyimpanan data ongkir
Tipe file : File Master
Organisasi File : Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 61
Kunci Fild : id_ongkir
Software : Mysql
8.
h. Spesifikasi Table Konfirmasi
Nama file : konfirmasi
Akronim : konfirmasi
Fungsi : Tempat penyimpanan data konfirmasi
Tipe file : File Master
Organisasi File : Squencial
Aksi File : Random
Media : Hardisk
Panjang Record : 283
Kunci Fild : id_konfirmasi
Software : Mysql
2.3. Implementasi dan Pengujian Implementasi
a. Implementasi Rancangan Antar Muka
b. Implementasi rancangan antar muka web e-commerce pada Shoes Land berdasarkan hasil rancangan antar muka.
1. Halaman Login Admin
Administrator harus melakukan login terlebih dahulu untuk dapat menggunakan modul-modul yang tersedia. Jika login berhasil, maka menu-menu yang sesuai dengan katagori user tersebut akan ditampilkan.
Gambar II.19 Halaman Login Admin 2. Halaman Admin
Halaman admin berisi modul-modul yang digunakan oleh admin untuk mengelola konten website, halaman ini akan tampil setelah admin melakukan proses login pada halaman login admin.
Gambar II.20 Halaman Admin 3. Halaman User
Halaman user berisi tentang semua informasi mengenai perusahaan termaksud juga informasi tentang produk yang dijual. Proses pemesanan produk dilakukan pada halaman user.
Gambar II.21 Halaman User
Pengujian
Pengujian terhadap program yang dibuat menggunakan blackbox testing yang fokus terhadap proses masukan dan keluaran program.
a. Pengujian terhadap form login Tabel
Hasil pengujian blackbox testing halam login
No Skenario Pengujian Text 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 Sesuai harapan Valid 2. Mengetikkan Username dan
password tidak diisi
atau kosong
kemudian klik tombol login Username : (Admin) Password : (kosong) Sistem akan menolak akses user Sesuai harapan Valid
3. Username tidak diisi
(kosong) dan
password diisi kemudian klik tombol login Username : (kosong) Password : (admin) Sistem akan menolak akses user Sesuai harapan Valid 4. Mengetikkan salah satu kondisi salah pada username atau password kemudian Username : (admin) Password : (passoword) -salah Sistem akan menolak akses user Sesuai harapan Valid 26
klik tombol login
5. Mengetikkan
username dan
password dengan data yang benar kemudian klik tombol login
Username : (admin) -benar Password : (admin) -benar Sistem menerima akses login dan kemudian langsung menampilkan menu utama Sesuai harapan Valid BAB III PENUTUP 27
3.1. Kesimpulan
Dari pembahasan makalah yang telah kami susun, penulis mencoba menyimpulkan pokok bahasan yang ada, adapun kesimpulannya adalah sebagai berikut:
1. Web e-commerce toko Shoes Land dibuat dengan menggunakan aplikasi online pidoco.com
2. Setelah dilakukan pengujian dan testing program, sistem yang terdapat didalam web e-commerce toko Shoes Land dapat berjalan dengan baik tanpa terjadi error.
3. Dengan menggunakan sarana sistem informasi online, bisnis dapat berjalan dengan mudah dan perkembangan bisnisdapat berkembang lebih cepat.
3.2. Saran
Dari pembahasan diatas, penulis mencoba memberikan beberapa saran sebagai alternatif pemikiran dengan harapan agar lenih dapat meningkatkan kualitas dalam penggunaan program ini. Adapun saran-saran tersebut adalah:
1. Selalu update software dan server terbaru, tentang informasi security terbaru, celah keamanan website, serta ancaman virus atau spyware yang ada di internet.
2. Validasi setiap input dari user yang langsung berhubungan dengan database.
3. Adanya backup data untuk mencegah terjadinya kehilangan data baik akibat kelalaian manusia, mesin, atau bencana alam.
Daftar Pustaka
1. https://pidoco.com/en
2. http://materi-kuliah-informatika.blogspot.co.id/2012/02/contoh-kkp-bsi-manajemen-informatika.html
3. https://www.mataharimall.com/
4. Tugas Akhir (TA) BSI tahun 2014 AMIK Penjualan Sepatu Online Berbasis Web. 5. http://menir-gaptek.blogspot.co.id/2015/05/macam-macam-struktur-navigasi.html
Lampiran
