Rekening Business memilki fungsi yang sama dengan Premier. Hanya saja, rekening ini cocok digunakan oleh perusahaan karena adanya fitur
multiuser yang bisa diakses lebih dari satu orang, misalnya direktur, bagian penjualan, dan bendahara. Nama rekening juga bisa dinamai
dengan nama perusahaan.
Kelebihan Premier dan Business
Bagi pemilik rekening Premier dan Business PayPal memberikan beberapa kelebihan karena dapat digunakan untuk beberapa aktivitas
berikut :
a. Penjualan Satu Produk
Untuk single item atau hanya ada satu produk yang ditawarkan, PayPal menyediakan tombol buy now sehingga pembeli yang
mengklik tombol tersebut dapat langsung melakukan pembayaran dengan uang yang ada direkening PyPal atau melalui kartu kredit.
Tombol buy now ini banyak digunakan oleh para internet markerter yang menjual produk digital melalui website.
Jika produk yang dijual lebih dari satu , PayPal menyediakan tombol shopping cart. Dengan tombol ini, pemebeli bisa memiliki pilihan untuk membeli
produk atau jasa lain yang ditawarkan sebelum check out. Pembayaran juga dapat dilakukan baik melalui rekening PayPal maupun kartu kredit.
b. Penjualan Gift Sertificate
Gift adalah semacam voucher yang bisa diberikan kepada orang lain sebagai hadiah untuk membeli produk di tempat lain. Gift tersebut
kemudian bisa digunakan untuk membeli produk dengan harga yang lebih murah. Sebagai contoh, anda menjual suatu gift certificate senilai
10 denga harga 2 yang bisa digunakan untuk berbelanja di suatu toko online, maka jika harga barang pada toko online, maka jika harga
barang pada toko online tersebut adalah 50, si pembeli bisa menggunakan gift tersebut untuk mendapatkan barang dengan harga
40. PayPal menyediakan tombol untuk penjualan produk semacam ini,
dimana gift akan dikirim ke alamat email si penerima setelah pembeli melakukan pembayaran dengan dana yang ada di rekening PayPal atau
kartu miliknya.
c. Pendaftaran dan Pembayaran Keanggotaan
Tombol ini digunakan untuk pemilki bisnis atau komunitas yang meharuskan adanya pembayaran keanggotanya harus dilakukan setiap
bulan dalam jumlah tertentu.
d. Donasi
Selain untuk berbisnis, PayPal juga menyediakan tombol donasi yang digunakan untuk menerima sumbangan dari pihak lain. Cara ini
banyak digunakan oleh pembuat program yang bisa diunduh secara gratis, yayasan social, tim sukses suatu kandidat dan lainya.
Meski terlihat sepele, tombol donasi PayPal ternyata terbukti mampu menghasilkan banyak uang.
Account Benefit Personal
Premier Business
Send Money -
√ √
24-hour fraud surveillance √
√ √
Customer Service avalaible √
√ √
eBay Tools Limited
√ √
Merchant Services Limited
√ √
Accept credit or debit cars Limited
√ √
2.2.11.2.1.4
Membuat Rekening PayPal
Setelah mengenal jenis-jenis rekenig PayPal, Anda bisa membuat rekening dengan gratis dengan syarat memiliki email dan kartu kredit milik sendiri. Jika
grastis, mengapa masih mensyaratkan kartu kredit? Ya, rekening PayPal memang bisa dibuat atau dimiliki dengan gratis
karena pembayaran sebesar 1.96 yang dilakukan dengan kartu kredit pada akhirnya akan dikembalikan lagi sebagai saldo direkening PayPal.
PayPal tentu saja tidak akan membuat bisnisnya digunakan untuk semaunya dimana setiap orang bisa membuat lebih dari satu accountdengan tanpa
identitas yang jelas. Berikut adalah tahapan untuk membuat rekenin PayPal :
1. Klik SignUp di www.paypal.com
atau www.paypal.comid
jika ingin menggunakan tampilan bahasa Indonesia.
2. Pilih jenis akun yang anda inginkan. Yaitu Personal, Premier dan Business. Pilih sesuai yang anda inginkan, misalkan Personal
Account jika anda ingin meng-upgrade ke Premier atau Business bisa dilakukan kemudian.
3. Pilih Negara tempat anda tinggal 4. Klik Continue
5. Masukan informasi anda pada form pedaftaran. Sebagai catatan alamat email yang anda pilih akan menjadi alamat rekening
PayPal. Nama yang anda tuliskan juga harus sama persis dengan nama yang tercantum dalam kartu kredit untuk pendaftaran dan
pembayaran dan rekening tabungan untuk pengambilan. 6. Masukan informasi nomor dan waktu kadaluarsa kartu kredit pada
kolom isian yang tersedia. Isikan juga tiga digit nomor yang ada di bagian belakang kartu kredit pada CSC.
7. Jika tidak ada masalah pada kartu kredit yang digunakan untuk mendaftar, klik Continue lalu lakukan konfirmasi melalui email.
8. Buka email anda lalu klik link aktivasi yang dikirim PayPal. 9. Segera setelah konfirmasi, anda sudah memiliki rekening PayPal.
10. Agar bisa digunakan, lakukan pembayaran 1.96 melalui kartu kredit pada form yang tersedia.
11. PayPal kemudian akan mengirimkan empat digit kode melalui billing kartu kredit di alamat penagihan kartu kredit anda. Kartu
kredit yang saat ini bisa digunakan adalah Visa, Mastercard, Discover, dan American Express.
2.2.12 Secure Socket Layer SSL
Ada berbagai jenis ancaman yang berbeda untuk perdagangan elektronik untuk dapat mengalahkan ancaman-ancaman itu, berbagai protokol dan aplikasi
telah dikembangkan menggunakan teknik-teknik kriptografi. Standar keamanan seperti Secure Socket Layer SSL dirancang untuk memelihara keamanan
komunikasi di internet dan SSL digunakan terutama untuk aplikasi-aplikasi web.
2.2.12.1 Definisi Secure Socket Layer SSL
Keamanan untuk aplikasi-aplikasi web mencakup Secure Socket Layer, yang menyediakan otentikasi untuk sever-server dan browser-browser, juga
meningkatkan tingkat kepercayaan confidentially dan integritas data untuk komunikasi yang berlangsung antar server web dan browser. SSL menawarkan
metode perlindungan yang melindungi saluran komunikasi diantara dua protokol di bagian bawah dalam tumpukan protokol, yaitu antara lapisan aplikasi dan
lapisan jaringan dan transport menurut standar protokol TCPIP. Selain hal diatas, SSL dapat juga digunakan untuk transaksi-transaksi selain yang berjalan di Web,
tetapi ia tidak dirancang untuk menangani keputusan keamanan berbasis pada otentikasi pada peringkat aplikasi atau dokumen.
2.2.12.2 Sertifikat Secure Socket Layer SSL
Certificate Authority CA adalah lembaga yang menerbitkan sertifikat
digital SSL kepada perusahaan, lembaga atau individu lain setelah melalui
proses verifikasi. CA harus menyimpan informasi tentang apa yang sudah diterbitkan dan informasi apa yang digunakan untuk menerbitkannya, dan secara
rutin diaudit untuk memastikan semuanya sudah sesuai prosedur. Beberapa CA yang terkenal adalah Verisign, Comodo, Entrust, GlobalSign, dan lain sebagianya.
1. Sertifikat SSL dengan Validasi Domain Verifikasi atau validasi yang dibutuhkan untuk menerbitkan SSL
hanya memeriksa kepemilikan domain dengan menyelesaikan proses persetujuan lewat email. Sertifikat ini dapat diterbitkan dengan cepat
dalam hitungan menit. SSL dengan validasi domain cocok digunakan pada:
a. Login ke bagian adminuserwebmail. b. Formulir kontak.
c. Situs E-commerce dengan nilai transaksi rendah. 2. Sertifikat SGC SSL Secure Socket Layer
Sertifikat SSL yang menerapkan Secure Gateway Cryptography. Enkripsi yang digunakan antara pengunjung dan server minimal 128-bit.
Sertifikat SGC SSL ini cocok digunakan pada skenario berikut : a. Sistem operasi server menggunakan windows 2000 atau yang lebih
lama b. Terdapat pengunjung situs yang menggunakan browser dan sistem
operasi versi lama. Dibutuhkan jaminan minimal tingkat enkripsi untuk mengamankan data
sensitive.
2.2.12.3 Cara Kerja Secure Socket Layer SSL
SSL dimasukan ke dalam browser dan bekerja dianatar protokol komunikasi TCPIP di internet dan perangkat lunak aplikasi. Cara komunikasi
melalui internet pesan yang dikirim dilewatkan melalui sebuah soket yang menerjemahkan pesan tersebut dalam TCPIP. Sebagaiman diketahui TCPIP
adalah perangkat standar protokol yang digunakan untuk berkomunikasi antara komputer di Internet. Jika digunakan SSL, maka soket-soket tersebut dipasangi
dengan sistem keamanan yang menggunakan kriptografi kunci umum. SSL menggunakan teknologi kunci umum dan sertifikat digital untuk otentifikasi
server dalam suatu transaksi dan melindungi informasi pribadi pada saat melalui satu jaringan ke jaringan yang lainnya di internet.
Meski SSL melindungi informasi pada saat melalui jaringan internet, SSL tidak melindungi informasi pribadi, seperti angka-angka kartu kredit yang
tersimpan dalam server pedagang. Jika server tidak aman maka data-data pribadi tersebut dapat diakses oleh pihak-pihak yang sebenarnya tidak punya wewenang
untuk mengaksesnya.
Gambar II-14 Cara Kerja SSL
1. Seorang pengunjung mengakses ke situs yang sudah terpasang sertifikat SSL lewat saluran port yang aman dengan browser-nya
Internet Explorer, Mozilla Firefox, Opera, Safari, dsb, biasanya port 443. Koneksi aman ini ditandai dengan cara mengakses alamat
https: misalnya https:www.namadomainanda.com
2. Server atau situs akan mengirim kunci publik sertifikat SSL yang dimilikinya ke pengunjung tadi. Saat browser pengunjung
menerimanya, browser akan memeriksa validitas kunci publik tersebut, yaitu :
a. kunci publik sertifikat itu masih berlaku atau belum kadaluarsa.
b. kunci publik sertifikat itu benar-benar berlaku untuk situs atau domain yang diakses misalnya www.namadomainanda.com
tadi.
c. kunci publik sertifikat itu juga ada dalam database sertifikat yang tersimpan dalam browser.
3. Jika kunci publik sertifikat tadi bisa terverifikasi oleh browser pengunjung, maka browser akan mengirimkan kunci publik
miliknya ke server atau situs yang diakses. 4. Dengan kunci publik yang dikirim browser pengunjung tadi dan
kunci privat yang dimiliki server akan digunakan server untuk membuat sandi untuk mengirim data ke pengunjung. Browser
pengunjung akan membuka sandi tersebut dan membaca data yang dikirim. Sandi yang dikirim tadi merupakan sandi yang unik dan
hanya berlaku satu kali dan hanya bisa dibaca oleh browser yang tadi memintanya, sehingga pihak lain tidak bisa membacanya. Dan
selanjutnya setiap data yang diminta atau dikirim antara pengunjung dan server akan melalui proses ini.
1. Perlu dipahami bahwa SSL hanya akan memproteksi data pada saat transmisi saja. Hal ini yang disebut network security. Protokol SSL sama sekali tidak
akan memproteksi data sebelum maupun sesudah dilakukan komunikasi. 2. Artinya pembeli harus percaya penuh bahwa penjual tidak memberikan nomor
kartu kredit atau data pembeli ke orang lain pada bisnis online. Oleh karena itu, banyak perusahaan E-commerce dan bank yang sudah
menggunakan SSL 128 bit untuk menjaga keamanan website-nya yang artinya akan membutuhkan waktu kira-kira 12.710.204.652.610.000.000.000.000 tahun
untuk membobol informasi yang dienkripsi pada SSL. Walaupun informasi yang di-enkripsi oleh SSL 128 bit sudah cukup sulit untuk bisa dibobol bukan berarti
informasi tersebut akan selamanya aman dari para penjahat cyber dan tidak selamanya SSL akan melindungi informasi dari beberapa hal, diantaranya sebagai
berikut: 1. Denial of Services
2. Buffer overflow 3. Man-in-the-middle attack
4. Cross scripting attack
2.2.13 Media Komunikasi
2.2.13.1.1 Yahoo Messengger
Yahoo Messenger merupakan program pengirim pesan instan populer
yang disediakan oleh Yahoo. Yahoo Messenger tersedia secara gratis dan dapat diunduh serta diakses menggunakan Yahoo ID yang biasa digunakan untuk
mengakses layanan Yahoo yang lainnya, seperti Yahoo Mail. Penggunaan ID ini juga mengakibatkan pengguna dapat langsung diberitahu bila mendapat sebuah e-
mail. Yahoo
telah mengumumkan
kerjasama dengan Microsoft untuk
bergabung dalam jaringan instant messenger. Hal ini mengakibatkan Yahoo Messenger dapat berhubungan dengan layanan .NET Messenger milik Microsoft.
Layanan ini mulai berfungsi sejak 13 Juli 2006.
Pada Februari 2009, versi terbaru Yahoo Messenger untuk Microsoft Windows adalah 9.0.0.2136
2.2.13.2 Electronic Mail E-Mail
Email atau electronik mail adalah layanan surat menyurat lewat internet. Fasilitas ini sudah sering kita dengar. Selain untuk saling mengirim pesan
panjang, kita juga dapat menggunakan email untuk mengirim tugas dalam proses belajar, pendaftar masuk sekolah dan lain-lain. Dengan adanya email sebagai
media online yang memberikan manfaat dalam surat-menyurat.
2.2.13.3 Jejaring Sosial Social Network
2.2.13.3.1 Facebook
Situs ini merupakan situs pertemanan atau jejaring sosial yang sedang banyak digunakan saat ini. Para pengguna dapat bergabung dalam komunitas kota,
pekerjaan, sekolah, kampus, dan daerah tertentu. Melalui Facebook, kita dapat menjalin komunikasi dengan teman-teman ataupun relasi-relasi baru. Situs ini
juga dapat berfungsi sebagai media untuk berbagi foto dan video. Anda juga bisa saling berkirim pesan dengan teman-teman di Facebook, serta memperbaharui
profil pribadi agar orang lain dapat melihat diri anda yang sebenarnya.
2.2.13.3.2 Twitter
Twitter adalah salah satu situs jejaring sosial yang memberikan fasilitas bagi pengguna untuk mengirimkan teks dengan panjang maksimal 140 karakter.
Selain lewat perangkat komputer, Twitter juga bisa diakses dengan menggunakan handphone. Twitter digunakan sebagai ajang mengirim pesan singkat oleh
penggunanya dengan memberitahukan apa yang sedang terjadi pada saat itu. Di Indonesia, situs jejaring sosial ini mempunyai pengguna aktif yang cukup banyak.
2.2.14 Bahasa Pemrograman, Database dan Web Server
2.2.14.1 PHP
PHP atau Hypertext Prepocessor adalah salah satu jenis bahasa pemrograman web yang open source, sehingga dapat digunakan oleh siapa saja
secara cuma-cuma. Selain gratis, PHP juga memiliki kelebihan diantaranya, kemudahan dalam menggunakannya serta dapat digunakan untuk membuat
website dinamis.
2.2.14.1.1 Sejarah Singkat PHP
PHP diciptakan pertama kali oleh Rasmus Lerdorf pada tahun 1994. Awalnya, PHP digunakan untuk mencatat jumlah serta untuk mengetahui siapa
saja pengunjung pada homepage-nya. Rasmus Lerdorf adalah salah seorang pendukung open source. Oleh karena itu, ia mengeluarkan Personal Home Page
Tools versi 1.0 secara gratis, kemudian menambah kemampuan PHP 1.0 dan
meluncurkan PHP 2.0. Pada tahun 1996, PHP telah banyak digunakan dalam website di dunia.
Sebuah kelompok pengembang software yang terdiri dari Rasmus, Zeew Suraski, Andi Gutman, Stig Bakken, Shane Caraveo, dan Jim Winstead bekerja sama
untuk menyempurnakan PHP 2.0. Akhirnya, pada tahun 1998, PHP 3.0 diluncurkan.penyempurnaan terus dilakukan sehingga pada tahun 2000
dikeluarkan PHP 4.0. tida berhenti sampai disitu, kemampuan PHP terus ditambah, dan saat ini , versi terbaru yang telah dikeluarkan adalah PHP 5.0.x.
2.2.14.1.2 Kelebihan-kelebihan PHP
PHP memiliki banyak kelebihan yang tidak dimiliki oleh bahasa script sejenis. PHP difokuskan pada pembuatan script server side, yang bisa melakukan
apa saja yang dapat dilakukan oleh CGI, seperti mengumpulkan data dari form, menghasilkan isi halaman web dinamis, dan kemampuan mengirim serta
menerima cookies, bahkan lebih daripada kemampuan CGI PHP dapat digunakan pada semua sistem operasi, antara lain Linux, Unix
termasuk variannya HP-UX, Solaris, dan Open BSD, Microsoft Windows, Mac OS X, RISC OS. PHP juga mendukung banyak web server, seperti Apache,
Microsoft Internet Information Server MIIS, Personal Web Server PWS,
NetScape and iPlanet Server, Oreilly Website Pro Server, Audium, Xitami, Omni HTTPD, dan masih banyak lagi yang lainnya, bahkan PHP dapat bekerja sebagai
suatu CGI processor. PHP tidak terbatas pada hasil keluaran HTML HyperText Markup
Languages . PHP juga memiliki kemampuan untuk mengolah keluaran gambar,
file PDF dan movies flash. PHP juga dapat menghasilkan text seperti XHTML dan file XML lainnya.
Salah satu fitur yang dapat diandalkan oleh PHP adalah dukungannya terhadap banyak database. Berikut database yang dapat didukung oleh PHP :
Adabas D, dBase, Direct MS-SQL, Empress, FilePro Read Only, FrontBase, MySQl, ODBC, Oracle, dll.
2.2.14.2 HTML
HTML kependekan dari Hyper Text Markup Language. Dokumen HTML adalah file teks murni yang dapat dibuat dengan editor teks sembarang. Dokumen
ini dikenal sebagai web page. Dokumen HTML merupakan dokumen yang disajikan dalam beowser web surfer. Dokumen ini umumnya berisi informasi atau
interface aplikasi dalam internet. Dokumen-dokumen HTML merupakan berkas teks yang mengandung 2
bagian : isi, yaitu segala sesuatu yang ingin ditampilkan dan diperlihatkan dalam dokumen Web; dan tag yang merupakan informasi pemformatan, yang
tersembunyi dari pandangan pengguna, yang memberitahu browser tentang bagaimana caranya menampilkan isi dokumen ke hadapan pengguna.
2.2.14.3 Javascript
Javascript merupakan pemrograman web yang berjalan di sisi client browser, sehingga javascript dapat membuat website lebih hidup interaktif dan
responsif. Beberapa contoh yang bisa dilakukan javascript adalah pembuatan animasi, kotak dialog, mengubah bentuk kursor mouse, validasi form, dan lain-
lain. Kemampuan istimewa lainnya, javascript dapat membuat website dengan cita rasa dekstop.
2.2.14.3.1 Jquery
jQuery adalah Javascript Library, yaitu kumpulan kode atau fungsi javascript siap pakai, sehingga mempermudah dan mempercepat kita dalam
membuat kode javascript.
Kesimpulannya, jQuery menyederhanakan kode javascript. Hal ini sesuai dengan slogannya “Write Less, Do More”.
2.2.14.4 Cascading Style Sheet CSS
CSS atau Cascading Style Sheet saat ini adalah sebuah elemen penting dalam pembuatan sebuah web. Sama pentingnya saat kita mendesai bentuk web
pada photoshop. Dengan CSS, kita dapat mendesain sejumlah halaman dengan aturan yang sama tanpa mengubah halaman-halaman tersebut satu per satu.
Dengan membuat sebuah file CSS kemudian mengimportnya kedalam file halaman web. Kita dapat memformat style semua halaman web yang kita buat.
2.2.14.5 Asyncronous Javascript and XML AJAX
Mengenai definisi dari AJAX, berikut adalah terjemahan dari kutipan yang ada dalam website resmi w3school.com :
“AJAX bukanlah bahasa pemrograman baru, akan tetapi merupakan suatu teknik baru untuk membuat aplikasi web lebih baik, lebih cepat, dan lebih
interaktif. ”
AJAX menggunakan basis web standar, yaitu : Javascript, HTML, CSS, PHP, dan XML.
2.2.14.6 MySQL
MySQL adalah aplikasi atau sistem untuk mengelola database atau manajemen data. Untuk menyimpan data dan informasi ke komputer kita
menggunakan data, contoh kita menyimpan data karyawan pada suatu perusahaan dan memasukkan pada suatu file. File data yang dikelompokkan inilah yang
disebut database, dan MySQL bertugas mengatur dan mengelola data-data pada database. Dalam mengelola database MySQL menggunakan struktur atau
kerangka yang berbentuk tabel. Dalam tabel-tabel itulah data diatur dan dikelompokkan.
MySQL banyak digunakan dan menjadi pilihan karena berbagai keunggulan. Keunggulan yang utama adalah karena aplikasinya gratis, dan bisa
dipakai oleh siapa saja. Selain itu MySQL dikenal sebagai sistem database yang efisien dan reliable, proses query MySQL cepat dan mudah, sehingga cocok sekali
untuk aplikasi berbasis web. MySQL juga mudah dihubungkan dengan berbagai bahasa pemrograman dan aplikasi, sehingga tingkat kompatibilitasnya tinggi,
disamping itu kode- kode perintah MySQL bisa dibilang “sederhana” sehingga
mudah dimengerti oleh programmer untuk membangun suatu aplikasi.
2.2.14.7 Apache
Apache web server sudah sejak lama menjadi server Web utama di seluruh dunia. Sejak tahun 1996 hingga saat ini, Apache Web Server merupakan server
Web yang paling populer seluruh dunia. Salah satu alasan yang utama dari terpilihnya Apache Web Server adalah karena harganya. Apache Web Server bisa
diperoleh secara cuma-cuma gratis dengan melakukan download di internet. Apache Web Server merupakan produk dari sebuah perusahaan yang dinamakan
Apache Project, yang terdiri dari sejumlah sukarelawan para analisis sistem dan para pemogram yang tergabung dalam kelompok yang dinamai Apache Group.
Kode sumber Apache Web Server ini bisa diperoleh secara bebas open source
, memungkinkan pada pemogram dan webmaster melakukan analisis
bagaimana Apache Web Server ini dibuat serta bagaimana fungsionalitas masing- masing modul yang ada di dalamnya.
2.2.15 Software Pendukung
2.2.15.1 Adobe Photoshop CS3
Adobe photosop CS3 merupakan seri terbaru dari program sebelumnya yaitu adobe photosop CS2. Dengan perubaha penampilan dan fitur terbarunya,
mejadikan adobe photosop CS3 sebagai sebuah program pengolaha gambar dan photo yang semakin digemari oleh para Designer dan Photografer. Beberapa
perubahan dan fitur terbaru memberikan banyak kemudahan dalam hal pengolahan file dan editing maupun modifikasi sebuah photo. Serta penambahan
beberapa fasilitas baru, menjadikan Adobe Photosop CS3 sebagai salah satu program pengolahn gambar yang semakin handal.
2.2.15.2 Adobe Dreamweaver CS3
Dreamwaver adalah sebuah HTM editor professional untuk mendesain web secara visual dan mengelola situs atau halaman web. Pada dreamwaver CS3,
terdapar beberapa kemapuan bukan hanya sebagai softwar untuk desain web saja teteapi juga untuk menuntung kode serta pembuatan aplikasi web dengan
menggunakan bahasa pemograman web, antara lain : JPS, PHP, ASP dan ColdFusion.
Dreamwaver merupakan software utama yang digunakan oleh Web Desainer maupun Web Programmer dalam mengembangkan suatu situs web. Hal
ini disebabkan ruang kerja, fasilitas, dan kemmapuan Dreamwaver yang mampu
meningkatkan produktivitas dan efektivitas dala desain maupun membangun suatu situs web.
Dreamwaver dapat digunakan untuk memodifikasi tampilan toolbar atau menambahkan fungsi baru. Selain user interface baru, dreamwaver memiliki
kemampuan untuk menyunting kode dengan lebih baik. Dreamwaver juga dapat melakukan print code view, selain itu juga memiliki fasilitas Code Hints yang
membantu dalam urusan tag-tag, serta tag inspector yang sangat berguna dala menangani tag-tag HTML.
2.2.15.3 WAMP
Wampserver adalah singkatan dari windows, apache, mysql dan php, wampserver adalaj aplikasi yang menggabungkan antara apache, mysql, dan php.
Sehingga wampserver akan mencukupi semua persyaratan yang diminta. Dengan demikian, tidak perlu meng-install masing-masing aplikasi apache, mysql, dan
php.
82
BAB III ANALISIS DAN PERANCANGAN SISTEM
3.1 Analisis Sistem
Pada bagian ini akan dilakukan analisis terhadap system yang sedang berjalan. Menguraikan dari kebutuhan dan mengidentifikasi masalah dari sistem
yang akan dibangun mulai dari kebutuhan non-fungsional dan kebutuhan fungsional yang terdiri dari analisis perangkat lunak, perangkat keras, dan
kebutuhan pengguna dari sistem ini. Hasilnya digunakan untuk mengidentifikasi dan mengevaluasi berbagai
kelemahan dan kelebihan yang terdapat pada system di toko Osmoes Kaos Muslimah. Dari proses analisis tersebut akan dihasilkan berbagai saran perbaikan
terhadap system yang dapat dijadikan dasar dalam merancang yang akan dibangun.
3.1.1 Analisis Masalah
Identifikasi masalah adalah langkah awal dari analisis sistem. Langkah ini diperlukan untuk mengetahui pemasalahan apa saja yang terjadi di sistem yang
telah berjalan. Oleh karena itu langkah pertama adalah mengidentifkasi masalah yang
muncul. Toko osmoes kaos muslimah merupakan perusahaan yang bergerak di bidang industri pakaian dan nama brand atau mereknya belum dikenal banyak
orang, dan untuk mendapatkan konsumennya toko osmoes harus masih mencetak banyak katalog yang pastinya setiap bulannya terdapat produk baru yang
dikeluarkan oleh osmoes, tentunya katalog produk harus di update juga setiap bulannya.
Karena pengenalan produk masi menggunakan katalog, maka biaya yang dikeluarkan oleh osmoespun tidak sedikit, karena untuk produknya dikenal
konsumen, osmoes harus mengeluarkan biaya yang cukup besar untuk pencetakan katalog, karena pemasaran yang dilakukan masih antara konsumen ke konsumen.
Keterbatasan dalam hal pemromosian produk karena masih mengandalkan pegawai untuk menawarkan langsung ke konsumen ataupun konsumen lain
menawarkan ke yang laiinya, membuat osmoes kurang dikenal. Dalam proses pengarsipan juga masih sangat manual, artinya belum
memiliki fasilitas yang terkomputerisasi sehingga akan kesulitan dalam melakukan rekapitulasi hasil penjualan.
3.1.2 Analisis Sistem Berjalan
Analisis Prosedur atau analisis proses adalah tahapan yang memberi gambaran tentang sistem yang sedang berjalan. Analisis ini bertujuan untuk
memberi gambaran yang lebih detail bagaimana cara kerja dari sistem manual dan analisi dari sistem yang sedang berjalan di toko osmoes kaos muslimah.
Prosedur yang sedang berjalan di toko osmoes kaos muslimah adalah sebagai berikut :
1. Pegawai dari toko osmoes kaos muslimah menawarkan produk osmoes ke konsumen memakai katalog yang disiapkan dari toko, lalu
menawarkannya dengan menandatangi konsumen tersebut dan
mempromosikan tempat toko tersebut, dari sinilah konsumen ke konsumen melakukan penawaran juga.
2. Apabila ada konsumen yang tertarik untuk membeli produk osmoes, maka konsumen melakukan pemesanan untuk produk yang mereka
pilih. 3. Setelah melakukan pemesanan maka akan dibuatkan kuitansi
pemesanan barang yang akan dibeli konsumen. 4. Apabila konsumen ingin mendatangi langsung toko, konsumen bisa
langsung memilih produk tanpa harus melihat catalog, dan akan dilayani oleh pelayan toko.
5. Setelah konsumen mendapatkan produk yang diinginkan maka akan dilakukan pengecekan produk, apabila produk dalam kondisi baik
maka pelayan akan membuatkan kuitansi dan diarsipkan. 6. Namun apabila konsumen yang membeli melalui pegawai yang
menawarkan produknya kepada konsumen, maka konsumen harus menunggu untuk barang yang diinginkannya dating dan diberikan oleh
pegawai yang menawarkan produknya. 7. Setelah mendapatkan barang yang dipesan dari pegawai yang
menawarkan produk, konsumen melakukan pembayaran dan mendapatkan kuitansi pembayaran.
Proses penjualan diatas dapat digambarkan ke dalam diagram flowap sebagai berikut :
Keterangan : A1 : Arsip Penjual
A2 : Arsip Buku Penjual
Sistem Penjualan Toko Osmoes Kaos Muslimah
Penjual Konsumen
Katalog Produk Osmoes
Katalog Produk Osmoes
Pilih Produk
Pembelian Produk
Pengecekan barang
Tersedia ?
Barang tidak tersedia
Barang tersedia Tidak
Pembuatan nota
pembelian Ya
Nota pembelian Nota pembelian
Pencatatan barang terjual
Nota pembelian
Buku Penjualan
A1 A2
Gambar III-1 Flowmap
Prosedur pembuatan laporan yang berjaan di toko Osmoes Kaos Muslimah : 1. Admin membuat laporan penjualan dari nota pembelian yang
diarsipkan 2. Laporan penjualan dibuat rangkap dua, rangkap kedua untuk diberikan
ke owner toko, sedangkan rangkap satu untuk arsip penjualan 3. Laporan diberikan ke owner untuk diperiksan dan ditandatangani
Proses pembukuan tersebut dapat digambarkan ke dalam diagram flowmap sebagai berikut :
Keterangan : A3
: Arsip laporan penjualan admin A4
: Arsip laporan penjualan untuk owner
Pembukuan Laporan Penjualan
Owner Admin
A2
Draft Penjualan
Pembukuan laporan
Laporan Penjualan
A3 Laporan
Penjualan
Pengecekan laporan
Laporan singkron
Tandatangan dan cap
laporan Laporan
Penjualan yang di tandatangan
dan cap
A4 Ya
Tidak
Gambar III-2 Flowmap Pembukuan Laporan
3.1.3 Analisis Dokumen
Dokumen yang terlibat dalam prosedur penjualan di toko osmoes kaos muslimah dapat dilihat dalam table dibawah ini :
Tabel III-1 dokumen
No Dokumen
Sumber Keterangan
1. Kuitansi
Konsumen Menginformasikan pembayaran yang
dilakukan konsumen
2. Data Arsip Penjualan
Transaksi Menginformasikan data transaksi setiap
penjualan
3.2 Analisis Kebutuhan Non-Fungsional
Analisis kebutuhan non-fungsional dilakukan untuk mengetahui kebutuhan apa saja yang dibutuhkan pengguna dalan menjalankan aplikasi yang dibangun.
3.2.1 Analisis Perangkat Keras
Analisis perangkat keras hardware merupakan proses analisis yang lebih menekankan kepada aspek pemanfaatan perangkat keras yang perlu dimiliki oleh
Toko Osmoes Kaos Muslimah, spesifikasi perangkat keras adalah sebagai berikut : a. Processor dengan kecepatan 2,66 Ghz
b. Kapasitas RAM 512 MB c. Kapasitas media penyimpanan 40GB
d.
Kapasitas VGA 64 MB 32 bit kedalaman warna
e.
LAN card
f.
Modem SMS
g. Monitor h. Keyboard
i. Mouse
3.2.2 Analisis Perangkat Lunak
Analisis perangkat lunak software merupakan proses analisis yang lebih menekankan kepada aspek pemanfaatan perangkat lunak yang diperlukan oleh Toko
Osmoes Kaos Muslimah, spesifikasi sebagai berikut :
a. Sistem Operasi Microsoft Ubuntu Mac b. Wampsever 2.0
c. Offline webserver apache d. Web browser Mozilla, Opera, Safari, Chrome
e. MySQL
3.2.3 Analisis Pengguna
Pengguna dari aplikasi yang akan dibangun terdiri dari tiga pengguna, yaitu : Administrator, Member, dan Pengunjung. Dengan asumsi kategori
pengguna tersebut dapat menggunakan sistem operasi minimal Microsoft Windows.
Berikut spesifikasi dari pengguna yang akan dijelaskan dalam tabel :
Tabel III-2 spesifikasi pengguna
Pengguna Administrator
Member Pengunjung
Tanggung Jawab Dalam
pengelolaan sistem dan pemakaian
yang dibangun mulai dari update barang,
pengecekan pesanan, dll.
MelihatProduk dan melakukan
Pemesanan Melihat Produk
Hak Akses
Memanipulasi data
update, tambah,
hapus Melakukan
tambah, hapus
dan konfirmasi
pemesanan ataupun
pembayaran Melihat Produk
Tingkat Pendidikan
Min. SMA Tidak
ditentukan, min. mengerti
internet Tidak
ditentukan min.
mengerti internet
Tingkat Keterampilan
Mengerti kinerja
komputer dan internet Mengerti internet
dan mengetahui cara pembelian
Mengerti Internet
online
Pengalaman
Pengarsipan komputerisasi,
pelatihan komputer
dan teknologi website
Jenis Pelatihan
Pelatihan komputer
dan teknologi website
3.2.4 Analisi Basis Data
Analisis basis data bertujuan untuk menganalisa data yang diolah dan disimpan dalam basis data. Dalam memodelkan data dan hubungan-hubungan
data yang ada di dalam aplikasi yang akan dibangun digunakan alat bantu yaitu diagram E-R. Gambar dibawah menggambarkan bagaimana relasi antar entitas
yang saling berhubungan.
mengelola Admin
email password
Member username
nama alamat
no_hp email
password memesan
Detail_produk Order_temporary
memiliki memiliki
id_detail_produk
memiliki Produk
warna ukuran
harga stok
diskon berat
memiliki Jmlh_brg
id_produk id_pesanan
Kabkota memiliki
Provinsi memiliki
id_kabkota nama
id_provinsi nama_prov
kecamatan harga
paket id_produk
nama deskripsi
memiliki Kategori
id_kategori nama
keterangan melakukan
Pembayaran id_pembayaran
No_transaksi tgl_bayar
melakukan Pengiriman
no_resi tgl_kirim
status N
N
N 1
1
1 1
1 1
status_bayar harga
TotalHarga
1 memberi
melakukan melakukan
Komentar Upload Desain
Upload Foto memberi
Rate Produk Id_komentar
Tgl_komentar komentar
Total_rate foto
gambar keterangan
N
1 1
1 1
1 1
1
foto Total_rater
Tgl_rate
retur_barang no_retur
Tgl_retur jumlah
gambar 1
mengelola mengelola
mengelola
Tabel III-3 ERD
3.3 Analisis Kebutuhan Fungsional
Analisis kebutuhan fungsional adalah analisis terhadap kebutuhan secara fungsional baik dalam aliran data ataupun informasi.
Analisis kebutuhan fungsional yang digunakan dalam sistem ini digambarkan dengan analisis terstruktur.
3.3.1 Diagram Konteks
Diagram konteks adalah alat untuk mengambarkan keterkaitan sistem dengan lingkungan luarnya. Diagram konteks ini menggambarkan sistem secara
keseluruhan atau secara garis besar. Dalam penggambarannya pendekatan analisis ini dianggap sebagai objek yang tidak menjelaskan secara rinci bagaimana sistem
itu berinteraksi dengan lingkungan luarnya.
Aplikasi E-commerce Admin
Member Paypal
Info login invalid Data Login
Info konfirmasi pembayaran Data pembayaran
S ta
tu s
P e
mba yara
n In
fo d
a ta
p emb
aya ran
Pengunjung D
a ta
pe nca
ri an
D at
a reg
ist ra
si In
fo p
e nca
ri an
Inf o
re gi
st ra
si Data login
Info pemesanan Info member
Info produk Info detail produk
Info gambar produk Info kategori
Pencarian produk Data pemesanan
Upload desain Upload foto
Isi komentar Info produk
Info pemesanan Info upload desain
Info upload foto Info pengisian komentar
Info login invalid Data pemesanan
Data member Data produk
Data detail produk Data gambar produk
Data kategori
Info pengiriman Data pengiriman
Email In
fo p
ass w
ord ba
ru Inf
o p
eme san
an In
fo d
a ta
p emb
ay ara
n In
fo re
gi s
tra si
D a
ta v
eri fika
si reg
ist ras
i Inf
o p
en gi
ri ma
n
JNE Inf
o t
ra cki
ng p
en gi
ri ma
n
D a
ta pe
ng iri
man
Gambar III-3 Diagram Konteks
3.3.2 DFD Level 0
Data Flow Diagram merupakan suatu media yang digunakan untuk
menggambarkan aliran data yang mengalir pada suatu sistem informasi. Dalam Data Flow Diagram DFD
terdiri dari entitas luar, aliran data, proses, dan penyimpanan data. Salah satu keuntungan menggunakan DFD adalah
memudahkan pemakai yang kurang menguasai bidang komputer untuk mengerti sistem yang akan dikerjakan.
DFD level 0 menggambarkan seluruh proses yang ada dalam sistem dengan lingkungan luarnya.
admin
member
pengunjung
paypal 1.0
Login 2.0
Lupa Password
4.0 Lihat Produk
5.0 Lihat Kategori
6.0 Pencarian
7.0 Registrasi
3.0 Pengolahan data master
8.0 Pojok Narsis
11.0 Pemesanan
12.0 Pembayaran
13.0 Pengiriman
T_admin T_member
T_produk T_detail_produk
T_kategori Data login admin
Info data login admin Data lupa password admin
Info lupa password admin Info data admin
Data admin Data login member
Info data login member Data lupa password member
Info lupa password member Data member
Info data member Data lupa password member
Data lupa password admin Info data lupa password admin
Info data lupa password member
Data produk Info data produk
Data detailproduk Info data detail produk
Info data detail produk Data member
Info data member Data kategori
Info data kategori Data kategori
Info data kategori
Data produk Info data produk
Data produk Info data produk
Data kategori Info data kategori
Data kategori Info data kategori
Data detail produk Info data detail produk
Data detail produk Info data detail produk
Data produk Info data produk
Data kategori Info data kategori
Info data detail produk Data detail produk
9.0 Upload desain
10.0 Rate Produk
Data registrasi Info data registrasi
Data registrasi Info data registrasi
Data pojok narsis Info data pojok narsis
T_pojoknarsis Info data pojok narsis
Data pojok narsis Data upload desain
Info data upload desain
T_uploaddesain
Data upload desain Info data upload desain
Data rate produk Info data rate produk
T_ratedesain T_pemesanan
T_pembayaran T_order_temp
Data rate produk Info data rate produk
Data pemesanan Info data pemesanan
Email Data detail pesanan
Info data detail pesanan Info data member
Nfo data Info data produk
Data detail produk
data pojoknarsis Info data pojoknarsis
Info data pemesanan Data pembayaran
Info data pembayaran Info data pembayaran
Data pembayaran Info data pembayaran
Data upload desain Info data upload desain
Data member Data rate desain
Info data rate desain
T_pengiriman 14.0
Komentar Info data komentar
Data komentar T_komentar
Info data pemesanan Data pemesanan
Info data pengiriman Data pengiriman
Info data pengiriman
Data komentar Info data komentar
T_provinsi T_kota
Info data kota Data kota
Data provinsi Info data provinsi
Info data kota Data kota
Info data provinsi Data provinsi
Data komentar Info data komentar
Data produk Info data produk
Data produk Info produk
Data pengiriman Info data pengiriman
T_kecamatan
Data ongkir Info data ongkir
Info data registrasi
Info data pengiriman Data rate produk
Info rate produk
Data komentar Info data komentar
JNE Data tracking pengiriman
Gambar III-4 DFD Level 0
3.3.2.1 DFD Level 1 Proses 1 Login
1.3 Validasi email atau
username dan password
Admin Member
T_admin T_member
Info akun admin Info akun member
1.1 Isi data login
admin 1.2
Isi data login member
Data login member Data login admin
Info login admin Info login member
Data login admin Data login member
L o
g in
me m
b e
r va lid
L o
g in
a d
mi n
v a
lid L
o g
in me
mb e
r i n
v a
lid
Gambar III-5 DFD Proses 1
3.3.2.2 DFD Leve 1 Proses 2 Lupa Password
Member 2.1
Halaman lupa password mmber
2.2 Vaidasi data lupa
password 2.3
Konfirmasi pembaharuan
password Data lupa password member
Info lupa password Validasi data
Info valdasi data lupa password
T_member Info akun member
Data akun member Email
Info data akun member In
fo rm
a si
p e
u b
a h
a a
n p
a s
sw o
rd
Gambar III-6 DFD Proses 2
3.3.2.3 DFD Level 1 Proses 3 Pengolahan Data Master
3.1 Pengolahan
Data produk
admin 3.2
Pengolahan data detail produk
3.3 Pengolahan data
kategori
3.4 Pengolahan data
member
3.5 Pengolahan data
kota
3.6 Pengolahan data
provinsi
3.7 Pengolahan data
pemesanan
3.8 Pengolahan data
komentar T_produk
T_detail _produk
T_kategori
T_member
T_kota
T_provinsi
T_pesanan
T_komentar Data produk
Info data produk
Info detail produk Data detail produk
Data kategori
Info data member Data member
Data kota Info data kota
Data provinsi Info data provinsi
Data pemesanan Info data pemesanan
Data komentar Info data komentar
Data produk Info data produk
Data detail produk Info data detail produk
Data kategori Info data kategori
Data member Info data member
Data kota Info data kota
Data provinsi Info data provinsi
Data pemesanan Info data pemesanan
Data komentar Info data komentar
Info data kategori
3.9 Pengolahan data
laporan Data pemesanan
Data laporan Info data laporan
Gambar III-7 DFD Proses 3
3.3.2.4 DFD Level 1 Proses 6 Pencarian
6.1 Input data
pencarian 6.2
Pencarian data
T_detail_produk member
pengunjung Data pencarian
Data pencarian 6.3
Tampil hasi pencarian data
T_produk
Info data pencarian Info data pencarian
Da ta
p e
n c
a ria
n
Da ta
p e
n c
a ria
n Data pencarian
Info hasil pencarian
Info data hasil pencarian Info data hasil pencarian
Gambar III-8 DFD Level 1 Proses 6
3.3.2.5 DFD Level 1 Proses 7 Registrasi
Pengunjung 7.1
Input data registrasi
7.2 Validasi data
registrasi
7.3 Kirim verifikasi
email Data registrasi
Data registrasi
R e
g ist
ra s
i v a
lid
T_member Data registrasi
Info akun member
In fo
re g
is tra
si
Info registrasi Info validasi registrasi
In fo
re g
ist ra
s i in
va lid
Email Info registrasi
Gambar III-9 DFD Level 1 Proses 7
3.3.2.6 DFD Level 1 Proses 8 Upload Foto
8.1 Upload Foto
8.2 Tampil
Halaman Foto T_pojoknarsis
member
admin Data upload foto
Info upload foto
Data upload foto
Info upload foto member Info data upload foto
Data upload foto
Data upload foto Info upload foto
Gambar III-10 DFD Level 1 Proses 8
3.3.2.7 DFD Level 1 Proses 11 Pemesanan
member
T_pemesanan 11.1
Input pemesanan
11.3 Delete items
11.2 Tambah items
11.4 Check out
11.5 Tampil data
items pemesanan
T_order_temp Data produk dibeli
Info produk dibeli
Info da ta
pe sa
na n
Data detail pesanan Info data detail pesanan
Data pemesanan Info data pemesanan
Info data delete detail pesanan Data delete detail pesanan
Info pemesanan Info data pemesanan
Data pemesanan
Info pemesanan email
Info pemesanan
Gambar III-11 DFD Level 1 Proses 11
3.3.2.8 DFD Level 1 Proses 12 Pembayaran
12.1 Input data
pembayaran
12.2 Pembayaran
online
paypal
admin member
12.3 Pembayaran
offline Data pembayaran
Info data pembayaran
Data pembayaran Data pembayaran
T_pemesanan T_pembayaran
D ata p
emb a
y a
ra n
Info data pembayaran Data pembayaran
Info pembayaran Info pembayaran
Info pembayaran Data pembayaran
In fo p
emb a
y a
ra n
Info pemesanan
Info pemesanan
12.4 Tampil data
pembayaran Data konfirmasi pembayaran
Info pembayaran Info data pembayaran
Data pembayaran Data pembayaran
Email Informasi pembayaran
Informasi pembayaran
Gambar III-12 DFD Level 1 Proses 12
3.3.2.9 DFD Level 1 Proses 13 Pengiriman
13.1 Tampil data
pengiriman
13.2 Update status
pengiriman admin
email T_pengiriman
Data pengiriman Info data pengiriman
Data pengiriman Info pengiriman
Info data pengiriman
Data pengiriman Info data pengiriman
Data pengiriman Info pegiriman
Gambar III-13 DFD Level 1 Proses 13
3.3.2.10 DFD Level 1 Proses 14 Komentar
14.1 Input data
komentar
14.2 Cek data
komentar
14.3 Simpan data
komentar member
admin
T_komentar Info komentar
Data komentar D
a ta
k ome
nt ar
D at
a k
ome nt
a r
Info data komentar In
fo da
ta k
o men
tar
Inf o
dat a
k om
en ta
r Data komentar
Info data komentar
Gambar III-14 DFD Level 1 Proses 14
3.3.2.11 DFD Level 2 Proses 1.3 Validasi username dan password
1.3.1 Validasi
username dan password
admin 1.3.2
Validasi username dan
password member
admin member
T_admin T_member
Data akun admin Info akun admin
Data login admin Info login validinvalid
Data login member Info login validinvalid member
Data akun member Info akun member
Gambar III-15 DFD Level Proses 1.3
3.3.2.12 DFD Level 2 Proses 2.2 Validasi Data Lupa Password
2.2.1 Validasi data
lupa password member
member
T_member Data lupa password member
Info password baru member
D a
ta lupa
p as
s w
or d
m emb
er Inf
o p
as s
w or
d b
ar u
m emb
er
Gambar III-16 DFD Level 2 Proses 2.2
3.3.2.13 DFD level 2 Proses 3.1 Pengolahan Data Produk
3.1.1 Tambah
Produk
3.1.2 Edit Produk
3.1.3 Hapus Produk
admin T_produk
Data produk Info data produk
Info data produk Data produk
Data produk Info data produk
Data produk Data produk
Data produk Data produk
Data produk Data produk
Gambar III-17 DFD Level 1 Proses 3.1
3.3.2.14 DFD Level 2 Proses 3.2 Pengolahan Data Detail Produk
3.2.1 Tambah Detail
Produk
3.2.2 Edit Detail
Produk
3.2.3 Hapus Detail
Produk admin
T_detail_produk Data detail produk
Info data detail produk
Info data detail produk Data detail produk
Data detail produk Info data detail produk
Data detail produk Data detail produk
Data detail produk Data detail produk
Data detail produk Data detail produk
Gambar III-18 DFD Level 1 Proses 3.2
3.3.2.15 DFD Level 2 Proses 3.3 Pengolahan Data Kategori
3.3.1 Tambah
Kategori
3.3.2 Edit Kategori
3.3.3 Hapus
Kategori admin
T_kategori Data kategori
Info data kategori
Info data kategori Data kategori
Data kategori Info data kategori
Data kategori Data kategori
Data kategori Data kategori
Data kategori Data kategori
Gambar III-19 DFD Level 2 Proses 3.3
3.3.2.16 DFD Level 2 Proses 3.5 Pengolahan Data Kota
3.5.1 Tambah Kota
3.5.2 Edit Kota
admin T_kota
Data kota Info kota
Info kota Data kota
Data kota Data kota
Data kota Data kota
Gambar III-20 DFD Level 2 Proses 3.5
3.3.2.17 DFD Level 2 Proses 3.6 Pengolahan Data Provinsi
3.6.1 Tambah
Provinsi
3.6.2 Edit Provinsi
admin T_provinsi
Data provinsi Info provinsi
Info provinsi Data provinsi
Data provinsi Data provinsi
Data provinsi Data provinsi
Gambar III-21 DFD Level 2 Proses 3.6
3.3.2.18 DFD Level 2 Proses 3.8 Pengolahan Data Komentar
member
admin 3.8.1
Input data komentar
3.8.2 Cek data
komentar
3.8.3 Tampil data
komentar T_komentar
Data komentar Info data komentar
Info data komentar Data komentar
Data komentar Info data komentar
Da ta
ko m
e n
ta r
In fo
d a
ta ko
me n
ta r
D a
ta ko
me n
ta r
In fo
d a
ta ko
me n
ta r
Gambar III-22 DFD Level 2 Proses 3.8
3.3.2.19 DFD Level 2 Proses 3.9 Pengolahan Data Laporan
3.9.2 Pengolahan
Laporan Data Penjualan
Bulanan T_pemesanan
Admin Info data penjualan
Info pemesanan Data pemesanan
Data laporan penjualan 3.9.1
Pengolahan Laporan Data
Penjualan Harian
3.9.3 Pengolahan
Laporan Data Penjualan
Tahunan Info data laporan penjualan
Data laporan penjualan Data laporan penjualan
Info data laporan penjualan Info data pemesanan
Data pemesanan
Data pemesanan Info data pemesanan
Gambar III-23 DFD Level 2 Proses 3.9
3.3.3 Spesifikasi Proses
Spesifikasi proses bertujuan untuk mendeskripsikan dari setiap fungsi proses yang disajikan pada diagram alir data. Spesifikasi proses pada alir data sistem e-
commerce adalah sebagai berikut :
Tabel III-4 Spesifikasi Proses
No Nama Proses
Keterangan
1 No Proses
1.1 Nama Proses
Isi data login admin Keterangan
Proses pengisian data login admin Source
Admin Input
Data login admin Output
Info data login admin Destination
Proses 3 Logika Proses
{Administrator input data login} Jika username dan password ada
maka tampil username dan password valid
End
2 No Proses
1.2 Nama Proses
Isi data login member Keterangan
Proses pengisian data login member Source
Member Input
Data login member Output
Info data login member Destination
Proses 8,9,10,14 Logika Proses
{ Member
input data
login} Jika username dan password ada
maka tampil username dan password valid
End
3 No Proses
1.3 Nama Proses
Validasi data login member dan admin
Keterangan Verifikasi
kesamaan inputan
UsernameE-Mail dan
Password AdminMember dengan data akun
yang ada di database. Source
Table admin member Input
Data login admin member
Ouput Info data login admin member
Destination Proses 3,8,9,10,14
Logika Proses { Admin, member memasukkan
password} Jika username dan password ada
maka akan masuk ke halaman member atau admin
Jika tidak sistem memberitahu tampil info username dan password invalid
End
4 No Proses
2.1 Nama Proses
Tampil halaman lupa password Keterangan
Menampilkan halaman lupa password member
Source Tabel member
Input Data lupa password member
Output Data lupa password member
Destination Proses 2.2
Logika Proses {member
input data
lupa password}
Jika data yang diinputkan valid dan sistem menemukan di database
maka akan terkirim notifikasi reset password
jika tidak
sistem memberitahu data tidak ada di
database.
5 No Proses
2.2 Nama Proses
Validasi data lupa password member Keterangan
Verifikasi data
lupa password
member ke database member Source
Table member Input
Data lupa password member Output
Info data lupa password member Destination
Proses 2.3 Logika Proses
{member memasukkan data lupa password}
Jika email ada maka data password baru member dibertahu sistem, jika
tidak ada sistem memberia notifikasi data tidak ditemukan dalam database.
6 No Proses
2.3 Nama Proses
Konfirmasi perubahan password Keterangan
Proses konfimasi
perubahan
password member Source
Table admin Input
Info akun member Output
Info akun member Destination
Proses 8,9,10,14 Logika Proses
{member memasukkan data lupa password}
Jika email ada dalam sistem maka sistem akan memeberikan konfirmasi
jika tidak sistem memberitahu bahwa data tersebut tidak ada dalam sistem.
7 No Proses
3.1 Nama Proses
Pengolahan data produk Keterangan
Pengololaan data produk, tambah, edit dan hapus produk
Source Admin
Input Data produk
Output Info data produk
Destination Proses 3.1.1, 3.1.2, 3.1.3
Logika Proses {admin} Jika admin berhasil login
maka akan tampil halaman admin, diantaranya form pengolahan produk
maka
admin dapat
melakukan tambah, edit dan hapus produk.
8 No Proses
3.2 Nama Proses
Pengolahan data detail produk Keterangan
Pengolahan data
detail produk,
tambah, edit , dan hapus detail produk Source
Admin Input
Data detail produk Output
Info data detail produk Destination
Proses 3.2.1, 3.2.2, 3.2.3 Logika Proses
{ admin} Jika admin berhasil login atau ogin admin valid maka admin
dapat mengelola detail produk seperti tambah, edit dan hapus.
9 No Proses
3.3 Nama Proses
Pengolahan data kategori Keterangan
Pengelolaan data kategori, tambah, edit dan hapus kategori
Source Admin
Input Data kategori
Output Info data kategori
Destination Proses 3.3.1, 3.3.2, 3.3.3
Logika Proses {admin} Jika login sebagai admin
valid, maka admmin dapat melakukan pengolahan data kategori seperti
tambah, edit dan hapus.
10 No Proses
3.4 Nama Proses
Pengolahan data member Keterangan
Pengelolaan data member Source
Admin Input
Info member Output
Info member Destination
- Logika Proses
{admin}Jika login sebagai admin valid maka admin dapat melihat data
member, admin dapat menghapus data member.
11 No Proses
3.5 Nama Proses
Pengolahan data kota Keterangan
Pengelolaan data kota, tambah dan edit data kota
Source Admin
Input Data kota
Output Info data kota
Destination Proses 3.5.1, 3.5.2
Logika Proses {admin}Jika login sebagai admin
valid maka admin dapat melihat data member, admin dapat menghapus
data member.
12 No Proses
3.6 Nama Proses
Pengolahan data provinsi Keterangan
Pengelolaan data provinsi, tambah dan edit provinsi
Source Admin
Input Data provinsi
Output Info data provinsi
Destination Proses 3.6.1, 3.6.2
Logika Proses {admin}Jika login valid maka admin
dapat melakukan tambah, edit dan hapus provinsi dari table provinsi.
13 No Proses
3.7 Nama Proses
Pengolahan data pemesanan Keterangan
Pengelolaan data pemesanan member dan pengunjung
Source Pemesanan
Input Info pemesanan
Output Info pemesanan
Destination -
Logika Proses {admin} Jika login sebagai admin
valid, admin
mendapatkan info
pemesanan yang berasal dari table pemesanan.
15 No Proses
4.0 Nama Proses
Lihat produk Keterangan
Tampil produk tersedia Source
Produk Input
Info produk Output
Info produk Destination
Logika Proses {member, pengunjung}
Tampil data produk yang berasal di database
16 No Proses
5.0 Nama Proses
Lihat Kategori Keterangan
Tampilan produk menurut kategori Source
Kategori Input
Info Kategori Output
Info kategori Destination
Logika Proses {member, pengunjung}
Tampil data kategori yang berasal dati database
17 No Proses
6.1 Nama Proses
Input data pencarian Keterangan
Proses input data pencarian produk Source
Memberpengunjung Input
Data pencarian Output
Info data pencarian Destination
Proses 6.2 Logika Proses
No Proses 6.2
Nama Proses Pencarian data
Keterangan Proses pencarian data ang diinputkan
oleh member pengunjung Source
Proses 6.1 input data pencarian Input
Data pencarian
18 Output
Info pencarian data Destination
Proses 6.3 Logika Proses
{member, pengunjung}
Menginputkan data pencarian, maka sistem mencari data cari tersebut, lalu
menampilkan data pencarian jika ada.
19 No Proses
7.1 Nama Proses
Input data registrasi Keterangan
Pengisian data registrasi pengunjung yang ingin menjadi member
Source Pengunjung
Input Data registrasi
Output Info data registrasi
Destination Proses 7.2
Logika Proses { pengunjung}
Talmpil form pengisian registrasi, input data registrasi.
20 No Proses
7.2 Nama Proses
Validasi data registrasi Keterangan
Verifikasi data registrasi pengunjung ke database member
Source Proses 7.1 input data registrasi
Input Info registrasi
Output Info registrasi
Destination Proses 7.3
Logika Proses {pengunjung} Input data registrasi,
jika input data valid maka sistem menyimpan ke table member jika
tidak
sistem meberitahu
untuk registrasi ulang.
21 No Proses
7.3 Nama Proses
Kirim verifikasi email Keterangan
Pengkonfirmasian via
email mengenai registrasi berhasil tidak
Source Table member
Input Info verifikasi email
Output Info verifikasi email
Destination -
Logika Proses {pengunjung} Jika data registrasi
valid dan
berhasil melakukan
registrasi maka
sistem akan
memberitahu melalui email No Proses
8.1
22 Nama Proses
Upload photo Keterangan
Fasilitas member yang digunakan untuk upload photo member
Source Member
Input Data photo
Output Info data photo
Destination Proses 8.2
Logika Proses Begin
{member} If login member valid
Then fasilitas upload photo Else tampil photo pojok narsis
End
23 No Proses
8.2 Nama Proses
Tampil halaman foto Keterangan
Upload photo berhasil maka akan menampilkan halaman photo di pojok
narsis
Source Proses 8.1
Input Info halaman photo
Output Info halaman photo
Destination Logika Proses
Begin {member}
If login member valid Then fasilitas upload photo
Else tampil photo pojok narsis End
24 No Proses
9.0 Nama Proses
Upload desain Keterangan
Fasilitas member untuk mengupload desain produknya
Source Member
Input Data upload desain
Output Info data upload desain
Destination -
Logika Proses Begin
{member} If login member valid
Then fasilitas upload photo Else tampil photo pojok narsis
End
No Proses 10.0
Nama Proses Rate produk
25 Keterangan
Fasilitas member untuk member rating pada produk
Source Member
Input Data rate produk
Output Info rate produk
Destination -
Logika Proses Begin
{member} If login member valid
Then fasilitas rate produk Else tampil rate produk
End
26 No Proses
11.1 Nama Proses
Input pemesanan Keterangan
Penginputan pemesanan
oleh pengunjung ataupun member
Source Memberpengunjung
Input Data pemesanan
Output Info data pemesanan
Destination Proses 11.2, 11.3, 11.4, 11.5
Logika Proses Begin
{memberpengunjung} Tampil data produk yang dipesan
End
27 No Proses
11.2 Nama Proses
Tambah items Keterangan
Penambahan items belanja untuk memberpengunjung yang membeli
lebih dari satu produk
Source Memberpengunjung
Input Data produk
Output Info produk
Destination Proses 11.3, 11.4, 11.5
Logika Proses Begin
{memberpengunjung} If tambah pesanan
Then tampil data pesanan End
No Proses 11.3
Nama Proses Delete items
Keterangan Proses menghapus data pesanan
Source Memberpengunjung
Input Data pesanan inputan
28 Output
Data pesanan Destination
Proses 11.4, 11.5 Logika Proses
Begin {memberpengunjung}
If delete items Then tampil data pesanan
End
29 No Proses
11.4 Nama Proses
Check out Keterangan
Checkout dari memesan produk lalu disimpan ke dalam database pesanan
dan dilanjutkan
dengan proses
pembayaran Source
Memberpengunjung Input
Data pemesanan Output
Info data pemesanan Destination
Proses 11.5 Logika Proses
Begin {memberpengunjung}
If check out pesanan Then tampil data pesanan
End
30 No Proses
11.5 Nama Proses
Tampil data pesanan Keterangan
Menampilkan data pesanan yang sudah pasti untuk dilanjutkan ke
proses pembayaran
Source Table pemesanan
Input Data pemesanan
Output Info data pemesanan
Destination Proses 12.1, 12.2, 12.3, 12.4
Logika Proses Begin
{memberpengunjung} Tampil data pesanan
End
31 No Proses
12.1 Nama Proses
Input data pembayaran Keterangan
Proses konfirmasi pembayaran ke sistem oleh memberpengunjung
Source Memberpengunjung
Input Data pembayaran
Output Info data pembayaran
Destination Proses 12.2, 12.3, 12.4
Logika Proses Begin
{memberpengunjung} Input data pembayaran
If input berhasil Then data pembayaran valid
Else data pembayaran invalid end
32 No Proses
12.2 Nama Proses
Pembayaran online Keterangan
Proses ketika pembeli memilih untuk melakukan pembayaran secara online
Source Table pemesanan dan Proses 12.1
input pembayaran Input
Data pembayaraninfo pembayaran Output
Data pembayaranvalidinfo
pembayaran Destination
Proses 12.3,12.4 Logika Proses
Begin {memberpengunjung}
Input data pembayaran If input berhasil
Then data pembayaran valid Else data pembayaran invalid
End
33 No Proses
12.3 Nama Proses
Pembayaran offline Keterangan
Proses ketika pembeli memilih untuk melakukan pembayaran offline
Source Proses 8.1 input pembayaran storage
pemesanan Input
Data pembayaran input Output
Data pembayaran Destination
12.4 Logika Proses
-
34 No Proses
12.4 Nama Proses
Tampil data pembayaran Keterangan
Menampilkan data pembayaran Source
Admin Input
Info pembayaran Output
Data konfirmasi
pembayaran inputaninfo pembayaran
Destination -
Logika Proses Begin
{memberpengunjung} If data pembayaran valid
Then tampil data pembayaran Else ulangi input
End
35 No Proses
13.1 Nama Proses
Tampil data pengiriman Keterangan
Menampilkan status pengiriman Source
Admin Input
Data pengirimanInfo pengiriman Output
Info pengiriman Destination
Proses 13.2 Logika Proses
Begin {admin}
Tampil data pengiriman End
36 No Proses
13.2 Nama Proses
Update status pengiriman Keterangan
Proses peng-updatean
status pengiriman
Source Proses 13.1 tampil data pengiriman
Input Info pengiriman
Output Info pengiriman status
Destination Table pengiriman
Logika Proses Begin
{memberpengunjung} End
37 No Proses
14.1 Nama Proses
Input data komentar Keterangan
Proses menginputkan data komentar Source
Member Input
Data komentar Output
Data komentarvalid Destination
Proses 14.2, 14.3 Logika Proses
Begin {member}
If login valid Then input data komentar
Else ulangi login End
38 No Proses
14.2 Nama Proses
Cek data komentar Keterangan
Proses validasi data komentar
Source Member
Input Data komentar
Output Data komentar valid
Destination Proses 14.3
Logika Proses Begin
{admin} If data komentar valid
Then post komentar Else delete komentar
End
39 No Proses
1.3.1 Nama Proses
Validasi username dan password admin
Keterangan Proses
verifikasi username
dan password admin
Source Table admin
Input Data login
Output Info data login validinvalid
Destination Proses 3.0
Logika Proses Begin
{admin} If login admin valid
Then menu admin Else ulangi login
End
40 No Proses
1.3.2 Nama Proses
Validasi username dan password member
Keterangan Proses
verifikasi username
dan password member
Source Table member
Input Data login
Output Info data login validinvalid
Destination Proses 3.0
Logika Proses Begin
{member} If login member valid
Then menu member Else ulangi login
End
41 No Proses
2.2.1 Nama Proses
Validasi data lupa password member Keterangan
Proses verifikasi lupa password member
Source Table member
Input Data lupa password
Output Info data lupa password
Destination Proses 2.3
Logika Proses Begin
{member} If data lupa password valid
Then verifikasi password baru Else ulangi validasi
End
42 No Proses
3.1.1 Nama Proses
Tambah produk Keterangan
Proses penambahan produk oleh admin
Source Admin
Input Data produk
Output Info data produk
Destination Proses 3.1
Logika Proses Begin
{admin} If login valid
Then tambah produk Else batal ulangi kembali
End
43 No Proses
3.1.2 Nama Proses
Edit produk Keterangan
Proses pengeditan produk oleh admin Source
Admin Input
Data produk Output
Info produk Destination
Proses 3.1 Logika Proses
Begin {admin}
If login valid Then edit produk
Else batal ulangi kembali End
44 No Proses
3.1.3 Nama Proses
Hapus produk Keterangan
Proses penghapusan produk oleh admin
Source Admin
Input Data produk
Output Info produk
Destination Proses 3.1
Logika Proses Begin
{admin} If login valid
Then tambah produk Else batal ulangi kembali
End
45 No Proses
3.2.1 Nama Proses
Tambah detail produk Keterangan
Proses penambahan detail produk oleh admin
Source Admin
Input Data detail produk
Output Info data detail produk
Destination Proses 3.2
Logika Proses Begin
{admin} If login valid
Then tambah detail produk Else batal ulangi kembali
End
46 No Proses
3.2.2 Nama Proses
Edit detail produk Keterangan
Proses pengeditan detail produk oleh admin
Source Admin
Input Data detail produk
Output Info data detail produk
Destination Proses 3.2
Logika Proses Begin
{admin} If login valid
Then edit detail produk Else batal ulangi kembali
End
47 No Proses
3.2.3 Nama Proses
Hapus detail produk Keterangan
Proses penghapusan detail produk oleh admin
Source Admin
Input Data detail produk
Output Info data detail produk
Destination Proses 3.2
Logika Proses Begin
{admin} If login valid
Then hapus detail produk Else batal ulangi kembali
End
48 No Proses
3.3.1 Nama Proses
Tambah kategori Keterangan
Proses tambah kategori oleh admin Source
Admin Input
Data kategori Output
Info kategori Destination
Proses 3.3 Logika Proses
Begin {admin}
If login valid Then tambah kategori
Else batal ulangi kembali End
49 No Proses
3.3.2 Nama Proses
Edit kategori Keterangan
Proses pengeditan kategori oleh admin
Source Admin
Input Data kategori
Output Info kategori
Destination Proses 3.3
Logika Proses Begin
{admin} If login valid
Then edit kategori Else batal ulangi kembali
End
50 No Proses
3.3.1 Nama Proses
Hapus kategori Keterangan
Proses hapus kategori oleh admin Source
Admin Input
Data kategori Output
Info kategori Destination
Proses 3.3 Logika Proses
Begin {admin}
If login valid Then hapus kategori
Else batal ulangi kembali End
51 No Proses
3.5.1 Nama Proses
Tambah kota Keterangan
Proses tambah kota oleh admin Source
Admin Input
Data kota Output
Info kota Destination
Proses 3.5 Logika Proses
Begin {admin}
If login valid Then tambah kota
Else batal ulangi kembali End
52 No Proses
3.5.2 Nama Proses
Edit kota Keterangan
Proses edit kota oleh admin Source
Admin Input
Data kota Output
Info kota Destination
Proses 3.5 Logika Proses
Begin {admin}
If login valid Then edit kota
Else batal ulangi kembali End
53 No Proses
3.6.1 Nama Proses
Tambah provinsi Keterangan
Proses tambah provinsi oleh admin Source
Admin Input
Data provinsi Output
Info provinsi Destination
Proses 3.6 Logika Proses
Begin {admin}
If login valid Then tambah provinsi
Else batal ulangi kembali End
54 No Proses
3.6.2 Nama Proses
Edit provinsi Keterangan
Proses edit provinsi oleh admin Source
Admin Input
Data provinsi Output
Info provinsi Destination
Proses 3.6 Logika Proses
Begin {admin}
If login valid Then edit provinsi
Else batal ulangi kembali End
55 No Proses
3.8.1 Nama Proses
Input komentar Keterangan
Proses penginputan data komentar Source
Member Input
Data komentar Output
Info komentar Destination
Proses 3.8 Logika Proses
Begin {member}
If login valid Then input data komentar
Else batal ulangi kembali End
56 No Proses
3.8.2 Nama Proses
Cek data komentar Keterangan
Proses pengecekan data komentar oleh admin
Source Admin
Input Data komentar
Output Info komentar
Destination Proses 3.8
Logika Proses Begin
{admin} If login valid
Then cek data komentar Else batal ulangi kembali
End
57 No Proses
3.8.3 Nama Proses
Tampil data komentar Keterangan
Proses menampilkan data komentar
Source Tabel komentar
Input Data komentar
Output Info komentar
Destination Proses 3.8
Logika Proses Begin
tampil data komentar End
58 No Proses
3.9.1 Nama Proses
Tambah ongkir Keterangan
Proses penambahan data ongkir oleh admin
Source Admin
Input Data ongkir
Output Info data ongkir
Destination Proses 3.9
Logika Proses Begin
{admin} If login valid
Then tambah data ongkir Else batal ulangi kembali
End
59 No Proses
3.9.2 Nama Proses
Edit ongkir Keterangan
Proses pengeditan data ongkir oleh admin
Source Admin
Input Data ongkir
Output Info data ongkir
Destination Proses 3.9
Logika Proses Begin
{admin} If login valid
Then edit data ongkir Else batal ulangi kembali
End
60 No Proses
3.10.1 Nama Proses
Pengolahan Laporan Data Penjualan Harian
Keterangan Proses pengolahan laporan data
penjualan oleh admin Source
Table pemesanan Input
Tanggal penjualan Output
Info laporan data penjualan harian
Destination Proses 3.10
Logika Proses If login valid
Then tampil laporan data penjualan harian
Else batal ulangi kembali End
61 No Proses
3.10.2 Nama Proses
Pengolahan Laporan Data Penjualan Bulanan
Keterangan Proses pengolahan laporan data
penjualan oleh admin Source
Table pemesanan Input
Bulan penjualan Output
info laporan data penjualan Destination
Proses 3.10 Logika Proses
If login valid Then tampil laporan data penjualan
bulanan Else batal ulangi kembali
End
62 Nama Proses
Pengolahan Laporan Data Penjualan Tahunan
Keterangan Proses pengolahan laporan data
penjualan oleh admin Source
Table pemesanan Input
Tahun penjualan Output
info laporan data penjualan Destination
Proses 3.10 Logika Proses
If login valid Then tampil laporan data penjualan
tahunan Else batal ulangi kembali
End
3.3.4 Kamus Data
Kamus data merupakan katalog tempat penyimpanan dari elemen-elemen yang berada dalam suatu sistem. Kamus data mempunyai fungsi yang sama dalam
pemodelan sistem dan juga berfungsi membantu pelaku sistem untuk mengerti aplikasi secara detail dan mengorganisasi semua elemen data yang digunakan
dalam sistem sehingga pemakai dan penganalisa sistem punya dasar pengertian yang sama tentang masukan, keluaran, penyimpanan dan proses.
Kamus data dibuat berdasarkan alur data yang ada di data flow diagram. Arus data yang ada di data flow diagram bersifat global, hanya ditunjukan arus datanya
saja. Kamus data yang terdapat pada sistem pada tabel berikut :
Tabel III-5 Kamus Data
No Kamus
Keterangan
1 Nama aliran data
Data login admin Where how used
Admin Proses 1.1, 1.3
Keterangan Admin melakukan login yang berisi data admin
Struktur data Emailusername + password
Email Password
[A-Z | a-z | 0-9 | simbol] [A-Z | a-z | 0-9]
2 Nama aliran data
Data login member Where how used
Member Proses 1.2, 1.3, 1.3.1, 1.3.2
Keterangan Member melakukan login yang berisi data login
member Struktur data
Emailusername + password Username
Password [A-Z | a-z | 0-9 | simbol]
[A-Z | a-z | 0-9]
3 Nama aliran data
Data produk Where how used
Admin Proses 3.1, 3.1.1, 3.1.2, 3.1.3
Keterangan Admin memperbaharui data produk
Struktur data Id_produk + nama_produk + deskripsi + gambar +
id_kategori Id_produk
Nama_produk [A-Z | a-z | 0-9]
[A-Z | a-z]
Deskripsi Harga
Diskon Gambar
Id_kategori [A-Z | a-z | 0-9]
[0-9] [0-9]
[A-Z | a-z | 0-9] [A-Z | a-z | 0-9]
4 Nama aliran data
Data detail produk Where how used
Admin Proses 3.2, 3.2.1, 3.2.2, 3.2.3
Keterangan Admin memperbaharui data detail produk
Struktur data Id_detail_produk + warna + ukuran + harga + stok +
berat + diskon + gambar + id_produk Id_detail_produk
Warna Ukuran
Stok Berat
Id_produk [A-Z | a-z | 0-9]
[A-Z | a-z] [A-Z | a-z]
[0-9] [0-9]
[A-Z | a-z | 0-9]
5 Nama aliran data
Data kategori Where how used
Admin Proses 3.3, 3.3.1, 3.3.2, 3.3.3
Keterangan Admin memperbaharui data kategori
Struktur data Id_kategori + nama_kategori + keterangan
Id_kategori Nama_kategori
Keterangan [A-Z | a-z | 0-9]
[A-Z | a-z] [A-Z | a-z]
6 Nama aliran data
Data kabkota Where how used
Admin Proses 3.5, 3.5.1, 3.5.2
Keterangan Berisi data kabkota
Struktur data Id_kabkota + nama_kota + id_provinsi
Id_kabkota Nama_kota
Id_provinsi [0-9]
[A-Z | a-z] [0-9]
7 Nama aliran data
Data provinsi Where how used
Admin Proses 3.6, 3.6.1, 3.6.1
Keterangan Berisi data provinsi
Struktur data Id_provinsi + nama_prov
Id_provinsi Nama_prov
[0-9] [A-Z | a-z]
8 Nama aliran data
Data ongkir Where how used
Admin Proses 3.9, 3.9.1, 3.9.2
Keterangan Berisi data ongkir
Struktur data Id_kabkota + harga + paket
Id_kabkota Id_kecamatan
Kecamatan Harga
Paket [0-9]
[0-9] [A-Z | a-z]
[0-9] [A-Z | a-z | 0-9]
9 Nama aliran data
Data pemesanan Where how used
Admin Proses 3.7, 11, 11.1, 11.2, 11.3, 11.4, 11.5
Keterangan Berisi data pemesanan
Struktur data Id_pemesanan + tgl_pesan + nama + alamat + paket +
id_kabkota No_pesanan
Id_detai_produk Id_member
Tgl_pesan Nama_produk
Nama_tujuan Alamat
Id_kabkota Paket
Harga [0-9]
[A-Z | a-z | 0-9] [A-Z | a-z]
[0-9] [A-Z | a-z]
[A-Z | a-z] [A-Z | a-z | 0-9]
[0-9] [A-Z | a-z | 0-9]
[0-9]
Ukuran Jumlah
Status_order [0-9]
[0-9] [A-Z | a-z ]
10 Nama aliran data
Data pembayaran Where how used
Admin Proses 12.0
Keterangan Berisi data pembayaran
Struktur data Id_pembayaran + no_pesanan + no_transaksi +
total_bayar + tgl_bayar + status Id_pembayaran
No_pesanan No_transaksi
No_rekening Bank
Tgl_bayar Status
[0-9] [0-9]
[0-9] [0-9]
[A-Z |a-z] [0-9]
[A-Z | a-z]
11 Nama aliran data
Data pengiriman Where how used
Admin Proses 13.0
Keterangan Berisi data jasa pengiriman
Struktur data Id_pesanan + no_resi + tgl_kirim + status
no_pesanan No_resi
Tgl_kirim Tgl_diterima
Nam_penerima Status
[0-9] [0-9]
[0-9] [0-9]
[A-Z | a-z] [A-Z | a-z]
12 Nama aliran data
Data komentar Where how used
Member, admin Proses 14, 14.1, 14.2, 14.3
Keterangan Berisi data komentar
Struktur data Id_komentar + id_member + tgl_komentar + komentar
Id_komentar [A-Z | a-z | 0-9]
Nama Tgl_komentar
Komentar Email
[A-Z | a-z | 0-9] [0-9]
[A-Z | a-z | 0-9 | simbol ] [A-Z | a-z | 0-9 | simbol ]
13 Nama aliran data
Data upload desain Where how used
Admin, member Proses 9.0
Keterangan Berisi data upload desain dari member
Struktur data Id_member + gambar + keterangan + statusa
Id_member Id_desain
Gambar Keterangan
Status [A-Z | a-z | 0-9]
[0-9] [A-Z | a-z | 0-9]
[A-Z | a-z | 0-9] [A-Z | a-z ]
14 Nama aliran data
Data pojok narsis Where how used
Admin, member Proses 8, 8.1, 8.2
Keterangan Berisi data foto member yangdi upload ke sistem di
dalam fasilitas member Struktur data
Id_member + foto+status Id_member
Foto Status
[A-Z | a-z | 0-9] [A-Z | a-z | 0-9]
[A-Z | a-z ]
15 Nama aliran data
Data rate produk Where how used
Admin, member Proses 10.0
Keterangan Berisi data rate produk yang member berikan untuk
produk tertentu Struktur data
Id_member +
id_produk +
rate_produk+total_rater+tgl_rate Id_produk
rate_produk Total_rate
[A-Z | a-z | 0-9] [0-9]
[0-9]
Tgl_rate Total_rater
[0-9 [0-9]
16 Nama aliran data
Data Retur Where how used
Admin, member Proses 10.0
Keterangan Berisi data rate produk yang member berikan untuk
produk tertentu Struktur data
Id_member + id_produk + rate_produk No_retur
Tgl_retur No_pesanan
Jumlah Id_produk
Id_detail_produk [0-9]
[0-9] [0-9]
[0-9] [A-Z | a-z | 0-9]
[A-Z | a-z | 0-9]
3.4 Perancangan
Tahap perancangan merupakan kelanjutan dari proses analisis dimana dilakukan perubahan-perubahan terhadap sistem yang sedang berjalan. Hal ini
dilakukan untuk mengatasi kekurangan yang ada, memudahkan pekerjaan yang dilkukan oleh orang yang terlibat dan menghemat waktu pekerjaan.
3.4.1 Perancangan Skema Relasi
Skema relasi merupakan rangkaian hubungan antara dua tabel atau lebih pada sistem database. Gambar berikut merupakan penjelasan rangkaian database
pada sistem e-commerce :
Gambar III-24 Skema Relasi
3.4.2 Perancangan Struktur Tabel
Struktur tabel merupakan isi data yang berada dalam satu record pada satu tabel. Struktur tabel dalam sistem e-commerce pada toko Osmoes Kaos Muslimah
adalah :
Tabel III-6 Tabel Admin
Nama Tabel : Admin Primary Key : Username
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Email Varchar
30 PK
PK Password
Varchar 50
- Not null
Tabel III-7 Tabel Member
Nama Tabel : Member Primary Key : username
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Username Varchar
20 PK
Not null Password
Varchar 50
- Not null
Email Varchar
30 -
Not null Nama
Varchar 30
- Not null
Alamat Varchar
50 -
Not null Kode Pos
Integer 5
- Not Null
NoHp Integer
13 -
Not null Kode pos
Integer 5
- Not null
Id_proov Integer
10 FK
FK Id_kabkota
Integer 10
FK FK
Nama Tabel : Counter Primary Key : id_produk
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_produk Varchar
30 FK
FK Dilihat
Integer 10
- Not null
Dibeli Integer
10 -
-
Tabel III-8 Tabel Kota
Nama Tabel : Kabkota Primary Key : id_kabkota
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_kabkkota Integer
10 PK
PK Nama_kota
Varchar 20
- Not null
Id_provinsi Integer
10 FK
FK
Nama Tabel : kurs Primary Key : id_kurs
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_kurs Varchar
3 PK
PK Kurs_sekarang
Integer 11
- Not null
Tabel III-9 Tabel Provinsi
Nama Tabel : Provinsi Primary Key : id_provinsi
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_provinsi Integer
10 PK
PK Nama_prov
Varchar 20
- Not null
Tabel III-10 Tabel Produk
Nama Tabel : Produk Primary Key : id_produk
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_produk Varchar
20 PK
PK Nama
Varchar 20
- Not null
Harga Integer`
10 -
Not null Diskon
Double -
- -
Deskripsi Varchar
30 -
Not null Id_kategori
Varchar 20
FK FK
Gambar Text
- -
Not nul
Tabel III-11 Tabel Detail Produk
Nama Tabel : Detail Produk Primary Key : id_detail_produk
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_detail_produk Varchar 20
PK PK
Id_produk Varchar
20 FK
FK Warna
Varchar 20
- Not null
Ukuran Varchar
5 -
Not null Stok
Double -
Not null
Tabel III-12 Tabel Kategori
Nama Tabel : Kategori Primary Key : id_kategori
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_kategori Varchar
20 PK
PK Nama
Varchar 20
- Not null
Keterangan Varchar
30 -
-
Tabel III-13 Tabel Pesanan
Nama Tabel : Pesanan Primary Key : id_pesanan
Nama Field Tipe Data
Ukuran Kunci
Keterangan
No_pesanan Varchar
20 PK
PK Id_detail_produk Varchar
30 FK
Not null Id_produk
Varchar 30
FK FK
Tgl_pesan Date
- -
Not null Nama
Varchar 20
- Not null
Alamat Varchar
30 -
Not null Paket
Varchar 20
- Not null
Kode pos Int
5 -
Not null
Harga Integer
11 -
Not null Ongkir
Integer 11
- Not null
Jumlah Integer
3 -
Not null Status_order
Varcar 30
- Not null
Id_kabkota Integer
10 FK
FK Id_member
Integer 10
FK,AI FK, AI
Tabel III-14 Tabel Order Temporary
Nama Tabel : Order_temp Primary Key : id_order_temp
Foreign Key : id_produk, id detail_produk
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_order_temp Varchar
32 PK
PK Id_produk
Varchar 10
FK FK
Id_detail_produk Varchar 2
FK FK
Nama_produk Varchar
Jmlh_brg Integer
3 -
Not null Harga
Integer 10
- Not null
Total_harga Integer
10 -
Not null Waktu
Time -
- -
Batas Waktu Time
- -
-
Tabel III-15 Tabel Pembayaran
Nama Tabel : Pembayaran Primary Key : id_pembayaran
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_pembayaran Varchar
20 PK
PK Id_pesanan
Varchar 20
FK FK
No_transaksi Integer
10 -
- Tgl_bayar
Date -
- Not null
Tgl_dibayar Date
- -
-
Total_Bayar Integer
11 -
- Status
Varchar 20
- -
Tabel III-16 Tabel Pengiriman
Nama Tabel : Pengiriman Foreign Key : id_pesanan, id_kabkota
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_pesanan Varchar
20 FK
FK Id_kabkota
Integer 10
FK FK
Tgl_kirim Date
- -
- No_resi
Integer 20
- Not null
Tgl_diterma Date
- -
- Nama_penerma
Varchar 30
- -
Status Varchar
20 -
-
Tabel III-17 Tabel Kecamatan
Nama Tabel : Kecamatan Foreign Key : id_kabkota
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_kabkota Integer
10 FK
FK Nama_kecamatan Varchar
20 -
Not null Id_kecamatan
Integer 10
- Not null
Reg integer
11 -
- Oe
integer 11
- -
Id_kiriman Varchar
10 -
-
Tabel III-18 Tabel Komentar
Nama Tabel : Komentar Primary Key : id_komentar
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_komentar Integer
11 PK, AI
PK, AI email
Varchar 30
- Not Null
Tgl_komentar Date
- -
Not null Komentar
Varchar 200
- Not Null
Tabel III-19 Tabel Rate Produk
Nama Tabel : Rate Produk Foreign Key : id_produk
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_produk Varchar
20 FK
FK Tgl_rate
Date -
- -
Total_rate Integer
3 -
Not null Total_rater
Integer 3
- Not null
Tabel III-20 Tabel Pojok Narsis
Nama Tabel : Pojok Narsis Foreign Key : id_member
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_member Varchar
20 FK
FK Foto
Text -
- Not null
Status Enum
- -
Default Tidak
Tabel III-21 Tabel Upload Desain
Nama Tabel : Upload Desain Foreign Key : id_member
Nama Field Tipe Data
Ukuran Kunci
Keterangan
Id_desain Varchar
20 PK
PK Id_member
Integer 10
FK FK
Gambar Text
- -
Not null
Keterangan Varchar
30 -
Not null Status
Enum -
- Default Tidak
3.5 Perancangan Arsitektur
Setelah melakukan perancangan data pada sistem yang dibangun, maka dilakukanlah perancangan arsitektur. Perancangan arsitektur yang telah dibuat
meliputi beberapa perancangan diantaranya perancangan struktur menu, spesifikasi antarmuka, perancangan keluaran dan jaringan semantik.
3.5.1 Perancangan Struktur Menu
Perancangan struktur menu berisi menu dan subtema yang berfungsi memudahkan Member dalam menggunakan sistem. Menu tersebut dibagi
berdasarkan hak akses masing-masing Member. Berikut ini gambaran mengenai struktur menu Model Sistem e-commerce :
4. Struktur Menu Pengunjung
Struktur menu pengunjung terdiri dari Home, Ikutan Nyok, Komunitas, Cara Pemesanan, Info, Promo Produk, Keranjang Belanja,
Registrasi. Berikut gambar struktur menu untuk pengunjung :
Model menu pengunjung pada
toko osmoes kaos muslimah
Home Ikutan nyok
Komunitas Info
Promo produk Kirim desain
kamu Photo kamu
Rate vote produk
Link FB Link Twitter
Testimonial About Us
The Founder Cara
pemesanan Registrasi
Keranjang Belanja
Gambar III-25 Struktur Menu Pengunjung
5. Struktur Menu Member
Struktur menu member terdiri dari Home, Ikutan Nyok, Komunitas, Info, Promo Produk, Akun Kamu, Keranjang Belanja. Berikut gambar
struktur menu untuk member :
Model menu pengunjung pada
toko osmoes kaos muslimah
Home Ikutan nyok
Komunitas Info
Promo produk Kirim desain
kamu Photo kamu
Rate vote produk
Link FB Link Twitter
Testimonial About Us
The Founder Cara
pemesanan Akun kamu
Keranjang Belanja Edit Akun
Photo Kamu Keluar
Gambar III-26 Struktur Menu Member
6. Struktur Menu Admin
Struktur menu admin terdiri dari Home, Data Produk, Data Detail Produk, Data Kategori, Data Member, Data Pemesanan, Data
Pembayaran, Data Pengiriman, Laporan Penjualan, Backup Data, Setting, Keluar. Berikut gambar struktur menu untuk admin :
141
Model menu admin pada toko
osmoes kaos muslimah
Home Data Produk
Data Detail Produk
Data Kategori Data
Pemesanan Tambah
Produk Edit
Produk Hapus
Produk Data
Pembayaran Data
Pengiriman Setting
Tambah Detail
Produk Edit Detail
Produk Hapus
Detail Produk
Tambah Kategori
Edit Kategori
Hapus Kategori
Data Rate Produk
Data Member Data Upload
Desain Data
Komentar Data Upload
Photo Hapus
Member Edit
Pemesana n
Edit Pembayara
n Edit
Pengiriman Post
Desain Hapus
Desain Post
Komentar Hapus
Komentar Hapus
Photo Post Photo
Edit Akun Keluar
G a
m ba
r II
I- 27
Str u
k tur
M enu
Ad m
in
3.5.2 Perancangan antarmuka
Perancangan antarmuka bertujuan untuk menggambarkan aplikasi yang akan dibangun. Sehingga akan lebih mudah dalam mengimplementasikan aplikasi
serta mempermudah pembuatan perancangan antar muka yang digunakan oleh pengguna sistem. Perancangan ini diimplementasikan menjadi sebuah program
yang utuh untuk digunakan oleh pengguna sistem. Rancangan antarmuka model sistem e-commerce adalah sebagai berikut :
3.5.2.1 Perancangan antarmuka Admin
1. Perancangan antarmuka login Berikut dapat dilihat perancangan antarmuka untuk admin di halaman
login pada gambar III-29 dibawah ini :
B01 - Klik login ke halaman
administrastor B02
Username : Password :
Login
Login Nama Layar
: B01 Ukuran Layar
: 1024 x 640 Font
: Arial Warna
: Putih
Gambar III-28 Halaman Login Admin
2. Perancangan Antarmuka Home
Berikut dapat dilihat perancangan antarmuka home dari pembangunan aplikasi e-commerce pada gambar III-30 dibawah ini:
B02 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02
Nama Layar : B02
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Text
Footer Data Kota
Data Provinsi Data Ongkir
Laporan Penjualan Setting
Logout
Gambar III-29 Halaman Home Admin
3. Perancangan Antarmuka Pengolahan Data Produk Berikut ini adalah halaman pengolahan data produk untuk admin, dimana
admin mengklik salah satu navigasi menu produk yang ada di aplikasi e- commerce pada gambar III-31 dibawah ini :
B02 Header
Data Produk | Data Detail Produk | Data Kategori | B03
Header - Klik login ke halaman
administrastor B02 - Klik Home menuju B02
- Klik Produk ke halaman pengolahan data produk di
B03
Nama Layar : B03
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Produk :. id_produk
: Nama
: Deskripsi
: id_kategori
: Data Produk
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tambah Reset
Id_Produk Nama
Deskripsi Id_kategori
Keterangan Detail edit hapus
Data Kota Data Provinsi
Data Ongkir Laporan Penjualan
Setting Logout
Gambar III-30 Halaman Pengolahan Data Produk
4. Perancangan Antarmuka Pengolahan Data Kategori
Berikut ini adalah halaman perancangan antarmuka pengolahan data akategori untuk admin, saat admin mengklik kategori di navigasi menu
aplikasi e-commerce yang dapat dilihat di gambar III-32 dibawah ini :
B02 Header
Data Produk | Data Detail Produk | Data Kategori | B04
Header - Klik login ke halaman
administrastor B02 - Klik Home menuju B02
- Klik Produk ke halaman pengolahan data produk di
B03 - Klik kategori ke halaman
pengolahan data kategori B04
Nama Layar : B04
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Kategori :. id_kategori
: Nama
: Keterangan
: Data Kategori
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tambah Reset
Id_Kategori Nama
Keterangan Action
Detail Edit Hapus Data Kota
Data Provinsi DataOngkir
Laporan Penjualan Setting
Logout
Gambar III-31 Halaman Pengolahan Data Kategori
5. Perancangan Antarmuka Pengolahan Data Detail Produk Berikut ini adalah perancangan antarmuka pengolahan data detail produk
untuk admin, dimana admin mengklik detail produk di navigasi menu aplikasi e-commerce yang dapat dilihat di gambar III-33 dibawah ini :
B02 Header
Data Produk | Data Detail Produk | Data Kategori | B05
Header - Klik login ke halaman
administrastor B02 - Klik Home menuju B02
- Klik Produk ke halaman pengolahan data produk di
B03 - Klik kategori ke halaman
pengolahan data kategori B04
- Klik detail produk ke halaman pengolahan data
detail produk B05
Nama Layar : B05
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Detail Produk :. id_detail_produk
: Warna
: Ukuran
: id_produk
: Harga
: Stok
: Berat
: Diskon
: Gambar
:
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tambah Reset
Data Kota Data Provinsi
Data Ongkir Laporan Penjualan
Setting Logout
Pilih Berkas Pilih Berkas
Pilih Berkas Id detail produk Warna Ukuran Harga Stok Berat Diskon Gambar Action
Detail Edit Hapus
Gambar III-32 Halaman Pengolahan Data Detail Produk
6. Perancangan Antarmuka Pengolahan Data Pemesanan Berikut ini adalah perancangan antarmuka pengolahan data pemesanan
untuk admin, dimana admin mengklik pemesanan di navigasi menu aplikasi e-commerce yang dapat dilihat di gambar III-34 dibawah ini :
B02 Header
B06 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02 - Klik Produk ke halaman
pengolahan data produk di B03
- Klik kategori ke halaman pengolahan data kategori
B04 - Klik detail produk ke
halaman pengolahan data detail produk B05
- Klik pemesanan menuju ke halaman pemesanan
B06
Nama Layar : B06
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Pemesanan :.
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Data Kota Data Provinsi
Data Ongkir Laporan Penjualan
Setting Logout
Gambar III-33 Halaman Pengolahan Data Pemesanan
7. Perancangan Antarmuka Pengolahan Data Member Berikut ini adalah perancangan antarmuka pengolahan data member untuk
admin, dimana admin mengklik member di navigasi menu aplikasi e- commerce yang dapat dilihat di gambar III-35 dibawah ini :
B02 Header
B07 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02 - Klik Produk ke halaman
pengolahan data produk di B03
- Klik kategori ke halaman pengolahan data kategori
B04 - Klik detail produk ke
halaman pengolahan data detail produk B05
- Klik pemesanan menuju ke halaman pemesanan
B06 -
Klik member
untuk menuju
ke halaman
pengolahan data member B07
Nama Layar : B07
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Member :.
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Data Kota Data Provinsi
Data Ongkir Laporan Penjualan
Setting Logout
Id_member Action detail delete
Gambar III-34 Halaman Pengolahan Data Member
8. Perancangan Antarmuka Pengolahan Data Pembayaran Berikut ini adalah perancangan antarmuka pengolahan data pembayaran
untuk admin, dimana admin mengklik pembayaran di navigasi menu aplikasi e-commerce yang dapat dilihat di gambar III-36 dibawah ini :
B02 Header
B08 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02 - Klik Produk ke halaman
pengolahan data produk di B03
- Klik kategori ke halaman pengolahan data kategori
B04 - Klik detail produk ke
halaman pengolahan data detail produk B05
- Klik pemesanan menuju ke halaman pemesanan
B06 -
Klik member
untuk menuju
ke halaman
pengolahan data member B07
- Klik pembayaran untuk menuju pengolahan data
pembayaran B08
Nama Layar : B08
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Pembayaran:.
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Data Kota Data Provinsi
Data Ongkir Laporan Penjualan
Setting Logout
Anda mempunyai request pembayaran klik disini untuk menampilkan
Gambar III-35 Halaman Pengolahan Data Pembayaran
9. Perancangan Antarmuka Pengolahan Data Kota Berikut ini adalah perancangan antarmuka pengolahan data kota untuk
admin, dimana admin mengklik data kota di navigasi menu aplikasi e- commerce yang dapat dilihat di gambar III-37 dibawah ini :
B02 Header
Data Produk | Data Detail Produk | Data Kategori | B09
Header - Klik login ke halaman
administrastor B02 - Klik Home menuju B02
- Klik Produk ke halaman pengolahan data produk di
B03 - Klik kategori ke halaman
pengolahan data kategori B04
- Klik detail produk ke halaman pengolahan data
detail produk B05 - Klik pemesanan menuju
ke halaman pemesanan B06
-
Klik member
untuk menuju
ke halaman
pengolahan data member B07
- Klik pembayaran untuk menuju pengolahan data
pembayaran B08 - Klik data kota untuk
menuju halaman
pengolahan data kota B09
Nama Layar : B09
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Kota :. id_kota
: Nama kota
: Id_Provinsi
: Data Kota
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tambah Reset
Id_Kota Nama Kota
Id_Provinsi Action
Detail Edit Data Kota
Data Provinsi DataOngkir
Laporan Penjualan Setting
Logout
Gambar III-36 Halaman Pengolahan Data Kota
10. Perancangan Antarmuka Pengolahan Data Provinsi
Berikut ini adalah perancangan antarmuka pengolahan data provinsi untuk admin, dimana admin mengklik provinsi di navigasi menu aplikasi e-
commerce yang dapat dilihat di gambar III-38 dibawah ini :
B02 Header
Data Produk | Data Detail Produk | Data Kategori | B10
Header - Klik login ke halaman
administrastor B02 - Klik Home menuju B02
- Klik Produk ke halaman pengolahan data produk di
B03 - Klik kategori ke halaman
pengolahan data kategori B04
- Klik detail produk ke halaman pengolahan data
detail produk B05 - Klik pemesanan menuju
ke halaman pemesanan B06
-
Klik member
untuk menuju
ke halaman
pengolahan data member B07
- Klik pembayaran untuk menuju pengolahan data
pembayaran B08 - Klik data kota untuk
menuju halaman
pengolahan data kota B09 - Klik data kota untuk
menuju halaman
pengolahan data provinsi B10
Nama Layar : B10
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Form Pengolahan Data Provinsi :. id_Provinsi
: Nama Provinsi
: Data Provinsi
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tambah Reset
Id_Kota Nama Kota
Action Detail Edit
Data Kota Data Provinsi
DataOngkir Laporan Penjualan
Setting Logout
Gambar III-37 Halaman Pengolahan Data Provinsi
11. Perancangan Antarmuka Pengolahan Data Laporan Harian Berikut ini adalah perancangan antarmuka pengolahan data laporan harian
untuk admin, dimana admin mengklik Laporan Penjualan lalu mengklik harian di navigasi menu aplikasi e-commerce yang dapat dilihat di gambar
III-39 dibawah ini :
B02 Header
B11 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02 - Klik Produk ke halaman
pengolahan data produk di B03
- Klik kategori ke halaman pengolahan data kategori
B04 - Klik detail produk ke
halaman pengolahan data detail produk B05
- Klik pemesanan menuju ke halaman pemesanan
B06 -
Klik member
untuk menuju
ke halaman
pengolahan data member B07
- Klik pembayaran untuk menuju pengolahan data
pembayaran B08 - Klik data kota untuk
menuju halaman
pengolahan data kota B09 - Klik data kota untuk
menuju halaman
pengolahan data provinsi B10
- Klik Laporan Penjualan maka akan muncul haria,
bulanan , tahunan, klik harian ke B11
Nama Layar : B11
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Pengolahan Data Laporan Harian :.
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tanggal Keterangan Produk
Qty Data Kota
Data Provinsi DataOngkir
Laporan Penjualan Harian
Bulanan Tahunan
Setting Logout
Tanggal : Cari
Jenis Pembayaran Total
No
Gambar III-38 Halaman Pengolahan Data Harian
12. Perancangan Antarmuka Pengolahan Data Laporan Bulanan Berikut ini adalah perancangan antarmuka pengolahan data laporan
bulanan untuk admin, dimana admin mengklik Laporan Penjualan lalu mengklik bulanan di navigasi menu aplikasi e-commerce yang dapat
dilihat di gambar III-40 dibawah ini :
B02 Header
B12 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02 - Klik Produk ke halaman
pengolahan data produk di B03
- Klik kategori ke halaman pengolahan data kategori
B04 - Klik detail produk ke
halaman pengolahan data detail produk B05
- Klik pemesanan menuju ke halaman pemesanan
B06 -
Klik member
untuk menuju
ke halaman
pengolahan data member B07
- Klik pembayaran untuk menuju pengolahan data
pembayaran B08 - Klik data kota untuk
menuju halaman
pengolahan data kota B09 - Klik data kota untuk
menuju halaman
pengolahan data provinsi B10
- Klik Laporan Penjualan maka akan muncul haria,
bulanan , tahunan, klik harian ke B11
- Klik bulanan untuk menuju halaman B12
Nama Layar : B12
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Pengolahan Data Laporan Bulanan :.
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tanggal Keterangan Produk
Qty Data Kota
Data Provinsi DataOngkir
Laporan Penjualan Harian
Bulanan Tahunan
Setting Logout
Bulan : Cari
Jenis Pembayaran Total
No
Gambar III-39 Halaman Pengolahan Data Laporan Bulanan
13. Perancangan Antarmuka Pengolahan Data Laporan Tahunan Berikut ini adalah perancangan antarmuka pengolahan data laporan
tahunan untuk admin, dimana admin mengklik Laporan Penjualan lalu mengklik tahunan di navigasi menu aplikasi e-commerce yang dapat
dilihat di gambar III-41 dibawah ini :
B02 Header
B13 Header
- Klik login ke halaman administrastor B02
- Klik Home menuju B02 - Klik Produk ke halaman
pengolahan data produk di B03
- Klik kategori ke halaman pengolahan data kategori
B04 - Klik detail produk ke
halaman pengolahan data detail produk B05
- Klik pemesanan menuju ke halaman pemesanan
B06 -
Klik member
untuk menuju
ke halaman
pengolahan data member B07
- Klik pembayaran untuk menuju pengolahan data
pembayaran B08 - Klik data kota untuk
menuju halaman
pengolahan data kota B09 - Klik data kota untuk
menuju halaman
pengolahan data provinsi B10
- Klik Laporan Penjualan maka akan muncul haria,
bulanan , tahunan, klik harian ke B11
- Klik bulanan untuk menuju halaman B12
Nama Layar : B12
Ukuran Layar : 1024 x 640
Font : Arial
Warna : Putih
.: Pengolahan Data Laporan Bulanan :.
Footer Home | Produk | Kategori | Detail Produk | Pemesanan | Member | Pembayaran
Tanggal Keterangan Produk
Qty Data Kota
Data Provinsi DataOngkir
Laporan Penjualan Harian
Bulanan Tahunan
Setting Logout
Tahun Cari
Jenis Pembayaran Total
No
Gambar III-40 Halaman Pengolahan Data Laporan Tahunan
3.5.2.2 Perancangan Antarmuka Pengunjung dan Member
1. Perancangan Antarmuka Halaman Utama Home Berikut dapat dilihat perancang antarmuka pengunjung untuk toko
osmoes kaos muslimah dapat dilihat di gambar III-42 berikut :
Nama layar : A01
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik info menuju A05 - klik Registrasi menuju
A08 - klik login menuju A09
- klik gambar produk untuk menuju form 10
- klik checkout menuju form A11
- klik detail menuju form A19
A01
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Osmoes Kids | Osmoes Remaja Dewasa | Produk Lainnya
Footer Shopping Chart
Gambar produk
Gambar produk
Gambar produk
Gambar produk
Gambar produk
Gambar produk
Gambar produk
Gambar produk
Check out | Detail
Payment Gateway Payment Offline
Logo Jasa Pengiriman
Gambar III-41 Perancangan antamuka halaman utama
2. Perancangan Antarmuka Desain Kamu berikut adalah perancangan antarmuka untuk pengunjung ketika
pengunjung atau member mengklik navigasi menu pada aplikasi e- commerce dengan nama info, dengan gambar III-43 sebagai berikut :
Nama layar : A02
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik belanja menuju A01 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik photo kamu untuk
menuju form A03 - klik testimonial untuk
menuju form A04 A02
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Desain Kamu | Photo Kamu | Testimonial
Footer Shopping Chart
Desain Rating
Desain Rating
Desain Rating
Desain Rating
Desain Rating
Desain Rating
Desain Rating
Desain Rating
Check out | Detail
Gambar III-42 Perancangan antarmuka Ikutan Nyok
3. Perancangan Antarmuka Photo Kamu Halaman ini adalah haaman ketika pengunjung memilih salah satu menu di
navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi dari menu tersebut diantaranya menu seperti gambar III-44 berikut ini :
Nama layar : A03
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik belanja menuju A01 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik desain kamu untuk
menuju form A02 - klik testimonial untuk
menuju form A04 A03
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Desain Kamu | Photo Kamu | Testimonial
Footer Shopping Chart
Photo Member Photo Member
Photo Member Photo Member
Photo Member Photo Member
Photo Member Photo Member
Check out | Detail
Gambar III-43 Perancangan Antarmuka Photo Kamu
4. Perancangan Antarmuka Testimonial Halaman ini adalah haaman ketika pengunjung memilih salah satu menu di
navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi dari menu tersebut diantaranya menu testimonial seperti gambar III-45 berikut
ini :
Nama layar : A04
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik belanja menuju A01 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik desain kamu untuk
menuju form A02 - klik photo kamu untuk
menuju form A03 A04
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Desain Kamu | Photo Kamu | Testimonial
Footer Shopping Chart
Check out | Detail
Kolom Testimonial Text
Gambar III-44 Perancangan Antarmuka Testimonial
5. Perancangan Antarmuka Tentang Kami Halaman ini adalah haaman ketika pengunjung memilih salah satu menu di
navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi dari menu tersebut diantaranya menu tentang kami seperti gambar III-46
berikut ini :
Nama layar : A05
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik the founder menuju
form A06 -klik
cara pemesanan
menuju form A07 A05
TEXT Slider Foto
Logo Belanja | Ikutan Nyok | Info | Registrasi | Login
Tentang Kami | The Founder | Cara Pemesanan |
Footer Shopping Chart
Check out | Detail
Gambar III-45 Perancangan Antarmuka Tentang Kami
6. Perancangan Antarmuka The Founder Halaman ini adalah haaman ketika pengunjung memilih salah satu menu di
navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi dari menu the founder tersebut diantaranya menu seperti gambar III-47 berikut
ini :
Nama layar : A06
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -
klik tentang
kami menuju form A05
-klik cara
pemesanan menuju form A07
A06
TEXT Slider Foto
Logo Belanja | Ikutan Nyok | Info | Registrasi | Login
Tentang Kami | The Founder | Cara Pemesanan |
Footer Shopping Chart
Check out | Detail
Foto
Gambar III-46 Perancangan Antarmuka The Founder
7. Perancangan Antarmuka Cara Pemesanan Halaman ini adalah haaman ketika pengunjung memilih salah satu menu di
navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi dari menu tersebut diantaranya cara pemesanan seperti gambar III-48 berikut
ini :
Nama layar : A07
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik the founder menuju
form A06 -klik tentang kami menuju
form A05 A07
Keterangan Gambar Slider Foto
Logo Belanja | Ikutan Nyok | Info | Registrasi | Login
Tentang Kami | The Founder | Cara Pemesanan |
Footer Shopping Chart
Check out | Detail
Gambar CaraPemesanan
Gambar III-47 Perancangan Antarmuka Cara Pemesanana
8. Perancangan Antarmuka Registrasi Halaman ini adalah halaman ketika pengunjung memilih salah satu menu
di navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi antarmuka regstrasi seperti gambar III-49 berikut ini :
Nama layar : A07
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik the founder menuju
form A06 -klik
cara pemesanan
menuju form A07 A08
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Registrasi
Footer Shopping Chart
Check out | Detail
Form Registrasi
Gambar III-48 Perancangan Antarmuka Registrasi
9. Perancangan Antarmuka Login Halaman ini adalah halaman ketika pengunjung memilih salah satu menu
di navigasi menu aplikasi e-commerce, dan akan mucul tab yang berisi dari halaman antarmuka login pengunjung III-50 berikut ini :
Nama layar : A09
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik the founder menuju
form A06 -klik
cara pemesanan
menuju form A07 A09
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Login
Footer Shopping Chart
Check out | Detail
Form Login Sales onlineoffline
--------------------------- Promo Produk
--------------------------- Banner
Gambar III-49 Perancangan Antamuka Login
10. Perancangan Antarmuka Preview Produk Halaman ini adalah halaman ketika pengunjung memilih salah satu produk
di aplikasi e-commerce, dan akan mucul halaman preview produk seperti gambar III-51 berikut ini :
Nama layar : A10
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik the founder menuju
form A06 -klik
cara pemesanan
menuju form A07 A10
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Kategori Pilihan
Footer Shopping Chart
Check out | Detail
Gambar Produk
Gambar III-50 Perancangan Antarmuka Preview Produk
11. Perancangan Antarmuka Shopping Chart Halaman ini adalah halaman ketika pengunjung memilih salah satu menu
di navigasi menu aplikasi e-commerce, dan akan muncul halaman antarmuka untuk shopping chart pada gambar III-52 berikut ini :
Nama layar : A11
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik ikutan nyok menuju A02
- klik belanja menuju form A01
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 - klik the founder menuju
form A06 -klik
cara pemesanan
menuju form A07 -
klik lanjut
belanja menuju form A01
- klik next menuju form A12
A11
text text
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Shopping Chart
Footer Shopping Chart
Check out | Detail Produk | Jumlah | Harga | Diskon | Subtotal
Total Bayar : Lanjut Belanja
Next Pilih Paket Pengiriman
Gambar III-51 Perancangan Antarmuka Shopping Chart
12. Perancangan Antarmuka Halaman Member Halaman ini adalah haaman ketika pengunjung melakukan login dan
berhasil , dan akan mucul halaman seperti gambar III-54 berikut ini :
Nama layar : A13
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A13
Informasi Akun Member Slider Foto
Logo Belanja | Ikutan Nyok | Info | Akun Kamu | Logout
Profile Kamu | Ubah Password | Upload Desain | Upload Foto | History
Footer Shopping Chart
Check out | Detail Foto Member
Gambar III-52 Perancangan Antarmuka Halaman Member
13. Perancangan Antarmuka Ubah Password Halaman ini adalah halaman ketika member memilih menu ubah password
di halaman member, dan halaman akan muncul seperti gambar III-55 berikut ini :
Nama layar : A14
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A14
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Akun Kamu | Logout
Profile Kamu | Ubah Password | Upload Desain | Upload Foto | History
Footer Shopping Chart
Check out | Detail Password Lama
: Password Baru
: Konfirmasi Password Baru :
submit reset
Gambar III-53 Perancangan Antarmuka Ubah Password
14. Perancangan Antarmuka Upload Desain Halaman ini adalah halaman member saat member memilih tab upload
desain, dan akan muncul halaman upload desain seperti gambar III-56 berikut ini :
Nama layar : A15
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A15
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Akun Kamu | Logout
Profile Kamu | Ubah Password | Upload Desain | Upload Foto | History
Footer Shopping Chart
Check out | Detail Upload Desain
: Keterangan
: submit
reset browse
Gambar III-54 Perancangan Antarmuka Upload Desain
15. Perancangan Antarmuka Upload Foto Halaman ini adalah halaman member saat member memilih tab upload
foto, dan akan muncul halaman upload foto seperti gambar III-57 berikut ini :
Nama layar : A16
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A16
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Akun Kamu | Logout
Profile Kamu | Ubah Password | Upload Desain | Upload Foto | History
Footer Shopping Chart
Check out | Detail Upload Foto
: submit
browse
Gambar III-55 Perancangan Antarmuka Upload Foto
16. Perancangan Antarmuka History Halaman ini adalahhalaman member saat member memilih tab history, dan
akan mucul halaman history seperti gambar III-58 berikut ini :
Nama layar : A17
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A17
TEXT Slider Foto
Logo Belanja | Ikutan Nyok | Info | Akun Kamu | Logout
Profile Kamu | Ubah Password | Upload Desain | Upload Foto | History
Footer Shopping Chart
Check out | Detail
Kolom History Pemesanan Member
Gambar III-56 Perancangan Antarmuka History
17. Perancangan Antarmuka Konfirmasi Pembayaran Halaman ini adalah halaman member apabila melakukan pemesanan dan
harus melakukan pembayran, dan akan muncul halaman konfirmasi pembayaran seperti gambar III-59 berikut ini :
Nama layar : A18
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A18
Slider Foto Logo
Belanja | Ikutan Nyok | Info | Registrasi | Login
Konfirmasi Pembayaran
Footer Shopping Chart
Check out | Detail Id_pesanan
: Total Bayar
: submit
Gambar III-57 Perancangan Antarmuka Konfirmasi Pembayaran
18. Perancangan Antarmuka Detail Chart Halaman ini adalah halaman ketika pengunjung memilih salah satu menu
di navigasi menu aplikasi e-commerce, dan akan muncul halaman detail chart seperti gambar III-60 berikut ini :
Nama layar : A19
Ukuran : 1024 x 640
Backgorund : Abu-abu, putih
Font : Arial, verdana
- klik
belanja untuk
menuju A01 - klik ikutan nyok menuju
A02 - klik info menuju A05
- klik Registrasi menuju A08
- klik login menuju A09 - klik gambar produk
untuk menuju form 10 - klik checkout menuju
form A11 -klik akun kamu menuju
form A013 -klik
ubah password
menuju form A14 -
klik upload
desain menuju form A15
- klik upload foto mtnuju form A16
- klik history menuju form A17
A19
text Slider Foto
Logo Belanja | Ikutan Nyok | Info | Registrasi | Login
Detail Chart
Footer Shopping Chart
Check out | Detail Sales onlineoffline
--------------------------- Promo Produk
--------------------------- Banner
Produk | Jumlah | Harga | Diskon | Ongkir | Subtotal Total Bayar :
Gambar III-58 Perancangan Antarmuka Detail Chart
3.5.2.3 Perancangan Pesan
Pada gambar dibawah ini merupakan perancangan pesan yang terdapat pada aplikasi e-commerce di toko osmoes kaos muslimah. Adapun tampilan pesan yang
ada adalah sebagai berikut :
M01 Email Password tidak boleh kosong
M02 Email Password yang anda inputkan
salah M03
Penambahan Data Berhasil
M04 Data yang anda masukan salah
M05 Maaf email yang anda masukan telah
terdaftar M06
Field harus diisi, tidak boleh kosong
M07 Penambahan data gagal
M08 Terimakasih anda telah melakukan
registrasi, cek email anda untuk mengetahui konfirmasi selanjutnya
M09 Maaf account tidak ditemukan
M10 Data berhasil diubah
M11 Data berhasil dihapus
M12 Apakah anda yakin ?
Ya Tidak
M13 Verifikasi Password baru telah dikirim
ke email anda M14
Terimakasih sudah berbelanja di toko osmoes kaos muslimah, jangan lupa
untuk melakukan konfirmasi pembayaran
M15 Terimakasih telah menghubungi kami,
pesanan akan kami proses dalam waktu 1x24 jam
Gambar III-59 Perancangan Pesan
3.5.3 Jaringan Semantik
Setelah melakukan perancangan antarmuka dan perancangan pesan maka dilakukanlah perancangan terhadap aliran dari menu-menu yang ada di program
akan digambarkan dalam sebuah jaringan semantik.
1. Jaringan Semantik Admin
B01
B02 B03
B04
B05 B08
B07 B06
B04
B04 B04
B04 B04
M 01
, M 02
M 03
, M 07
M 03
, M 07
M03, M07 M03
, M0 7
M 03
, M 07
M03 , M
07
Gambar III-60 Jaringan Semantik Admin
2. Jaringan Semantik Pengunjung
A01
A02 A03
A07 A04
A05
A06 A08
A09 A10
A11 A12
Gambar III-61 Jaringan Semantik Pengunjung
3. Jaringan Semantik Member
A01
A02 A03
A07 A04
A05
A06 A08
A09 A10
A11 A12
A13 A14
A15 A16
A17
A18
A19
Gambar III-62 Jaringan Semantik Member
3.6 Perancangan Prosedural
Sebagai langkah terakhir dalam perancangan yaitu merancang prosedural yang akan diimplementasikan ke dalam sistem. Prosedur ini akan digunakan sebagai
algoritma dasar dalam mengkodekan prosedur yang ada. Adapun perancangan
prosedural untuk pembangunan aplikasi e-commerce yang akan dibangun adalah sebagai berikut :
a. Prosuder Login Prosedur ini dilakukan ketika pengguna akan melakukan login ke akun yang
telah dimilikinya, dapat dilihat pada gambar III-65 :
Mulai
Input email dan
password
Pengecekan email dan password kosong
Validasi email dan password valid
Masuk menu
member
Selesai Tidak
Valid Tampilkan
pesan email password
invalid Invalid
Tampilkan pesan email
password kosong
Ya
Gambar III-63 Prosedur Login
b. Prosedural Registrasi Prosedur ini dilakukan ketika pengguna akan melakukan registrasi, dapat
dilihat pada gambar III-66 :
Mulai
Input data registrasi
Data Kosong
Data Terisi
Selesai Tidak
Tampilkan pesan validasi
data salah Tampilkan
pesan data registrasi
kosong Pengecekan data
registrasi kosong
Cek validasi data registrasi
Simpan data
Registrasi berhasil
Benar Salah
Tampilkan pesan registrasi berhasil
Gambar III-64 Prosedur Registrasi
c. Prosedur Ubah Password Prosedur ini dilakukan ketika pengguna akan melakukan pengubahan
password, dapat dilihat pada gambar III-67 :
Mulai
Input data password
baru
Cek password baru
Ubah password
berhasil
Selesai Valid
Tampilkan pesan data
salah Invalid
Password baru
Gambar III-65 Prosedur Ubah Password
d. Prosedur Pembelian
Prosedur ini dilakukan ketika pengguna akan melakukan pembelian di aplikasi e-commerce, dapat dilihat pada gambar III-68 :
Mulai
Selesai Tampilkan
pesan account tidak
ditemukan
Login berhasil Login
Cek email dan password
Pilih Kategori
Pilih Produk
Checkout
Pembayaran Valid
Invalid
Gambar III-66 Prosedur Pembelian
e. Prosedural Penambahan Data Produk
Prosedur ini dilakukan ketika pengguna akan melakukan penambahan produk, dapat dilihat pada gambar III-69 :
Mulai
Input data produk
Data kosong
Selesai Tidak
Tampilkan pesan
penambahan data berhasil
Tampilkan pesan data
tidak boleh kosong
Tambah data produk
Penambahan produk tersimpan
Tambah data produk
berhasil Ya
Gambar III-67 Prosedur Penambahan Produk
f. Procedural Ubah Data Produk
Prosedur ini dilakukan ketika pengguna akan melakukan pengubahan data produk, dapat dilihat pada gambar III-70 :
Mulai Input data
produk yang
diubah
Data kosong
Selesai Tidak
Tampilkan pesan ubah
data berhasil Tampilkan
pesan data produk tidak
boleh kosong Ubah data produk
Pengubahan produk tersimpan
Ubah data produk
berhasil Ya
Gambar III-68 Prosedur Ubat Produk
g. Prosedural Tambah Data Kategori
Prosedur ini dilakukan ketika pengguna akan melakukan penambahan data kategoti, dapat dilihat pada gambar III-71 :
Mulai Input data
kategori
Data kosong
Selesai Tidak
Tampilkan penambahan
data kategori berhasil
Tampilkan pesan data
kategori tidak boleh kosong
Tambah data kategori
Penambahan kategori tersimpan
Tambah data
kategori berhasil
Ya
Gambar III-69 Prosedur Tambah Kategori
h. Procedural Ubah Data Kategori
Prosedur ini dilakukan ketika pengguna akan melakukan pengubahan data kategori, dapat dilihat pada gambar III-72 :
Mulai Input data
kategori yang
diubah
Data kosong
Selesai Tidak
Tampilkan pesan ubah
data berhasil Tampilkan
pesan data kategori tidak
boleh kosong Ubah data kategori
Pengubahan kategori tersimpan
Ubah data kategori
berhasil Ya
Gambar III-70 Prosedur Ubah Kategori
i. Prosedural Tambah Data Detail Produk
Prosedur ini dilakukan ketika pengguna akan melakukan penambahan detail produk, dapat dilihat pada gambar III-73 :
Mulai
Input data detail
produk
Data kosong
Selesai Tidak
Tampilkan penambahan
data detail produk berhasil
Tampilkan pesan data detail produk
tidak boleh kosong Tambah data detail
produk
Penambahan detail produk tersimpan
Tambah data detail
produk berhasil
Ya
Gambar III-71 Prosedur Tambah Detail Produk
j. Prosedural Ubah Data Detail Produk
Prosedur ini dilakukan ketika pengguna akan melakukan pengubahan detail produk, dapat dilihat pada gambar III-74 :
Mulai
Input data detail produk
yang diubah
Data kosong
Selesai Tidak
Tampilkan pesan ubah
data berhasil Tampilkan
pesan data detail produk
tidak boleh kosong
Ubah data detail produk
Pengubahan detail produki tersimpan
Ubah data detail
produk berhasil
Ya
Gambar III-72 Prosedur Ubah Data Detail Produk
182
BAB IV
IMPLEMENTASI DAN PENGUJIAN SISTEM
4.1 Implementasi Sistem