xviii
DAFTAR SIMBOL
1. Flow Map
Simbol Nama
Keterangan
Proses Merupakan proses computer
yang terjadi didalam aliran dokumen
Aliran Menunjukkan data-data yang
mengalir pada sistem
Proses Manual Merupakan proses manual
yang terjadi didalam sistem
File Storage Merupakan penyimpanan data,
menunjukkan data yang disimpan kedalam suatu disk
harddisk
Dokumen Dokumen yang dialirkan
didalam flow map
Offline Storage Arsip
Menunjukan tempat penyimpanan data berupa
arsip
xix
2. Data Flow Diagram DFD
No Simbol
Keterangan
1.
Proses
menunjukan transformasi dari masukan menjadi keluaran
2.
Entitas eksternal dimana entitas
tersebut berkomunikasi dengan sistem
3.
Penyimpanan
menunjukan
penyimpanan dalam sebuah database
4.
Aliran
menggambarkan aliran data yang masuk ke proses atau keluar dari
suatu proses
3. Entity Relationship Diagram ERD
No Simbol
Keterangan
1.
Data Entitas
segala sesuatu yang nyata ataupun abstrak yang datanya
akan diolah
2.
Relasi
menunjukan adanya hubungan antara sejumlah entitas yang berasal
dari himpunan entitas berbeda
3.
Aliran Data menyatakan penghubung
antara Relasi dengan Data Entitas dan dengan atribut
4.
Atribut
menunjukan field-field yang dimiliki oleh suatu Data Entitas atau
Relasi
xx
DAFTAR LAMPIRAN
Lampiran A Tampilan Antar Muka .................................................................... A-1 Lampiran B Listing Program .............................................................................. B-1
Lampiran C Hasil Kuesioner .............................................................................. C-1 Lampiran D Surat Penelitian .............................................................................. D-1
1
BAB I PENDAHULUAN
1.1 Latar Belakang Masalah
Saat ini pengguna internet sangat banyak di Indonesia bahkan di seluruh dunia. Terdapat sekitar 1867,2 juta orang didunia yang menggunakan internet.
Dalam kenyataannya banyak sekali pengguna menggunakan internet untuk mencari informasi atau mencari barang
– barang yang mereka butuhkan tanpa harus pergi ke tokonya secara langsung. Membeli barang melalui internet salah
satunya menggunakan E-Commerce. E-commerce pertama kali diperkenalkan pada tahun 1994 pada saat pertama
kali banner-elektronik dipakai untuk tujuan promosi dan periklanan di suatu halaman-web website. Secara umum e-commerce dapat didefinisikan sebagai
segala bentuk transaksi perdaganganperniagaan barang atau jasa trade of goods and service dengan menggunakan media elektronik. E-commerce dapat
melibatkan transfer dana elektronik, pertukaran data elektronik, sistem manajemen inventori otomatis, dan sistem pengumpulan data otomatis.
Distro Black Orange telah berdiri di Jakarta sejak tanggal 3 Agustus 2007. Distro ini masih sangat kurang dalam hal mempromosi produk-produknya kepada
konsumen. Dalam hal pemasaran, produk-produk di distro ini masih memiliki beberapa kendala diantaranya konsumen kesulitan mendapatkan informasi
produk secara online, karena kurangnya media informasi kepada konsumen. Distro ini juga dalam hal perkembangkan usahanya masih sangat kurang dalam
menghadapi tekanan bisnis yang sangat berat. Tingginya tekanan bisnis yang
2
muncul akibat tingginya tingkat persaingan mengharuskan distro Black Orange untuk dapat memberikan respon.
Untuk menghubungkan konsumen dengan produk-produk yang ditawarkan dan membantu menyelesaikan beberapa kendala yang ada, serta untuk lebih
menyebarkan dan memberikan kesempatan kepada konsumen dalam mengenal lebih jauh tentang produk-produk yang ditawarkan oleh distro ini, maka salah satu
solusi yang bisa diambil adalah dengan adanya media website sebagai penyebarluasan produk-produk yang ada di distro ini.
Berdasarkan uraian di atas, maka dilakukan penelitian dan mengangkatnya
menjadi materi Skripsi dengan judul : “MEMBANGUN SISTEM E-
COMMERCE DI DISTRO BLACK ORANGE”.
1.2 Identifikasi Masalah
Sesuai dengan pokok pikiran diatas maka permasalahan yang terdapat pada penelitian ini adalah :
1. Belum adanya sarana untuk mempromosikan produk-produknya kepada konsumen.
2. Konsumen masih kesulitan mendapatkan informasi tentang produk-produk yang ditawarkan oleh distro ini.
3. Konsumen masih kesulitan dalam hal pemesanan jarak jauh secara on-line.
3
1.3 Maksud dan Tujuan
Adapun maksud dari penulisan tugas akhir ini adalah membangun sistem E- Commerce di Distro Black Orange dengan menggunakan website.
Sedangkan yang menjadi tujuan penulisan tugas akhir ini adalah: 1. Membangun sarana untuk mempromosikan produk-produknya kepada
konsumen. 2. Untuk menjadi media informasi secara umum kepada konsumen dalam
mengenal lebih jauh tentang produk-produk yang ditawarkan. 3. Untuk mempermudah konsumen memesan produk-produk yang ditawarkan
secara on-line.
1.4 Batasan Masalah
Berdasarkan dari apa yang telah dipaparkan di atas, maka batasan masalah dalam penelitian ini adalah sebagai berikut:
1. Pemesanan produk secara on-line yang meliputi wilayah pulau jawa dan Sumatra.
2. Ongkos kirim disesuaikan dengan jarak dan berat barang yang dipesan. 3. Proses pembayaran barang yang sudah dibeli di transfer melalui rekening
antar Bank. Pembayaran barang tidak dapat dilakukan secara online. 4. Pemesanan barang hanya dapat dilakukan oleh member.
5. Pengguna sistem aplikasi ini adalah : a. Admin : mengelola data operator dan pelanggan.
b. Operator : mengelola data master. c. Pelanggan : memesan barang.
d. Pengunjung : melihat-lihat barang tetapi tidak memesan barang.
4
1.5 Metodologi Penelitian
Metodologi yang digunakan dalam penulisan tugas akhir ini adalah sebagai berikut :
1. Tahap pengumpulan data Metode pengumpulan data yang digunakan dalam penulisan tugas akhir ini
adalah sebagai berikut : a. Studi Literatur
Pengumpulan data dengan cara mengumpulkan literatur, jurnal, browsing internet
dan bacaan-bacaan yang ada kaitannya dengan topik yang diambil juga mempelajari dokumentasi dari instansi.
b. Observasi Teknik pengumpulan data dengan mengadakan penelitian dan peninjauan
langsung terhadap permasalahan yang diambil. 2. Tahap pembuatan perangkat lunak
Teknik analisis data dalam pembuatan perangkat lunak menggunakan paradigma perangkat lunak secara waterfall seperti tercantum pada gambar 1.1,
yang meliputi beberapa proses diantaranya: a. System Information Engineering
Merupakan bagian dari sistem yang terbesar dalam pengerjaan suatu proyek, dimulai dengan menetapkan berbagai kebutuhan dari semua
elemen yang diperlukan sistem dan mengalokasikannya kedalam pembentukan perangkat lunak.
5
b. Analisis Merupakan tahap menganalisis hal-hal yang diperlukan dalam pelaksanaan
proyek pembuatan perangkat lunak. c. Design
Tahap penerjemahan dari data yang dianalisis kedalam bentuk yang mudah dimengerti oleh user.
d. Coding Tahap penerjemahan data atau pemecahan masalah yang telah dirancang
keadalam bahasa pemrograman tertentu. e. Pengujian
Merupakan tahap pengujian terhadap perangkat lunak yang dibangun. f. Maintenance
Tahap akhir dimana suatu perangkat lunak yang sudah selesai dapat mengalami perubahan
–perubahan atau penambahan sesuai dengan permintaan user.
Gambar 1.1 Model Waterfall
6
1.6 Sistematika Penulisan
Sistematika penulisan proposal ini disusun untuk memberikan gambaran umum tentang perangkat lunak yang akan dibuat. Sistematika penulisan tugas
akhir ini adalah sebagai berikut : BAB I PENDAHULUAN
Bab ini menguraikan tentang latar belakang masalah, rumusan masalah, maksud dan tujuan, batasan masalah, metode penelitian dan sistematika penulisan.
BAB II TINJAUAN PUSTAKA Bab ini memaparkan beberapa hal yaitu landasan teori seperti sistem, sistem
informasi , pengertian data, pengertian basis data, E-Commerce, perancangan sistem, tool yang digunakan untuk membangun aplikasi, internet.
BAB III ANALISIS DAN PERANCANGAN Bab ini memaparkan tentang analisis sistem, analisis masalah, analisis yang
sedang berjalan, analisis kebutuhan non fungsional, perancangan sistem, perancangan antar muka dan sebagainya.
BAB IV IMPLEMENTASI Pada bab ini diuraikan tentang lingkungan implementasi, implementasi antar
muka, pengujian perangkat lunak yang menggunakan pengujian alpha dan betha. BAB V KESIMPULAN DAN SARAN
Pada bab ini berisi tentang kesimpulan dan saran yang diajukan agar dapat menjadi bahan pertimbangan.
7
BAB II TINJAUAN PUSTAKA
2.1 Sistem
2.1.1 Pengertian Sistem
Terdapat dua kelompok pendekatan didalam pengertian sistem, yaitu yang menekankan pada prosedurnya dan yang menekankan pada komponen atau
elemennya. Pendekatan sistem yang lebih menekankan pada prosedur mendefinisikan sistem sebagai berikut ini :
“Suatu sistem adalah suatu jaringan kerja dari prosedur-prosedur yang saling berhubungan, berkumpul bersama-sama untuk melakukan suatu kegiatan atau
untuk menyelesaikan suatu sasaran yang tertentu” Menurut Jerry Fitzgerald, Ardra F. Fitzgerald dan Warren D. Stallings, Jr.,
mendefinisikan prosedur sebagai berikut : “Suatu prosedur adalah urut-urutan yang tepat dari tahapan-tahapan instruksi
yang menerangkan Apa What yang harus dikerjakan, Siapa Who yang mengerjakannya,
Kapan When
dikerjakan dan
Bagaimana How
mengerjakannya” Pendekatan sistem yang lebih menekankan pada elemen atau
komponennya mendefiniskan sistem sebagai berikut ini : “Sistem adalah kumpulan dari elemen-elemen yang berinteraksi untuk mencapai
suatu tujuan tertentu”
Kedua kelompok definisi tersebut adalah benar dan tidak bertentangan, yang berbeda adalah cara pendekatannya. Pendekatan sistem yang merupakan
kumpulan elemen-elemen atau komponen-komponen yang lebih luas. Suatu sistem terdiri dari sejumlah komponen yang saling berinteraksi,
bekerja sama membentuk satu kesatuan. Komponen-komponen sistem dapat berupa suatu subsistem atau bagian-bagian dari sistem. Setiap sistem tidak perduli
betapapun kecilnya, selalu mengandung komponen-komponen atau subsistem- subsistem. Setiap subsistem mempunyai sifat-sifat dari sistem untuk menjalankan
suatu fungsi tertentu dan mempengaruhi proses sistem secara keseluruhan. Suatu sistem dapat mempunyai suatu sistem yang lebih besar yang disebut supra sistem,
misalnya suatu perusahaan dapat disebut dengan suatu sistem dan industri yang merupakan sistem yang lebih besar dapat disebut dengan supra sistem. Kalau
dipandang industri sebagai suatu sistem, maka perusahaan dapat disebut sebagai subsistem. Demikian juga bila perusahaan dipandang sebagai suatu sistem, maka
sistem akuntansi adalah subsistemnya.
2.1.2 Karakteristik Sistem
Suatu sistem menpunyai karakteristik atau sifat-sifat tertentu, yaitu mempunyai komponen-komponen components, batas boundary, lingkungan
luar sistem environments, penghubung interface, masukan input, keluaran output, pengolah process, dan sasaran objectives atau tujuan goal.
Input Proses
Output Sub Sistem
Sub Sistem Sub Sistem
Sub Sistem Sub Sistem
Penghubung Batasan
Batasan
Gambar 2.1 Karakteristik Sistem
a. Komponen Sistem Suatu sistem terdiri dari sejumlah komponen yang saling berinteraksi, yang
artinya saling bekerjasama membentuk suatu kesatuan. Komponen-komponen sistem atau elemen-elemen sistem dapat berupa subsistem atau bagian-bagian
dari sistem. Setiap sistem tidak perduli betapapun kecilnya, selalu mengandung komponen-komponen atau subsistem-subsistem. Setiap subsistem mempunyai
sifat-sifat dari subsistem untuk menjalankan suatu fungsi tertentu dan mempengaruhi proses sistem secara keseluruhan. Suatu sistem dapat
mempunyai suatu sistem yang lebih besar disebut dengan supra sistem, misalnya suatu perusahaan dapat disebut sebagai suatu sistem sedang industri
yang merupakan sistem yang lebih besar dapat disebut dengan supra sistem. Kalau dipandang industri sebagai suatu sistem, maka perusahaan dapat disebut
sebagai subsistem. Demikian juga bila perusahaan dipandang sebagai suatu sistem, maka sistem akuntansi adalah subsistemnya. Kalau sistem akuntansi
dipandang sebagai suatu sistem, maka perusahaan adalah supra sistem dan industri adalah supra dari supra sistem.
b. Batas sistem Batas sistem boundary merupakan daerah yang membatasi antara suatu
sistem dengan sistem yang lainnya atau dengan lingkungan luarnya. Batas sistem ini memungkinkan suatu sistem dipasang sebagai suatu kesatuan. Batas
suatu sistem menunjukkan ruang lingkup scope dari sistem tersebut. c. Lingkungan luar sistem
Lingkungan luar environment dari suatu sistem adalah apapun diluar batas dari sistem yang mempengaruhi operasi sistem. Lingkungan luar sistem dapat
bersifat menguntungkan dan dapat bersifat merugikan sistem tersebut. Lingkungan luar yang menguntungkan merupakan energi dari sistem dan
dengan demikian harus tetap dijaga dan dipelihara. Sedang lingkungan luar yang merugikan harus ditahan dan dikendalikan, kalau tidak maka akan
mengganggu kelangsungan hidup dari sistem. d. Penghubung sistem
Penghubung interface merupakan media penghubung antara satu subsistem dengan subsistem lainnya. Melalui penghubung ini memungkinkan sumber-
sumber daya mengalir dari satu subsistem ke subsistem yang lain. Keluaran output dari satu subsistem akan menjadi satu masukan input bagi subsistem
yang lain dan akan melalui penghubung. Dengan penghubung satu subsistem dapat berintegrasi dengan subsistem yang lainnya membentuk satu kesatuan.
e. Masukan sistem Masukan input adalah energi yang dimasukkan kedalam sistem. Masukan
dapat berupa masukan peralatan maintenence input dan masukan sinyal signal input. Mantenance input adalah energi yang diproses agar didapatkan
keluaran. Sebagai contoh didalam sistem komputer, program adalah maintenance input yang digunakan untuk mengoperasikan komputernya
sedangkan data adalah signal input untuk diolah menjadi informasi. f. Keluaran sistem
Suatu sistem dapat mempunyai suatu bagian pengolah yang akan merubah masukan menjadi keluaran. Suatu sistem produksi akan mengolah masukan
berupa bahan baku dan bahan-bahan yang lain menjadi keluaran berupa barang jadi. Sistem akuntansi akan mengolah transaksi menjadi laporan keuangan dan
laporan-laporan lain yang dibutuhkan oleh menejemen. g. Sasaran sistem
Suatu sistem pasti mempunyai tujuan goal atau sasaran objektif. Kalau sistem tidak mempunyai sasaran, maka operasi sistem tidak akan ada gunanya.
Sasaran dari sistem sangat menentukan sekali, masukan yang dibutuhkan
sistem dan keluaran yang akan dihasilkan sistem.
2.2 Sistem Informasi
2.2.1 Pengertian Sistem Informasi
Sistem informasi adalah sekumpulan komponen pembentuk sistem yang mempunyai keterkaitan antara satu komponen dengan komponen lainnya yang
bertujuan menghasilkan suatu informasi dalam suatu bidang tertentu. Dalam sistem informasi diperlukannya klasifikasi alur informasi, hal ini disebabkan
keanekaragaman kebutuhan akan suatu informasi oleh pengguna informasi. Kriteria dari sistem informasi antara lain, fleksibel, efektif dan efisien.
Sistem informasi merupakan sistem yang terdiri dari beberapa komponen, antara lain :
a. Hardware : CPU, disk, terminal, printer. b. Software : Sistem operasi, sistem database, program pengontrol komunikasi,
program aplikasi. c. Personil
: yang
mengoperasikan sistem,
menyediakan masukan,
mengkonsumsi keluaran dan melakukan aktivitas manual yang mendukung sistem.
d. Data : data yang tersimpan dalam jangka waktu tertentu. e. Prosedur : instruksi dan kebijakan untuk mengoperasikan sistem
2.2.2 Karakter Sistem Informasi
Ada beberapa karakter sistem informasi, yaitu : 1. Sistem informasi memiliki komponen berupa subsistem yang merupakan
elemen-elemen yang lebih kecil yang membentuk sistem informasi tersebut misalnya bagian input, proses, output
Contoh : bagian input adalah salesman memasukkan data penjualan bulan ini. maka di sana terdapat manusia yang melakukan pekerjaan input, dengan
menggunakan hardware keyboard, dan menggunakan interface sebuah aplikasi laporan penjualan yang sudah di sediakan oleh sistem informasi tersebut.
2. Ruang lingkup sistem informasi yaitu ruang lingkup yang ditentukan dari awal pembuatan yang merupakan garis batas lingkup kerja sistem tersebut, sehingga
sistem informasi tersebut tidak bersinggungan dengan sistem informasi lainnya. 3. Tujuan sistem informasi adalah hal pokok yang harus ditentukan dan dicapai
dengan menggunakan sistem informasi tersebut, sebuah sistem informasi berhasil apabila dapat mencapai tujuan tersebut.
4. Lingkungan sistem informasi yaitu sesuatu yang berada diluar ruang lingkup sistem informasi yang dapat mempengaruhi sistem informasi, hal ini turut
dipertimbangkan pada saat perencanaan sistem informasi.
2.3 Data
2.3.1 Pengertian Data
Data adalah catatan atas kumpulan fakta. Data merupakan bentuk jamak dari datum
, berasal dari bahasa Latin yang berarti sesuatu yang diberikan. Dalam penggunaan sehari-hari data berarti suatu pernyataan yang diterima secara apa
adanya. Pernyataan ini adalah hasil pengukuran atau pengamatan suatu variabel yang bentuknya dapat berupa angka, kata-kata, atau citra.
Dalam keilmuan ilmiah, fakta dikumpulkan untuk menjadi data. Data kemudian diolah sehingga dapat diutarakan secara jelas dan tepat sehingga dapat
dimengerti oleh orang lain yang tidak langsung mengalaminya sendiri, hal ini dinamakan deskripsi. Pemilahan banyak data sesuai dengan persamaan atau
perbedaan yang dikandungnya dinamakan klasifikasi.
2.3.2 Jenis-jenis Data
Jenis -jenis data ini bertingkat menurut tingkatan pengukuran. Jenis data tersebut adalah:
a. Data Rasio Data rasio adalah tingkatan data yang paling tinggi. Data rasio memiliki jarak
antar nilai yang pasti dan memiliki nilai nol mutlak yang tidak dimiliki oleh jenis-jenis data lainnya. Contoh dari data rasio diantaranya: berat badan,
panjang benda, jumlah satuan benda. Jika kita memiliki 10 bola maka ada perwujudan 10 bola itu, dan ketika ada seseorang memiliki 0 bola maka
seseorang tersebut tidak memiliki bola satupun. Data rasio dapat digunakan dalam komputasi matematik, misalnya A memiliki 10 bola dan B memiliki 8
bola, maka A memiliki 2 bola 10-8 lebih banyak dari B. b. Data Interval
Data interval mempunyai tingkatan lebih rendah dari data rasio. Data rasio memiliki jarak data yang pasti namun tidak memiliki nilai nol mutlak. Contoh
dari data interval ialah hasil dari nilai ujian matematika. Jika A mendapat nilai 10 dan B mendapat nilai 8, maka dipastikan A mempunyai 2 nilai lebih
banyak dari B. Namun tidak ada nilai nol mutlak, maksudnya bila C mendapat nilai 0, tidak berarti bahwa kemampuan C dalam pelajaran matematika adalah
nol atau kosong.
c. Data Ordinal Data ordinal pada dasarnya adalah hasil dari kuantifikasi data kualitatif.
Contoh dari data ordinal yaitu penskalaan sikap individu. Penskalaan sikap individu terhadap sesuatu bisa diwujudkan dalam bermacam bentuk,
diantaranya yaitu: dari sikap Sangat Setuju 5, Setuju 4, Netral 3, Tidak Setuju 2, dan Sangat Tidak Setuju 1. Pada tingkatan ordinal ini data yang
ada tidak mempunyai jarak data yang pasti , misalnya: Sangat Setuju 5 dan Setuju 4 tidak diketahui pasti jarak antar nilainya karena jarak antara Sangat
Setuju 5 dan Setuju 4 bukan 1 satuan 5-4. d. Data Nominal
Data nominal adalah tingkatan data paling rendah menurut tingkat pengukurannya. Data nominal ini pada satu individu tidak mempunyai variasi
sama sekali, jadi 1 individu hanya punya 1 bentuk data. Contoh data nominal diantaranya yaitu: jenis kelamin, tempat tinggal, tahun lahir dll. Setiap
individu hanya akan mempunyai 1 data jenis kelamin, laki-laki atau perempuan. Data jenis kelamin ini nantinya akan diberi label dalam
pengolahannya, misalnya perempuan =1, laki-laki =2.
2.4 Basis Data
2.4.1 Pengertian Basis Data
Basis data terdiri dari 2 kata, yaitu basis dan data. Basis dapat diartikan sebagai markas, gudang, tempat berkumpul atau tempat penyimpanan. Data
adalah representasi fakta dunia nyata yang mewakili suatu objek seperti manusia,
barang, hewan, peristiwa, konsep keadaan, dan sebagainya, yang direkam dalam bentuk angka, huruf, simbol, teks, gambar, bunyi, atau kombinasinya. Basis data
merupakan himpunan kelompok data yang saling berkaitan dan tempat untuk menampung dan mengorganisasikan seluruh data yang ada dalam sistem,
sehingga dapat dieksplorasi untuk menyusun informasi – informasi dalam
berbagai bentuk. Prinsip utama basis data adalah pengaturan data atau arsip dengan tujuan
utama untuk kemudahan dan kecepatan dalam pengambilan kembali data atau arsip tersebut. Dapat disimpulkan bahwa basis data memiliki kesamaan fungsi dan
prinsip kerja dengan lemari arsip, perbedaan antara basis data dengan lemari arsip hanya terletak pada media penyimpanan yang digunakan.
2.4.2 jenis-jenis Basis Data
Menurut pengaksesannya, basis data dibedakan menjadi empat jenis yaitu : a. Basis data individual
Basis data individual adalah basis data yang digunakan oleh perseorangan. Biasanya basis data seperti ini banyak dijumpai dilingkungan PC. Visual
dBASE, Corel Paradox, dan Filemaker Pro merupakan contoh perangkat
lunak yang biasa digunakan untuk mengelola basis data untuk kepentingan pribadi.
b. Basis data perusahaan Basis data perusahaan adalah basis data yang dimaksudkan untuk diakses oleh
sejumlah pegawai dalam sebuah perusahaan dalam sebuah lokasi. Basis data
seperti ini disimpan dalam sebuah server dan para pemakai dapat mengakses dari masing-masing komputer yang berkedudukan sebagai client.
c. Basis data terdistribusi Basis data terdistribusi adalah basis data yang disimpan pada sejumlah
komputer yang terletak pada beberapa lokasi. Model seperti ini banyak digunakan bank yang memiliki sejumlah cabang di berbagai kota dan
melayani transaksi perbankan yang bersifat online. d. Basis data publik
Basis data publik adalah basis data yang dapat diakses oleh siapa saja publik. Sebagai contoh, banyak situs web misalnya yahoo dan about.com yang
menyediakan data yang bersifat publik dan dapat diambil siapa saja secara gratis. Namun adakalanya seseorang harus menjadi anggota dan membayar
iuran untuk memperoleh data publik.
2.5 E-Commerce
2.5.1 Sejarah E-Commerce
E-Commerce pertama kali diperkenalkan pada tahun 1994 pada saat pertama kali banner-elektronik dipakai untuk tujuan promosi dan periklanan di suatu
halaman-web website. Menurut Riset Forrester, perdagangan elektronik menghasilkan penjualan seharga AS12,2 milyar pada 2003. Menurut laporan
yang lain pada bulan oktober 2006 yang lalu, pendapatan ritel online yang bersifat
non-travel di Amerika Serikat diramalkan akan mencapai seperempat trilyun dolar US pada tahun 2011.
Industri teknologi informasi melihat kegiatan E-Commerce ini sebagai aplikasi dan penerapan dari E-Business yang berkaitan dengan transaksi
komersial, seperti: transfer dana secara elektronik, SCM supply chain management
, E-Marketing, atau pemasaran online online marketing, pemrosesan transaksi online online transaction processing, pertukaran data
elektronik electronic data interchange EDI, dll. E-Commerce merupakan bagian dari E-Business, di mana cakupan E-
Business lebih luas, tidak hanya sekedar perniagaan tetapi mencakup juga
pengkolaborasian mitra bisnis, pelayanan nasabah, lowongan pekerjaan dll. Selain teknologi jaringan www, E-Commerce juga memerlukan teknologi basis data atau
pangkalan data databases, surat elektronik e-mail, dan bentuk teknologi non komputer yang lain seperti halnya sistem pengiriman barang, dan alat pembayaran
untuk E-Commerce ini.
2.5.2 Pengertian E-Commerce
E-Commerce adalah penyebaran, pembelian, penjualan, pemasaran barang dan jasa melalui sistem elektronik seperti internet atau televisi, www, atau
jaringan komputer lainnya. E-Commerce dapat melibatkan transfer dana elektronik, pertukaran data elektronik, sistem manajemen inventori otomatis, dan
sistem pengumpulan data otomatis.
2.5.3 Klasifikasi E-Commerce
Penggolongan E-Commerce yang lazim dilakukan orang ialah berdasarkan sifat transaksinya, antara lain:
1. Business to Business B2B Jenis transaksi yang berisikan serangkaian perdagangan yang dilakukan
melalui jaringan sebanyak 70. Usaha dan penempuhan Business to Business
termasuk transaksi keuangan secara tradisional dilakukan melalui jaringan pribadi.
2. Business to Consumer B2C Jenis transaksi dimana pembelinya perorangan dan tidak punya tujuan
untuk menjualnya kembali biasanya semacam toko online yang menjual berbagai macam barang.
3. Consumer to Consumer C2C Jenis transaksi dimana pembelinya perorangan yang tidak mempunyai
tujuan untuk dijual kembali dan penjualnya juga perorangan yang tidak menyediakan bermacam-macam barang melainkan hanya beberapa
barang saja. Contoh: online advertising. 4. Consumer to Business C2B
Termasuk kedalam kategori ini adalah perseorangan yang menjual produk atau layanan kepada organisasi, dan perseorangan yang mencari penjual,
berinteraksi dengan mereka dan menyepakati suatu transaksi.
2.5.4 Manfaat E-Commerce
Manfaat yang diperoleh bagi organisasi pemilik E-Commerce: 1. Memperluas lokasi di mana suatu perusahaan dapat memperoleh
informasi market place hingga ke pasar nasional dan internasional. 2. Dengan biaya yang tidak begitu besar, sebuah perusahaaan dapat dengan
mudah menemukan lebih banyak pelanggan, supplier yang lebih baik dan partner bisnis yang paling cocok dari seluruh dunia.
3. E-Commerce menurunkan
biaya pembuatan,
pemrosesan, pendistribusian,
penyimpanan dan
pencarian informasi
yang menggunakan kertas.
4. E-Commerce memungkinkan pengurangan inventory dan overhead dengan menyederhanakan supply chain management
tipe “pull”. Dalam supply chain management
tipe “pull”, proses dimulai dari pesanan pelanggan serta digunakan manufacturing just-in-time.
5. E-Commerce mengurangi waktu penerimaan produk dan jasa. 6. E-Commerce mendukung upaya-upaya business process reengineering.
Dengan mengubah prosesnya, maka produktivitas sales-people, pegawai yang berpengetahuan, dan administrator bias meningkat 100 atau
lebih. 7. E-Commerce memperkecil biaya telekomunikasi. Karena internet lebih
murah dibandingkan VAN. 8. Akses informasi menjadi lebih cepat.
9. Biaya transportasi dan fleksibilitas bertambah.
Manfaat bagi konsumen antara lain: 1. E-Commerce memungkinkan pelanggan untuk berbelanja atau
melakukan transaksi selama 24 jam sehari sepanjang tahun dari hampir setiap lokasi.
2. E-Commerce memberikan lebih banyak pilihan kepada pelanggan, mereka bisa memilih berbagai produk dari banyak vendor.
3. E-Commerce menyediakan produk dan jasa yang tidak mahal kepada pelanggan dengan cara mengunjungi banyak tempat dan melakukan
perbandingan secara cepat. 4. Pelanggan bisa menerima informasi yang relevan secara detil dalam
hitungan detik, bukan lagi hari atau minggu. 5. E-Commerce memberi tempat kepada para pelanggan untuk berinteraksi
dengan pelanggan lain di electronic community dan bertukar pikiran serta pengalaman.
Manfaat bagi masyarakat lain: 1. E-Commerce memungkinkan orang untuk bekerja didalam rumah dan
tidak harus keluar rumah untuk berbelanja. Ini berakibat menurunkan arus kepadatan lalu lintas dijalan serta mengurangi polusi udara.
2. E-Commerce memungkinkan orang dinegara-negara dunia ketiga dan wilayah pedesaan untuk menikmati aneka produk dan jasa yang akan
susah mereka dapatkan tanpa E-Commerce.
2.5.5 Fitur-fitur Utama E-Commerce
Sebuah situs E-Commerce biasanya memiliki fitur-fitur utama sebagai berikut: a. EtalaseHalaman Display yang memuat nama, deskripsi dan harga barangjasa
yang ditawarkan b. Katalog, yang bisa dieksplorasi isinya dengan mudah untuk mencari
produkjasa yang kita inginkan, umumnya di fasilitasi dengan fungsi Search
Cari c. Shopping Cart keranjang belanja, yaitu tempat kita menaruh barang-barang
atau jasa yang kita inginkan. Memuat Nama barang, Quantity dan Harga serta Jumlah bayar, umumnya dilengkapi dengan automatic calculation yang dapat
memunculkan informasi nominal pembayaran yang harus dilakukan. d. Payment Methode, umumnya menawarkan tiga metode cara bayar, yaitu
CashTransferDebit, Kredit dengan Kartu Kredit dan C.O.D Cash On
Delivery e. Sistem
Pengiriman delivery
methode ,
umumnya dengan
pihak ketigaperusahaan jasa pengiriman barang dengan berbagai layanannya yang
dapat dipilih oleh pembeli misalnya layanan kiriman sampai pada hari yang sama, keesokan harinya dan lain-lain.
f. Contact Link, berisi alamat dan nomor telepon atau saluran lain emailIM yang dapat digunakan untuk komunikasi antara pembeli dan penjual, umumnya
disertakan pula Contact Form yang terdiri dari field-field untuk memasukkan identitas pengirim nama, emailwebsite serta beritapesan yang ingin
disampaikan. Isi pesan yang disampiakan melalui Contact Form umumnya dapat diteruskan kepada penjualpengelolapemilik web dalam bentuk email.
2.5.6 Fitur-fitur Tambahan E-Commerce
Fitur tambahan, umumnya disediakan sesuai dengan karakter bisnis yang dijalankan, antara lain:
a. Calculator Offline, umumnya digunakan calon pembeli saat ingin mengetahui nilai atau nominal harga menurut nilai tukar mata uang yang dipilih apabila
daftar harga didominasi oleh satu mata uang asing tertentu. Pada fitur ini biasanya nilai tukar mata uang asing terhadap mata uang lokal sudah tersedia.
b. Currency Converter, memiliki fungsi yang hampir sama dengan Calculator offline, namun bersifat online dan penguna dapat dengan mudah mengkonversi
nilai atau nominal pembelanjaan berdasarkan berbagai nilai tukar mata uang asing yang disediakan berikut nilai tukarnya.
c. Uploader, biasanya digunakan untuk mengirimkan file sisipan attachment yang diperlukan dalam proses produksi barang yang ditawarkan. Misalnya
adalah gambar desain yang berasal dari calon pembeli untuk digunakan sebagai acuan pembuatan barang yang akan diproduksi oleh penjual.
d. Pembanding, yaitu fitur yang digunakan untuk melakukan pembandingan dua produk atau lebih yang ditawarkan pada situs tersebut, biasanya setelah calon
pembeli menentukan produk-produk yang akan dibandingkan, maka muncul spesifikasi per elemen produk yang menjadi indikator pembanding secara head
to head .
e. FAQ Frequently Asked Question, adalah berbagai macam jenis pertanyaan yang umumnya diajukan oleh calon pembeli kepada penjual, misalnya cara
pesan, garansi produk, minimum pembelian dan lain-lain.
2.5.7 Keamanan E-Commerce
Sistem Keamanan E-Commerce meliputi beberapa hal yaitu: a. Confidentially : Menjamin apakah informasi yang dikirim tersebut tidak
dapat dibuka atau tidak dapat diketahui oleh orang lain yang tidak berhak. b. Integrity: menjamin konsistensi data tersebut apakah masih utuh sesuai
aslinya atau tidak, sehingga upaya orang-orang yang tidak bertanggung jawab untuk melakukan penduplikatan dan perusakan data bisa dihindari.
c. Availability : menjamin pengguna yang sah agar dapat mengakses informasi dan sumber miliknya sendiri.
d. Legitimate Use : menjamin kepastian bahwa sumber tidak digunakan oleh orang-orangyang tidak bertanggung jawab.
Tujuan Sistem Keamanan E-Commerce dengan menggunakan bidang- bidang utama yaitu:
a. Sistem Keamanan Komunikasi Communications security merupakan perlindungan terhadap informasi ketika di kirim dari sebuah sistem ke
sistem lainnya. b. Keamanan Komputer Computer security adalah perlindungan terhadap
sistem informasi komputer itu sendiri. c. Keamanan secara fisik seperti pengamanan oleh penjaga keamanan, pintu
yang terkunci, sistem control fisik lainnya, dan sebagainya.
d. Keamanan Personal
meliputi kepribadian
orang-orang yang
mengoperasikan atau memilki hubungan langsung dengan sistem tersebut. e. Keamanan administrative contohnya mengadakan control terhadap
perangkat-perangkat lunak yang digunakan, mengecek kembali semua kejadian-kejadian yang telah diperiksa sebelumnya dan sebagainya.
f. Keamanan media yang digunakan meliputi pengontrolan terhadap media penyimpanan yang ada dan menjamin bahwa media penyimpanan yang
mengandung informasi sensitive tersebut tidak mudah hilang begitu saja.
2.6 Perancangan Sistem
Tahap perancangan disebut juga tahap pemecahan masalah, yaitu dengan menyusun suatu algoritma, alur sistem, masukan, prosedur proses, keluaran, dan
database. Proses perancangan diperlukan untuk menghasilkan suatu rancangan sistem yang baik, karena dengan rancangan yang tepat akan menghasilkan sistem
yang stabil dan mudah dikembangkan di masa mendatang. Berikut ini akan dijelaskan rangkaian atau ruang lingkup sistem yang akan dirancang dengan
memanfaatkan alat bantu seperti :
2.6.1 Diagram Konteks
Diagram konteks menggambarkan hubungan antara sistem dengan entitas luarnya. Diagram konteks berfungsi sebagai transformasi dari satu proses yang
melakukan transformasi data input menjadi data output. Entitas yang dimaksud adalah entitas yang mempunyai hubungan langsung dengan sistem.
Suatu diagram konteks selalu mengandung satu dan hanya satu proses saja. Proses ini mewakili proses dari seluruh sistem. Diagram konteks ini
menggambarkan hubungan input atau output antara sistem dengan dunia luarnya kesatuan luar.
2.6.2 Data Flow Diagram
Data Flow Diagram DFD
–DADDiagram Alir Data memperlihatkan hubungan fungsional dari nilai yang dihitung oleh sistem, termasuk nilai masukan,
nilai keluaran, serta tempat penyimpanan internal. DAD adalah gambaran grafis yang memperlihatkan aliran data dari sumbernya dalam objek kemudian melewati
proses yang mentransformasinya ke tujuan yang lain, yang ada pada objek lain. DAD sering digunakan untuk menggambarkan suatu sistem yang telah ada atau
sistem baru yang akan dikembangkan secara logika tanpa mempertimbangan lingkungan fisik dimana data tersebut mengalir.
DFD merupakan alat yang digunakan pada metodologi pengembangan sistem yang terstruktur structured analysis and design. DFD merupakan alat yang
cukup populer sekarang ini, karena dapat menggambarkan arus data di dalam sistem dengan terstruktur jelas.
Tabel 2.1 Diagram Arus Data Data Flow Diagram
NO SIMBOL
NAMA KETERANGAN
1
External Entity kesatuan
luar
Menggambarkan kegiatan proses
dari operasi
program komputer 2
Process proses
Menggambarkan kegiatan atau kerja yang dilakukan
oleh manusia
atau komputer
3
Data Flow arus data
Menunjukan arus
data yang
mengalir antara
proses, simpanan data dan kesatuan luar dari ke suatu
arus
4
Data Store simpanan
luar
Menggambarkan suatu
tempat penyimpanan data
Beberapa simbol yang digunakan dalam Data Flow Diagram DFD antara lain:
1. External Entity kesatuan luar atau boundary batas sistem Setiap sistem pasti mempunyai batas sistem boundary yang memisahkan
suatu sistem dengan lingkungan luarnya. Sistem akan menerima input dan menghasilkan output kepada lingkungan luarnya. Kesatuan luar external
entity merupakan kesatuan entity di lingkungan luar sistem yang dapat
berupa orang, organisasi atau sistem lainnya yang berada di lingkungan luarnya yang akan memberikan input atau menerima output dari sistem.
2. Process proses Suatu proses adalah kegiatan atau kerja yang dilakukan oleh orang , mesin
atau komputer dari hasil suatu arus data yang masuk ke dalam proses untuk dihasilkan arus data yang akan keluar dari proses. Untuk physical data flow
diagram PDFD, proses dapat dilakukan oleh orang, mesin atau komputer,
sedangkan untuk logical data flow diagram LDFD, suatu proses hanya menunjukkan proses dari komputer. Setiap proses harus diberi penjelasan
yang lengkap meliputu identifikasi proses, nama proses dam pemroses. 3. Data Flow arus data
Arus data data flow di DFD diberi simbol suatu panah. Arus data ini mengalir diantara proses process, simpanan data data strore dan kesatuan
luar external entity. Arus data ini menunjukkan arus dari data yang dapat berupa masukan untuk sistem atau hasil dari proses sistem.
4. Data Store simpanan luar Simpanan data data store merupakan simpanan dari data yang dapat berupa,
yaitu suatu file atau database di sistem komputer, suatu arsip atau catatan manual, suatu kotak tempat data di meja seseorang, suatu tabel acuan manual,
dan suatu agenda atau buku.
2.6.3 Diagram E-R Entity Relationship Diagram
Menurut Budi Sutedjo, ERD adalah peralatan yang berfungsi untuk menggambarkan relasi atau hubungan dari dua file atau dua tabel yang dapat
digolongkan dalam tiga macam bentuk relasi, yaitu satu – satu 1 – 1, satu –
banyak 1 – N, banyak – banyak N – N. Model entity relationship yang berisi
komponen – komponen himpunan entitas dan himpunan relasi yang masing–
masing dilengkapi dengan atribut –atribut yang merepresentasikan seluruh fakta
yang kita tinjau digambarkan lebih sistematis dengan menggunakan Diagram E –
R. Pembuatan Diagram E –R meliputi tahap – tahap berikut:
a. Mengidentifikasi dan menetapkan seluruh himpunan entitas yang akan terlihat. b. Menentukan atribut
– atribut key dari masing – masing himpunan entitas. c. Mengidentifikasi dan menetapkan seluruh himpunan relasi di antara himpunan
entitas –himpunan entitas yang ada beserta foreign key yang terdapat pada
relasi tersebut. d. Menentukan derajat atau kardinalitas relasi untuk setiap himpunan relasi.
Melengkapi himpunan entitas dan himpunan relasi dengan atribut – atribut
deskriptif non key.
Tabel 2.2 Entity Relationship Diagram ERD
NO SIMBOL
KETERANGAN
1 Menunjukan suatu objek berupa benda, konsep
atau entitas
2 Menunjukan hubungan logical antara satu file
dengan file lainnya.
3 Menunjukan atribut suatu entitas
4 N 1
Menunjukan hubungan banyak ke satu N-1
5 1 N
Menunjukan hubungan satu ke banyak 1-N
6 N N
Menunjukan hubungan banyak ke banyak N- N
7 1 1
Menunjukan hubungan satu kesatu 1-1
2.6.5 Kamus Data Data Dictionary
Kamus data adalah peralatan yang ikut berperan dalam perancangan dan pembangunan sistem informasi karena berfungsi untuk menjelaskan arti aliran
data dan penyimpanan dalam penggambaran pada data flow diagram,
mendeskripsikan komposisi paket data yang bergerak melalui aliran, dan menjelaskan spesifikasi nilai dan satuan yang relevan terhadap data yang mengalir
dalam sistem tersebut.
2.7 Tool Yang Digunakan Untuk Membangun Aplikasi
2.7.1 PHP Personal Home Page
PHP adalah salah satu bahasa sever-side yang didesain khusus untuk aplikasi web. PHP dahulunya merupakan proyek pribadi dari Rasmus Lerdorf dengan
dikeluarkannya php versi 1 yang digunakan untuk membuat home page pribadinya. Versi pertama ini berupa kumpulan script PERL. Untuk versi
keduanya, Rasmus menulis ulang script-script PERL tersebut menngunakan bahasa C, kemudian menambahkan fasilitas untuk form html dan koneksi
MYSQL. Adapun PHP didapat dari singkatan Personal Home Pages. PHP merupakan bahasa script yang digunakan untuk membuat halaman web
yang dinamis. Dinamis berarti halaman yang ditampilkan dibuat saat halaman itu diminta oleh client. Mekanisme ini menyebabkan informasi yang diterima client
selalu yang terbaru. Semua script PHP dieksekusi pada server dimana script tersebut dijalankan. Oleh karena itu, spesifikasi server lebih berpengaruh pada
eksekusi dari script PHP daripada spesifikasi client. Namun tetap diperhatikan bahwa halaman web yang dihasilkan tentunya harus dapat dibuka oleh browser
pada client.
PHP masuk kedalam kategori server-side scripting dimana browser pada client
tidak lagi bertanggung jawab dalam menjalankan kode-kode PHP, melainkan web server proses ini diilustrasikan kedalam gambar berikut.
Gambar 2.2 PHP Server side scripting
Pertama-tama web browser pada client me-request sebuah file 1. Dalam kasus ini bagaimanapun juga file yang di-request ber-ekstensiberakhiran .php
contoh: File.php, tanda bahwa didalam file tersebut terkandung kode-kode PHP yang perlu diproses oleh server. Web server mengenali file ini dan tidak mengirim
file tersebut langsung ke browser, tetapi dikirim ke PHP scripting engine 2 mesin pengolah kode-kode PHP. PHP engine merupakan komponen perangkat
lunak dari server yang mampu mengartikan kode-kode PHP dan memberikan output dalam kode HTML. Setiap kode PHP dapat memberikan output kode
HTML yang berbeda, tergantung pada jenis request dari client browser. Proses tersebut membangkitkan halaman HTML secara dinamis lalu dikirimkan kembali
ke client browser untuk merespon terhadap request yang sebelumnya telah dikirimkan.
Pemrograman disisi server biasanya digunakan untuk membuat sebuah
website yang interaktif yang dihubungkan kedalam basis data atau data store lain.
2.7.2 HTML Hypertext Markup Language
Untuk menyediakan informasi terdistribusi dalam suatu bentuk yang terintegrasi, di perlukan suatu standart untuk mengekspresikan informasi HTML
merupakan bahasa yang digunakan oleh WWW untuk konsistensi ekspresi suatu informasi. Sebuah dokumen hypermedia meliputi teks, image, suara, video, dan
tape, informasi yang lain. HTML juga dapat menghubungkan informasi dalam dokmen yang berbeda. Bahasa HTML bersifat independen terhadap fletform
sehingga dapat digunakan tanpa adanya batasan dari jenis hardware maupun software.
2.7.3 Javascript
Javascript diperkenalkan pertama kali oleh Netscape pada tahun 1995. Pada
awalnya bahasa ini dinamakan “LiveScript” yang berfungsi sebagai bahasa sederhana untuk browser Netscape Navigator 2. Pada masa itu bahasa ini banyak
di kritik karena kurang aman, pengembangannya yang terkesan buru-buru dan tidak ada pesan kesalahan yang di tampilkan setiap kali kita membuat kesalahan
pada saat menyusun suatu program. Kemudian sejalan dengan sedang giatnya kerjasama antara Netscape dan Sun
pengembang bahasa pemrograman “Java” pada masa itu, maka Netscape
memberikan nama “JavaScript” kepada bahasa tersebut pada tanggal 4 desember 1995. Pada saat yang bersamaan Microsoft
sendiri mencoba untuk mengadaptasikan teknologi ini yang mereka sebut sebagai “Jscript” di browser Internet Explorer 3.
Javascript adalah bahasa yang berbentuk kumpulan skrip yang pada fungsinya
berjalan pada suatu dokumen HTML, sepanjang sejarah internet bahasa ini adalah
bahasa skrip pertama untuk web. Bahasa ini adalah bahasa pemrograman untuk memberikan kemampuan tambahan terhadap bahasa HTML dengan mengijinkan
pengeksekusian perintah perintah di sisi user, yang artinya di sisi browser bukan di sisi server web.
Javascript bergantung kepada browsernavigator yang memanggil halaman
web yang berisi skrip skrip dari Javascript dan tentu saja terselip di dalam dokumen HTML. Javascript juga tidak memerlukan kompilator atau penterjemah
khusus untuk menjalankannya pada kenyataannya kompilator Javascript sendiri sudah termasuk di dalam browser tersebut. Lain halnya dengan bahasa “Java”
dengan mana JavaScript selalu di banding bandingkan yang memerlukan kompilator khusus untuk menterjemahkannya di sisi userklien.
Javascript merupakan suatu bahasa yang perkembangannya lambat di
bandingkan dengan Java yang berkembang sangat cepat. Di Javascript kita tidak mungkin menyembunyikan kode skrip yang kita tulis, kode langsung di tulis di
dalam dokumen HTML dan sangat mudah terlihat, sedangkan di Java, kode sudah berbentuk setengah terkompilasi dalam bentuk applet dan tidak mungkin terlihat
dari dalam dokumen HTML, satu mesin virtual di sisi user yang bertanggung jawab untuk menterjemahkan program di dalam applet tersebut setiap kali
halaman HTML yang memuat applet tersebut dipanggil oleh browser. Dibandingkan dengan applet java yang cukup lambat dibuka oleh browser, bisa
kita katakan bahwa Javascript cukup cepat di panggildi load oleh navigator. JavaScript
sendiri merupakan bahasa yang mudah dipahami, dalam artian diperlukan skill novice atau dasar untuk mengerti bahasa ini, jika anda sudah
terbiasa dan mengenal konsep bahasa pemrograman visual, maupun Java ataupun C, akan sangat mudah untuk memahami konsep Javascript.
JavaScript adalah bahasa yang “case sensitive” artinya membedakan
penamaan variabel dan fungsi yang menggunakan huruf besar dan huruf kecil, contoh variabel atau fungsi dengan nama TEST berbeda dengan variabel dengan
nama test. Dan yang terakhir seperti bahasa Java ataupun C, setiap instruksi diakhiri dengan karakter titik koma ;.
2.7.4 CSS Cascading Style Sheet
CSS cascadding stylesheet adalah bahasa stylesheet yang digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup.
Penggunaan yang paling umum dari CSS adalah untuk memformat halaman web yang ditulis HTML dan XHTML. Walaupun demikian, bahasanya sendiri
dapat digunakan untuk semua jenis dokumen XML termasuk SVG dan XVL. Spesifikasi CSS diatur oleh world wide web consortium W3C.
CSS digunakan terutama untuk memisahkan antara isi dokumen yang ditulis dengan HTML atau bahasa markup lainnya dengan presentasi dokumen yang
ditulis dengan CSS. Pemisahan ini dapat meningkatkan aksesibilitasi isi, memberikan lebih banyak keleluasaan dan kontrol terhadap tampilan, dan
mengurangi kompleksitas serta pengulangan pada struktur isi. CSS memungkinkan halaman yang sama untuk menampilkan cara yang
berbeda, seperti melalui layar, cetak, suara sewaktu dibacakan oleh browser basis suara atau pembaca layar, dan juga alat pembaca braille, halaman HTML atau
XML yang sama juga dapat ditampilkan secara berbeda, baik dari segi gaya
tampilan atau skema warna dengan menggunakan CSS. 2.7.5 MYSQL
MySQL adalah sebuah perangkat lunak sistem manajemen basis data SQL database management system atau DBMS yang multithread, multi-user, dengan
sekitar 6 juta instalasi di seluruh dunia. MySQL AB membuat MySQL tersedia sebagai perangkat lunak gratis dibawah lisensi GNU General Public License
GPL, tetapi mereka juga menjual dibawah lisensi komersial untuk kasus-kasus dimana penggunaannya tidak cocok dengan penggunaan GPL.
Tidak sama dengan proyek-proyek seperti Apache, dimana perangkat lunak dikembangkan oleh komunitas umum, dan hak cipta untuk kode sumber dimiliki
oleh penulisnya masing-masing, MySQL dimiliki dan disponsori oleh sebuah perusahaan komersial Swedia MySQL AB, dimana memegang hak cipta hampir
atas semua kode sumbernya. Kedua orang Swedia dan satu orang Finlandia yang mendirikan MySQL AB adalah: David Axmark, Allan Larsson, dan Michael
Monty Widenius.
Gambar 2.3. MySQL Multiple Storage Engine Architecture
MySQL adalah Relational Database Management System RDBMS yang didistribusikan secara gratis dibawah lisensi GPL General Public License.
Dimana setiap orang bebas untuk menggunakan MySQL, namun tidak boleh dijadikan produk turunan yang bersifat closed source atau komersial. MySQL
sebenarnya merupakan turunan salah satu konsep utama dalam database sejak lama, yaitu SQL Structured Query Language. SQL adalah sebuah konsep
pengoperasian database, terutama untuk pemilihan atau seleksi dan pemasukan data, yang memungkinkan pengoperasian data dikerjakan dengan mudah secara
otomatis. Keandalan suatu sistem database DBMS dapat diketahui dari cara kerja optimizer-nya dalam melakukan proses perintah-perintah SQL, yang dibuat
oleh user maupun program-program aplikasinya. Sebagai database server, MySQL dapat dikatakan lebih unggul dibandingkan database server lainnya
dalam query data. Hal ini terbukti untuk query yang dilakukan oleh single user, kecepatan query MySQL bisa sepuluh kali lebih cepat dari PostgreSQL dan lima
kali lebih cepat dibandingkan Interbase. Selain itu MySQL juga memiliki beberapa keistimewaan, antara lain :
1. Portability MySQL dapat berjalan stabil pada berbagai sistem operasi seperti Windows,
Linux, FreeBSD, Mac Os X Server, Solaris, Amiga , dan masih banyak lagi.
2. Open Source MySQL didistribusikan secara open source gratis, dibawah lisensi GPL
sehingga dapat digunakan secara cuma-cuma.
3. Multiuser MySQL dapat digunakan oleh beberapa user dalam waktu yang bersamaan
tanpa mengalami masalah atau konflik. 4. Performance tuning
MySQL memiliki kecepatan yang menakjubkan dalam menangani query sederhana, dengan kata lain dapat memproses lebih banyak SQL per satuan
waktu. 5. Column types
MySQL memiliki tipe kolom yang sangat kompleks, seperti signed unsigned integer, float, double, char, text, date, timestamp
, dan lain-lain. 6. Command dan functions
MySQL memiliki operator dan fungsi secara penuh yang mendukung perintah Select
dan Where dalam query. 7. Security
MySQL memiliki beberapa lapisan sekuritas seperti level subnetmask, nama host, dan izin akses user dengan sistem perizinan yang mendetail serta
password terenkripsi .
8. Scalability dan limits MySQL mampu menangani database dalam skala besar, dengan jumlah
records lebih dari 50 juta dan 60 ribu tabel serta 5 milyar baris. Selain itu
batas indeks yang dapat ditampung mencapai 32 indeks pada tiap tabelnya.
9. Connectivity MySQL dapat melakukan koneksi dengan client menggunakan protokol
TCPIP, Unix soket UNIX, atau Named Pipes NT. 10. Localisation
MySQL dapat mendeteksi pesan kesalahan pada client dengan menggunakan lebih dari dua puluh bahasa. Meskipun demikian, bahasa Indonesia belum
termasuk didalamnya. 11. Interface
MySQL memiliki interface antar muka terhadap berbagai aplikasi dan bahasa pemrograman dengan menggunakan fungsi API Application
Programming Interface .
12. Clients dan tools MySQL dilengkapi dengan berbagai tool yang dapat digunakan untuk
administrasi database, dan pada setiap tool yang ada disertakan petunjuk online.
13. Struktur tabel MySQL memiliki struktur tabel yang lebih fleksibel dalam menangani
ALTER TABLE, dibandingkan database lainnya semacam PostgreSQL ataupun Oracle.
2.7.6 Macromedia Dreamweaver 8
Macromedia Dreamweaver 8 adalah HTML editor profesional yang berfungsi
mendesain, melakukan coding dan mengembangkan website yang paling terkenal di dunia web. Macromedia adalah produsen software website yang paling besar di
dunia. Selain dreamweaver, macromedia juga mengeluarkan produk seperti macromedia flash, fireworks, coldfusion, freehand, director
dan sebagainya. Salah satu kelebihan dreamweaver adalah ruang kerja dreamweaver beserta
tool yang tersedia dapat digunakan dengan sangat mudah dan cepat, sehingga
anda bias membangun suatu website dengan cepat dan tanpa harus melakukan coding
. Selain itu dreamweaver juga mempunyai integrasi dengan produk macromedia
lainnya, seperti Flash, Firework, flash sudah sengat terkenal sebagai program untuk membuat animasi yang berbasis web. Dengan perkembangan
kebutuhan dan teknologi, flash akhir-akhir juga digunakan untuk membuat animasi untuk video.
Fungsi coding dreamweaver tidak hanya mendukung coding HTML, tetapi juga CSS cascading style sheet, javascript, coldfusion, ASPactive server page, JSP
javaserver Pages dan dreamweaver juga memungkinkan anda membangun website dengan server berbahasa CFML Cold Fusion markup language,
ASP.net, JSP dan PHP.
2.7.7 Apache Web Server
Apache adalah sebuah nama web server yang bertanggung jawab pada request-response HTTP dan logging informasi secara detailkegunaan basicnya.
Selain itu, Apache juga diartikan sebagai suatu web server yang kompak, modular, mengikuti standar protokol HTTP, dan tentu saja sangat digemari.
Kesimpulan ini bisa didapatkan dari jumlah pengguna yang jauh melebihi para pesaingnya. Sesuai hasil survai yang dilakukan oleh Netcraft, bulan Januari 2005
saja jumlahnya tidak kurang dari 68 pangsa web server yang berjalan di
Internet. Ini berarti jika semua web server selain Apache digabung, masih belum bisa mengalahkan jumlah Apache.
Saat ini ada dua versi Apache yang bisa dipakai untuk server produksi, yaitu versi mayor 2.0 dan versi mayor 1.3. Apache merupakan webserver yang paling
banyak digunakan saat ini. Hal ini disebabkan oleh beberapa sebab, di antaranya adalah karena sifatnya yang opensource dan mudahnya mengkostumisasikannya.
diantaranya dengan menambahkan support secure protocol melalui ssl dan konektifitasnya dengan database server melalui bahasa scripting PHP.
2.7.8 Pengenalan WAMP
WAMP yaitu Windows, Apache, MySQL, dan Perl, PHP dan Phyton yang merupakan model yang dikembangkan setelah model yang terkenal dengan nama
LAMP Linux, Apache, MySQL, PHP dan PERL. WampServer
adalah sebuah manager service yang akan menginstal Apache, PHP5, database MySQL,
PHPmyadmin dan SQLitemanager di komputer anda. WampServer 2.0 dahulu
bernama WAMP5. Wamp server merupakan softwere freeware yang artinya dapat di download secara gratis di internet. Kegunaan wamp server ini untuk membuat
jaringan lokal sendiri, dalam artian dapat membuat website secara offline untuk masa percobaan di komputer lokal.
2.7.9 Microsoft Visio
Merupakan suatu aplikasi yang didesain khusus untuk membantu dalam membuat diagram seperti Flowchart, Grantt Chart, Data Flow, Gambar Jaringan,
Gambar Denah Bangunan, dan juga pembuatan Gambar Teknik, Gambar Elektronik, serta desain lainnya.
2.8 Internet
2.8.1 Pengertian Internet
Internet adalah himpunan informasi dan sumber daya komputer yang paling besar di dunia. Internet merupakan koneksi berbagai macam jaringan komputer
dengan berbagai jenis hardware dan teknologi yang berbeda. Komunikasi yang dibangun pada jaringan internet menggunakan mekanisme tertentu yang disebut
dengan protocol. Protocol yang digunakan untuk menjalankan komunikasi antar jaringan komputer pada internet ini adalah Transmission Control Protocol
Internet Protocol TCPIP. Dengan menggunakan protokol yang sama yaitu
TCPIP, perbedaan jenis komputer dan sistem operasi tidak menjadi masalah. TCPIP pada awal perkembangannya digunakan oleh Defense Advanced
Research Project Agency DARPA untuk membangun jaringan untuk keperluan
militer. Nama TCPIP sendiri diambil dari nama protokol pada layer network yaitu Internet Protocol
IP dan protokol pada layer transfort yaitu Transmission Control Protocol TCP
. Dengan mengacu pada nama ini, TCPIP internet kemudian sering disebut sebagai Internet. Arsitektur protokol TCPIP ini dapat
dimodelkan dengan empat layer sebagaimana yang dapat dilihat pada gambar berikut.
Gambar 2.4 Arsitektur Protokol TCPIP
TCPIP terdiri dari empat lapis kumpulan protokol yang bertingkat. Empat tingkat itu adalah :
1. Application Layer, yaitu layer yang bertanggung jawab terhadap aplikasi- aplikasi yang menggunakan TCPIP.
2. Transport Layer, yaitu layer yang bertanggung jawab memberikan layanan pengiriman data dari satu node ke node yang lain.
3. Internet Layer, yaitu layer yang menentukan jenis datagram dan menangani perutean data yang dikirim.
4. Network Interface Layer, yaitu layer yang bertanggung jawab untuk mengirim dan menerima data pada media fisik transmisi yang digunakan.
Proses yang terjadi pada internet mempunyai mekanisme yang telah diatur berdasarkan protokol standar. Proses yang terjadi di internet adalah ada satu
program yang meminta kepada program yang lain untuk memberikan suatu layanan. Dua program tersebut dapat terletak dalam subnet yang sama ataupun
berbeda. Komputer dengan program yang meminta layanan disebut dengan client sedangkan yang memberikan layanan disebut server.
Program Program
driver driver
Client Server
TCPIP Internet
SERVER SYSTEM CLIENT SYSTEM
Gambar 2.5 Model Client Server Internet
2.8.2 Media
Kata media berasal dari bahasa latin Medius yang secara harafiah berarti tengah, perantara, atau pengantar. Namun pengertian media dalam proses
pembelajaran cenderung diartikan sebagai alat-alat grafis, fotografis atau elektronis untuk menagkap, memproses, dan menyusun kembali informasi visual
atau verbal.
2.8.3 Web Portal
Web portal disebut dengan portal atau portal internet internet portal. Di dalam dunia internet istilah ini dimaksudkan untuk website yang menyediakan
beraneka ragam informasi untuk para pengunjungnya. Portal adalah aplikasi berbasis web yang menyediakan fasilitas akses dari satu titik terhadap sumber-
sumber informasi online terdistribusi, seperti dokumen yang didapat melalui pencarian, kanal berita dan link ke situs khusus. Untuk mempermudah user,
biasanya disediakan kemampuan pencarian dan pengorganisasian informasi.
Portal dalam perkembangannya tidak hanya mendukung satu komunitas tapi beberapa komunitas. Portal juga mendukung berbagai macam servis atau layanan
yang membedakannya dengan web site HTML biasa. Portal juga melibatkan berbagai macam komponen teknik yang mendukung berfungsinya portal tersebut.
Portal juga terdiri dari berbagai macam infrastruktur yang mendukung portal itu berdiri. Karena tanpa infrastruktur ini dia tidak akan dapat memberikan layanan.
Untuk bisa mendirikan dan memberikan portal ada beberapa strategi dan implementasi yang harus diperhatikan oleh pengelolanya.
2.8.4 Web Server
Web server adalah server internet yang mampu melayani koneksi transfer data dalam protokol HTTP. Web server dirancang untuk melayani bahasa jenis
data, mulai dari text, hypertext, gambar image, suara, plug in, dan lain sebagainya. Web server pada umumnya melayani data dalam bentuk file HTML
2.8.5 Domain Name Server DNS
Untuk mengidentifikasi suatu entitas, protokol TCPIP menggunakan alamat IP. Namun apabila dalam aplikasi setiap orang harus menghafal alamat IP untuk
melakukan komunikasi bisa berakibat timbulnya kesulitan untuk mengingat. Apalagi jika perkembangan internet sudah demikian pesat. Untuk itu protokol
TCPIP memiliki suatu metode untuk membuat suatu map yang menterjemahkan nama kepada alamat IP atau sebaliknya. Metode ini disebut juga sebagai Domain
Name System DNS.
Domain Name System DNS adalah distribute database system yang
digunakan untuk pencarian nama komputer name resolution di jaringan yang
mengunakan TCPIP Transmission Control ProtocolInternet Protocol. DNS biasa digunakan pada aplikasi yang terhubung ke Internet seperti web browser
atau e-mail, dimana DNS membantu memetakan host name sebuah komputer ke IP address. Selain digunakan di Internet, DNS juga dapat di implementasikan ke
private network atau intranet dimana DNS memiliki keunggulan seperti:
1. Mudah, DNS sangat mudah karena user tidak lagi direpotkan untuk mengingat IP address sebuah komputer cukup host name nama Komputer.
2. Konsisten, IP address sebuah komputer bisa berubah tapi host name tidak berubah.
3. Simple, user hanya menggunakan satu nama domain untuk mencari baik di Internet maupun di Intranet.
2.8.6 World Wide Web WWW
World Wide Web WWW merupakan suatu sistem penyedia informasi
dengan skala yang besar yang mengelola informasi tersebut secara terdistribusi dalam internet dengan menggunakan teknologi hypermedia. WWW mempunyai
karakteristik : a. Dukungan interface yang terintegrasi
WWW menyediakan suatu interface yang terintegrasi terhadap protokol, format data, sistem pengalamatan, dan lain-lain sehingga berbagai macam
layanan dan basis data yang ada di internet dapat diakses secara langsung. b. Kemudahan pada sisi pengguna
WWW mendukung secara transparan sebagian besar aplikasi-aplikasi yang terdapat di internet seperti layanan telnet, gopher, anonymous ftp, finger, dan
lain – lain. Kombinasi layanan ini memberikan user interface yang
terintegrasidengan aplikasi – aplikasi internet yang lain.
c. Kemudahan dalam perkembangan Kapabilitas server WWW dapat dikembangkan secara mudah dengan
menggunakan standar PHP antara server WWW dengan alplikasi yang lain. Program PHP juga memungkinkan perubahan informasi secara dinamis yang
dapat diperoleh secara real time. d. Tidak tergantung pada flatform tertentu
WWW memungkinkan seseorang dapat membangun server WWW di berbagai sistem yang berlainan dan memberikan informasi dalam bentuk
hypermedia. WWW tidak didesain untuk mendukung sistem tertentu.
WWW menggunakan model client server. WWW juga menggunakan ekspresi informasi, transfer informasi, metode penamaan informasi yang standar sehingga
dapat memproses dan mentransfer informasi secara terdistribusi yang dilakukan secara sistematik.
Informasi yang terdistribusi disimpan di dalam server WWW dan user mengakses informasi tersebut menggunakan suatu software yang disebut dengan
browser. Server menyimpan informasi di dalam file-file terstruktur menggunakan Hypertext Markup Language
HTML. Hypertext merupakan kumpulan teks-teks yang saling berhubungan satu sama lainnya. Hypermedia serupa dengan hypertext,
hanya saja media yang digunakan bukan hanya teks akan tetapi meliputi juga audio
, image, dan video.
WWW menggunakan
standar untuk
mencapai konsistensi
dalam menghasilkan dan melakukan transfer informasi. WWW menggunakan HTML
sebagai standar produksi informasi dengan menggunakan Hypertext Transfer Protocol
HTTP sebagai standar transfer informasi. WWW menggunakan standar penamaan yang disebut dengan Universal Resource Locator URL untuk
mendukung penyediaan informasi secara universal dalam server yang
terdistribusi. 2.8.7 HTTP
HTTP merupakan sebuah protokol yang didesain untuk men-transfer informasi dalam bentuk hypermedia antara server dengan sebuah client. HTTP
juga men-transfer data suatu informasi melalui header-nya. Header HTTP ini merupakan bentuk pengembangan dari Multipurpose Internet Mail Extentions
MIMEs. Pengembangan ini memungkinkan HTTP untuk men-transfer informasi dalam bentuk biner dan informasi dalam bentuk yang tidak standar yang berhasil
dinegosiasi antara server dan client. Secara umum, delay akan terjadi pada saat melakukan suatu negosiasi sebelum proses transfer data. Karena lama dari delay
yang disebabkan oleh overhead akan menjadi relative lebih besar pada transfer data yang sebetulnya singkat.
HTTP merupakan protokol yang sederhana yang didesain untuk mereduksi delay
. HTTP merupakan protokol yang bersifat stateless, sehingga server akan memproses setiap request dari user secara terpisah dari request yang lain,
independen terhadap request yang sebelumnya. HTTP menggunakan 8 bit untuk
mentransfer semua tipe data yang mungkin.
Mekanisme yang terjadi pada HTTP bila suatu client menginginkan layanan dari server dibagi dalam 4 langkah, yaitu :
1. Connection Setup
Client mengakses sebuah server dengan menggunakan internet address dan
port number . Default dari port number adalah 80.
2. Request
Client mengirimkan message berupa informasi dari metode transaksi dan
kapabilitas client. 3.
Response Server
mengirimkan response kepada client sesudah client itu menyelesaikan reques
t-nya. Response message meliputi informasi dari transaksi dan data yang diminta.
4. Connection Release
Client mengakhiri koneksi ke server.
CLIENT SERVER
SETUP REQUEST
RESPONSE SETUP
RESPONSE REQUEST
RELEASE
Gambar 2.6 Proses Koneksi Protokol HTTP antara client dan server
50
BAB 3 ANALISIS DAN PERANCANGAN SISTEM
3.1 Analisis Sistem
Analisis sistem systems analysis dapat didefinisikan sebagai penguraian dari suatu sistem informasi yang utuh ke dalam bagian-bagian komponennya
dengan maksud untuk mengidentifikasikan dan mengevaluasi permasalahan- permasalahan, kesempatan, hambatan yang terjadi dan kebutuhan yang
diharapkan sehingga dapat diusulkan perbaikannya.
3.1.1 Analisis masalah
Ada beberapa permasalahan yang dihadapi didalam sistem yang sedang berjalan saat ini. Permasalahan-permasalahan tersebut diuraikan pada tabel
berikut:
Table 3.1. Tabel analisis masalah No
Permasalahan Bagianpihak
1.
2. 3.
4. Sistem yang berjalan saat ini masih konvensional dengan
siserm transaksi barang secara langsung menghabiskan waktu dan biaya yang cukup banyak.
Tidak adanya media promosi distro Black Orange Sistem saat ini membutuhkan shopkeeper yang cukup
banyak sehingga membuat pengeluaran untuk gaji karyawan juga cukup besar.
Dengan sistem yang berjalan sekarang, pemberian informasi kepada customer dirasakan kurang efektif
Pelanggan
Toko Toko
Pelanggan
` 5.
6. sehingga pelanggan belum tentu mendapatkan informasi
secara lengkap. Sistem pembayaran yang digunakan hanya dengan money
cash , sehingga dirasakan tidak fleksible. Dan bagi
pelanggan yang ingin melakukan transaksi dalam jumlah besar, harus membawa uang cash yang cukup besar.
Selama ini pengarsipan dilakukan dengan menggunakan kertas sehingga mudah hilang dan using.
Pelanggan
Toko
3.1.2 Analisis sistem yang berjalan saat ini
Sistem penjualannya di bagi menjadi 2 bagian yaitu : 1. Penjualan yang bersifat partai grosir
Biasanya sistem penjualan ini disebut sistem pembelian putus dimana nominal pembelian produk diatas 1 juta rupiah, dan mendapatkan discount
sebesar yang telah ditentukan. 2. Penjualan retail
Penjualan ini bersifat perseorangan dan pembeliannya pun sekitar 1 – 5
item per orang dan tidak ada kualifikasi discount. Disamping sistem penjualan yang tertera diatas, distro Black Orange
membuat program sale yang diadakan setahun 2 kali, biasanya di pertengahan tahun dan di akhir tahun.
Sistem pembelian yang dilakukan oleh pelanggan di distro Black Orange adalah sistem pembelian konvensional yaitu pelanggan harus datang ke toko
tersebut kemudian memilih barang secara langsung, setelah cocok maka
` pelanggan dapat melakukan penawaran dengan shopkeeper kemudian apabila
harga telah disepakat pelanggan akan melakukan pembayaran secara cash.
Gambar 3.1. Flow map penjualan
3.1.3 Solusi yang ditawarkan
Dari permasalahan-permasalahan yang telah dijabarkan diatas, solusi yang tawarkan adalah pembuatan E-Commerce distro Black Orange untuk promosi dan
penjualan secara online. Dalam sistem ini, pelanggan dapat melihat informasi
Pelanggan
barang
Kasir Bagian gudang
barang yang akan dibeli
Barang yang akan dibeli konsumen
Menghitung total harga
nota nota
Transaksi penjualan
barang
A1 Daftar barang
Input data barang
Uang pembayaran Uang pembayaran
Buat nota penjualan
` barang dan dapat melakukan pemesanan secara online. Dengan sistem ini juga
dapat menyelesaikan permasalahan promosi dan meminimalkan jumlah karyawan sebagai shopkeeper.
3.1.4 Analisis kebutuhan non fungsional
3.1.4.1 Target user
Target user pembuatan E-Commerce ini khususnya: 1. Pelanggan dalam kota yang ingin melihat barang yang dijual ditoko ini
dan membeli, tanpa harus datang ke toko. 2. Pelanggan yang berada diluar kota agar dapat membeli barang tanpa
harus datang ke toko, sehingga dapat tetap mendapat info barang yang akan dibeli.
3.1.4.2 Analisis pemakai
User dari aplikasi ini dibagi menjadi empat yaitu:
1. Administrator : kualifikasi yang harus dimiliki administrator yaitu kemampuan dasar dibidang komputer dan mengoperasikan Sistem Operasi
Windows 9x2000XP, mengerti tentang jaringan dan web server, pemahaman yang cukup untuk mengelola data dalam web terutama E-
Commerce serta memiliki pengetahuan tentang internet. 2. Operator : Kualifikasi yang harus dimiliki operator yaitu memiliki
kemampuan dasar di bidang komputer, dapat mengoperasikan Sistem Operasi Microsoft Windows 9x2000XP, memiliki pemahaman yang cukup dalam
mengelola data dalam web serta memiliki pengetahuan tentang internet .
` 3. Pengunjung : kualifikasi yang harus dimiliki pengunjung yaitu dapat
melakukan browsing di internet. 4. Pelanggan : kualifikasi yang harus dimiliki pelanggan yaitu memiliki
pengalaman browsing di internet.
3.1.4.3 Analisis Perangkat Keras
Perangkat keras yang direkomendasikan untuk menjalankan aplikasi ini adalah sebagai berikut :
1. Server a. Processor dengan kecepatan minimal 1 GHz
b. Kapasitas Harddisk minimal 80 GB c. RAM minimal 512 MB
d. VGA Card minimal 128 MB e. Monitor dengan resolusi 1024x768
f. Lan Card 10100Mbps g. Koneksi internet minimal 64 kbps
h. Mouse i. Keyboard
2. Cient a. Processor dengan kecepatan minimal 1 GHz
b. Kapasitas Harddisk minimal 40 GB c. RAM minimal 256 MB
d. VGA Card minimal 64 MB
` e. Monitor dengan resolusi 1024x768
f. Lan Card 10100Mbps g. Koneksi internet minimal 64 kbps
h. Mouse i. keyboard
3.1.4.4 Analisis Perangkat Lunak
Kebutuhan perangkat lunak merupakan faktor-faktor yang harus dipenuhi untuk merancang sebuah perangkat lunak sehingga perangkat lunak tersebut
sesuai dengan maksud dan tujuan perangkat lunak tersebut di buat. Beberapa perangkat lunak pendukung sebagai berikut :
1. Windows sebagai sistem operasi 2. PHP
3. Macromedia Dreamweaver 8 4. MySQL sebagai DBMS
5. Web Server Apache 6. Tool antarmuka design Microsoft Visio 2007
7. Mozila sebagai browser
3.2 Perancangan Sistem
3.2.1 Entity relationship diagram
ERD digunakan dalam membangun basis data untuk menggambarkan relasi atau hubungan dari dua file atau dua tabel. ERD terdiri dari 2 komponen
` utama yaitu entitas dan relasi. Kedua komponen tersebut dideskripsikan lebih jauh
melalui atribut –atribut atau properti.
Hubungan antar entitas yang terjadi dalam sistem E-Commerce yang akan dirancang dapat dilihat pada Entity Relationship Diagram berikut ini :
Petugas
Administrator IS A
Operator Kota_kirim
Mengelola
Barang Pelanggan
Memesan
Jenis_barang Memiliki
Kategori_barang
Memiliki
Detail_pesanan Memiliki
Memiliki Mengelola
Id_pesanan Id_barang
Id_jenis_barang id_kota_kirim
id_kategori_barang Id_petugas
Id_pelanggan Id_barang
Id_pesanan N
1 N
N 1
N 1
N N
N 1
1 N
Mengelola
N 1
Komentar
N N
Mengelola 1
N Mengelola
1
N
Id_pelanggan Id_kota_kirim
Id_komentar Id_jenis_barang
Id_pelanggan 1
Id_jenis_barang
id_kategori_barang Id_petugas
Id_petugas
Gambar 3.2. E ntity relationship diagram
Keterangan: Petugas={id_petugas, email, password, nama_petugas, akses, status}
Kota_kirim={Id_kota_kirim, nama_kota_kirim, ongkos_kirim, id_petugas}
` Kategori_barang={id_katagori_barang,
nama_kategori_barang, keterangan.
Id_petugas} Pelanggan={id_pelanggan, email, password, nama_pelanggan, alamat, kota, tlp,
hp, url_foto, status } Jenis Barang={id_jenis_barang, gambar_utama, harga, diskon, keterangan,
id_katagori_barang} Barang={id_barang, warna, ukuran, berat, stok, id_jenis_barang}
Pesanan={id_pesanan, id_palanggan, id_kota_kirim, tgl_pesan, tgl_akhir_bayar, nama_kirim, alamat_kirim, total_bayar, status_pesanan, jumlah_bayar,
tgl_bayar, tgl_kirim} Detail_pesanan={id_pesanan, id_barang, warna, ukuran, jumlah, harga_beli,
diskon_beli} Komentar={id_komentar, id_pelanggan, id_jenis_barang, tgl, isi, tampilkan}
3.2.2 Diagram konteks
Diagram konteks adalah arus data yang berfungsi untuk menggambarkan keterkaitan aliran-aliran data antara sistem dengan bagian-bagian luar.
` Adapun diagram konteks untuk sistem yang akan dibangun dapat dilihat
pada gambar 3.3 dibawah ini:
MEMBANGUN SISTEM E-
COMMERCE DI DISTRO BLACK
ORANGE pengunjung
Administrator
Operator Pelanggan
Info data pengunjung Info data kategori
Info data barang Info data detail barang
Data pengunjung Request data kategori
Request data barang Request data detail barang
Data login Data petugas
Info login invalid Info data petugas
Data login Data petugas
Data kota Data kategori
Data jenis barang Data detail barang
Data detail pesanan Data pesanan
Info login invalid Info data petugas
Info data kota Info data kategori
Info data jenis barang Info data detail barang
Info data detail_pesanan Info data pesanan
Data login Data data jenis barang
Request data barang Request data kategori
Request data kota Request data detail pesanan
Request data pesanan Info login invalid
Info data jenis barang Info data barang
Info data kategori Info data kota
Info data detail pesanan Info data pesanan
Gambar 3.3. diagram konteks
3.2.3 Data flow diagram
Data Flow Diagram merupakan suatu media yang digunakan untuk
menggambarkan aliran data yang mengalir pada suatu sistem informasi. DFD Sistem informasi pemesanan dan penjualan yang diusulkan terdiri dari beberapa
bagian, berikut data flow diagram selengkapnya :
`
`
2.1 Verfikasi
username
2.2 Verifikasi
password
Blackorange_petugas
Administrator email valid
Data login info email
info password data login
in fo
l og
in i
nva lid
D a
ta l
og in
login valid Operator
In fo
lo g
in in
val id
D a
ta lo
g in
Gambar 3.5. Data flow diagram level 2 proses 2
3.1 Verfikasi
username
3.2 Verifikasi
password
Blackorange_pelanggan
Pelanggan email valid
Data login info email
info password data login
inf o
log in
in v
a lid
D a
ta lo
gi n
login valid
Gambar 3.6. Data flow diagram level 2 proses 3
`
Menambah petugas
Mengubah akses dan
status administrator
Blackorange_petugas Data petugas
Info petugas
Data akses, status Info petugas
Data petugas Info petugas
Data akses, status Info petugas
4.1
4.2
Mengubah nama
Mengubah Email
Mengubah password
Data nama Info nama
Data email baru,password Info email
Data password lama,password baru, valiadsi password
Info password Data nama
Info nama Data email baru,password
Info email Data password lama,password baru, valiadsi password
Info password Operator
Data nama Info nama
Data email baru,password Info email
Data password lama,password baru, valiadsi password Info password
4.3
4.4
4.5
Gambar 3.7. Data flow diagram level 2 proses 4
5.1 Info
pelanggan
5.2 mengubah
status pelanggan
Blackorange_ pelanggan
Info Pelanggan Request Data Pelanggan
administrator Request Data Pelanggan
Info Pelanggan
Info pelanggan Data pelanggan
Data pelanggan Info pelanggan
5.3 mengubah
profil Pelanggan
5.4 Mengubah
password Data pelanggan
Info pelanggan Data password
Info perubahan Data pelanggan
Info perubahan
Data password Info perubahan
Gambar 3.8. Data flow diagram level 2 proses 5
`
Kelola Kota kirim
Kelola Kategori
barang
Kelola Jenis barang
Operator Blackorange_
Kota_kirim
Blackorange_Kategori _barang
Blackorange_jenis _barang
Data jenis barang info jenis barang
Data kategori barang info kategori barang
info kota kirim
info jenis barang
Data jenis barang info kategori barang
Data kategori barang info kota kirim
Data kota kirim 6.1
6.2
6.3
Kelola pesanan
Blackorange_ pesananan
info pesanan
data pesanan Data pesanan
info pesanan 6.5
Data kota kirim
Kelola barang
Data barang info barang
Blackorange_barang data barang
Info barang 6.4
Gambar 3.9. Data flow diagram level 2 proses 6
`
Keranjang belanja
Isi data pembayaran
Check out pelanggan
Blackorange_ pesanan
Id_barang, jumlah barang
Data pengiriman Data pengiriman
Info pesanan info detail pesanan
Checkout Data pesanan
Blackorange_Detail _pesanan
Id_barang, jumlah barang info pesanan
info detail pesanan 8.1
8.2 8.3
Id_barang, jumlah barang info detail barang
Gambar 3.10. Data flow diagram level 2 proses 8
Menambah kota kirim
Mengubah kota kirirm
Menghapus kota kirim
operator blackorange_
Kota kirim Info Data kota kirim
Data kota kirim Data kota kirim
Info data kota kirim
Data kota kirim Info data kota kirim
Data kota kirim
Info data kota kirim
Data kota kirim Info data kota kirim
Data kota kirim Info data kota kirim
6.1.1
6.1.2
6.1.3
Gambar 3.11. Data flow diagram level 3 proses 6.1
`
Menambah kategori
barang
Mengubah kategori
barang
Menghapus kategori
barang operator
blackorange_kategori _barang
Info Data kategori barang Data kategori barang
Data kategori barang Info data kategori barang
Data kategori barang Info data kategori barang
Data kategori barang Info data
kategori barang
Data kategori barang Info data kategori barang
Data kategori barang Info data kategori barang
6.2.1
6.2.2
6.2.3
Gambar 3.12. Data flow diagram level 3 proses 6.2
Menambah jenis barang
Mengubah jenis barang
Menghapus jenis barang
operator Blackorange_
Jenis barang Data jenis barang
Info data jenis barang Info Data jenis barang
Data jenis barang
Data jenis barang Info data jenis barang
Data jenis barang
Info data jenis barang
Info Data jenis barang Data jenis barang
Info Data jenis barang Data jenis barang
6.3.1
6.3.2
6.3.3
Gambar 3.13. Data flow diagram level 3 proses 6.3
`
Menambah barang
Mengubah barang
Menghapus barang
operator blackorange_
barang Info Data barang
Data barang Data barang
Info data barang
Data barang Info data barang
Data barang
Info data barang
Data barang Info data barang
Data barang Info data barang
6.4.1
6.4.2
6.4.3
Gambar 3.14. Data flow diagram level 3 proses 6.4
Pembayaran
Id Pesanan
Menghapus barang
operator blackorange_
pesanan Info pembayaran
Id_Pesanan,Total Bayar Id_Pesanan,Total Bayar
Info pembayaran
Id_Pesanan Info data barang
Id_Pesanan
Info pengiriman barang
Data barang Info data barang
Data barang Info data barang
6.5.1
6.5.2
6.5.3
Gambar 3.15. Data flow diagram level 3 proses 6.5
` 3.2.4
Spesifikasi proses Tabel 3.2. Spesifikasi proses
No Proses
Keterangan 1
No.Proses 1.0
Nama Daftar pelanggan
Sumber Pengunjung
Input Data Pengunjung
Output Info Pengunjung
Tujuan Pengunjung
Logika proses 1. Pengunjung mengisi data pelanggan.
2. Apabila ada
data yang
tidak valid
pengunjung harus mengisi kembali data yang tidak valid.
3. Apabila data valid maka sistem akan menyimpan data tersebut.
2 No.proses
2.1 Nama
Verifikasi username Sumber
operator, administrator Input
Data login operator, Data login administrator Output
Info login operator invalid, Info login administrator invalid
Tujuan operator, administrator
Logika proses 1. operator,administrator memasukkan data
login 2. Apabila username yang diinputkan benar
maka user name valid. 3. Apabila username yang diinputkan tidak
benar maka akan ada informasi login invalid.
3 No.proses
2.2 Nama
Verifikasi password Sumber
operator, administrator Input
Data login operator, Data login administrator Output
Info login operator invalid, Info login administrator invalid
Tujuan operator, administrator
Logika proses 1. operator,administrator memasukkan data
login 2. Apabila password yang diinputkan benar
maka password valid. 3. Apabila password yang diinputkan tidak
benar maka akan ada informasi login invalid.
4 No.proses
3.1
` Nama
Verifikasi username Sumber
pelanggan Input
Data login pelanggan Output
Info data pelanggan Tujuan
pelanggan Logika proses
1. pelanggan memasukkan data login 2. Apabila username yang diinputkan benar
maka user name valid. 3. Apabila username yang diinputkan tidak
benar maka akan ada informasi login invalid.
5 No.proses
3.2 Nama
Verifikasi password Sumber
Pelanggan Input
Data login pelanggan Output
Info data pelanggan Tujuan
Pelanggan Logika proses
1. pelanggan memasukkan data login 2. Apabila password yang diinputkan benar
maka password valid. 3. Apabila password yang diinputkan tidak
benar maka akan ada informasi login invalid.
6 No.proses
4.1 Nama
Menambah petugas Sumber
administrator Input
Data petugas Output
Info petugas Tujuan
administrator Logika proses
1. administrator memilih menu tambah petugas untuk memunculkan form tambah
petugas. 2. administrator
mengisi form
tambah petugas kemudian klik tombol simpan.
3. Apabila data tidak kosong maka data petugas baru akan disimpan didalam
database .
4. Apabila data ada yang kosong maka akan ada informasi data tidak boleh kosong dan
administrator harus mengisi data yang kosong tersebut.
7 No.proses
4.2 Nama
Mengubah akses dan status Sumber
Administrator Input
Data akses, status
` Output
Info petugas Tujuan
Administrator Logika proses
1. administrator memilih menu edit petugas untuk memunculkan form edit petugas.
2. administrator mengubah data akses dan status petugas kemudian klik tombol
simpan. 3. Apabila data benar maka data petugas akan
disimpan didalam database. 4. Apabila data kurang benar maka akan ada
informasi data kurang benar. 8
No.proses 4.3
Nama Mengubah nama
Sumber Administrator, operator
Input Data nama Administrator, Data nama operator
Output Info nama Administrator, Data nama operator
Tujuan Administrator, operator
Logika proses 1. Administrator,operator memilih link ubah
nama petugas untuk memunculkan form ubah nama petugas.
2. Administrator,operator mengisi form ubah nama petugas kemudian klik tombol
simpan. 3. Apabila data tidak kosong maka data ubah
nama petugas akan disimpan didalam database
. 4. Apabila data ada yang kosong maka akan
ada informasi data tidak boleh kosong dan Administrator,operator harus mengisi data
yang kosong tersebut.
9 No.proses
4.4 Nama
Mengubah Email Sumber
Administrator, operator Input
Data email baru Administrator,password Administrator,
Data email
baru operator,password operator
Output Info email administrator, Info email operator
Tujuan Administrator, operator
Logika proses 1. Administrator,operator memilih link ubah
Email petugas untuk memunculkan form ubah Email petugas.
2. Administrator,operator mengisi form ubah Email petugas kemudian klik tombol
simpan. 3. Apabila data tidak kosong maka data ubah
` Email petugas akan disimpan didalam
database .
4. Apabila data ada yang kosong maka akan ada informasi data tidak boleh kosong dan
Administrator,operator harus mengisi data yang kosong tersebut.
10 No.proses
4.5 Nama
Mengubah Password Sumber
Administrator, operator Input
Data password lama Administrator,password baru
Administrator, valiadsi
password Administrator,
Data password
lama operator,password baru operator, valiadsi
password operator. Output
Info password Administrator, Info password operator
Tujuan Administrator, operator
Logika proses 1. Administrator,operator memilih link ubah
Password petugas untuk memunculkan form ubah Password petugas.
2. Administrator,operator mengisi form ubah Password petugas kemudian klik tombol
simpan. 3. Apabila data tidak kosong maka data ubah
Password petugas akan disimpan didalam database
. 4. Apabila data ada yang kosong maka akan
ada informasi data tidak boleh kosong dan Administrator,operator harus mengisi data
yang kosong tersebut.
11 No.proses
5.1 Nama
Info pelanggan Sumber
Administrator Input
Request Data Pelanggan Output
Info Pelanggan Tujuan
Administrator Logika proses
1.
Administrator memilih
menu data
pelanggan untuk memunculkan info data pelanggan
12 No.proses
5.2 Nama
mengubah status pelanggan Sumber
Administrator
` Input
Data pelanggan Output
Info pelanggan Tujuan
Administrator Logika proses
1. Administrator memilih tombol edit status pelanggan untuk memunculkan form ubah
Password petugas. 2. Administrator mengubah status pelanggan
kemudian klik tombol simpan. 3. Apabila data benar maka data status
pelanggan akan
disimpan didalam
database .
4. Apabila data kurang benar maka akan ada informasi data kurang benar.
13 No.proses
5.3 Nama
mengubah profil Sumber
pelanggan Input
Data pelanggan Output
Info pelanggan Tujuan
pelanggan Logika proses
1. pelanggan memilih tombol ubah profil pelanggan untuk memunculkan form ubah
profil pelanggan. 2. pelanggan mengisi form ubah profil
pelanggan kemudian klik tombol simpan. 3. Apabila data tidak kosong maka data ubah
profil pelanggan akan disimpan didalam database
. 4. Apabila data ada yang kosong maka akan
ada informasi data tidak boleh kosong dan pelanggan harus mengisi data yang kosong
tersebut.
14 No.proses
5.4 Nama
Mengubah password Sumber
pelanggan Input
Data password Output
Info perubahan Tujuan
pelanggan Logika proses
1. pelanggan memilih tombol ubah Password pelanggan untuk memunculkan form ubah
Password pelanggan. 2. pelanggan mengisi form ubah Password
pelanggan kemudian klik tombol simpan. 3. Apabila data tidak kosong maka data ubah
Password pelanggan
akan disimpan
` didalam database.
4. Apabila data ada yang kosong maka akan ada informasi data tidak boleh kosong dan
pelanggan harus mengisi data yang kosong tersebut.
15 No.proses
6.1.1 Nama
Menambah kota kirim Sumber
Operator Input
Data kota kirim Output
Info Data kota kirim Tujuan
Operator Logika proses
1. Operator memilih menu tambah kota untuk memunculkan form tambah kota kirim.
2. Operator mengisi form tambah kota kirim kemudian klik tombol simpan.
3. Apabila data tidak kosong maka data kota kirim baru akan disimpan didalam
database .
4. Apabila data ada yang kosong maka akan ada informasi data tidak boleh kosong dan
Operator harus mengisi data yang kosong tersebut.
16 No.proses
6.1.2 Nama
Mengubah kota kirim Sumber
Operator Input
Data kota kirim Output
Info data kota kirim Tujuan
operator Logika proses
1. operator mengklik tombol ubah pada data yang akan diubah.
2. operator mengisi data kota kirim yang ingin diubah kemudian klik tombol ubah.
3. Apabila ada data yang diubah dan dan semua data tidak ada yang kosong maka
sistem akan menyimpan perubahan data. 4. Apabila tidak ada data yang diubah dan
ada data yang kosong maka data gagal diubah.
17 No.proses
6.1.3 Nama
Menghapus kota kirim Sumber
operator Input
Data kota kirim Output
Info data kota kirim
` Tujuan
operator Logika proses
1. operator mengklik tombol hapus pada data yang akan dihapus.
2. Akan ada konfirmasi penghapusan data. 3. Apabila pilihannya data akan dihapus.
4. Apabila pilihannya tidak data tidak jadi
dihapus 18
No.proses 6.2.1
Nama Menambah kategori barang
Sumber operator
Input Data kategori barang
Output Info data kategori barang
Tujuan operator
Logika proses 1. Operator memilih menu tambah kategori
barang untuk memunculkan form tambah kategori barang
2. Operator mengisi form tambah kategori barang kemudian klik tombol simpan.
3. Apabila data tidak kosong maka data kategori barang baru akan disimpan
didalam database. 4. Apabila data ada yang kosong maka akan
ada informasi data tidak boleh kosong dan Operator harus mengisi data yang kosong
tersebut.
19 No.proses
6.2.2 Nama
Mengubah kategori barang Sumber
operator Input
Data kategori barang Output
Info data kategori barang Tujuan
operator Logika proses
1. operator mengklik tombol ubah pada data yang akan diubah.
2. operator mengisi data kategori barang yang ingin diubah kemudian klik tombol ubah.
3. Apabila ada data yang diubah dan dan semua data tidak ada yang kosong maka
sistem akan menyimpan perubahan data. 4. Apabila tidak ada data yang diubah dan
ada data yang kosong maka data gagal diubah.
20 No.proses
6.2.3 Nama
Menghapus kategori barang Sumber
operator
` Input
Data kategori barang Output
Info data kategori barang Tujuan
operator Logika proses
1. operator mengklik tombol hapus pada data yang akan dihapus.
2. Akan ada konfirmasi penghapusan data. 3. Apabila pilihannya data akan dihapus.
4. Apabila pilihannya tidak data tidak jadi
dihapus 21
No.proses 6.3.1
Nama Menambah jenis barang
Sumber operator
Input Data jenis barang
Output Info data jenis barang
Tujuan operator
Logika proses 1. Operator memilih menu tambah jenis
barang untuk memunculkan form tambah jenis barang
2. Operator mengisi form tambah jenis barang kemudian klik tombol simpan.
3. Apabila data tidak kosong maka data jenis barang baru akan disimpan didalam
database .
4. Apabila data ada yang kosong maka akan ada informasi data tidak boleh kosong dan
Operator harus mengisi data yang kosong tersebut.
22 No.proses
6.3.2 Nama
Mengubah jenis barang Sumber
operator Input
Data jenis barang Output
Info data jenis barang Tujuan
operator Logika proses
1. operator mengklik tombol ubah pada data yang akan diubah.
2. operator mengisi data jenis barang yang ingin diubah kemudian klik tombol ubah.
3. Apabila ada data yang diubah dan dan semua data tidak ada yang kosong maka
sistem akan menyimpan perubahan data. 4. Apabila tidak ada data yang diubah dan
ada data yang kosong maka data gagal diubah.
` 23
No.proses 6.3.3
Nama Menghapus jenis barang
Sumber operator
Input Data jenis barang
Output Info data jenis barang
Tujuan operator
Logika proses 1. operator mengklik tombol hapus pada data
yang akan dihapus. 2. Akan ada konfirmasi penghapusan data.
3. Apabila pilihannya data akan dihapus. 4. Apabila pilihannya tidak data tidak jadi
dihapus 24
No.proses 6.4.1
Nama Menambah barang
Sumber operator
Input Data barang
Output Info Data barang
Tujuan operator
Logika proses 1. Operator memilih menu tambah barang
untuk memunculkan form tambah barang 2. Operator mengisi form tambah barang
kemudian klik tombol simpan. 3. Apabila data tidak kosong maka data jenis
barang baru akan disimpan didalam database
. 4. Apabila data ada yang kosong maka akan
ada informasi data tidak boleh kosong dan Operator harus mengisi data yang kosong
tersebut.
25 No.proses
6.4.2 Nama
Mengubah barang Sumber
operator Input
Data barang Output
Info Data barang Tujuan
operator Logika proses
1. operator mengklik tombol ubah pada data yang akan diubah.
2. operator mengisi data jenis barang yang ingin diubah kemudian klik tombol ubah.
3. Apabila ada data yang diubah dan dan semua data tidak ada yang kosong maka
sistem akan menyimpan perubahan data. 4. Apabila tidak ada data yang diubah dan ada
` data yang kosong maka data gagal diubah.
26 No.proses
6.4.3 Nama
Menghapus barang Sumber
operator Input
Data barang Output
Info Data barang Tujuan
operator Logika proses
1. operator mengklik tombol hapus pada data yang akan dihapus.
2. Akan ada konfirmasi penghapusan data. 3. Apabila pilihannya data akan dihapus.
4. Apabila pilihannya tidak data tidak jadi
dihapus
3.2.5 Kamus data
Kamus data merupakan sebuah daftar yang tersusun dari elemen data yang berhubungan dengan sistem. Kamus data dibuat berdasarkan arus data yang
ada di diagram flow data. Berikut ini adalah kamus data yang di ambil dari data flow diagram
Sistem Informasi Pemesanan dan Penjualan yang diusulkan :
Table 3.3. Kamus data
Nama Aliran data Data login
Where used how used Operator-proses 2.1
administrator-proses 2.1 pelanggan-proses 3.1
Deskripsi Berisi data untuk login
Struktur data Username+password
Username [A..Z|a..z|0..9]
Password [A..Z|a..z|0..9]
` Nama Aliran data
Data login pelanggan
Where used how used Pelanggan-proses3
Pelanggan-proses3.1 Proses 3-file login pelanggan
Proses 3.1-file pelanggan Deskripsi
Berisi data login pelanggan Struktur data
id_pelanggan+ email+password+ nama_pelanggan+ alamat+ kota+ tlp+ hp +
url_foto+ status
id_pelanggan [A-Z|a-z|0-9]
email [A-Z|a-z|0-9]
password [A-Z|a-z|0-9]
nama_pelanggan [A-Z|a-z|0-9]
alamat [A-Z|a-z|0-9]
kota [A-Z|a-z|0-9]
tlp [0-9]
hp [0-9]
url_foto images
status [A-Z|a-z|0-9]
Nama Aliran data Data login administrator
Where used how used administrator-proses2
administrator-proses2.1 Proses 2-file administrator
Proses 2.1-file administrator Deskripsi
Berisi data login administrator Struktur data
Email_admin + password Username_admin
[A-Z|a-z|0-9]
` Password
[A-Z|a-z|0-9] Nama Aliran data
Data operator
Where used how used operator
–proses 2 operator -proses 2.1
Proses 2-file operator Proses 2.1-file operator
Deskripsi Berisi data operator
Struktur data Id_petugas
+ email+ password + nama _petugas+akses + status
Id_petugas email
password Nama_petugas
akses status
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
Nama Aliran data Data login operator
Where used how used operator -proses2
operator -proses 2.1 Proses 2-file operator
Proses 2.1-file operator Deskripsi
Berisi data login operator Struktur data
Username + password Username
Password [A-Z|a-z|0-9]
[A-Z|a-z|0-9] Nama Aliran data
Data kota kirim Where used how used
operator -proses 6 operator -proses 6.1
` Proses 6-file kota kirim
Proses 6.1-file kota kirim Deskripsi
Berisi data kota Struktur data
Id_kota_kirim + nama_kota_kirim+ ongkos_kirim +id_petugas
Id_kota_kirim Nama kota kirim
Ongkos_kirim Id_petugas
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
[0-9] [A-Z|a-z|0-9]
Nama Aliran data Data kategori barang
Where used how used operator-proses 6
operator -proses 6.2 Proses 6 -file kategori
Proses 6.2-file kategori Deskripsi
Berisi data kategori barang Struktur data
Id_kategori_barang+Nama_kategori_barang+ket erangan+ id_petugas
Id_kategori_barang Kategori barang
Keterangan id_petugas
[A-Z|a-z|0-9] A-Z|a-z|0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
Nama Aliran data Data jenis barang
Where used how used operator -proses 6
operator -proses 6.3 Proses 6-file jenis barang
Proses 6.3-file jenis barang Deskripsi
Berisi data jenis barang
` Struktur data
Id_jenisbarang+id_kategori_barang+harga+ gambar _utama+diskon+ keterangan
Id_jenis_barang Id_Kategori_barang
Harga Gambar_utama
Diskon Keterangan
[0-9] [A-Z|a-z|0-9]
[0-9] images
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
Nama Aliran data Data barang
Where used how used operator -proses 6
operator -proses 6.4 Proses 6-file barang
Proses 6.4-file barang Deskripsi
Berisi data barang Struktur data
Id_barang+id_jenisbarang+warna+ukuran+berat +stok
Id_barang Id_jenisbarang
Warna Ukuran
berat Stok
[0-9] [0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
[0-9] [0-9]
Nama Aliran data Data pesanan
Where used how used operator -proses 6
operator -proses 6.5 Proses 6-file pesanan
Proses 6.5-file pesanan
` Deskripsi
Berisi data pesanan
Struktur data Id_pesanan+id_pelanggan+id_kota_kirim+tgl_p
esan+tgl_akhir_bayar+nama_kirim+ alamat_kirim+ kota_kirim+ total_bayar+
status_pesanan+ jumlah bayar+ tgl_bayar+ tgl_kirim
Id_pesanan Id_ pelanggan
Id_kota_kirim Tgl_pesan
Tgl_akhir_bayar Nama_kirim
Alamat_kirim Kota_kirim
Total_bayar Status_pesanan
Jumlah_bayar Tgl_bayar
Tgl_kirim [0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9 ]
[A-Z|a-z|0-9 ] [A-Z|a-z|0-9 ]
[A-Z|a-z|0-9 ] [0-9]
[A-Z|a-z|0-9] [0-9]
[A-Z|a-z|0-9] [A-Z|a-z|0-9]
` 3.2.6
Skema relasi
blackorange_pelanggan
PK id_pelanggan
email password
nama_pelanggan alamat
kota telepon
hp url_foto
status blackorange_pesanan
PK id_pesanan
id_pelanggan id_kota_kirim
tgl_pesan tgl_akhir_bayar
nama_kirim alamat_kirim
total_bayar status_pesanan
jumlah bayar tgl_bayar
tgl_kirim Melalui
kodeTransaksi blackorange_detail_pesanan
PK id_pesanan
PK id_barang
warna ukuran
jumlah harga_beli
diskon_beli
blackorange_Jenis_barang
PK id_jenis_barang
id_katagori_barang gambar_utama
harga diskon
keterangan
blackorange_Petugas
PK id_petugas
email password
nama_petugas akses
status blackorange_Kota_kirim
PK id_kota_kirim
id_petugas nama_kota_kirim
ongkos_kirim
blackorange_Kategori_barang
PK id_kategori_barang
id_petugas nama_katagori_barang
keterangan blackorange_barang
PK id_barang
id_jenis_barang warna
ukuran berat
stok blackorange_komentar
PK id_komentar
id_pelanggan id_jenis_barang
tgl isi
tampilan
Gambar 3.16. Skema relasi
3.2.7 Struktur database
1. File pelanggan
a. Nama File : Tabel Pelanggan
b. Primary Key : id_pelanggan
c. Jumlah Field : 10
d. Keterangan : Tabel berisi data pelanggan
`
Tabel 3.4. Tabel pelanggan Nama Tabel : Tabel pelanggan
Keterangan : Tabel untuk data pelanggan
Nama Field Tipe Data Panjang
Keterangan Id_pelanggan
Int 11
Primary key Email
Varchar 100
Email Password
Varchar 50
Password Nama_pelanggan
Varchar 50
Nama pelanggan Alamat
Teks -
Alamat pelanggan Kota
Varchar 30
Kota pelanggan Tlp
Varchar 15
Telepon pelanggan Hp
Varchar 15
Handphone pelanggan
Url_ foto
Text -
Url foto pelanggan
Status Int
11 Status pelanggan
2. File Jenis barang a. Nama File
: Tabel Jenis barang b. Primary Key
: Id_jenis_barang c. Jumlah Field
: 6 d. Keterangan
: Tabel berisi data jenis barang
`
Tabel 3.5. Tabel jenis barang Nama Tabel : Tabel Jenis Barang
Keterangan : Tabel untuk data jenis barang
Nama Field Tipe Data Panjang
Keterangan Id_jenis_barang
Int 11
Primary Key Id_Kategori_barang
Int 11
Foreign key reference ke table
kategori field id_kategori_barang
Gambar_utama Teks
- Gambar utama jenis barang
Harga Double
- Harga jenis barang
Diskon Double
- Diskon jenis barang
Keterangan Teks
- Keterangan jenis barang
3. File Barang a. Nama File
: Tabel barang b. Primary Key
: Id_barang c. Jumlah Field
: 6 d. Keterangan
: Tabel berisi data barang
Tabel 3.6. Tabel barang Nama Tabel : Tabel Barang
Keterangan : Tabel untuk data barang
Nama Field Tipe Data Panjang
Keterangan Id_barang
Int 11
Primary Key
` Id_jenis_barang
Int 11
Foreign key reference ke table
barang field id_barang Warna
Varchar 15
Warna barang Ukuran
Varchar 15
Ukuran barang Berat
Double -
Berat barang Stok
Int 11
Jumlah stok barang
4. File petugas a. Nama File
: Tabel petugas b. Primary Key
: id_petugas c. Jumlah Field
: 6 d. Keterangan
: Tabel berisi data petugas
Tabel 3.7. Tabel petugas Nama Tabel : Tabel c
Keterangan : Tabel untuk data
petugas
Nama Field Tipe Data Panjang
Keterangan
Id_petugas
Int 11
Primary Key Email
Varchar 100
Email
petugas
Password Varchar
50 Password
petugas
Nama_petugas Varchar
50 Nama
petugas
Akses Varchar
15 Akses petugas
Status Varchar
1 Status
petugas
` 5. File Pesanan
a. Nama File : Tabel Pesanan
b. Primary Key : Id_pesanan
c. Jumlah Field : 14
d. Keterangan : Tabel berisi data pesanan
Tabel 3.8. Tabel pesanan Nama Tabel : Tabel pesanan
Keterangan : Tabel untuk data pesanan
Nama Field Tipe Data Panjang
Keterangan Id_pesanan
Int 11
Primary Key Id_pelanggan
Int 11
Foreign key reference ke tabel
pelanggan field id_pelanggan Id_kota_kirim
Int 11
Foreign key reference ke tabel
kota kirim field id_kota_kirim Tgl_pesan
Date -
Tanggal pemesanan barang Tgl_akhir_bayar
Date -
Tanggal terakhir pembayaran barang
Nama_kirim Varchar
30 Nama tujuan pengiriman barang
Alamat_kirim Text
- Alamat pengiriman barang
Total_ bayar Double
- Jumlah yang harus dibayarkan
Status_pesanan varchar
15 Status pemesanan
Jumlah_bayar Double
- Total yang dibayarkan
Tgl_bayar Date
- Tanggal pembayaran
` Tgl_kirim
Date -
Tanggal kirim Melalui
Varchar 15
Pembayaran melalui KodeTransaksi
Varchar 20
Kode Transaksi 6. File detail_pesanan
a. Nama File : Tabel detail_pesanan
b. Primary Key : Id_detail_pesanan
c. Jumlah Field : 7
d. Keterangan : Tabel berisi data detail_pesanan
Tabel 3.9. Tabel Detail_pesanan Nama Tabel : Tabel detail_pesanan
Keterangan : Tabel untuk data detail_pesanan
Nama Field Tipe Data Panjang
Keterangan
Id_pesanan Int
11 Primary Key, Foreign key
reference ke tabel pesanan field
id_pesanan
Id_barang Int
11 Primary Key, Foreign key
reference ke tebel barang field
id_barang Warna
Varchar 15
Warna barang Ukuran
Varchar 15
Ukuran barang Jumlah
Int -
Jumlah barang yang dipesan Harga_beli
Double -
Harga barang pada saat dibeli Diskon_beli
Double -
Diskon pada saat beli 7. File kota_kirim
a. Nama File : Tabel kota_kirim
` b. Primary Key
: Id_kota_kirim c. Jumlah Field
: 4 d. Keterangan
: Tabel berisi data kota kirim
Tabel 3.10. Tabel Kota kirim Nama Tabel : Tabel kota
kirim
Keterangan : Tabel untuk data kota
kirim
Nama Field Tipe Data Panjang
Keterangan Id_kota_kirim
Int 11
Primary key Id_petugas
Int 11
Foreign key reference ke tabel
petugas field id_petugas Nama_kota_kirim
Varchar 50
Nama kota kirim Ongkos_kirim
Double -
Ongkos kirim per kota
8. File kategori_barang a. Nama File
: Tabel kategori_barang b. Primary Key
: Id_kategori_barang c. Jumlah Field
: 4 d. Keterangan
: Tabel berisi data kategori barang
Tabel 3.11 Tabel Kategori Nama Tabel : Tabel kategori barang
Keterangan : Tabel untuk data kategori barang
Nama Field Tipe Data Panjang
Keterangan Id_kategori_barang
Int 11
Primary Key
` Id_petugas
Int 11
Foreign key reference ke tabel
petugas field id_petugas Nama_katagori_bara
ng Varchar
50 Nama katagori barang
Keterangan Text
keterangan kategori
barang
9. File_komentar a. Nama File
: Tabel _komentar b. Primary Key
: Id__komentar c. Jumlah Field
: 6 d. Keterangan
: Tabel berisi data komentar
Tabel 3.12. Tabel komentar Nama Tabel : Tabel komentar
Keterangan : Tabel untuk data komentar
Nama Field Tipe Data Panjang
Keterangan Id
_
komentar Int
11 Primary key
Id_pelanggan Int
11 Foreign key reference
ke tabel pelanggan field id_pelanggan
Id_jenis_barang Int
11 Foreign key reference
ke tabel jenis_barang field
id_jenis_barang
Tgl Date
- Tanggal komentar
Isi Text
- Isi komentar
Tampilan Int
11 Tampilan komentar
`
3.3 Perancangan Arsitektur
Perancangan arsitektur merupakan perancangan yang dibuat sebelum program aplikasi dibuat. Dengan perancangan arsitektur akan mempermudah
proses pembangunan aplikasi E-Commerce berbasis web di distro Black Orange.
3.3.1 Perancangan antar muka
Interface atau antar muka merupakan tampilan dari suau program aplikasi
yang berperan sebagai media komunikasi yang digunakan sebagai sarana berdialog antara program dengan user. Sistem yang akan dibangun diharapkan
menyediakan interface yang mudah dipahami dan digunakan oleh user Perancangan interface untuk aplikasi E-Commerce pada distro Black
Orange adalah sebagai berikut :
` 1. Antar muka pengunjung
a. Form beranda pengunjung
Keterangan: Nama Form
: T01 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
T01 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Sweeter Galeri5
Galeri8 Galeri7
Galeri6 Kemeja
Galeri9 Galeri12
Galeri12 Galeri11
Tas Galeri13
Galeri16 Galeri15
Galeri14 Topi
Galeri17 Galeri20
Galeri19 Galeri18
Sandal Galeri21
Galeri24 Galeri23
Galeri22 Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.17. Form beranda pengunjung
` b.
Form registrasi pelanggan
Keterangan: Nama Form
: T02 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju keform T02
T02 Image1
Katagori Produk
Alamat
Rekening
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Sweeter Galeri5
Galeri8 Galeri7
Galeri6 Kemeja
Galeri9 Galeri12
Galeri12 Galeri11
Tas Galeri13
Galeri16 Galeri15
Galeri14 Topi
Galeri17 Galeri20
Galeri19 Galeri18
Sandal Galeri21
Galeri24 Galeri23
Galeri22 Selamat datang
Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.18. Form registrasi pelanggan
`
c. Form barang
Keterangan: Nama Form
: T03 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju keform T02
Klik gambar menuju keform T04
T03 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Galeri5 Galeri8
Galeri7 Galeri6
Galeri9 Galeri12
Galeri11 Galeri10
Galeri13 Galeri16
Galeri15 Galeri14
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.19. Form barang
` d.
Form view Barang
Keterangan: Nama Form
: T04 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju ke form T02
Klik gambar keranjang belanja menuju ke form T04
T04 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Gambar
Gambar Keranjang
Belanja
Teks Harga dan Data Barang
Warna Ukuran
V V
Step 1 Step 2
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.20. Form view barang
` e.
Form Profil Distro Black Orange
Keterangan: Nama Form
: T05 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju ke form T02
T05 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Alamat Distro Profil Distro
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.21. Form profil Distro Black Orange
` f.
Form Cara Pesan
Keterangan: Nama Form
: T06 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju ke form T02
T06 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Teks Cara Pesan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.22. Form Cara Pesan
` g.
Form Tanya Jawab
Keterangan: Nama Form
: T07 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju ke form T02
T07 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Teks Tanya Jawab
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.23. Form Tanya Jawab
` h.
Form Kontak
Keterangan: Nama Form
: T08 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form T01
Klik daftar member menuju ke form T02
Klik link barang menuju ke form T03
Klik link profil menuju ke form T05
Klik link cara pesan keform T06
Klik link tanya jawab menuju ke form T07
Klik link kontak menuju ke form T08
Klik tombol daftar menuju ke form T02
T08 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Teks Tanya Jawab
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.24. Form Kontak
` 2. Antar muka pelanggan
a. Form beranda sebelum login
Keterangan: Nama Form
: C01 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik tombol daftar menuju ke form C02
C01 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Sweeter Galeri5
Galeri8 Galeri7
Galeri6 Kemeja
Galeri9 Galeri12
Galeri12 Galeri11
Tas Galeri13
Galeri16 Galeri15
Galeri14 Topi
Galeri17 Galeri20
Galeri19 Galeri18
Sandal Galeri21
Galeri24 Galeri23
Galeri22 Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.25. Form beranda sebelum login
` b. Form registrasi
Keterangan: Nama Form
: C02 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik tombol daftar menuju ke form C02
C02 Image1
Alamat
Copyright Black Orange
Masuk Email
Password Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Daftar menjadi member
Nama Lengkap Email
Daftar Password Baru
Validasi Password
Kode Gambar
Sweeter Galeri5
Galeri8 Galeri7
Galeri6 Kemeja
Galeri9 Galeri12
Galeri12 Galeri11
Tas Galeri13
Galeri16 Galeri15
Galeri14 Topi
Galeri17 Galeri20
Galeri19 Galeri18
Sandal Galeri21
Galeri24 Galeri23
Galeri22 Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.26. Form registrasi
` c. Form beranda sesudah login
Keterangan: Nama Form
: C03 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
C03 Image1
Alamat
Copyright Black Orange
Keranjang Pesanan Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Sweeter
Galeri8 Galeri11
Galeri10 Galeri9
Kemeja Galeri14
Galeri17 Galeri16
Galeri15 Tas
Galeri19 Galeri22
Galeri21 Galeri20
Topi Galeri23
Galeri26 Galeri25
Galeri24 Sandal
Galeri27 Galeri30
Galeri29 Galeri28
Galeri5
Galeri12 Galeri7
Galeri6
Galeri13
Galeri18 Keluar
pelanggan Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.27. Form beranda sesudah login
` d. Form profil pelanggan
Keterangan: Nama Form
: C04 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol ubah profil menuju ke form C05
Klik tombol ubah password menuju ke form C06
C04 Image1
Alamat
Copyright Black Orange
Keranjang Pesanan Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Galeri1 Keluar
Pelanggan Profil Pengguna
Ubah Password Ubah Profil
Teks
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.28. Form profil pelanggan
` e. Form ubah profil pelanggan
Keterangan: Nama Form
: C05 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol simpan profil menuju ke form C04
C05 Image1
Alamat
Copyright Black Orange
Keranjang Pesanan Profil
Tanya Jawab Cara Pesan
Kontak Beranda
X Keluar
Pelanggan Profil Pengguna
Simpan Nama Lengkap
Alamat Kota
No. Tlp No .HP
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.29. Form ubah profil pelanggan
` f. Form ubah password
Keterangan: Nama Form
: C06 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol simpan profil menuju ke form C04
C06 Image1
Alamat
Copyright Black Orange
Keranjang Pesanan Profil
Tanya Jawab Cara Pesan
Kontak Beranda
X Keluar
Pelanggan Profil Pengguna
Simpan Password Lama
Password Baru Validasi Password Baru
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 3.30. Form ubah password
` g. Form Profil Distro Black Orange
Keterangan: Nama Form
: C07 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
C07 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Alamat Distro Profil Distro
Pelanggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.31. Form profil Distro Black Orange
` h. Form Cara Pesan
Keterangan: Nama Form
: C08 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
C08 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Teks Cara Pesan
Pelanggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.32. Form cara pesan
` i. Form Tanya Jawab
Keterangan: Nama Form
: C09 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
C09 Image1
Alamat
Copyright Black Orange
Profil Tanya Jawab
Cara Pesan Kontak
Beranda
Teks Tanya Jawab
Keluar pelanngan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.33. Form Tanya Jawab
` j. Form Kontak
Keterangan: Nama Form
: C10 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol simpan profil menuju ke form C04
C10 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Teks Kontak
pelangggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.34. Form kontak
` k. Form Keranjang Kosong
Keterangan: Nama Form
: C11 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik gambar kembali menuju ke form C03
C11 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Keranjang
Pelanngan
Kembali
Gambar1 Keranjang
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.35. Form keranjang kosong
` l. Form view barang
Keterangan: Nama Form
: C12 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
C12 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos Galeri1
Galeri4 Galeri3
Galeri2 Galeri5
Galeri8 Galeri7
Galeri6 Galeri9
Galeri12 Galeri11
Galeri10 Galeri13
Galeri16 Galeri15
Galeri14
Pelanggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.36. Form view barang
` m. Form barang
Keterangan: Nama Form
: C13 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik gambar keranjang belanja menuju ke form C014
C13 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Kaos
Gambar Gambar
Keranjang Belanja
Teks Harga dan Data Barang
Warna Ukuran
V V
Step 1 Step 2
Pelanggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.37. Form barang
` n. Form keranjang belanja
Keterangan: Nama Form
: C14 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik gambar kembali menuju ke form C03
Klik gambar bayar menuju ke form C15
C14 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Pelanggan
Selamat datang Kerajang Belanja
Gambar Keranjang
Belanja
Gambar Bayar
Id Gambar
Warna Ukuran
Harga Jumlah Diskon Total Harga
Proses
Gambar Batal
Gambar produk
Update
Gambar kembali ke
katalog
Sub Total
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.38. Form keranjang belanja
` o. Form pengiriman
Keterangan: Nama Form
: C15 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol lanjutkan menuju ke form C16
Klik kembali menuju ke form C14
C15 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Form Tujuan
Lanjutkan V
Nama Penerima Alamat Penerima
Pelanggan
Selamat datang
Kota Penerima Keterangan
Kembali
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.39. Form pengiriman
` p. Form konfirmasi
Keterangan: Nama Form
: C16 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol checkout menuju ke form C17
Klik kembali menuju ke form C03
Klik paypal menuju ke website paypal
C16 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Pelanggan
Selamat datang Kerajang Belanja
Gambar checkout
Id Gambar Warna Ukuran
Harga Jumlah Berat Berat x Jumlah Diskon
Gambar produk
Gambar kembali ke
katalog
Sub Total
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar paypal
Total Harga
Total Bayar Total Berat Barang Dibulatkan
Ongkos Kirim Total Ongkos Kirim
Gambar 3.40. Form konfirmasi
` q. Form Terima kasih
Keterangan: Nama Form
: C17 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
C17 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Pelanggan
Selamat datang Terima Kasih
Gambar Terima Kasih
Teks Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Gambar 3.41. Form terima kasih
` r.
Form pesanan
Keterangan: Nama Form
: C18 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol bayar menuju ke form C19
C18 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Pelanggan
Selamat datang Daftar Pesanan
Id Tgl
Pesan Tgl
Akhir Bayar
Total Wajib Bayar Tgl
Dibayar Total
Sudah Dibayar
Tanggal Pengiriman
Barang Status
pesanan
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal Keranjang Pesanan
Bayar Bayar
Gambar 3.42 Form pesanan
` s. Form detail pesanan
Keterangan: Nama Form
: C19 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju keform C01
Klik daftar member menuju keform C02
Klik link barang menuju ke form C03
Klik link profil menuju keform C07
Klik link cara pesan keform C08
Klik link tanya jawab menuju ke form C08
Klik link kontak menuju ke form C09
Klik link keranjang menuju ke form C11
Klik link pesanan menuju ke form C18
Klik tombol pelanggan menuju ke form C04
Klik tombol keluar menuju ke form C01
Klik tombol bayar menuju ke form C18
C19 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Pelanggan
Selamat datang Rincian Pesanan
Gambar Warna Ukuran Jumlah Berat Jumlah
X Berat
Harga Barang Diskon
Harga Beli Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Gambar 1
Daftar Barang Yang Dipesan Id Pesanan
Status Pesanan Tanggal Pemesanan
Tanggal Akhir Bayar Nama Tujuan
Alamat Tujuan Kota Tujuan
Ongkos Kirim 1 Kg Total Wajib Bayar
Total Sudah Bayar Tanggal Dibayar
Tanggal Pengiriman Barang :
: :
: :
: :
: :
: :
:
Keranjang Pesanan Konfirmasi Pembayaran
Pembayaran Melalui V
Kode Transaksi Bayar
Gambar 3.43. Form detail pesanan
` 3. Antar muka Operator
a. Form login Operator
Keterangan: Nama Form
: F01 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik tombol masuk akan menuju form F02
F01 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Tanya Jawab
pelangggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Logo 1 Login Petugas Black Orange
Email Password
Masuk
Gambar 3.44. Form login Operator
` b. Form Beranda
Keterangan: Nama Form
: F02 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik tombol rincian menuju keform F15
Klik link keluar menuju ke form F01
F02
Copyright Black Orange
Keluar Kota Kirim
Barang Kategori
Pesanan Beranda
Petugas
Menu Operator
No Gambar
Kategori Harga Rp
Diskon Stok
Info Pengguna
Gambar1 Total Jangkauan Kota
Total Katagori Barang Total Jenis Barang
Total Stok Barang :
: :
: Pengaturan
Rincian
Id Tgl
Pesan Tgl
Akhir Bayar
Total Wajib Bayar
Tgl Dibayar
Total Sudah
Dibayar Tanggal
Pengiriman Barang
Lihat
Rincian Rincian
Nama Pengguna Email Pengguna
Ubah Nama Ubah Email
Ubah Password Gambar2
Gambar3
Gambar 3.45. Form beranda
` c. Form ubah nama
Keterangan: Nama Form
: F03 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F03
F03
Copyright Black Orange
Keluar Petugas
Profil pengguna Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Nama
Ganti Nama Simpan
X
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.46. Form ubah nama
` d.
Form ubah Email
Keterangan: Nama Form
: F04 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F03
F04
Copyright Black Orange
Keluar Petugas
Profil pengguna Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Email
Ganti Email Simpan
Password X
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.47. Form ubah nama
` e. Form ubah password
Keterangan: Nama Form
: F05 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F03
F05
Copyright Black Orange
Keluar Petugas
Profil pengguna Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Password Lama
Simpan Validasi Password Baru
X Password Baru
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.48. Form ubah password
` f. Form tambah kota
kirim
Keterangan: Nama Form
: F06 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F07
Klik tombol EDIT menuju keform F06
Klik tombol hapus menuju keform F07
F06
Copyright Black Orange
Keluar Petugas
Data Kota Kirim
No Nama Kota
Ongkos Kirim Rp Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Nama Kota
Simpan Ongkos Kirim
X Rp.
Reset
Edit Hapus
Edit Hapus
Edit Hapus
Kota Kirim Barang
Kategori Pesanan
Beranda
Total Data Total Halaman
Gambar 3.49. Form tambah kota kirim
` g. Form lihat kota
kirim
Keterangan: Nama Form
: F07 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol EDIT menuju keform F06
Klik tombol hapus menuju keform F07
Klik tombol tambah menuju keform F06
F07
Copyright Black Orange
Keluar Petugas
Data Kota Kirim
No Nama Kota
Ongkos Kirim Rp Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Hapus Edit
Hapus Edit
Hapus Tambah
Kota Kirim Barang
Kategori Pesanan
Beranda
Total Data Total Halaman
Gambar 3.50. Form lihat kota kirim
` h. Form tambah kategori
Keterangan: Nama Form
: F08 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol tambah menuju keform F08
Klik tombol EDIT menuju keform F09
F08
Copyright Black Orange
Keluar Petugas
Data Kategori Barang
No Nama
Kategori Barang
Keterangan Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Edit Edit
Tambah
Jenis Barang
Stok` Kota Kirim
Barang Kategori
Pesanan Beranda
Gambar 3.51 Form tambah kategori
` i. Form lihat kategori
Keterangan: Nama Form
: F09 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F08
Klik tombol EDIT menuju keform F09
Klik tombol reset menuju keform F09
F09
Copyright Black Orange
Keluar Petugas
Data Kategori Barang
No Nama
Kategori Barang
Keterangan Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Edit Edit
Jenis Barang
Stok`
Nama Kategori Barang Simpan
Keterangan X
Reset
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.52. Form lihat kategori
` j. Form jenis barang
Keterangan: Nama Form
: F10 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol tambah menuju keform F11
Klik tombol EDIT menuju keform F11
Klik tombol stok menuju keform F12
F10
Copyright Black Orange
Keluar Petugas
Data Barang
No Gambar Kategori
Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Edit Edit
Tambah
Diskon Stok`
gambar1
Harga Rp
Stok Stok
Stok gambar2
gambar3
Kota Kirim Barang
Kategori Pesanan
Beranda
Total Data Total Halaman
Gambar 3.53. Form jenis barang
` k. Form tambah jenis barang
Keterangan: Nama Form
: F11 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F10
Klik tombol reset menuju keform F11
Klik tombol EDIT menuju keform F11
Klik tombol stok menuju keform F12
F11
Copyright Black Orange
Keluar Petugas
Data Barang
`
No Gambar Kategori
Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
Edit Edit
Edit
Diskon Stok`
gambar1
Harga Rp
Stok Stok
Stok gambar2
gambar3 Nama Kategori Barang
Simpan Harga
X
Reset Gambar Utama
Diskon Keterangan
V Browse
Rp
Kota Kirim Barang
Kategori Pesanan
Beranda
Total Data Total Halaman
Gambar 3.54. Form tambah jenis barang
` l. Form barang
Keterangan: Nama Form
: F12 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol EDIT menuju keform F13
Klik tombol tambah menuju keform F13
F12
Copyright Black Orange
Keluar Petugas
Data Barang
No Warna
Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Tambah
Berat Kg Stok`
gambar1
Ukuran
Nama Kategori Barang Harga
Diskon Ketrangan
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.55. Form barang
` m. Form tambah barang
Keterangan: Nama Form
: F13 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol simpan menuju keform F12
Klik tombol reset menuju keform F13
Klik tombol EDIT menuju keform F13
F13
Copyright Black Orange
Keluar Petugas
Data Barang
No Warna
Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
Edit
Berat Kg Stok`
gambar1
Ukuran
Nama Kategori Barang Harga
Diskon Ketrangan
Warna
Simpan Berat
X
Reset Ukuran
Stok V
Kg
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.56. Form tambah barang
` n. Form lihat pesanan
Keterangan: Nama Form
: F14 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
Klik tombol rincian menuju keform F15
F14
Copyright Black Orange
Keluar Petugas
Daftar Transaksi
Id Tanggal
Pesan Taggal
Akhir Bayar
Lihat
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
Total Dibayar
Tanggal Pengiriman
Barang Total
Wajib Bayar
Total Sudah
Dibayar Status
Pesanan Kota Kirim
Barang Kategori
Pesanan Beranda
Total Data Total Halaman
Rincian Rincian
Rincian
Gambar 3.57. Form lihat pesanan
` o. Form detail pesanan
Keterangan: Nama Form
: F15 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form F02
Klik link ubah nama menuju ke form F03
Klik link ubah email menuju ke form F04
Klik link ubah password menuju ke form F05
Klik tambah kota kirirm menuju ke form F06
Klik link lihat kota kirim menuju keform F07
Klik link lihat kategori menuju ke form F09
Klik link jenis barang menuju keform F10
Klik link barang menuju ke form F112
Klik link lihat pesanan menuju keform F14
Klik link keluar menuju ke form F01
F15
Copyright Black Orange
Keluar Petugas
Rincian Pesan
Warna Harga
Beli
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
Berat Jumlah X Berat
gambar1
Ukuran
Id Pesanan Status Pesanan
Tanggal Pemesanan Tanggal Akhir Bayar
Gambar Diskon
Harga Barang
Nama Tujuan Alamat Tujuan
Kota Tujuan Ongkos Kirim 1Kg
Total Wajib Dibayar Total Sudah Dibayar
Tanggal Dibayar Tanggal Pengiriman Barang
Kota Kirim Barang
Kategori Pesanan
Beranda
Gambar 3.58 Form detail pesanan
` 4. Antar muka super administrator
a. Form login administrator
Keterangan: Nama Form
: S01 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik tombol masuk akan menuju form S02
S01 Image1
Alamat
Copyright Black Orange
Keluar Profil
Tanya Jawab Cara Pesan
Kontak Beranda
Tanya Jawab
pelangggan
Selamat datang
Katagori Produk
Rekening Cari Barang
Kategori Harga
Minimal
Cari V
Rp. Rp.
Maksimal
Logo 1 Login Petugas Black Orange
Email Password
Masuk
Gambar 3.59. Form login administrator
` b.
Form beranda administrator
Keterangan: Nama Form
: S02 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform S08
Klik link keluar menuju ke form S01
S02
Copyright Black Orange
Keluar Petugas
Pelanggan Beranda
Petugas
Menu Administrator
No Nama
Email Status
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
No Nama
Email Akses
Status
Petugas Terbaru
Pelanggan Terbaru
Gambar 3.60. Form beranda administrator
` c. Form ubah nama
Keterangan: Nama Form
: S03 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform S08
Klik link keluar menuju ke form S01
Klik link simpan menuju ke form S03
S03
Copyright Black Orange
Keluar Petugas
Profil pengguna Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Nama
Ganti Nama Simpan
X
Beranda Petugas
Pelanggan
Gambar 3.61. Form ubah nama
` d.
Form ubah email
Keterangan: Nama Form
: S04 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform S08
Klik link keluar menuju ke form S01
Klik link simpan menuju ke form S04
S04
Copyright Black Orange
Keluar Petugas
Profil pengguna Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Email
Ganti Email Simpan
Password X
Beranda Petugas
Pelanggan
Gambar 3.62. Form ubah email
` e. Form ubah password
Keterangan: Nama Form
: S05 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform S08
Klik link keluar menuju ke form S01
Klik link simpan menuju ke form S05
S05
Copyright Black Orange
Keluar Petugas
Profil pengguna Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Password Lama
Simpan Validasi Password Baru
X Password Baru
Beranda Petugas
Pelanggan
Gambar 3.63. Form ubah password
` f. Form tambah administrator
Keterangan: Nama Form
: S06 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform S08
Klik link keluar menuju ke form S01
Klik link simpan menuju ke form S07
Klik link reset menuju ke form S06
S06
Copyright Black Orange
Keluar Petugas
Data Petugas
`
No Nama
Email Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
Edit Edit
Edit
Status Akses
Nama
Simpan Password
X
Reset Email
Konfirmasi Password Akses
V
Beranda Petugas
Pelanggan
Status V
Gambar 3.64. Form tambah administrator
` g. Form lihat administrator
Keterangan: Nama Form
: S07 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform F08
Klik link keluar menuju ke form S01
S07
Copyright Black Orange
Keluar Petugas
Data Petugas `
No Nama
Email Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Edit Edit
Status Akses
Beranda Petugas
Pelanggan
Tambah
Gambar 3.65. Form lihat administrator
` h. Form pelanggan
Keterangan: Nama Form
: S08 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform F08
Klik link keluar menuju ke form S01
Klik tombol info menuju ke form S09
Klik tombol edit menuju ke form S10
S08
Copyright Black Orange
Keluar Petugas
Data Pelanggan `
No Nama
Email Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Edit Edit
Status Beranda
Petugas Pelanggan
Info Info
Info
Gambar 3.66. Form pelanggan
` i. Form info pelanggan
Keterangan: Nama Form
: S09 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform F08
Klik link keluar menuju ke form S01
Klik link info menuju ke form S09
Klik link edit menuju ke form S10
S09
Copyright Black Orange
Keluar Petugas
Data Pelanggan
` No
Nama Email
Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password
Edit Edit
Edit
Status Beranda
Petugas Pelanggan
Info Info
Info Nama
Email Alamat
Kota Telepon
HP Status
Gambar 3.67. Form pelanggan
` j.
Form ubah status pelanggan
Keterangan: Nama Form
: S10 Ukuran Layar
: Dinamis Default 1024 x 768 TypeUkuran font
: Arial 12 pt Warna Latar
: 1E7404
Klik link beranda menuju ke form S02
Klik link ubah nama menuju ke form S03
Klik link ubah email menuju ke form S04
Klik link ubah password menuju ke form S05
Klik link petugas menuju ke form S07
Klik link pelanggan menuju keform F08
Klik link keluar menuju ke form S01
Klik link simpan menuju ke form S08
Klik link info menuju ke form S09
Klik link edit menuju ke form S10
S10
Copyright Black Orange
Keluar Petugas
Data Pelanggan
` No
Nama Email
Aksi
Info Pengguna
Pengaturan Nama Pengguna
Email Pengguna
Ubah Nama Ubah Email
Ubah Password Edit
Edit Edit
Status Beranda
Petugas Pelanggan
Info Info
Info Nama
Status Simpan
V
Gambar 3.68. Form ubah status pelanggan
` 3.3.2
Perancangan pesan
M01
Username atau Password salah M02
Username masih kosong OK
M03 Password masih kosong
OK M04
Password baru masih kosong OK
M05 Konfirmasi password masih kosong
OK M06
Password salah
M07 Password baru minimal 6 karakter
OK M08
Valiadasi password minimal 6 karakter OK
Password baru harus sama dengan konfirmasi password
OK M09
M10 Nama masih kosong
OK M15
M16 M17
M14 M13
M12 M11
M18
M19 M20
M21 Berhasil disimpan
Berhasil diubah
Administrator sudah ada Data administrator belum ada
Nama kota masih kosong OK
Ongkos kirim masih kosong OK
Kota sudah ada Ya
Batal Yakin akan menghapus kota “nama kota”?
Nama kategori masih kosong OK
Kategori sudah ada Yakin akan menghapus kategori “nama kategori”?
√ √
Ya Batal
`
M22 Harga masih kosong
OK M23
Diskon masih kosong OK
M24 Berat masih kosong
OK M25
Gambar masih kosong OK
M26 Source code error
M27 Barang Sudah ada
M28 File minimal 2 MB
M29
File Hanya Tipe JPG, JPEG, BMP, PNG dan GIF. Yakin akan menghapus barang “id barang”?
Ya M30
M31 Warna masih kosong
OK M36
M37 M38
M35 M34
M33 M32
M39
M40 M41
M42 Stok masih kosong
OK Detail barang sudah ada
Stok Barang Harus Diatas 0 Nol Total pembayaran harus sama
dengan atau lebih dari total bayar Total bayar masih kosong
OK
Apakah benar pesanan dengan ID “no id” sedang dipersiapkan?
Ya Apakah benar pesanan dengan ID no id, telah
dikirim? Ya
Batal Nama lengkap masih kosong
OK
Email masih kosong OK
Password Baru masih kosong OK
Validasi Password masih kosong OK
Batal
Batal
`
M43 Email tidak valid
OK M44
Regitrasi Member Berhasil Silahkan Login .
M45 Email Sudah Ada
M46 Username Sudah Ada
M47 Terima Kasih ,
detail pesanan anda telah dikirimkan ke email”alamat email”
√
√
Gambar 3.69. Perancangan pesan
3.3.3 Jaringan semantik
a. Jaringan semantik interface pengunjung
T05 T06
T04 T03
T02 T01
M39,M40,M41,M42,M43,M44,M45,M46,M47 T07
T08
Gambar 3.70. Jaringan semantik pelanggan
` b. Jaringan semantik interface pelanggan
C01 C05
C06 C07
C08
C12 C09
C13 C14
C15 C16
C18
C17 C04
C02
C03 C19
M11,M12
M49 M03,M04,M05,M06,M07,M08,M09,M12
M12,M39,M40,M41,M42,M43,M44,M45 M11,M12
M39,M40,M41,M42,M43,M44,M45,M46,M47,M48
M11,M12
C10 C11
Gambar 3.71. Jaringan semantik pelanggan
` c.
Jaringan semantik interface operator
F01 F02
F05 F06
F07
F08
F09 F10
F11
F12 F14
F15 M01,M02,M03
M03,M04,M05,M06,M07,M08,M09 M11,M15,M16,M17
M12,M16,M18
M11,M19,M20
M12,M21
M12,M22,M23,M24,M26,M28,M29,M30 M11,M22,M23,M24,M25,M26,M27,M28,M29
M11,M12,M31,M32,M33,M34 M12,M35,M36,M37,M38
S03 S04
M10 M03,M40
F13 M24,M31,m32
Gambar 3.72. Jaringan semantik operator d. Jaringan semantik administrator
S01 S02
S07 S06
S05
M01,M02,M03 M039,M40,M41,M42
M03,M04,M05,M06,M07,M08,M09 S03
S04 M10
M03,M40
S08 S09
S10 M11,M12
M11,M12 M11,M12
Gambar 3.73. Jaringan semantik administrator
` 3.3.4
Struktur menu
a. Struktur menu pengunjung
profil kontak
katalog
view tambah
beranda
Daftar pelanggan
Gambar 3.74. Struktur menu pengunjung
b. Struktur menu pelanggan
profil kontak
Keranjang belanja history
Cara pemesanan katalog
keluar beranda
view tambah
ubah Ubah profil
Ubah password masuk
Gambar 3.75. Struktur menu pelanggan
` c. Struktur menu operator
Detail pesanan barang
kategori keluar
Menu
ubah beranda
view tambah
hapus Kota kirim
Ubah password pesanan
masuk
Ubah nama Ubah email
Gambar 3.76. Struktur menu operator d. Struktur menu administrator
menu
Tambah data administrator beranda
keluar Lihat data administrator
Ubah password
View ubah
Tambah masuk
Ubah nama Ubah email
Gambar 3.77. Struktur menu administrator
149
BAB IV IMPLEMENTASI DAN PENGUJIAN SISTEM
4.1 Implementasi sistem
Tahap implementasi merupakan tahap penciptaan perangkat lunak, tahap kelanjutan dari kegiatan perancangan sistem. Tahap ini merupakan tahap dimana
sistem siap untuk dioperasikan, yang terdiri dari penjelasan mengenai lingkungan implementasi, dan implementasi program.
4.1.1 Lingkungan Implementasi
Untuk mendukung aplikasi yang akan diterapkan pada lingkungan implementasi, maka dalam hal ini menggunakan perangkat keras dan perangkat
lunak yang menunjang dalam pembangunan aplikasi E-Commerce berbasis web di distro Black Orange.
4.1.1.1 Perangkat Keras Yang Digunakan
Spesifikasi perangkat keras yang digunakan dalam pembangunan aplikasi E- Commerce
berbasis web di distro Black Orange adalah tercantum pada tabel 4.1 sebagai berikut :
Tabel 4.1. Perangkat keras yang digunakan Perangkat
Spesifikasi Processor
Kecepatan 1.73 GHz RAM
1 GHz Harddisk
120 Gb Monitor
Resolusi 1280 x 800 VGA
128 Mb
4.1.1.2 Perangkat Lunak Yang Digunakan
Spesifikasi perangkat lunak yang digunakan dalam membangun aplikasi E- Commerce
berbasis web di distro Black Orange adalah sebagai berikut: Tabel 4.2. Perangkat Lunak yang digunakan
No Perangkat Lunak
Keterangan 1.
Sistem Operasi Windows XP SP III
2. Bahasa Pemrograman
PHP 3.
DBMS MySQL 4.1.14
4 Web browser
Mozilla firefox 3.0 5
Code editor Macromedia Dreamweaver 8
4. Image capture
SnagiT 5.
DFD modeler Microsoft Visio 2007
4.2 Implementasi database
Pembuatan database dilakukan dengan menggunakan aplikasi DBMS MySQL. Implementasi database dalam bahasa SQL adalah sebagai berikut:
1. Tabel petugas CREATE TABLE `blackorange_petugas`
`id_petugas` int11 NOT NULL `email` varchar100 NOT NULL,
`password` varchar50 NOT NULL, `nama_petugas` varchar50 NOT NULL,
`akses ` varchar15 NOT NULL,
`status` int1 NOT NULL, PRIMARY KEY `id_petugas`
ENGINE=InnoDB DEFAULT CHARSET=latin1; 2. Tabel jenis barang
CREATE TABLE `tb_jenisbarang` `id_jenis_barang` int11 NOT NULL,
`gambar_utama` text NOT NULL, `harga` double NOT NULL DEFAULT,
`diskon` double NOT NULL DEFAULT, `keterangan` text,
`id_kategori_barang` int11 NOT NULL, PRIMARY KEY `id_jenis_barang`,
KEY `FK_tb_jenisbarang_kategori` `kategori` ENGINE=InnoDB DEFAULT CHARSET=latin1;
3. Tabel pelanggan CREATE TABLE `
blackorange_pelanggan` id_pelanggan` int11 NOT NULL,
`email` varchar100 NOT NULL, `password` varchar50 NOT NULL,
`nama_pelanggan` varchar50 NOT NULL, `alamat` text NOT NULL,
`kota` varchar30 NOT NULL, `tlp` varchar15 DEFAULT NULL,
`hp` varchar15 DEFAULT NULL, `url_foto` text,
`status` int1 NOT NULL DEFAULT, PRIMARY KEY `id_pelanggan`
ENGINE=InnoDB DEFAULT CHARSET=latin1; 4. Tabel barang
CREATE TABLE ` blackorange_barang`
`id_barang` int11 NOT NULL, `warna` varchar15 NOT NULL,
`ukuran` varchar15 NOT NULL DEFAULT All Size, `berat` double NOT NULL DEFAULT,
`stok` int11 NOT NULL DEFAULT, `id_jenis_barang` int11 NOT NULL,
PRIMARY KEY `id_barang`, KEY FK_blackorange_barang_jenis_barang``id_jenis_barang`
ENGINE=InnoDB DEFAULT CHARSET=latin1; 5. Tabel kategori
barang CREATE TABLE `
blackorange_kategori_barang` `id_kategori_barang` int11 NOT NULL,
`nama_kategori_barang` varchar30 NOT NULL, `keterangan` text,
`id_petugas` int11 NOT NULL, PRIMARY KEY `id_kategori_barang`,
KEY `FK_blackorange_kategori_barang_petugas` `id_petugas` ENGINE=InnoDB DEFAULT CHARSET=latin1;
6. Tabel kota kirim
CREATE TABLE `blackorange_kota_kirim` `id_kota_kirim` int11 NOT NULL,
`nama_kota_kirim` varchar50 NOT NULL, `ongkos_kirim` double NOT NULL,
`id_petugas` int11 NOT NULL, PRIMARY KEY `id_kota_kirim`,
KEY `FK_blackorange_kota_kirim_petugas` `id_kota_kirim` ENGINE=InnoDB DEFAULT CHARSET=latin1;
7. Tabel pesanan CREATE TABLE `
blackorange _pesanan` `id_pesanan` int11 NOT NULL,
`id_pelanggan` int11 NOT NULL, `id_kota_kirim` int11 NOT NULL,
`tgl_pesan` date DEFAULT NULL, `tgl_akhir_bayar` date DEFAULT NULL,
`nama_kirim` varchar30 NOT NULL, `alamat_kirim` text NOT NULL,
`total_bayar` double NOT NULL, `status_pesanan` varchar15 NOT NULL,
`jumlah_bayar` double DEFAULT NULL,
`tgl_bayar` date DEFAULT NULL, `tgl_kirim` date DEFAULT NULL,
`Melalui` varchar15 DEFAULT NULL, `KodeTransaksi` varchar20 DEFAULT NULL,
PRIMARY KEY `id_pesanan`, KEY `FK_blackorange_pesanan_kota_kirim` `id_kota_kirim`,
KEY `FK_blackorange_pesanan_pelanggan` `id_pelanggan` ENGINE=InnoDB DEFAULT CHARSET=latin1;
8. Tabel detail pesanan CREATE TABLE ` blackorange _detailpesanan`
`id_pesanan` int11 NOT NULL, `id_barang` int11 NOT NULL,
`warna` varchar15 NOT NULL, `ukuran` varchar15 NOT NULL,
`jumlah` int11 NOT NULL, `harga_beli` double NOT NULL,
`diskon_beli` double NOT NULL, KEY `FK_blackorange_detail_pesanan_pesanan` `id_pesanan`,
EY `FK_blackorange_detail_pesanan_barang` `id_barang` ENGINE=InnoDB DEFAULT CHARSET=latin1;
9. Tabel komentar CREATE TABLE ` blackorange _
komentar` `id_komentar` int11 NOT NUL,
`id_pelanggan` int11 NOT NULL, `id_jenis_barang` int11 NOT NULL,
`tgl` date NOT NULL, `isi` text NOT NULL,
`tampilkan` int11 NOT NULL DEFAULT, PRIMARY KEY `id_komentar`,
KEY `FK_blackorange_komentar_pelanggan` `id_pelanggan` ENGINE=MyISAM DEFAULT CHARSET=latin1;
4.3 Implementasi antar muka
Implementasi antarmuka dilakukan dengan setiap tampilan program yang dibangun dan pengkodeannya dalam bentuk file program. Berikut ini adalah
implementasi antarmuka untuk pengguna. Adapun untuk tampilan implementasi aplikasi E-commerce berbasis Web di distro Black Orange akan dilampirkan pada
halaman lampiran. Tabel 4.3 Implementasi antar muka
Menu Deskripsi
Nama File
Login petugas Digunakan
sebagai halaman
login administrator dan operator bo-petugas.php
Login Pelanggan Digunakan
sebagai halaman
login Pelanggan menu.php
Ubah password Digunakan
jika useradmin,
operator, Pelanggan
ingin merubah password
setting.php Tambah administrator
Digunakan untuk menambah data administrator
user.php Lihat administrator
Untuk dapat masuk ke dalam menu utama
user.php Tambah kota kirim
Digunakan untuk menambah city.php
data kota kirim Lihat kota kirim
Digunakan untuk melihat dan mengubah data kota kirim
city.php Tambah kategori
barang Digunakan untuk menambah
data kategori barang category.php
Lihat kategori barang Digunakan untuk melihat dan
mengubah data kategori barang
category.php Tambah barang
Digunakan untuk menambah data barang
Commudity_type.ph p
Lihat barang Digunakan untuk melihat dan
mengubah data barang. Commudity_type.ph
p
Lihat Pesanan Digunakan untuk melihat data
pesanan, data detail_pesanan, dan mengubah status pesanan.
order.php Daftar Pelanggan
Digunakan untuk melakukan pendaftaran Pelanggan
Sign_up.php Ubah Profil
Digunakan untuk
mengubah profil Pelanggan
setting.php Beranda
Digunakan untuk melihat seluruh data barang yang ada
index.php Detail
Digunakan untuk melihat detail barang yang ada
commudity.php Profil
Digunakan untuk melihat data profil perusahaan
profile.php Kontak
Digunakan untuk menghubungi perusahaan
contact.php Cara Pesan
Digunakan untuk melihat Cara melakukan pemesanan
Why_of_order.php Keranjang Belanja
Digunakan untuk
melihat, merubah,
menghapus detail
pesanan yang akan dilakukan cart.php
Pesanan Digunakan
untuk melihat
pesanan transaksi yang pernah dilakukan
My_order.php
Logout Digunakan User Administrator,
operator, pelangganUntuk dapat keluar dari aplikasi
Logout.php
4.4 Pengujian Perangkat Lunak
Pengujian sistem merupakan hal terpenting yang bertujuan untuk menemukan kesalahan
– kesalahan atau kekurangan – kekurangan pada perangkat lunak yang diuji. Pengujian bermaksud untuk mengetahui perangkat lunak yang dibuat sudah
memenuhi kriteria yang sesuai dengan tujuan perancangan perangkat lunak tersebut.
Pengujian perangkat lunak ini menggunakan pengujian black box. Pengujian black box
berfokus pada persyaratan fungsional perangkat lunak.
4.5 Pengujian Alpa
Pengujian alpha dilakukan dengan menggunakan metode black box. Untuk pengujian alpha ini yaitu pada pengujian sebagai pengguna
4.5.1 Skenario Pengujian Alpa
Tabel 4.4. menjelaskan skenario pengujian aplikasi pelanggan. Tabel 4.4. Skenario pengujian aplikasi pelanggan
Kelas Uji Butir Uji
Jenis Pengujian
Daftar Pelanggan Menampilkan form pelanggan baru
Black Box Isi form pendaftaran
Black Box Simpan data baru
Black Box
Login Isi data login
Black Box Verifikasi username
Black Box Verifikasi password
Black Box Logout
Menghapus session pelanggan Black Box
Ubah profil Menampilkan form ubah profil
Black Box Ubah data pelanggan
Black Box Simpan perubahan
Black Box Ubah password
Menampilkan form ubah password Black Box
Verifikasi password lama Black Box
Verifikasi password baru Black Box
Verifikasi konfirmasi password Black Box
Menu Beranda Menampilkan data barang
Black Box Menampilkan data detail barang
Black Box Cari barang
Black Box
Menu profil Menampilkan profil perusahaan
Black Box Menu cara pesan
Menampilkan cara pemesanan Black Box
Menu Tanya jawab Menampilkan data Tanya jawab
Black Box Menu kontak
Menampilkan form kontak Black Box
Mengisi form kontak Black Box
Kirim pesan Black Box
Menu keranjang belanja
Menampilkan data detail pesanan Black Box
Mengubah data detail pesanan Black Box
Menghapus data detail pesanan Black Box
Menu pesanan Menampilkan data pesanan yang
pernah dilakukan Black Box
Menampilkan data detail tiap pesanan
Black Box
Tabel 4.5. menjelaskan skenario pengujian aplikasi administrator. Tabel 4.5. Skenario pengujian aplikasi administrator
Kelas Uji Butir Uji
Jenis Pengujian
Login Isi data login
Verifikasi username Black Box
Verifikasi password
Black Box
Logout Menghapus session user
Black Box Ubah password
Menampilkan form ubah password Black Box
Verifikasi password lama Black Box
Verifikasi password baru Black Box
Verfikasi konfirmasi password Black Box
Tambah petugas Tambah data petugas
Black Box Lihat petugas
Tampilkan data petugas Black Box
Ubah status petugas Black Box
Lihat pelanggan Tampilkan data petugas
Black Box Ubah status petugas
Black Box
Tabel 4.6. menjelaskan skenario pengujian aplikasi operator. Tabel 4.6. Skenario pengujian aplikasi operator
Kelas Uji Butir Uji
Jenis Pengujian
Login Isi data login
Verifikasi username Black Box
Verivikasi password
Black Box
Logout Menghapus session user
Black Box Ubah password
Menampilkan form
ubah password
Verifikasi password lama Black Box
Verifikasi password baru Black Box
Verfikasi konfirmasi
password Black Box
Tambah kota kirim Tambah data kota kirim
Black Box Lihat kota kirim
Tampilkan data kota kirim Black Box
Ubah data kota kirim Black Box
Hapus data kota kirim Black Box
Tambah kategori barang Tamabah data kategori
Black Box Lihat kategori barang
Tampilkan data kategori Black Box
Ubah data kategori Black Box
Hapus data kategori Black Box
Tambah barang Tambah data barang
Black Box Lihat barang
Tampilkan data barang Black Box
Ubah data barang Black Box
Tampilkan data detail barang Black Box
Tambah data detail barang Black Box
Ubah data detail barang Black Box
Hapus data detail barang Black Box
Lihat pesanan Tampilkan data pesanan
Black Box Ubah data pesanan
Black Box Hapus data pesanan
Black Box Tampilkan
data detail
pesanan Black Box
Ubah data detail pesanan Black Box
4.5.2 Kasus dan Hasil Pengujian
4.5.2.1 Pengujian Daftar Pelanggan
Berikut dapat dilihat pengujian dari daftar pelanggan pada tabel 4.7 dibawah ini:
Tabel 4.7. Pengujian Daftar Pelanggan Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan Pengamatan
Kesimpulan Menu
daftar pelanggan
Tampil form
daftar pelanggan Dapat
menampilkan form daftar pelanggan
[X] Diterima [ ] Ditolak
Masukan data
pelanggan, contoh masukan :
Nama Lengkap:
Pradikta Eka P R Username
email: diktayahoo.com
Password
Baru: 123456
Validasi password: 123456
Kode
Gambar: D19TA
Input yang
tercantum pada masing
– masing field
Dapat mengisi masing – masing field
[X] Diterima [ ] Ditolak
Tombol Daftar daftar pelanggan
berhasil daftar
pelanggan berhasil
[X] Diterima [ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Memasukan
semua data
kosong Ketika
klik tombol
Daftar maka tampilkan
pesan kesalahan Dapat
menampilkan pesan
“Nama Lengkap masih kosong, Email
masih kosong,
Password masih
kosong, validasi
password masih
kosong” [X] Diterima
[ ] Ditolak
Memasukkan data salah satu tidak di
isi Ketika
klik tombol
Daftar maka tampilkan
pesan kesalahan Dapat
menampilkan pesan
“Email masih kosong,
Password masih kosong, validasi
password masih
kosong” [X] Diterima
[ ] Ditolak
4.5.2.2 Pengujian Login
Berikut dapat dilihat pengujian login pada tabel 4.8 dibawah ini: Tabel 4.8 Pengujian login
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan username
: dibie_putrayah
oo.co.id Tercantum pada text
box username Dapat
mengisi field
username dengan benar
[X] Diterima [ ] Ditolak
Password :
123456 Tercantum pada text
box password Dapat
mengisi field
password dengan benar
[X] Diterima [ ] Ditolak
Tombol Masuk Data username dan
data password dicari Tombol
login dapat berfungsi
[X] Diterima [ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data
username atau
password tidak terdaftar
Tidak dapat
loginmasuk Muncul
pesan “Username atau
password salah
” [X] Diterima
[ ] Ditolak
4.5.2.3 Pengujian Logout
Berikut dapat dilihat pengujian dari logout pada tabel 4.9. dibawah ini: Tabel 4.9. Pengujian logout
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Tombol Keluar
Dapat keluar dan menghapus session
pengguna User
keluar dari aplikasi
[X] Diterima [ ] Ditolak
4.5.2.4 Pengujian Ubah profil pelanggan
Berikut dapat dilihat pengujian dari ubah profil pada tabel 4.10. dibawah ini: Tabel 4.10. Pengujian ubah profil
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Ubah profil
Menampilkan form
ubah profil Dapat menampilkan
form ubah profil
[X] Diterima [ ] Ditolak
Data profil yang akan diubah
Tercantum pada text
box data
yang akan diubah Dapat mengisi field
data yang
akan diubah dengan benar
[X] Diterima [ ] Ditolak
Tombol Simpan Data
berhasil diubah
di database
Tampil pesan “Data berhasil
diubah” [X] Diterima
[ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data
nama kosong
Ketika klik
tombol Simpan
maka tampilkan pesan kesalahan
Dapat menampilkan pesan Nama masih
kosong [X] Diterima
[ ] Ditolak
4.5.2.5 Pengujian ubah password
Berikut dapat dilihat pengujian dari ubah password pada tabel 4.11. dibawah ini:
Tabel 4.11. Pengujian ubah password Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Ubah password Menampilkan form
ubah password Dapat menampilkan
form ubah
password [X] Diterima
[ ] Ditolak
Data password
lama Tercantum
Data password
lama pada text box data
yang akan diubah Dapat mengisi field
data yang
akan diubah
dengan benar
[X] Diterima [ ] Ditolak
Data password baru Tercantum Data
password baru
pada text box data yang akan diubah
Dapat mengisi field data
yang akan
diubah dengan
benar [X] Diterima
[ ] Ditolak
Data validasi
password baru
Tercantum Data
validasi password
baru pada text box data yang akan
diubah Dapat mengisi field
data yang
akan diubah
dengan benar
[X] Diterima [ ] Ditolak
Tombol Simpan Data
berhasil diubah di database
Tampil pesan “Data berhasil diubah”
[X] Diterima [ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data
password lama,
password baru dan validasi
password masih
kosong Ketika klik tombol
Simpan maka
tampilkan pesan
kesalahan Dapat menampilkan
pesan Password
Lama masih
kosong, Password Baru masih kosong,
Validasi Password Baru masih kosong
[X] Diterima [ ] Ditolak
Field password Ketika klik tombol Dapat menampilkan [X] Diterima
baru dan validasi password kosong
Simpan maka
tampilkan pesan
kesalahan pesan
Password Baru
masih kosong
Validasi Password Baru
masih kosong
[ ] Ditolak
Password baru dan
validasi password baru tidak sama
Ketika klik tombol Simpan
maka tampilkan
pesan kesalahan
Dapat menampilkan pesan
kesalahan dengan
menampilkan pesan ”Password
baru harus sama dengan
validasi password baru
” [X] Diterima
[ ] Ditolak
4.5.2.6 Pengujian menu profil tokoperusahaan
Berikut dapat dilihat pengujian dari menu profil pada tabel 4.12. dibawah ini: Tabel 4.12. Pengujian menu profil
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Profil
Menampilkan menu profil
Tampil menampilkan
menu profil [X] Diterima
[ ] Ditolak
4.5.2.7 Pengujian menu kontak
Berikut dapat dilihat pengujian dari menu kontak pada tabel 4.13 dibawah ini: Tabel 4.13. Pengujian menu kontak
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan Kesimpulan
Kontak Menampilkan
menu kontak Dapat
menampilkan menu kontak
[X] Diterima [ ] Ditolak
4.5.2.8 Pengujian menu cara pesan
Berikut dapat dilihat pengujian dari menu cara pemesanan pada tabel 4.14. dibawah ini:
Tabel 4.14. Pengujian menu cara pesan Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Cara Pesan Menampilkan
menu cara pesan Dapat
menampilkan form cara pesan
[X] Diterima [ ] Ditolak
4.5.2.9 Pengujian menu keranjang belanja
Berikut dapat dilihat pengujian dari menu keranjang belanja pada tabel 4.15. dibawah ini:
Tabel 4.15. Pengujian meu keranjang belanja Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Menu keranjang
belanja Menampilkan
menu keranjang
belanja Dapat
menampilkan form
keranjang belanja
[X] Diterima [ ] Ditolak
Data jumlah Tercantum
pada text box data yang
akan diubah Dapat
mengisi data
jumlah dengan benar
[X] Diterima [ ] Ditolak
Tombol update Data jumlah yang
diubah tersimpan di database
Dapat menampilkan
perubahan data jumlah
[X] Diterima [ ] Ditolak
Tombol bayar Menampilkan form
bayar Dapat
menampilkan form bayar
[X] Diterima [ ] Ditolak
Tombol kembali ke beranda
Menampilkan beranda
Dapat menampilkan
beranda [X] Diterima
[ ] Ditolak
4.5.2.10 Pengujian form pengiriman
Berikut dapat dilihat pengujian dari form pembayaran pada tabel 4.16. dibawah ini:
Tabel 4.16. Pengujian menu pengiriman Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Data pengiriman
apabila ingin
mengubah data yang Tercantum
pada text box data yang
akan diubah Dapat mengisi
data dengan
benar [X] Diterima
[ ] Ditolak
telah ada Tombol lanjutkan
Tampilkan menu
konfirmasi Dapat
menampilkan menu
konfirmasi [X] Diterima
[ ] Ditolak
Tombol kembali ke katalog
Tampilkan keranjang belanja
Dapat menampilkan
keranjang belanja
[X] Diterima [ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data
pengiriman masih kosong
Ketika klik tombol Lanjutkan
maka tampilkan
pesan kesalahan
Dapat menampilkan
pesan Alamat masih kosong
Kota
masih kosong
[X] Diterima [ ] Ditolak
Data pengiriman
“Kota” masih kosong Ketika klik tombol
Lanjutkan maka
tampilkan pesan
kesalahan Dapat
menampilkan pesan
Kota masih kosong
[X] Diterima [ ] Ditolak
4.5.2.11 Pengujian menu konfirmasi total bayar
Berikut dapat dilihat pengujian dari form konfirmasi pada tabel 4.17 dibawah ini:
Tabel 4.17 Pengujian menu konfirmasi total bayar
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan konfirmasi total bayar
Menampilkan menucara
pembayaran Dapat
menampilkan konfirmasi
total bayar [X] Diterima
[ ] Ditolak
Tombol checkout Data pesanan dan
detail pesanan
tersimpan di
database ,
Menampilkan ucapan
terima kasih dan rincian
belanja dikirim
lewat email Dapat
menyimpan data pesanan,
dapat menampilkan
form
terima kasih
[X] Diterima [ ] Ditolak
Tombol Paypal Menampilkan
website paypal Dapat
membayar lewat paypal
[X] Diterima [ ] Ditolak
4.5.2.12 Pengujian tanya jawab
Berikut dapat dilihat pengujian dari cara pembayaran pada tabel 4.18. dibawah ini:
Tabel 4.18. Pengujian tanya jawab Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Tanya jawab Menampilkan
tanya jawab Dapat
menampilkan form
tanya jawab
[X] Diterima [ ] Ditolak
4.5.2.13 Pengujian menu pesanan
Berikut dapat dilihat pengujian dari pesanan pada tabel 4.19. dibawah ini: Tabel 4.19. Pengujian menu pesanan
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Menu pesanan
Menampilkan daftar pesanan
Dapat menampilkan
daftar pesanan [X] Diterima
[ ] Ditolak
Detail Klik status pesanan
maka akan muncul detail pesanan
Dapat menampilkan
detail pesanan [X] Diterima
[ ] Ditolak
4.5.2.14 Pengujian Tambah petugas
Berikut dapat dilihat pengujian dari tambah petugas pada tabel 4.20. dibawah ini:
Tabel 4.20. Pengujian tambah petugas Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan Pengamatan
Kesimpulan Tambah petugas
Menampilkan form
tambah petugas
Dapat menampilkan
form petugas
[X] Diterima [ ] Ditolak
Mengisi tambah
petugas. Contoh:
Nama: Pradikta Eka P Email : diktayahoo.com
Password: dikta Konfirmasi password: dikta
Status : aktif
Tercantum pada masing
– masing field
Dapat mengisi
masing – masing
field [X] Diterima
[ ] Ditolak
Tombol simpan Data
petugas akan tersimpan
Data petugas
berhasil [X] Diterima
[ ] Ditolak
didalam database
disimpan Kasus dan Hasil Uji salah Data Salah
Data petugas masih kosong
Ketika klik
tombol Simpan maka tampilkan
pesan kesalahan Dapat
menampilkan pesan
Nama masih kosong
Email masih
kosong Password
masih kosong Konfirmasi
Password masih kosong
[X] Diterima [ ] Ditolak
4.5.2.15 Pengujian lihat petugas
Berikut dapat dilihat pengujian dari lihat petugas pada tabel 4.21. dibawah ini: Tabel 4.21. Pengujian lihat petugas
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Lihat petugas
Menampilkan lihat petugas
Dapat menampilkan lihat
operator [X] Diterima
[ ] Ditolak
Data petugas yang akan diubah
Tercantum pada
text box data yang akan diubah
Dapat mengisi
field data yang
akan diubah
dengan benar [X] Diterima
[ ] Ditolak
Tombol Edit Data diubah di
database Dapat
mengisi field
data yang akan
diubah dengan benar
[X] Diterima [ ] Ditolak
Tombol Simpan Data
berhasil diubah di database
Tampil pesan
“Data berhasil
diubah” [X] Diterima
[ ] Ditolak
4.5.2.16 Pengujian tambah kota kirim
Berikut dapat dilihat pengujian dari tambah kota kirim pada tabel 4.22. dibawah ini:
Tabel 4.22. Pengujian tambah kota kirim Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Tambah kota kirim Menampilkan form
tambah kota kirim Dapat
menampilkan form
tambah kota kirim
[X] Diterima [ ] Ditolak
Mengisi data kota kirim Contoh:
Nama kota: Bandung Ongkos kirim: 10000
Tercantum pada
masing – masing
field Dapat mengisi
masing –
masing field [X] Diterima
[ ] Ditolak
Tombol simpan Data
kota akan
tersimpan didalam database
Tampil pesan “Data berhasil
diubah” [X] Diterima
[ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data kota masih kosong Ketika klik tombol
Simpan maka
tampilkan pesan
kesalahan Nama Kota
masih kosong Ongkos
Kirim masih kosong
[X] Diterima [ ] Ditolak
4.5.2.17 Pengujian lihat kota kirim
Berikut dapat dilihat pengujian dari lihat kota kirim pada tabel 4.23. dibawah ini:
Tabel 4.23. Pengujian lihat kota kirim Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Lihat kota kirim Menampilkan form
lihat kota kirim Dapat
menampilkan form lihat kota kirim
[X] Diterima [ ] Ditolak
Tombol hapus Data akan dihapus
dari database Tampil
pesan “berhasil dihapus”
[X] Diterima [ ] Ditolak
Tombol Edit Menampilkan form
edit kota kirim Dapat
menampilkan form kota kirim
[X] Diterima [ ] Ditolak
Data kota kirim yang akan diubah
Tercantum pada
text box data yang akan diubah
Dapat mengisi
field data yang
akan diubah
dengan benar [X] Diterima
[ ] Ditolak
Tombol simpan Data
berhasil diubah di database
Tampil pesan
“berhasil diubah” [X] Diterima
[ ] Ditolak Kasus dan Hasil Uji salah Data Salah
Data kota kirim Ketika klik tombol Dapat [X] Diterima
kosong Simpan
maka tampilkan
pesan kesalahan
menampilkan pesan
Ongkos Kirim
masih kosong
[ ] Ditolak
4.5.2.18 Pengujian tambah kategori barang
Berikut dapat dilihat pengujian dari tambah kategori barang pada tabel 4.24. dibawah ini:
Tabel 4.24. Pengujian tambah kategori barang Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Tambah kategori
barang Menampilkan
form tambah
kategori barang Dapat
menampilkan form
tambah kategori barang
[X] Diterima [ ] Ditolak
Mengisi data kategori barang
Contoh:
Nama kategori: Baju Keterangn: Semua jenis baju
Tercantum pada masing
– masing field
Dapat mengisi
masing – masing
field [X] Diterima
[ ] Ditolak
Tombol simpan Data
kategori barang
akan tersimpan
didalam database Data
katagori barang
akan tersimpan
didalam database [X] Diterima
[ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data kategori barang
masih kosong Ketika
klik tombol
Simpan maka tampilkan
pesan kesalahan Nama Kategori
Barang masih
kosong [X] Diterima
[ ] Ditolak
4.5.2.19 Pengujian lihat kategori barang
Berikut dapat dilihat pengujian dari lihat kategori barang pada tabel 4.25. dibawah ini:
Tabel 4.25. Pengujian lihat kategori barang Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Lihat kategori barang Menampilkan
lihat kategori
barang Dapat
menampilkan lihat
kategori barang
[X] Diterima [ ] Ditolak
Tombol hapus Data
akan Data telah [X] Diterima
dihapus dari
database dihapus
dari database
[ ] Ditolak Tombol Edit
Menampilkan form
ubah kategori barang
Dapat menampilkan
form ubah
kategori barang [X] Diterima
[ ] Ditolak
Data kategori barang yang akan diubah
Tercantum pada text
box data
yang akan diubah Dapat
mengisi field
data yang akan
diubah dengan benar
[X] Diterima [ ] Ditolak
Tombol simpan Data
berhasil diubah
didatabase Tampil
pesan “Data berhasil
diubah” [X] Diterima
[ ] Ditolak
4.5.2.20 Pengujian tambah barang
Berikut dapat dilihat pengujian dari tambah barang pada tabel 4.26. dibawah ini:
Tabel 4.26. Pengujian tambah barang Kasus dan Hasil Uji Benar Data Benar
Data Masukan Yang diharapkan
Pengamatan Kesimpulan
Tambah jenis barang Menampilkan
form tambah jenis barang
Dapat menampilkan form
tambah jenis barang
[X] Diterima [ ] Ditolak
Mengisi data barang Contoh:
kategori: Baju harga: 35000
diskon: 15 gambar:
C:\apache2triad\htdocs\FnS2\i mages\barang\c.jpg
keterangan: baju kaos
Tercantum pada masing
– masing field
Dapat mengisi
masing – masing
field [X] Diterima
[ ] Ditolak
Tombol simpan Data barang akan
tersimpan didalam database
Data barang akan tersimpan didalam
database [X] Diterima
[ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data barang masih
kosong Ketika
klik tombol
Simpan maka tampilkan
pesan kesalahan Dapat menampilkan
pesan Nama
Kategori Barang
masih kosong Gambar
Utama masih kosong
Harga masih
kosong [X] Diterima
[ ] Ditolak
4.5.2.21 Pengujian lihat barang
Berikut dapat dilihat pengujian dari lihat barang pada tabel 4.27. dibawah ini: Tabel 4.27. Pengujian lihat barang
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Lihat barang
Menampilkan form lihat barang
Dapat menampilkan form
lihat barang [X] Diterima
[ ] Ditolak
Tombol hapus Data akan dihapus
dari database Tampil
pesan “Data
berhasil di
hapus” [X] Diterima
[ ] Ditolak
Tombol edit Menampilkan form
ubah barang Dapat
menampilkan form ubah barang
[X] Diterima [ ] Ditolak
Data barang yang akan diubah
Tercantum pada
text box data yang akan diubah
Dapat mengisi
field data yang
akan diubah
dengan benar [X] Diterima
[ ] Ditolak
Tombol simpan Data
berhasil simpan di database
Tampil pesan
“Data berhasil
diubah ”
[X] Diterima [ ] Ditolak
Tombol Stok Menampilkan form
Stok barang Dapat
menampilkan form Stok barang
[X] Diterima [ ] Ditolak
Mengisi stok barang Contoh:
warna: Hitam ukuran: All size
stok: 12
Tercantum pada
masing – masing
field Dapat
mengisi masing
– masing field
[X] Diterima [ ] Ditolak
Tombol simpan Data barang akan
tersimpan didalam database
Tampil pesan
“Data berhasil
di simpan”
[X] Diterima [ ] Ditolak
Tombol edit Menampilkan form
edit barang Dapat
menampilkan form edit detail barang
[X] Diterima [ ] Ditolak
Data detail barang yang akan diubah
Tercantum pada
text box data yang akan diubah
Dapat mengisi
field data yang
akan diubah
dengan benar [X] Diterima
[ ] Ditolak
Tombol simpan Data
berhasil disimpan
didatabase Tampil
pesan “Data
berhasil disimpan
” [X] Diterima
[ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data
stok barang
kosong Ketika klik tombol
Simpan maka
Dapat menampilkan
[X] Diterima [ ] Ditolak
tampilkan pesan
kesalahan pesan
Warna masih kosong
Berat masih
kosong Stok
masih kosong
4.5.2.22 Pengujian lihat pesanan
Berikut dapat dilihat pengujian dari lihat pesanan pada tabel 4.28. dibawah ini: Tabel 4.28. Pengujian lihat pesanan
Kasus dan Hasil Uji Benar Data Benar Data Masukan
Yang diharapkan Pengamatan
Kesimpulan Lihat daftar semua
transaksi Menampilkan
semua transaksi
Dapat menampilkan
semua transaksi [X] Diterima
[ ] Ditolak
Lihat daftar
dipesan Menampilkan
daftar dipesan
Dapat menampilkan
daftar dipesan [X] Diterima
[ ] Ditolak
Lihat daftar
menunggu konfirmasi
Menampilkan daftar
menunggu konfirmasi Dapat
menampilkan daftar menunggu
konfirmasi [X] Diterima
[ ] Ditolak
Lihat daftar
dibayar Menampilkan
daftar dibayar
Dapat menampilkan
daftar dibayar [X] Diterima
[ ] Ditolak
Lihat daftar
dikirim Menampilkan
daftar dikirim
Dapat menampilkan
daftar dikirim [X] Diterima
[ ] Ditolak
Lihat daftar
diterima Menampilkan
daftar diterima
Dapat menampilkan
daftar diterima [X] Diterima
[ ] Ditolak
Lihat daftar habis waktu
Menampilkan daftar
habis waktu Dapat
menampilkan daftar habis waktu
[X] Diterima [ ] Ditolak
Tombol rincian Menampilkan
rincian pesanan
Dapat menampilkan
rincian pesanan [X] Diterima
[ ] Ditolak
Kasus dan Hasil Uji salah Data Salah Data
transaksi pembayaran
kosong Ketika
klik tombol
Bayar maka tampilkan pesan kesalahan
Dapat menampilkan
pesan Silahkan
lengkapi Form
terlebih dahulu [X] Diterima
[ ] Ditolak
Data pengiriman
barang kosong Ketika
klik tombol
Kirim maka tampilkan pesan kesalahan
Dapat menampilkan
pesan Silahkan
lengkapi Form
terlebih dahulu [X] Diterima
[ ] Ditolak
4.5.3 Kesimpulan Pengujian Alpha
Berdasarkan hasi pengujian alpha fungsional dengan kasus uji diatas dapat ditarik kesimpulan bahwa pembangunan aplikasi E-Commerce berbasis web di
distro Black Orange bebas kesalahan penulisan dan secara fungsional mengeluarkan hasil yang sesuai dengan yang diharapkan.
4.6 Pengujian Beta
4.6.1 Skenario Pengujian Beta
Pengujian beta ini dilakukan dengan cara melakukan pengujian langsung di tempat penelitian. Penelitian ini dilakukan di dua lingkungan :
1. Lingkungan petugas distro Black Orange Penelitian di lingkungan petugas distro Black Orange dilakukan supaya dapat
mengetahui sejauh mana sistem yang dibangun dapat menjadi alternatif penyelesaian permasalahan yang telah dijelaskan di awal.
2. Lingkungan Masyarakat Umum Penelitian di lingkungan pada masyarakat umum khususnya yang sudah
terbiasa dengan teknologi internet, dilakukan supaya dapat mengetahui sejauh mana sistem yang dibangun dapat memberikan kemudahan masyarakat umum
untuk melakukan transaksi pembelian barang.
Adapun beberapa poin yang diteliti adalah : a. Tampilan antar muka yang user friendly
b. Website dapat memenuhi kebutuhan informasi pelanggan. c. Memudahkan pelanggan dalam melakukan transaksi pembelian barang
d. Pendokumentasikan data pelanggan dan data transaksi penjualan akan
lebih teratur bagi distro Black Orange e.
Sistem pembayaran yang mudah digunakan. f.
Website menjadi sarana memperluas pangsa pasar distro Black Orange. g.
Kelayakan website untuk di-publish. Berdasarkan data hasil kusioner tersebut, dapat dicari prosentase masing-
masing jawaban dengan menggunakan rumus : Y = PQ 100 Keterangan :
P = Banyaknya jawaban responden tiap soal. Q = Jumlah responden
Y = Nilai prosentase Berikut ini adalah hasil prosentase masing-masing jawaban yang sudah
dihitung nilainya dengan menggunakan rumus diatas. Kuesioner ini diujikan kepada 2 orang Petugas Operator dan Admin.
1. Apakah anda setuju bahwa tampilan website cukup menarik dan mudah dipahami user friendly?
Tabel 4.29. Hasil pengujian kuesioner soal nomor 1 Operator, Admin
Pertanyaan No.
Keterangan Responden Prosentase
1 1
Sangat Setuju 2
Setuju 2
100 3
Cukup Setuju
4 Biasa Saja
5 Kurang Setuju
6 Tidak Setuju
7 Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 8 atau 80 menyatakan setuju, dan 2 atau 20 menyatakan cukup setuju bahwa
tampilan website cukup menarik dan mudah untuk dipahami. 2. Apakah anda setuju bahwa informasi barang yang diberikan oleh website ini
sesuai dengan informasi yang anda butuhkan? Tabel 4.30. Hasil pengujian kuesioner soal nomor 2 Operator, Admin
Pertanyaan No.
Keterangan Responden Prosentase
2 1
Sangat Setuju 1
50 2
Setuju 1
50 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 4 orang atau 40 menyatakan sangat setuju, 6 orang atau 60 menyatakan
setuju bahwa informasi yang diberikan sesuai dengan informasi yang dibutuhkan pelanggan.
3. Apakah anda setuju bahwa website ini akan lebih memudahkan pelanggan dalam melakukan transaksi pembelian barang?
Tabel 4.31. Hasil pengujian kuesioner soal nomor 3Operator, Admin
Pertanyaan No.
Keterangan Responden Prosentase
3 1
Sangat Setuju 2
100 2
Setuju 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 1 atau 10 menyatakan sangat setuju, 2 orang atau 20 menyatakan setuju
dan, 7 atau 70 menyatakan cukup setuju bahwa website ini akan lebih memudahkan pelanggan dalam melakukan transaksi pembelian barang.
4. Apakah anda setuju bahwa dengan adanya website ini pihak distro Black Orange akan lebih mudah mengelola data master dan data transaksi
penjualannya? Tabel 4.32. Hasil pengujian kuesioner soal nomor 4Operator, Admin
Pertanyaan No.
Keterangan Responden Prosentase
4 1
Sangat Setuju 1
50 2
Setuju 1
50 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 3 orang atau 30 menyatakan sangat setuju, 7 orang atau 70 menyatakan
setuju bahwa dengan adanya website ini pihak distro Black Orange akan lebih mudah mengelola data master dan data transaksi penjualannya.
5. Apakah anda setuju bahwa sistem pembayaran yang digunakan akan lebih memudahkan anda?
Tabel 4.33 Hasil pengujian kuesioner soal nomor 5Operator, Admin
Pertanyaan No.
Keterangan Responden
Prosentase
6 1
Sangat Setuju 1
50 2
Setuju 1
50 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 7 orang atau 70 menyatakan setuju dan, 1 orang atau 10 menyatakan cukup
setuju bahwa sistem pembayaran yang digunakan akan lebih memudahkan. 6. Apakah anda setuju dengan adanya website ini toko distro Black Orange dapat
memperluas pangsa pasarnya? Tabel 4.34 Hasil pengujian kuesioner soal nomor 6Operator, Admin
Pertanyaan No.
Keterangan Responden
Prosentase
6 1
Sangat Setuju 2
100 2
Setuju
3 Cukup Setuju
4 Biasa Saja
5 Kurang Setuju
6 Tidak Setuju
7 Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 8 orang atau 80 menyata kan setuju dan 2 orang atau 20 menyatakan setuju
bahwa website ini akan memperluas pangsa pasar distro Black Orange. 7. Apakah anda setuju bahwa website ini telah layak untuk di-online-kan?
Tabel 4.35 Hasil pengujian kuesioner soal nomor 7Operator, Admin
Pertanyaan No.
Keterangan Responden
Prosentase
6 1
Sangat Setuju 2
Setuju 2
100 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 2
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 1 orang atau 60 menyatakan setuju dan 1 orang atau 40 menyatakan sanagt
setuju bahwa website ini sudah layak untuk di-online-kan. Kuesioner ini diujikan kepada 8 orang yaitu Pelanggan dan Pengunjung.
1. Apakah anda setuju bahwa tampilan website cukup menarik dan mudah dipahami user friendly?
Tabel 4.36. Hasil pengujian kuesioner soal nomor 1 Pelanggan, Pengunjung
Pertanyaan No.
Keterangan Responden Prosentase
1 1
Sangat Setuju 2
20 2
Setuju 6
80 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 8
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 8 atau 80 menyatakan setuju, dan 2 atau 20 menyatakan cukup setuju bahwa
tampilan website cukup menarik dan mudah untuk dipahami. 2. Apakah anda setuju bahwa informasi barang yang diberikan oleh website ini
sesuai dengan informasi yang anda butuhkan? Tabel 4.37. Hasil pengujian kuesioner soal nomor 2 Pelanggan, Pengunjung
Pertanyaan No.
Keterangan Responden Prosentase
2 1
Sangat Setuju 5
70 2
Setuju 3
30 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 8
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 4 orang atau 40 menyatakan sangat setuju, 6 orang atau 60 menyatakan
setuju bahwa informasi yang diberikan sesuai dengan informasi yang dibutuhkan pelanggan.
3. Apakah anda setuju bahwa website ini akan lebih memudahkan pelanggan dalam melakukan transaksi pembelian barang?
Tabel 4.38. Hasil pengujian kuesioner soal nomor 3 Pelanggan, Pengunjung
Pertanyaan No.
Keterangan Responden Prosentase
3 1
Sangat Setuju 3
30 2
Setuju 5
70 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 8
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 1 atau 10 menyatakan sangat setuju, 2 orang atau 20 menyatakan setuju
dan, 7 atau 70 menyatakan cukup setuju bahwa website ini akan lebih memudahkan pelanggan dalam melakukan transaksi pembelian barang.
4. Apakah anda setuju bahwa sistem pembayaran yang digunakan akan lebih memudahkan anda?
Tabel 4.39 Hasil pengujian kuesioner soal nomor 4 Pelanggan, Pengunjung
Pertanyaan No.
Keterangan Responden
Prosentase
6 1
Sangat Setuju 1
10 2
Setuju 7
90 3
Cukup Setuju 4
Biasa Saja
5 Kurang Setuju
6 Tidak Setuju
7 Sangat Tidak Sekali
Jumlah 8
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 7 orang atau 70 menyatakan setuju dan, 1 orang atau 10 menyatakan cukup
setuju bahwa sistem pembayaran yang digunakan akan lebih memudahkan. 5. Apakah anda setuju dengan adanya website ini toko distro Black Orange dapat
memperluas pangsa pasarnya? Tabel 4.40 Hasil pengujian kuesioner soal nomor 5 Pelanggan, Pengunjung
Pertanyaan No.
Keterangan Responden
Prosentase
6 1
Sangat Setuju 2
20 2
Setuju 6
80 3
Cukup Setuju 4
Biasa Saja 5
Kurang Setuju 6
Tidak Setuju 7
Sangat Tidak Sekali
Jumlah 8
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 8 orang atau 80 menyata kan setuju dan 2 orang atau 20 menyatakan setuju
bahwa website ini akan memperluas pangsa pasar distro Black Orange. 6. Apakah anda setuju bahwa website ini telah layak untuk di-online-kan?
Tabel 4.41 Hasil pengujian kuesioner soal nomor 6 Pelanggan, Pengunjung
Pertanyaan No.
Keterangan Responden
Prosentase
6 1
Sangat Setuju 6
80
2 Setuju
2 20
3 Cukup Setuju
4 Biasa Saja
5 Kurang Setuju
6 Tidak Setuju
7 Sangat Tidak Sekali
Jumlah 8
100
Berdasarkan hasil prosentase diatas maka dapat disimpulkan sebanyak 6 orang atau 70 menyatakan setuju dan 2 orang atau 3 menyatakan sangat setuju
bahwa website ini sudah layak untuk di-online-kan
4.6.2 Kesimpulan Pengujian Beta
Berdasarkan pengujian beta diatas, bahwa dapat diambil kesimpulan bahwa: 1. Aplikasi E-Commerce berbasis web di distro Black Orange memudahkan
pelanggan dalam mendapatkan informasi barang yang tersedia. 2. Costumer dapat melakukan transaksi pembelian barang di distro Black
Orange dengan lebih mudah. 3. Proses pembayaran yang digunakan cukup mudah digunakan bagi para
pelanggan. 4. Aplikasi ini juga memudahkan pihak toko dalam mendokumentasikan
data master dan data transaksi penjualan barangnya. 5. Aplikasi ini juga dapat memperluas pangsa pasar bagi distro Black Orange
katena menjadi tidak terbatas secara geografis.
183
BAB V KESIMPULAN DAN SARAN
Pada bab ini akan diulas tentang kesimpulan yang berisi hasil-hasil yang diperoleh setelah dilakukan analisis, desain, dan implementasi dari perancangan
perangkat lunak yang dibangun dan telah dikembangkan serta saran-saran yang akan memberikan catatan penting dan kemungkinan perbaikan yang perlu
dilakukan untuk pembangunan perangkat lunak selanjutnya.
5.1 Kesimpulan
Adapun kesimpulan yang dihasilkan adalah sebagai berikut : 1. Dengan adanya website ini pelanggan menjadi mudah mendapatkan informasi
tentang barang maupun detailnya tanpa harus datang ke tokodistro. 2. Dengan adanya website ini fleksibilitas akan dapat tercapai karena setiap
pelanggan dapat melakukan transaksi dimanapun dia berada.. 3. Dengan adanya website ini pelanggan tetap distro Black Orange yang berada
diluar kota tetap dapat melakukan tansaksi tanpa harus datang ke Bandung. 4. Dengan website ini toko dapat memperluas pangsa pasarnya.
5. Dengan adanya website ini distro Black Orange dapat memperluas jaringan tanpa harus mengeluarkan modal yang besar.
6. Transaksi pembayaran yang digunakan lebih memudahkan pelanggan juga dapat meningkatkan keamanan bagi pelanggan karena tidak perlu membawa
uang cash untuk berbelanja.
5.2 Saran
Saran-saran terhadap penggunaan sistem yang telah dibuat adalah sebagai berikut :
1. Perlu adanya pengembangan perluasan wilayah penjualan sehingga lebih meningkatkan penjualan dengan cara bekerjasama dengan distributor di tiap
wilayah Indonesia. 2. Perlu adanya pengembangan pada desain tampilan agar lebih menarik.
3. Perlu adanya pengembangan penambahan kerjasama dengan sejumlah bank lain.
185
DAFTAR PUSTAKA
[1] Firdaus, 2007, 7 Jam Belajar Interaktif PHP dan MySQL dengan
Dreamweaver , Maxikom, Jakarta
[2] Heryandi, Andri, Web Dinamis Berbasis Database Menggunakan Script PHP dan Database Mysql,
Universitas Komputer Indonesia, Bandung. [3] HM, Jogiyanto, 1999, Analisis dan Desain Sistem Informasi : Pendekatan
Terstruktur Teori dan Praktek Aplikasi Bisnis, ANDI Yogyakarta,
Yogyakarta. [4] Kurniawan, Rulianto, 2007, 54 Trik Tersembunyi PHP, Maxikom, Palembang
[5] Prasetyo, Didik Dwi, 2005, Solusi Menjadi Web Master Melalui Manajemen Web dengan PHP
, PT Elex Media Komputindo, Jakarta.
RIWAYAT HIDUP
NIM : 10105269
Kelas : IF-5
Nama Lengkap : Pradikta Eka Putra Rinaldi
Tempat Tanggal Lahir : Makassar, 21 April 1987 Agama
: Islam Jenis Kelamin
: Laki-Laki Alamat
: jln. Batu Indah Raya No.15 Bandung No. Telp
: 0227563906
PENDIDIKAN
1993 – 1999
: SD Nilem Bandung 1999
– 2002 : SMP Negeri 34 Bandung
2002 – 2005
: SMU Pasundan 1 Bandung 2005
– 2010 : Program S1, Jurusan Teknik Informatika,
Fakultas Teknik dan Ilmu Komputer, Universitas Komputer Indonesia
– Bandung
Bandung, 2010
Pradikta Eka Putra Rinaldi NIM : 10105269
MEMBANGUN SISTEM E-COMMERCE DI DISTRO BLACK ORANGE
Pradikta Eka Putra Rinaldi Jurusan Teknik Informatika, Fakultas Teknik dan Ilmu Komputer,
Universitas Komputer Indonesia Jl. Dipati Ukur No.112 Bandung 40132
dibie_putrayahoo.co.id
ABSTRAK
Distro “Black Orange” merupakan perusahaan dagang yang menyediakan
barang berupa pakaian pria dan wanita. Distro “Black Orange” yang telah
memiliki banyak pelanggan baik didalam kota bandung maupun diluar kota bandung masih menerapkan prosedur belanja manual atau costumer langsung
datang ke distro tersebut. Serta sistem manual seperti pencatatan data-data dan transaksi penjualannya. Untuk menyelesaikan masalah diatas, meningkatkan
penjualan dan menjangkau pangsa pasar yang lebih luas maka Distro
“Black Orange
” ingin menggunakan teknologi dalam strategi pemasaran dan penjualannya dengan mengimplementasikan E-Commerce.
E-commerce merupakan salah satu pemanfaatan teknologi informasi
dibidang perdagangan. E-commerce atau Electronic commerce secara gamblang dapat diterjemahkan sebagai suatu transaksi jual beli yang dilakukan melalui
media elektronik. Penggunaan E-commerce ini sangat efektif karena sistem telah mengambil alih semua kegiatan operasional yang selama ini dilakukan secara
manual.
Untuk membangun sebuah aplikasi E-commerce, alat yang digunakan untuk menggambarkan model sistem adalah berupa diagram alir data FlowMap,
diagram konteks, dan Data Flow Diagram DFD, serta dalam perancangan basis data menggunakan kamus data, dan Entity Relationship Diagram ERD.
Aplikasi E-commrce yang dibuat diharapkan dapat menjadi media promosi, membantu meningkatkan penjualan dan menekan biaya operasional bagi
perusahaan serta mempermudah konsumen dalam melakukan proses pemesanan dan pembayaran suatu produk karena dilakukan secara on-line.
1.
PENDAHULUAN 1.1 Identifikasi Masalah
1. Belum adanya
sarana untuk
mempromosikan produk-produknya
kepada konsumen. 2. Konsumen
masih kesulitan
mendapatkan informasi tentang produk- produk yang ditawarkan oleh distro ini.
3. Konsumen masih kesulitan dalam hal pemesanan jarak jauh secara on-line
1.2 Maksud dan Tujuan
Adapun maksud dari penulisan tugas akhir ini adalah membangun sistem E-
Commerce di Distro Black Orange dengan menggunakan website.
Sedangkan yang menjadi tujuan penulisan tugas akhir ini adalah:
1. Membangun sarana
untuk mempromosikan
produk-produknya kepada konsumen.
2. Untuk menjadi media informasi secara umum
kepada konsumen
dalam mengenal lebih jauh tentang produk-
produk yang ditawarkan. 3. Untuk
mempermudah konsumen
memesan produk-produk
yang ditawarkan secara on-line.
1.3 Manfaat
Manfaat yang didapat dalam pembuatan aplikasi ini antara lain:
1. Dengan adanya website ini pelanggan
menjadi mudah mendapatkan informasi tentang produk maupun detailnya tanpa
harus datang ke toko.
2. Dengan adanya website ini fleksibilitas
akan dapat tercapai karena setiap costumer dapat melakukan transaksi
dimanapun dia berada..
3. Dengan adanya website ini pelanggan
yang berada diluar kota tetap dapat melakukan tansaksi tanpa harus datang
ke Bandung.
4. Dengan website ini Distro Black
Orange Company dapat memperluas pangsa pasarnya.
2. MODEL, ANALISA,
DESAIN, DAN IMPLEMENTASI
2.1 Model
1. Tahap pengumpulan data a. Studi pustaka
b. Studi lapangan b.1 Wawancara
b.2 Observasi 2. Tahap pengembangan perangkat lunak.
a. System engineering Rekayasa perangkat lunak
b. Requirement analysis c. Design
d. Coding implementasi e. Testing pengujian
f. Maintenance perawatan
2.2 Analisis Masalah
Berdasakan pada
analisis dan
hasil wawancara terhadap apa yang dibutuhkan
dalam membangun aplikasi e-commerce ini maka dapat dievaluasi hal-hal berikut :
1. Proses transaksi yang dilakukan di
tempat mengharuskan
konsumen datang
ke tempat
tujuan untuk
mendapatkan produk 2.
Proses pembayaran yang dilakukan di tempat
mengharuskan konsumen
datang ke
tempat tujuan
untuk melakukan pembayaran.
3. Dengan sistem yang berjalan sekarang,
pemberian informasi
kepada komsumen dirasakan kurang efektif
sehingga konsumen
belum tentu
mendapatkan informasi secara lengkap.
2.3 E-commerce
Electronic Commerce
e-commerce merupakan
konsep baru
yang biasa
digambarkan sebagai proses jual beli barang atau jasa pada World Wide Web Internet atau
proses jual beli atau pertukaran produk, jasa dan informasi melalui jaringan informasi
termasuk internet. E-Commerce merupakan kegiatan bisnis yang dijalankan secara
elektronik melalui suatu jaringan internet atau kegiatan jual beli barang atau jasa
melalui jalur komunikasi digital.
2.4 Desain
1. ERD Entity Relationship Diagram
Petugas
Administrator IS A
Operator Kota_kirim
Mengelola
Barang Pelanggan
Memesan Jenis_barang
Memiliki Kategori_barang
Memiliki
Detail_pesanan Memiliki
Memiliki Mengelola
Id_pesanan Id_barang
Id_jenis_barang id_kota_kirim
id_kategori_barang Id_petugas
Id_pelanggan Id_barang
Id_pesanan N
1 N
N 1
N 1
N N
N 1
1 N
Mengelola
N 1
Komentar
N N
Mengelola 1
N Mengelola
1 N
Id_pelanggan Id_kota_kirim
Id_komentar Id_jenis_barang
Id_pelanggan 1
Id_jenis_barang
id_kategori_barang Id_petugas
Id_petugas
Gambar 1. ERD Entity Relationship Diagram
2. Relasi tabel
blackorange_pelanggan
PK id_pelanggan
email password
nama_pelanggan alamat
kota telepon
hp url_foto
status blackorange_pesanan
PK id_pesanan
id_pelanggan id_kota_kirim
tgl_pesan tgl_akhir_bayar
nama_kirim alamat_kirim
total_bayar status_pesanan
jumlah bayar tgl_bayar
tgl_kirim Melalui
kodeTransaksi blackorange_detail_pesanan
PK id_pesanan PK id_barang
warna ukuran
jumlah harga_beli
diskon_beli
blackorange_Jenis_barang
PK id_jenis_barang
id_katagori_barang gambar_utama
harga diskon
keterangan blackorange_Petugas
PK id_petugas
email password
nama_petugas akses
status blackorange_Kota_kirim
PK id_kota_kirim
id_petugas nama_kota_kirim
ongkos_kirim
blackorange_Kategori_barang
PK id_kategori_barang
id_petugas nama_katagori_barang
keterangan blackorange_barang
PK id_barang
id_jenis_barang warna
ukuran berat
stok blackorange_komentar
PK id_komentar
id_pelanggan id_jenis_barang
tgl isi
tampilan
Gambar 2. Relasi table
3. Diagram Konteks
MEMBANGUN SISTEM E-
COMMERCE DI DISTRO BLACK
ORANGE pengunjung
Administrator
Operator Pelanggan
Info data pengunjung Info data kategori
Info data barang Info data detail barang
Data pengunjung Request data kategori
Request data barang Request data detail barang
Data login Data petugas
Info login invalid Info data petugas
Data login Data petugas
Data kota Data kategori
Data jenis barang Data detail barang
Data detail pesanan Data pesanan
Info login invalid Info data petugas
Info data kota Info data kategori
Info data jenis barang Info data detail barang
Info data detail_pesanan Info data pesanan
Data login Data data jenis barang
Request data barang Request data kategori
Request data kota Request data detail pesanan
Request data pesanan Info login invalid
Info data jenis barang Info data barang
Info data kategori Info data kota
Info data detail pesanan Info data pesanan
Gambar 3. Diagram konteks
4. DFD Data Flow Diagram
pelanggan operator
administrator Login Petugas
Data login Info login invalid
Data login Info login invalid
Data login Info login invalid
blackorange_petugas blackorange_pelanggan
Data login Info login
Info login Data login
Pengelolaan data petugas
Da ta pe
tu gas
Info p
etug as
Data petugas Info petugas
Data pelanggan Info pelanggan
Data petugas Info petugas
Daftar Pelanggan
Data pengunjung Info pengunjung
Data pengunjung Info pengunjung
Login valid administrator
Pengelolaan data master
pemesanan request data kategori barang
request data jenisbarang Request data barang
blackorange_ Kota kirim
blackorange_ kategori
barang blackorange_
Jenis_barang Data kota kirim
Info kota kirim Data kategori barang
Info kategori barang Data jenis barang
Info jenis barang Login valid operator
Id_barang, jumlah barang,Data pengiriman,Data pesanan Info detail barang,Info pesanan,Info detail pesanan
blackorange _pesanan
blackorange_Detail _pesanan
pengunjung Info kategori barang
Info jenis barang Info barang
request kategori barang request jenis barang
Request data barang 1
2 4
Data jenis barang View data
barang
Info kategori barang Info barang
Data kota kirim Data kota kirim
Data kategori barang Data jenis barang
Data barang Data pesanan
Request data detail pesanan Info kota kirim
Info kategori barang barang
Info jenis barang Info barang
Info pesanan Info detail pesanan
Info kategori barang Info jenis barang
Info barang
View Pesanan
Requ es
t d
ata p es
ana n,
requ es
t data
deta il pes
nan Info
pes ana
n,i nfo
deta il pes
ana n
Info pesanan,info detail pesanan In
fo pes an
an da
ta pe sa
nan, Data p
eng iri
m an
Info d etai
l p es
a nan
Id_ba rang
, jum
lah ba
rang Info pesanan
Info detail pesanan Login valid pelanggan
Login valid pelanggan
6 7
8 Data jenis barang, data barang
Login valid pelanggan Cari barang
11 Kategori barang,
harga min,harga max
Info barang, info kategori
barang Kategori barang,
harga min,harga max
Info kategori barang Info jenis barang
Info jenis barang, Info kategori barang
Data pesanan 9
blackorange _barang
Info barang Data barang
Info barang 3
Login Pelanggan
5 Pengelolaan
data pelanggan
Data Pe lan
gga n
Info Pelanggan Data
Pelanggan Info Pelanggan
Request data pesanan, request data detail pesnan
10 Komentar
blackorange_ komentar
Info komentar komentar
Kom e
ntar Info
k o
m en
tar
Kategori barang Harga min, harga max
pembayaran pesanan
sudah diterima Pembaya
ran melalui,
kode transaksi
Info Pembayara
n melalui, info kode
transaksi Login valid pelanggan
12 Konfirmasi pesanan
Info Konfirmasi pesanan
13
Gambar 4. DFD level 0
2.4 Implementasi
1. Implementasi Perangkat Lunak
Spesifikasi perangkat lunak yang digunakan dalam membangun aplikasi E-Commerce
berbasis web di Distro Black Orange adalah sebagai berikut:
1. Sistem Operasi windows XP
2. Bahasa pemograman PHP
3. MySQL sbagai database
4. Macromedia Dreamweaver 8
2. Implementasi Perangkat Keras
Spesifikasi perangkat keras yang digunakan dalam membangun aplikasi E-Commerce
berbasis web di Distro Black Orange adalah sebagai berikut:
1. Processor Pentium IV 2,4 Ghz
2. Monitor 17“
3. Hardisk Drive 120 Gb
4. MemoryRAM 512 Mb
5. VGA 128 Mb
6. Keyboard
7. Mouse
3. Implementasi Antarmuka
TAMPILAN ANTAR MUKA A.
Pelanggan
1.
Tampilan Beranda
sebelum loginmasuk
2.
Tampilan Beranda
sesudah loginmasuk
3.
Detail barang
4.
Keranjang Belanja
5.
Form Tujuan
6.
Total Bayar
7.
Check Out
8.
Form Pesanan
9.
Konfirmasi Pembayaran
10.
Login Petugas
11.
Beranda Operator
12.
Kota Kirim
13.
Kategori Barang
14.
Barang
15.
Pesanan
16.
Beranda Administrator
17.
Data Petugas
18.
Data pelanggan
3. HASIL DAN DISKUSI
Kategori