Anda di halaman 1dari 139

BAB IV

ANALISIS DAN PEMBAHASAN

4.1

Analisis Sistem
Analisis sistem merupakan gambaran tentang sistem yang saat ini sedang
berjalan dan untuk mempelajari sistem yang ada. Analisis sistem diperlukan untuk
menggambarkan aliran-aliran informasi dari bagian-bagian terkait, baik dari dalam
maupun dari luar organisasi, untuk mengidentifikasikan dan mengevaluasi
permasalahanpermasalahan, hambatanhambatan yang terjadi dan kebutuhan
kebutuhan yang diharapkan sehingga dapat diusulkan perbaikanperbaikan yang
akan dilakukan pada sistem tersebut.
4.1.1

Identifikasi Masalah
Butik Akiko

masih mengalami berbagai permasalahan dalam

aktivitas pemasaran dan penjualan. Adapun masalah yang dihadapi pada


sistem pemasaran adalah pemilik beserta bagian penjualan belum melakukan
upaya pemasaran dengan maksimal. Pemilik telah berusaha menjalankan
fungsi pemasaran dengan melakukan teknik-teknik tertentu seperti
memasang papan nama, memasang spanduk yang menarik, membagikan
brosur.

Teknik-teknik

pemasaran

tersebut

tujuannya

berusaha

memperkenalkan Butik Akiko kepada calon konsumen dan membujuk calon

konsumen melakukan pembelian.Tetapi semua hal tersebut belum mampu


meningkatkan penjualan Butik Akiko.
Beberapa permasalahan juga dapat muncul di bagian penjualan Butik
Akiko.Keterlambatan dalam memberikan laporan penjualan dan kesalahan
dalam pencatatan data pembelian yang sering terjadi.

Tabel 4.1 Evaluasi sistem berjalan


Pernyataan singkat masalah
Struktur organisasi yang

Bagian
Manajemen

Solusi yangdiusulkan
Direkomendasikan menambah satu

kurang lengkap. Fungsi

bagian yaitu bagian pemasaran/

pemasaran menjadi

marketing.

tangggungjawab owner.

Atau menambah tugas kerja


bagian Administrasi sebagai agen

Teknik pemasaran yang

Pemasaran

pemasaran/marketing.
Pengembangan media promosi dan

kurang optimal, jangkauan

informasi dapat menggunakan

promosi kurang luas, dan

sarana internet (website) yang

masih dapat ditingkatkan

dapat diakses dari jauh, kapan saja


24jam, menggunakan alat

Konsumen harus dapat


langsung ke toko sehingga
menyulitkan calon konsumen
dari luar kota

pemasaran yang beragam

Cara pemesanan dapat

Pemasaran

Butik Akiko menyediakan saluran

dipermudah

dan

komunikasi yang mudah diakses

Penjualan
Pemasaran

seperti telpon, SMS, email, BB.


Melalui website, calon konsumen

dan

dapat memesan secara online, dan

Penjualan

melakukan konfirmasi dengan

Pencarian data barang untuk

Pemasaran

mudah
Menyediakan sistem

keperluan penjualan dan

dan

terkomputerisasi untuk mengolah

pelaporan memakan waktu

Penjualan

data barang dan penjualan

dan seringkali salah.

4.1.2 Analisa Kebutuhan


Analisis kebutuhan adalah perkiraan dari kebutuhan-kebutuhan
fungsional,infrastruktur (hardware dan software), tenaga kerja dan dana yang
dibutuhkan menyelesaikan pemasalahan.
Mempertimbangkan hasil evaluasi, dan saran, pemilik berkeinginan
mengembangkan website sistem penjualan Butik Akiko sebagai media pemasaran,
untuk mengelola administrasi penjualan offline dan online, dan menghasilkan laporan
secara cepat.
a. Kebutuhan Fungsi Sistem
1) Website

penjualan

harus

dapat

menampilkan

informasi

profil

perusahaan, informasi data poduk, informasi prosedur pembelian dengan


baik.

2) Website penjualan harus dapat digunakan untuk mengelola data produk


dan menampilkannya kepada calon konsumen.
3) Website penjualan harus menyediakan saluran komunikasi untuk proses
bertanya,

melakukan

pemesanan,

dan

melakukan

konfirmasi

pembayaran.
4) Transaksi pemesanan dan pembelian konsumen harus dapat dicatat
dengan baik.
5) Website penjualan harus dapat menghasilkan laporan penjualan dan
laporan stok barang dengan cepat.
b. Kebutuhan Perangkat Keras Komputer
Komputer yang dibutuhkan untuk tahap pengembangan dan penerapan sistem
adalah Personal Komputer dengan spesifikasi perangkat keras minimal sebagai
berikut:
1) Processor Intel Dual Core 2.0 GHz
2) Mainboard P5KPL-AM (Intel G31)
3) Monitor LCD 15
4) Hard Disk 300 GB SATA II
5) VGA INTEGRATED 256 MB
6) DDR2 RAM 1 GB
7) Keyboard
8) Mouse Optic
9) Chasing

10) UPS 600 VA


11) Printer
12) Jaringan Komputer (LAN Card, Hub, konektor, dan kabel)
13) Koneksi Internet
c. Kebutuhan Perangkat Lunak
Perangkat lunak yang dibutuhkan untuk tahap pengembangan dan implementasi
sistem :
1) Windows XP Professional sebagai sistem operasi. Windows XP Profrssional
dinilai kompatibel dan sudah banyak dikenal oleh umum selain itu juga
bersifat stabil bila digunakan dalam suatu aplikasi.
2) Apache sebagai web server.
3) MySQL sebagai dabatase management system.
d. Kebutuhan Sumber Daya Manusia
Pengguna komputer saat implementasi sistem adalah pegawai dan karyawan
Butik Akiko khususnya bagian administrasi/pemasaran, bagian penjualan,
danmungkin petugas perawatan komputer. Pada saat pengembangan sistem
informasi yaitu sistem analis.
Kebutuhan sumberdaya secara lengkap untuk tahap pengembangan sistem dan
implementasi sistem adalah :

1) Sistem analisis
Sistem analisis yaitu seorang yang mempunyai kemampuan dalam
menganalisa dan merancang suatu sistem komputerisasi atau menyusun spesifikasi
sistem komputer dan program aplikasi untuk selanjutnya dipergunakan oleh
programmer.
Sistem analisis bertugas menganalisa sistem yang sedang berjalan saat ini,
memahami dan menemukan kelemahan sistem, memberikan solusi kelemahan
sistem, kemudian merancang sistem yang mampu menyelesaikan permasalahan
yang ada. Dokumen yang dihasilkan adalah diagram dan gambar rancangan sistem
yang baru.
2) User
User adalah pengguna program aplikasi saat implemenasi.Untuk website
penjualan Butik Akiko, pengguna yang mungkin ada adalah pemilik dan karyawan
bagian penjualan atau administrator.
4.2 Desain Sistem
Melihat kekurangan dan kesulitan yang dirasakan sistem lama yang ditemukan
dalam tahapan analisis sistem, maka diperlukan adanya desain sistem baru yang dapat
memperbaiki serta meningkatkan efisiensi dalam proses transaksi dan proses kerja
karyawan.

Sistem lama adalah sistem penjualan dengan administrasi manual sehingga proses
administrasi dan menghasilkan laporan memiliki kelemahan-kelemahan seperti
pencarian data dan proses menghasilkan laporan yang relatif lama.
Berikut ini adalah usecase diagram sistem lama yang digambarkan dengan Gambar
4.1 Usecase diagram sistem penjualan lama butik akiko.

Gambar 4.1 Usecase diagram sistem penjualan lama butik akiko.

Dalam sebuah desain sistem baru tentunya diperlukan adanya sasaran dari
pembuatan sistem tersebut berupa user dari sistem tersebut. Dalam kasus ini sasaran
dari pembuatan sistem ini adalah petugas administrasi dan Pengguna/Konsumen.

Dalam desain sistem ini dijelaskan dalam bentuk use case diagram dan
penjelasannya. Sistem ini terdiri dari 3 actor, diantaranya:
a. Administrator, yaitu staff pemasaran dan atau staff penjualan yang
diberikan tugas untuk mengelola website yaitu mengelola halaman web,
mengelola artikel berita, mengelola data barang, mengelola pesan kontak
kami, dan mengelola data penjualan.
b. Konsumen, yaitu pengunjung

website Butik Akiko yang melakukan

pembelian produk butik akiko.


c. Pengunjung Umum, yaitu masyarakat umum yang mengakses website
butik akiko .

Gambar 4.2 Usecase diagram website penjualan Butik Akiko

Penjelasan masing-masing use case :


1. Registrasi
Tabel 4.2 Deskripsi Use case regristrasi konsumen
Nama
Usecase
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Prakondisi
Sasaran
Bidang Khas
Suatu Event

Registrasi
High
Requirement Use CaseModel
Konsumen

Use Case Type:


Sistem Analysis

Usecase ini merupakan fungsi sistem untuk calon pembeli


melakukan pendaftaran data diri. Pendaftaran dibutuhkan
untuk menyimpan data konsumen, menyimpan data akun
login, yang selanjutnya setelah login konsumen dapat
melakukan pemesanan barang, melihat history pembelian,
dan melakukan konfirmasi pembayaran.
Pengguna belum masuk sistem. Pengguna harus mengetahui
URL/alamat untuk mengakses website ecommerce butik
akiko, dan memilih menu registrasi.
Mencatat/penyimpan data konsumen dan akun login.
Aktor Action
Sistem Respons
Step1 Pengguna memilih Step 3 Sistem menampilkan form
menu registrasi.
registrasi

Bidang
Alternatif
Kesimpulan
Postkondisi
Aturan Bisnis

Step2 Pengguna
Step 4Sistem menyimpan data
memasukan data diri dan pengguna
akun login (username
dan password)
Step 5 Sistem menampilkan
informasi hasil proses registrasi.
Proses registrasi bisa berhasil atau gagal. Sistem harus dapat
menampilkan informasi hasil proses registrasi.
Usecase ini berfungsi untuk menyimpan data pengguna
sebelum pengguna dapat login dan melakukan pemesanan
barang.
Pengguna melihat informasi hasil proses registrasi. Pengguna
dapat login ke sistem menggunakan akun login yang telah
dibuat.
Setiap konsumen harus melakukan registrasi sebelum

Batasan dan
Spesifikasi
Implementasi

melakukan pembelian.
Form registrasi harus userfriendly.
Password harus di enkripsi

2. Login
Tabel 4.3 Deskripsi Use case login admin dan member/anggota
Nama Usecase
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Prakondisi
Sasaran
Bidang Khas
Suatu Event

Login / Autentifikasi
High
Requirement Use CaseModel
Administrator dan member/anggota

Use Case Type:


Sistem Analysis

Usecase ini merupakan fungsi sistem untuk memeriksa


kewenangan pengguna yang ingin masuk dan menggunakan
fungsi-fungsi sistem. Sistem akan memeriksa akun user
(username dan password) dan mebandingkan dengan data user
dalam basisdata. Apabila akun ditemukan, user diberikan
halaman administrasi dengan menu-menu sesuai haknya.
Semua fungsi administrasi di sistem tergantung pada fungsi
ini.
Pengguna belum masuk sistem. Pengguna harus mengetahui
URL/alamat untuk mengakses halaman login.
Sebagai pengelola akses pengguna sistem. Memberikan
keputusan go atau no go ke menu pengguna.
Aktor Action
Sistem Respons
Step1 Pengguna diberi
form login.

Step 3 Ssistem memeriksa


username dan password

Step2 Pengguna
memasukan username
dan password

Step 4Sistem mencocokan


username dan password dengan
data di tabel user
Step 5 Sistem memberi keputusan

Bidang
Alternatif

Kesimpulan
Postkondisi
Aturan Bisnis
Batasan dan
Spesifikasi
Implementasi

1. Bila username dan password tidak cocok dengan salah


satu data di tabel user, sistem akan memberi pesan dan
menampilkan halaman login kembali.
2. Bila username dan password ada, sistem akan
membuatkan session dan meneruskan pengguna ke
halaman administrasi, menampilkan menu sesuai
kewenangan/hak aksesnya
Usecase ini sangat penting untuk membatasi hak akses user.
Menjaga sistem dari pengguna yang tidak berwenang
Pengguna melihat pesan gagal login, atau pengguna masuk ke
sistem (halaman administrasi).
Setiap pengguna untuk menggunakan fungsi administrasi
sistem harus melalui audentifikasi/login
Password harus di enkripsi

3. Mengubah Tampilan Halaman Utama


Tabel 4.4 Deskripsi Use case Mengubah Tampilan Halaman Utama
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Setting sistem
High
Requirement Use Case Model
Administrator

Prakondisi

Pengguna telah berhasil login dan masuk ke halaman utama.

Sasaran

Usecase ini akan memungkinkan pengguna memberikan perintah


kepada sistem untuk mengubah tampilan utama halaman website.
Aktor Action
Sistem Respons

Bidang Khas
suatu event

Use Case Type:


Sistem Analysis

Usecase ini memungkinkan administrator mengubah tampilan utama


halaman website dan setting data sistem dengan. Setting data sistem
adalah pengaturan data nama dan kontak perusahaan, pengaturan data
awal seperti bahasa dan mata uang, wilayah pengiriman dan ongkos
kirim, dll.

Step 1 Pengguna memberi


perintah kepada sistem untuk
mengubah data

Step 3 Pengguna
memasukan/mengubah data.

Bidang
Alternatif

Step 2 Sistem
memproses /menampilkan form
yang sesuai
Step 4 Sistem memproses inputan
pengguna.
Step 5 Sistem menampilkan
konfirmasi hasil proses

1. Sistem akan menampilkan pesan bila user tidak mengisi form


dengan benar.
2. Bila hasil proses gagal, sistem juga akan menampilkan pesan
kegagalan proses

Kesimpulan

Usecase berfungsi membantu/mempermudah administrator dalam


mengubah data sistem yang akan ditampilkan dihalaman utama
website.

Postkondisi

Data telah masuk/berubah.

Aturan Bisnis

Pengguna yang berhak untuk melakukan mengubahan halaman utama


website adalah administrator.

Batasan dan
spesifikasi
implementasi

Form yg ditampilkan harus userfiendly, mudah dipahami dan


digunakan

4. Mengelola Halaman Informasi


Tabel 4.5 Deskripsi Use case Mengelola Halaman Informasi
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Prakondisi

Mengelola Halaman Informasi


High
Requirement Use Case Model
Administrator web

Use Case Type:


Sistem Analysis

Website harus dapat menampilkan beberapa informasi demi


kejelasan pengguna bertransaksi secara online. Informasi tersebut
adalah profil perusahaan, cara kontak, cara pembelian, halaman
privacy policy, halaman syarat dan ketentuan, dan halaman faq
(frequenly ask question).
Mengelola informasi berarti administrator harus dapat menambah,
mengubah, atau menghapus data informasi .
Untuk mengelola informasi, pengguna harus telah masuk kesistem
(login) dan memiliki rancangan/data isi halaman web.

Sasaran

Mempermudah administrator web menyiapkan halaman website


sebagai informasi yang akan diberikan kepada kepada pengunjung
website

Bidang Khas
suatu event

Aktor Action

Sistem Respons

Step 1 Pengguna memberi


perintah kepada sistem untuk
mengubah

Step 2 Sistem memproses atau


menampilkan form yang sesuai

Step 3 Pengguna
memasukan/mengubah data
berita

Step 4 Sistem memproses inputan


pengguna (mengupdate data
ditabel)
Step 5 Sistem menampilkan
informasi hasil proses

Bidang
Alternatif

Proses update data halaman website bisa gagal atau berhasil. Sistem
harus menampilkan informasi proses gagal atau berhasil.

Kesimpulan

Usecase/ fungsi ini membantu mempermudah administrator dalam


mengelola data halaman website
Isi tabel halaman website telah berubah.

Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Usecase dapat diakses/dilakukan oleh administrator maupun


pimpinan/owner.
Form harus userfriendly.

5. Mengelola Kategori Barang


Tabel 4.6 Deskripsi Use case Mengelola Kategori Barang
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Mengelola Kategori Barang


High
Requirement Use CaseModel
Administrator web

Use Case Type:


Sistem Analysis

Kategori mobil berfungsi mengelompokkan data barang.


Pengelompokan ini akan mempermudah pengguna mencari
produk yang diinginkan.
Melalui fungsi kelola kategori barang administrator akan
dapat melakukan proses penambahan data kategori, ubah

data, atau menghapus data kategori barang.

Prakondisi
Sasaran
Bidang Khas
suatu event

Pengguna harus telah masuk kesistem(login) dan memiliki


data kategori barang.
Mempermudah administrator mengelola kategori barang
(menambah, mengubah, dan menghapus data).
Aktor Action
Sistem Respons
Step 1 Pengguna memberi
perintah kepada sistem untuk
menambah/mengubah/mengha
pus data kategori

Step 3Pengguna
memasukan/mengubah data
kategori

Bidang
Alternatif

Kesimpulan
Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Step 2Sistem memproses


atau menampilkan form
yang sesuai
Step 4 Sistem memproses
inputan pengguna
(menambah data ke tabel,
mengupdate data ditabel,
atau menghapus data dari
tabel basisdata)

Step 5 Sistem menampilkan


informasi hasil proses
- Proses penyimpanan data kategori yang baru bisa gagal
atau berhasil.
- Proses mengupdate data kategori bisa gagal atau berhasil
- Proses menghapus data kategori bisa gagal atau berhasil
Sistem harus menampilkan informasi proses gagal atau
berhasil.
Usecase/ fungsi ini membantu mempermudah administrator
dalam mengelola data kategori barang
Data Kategori barang telah berubah.
Usecase dapat diakses/dilakukan oleh administrator maupun
pimpinan/owner.
Form harus userfriendly.

6. Mengelola Data Barang

Tabel 4.7 Deskripsi Use case Mengelola Gallery/Data Barang


Nama Use Case
Prioritas
Sumber

Mengelola Gallery/Data Barang


High
Requirement Use CaseModel

Pelaku Bisnis
Utama
Deskripsi

Administrator web

Prakondisi
Sasaran
Bidang Khas
suatu event

Use Case
Type:
Sistem
Analysis

Informasi produk/barang yang dijual adalah informasi


penting yang akan disampaikan oleh perusahaan melalui
website. Fungsi ini akan mempermudah administrator web
mengelola data barang yang dimiliki/dijual perusahaan.
Mengelola berarti bisa menambah, mengubah, atau
menghapus data. Mengelola data barang
tergantung/dependent kepada proses kelola kategori karena
data mobil akan menyertakan informasi ini. Data kategori
harus sudah ada dan siap digunakan.
Pengguna harus telah masuk kesistem(login) dan memiliki
data barang.
Mempermudah administrator mengelola data barang
(menambah, mengubah, dan menghapus data).
Aktor Action
Sistem Respons
Step 1 Pengguna memberi
perintah kepada sistem untuk
menambah/mengubah/menghapu
s data barang

Step 2Sistem
memproses atau
menampilkan form yang
sesuai

Step 3Pengguna
memasukan/mengubah data
barang

Step 4 Sistem
memproses inputan
pengguna (menambah
data ke tabel,
mengupdate data
ditabel, atau menghapus
data dari tabel basisdata)
Step 5 Sistem
menampilkan informasi
hasil proses

Bidang Alternatif

Kesimpulan
Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Proses penyimpanan data barang yang baru bisa gagal


atau berhasil.
- Proses mengupdate data barang bisa gagal atau berhasil
- Proses menghapus data barang bisa gagal atau berhasil
Sistem harus menampilkan informasi proses gagal atau
berhasil.
Usecase/ fungsi ini membantu mempermudah administrator
dalam mengelola data barang
Data barang telah berubah.
Usecase dapat diakses/dilakukan oleh administrator maupun
pimpinan/owner.
Form harus userfriendly.

7. Mengelola Pesanan
Tabel 4.8 Deskripsi Use case Mengelola Pesanan
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Mengelola Pesanan
High
Requirement Use CaseModel
Administrator web

Prakondisi

Pengguna harus telah masuk sistem(login)

Sasaran

Mempermudah administrator mengelola data pesanan

Bidang Khas
suatu event

Aktor Action

Use Case Type:


Sistem Analysis

Data pesanan adalah data utama sistem penjualan online. Data


pesanan menyimpan informasi transaksi pesan yang dilakukan
oleh konsumen secara online (melalui halaman web).
Mengelola pesanan berarti administrator harus dapat melihat
detil data pesanan, menindaklanjuti pesanan, mengubah status
pesanan apabila pembayaran dari konsumen telah diterima.
(status : baru, terbayar, terkirim/selesai), atau menghapus data
pesanan.

Sistem Respons

Step 1 Pengguna memberi


perintah kepada sistem
untuk menampilkan detil
pesanan / ubah status
pesanan

Step 2 Sistem memproses


perintah pengguna
Step 3 Sistem menampilkan
informasi hasil proses

Bidang
Alternatif

Proses mengubah status pesanan bisa gagal atau berhasil.


Sistem harus menampilkan informasi proses gagal atau
berhasil.

Kesimpulan

Usecase/ fungsi ini membantu mempermudah administrator


dalam mengelola pesanan

Postkondisi
Aturan Bisnis

Status pesanan berubah


Usecase dapat diakses/dilakukan oleh administrator maupun
pimpinan/owner.

Batasan dan
spesifikasi
implementasi

Form harus userfriendly.

8. Melihat Laporan Penjualan


Tabel 4.9 Deskripsi Melihat Laporan Penjualan
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Cetak Laporan Penjualan


High
Requirement Use Case Model
Administrator web dan Pemilik

Prakondisi

Pengguna harus telah masuk kesistem (login)

Sasaran

Mempermudah administrator menghasilkan laporan penjualan


produk/barang perusahaan.

Bidang Khas

Aktor Action

Use Case Type:


Sistem Analysis

Laporan penjualan dibutuhkan oleh perusahaan sebagai


pertimbangan kebijakan berikutnya. Laporan bisa dicetak bulanan
atau insidentil ketika diminta. Sistem e-commerce harusnya dapat
menyediakan fasilitas ini.

Sistem Respons

suatu event
Step 1 Pengguna memberi
perintah kepada sistem untuk
menampilkan laporan
Bidang
Alternatif
Kesimpulan

Step 2 Sistem menampilkan


laporan

Usecase/ fungsi ini membantu mempermudah administrator dalam


menghasilkan laporan penjualan

Postkondisi

Laporan pesanan ditampilkan

Aturan Bisnis

Usecase dapat diakses/dilakukan oleh administrator maupun


pimpinan/owner.

Batasan dan
spesifikasi
implementasi

Form harus userfriendly.

9. Melihat Laporan Persediaan/Stok Barang


Tabel 4.10 Deskripsi Melihat Laporan Persediaan/Stok Barang
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Melihat Laporan Stok Barang


High
Requirement Use Case Model
Administrator web dan Pemilik

Prakondisi

Pengguna harus telah masuk kesistem (login)

Sasaran

Mempermudah

Use Case Type:


Sistem Analysis

Laporan stok barang dibutuhkan oleh pemilik dan bagian gudang


sebagai pertimbangan pembelian barang berikutnya. Laporan bisa
dicetak bulanan atau insidentil ketika diminta. Sistem e-commerce
harusnya dapat menyediakan fasilitas ini.

administrator

menghasilkan

Persediaan/Stok Barang.
Bidang Khas
suatu event

Aktor Action

Sistem Respons

laporan

Step 1 Pengguna memberi


perintah kepada sistem untuk
menampilkan laporan

Bidang
Alternatif
Kesimpulan
Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Step 2 Sistem menampilkan


laporan

Usecase/ fungsi ini membantu mempermudah administrator dalam


menghasilkan laporan Persediaan/Stok Barang
Laporan stok barang ditampilkan
Usecase dapat diakses/dilakukan oleh administrator maupun
pimpinan/owner.
Form harus userfriendly.

10. Melihat Informasi


Tabel 4.11 Deskripsi Use case Melihat Informasi
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi
Prakondisi
Sasaran

Melihat Informasi
High
Requirement Use CaseModel
Pengunjung/anggota/konsumen

Use Case Type:


Sistem Analysis

Website menyediakan informasi profil perusahaan, cara


pembelian, faq, dan syarat-ketentuan dalam bentuk halaman
web kepada pengunjung umum.
Pengguna mengetahui URL / alamat website
Menghasilkan tampilan halaman website yang berisi informasi
penting kepada pengunjung web

Bidang Khas
suatu event

Aktor Action

Sistem Respons

1. Pengguna memilih menu Step 2 Sistem menampilkan


halaman informasi
informasi

Bidang
Alternatif
Kesimpulan
Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Usecase ini berfungsi untuk menyediakan tampilan informasi


bagi pengunjung umum website
Profil perusahaan ditampilkan
Usecase dapat diakses oleh umum
Halaman ditampilkan dengan tata letak yang baik dan konten
yang menarik/menimbulkan kepercayaan

11. Melihat Daftar Produk/Barang


Tabel 4.12 Deskripsi Use case Melihat Daftar Produk/Barang
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Melihat daftar barang


High
Requirement Use CaseModel
Pengunjung/anggota/konsumen

Prakondisi

Pengguna mengetahui URL / alamat website

Sasaran

Memberikan informasi lengkap produk yang jual oleh


perusahaan

Bidang Khas
suatu event

Aktor Action

Use Case Type:


Sistem Analysis

Website menyediakan list/daftar barang yang dimiliki/dijual


perusahaan untuk dilihat secara detail oleh pengunjung umum.

Sistem Respons

Step 1 Pengguna memilih


menu kategori produk
Step 3 Pengguna memilih
kategori/barang yang akan
ditampilkan informasinya
lebih detail

Bidang
Alternatif
Kesimpulan

Step 2 Sistem menampilkan


daftar kategori
Step 4 Sistem menampilkan
data barang secara lengkap

Usecase ini berfungsi untuk menampilkan daftar produk /


barang kepada pengguna agar dilihat dan menimbulkan
ketertarikan pembelian
Daftar barang dan detail data barang dapat dilihat oleh
pengunjung umum

Postkondisi
Aturan Bisnis

Fungsi ini diperuntukkan bagi pengunjung umum

Batasan dan
spesifikasi
implementasi

Harus dapat menampilkan gambar, informasi semakin lengkap


semakin baik

12. Melakukan Pemesanan Barang


Tabel 4.13 Deskripsi Use case Melakukan Pemesanan Barang
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis
Utama
Deskripsi

Melakukan Pemesanan Barang


High
Requirement Use CaseModel
Pengunjung / konsumen/anggota

Prakondisi

Pengguna mengetahui URL / alamat website

Use Case Type:


Sistem Analysis

Website menyediakan prosedur bagi pengunjung website atau


calon konsumen untuk memesan produk secara
langsung/online dengan cepat dan mudah.

Sasaran

Bidang Khas
suatu event

Memberikan cara yang mudah, cepat, dengan data yang


cukup, untuk konsumen melakukan pemesanan produk/barang
secara online.
Aktor Action
Sistem Respons
Step 1 Pengguna memilih
barang, memilih tombol
checkout
Step 3 Pengguna
memasukkan data akun/data
diri, alamat pengiriman,
cara pembayaran.

Step 2 Sistem memberikan


menu/form pemesanan.
Step 4 Sistem menyimpan data
pesanan

Bidang
Alternatif

Data pemesanan/pembelian dapat terkirim atau tidak terkirim.


Sistem harus memberikan informasi ini ke pengunjung/pengisi
form pembelian

Kesimpulan

Usecase ini berfungsi membantu pengunjung / konsumen


dalam melakukan pemesanan produk secara online dengan
mengisi form pemesanan di halaman web.
Pesan terkirim dan tersimpan di basisdata
Fungsi ini diperuntukkan bagi pengunjung umum

Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Halaman/form ditampilkan dengan tata letak yang baik dan


memiliki validasi input

13. Melihat History Belanja


Tabel 4.14 Deskripsi Use case Melihat History Belanja
Nama Use Case
Prioritas
Sumber
Pelaku Bisnis

Melihat History Belanja


High
Requirement Use CaseModel
Konsumen/ anggota

Use Case Type:


Sistem Analysis

Utama
Deskripsi

Prakondisi
Sasaran
Bidang Khas
suatu event

Konsumen yang registrasi sebagai member/anggota akan


dapat login dan melihat history belanja.
Melalui history belanja ini anggota dapat melihat kembali
jumlah pesanan, jumlah tagihan, melakukan pemesanan
kembali, dan memberikan informasi return barang apabila
terjadi kesalahan/kekeliruan pengiriman barang.
Penggunaadalah member dan harus telah masuk sistem
(login)
Mempermudah konsumen dalam melihat history pemesanan
barang, melakukan reorder, dan melakukan retur barang.
Aktor Action
Sistem Respons
Step 1 Pengguna login ke
sistem dan memiliki history
order

Bidang
Alternatif
Kesimpulan
Postkondisi
Aturan Bisnis
Batasan dan
spesifikasi
implementasi

Step 2 Sistem menampilkan


halaman history order

Usecase/ fungsi ini membantu member dalam melihat data


produk dan tagihan yang pernah dipesan.
Data history pesanan berhasil ditampilkan.
Usecase dapat dilakukan oleh member
Form harus userfriendly.

14. Logout
Tabel 4.15 Deskripsi Use case Logout
Nama Use case
Prioritas
Aktor
Deskripsi
Pra kondisi

Logout
High
Administrator dan Anggota
Use case ini memungkinkan administrator/member
(pengguna yang telah login) untuk keluar dari sistem.
Pengguna belum Logout dari sistem

Sasaran
Bidang Khas
Suatu Event
Kesimpulan
Post Kondisi
Batasan dan
Spesifikasi
implementasi

Use case ini akan berfungsi bila anggota mengakses tombol


logout
Aktor action
Respon sistem
1. konsumen memilih 2. Sistem menampilkan halaman
tombol logout
halaman utama Website.
Use case ini selesai bila pengguna telah keluar dari sistem
Pengguna telah keluar dari sistem
Proses logout sebaiknya dibuat cepat

4.3 Desain proses


Pendekatan pengembangan berorientasi objek sangat tepat bagi sistem informasi
dengan menggunakan teknologi objek untuk mengkonstruksi, mengelola dan
merangkai objek kedalam aplikasi komputer yang berguna. Dalam mendesain sistem
baru banyak model dikembangkan dengan menggunakan analisis yang sama dan
memperbaikinya untuk merefleksikan lingkungan yang menjadi target. Berikut adalah
penjelasan untuk setiap proses yang akan terjadi pada sistem yang akan dibangun.
Penggambaran yang penulis gunakan adalah dengan menggunakan Activity diagram
untuk menggambarkan aliran kejadian dalam Use case. Sequence diagram digunakan
untuk merepresentasikan satu aliran dari beberapa aliran di dalam Use case.
Collaboration diagram untuk menampilkan aliran skenario tertentu di dalam Use case.
Component diagram digunakan untuk menggambarkan modul fisik dari kode.
Deployment diagram digunakan untuk menampilkan semua titik (node) dalam suatu
jaringan, hubungan antar mereka, dan proses proses yang dijalankan pada masing

masing titik. Class diagramdigunakan untuk menampilkan kelas kelas atau paket
paket didalam sistem dan relasi antar mereka, memberikan gambaran sistem secara
statis yang disediakan UML.
A. Admin
1. Proses Login
Login ini merupakan proses awal untuk dapat masuk ke halaman utama dari
pengguna dan tiap login ini mempunyai hak akses yang berbeda-beda. Proses
login akan terdapat dua diagram penjelasannya yaitu

Activity diagram dan

sequence diagram yang akan dijelaskan pada gambar 4.3 Activity diagram login
dan gambar 4.4 sequence diagram login
admin

sistem

start

mengisi username
dan password

cek username dan


password

salah

validasi

benar
masuk ke halaman
admin

end

Gambar 4.3 Activity diagram login admin

Tampilan FormLogin

Control Login

Data Administrator

Halaman Administrator

: Administrator
1 : mengisi username dan password()
2 : validasi()
3 : validasi()

4 : tidak valid,tampilkan informasi kesalahan()


5 : menampilkan informasi kesalahan
6 : mengisi username dan password
7 : validasi()

8 : validasi()

9 : cari data akun()

10 : hasil pencarian data akun tidak ditemukan


11 : tampilkan pesan akun tidak ditemukan()
12 : menampilkan pesan akun tidak ditemukan
13 : mengisi username dan password
14 : validasi()

15 : validasi()

16 : cari data akun()

17 : hasil pencarian data akun ditemukan


18 : Masuk ke halaman admin()

19 : menampilkan halaman dashboard administrator

Gambar 4.4 Sequence diagram login admin


Keterangan:

Admin mengakses halaman admin. Sistem menampilkan form login. Admin


mengetikkan username dan password kemudian mensubmitnya dengan cara
mengklik tombol login. Sistem akan melakukan validasi, Jika username dan
password salah maka akan ditampilkan pesan kesalahan autentifikasi, pengguna
mengetikkan ulang username dan passsword jika input username dan passsword
benar maka sistem akan menampilkan halaman utama admin.
2. Mengelola Halaman Utama Website
Halaman ini diperuntukkan bagi admin untuk mengubah tampilan pada
halaman utama Website yang akan dijelaskan pada gambar 4.5 Activity diagram
mengubah tampilan halaman utama dan gambar 4.56 sequence diagram
mengubah tampilan halaman utama.

admin

sistem

start

memilih menu
system

menampilkan
submenu system

memilih menu
setting

menampilkan
halaman edit setting

memilih tab
store

menampilkan form
edit store

mengubah data

update data

menampilkan
konfirmasi update data
end

Gambar 4.5 Activity diagram mengubah tampilan halaman utama

Dashboard

Control System

Halaman Edit Setting

Control Store

FormEdit Store

Control Setting

Setting Data

: Administrator
1 : Pilih menu System> Setting()
2 : buka halaman setting()
3 : membuka halaman edit setting()

4 : menampilkan halaman setting


5 : memilih store
6 : buka formedit store()
7 : buka formedit store()

8 : menampilkan formedit store()


9 : menampilkan formedit store
10 : mengubah setting store, klik simpan
11 : simpan setting()

14 : tampilkan informasi hasil proses update()

12 : update setting()

13 : hasil proses update

15 : melihat informasi hasil proses update setting store

Gambar 4.6 Mengubah tampilan halaman utama


Keterangan:
Admin memilih menu system, sistem menampilkan submenu system.Admin
memilih menu setting, sistem menampilkan halaman setting. Admin memilih tab
store, sistem menampilkan halaman form edit store. Admin mengubah tampilan
kemudian kemudian menampilkan konfirmasi hasil update data.
3. Mengelola Kategori

Mengelola kategori produk didalamnya terdapat beberapa proses yaitu


menambah, mengubah dan menghapus data kategori produk, untuk lebih jelasnya
dapat dilihat sebagai berikut:
a. Menambah kategori
Halaman ini diperuntukkan bagi admin untuk menambah data kategori
produk yang akan dijelaskan pada gambar 4.7 Activity diagram menambah
kategori dan gambar 4.8 sequence diagram menambah kategori.

admin

sistem

start

memilih menu
catalog

memilih menu
categories

memilih tombol
add new

menampilkan
submenu catalog

menampilkan halaman
category list

menampilkan form
add category

mengisi form
add category

menyimpan
kedalam database
menampilkan kembali
halaman category list
end

Gambar 4.7 Activity diagram menambah kategori

Dashboard

Control Kategori

Tampilan Kategori

Control Add Kategori

Form Add Kategori

Data Kategori

: Administrator
1 : Pilih Menu Catalog > Categori()
2 : buka halaman kategori()
3 : buka halaman kategori()

4 : membuka halaman kategori()


5 : menampilkan halaman kategori
6 : memilih menu tambah kategori
7 : tampilkan formtambah kategori()
8 : tampilkan form tambah kategori()

9 : menampilkan formtambah kategori()


10 : menampilkan form tambah kategori

11 : mengisi formtambah, klik simpan


12 : simpan data kategori()

13 : simpan data kategori()


14 : insert data kategori()

15 : hasil proses insert

16 : tampilkan tampilan kategori + info hasil proses tambah kategori()


17 : menampilkan daftar karegori + info hasil proses tambah kategori()
18 : melihat daftar kategori + informasi hasil proses tambah kategori

Gambar 4.8 sequence diagram menambah kategori


Keterangan:
Admin memilih menu catalog kemudian sistem menampilkan submenu catalog.
Admin

memilih menu categories kemudian sistem menampilkan halaman

category. Admin memilih menu add new kemudian sistem menampilkan halaman
add category. Admin mengisi data untuk menambah kategori kemudian sistem
menyimpan data ke dalam database dan menampilkan kembali halaman category.
b. Mengubah kategori
Halaman ini diperuntukkan bagi admin untuk mengubah kategori produk yang
dijual pada Butik Akiko yang akan dijelaskan pada gambar 4.9 Activity diagram
mengubah kategori dan gambar 4.10 sequence diagram mengubah kategori.
admin

sistem

start

memilih menu
catalog

memilih menu
categories

memilih category
yang akan diubah

menampilkan
submenu catalog

menampilkan
halaman category list

menampilkan form
edit category

mengubah
data category
memilih
tombol save

menyimpan
update data
menampilkan kembali
halaman category list
end

Gambar 4.9 Activity diagram mengubah kategori

Dashboard

Control Kategori

Tampilan Kategori

Control Edit Kategori

FormEdit Kategori

Data Kategori

: Administrator
1 : Pilih Menu Catalog > Categori()
2 : buka halaman kategori()
3 : buka halaman kategori()

4 : membuka halaman kategori()


5 : menampilkan halaman kategori
6 : memilih kategori yang akan diubah, klik tombol edit
7 : tampilkan formedit kategori()
8 : tampilkan formedit kategori()

9 : menampilkan formedit kategori()


10 : menampilkan formedit kategori
11 : mengubah isi formedit kategori, klik simpan
12 : simpan data kategori()

13 : simpan data kategori()


14 : update data kategori()

15 : hasil proses update

16 : tampilkan tampilan kategori + info hasil proses update kategori()


17 : menampilkan daftar karegori + info hasil proses update kategori()
18 : melihat daftar kategori + informasi hasil proses update kategori

Gambar 4.10 Sequence diagram mengubah kategori

Keterangan:
Admin memilih menu catalog, sistem menampilkan submenu catalog. Admin
memilih menu categories, sistem menampilkan halaman category. Admin
memilih category yang akan diubah kemudian sistem menampilkan halaman
edit. Admin mengubah data kategori kemudian sistem menyimpan update data
dan menampilkan kembali halaman category list.
c. Menghapus kategori
Halaman ini diperuntukkan bagi admin untuk menghapus kategori produk
yang akan dijelaskan pada gambar 4.11 Activity diagram menghapus kategori
dan gambar 4.12 sequence diagram menghapus kategori.
admin

sistem

s tart

menampilkan
submenu catalog

memilih menu
catalog

menampilkan
halaman category list

memilih menu
categories

memilih category
yang akan dihapus

tidak

ya
menghapus
data
menampilkan kembali
halaman category list
end

Gambar 4.11 Activity diagram menghapus kategori


Dashboard

Control Kategori

Tampilan Kategori

Control Hapus Kategori

Data Kategori

: Administrator
1 : Pilih Menu Catalog > Categori()
2 : buka halaman kategori()
3 : buka halaman kategori()

4 : membuka halaman kategori()


5 : menampilkan halaman kategori
6 : memilih kategori yang akan dihapus, klik tombol hapus
7 : tampilkan konfirmasi hapus()

8 : melihat konfirmasi hapus


9 : pilih tidak

10 : hide konfirmasi hapus

11 : melihat kembali halaman kategori


12 : memilih kategori yang akan dihapus, klik tombol hapus
13 : konfirmasi hapus

14 : melihat konfirmasi hapus


15 : pilih ya
16 : hapus data kategori()

17 : hapus data()

18 : hasil proses hapus


19 : tampilkan halaman kategori + info hasil proses hapus kategori()

20 : menampilkan daftar karegori + info hasil proses hapus kategori()

21 : melihat daftar kategori + informasi hasil proses hapus kategori

Gambar 4.12 sequence diagram menghapus kategori


Keterangan:
Admin memilih menu catalog kemudian sistem menampilkan submenu
catalog. Admin memilih menu categories, sistem menampilkan halaman
category. Admin memilih kategori yang ingin dihapus, kemudian sistem akan
mengecek jika tidak sistem akan menampilkan kembali halaman category list.
Jika ya maka sistem menghapus data dan menampilkan kembali halaman
category list.
4. Mengelola Produk
Mengelola produk didalamnya terdapat beberapa proses yaitu menambah,
mengubah dan menghapus data produk yang dijual pada Butik Akiko, untuk
lebih jelasnya dapat dilihat sebagai berikut:
a. Menambah produk
Halaman ini diperuntukkan bagi admin untuk menambah data produk
yang dijual pada Butik Akiko yang akan dijelaskan pada gambar 4.13
Activity diagram menambah produk dan gambar 4.14 sequence diagram
menambah produk.

admin

sistem

start

memilih menu
catalog

memilih menu
products

memilih tombol
add new

menampilkan
submenu catalog

menampilkan halaman
product list

menampilkan form
add product

mengisi form
add product

menyimpan
kedalam database
menampilkan kembali
halaman product list
end

Gambar 4.13 Activity diagram menambah produk

Dashboard

Control Produk

Tampilan Produk

Control Add Produk

Form Add Produk

Data Produk

: Administrator
1 : Pilih Menu Catalog > Produki()
2 : buka halaman produk()
3 : buka halaman produk()

4 : membuka halaman produk()


5 : menampilkan halaman produk
6 : memilih menu tambah produk
7 : tampilkan formtambah produk()
8 : tampilkan formtambah produk()

9 : menampilkan formtambah produk()


10 : menampilkan formtambah produk

11 : mengisi formtambah, klik simpan


12 : simpan data produk()

13 : simpan data produk()


14 : insert data produk()

15 : hasil proses insert

16 : tampilkan tampilan produk + info hasil proses tambah produk()


17 : menampilkan daftar produk + info hasil proses tambah produk()
18 : melihat daftar produk + informasi hasil proses tambah produk

Gambar 4.14 Sequence Diagram Menambah Produk


Keterangan:

Admin memilih menu catalog kemudian sistem menampilkan submenu


catalog. Admin memilih menu products kemudian sistem menampilkan
halaman product. Admin memilih tombol add new kemudian sistem
menampilkan halaman add product. Admin mengisi data-data untuk menambah
product kemudian sistem menyimpan data ke dalam database dan menampilkan
kembali halaman product.
b. Mengubah produk
Halaman ini diperuntukkan bagi admin untuk mengubah produk yang
dijual pada Butik Akiko yang akan dijelaskan pada gambar 4.15 Activity
diagram mengubah produk dan gambar 4.16 sequence diagram mengubah
produk.

admin

sistem

start

memilih menu
catalog

memilih menu
products

memilih product
yang akan diubah

menampilkan
submenu catalog

menampilkan
halaman product list

menampilkan form
edit product

mengubah
data product
memilih
tombol save

menyimpan
update data
menampilkan kembali
halaman product list
end

Gambar 4.15 Activity diagram Mengubah Produk

Dashboard

Control Produk

Tampilan Produk

Control Edit Produk

FormEdit Produk

Data Produk

: Administrator
1 : Pilih Menu Catalog > Produk()
2 : buka halaman produk()
3 : buka halaman produk()

4 : membuka halaman produk()


5 : menampilkan halaman produk
6 : memilih produk yang akan diubah, klik tombol edit
7 : tampilkan formedit produki()
8 : tampilkan formedit produk()

9 : menampilkan formedit produk()


10 : menampilkan formedit produk
11 : mengubah isi formedit produk, klik simpan
12 : simpan data produk()

13 : simpan data produk()


14 : update data produk()
15 : hasil proses update

16 : tampilkan tampilan produk + info hasil proses edit produk()


17 : menampilkan daftar produk + info hasil proses update data produk()

18 : melihat daftar produk + informasi hasil proses update data produk

Gambar 4.16 Sequence diagram Mengubah Produk

Keterangan:
Admin memilih menu catalog, sistem menampilkan submenu catalog.Admin
memilih menu products, sistem menampilkan halaman product. Admin memilih
product yang akan diubah kemudian sistem menampilkan kembali halaman edit
product. Admin mengubah data produk kemudian sistem menyimpan update
data dan menampilkan kembali halaman product.
c. Menghapus produk
Halaman ini diperuntukkan bagi admin untuk menghapus produk yang
akan dijelaskan pada gambar 4.17 Activity diagram menghapus produk dan
gambar 4.18 sequence diagram menghapusproduk.

admin

sistem

start

menampilkan
submenu catalog

memilih menu
catalog

menampilkan
halaman product list

memilih menu
products

memilih product
yang akan dihapus

tidak

ya
menghapus
data
menampilkan kembali
halaman product list
end

Gambar 4.17 Activity diagram Menghapus Produk

Dashboard

Control Produk

Tampilan Produk

Control Hapus Produk

Data Produk

: Administrator
1 : Pilih Menu Catalog > Produk()
2 : buka halaman produk()
3 : buka halaman produk()

4 : membuka halaman produk()


5 : menampilkan halaman produk
6 : memilih produk yang akan dihapus, klik tombol hapus
7 : tampilkan konfirmasi hapus()

8 : melihat konfirmasi hapus


9 : pilih tidak

10 : hide konfirmasi hapus

11 : melihat kembali halaman produk


12 : memilih produk yang akan dihapus, klik tombol hapus
13 : konfirmasi hapus

14 : melihat konfirmasi hapus


15 : pilih ya
16 : hapus data produk()

17 : hapus data produk()

18 : hasil proses hapus


19 : tampilkan halamanproduk + info hasil proses hapus produk()

20 : menampilkan daftar produk + info hasil proses hapus produk()

21 : melihat daftar produk + informasi hasil proses hapus produk

Gambar 4.18 Sequence diagram menghapus produk

Keterangan:
Admin memilih menu catalog, sistem menampilkan submenu catalog. Admin
memilih menu products, sistem menampilkan halaman product list. Admin
memilih product yang akan dihapus kemudian sistem akan mengecek apakah ya
atau tidak. Jika admin memilih tidak maka sistem akan menampilkan kembali
halaman product. Jika ya maka sistem akan menghapus data dan menampilkan
kembali halaman product.
5. Mengelola pemesanan
Mengelola pemesanan didalamnya terdapat beberapa proses yaitu
membaca, mengubah, menghapus data yaitu masing-masing akan digambarkan
dengan menggunakan dua diagram yaitu Activity diagram dan sequence diagram,
untuk lebih jelasnya dapat dilihat sebagai berikut:
a. Membaca Pemesanan
Halaman ini diperuntukkan bagi admin untuk membaca transaksi
pemesanan yang akan dijelaskan pada gambar 4.19 Activity diagram membaca
pemesanan dan gambar 4.20 sequence diagram membaca pemesanan.

admin

sistem

start

memilih menu
sales

memilih menu
orders

menampilkan
submenu sales

menampilkan
halaman order list

memilih transaksi
yang akan dibaca
memilih menu
view

menampilkan halaman
detail orders
end

Gambar 4.19 Activity diagram Membaca Pemesanan

Dashboard

Control Orders

Tampilan Orders

Control Detail Order

Tampilan Detil Order

Data Order

: Administrator
1 : Pilih menu Sales > Order()
2 : tampilkan halaman orders()

5 : tampilkan halaman orders()

3 : ambil data orders()

4 : berikan data orders

6 : menampilkan halaman orders()


7 : menampilkan halaman orders
8 : Memilih transaksi yang akan dibaca
9 : tampilkan halaman detil order()

10 : ambil data order()

11 : berikan data order


12 : tampilkan halaman detil order()

13 : menampilkan halaman detil order()

14 : menampilkan halaman detil order

Gambar 4.20 sequence diagram Membaca Pemesanan


Keterangan:
Admin memilih menu sales, sistem menampilkan pilihan menu system. Admin
memilih menu orders, sistem menampilkan halaman order list. Admin
memilih transaksi yang akan dibaca, sistem menampilkan halaman detail
order.
b. Mengubah status transaksi pemesanan
Halaman ini diperuntukkan bagi admin mengubah transaksi status
pemesanan pelanggan yang akan dijelaskan pada gambar 4.21 Activity

diagram mengubah transaksi pemesanan dan 4.22 sequence diagram


mengubah status transaksi pemesanan.
admin

sistem

start

memilih menu
sales

memilih menu
orders

memilih transaksi
yang akan diubah

mengubah data
pemesanan

menampilkan
submenu sales

menampilkan
halaman order list

menampilkan
halaman detail order

simpan data

menampilkan kembali
halaman order list
end

Gambar 4.21 Activity diagram mengubah status pemesanan

Dashboard

Control Orders

Tampilan Orders

Control Ubah Order

Tampilan Ubah Order

: Administrator
1 : Pilih menu Sales > Order()
2 : tampilkan halaman orders()

3 : ambil data orders()

5 : tampilkan halaman orders()

4 : berikan data orders

6 : menampilkan halaman orders()


7 : menampilkan halaman orders
8 : Memilih transaksi yang akan diubah
9 : tampilkan halaman ubah order()

10 : ambil data order()

11 : berikan data order


12 : tampilkan halaman ubah order()

13 : menampilkan halaman ubah order()

14 : menampilkan halaman ubah order


15 : mengubah data order, klik simpan
16 : Simpan perubahan order()

17 : update data order()

18 : hasil proses udpdate

19 : tampilkan halaman orders + info hasil proses update()

20 : menampilkan halaman order + info hasil proses update()


21 : menampilkan halaman orders + info hasil proses update

Gambar 4.22 Sequence diagram mengubah status pemesanan

Data Order

Keterangan:
Admin memilih menu sales, sistem menampilkan pilihan menu sales. Admin
memilih menu orders, sistem menampilkan halaman order. Admin memilih
transaksi yang akan diubah, sistem menampilkan halaman detail order. Admin
mengubah data kemudian sistem menyimpan update data dan menampilkan
kembali halaman order list.
c. Menghapus transaksi pemesanan
Halaman ini memungkinkan admin untuk menghapus transaksi pemesanan
yang akan dijelaskan pada gambar 4.23 Activity diagram menghapus transaksi
pemesanan dan gambar 4.24 sequence diagram
pemesanan.

menghapus transaksi

admin

sistem

start

membuka halaman
utama admin

menampilkan halaman
utama admin

menampilkan
halaman order list

memilih menu
total orders

memilih transaksi
yang akan dihapus
tidak yakin

yakin

menghapus transaksi
pemesanan
menampilkan kembali
halaman order list
end

Gambar 4.23 Activity diagram Menghapus Transaksi Pemesanan

Dashboard

Control Orders

Tampilan Orders

Control Hapus Order

Data Order

: Administrator
1 : Pilih Menu Sales > Orders()
2 : buka halaman orders()
3 : buka halaman orders()

4 : membuka halaman orders()


5 : menampilkan halaman orders
6 : memilih data order yang akan dihapus, klik tombol hapus
7 : tampilkan konfirmasi hapus()

8 : melihat konfirmasi hapus


9 : pilih tidak

10 : hide konfirmasi hapus

11 : melihat kembali halaman orders


12 : memilih data order yang akan dihapus, klik tombol hapus
13 : konfirmasi hapus

14 : melihat konfirmasi hapus


15 : pilih ya
16 : hapus data order()

17 : hapus data order()

18 : hasil proses hapus


19 : tampilkan halaman orders + info hasil proses hapus order()

20 : menampilkan daftar order + info hasil proses hapus order()

21 : melihat daftar order + informasi hasil proses hapus order

Gambar 4.24 Sequence diagram Menghapus Transaksi Pemesanan

Keterangan:
Admin memilih menu sales, sistem menampilkan pilihan menu sales. Admin
memilih menu orders, sistem menampilkan halaman order. Admin memilih
transaksi yang akan dihapus, sistem mengecek apakah yakin atau tidak, jika
admin memilih tidak maka sistem akan menampilkan kembali halaman
orderlist. Jika ya maka sistem akan menghapus data dan menampilkan kembali
halaman orderlist.
6. Logout admin
Halaman logout admin memungkinkan admin keluar dari halaman admin yang
akan dijelaskan pada gambar 4.25 Activity diagram logout admin dan gambar 4.26
Sequence diagram logout admin.
admin

sistem

start

memilih menu
logout

proses
perintah logout
menampilkan
halaman login

end

Gambar 4.25 Activity diagram logout admin

Dashboard

Control Logout

Tampilan Login

: Administrator
1 : memilih menu logout()
2 : logout()
3 : tampilkan formlogin()

4 : menampilkan formlogin

Gambar 4.26 Sequence diagram logout admin


Keterangan:
Admin memilih menu logout, sistem memproses perintah keluar, dan kemudian
sistem akan keluar dan menampilkan halaman login .
B. Anggota
1. Login anggota
Halaman ini memungkinkan anggota Butik Akiko untuk login ke dalam sistem
dengan kewenangan tertentu yang akan dijelaskan pada gambar 4.27 Activity
diagram login anggota dan gambar 4.28 sequence diagram login anggota.

Gambar 4.27 Activity diagram login anggota

Halaman Utama Website

Control Login

Halaman Login

Data Anggota

: Anggota
1 : mengakses website()

2 : menampilkan halaman utama website


3 : memilih menu Login
4 : tampilkan formlogin()

5 : tampilkan formlogin()

6 : menampilkan formlogin()
7 : mengisi username dan password
8 : validasi()
9 : validasi()

10 : tidak valid,tampilkan informasi kesalahan()


11 : menampilkan informasi kesalahan
12 : mengisi username dan password
13 : validasi()

14 : validasi()

15 : cari data akun()

16 : hasil pencarian data akun tidak ditemukan


17 : tampilkan pesan akun tidak ditemukan()
18 : menampilkan pesan akun tidak ditemukan
19 : mengisi username dan password
20 : validasi()

21 : validasi()

22 : cari data akun()

23 : hasil pencarian data akun ditemukan


24 : Masuk ke halaman admin()

25 : menampilkan halaman utama anggota

Gambar 4.28 Sequence diagram login anggota

Halaman Utama Anggota

Keterangan:
Anggota memilih menu login, sistem menampilkan halaman login.Anggota
menginputkan username dan password. Sistem akan melakukan pengecekan
kedalam database. Jika salah sistem akan menampilkan menampilkan pesan
error dan anggota login kembali. Jika benar, maka akan menampilkan halaman
utama anggota.
2. Melihat halaman utama Website
Halaman ini memungkinkan anggota mengakses halaman utama Website yang
akan dijelaskan pada gambar 4.29 Activity diagram melihat halaman utama
Website dan gambar 4.30 Sequence diagram melihat halaman utama Website.

Gambar 4.29 Activity diagram melihat halaman utama website

Halaman Utama

Control Halaman Utama

Data Setting

: Anggota
1 : mengakses alamat website()
2 : tampilkan halaman utama()
3 : ambil data setting website -theme dll()

4 : berikan data setting


5 : menampilkan halaman utama
6 : menampilkan halaman utama

Gambar 4.30 Sequence diagram melihat halaman utama Website


Keterangan :
Anggota membuka Website lalu sistem menampilkan halaman utama website.
3. Melihat kategori
Halaman ini memungkinkan anggota untuk melihat kategori produk yang akan
dijelaskan pada gambar 4.31 Activity diagram melihat kategori dan gambar 4.32
Sequence diagram melihat kategori

Gambar 4.31 Activity diagram melihat kategori

Halaman Utama

Control Kategori

Halaman Kategori

Data kategori dan produk

: Anggota
1 : mengakses halaman website()

2 : menampilkan halaman utama


3 : memilih menu kategori
4 : tampilkan halaman kategori()
5 : tampilkan halaman kategori()
6 : ambil data kategori dan produk()

7 : berikan data kaegori dan produk


8 : menampilkan halaman kategori()
9 : melihat halaman kategori dan beberapa data produk

Gambar 4.32 Sequence diagram melihat kategori

Keterangan :
Anggota membuka Website lalu sistem menampilkan halaman utama kemudian
anggota memilih menu kategori yang diinginkan dan sistem menampilkan
halaman kategori yang diinginkan anggota.
4. Melihat contact us
Halaman ini memungkinkan anggota untuk melihat kontak yang akan
dijelaskan pada gambar 4.33 Activity diagram melihat us dan gambar 4.34
sequence diagram melihat contact us.

Gambar 4.33 Activity diagram melihat kontak

Halaman Utama

Control Kontak Kami

Halaman Kontak Kami

: Anggota
1 : mengakses halaman website()

2 : menampilkan halaman utama


3 : memilih menu kontakkami
4 : tampilkan halaman kontakkami()
5 : tampilkan halaman kontakkami()

6 : menampilkan halaman kontakkmi()


7 : menampilkan halaman kontakkami

Gambar 4.34 sequence diagram melihat kontak

Keterangan :
Anggota membuka Website lalu sistem menampilkan halaman utama
kemudian anggota memilih menu contact dan sistem menampilkan
halaman contact.

5. Melihat produk
Halaman ini memungkinkan anggota untuk melihat produk yang dijual
Butik Akiko yang akan dijelaskan pada gambar 4.35 Activity diagram melihat
produk dan gambar 4.36 sequence diagram melihat produk.

Gambar 4.35 Activity diagram melihat produk


Halaman Utama

Control Kategori

Halaman Kategori

Data kategori

Control Produk

Halaman Produk

Data Produk

: Anggota
1 : mengakses halaman website()

2 : menampilkan halaman utama


3 : memilih menu kategori
4 : tampilkan halaman kategori()
5 : tampilkan halaman kategori()
6 : ambil data kategori()

8 : menampilkan halaman kategori()

7 : berikan data kategori

9 : melihat halaman kategori dan beberapa data produk


10 : pilih gambar produk
11 : tampilkan halaman detil produk()
12 : tampilkan halaman produk()
13 : ambil data produk()

14 : berikan data produk


15 : tampilkan halaman produk
16 : menampilkan halaman produk()
17 : menampilkan halaman detik produk

Gambar 4.36 sequence diagram melihat produk


Keterangan :
Anggota membuka Website lalu sistem menampilkan halaman utama kemudian
kemudian anggota memilih menu kategoriyang diinginkan dan sistem
menampilkan halamankategori yang diinginkan anggota. Anggota memilih

gambar produk yang diinginkan kemudian sistem menampilkan halaman detail


produk.
6. Order
Order memungkinkan anggota untuk memesan produk yang dijual di Butik
Akiko yang akan dijelaskan pada gambar 4.37 Activity diagram order dan 4.38
sequence diagram order.

Gambar 4.37 Activity diagram order

Tampilan
Website

Control
Produk

Tanpilan Detil
Produk

Control
Keranjang

Tampilan
Keranjang

Control
Ceckout

Tampilan
checout

Control
Order

Confirm
Order

: Anggota
1 : mengakses alamat website()

2 : menampilkan halaman website


3 : memilih detil produk
4 : tampilkan detil produk()
5 : tampilkan detil produk()

6 : menampilkan detil produk()


7 : menampilkan detil produk
8 : pilih tombol beli
9 : masukkan data produk ke keranjang belanja()
10 : buka halaman keranjang belanja()

11 : menampilkan halaman keranjang belanja()


12 : menampilkan keranjang belanja
13 : memilih tombol checkout
14 : tampilkan halaman checkout()
15 : tampilkan halaman checkout()

16 : menampilkan formbilling detail()


17 : menampilkan formbilling detail
18 : mengisi formbilling detail, klik next
19 : simpan billing detail, next()

20 : tampilkan formdelivery methode()

21 : menampilkan formdelivery methode()


22 : menampilkan formdelivery methode
23 : mengisi formdelivery methode, klik next
24 : menyimpan delivery methode, next()
25 : tampilkan payment methode()

26 : menampilkan formpayment methode()


27 : menampilkan frompayment methode
28 : mengisi formpayment methode, klik order
29 : simpan data pesanan()
30 : tampilkan informasi hasil proses()

31 : menampilkan informasi hasil proses order()


32 : menampilkan infromasi hasil proses order

Gambar 4.38 Sequence diagram order

Keterangan:
Anggota mengakses Website Butik Akiko kemudian sistem menampilkan
halaman utama.Anggota memilih kategori produk yang diinginkan sistem
menampilkan halaman jenis produk. Anggota memilih produk yang diinginkan
sistem menampilkan halaman detail produk. Anggota memasukkan produk
kedalam keranjang, sistem menyimpan data.Anggota memilih checkout option,
sistem menampilkan form billing detail, anggota mengisi form billing detail.
Sistem menampilkan form delivery detail, anggota mengisi form delivery detail.
Sistem menampilkan form delivery method, anggota mengisi form delivery
method.Sistem menampilkan halaman payment method, anggota mengisi
halaman payment method. Sistem memproses order dan menampilkan konfirmasi
pesanan berhasil.
7.

Logout anggota
Halaman ini digunakan untuk keluar dari halaman utama anggota yang akan
dijelaskan pada gambar 4.39 Activity diagram logout anggota dan gambar 4.40
sequence diagram logout anggota

anggota

sistem

start

memilih menu
logout

proses perintah
logout

menampilkan
halaman website
end

Gambar 4.39 Activity diagram logout anggota


Tampilan Halaman Anggota

Control Logout

Tampilan Halaman Umum

: Anggota

1 : Memilih menu logout()


2 : memproses logout()
3 : menampilkan halaman umum()

4 : menampilkan halaman umum

Gambar 4.40 Sequence diagram logout anggota


Keterangan:
Anggota memilih menu logout, sistem memproses perintah keluar, dan
kemudian sistem akan keluar dan menampilkan halaman Website.

Untuk mengetahui keterkaitan antara subsistem dengan subsistem lainnya secara


keseluruhan, penulis menggunakan collaboration diagram, component diagram dan
deployment diagram dan class diagram yaitu sebagai berikut :
a. Colaboration diagram menunjukan message-message obyek yang dikirimkan
satu sama lain, colaboration juga menggambarkan interaksi antar objek seperti
sequence diagram, tetapi lebih mengklikkan pada peran masing masing objek
dan bukan pada waktu penyampaian message.

Berikut adalah colaboration

diagram yang dibutuhkan.


1. Collaboration diagram Login admin
Collaboration diagram Login admin menggambarkan scenario dari
media promosi dan pemesanan pada Butik Akiko yang menunjukan interaksi
antara admin dengan sistem dalam proses Login. Untuk lebih jelasnya akan
digambarkan pada gambar 4.41.
1: input us ername dan password

form login

: admin
4: input ulang username dan pass word
2: cek database

penjualan
3: valid

halaman
admin

Gambar 4.41 Collaboration diagram Login admin

2. Collaboration diagram Login anggota


Collaboration diagram Login anggota menggambarkan skenario dari
media promosi dan pemesanan pada Butik Akiko yang menunjukan interaksi
antara anggota dengan sistem dalam proses Login. Untuk lebih jelasnya akan
digambarkan pada gambar 4.42
1: input username dan password

form login

: anggota
4: input ulang username dan password
2: cek database

penjualan
3: valid

halaman
anggota

Gambar 4.42 Collaboration diagram Login Anggota

3. Collaboration diagram pemesanan


Collaboration diagram pemesanan menggambarkan interaksi antara
anggota dengan sistem dalam proses pemesanan untuk lebih jelasnya akan
dijelaskan pada gambar 4.43.

tampil pesanan
8: cetak invoice

6: isi data produk

form
pemesanan

invoice
10: tampil invoice
9: ubah status(invoice)

produk
admin
5: mengisi pesanan
7: isi data pelanggan
11: simpan

3: lihat produk 4: tampil data (produk)

pelanggan

12: update pemesanan

koneksi

1: login anggota

: anggota 2: validasi anggota


user:
anggota

Gambar 4.43 Collaboration diagram pemesanan

pemesanan

a. Class Diagram
Class adalah sebuah spesifikasi yang jika diinisiasi akan menghasilkan
sebuah objek. Class diagram merupakan inti dari pengembangan dan desain
berorientasi objek.

Class diagram juga dapat digunakan untuk merancang

basisdata, yaitu objek-objek yang datanya akan disimpan secara permanen/tetap


(persistence) dalam aplikasi.
Class diagram dan penjelasan-penjelasan berikut ini adalah class diagram
yang menggambarkan hubungan antar object yang akan menjadi data tetap (tabel)
dalam basisdata opencart. Class diagram Opencart akan dibagi dalam beberapa
diagram karena banyaknya object yang ada.

1. Class diagram Webstore / Toko Online


Class diagram webstore merupakan gambaran relasi class-class yang
tentang toko online. Class-class tersebut adalah class store, class setting, class
layout, class layout_route, class information, class information_to_store, class
information_to_layout, class information description, class extension, class user,
class

banner,

class

weight_class,

class

weight_class_description,

class

length_class, dan class length_class_description.


Class diagram data toko online digambarkan dengan Gambar 4.44 Class
diagram kelompok class webstore.

Gambar 4.14 Class diagram kelompok class webstore

2. Class diagram Produk


Class diagram produk menggambarkan relasi/hubungan antar objek-objek
yang disimpan sebagai data permanen/tetap yang berkaitan dengan data produk.
Class-class yang berkaitan dengan data produk yaitu : class category, class
category_description,

class

category_to_store,

class

product,

product_to_store, class product_image, class product_tag, class

class

manufacture,

class manufacture_to_store, class product_discount, class product_reward, class


product_special, class stok_status, class option, class atribut, class product_option,
class product_atribut, dan class review.
Hubungan antar class yang menyimpan data tentang produk digambarkan
dengan Gambar 4.45 Class diagram kelompok class data produk.

Gambar 4.11 Class diagram kelompok class data produk

3.Class diagram Order / Pemesanan


Class diagram pesanan menggambarkan relasi/hubungan antar objekobjek yang disimpan sebagai data permanen/tetap yang berkaitan dengan data
pemesanan produk.
Class-class yang berkaitan dengan data pemesanan yaitu : class order,
class order_total, class order_download, class order_product, class order_history,
class order_status, class order_option, class affiliate, class affiliate_transaction,
class voucer, class voucer_history, dan class coucer_theme.
Hubungan antar class yang menyimpan data tentang pemesanan produk
digambarkan dengan Gambar 4.45 Class diagram kelompok class data pesanan.

Gambar 4.46 Class diagram kelompok class data pesanan


4. Class diagram Konsumen

Class diagram konsumen menggambarkan relasi/hubungan antar objek-objek yang disimpan sebagai
data permanen/tetap yang berkaitan dengan data konsumen.
Class-class yang berkaitan dengan data konsumen yaitu : class customer, class customer_ip, class_
customer_group, class customer_reward, class customer_transaction, class coupon, class coupon_product,
dan class_coupon_history.
Hubungan antar class yang menyimpan data tentang konsumen digambarkan dengan Gambar 4.47
Class diagram kelompok class data konsumen.

Gambar 4.47 Class diagram data konsumen

5. Class diagram Lokalisasi


Class diagram lokalisasi menggambarkan relasi/hubungan antar objek-objek yang disimpan sebagai
data permanen/tetap yang berkaitan dengan data lokalisasi.
Class-class yang berkaitan dengan data lokalisasi yaitu : class address, class country, class zone,
class geo_zone, class zone_to_geo_zone, class currency, dan class language.
Hubungan antar class yang menyimpan data lokalisasi digambarkan dengan Gambar 4.48 Class
diagram kelompok class data lokalisasi.

Gambar 4.48 Class diagram kelompok class data lokalisasi


6. Class diagram Pajak
Class diagram pajak menggambarkan relasi/hubungan antar objek-objek yang disimpan sebagai data
permanen/tetap yang berkaitan dengan data pajak.
Class-class yang berkaitan dengan data pajak yaitu : class tax_class, class tax_rate, class tax_rule, dan
class tax_rate_to_customer_group.
Hubungan antar class yang menyimpan data tentang pajak digambarkan dengan Gambar 4.49 Class
diagram kelompok class data pajak.

Gambar 4.49 Class diagram kelompok class data pajak

b. Component Diagram
Component diagram digunakan untuk menggambarkan organisasi dan ketergantungan komponenkomponen software sistem.Diagram ini dapat digunakan untuk menunjukkan bagaiamana kode pemrograman
dibagi menjadi modul-modul. Berikut Component diagram yang akan dijelaskan pada gambar 4.45 Component
diagram pemesanan.

aplikasi ini berada diserver web


sehingga kita tidak perlu
mendefinisikan secara detail,
tujuan digambarkan hanya
untuk melihat keterhubungan
antar aplikasi
database Butk Akiko

<<Application>>
Web server

<<Application>>
Website
Informasi
pembelian

Login

Informasi
pengiriman

Frequently ask
Question

akses admin

Gambar 4.45 Component diagram pemesanan


c. Deployment Diagram
Diagram Deployment menampilkan semua titik (node) dalam suatu jaringan, hubungan antar mereka, dan
proses proses yang dijalankan pada masing masing titik. Berikut ini Deployment diagram yang akan
dijelaskan pada gambar 4.46 Deployment Diagram Pemesanan.

Gambar 4.46 Deployment Diagram


Pada sistem informasi promosi dan pemesanan terdapat beberapa komponen-komponen yang mendukung
jalannya Websiteyaitu :
b. Web server untuk menyimpan halaman web yang ada
c. Database yang digunakan untuk menyimpan data-data Website
d. Client adalah pengguna yang mengakses Website.

4.4 Desain Database


4.4.1 Desain Tabel
Desain tabel ini menjelaskan tentang tabel apa saja yang akan digunakan oleh penulis dan nantinya akan
berhubungan dengan proses selanjutnya. Untuk lebih jelasnya dapat dilihat sebagai berikut:
1. Tabel customer
Tabel ini berisi data pelanggan atau anggota yang akan dijelaskan pada tabel 4.16 Desain tabel customer.
Tabel 4.16 Desain tabel customer
Nama field
customer_id

Type
Int

width
11

customer_group_id
store_id
Firstname

Int
Int
Varchar

11
11
32

Lastname

Varchar

32

Email

Varchar

96

Telephone

Varchar

32

password

Varchar

40

Keterangan
Sebagai primary key
Berisi id dari pengguna
Terisi secara otomatis oleh sistem
berisi id group customer
Berisi id store
Berisi nama awal customer
Tidak boleh kosong
Berisi nama akhir customer
Tidak boleh kosong
Berisi email customer
Harus format email
Tidak boleh kosong
Berisi nomer telepon customer
Tidak boleh dikosongkan
Berisi password customer
Apabila customer lupa password
konfirmasi password baru akan dikirim

Address_id

Int

lewat email
Berisi id alamat customer
Sebagai foreign key

11

2. Tabel address
Tabel ini berisi alamat pelanggan yang akan dijelaskan pada tabel 4.22 tabel address
Tabel 4.17 Tabel address
Nama field
Address_id

Type
Int

Wid th
11

customer_id

Int

11

Firstname

Varchar

32

Lastname

Varchar

32

Company

Varchar

40

Address_1

Varchar

128

Address_2

Varchar

128

City

Varchar

128

Postcode

varchar

10

Keterangan
Berisi id alamat customer
Sebagai foreign key
Berisi id dari pengguna
Terisi secara otomatis oleh sistem
Berisi nama awal customer
Harus diisi
Berisi nama akhir customer
Harus diisi
Jika nama Anda tunggal atau
hanya satu kalimat isikan saja
First name dan Last name dengan
nama tunggal Anda.
Berisi nama perusahaan customer
Boleh dikosongkan
Berisi alamat customer 1
Harus diisi
Berisi alamat customer 2
Boleh kosong
Berisi nama kota
Tidak boleh kosong
Berisi kodepos

Country_id

Int

11

Zone_id

Int

11

Custom_field

Text

Boleh kosong
Berisi nama negara customer
Tidak boleh kosong
Berisi nama provinsi customer
Tidak boleh kosong
Berisi custom_field
Terisi otomatis oleh sistem

3. Tabel user
Tabel ini digunakan untuk menyimpan data pelanggan atau calon pembeli yang akan dijelaskan pada tabel 4.18
Tabel 4.18 Desain tabel user
Nama field
User _id

Type
Integer

Wid th
11

User _group_id
Username

Integer
Varchar

11
20

password

Varchar

32

Firstname

Varchar

32

Lastname

Varchar

32

Email

Varchar

96

Status
Ip
Date_added

Integer
Varchar
datetime

1
15

Keterangan
Berisi kode user
Bersifat primary key
Berisi kode grup user
Berisi nama user
Tidak boleh kosong
Berisi kode password user
Tidak boleh kosong
Berisi nama depan user
Tidak boleh kosong
Berisi nama belakang user
Tidak boleh kosong
Berisi email pelanggan
Tidak boleh kosong
Berisi status user
Berisi alamat ip user
Berisi tanggal registeruser

4. Tabel kategori
Tabel ini berisi kategori produk. Kategori produk digunakan untuk mengklasifikasikan produk yang dimiliki yang
akan dijelaskan pada tabel 4.19 desain tabel kategori.
Tabel 4.19 Desain Tabel Kategori
Nama field
Category_id

Type
Int

Wid th
11

Image
Parent_id
Sort_order
Date_added

Varchar
Int
Int
Datetime

255
11
3

Date_modified

Datetime

Status

Int

Keterangan
Sebagai primary key
Terisi otomatis oleh sistem
Berisi gambar kategori
Sebagai parent_id
Merupakan urutan kategori
Merupakan tanggal dibuatnya
kategori
Merupakan

tanggal

modifikasi

kategori
Berisi status category

5. Tabel produk
Tabel ini berisidata produk yang dijual Butik Akiko yang akan dijelaskan pada tabel 4.20.
Tabel 4.20 Desain Tabel Produk

Nama field

Type

Wid th

Keterangan

Product_id

Int

11

Model

varchar

64

Berisi kode barang


Bersifat primary key
Terisi otomatis oleh sistem
Berisi model barang

Sku

varchar

64

Berisi sku

Quantity
Image
Manufacturer_id
Price
Weight

Int
varchar
Int
decimal
decimal

4
255
11
(15,4)
(5,2)

Berisi jumlah produk


Berisi gambar produk
Berisi nama pabrik
Berisi harga produk
Berisi berat produk

4.4.2 Desain Input


Desain input dirancang sesederhana mungkin dengan maksud agar lebih mudah di mengerti oleh user atau
pemakai yang bersangkutan.
1. Form Login admin
Form Login adalah form yang pertama muncul saat pertama admin menjalankan aplikasi sebelum masuk ke
halaman utama dan dapat mengakses aplikasi yang akan dijelaskan pada gambar 4.47 Desain Login Admin

Gambar 4.47 Desain Login Admin


No
1
2

Nama Event
Username
Password

Keterangan
Diisi oleh admin dengan memasukkan
username
Diisi oleh admin dengan memasukkan
password

2. Halaman utama admin


Halaman utama admin ini terdiri dari beberapa menu yang telah aktif atau siap digunakan untuk
mengelola data. Halaman utama admin terdiri dari dashboard, catalog, extensions, sales, marketing, system,

tools dan report. Berikut adalah rancangan halaman utama admin yang akan dijelaskan pada gambar 4.48
Desain Halaman Utama Admin.

Gambar 4.48 Desain Halaman Utama Admin

3. Halaman kategori
Halaman ini digunakan admin untuk mengelola kategori produk yang dijual di Butik Akiko. Berikut adalah
rancangan halaman kategori yang akan dijelaskan pada gambar 4.49 Desain Halaman kategori admin.

Gambar 4.49 Desain Halaman Kategori Admin


Keterangan:

Kategori Name

Berisi nama kategori produk

Tambah

Digunakan untuk menambahkan


kategori produk

Hapus

Digunakan untuk menghapus kategori


produk

Ubah

Digunakan untuk edit kategori

4. Halaman produk
Halaman ini digunakan admin mengelola produk yang akan dijual pada Website Butik Akiko. Berikut adalah
desain halaman produk yang akan dijelaskan pada gambar 4.50 Desain halaman produk.

Gambar 4.50 Desain halaman produk

Keterangan:product name

Berisi nama produk

Image

Berisi gambar produk

Model

Berisi model produk

Price

Berisi harga jual produk

Quantity

Berisi jumlah produk yang ada

Status

Berisi status produk

Tambah

Digunakan untuk menambahkan


produk

Hapus

Digunakan untuk menghapus produk

Ubah

Digunakan untuk edit kategori

5. Halaman Information
Halaman ini digunakan untuk admin untuk mengelola informasi yang terdapat didalam Website meliputi FAQ
dan About us. Berikut adalah rancangan halaman information yang akan dijelaskan pada gambar 4.51 desain
halaman information.

Gambar 4.51 Desain Halaman Information.


Keterangan:

Information title

Berisi nama informasi

Sort order

Berisi no urut produk

Action

Digunakan untuk mengubah isi


informasi

6. Halaman modul

Halaman ini digunakan untuk menambahkan modul tambahan yang akan digunakan pada Website. Berikut
desain halaman modul yang akan dijelaskan pada gambar 4.52 desain halaman modul.

Gambar 4.52 Desain Halaman Modul


7. Halaman shipping
Halaman ini digunakan untuk admin mengelola setting pengiriman dan mengatur biaya kirim. Berikut desain
halaman shipping yang akan dijelaskan pada gambar 4.53 desain halaman shipping.

Gambar 4.53 Desain Halaman Shipping

8. Halaman Sales Report


Halaman ini digunakan admin untuk mengelola laporan penjualan yang akan dijelaskan pada gambar 4.54
desain halaman sales report

Gambar 4.54 Desain halaman sales report

9. Halaman setting
Halaman ini digunakan admin untuk mengelola bahasa, mengganti logo yang akan dijelaskan pada gambar
4.55 Desain halaman setting.

Gambar 4.55 Desain halaman setting


10. Halaman Utama Website
Dalam halaman anggota ada beberapa tampilan yang bisa dipilh yaitu tampilan untuk home, kategori, login ,
cart, about, contact us yang akan dijelaskan pada gambar 4.56 desain halaman utama Website

Gambar 4.56 Desain Halaman utama Website


11. Halaman login
Berikut adalah desain dari halaman login untuk member website butik akiko yang akan dijelaskan pada
gambar 4.57 desain halaman login .

Gambar 4.57 Halaman login


12. Halaman Kategori
Berikut adalah desain dari halaman kategori. Halaman ini berisi kategori produk yang dijual di Butik Akiko yang
akan dijelaskan pada gambar 4.58 desain halaman kategori.

Gambar 4.58 Halaman Kategori


13. Halaman FAQ
Berikut adalah desain dari halaman FAQ. Halaman ini berisi cara pemesanan dan pembayaran produk yang akan
dijelaskan pada gambar 4.59 desain halaman FAQ

Gambar 4.59 Desain Halaman FAQ


14. Desain halaman register
Halaman ini digunakan untuk pelanggan mendaftar menjadi anggota butik akiko yang akan dijelaskan pada
gambar 4.60 Desain halaman register

Gambar 4.60 Desain halaman register


4.5 Hasil (Jalannya Website)
1. Halaman login administrator

Gambar 4.61 Tampilan halaman login administrator

2. Halaman dashboard administrator

Gambar 4.62 Tampilan halaman dashboard administrator

3. Halaman Kelola Kategori Produk


Mengelola kategori produk dilakukan oleh admistrator. Mengelola berarti administrator dapat menambah,
mengubah, dan menghapus data kategori produk.
Produk butik akiko dikelompokkan menjadi kelompok produk pria, produk wanita, dan produk anak-anak. Setiap
kategori juga memiliki subkategori. Misal produk wanita terdapat subkategori bags/tas.
Pengelolaan kategori produk dapat dilakukan melalui akses menu Catalog Categories.
Berikut ini adalah tampilah halaman kelola kategori produk :

Gambar 4.63 Tampilan halaman kelola kategori produk

4. Halaman Kelola Data Produk

Gambar 4.64 Tampilan halaman kelola data produk

Gambar 4.65 Tampilan halaman tambah data produk

5. Halaman Kelola Informasi


Informasi dapat dikelola melalui menu Catalog information.
Berikut ini adalah tampilan halaman-halaman yang sudah ada secara default dan dapat segera kita edit untuk
melengkapi informasi di halaman website butik akiko.

Gambar 4.66 Tampilan halaman kelola informasi

6. Halaman kelola modul

Gambar 4.67 Tampilan halaman kelola modul


7. Halaman kelola shipping

Gambar 4.68 Tampilan halaman kelola shipping


8. Halaman Report

Gambar 4.69 Tampilan halaman report sales orders


9. Halaman Setting System
Setting sistem dapat dilakukan melalui menu Setting System. Data yang disimpan dan dapat diedit
melalui halaman setting system adalah data toko (nama, alamat, nomor telpon, email, fax, logo), setting berkenaan
dengan penampilan produk (jumlah item yang ditampilkan per kategori, jumlah huruf maksimal yang ditampilkan
dalam dsekripsi produk, dll) , berkenaan dengan review, berkenaan dengan pajak, berkenaan dengan stok,

berkenaan dengan retur, dan setting affiliasi. Juga setting search engine opimisation (SEO) dan setting email
server.

Gambar 4.70 Tampilan halaman setting system

10. Halaman utama pengunjung umum

Gambar 4.71 Tampilan halaman utama website


11. Halaman login user

Gambar 4.72 Tampilan halaman login user

12. Halaman kategori produk

Gambar 4.73 Tampilan halaman kategori produk (wanita)


13. Halaman FAQ

Gambar 4.74 Tampilan halaman FAQ


14. Halaman Registrasi

Gambar 4.75 Tampilan halaman Registrasi


4.6 Implementasi Sistem
4.6.1 Spesifikasi Sistem
Setelah desain tampilan sistem selesai, maka tahap selanjutnya adalah mengimplementasikan hasil
rancangan yang ada di desain tampilan ke dalam tahap implementasi. Sarana pendukung yang digunakan agar
sistem dapat berjalan yaitu sebagai berikut:
4.6.1 Hardware dan Software
1. Software, meliputi pemeliharaan aplikasi perangkat lunak yang digunakan dalam pembuatan sistem.
Spesifikasi untuk perangkat lunak adalah sebagai berikut:

a. Sistem operasi Windows7


b. Web browser seperti IE, Mozilla, Netscape
2. Hardware, meliputi pemilihan perangkat keras yang digunakan sebagai alat pendukung pembuatan aplikasi.
Spesifikasi komputer client dan perangkat jaringan diantaranya sebagai berikut:
a. Processor minimal Core i3
b. RAM minimal 512 Mb
c. Monitor yang mendukung resolusi sampai dengan 800x600
4.6.2 Analisa Biaya
Analisa biaya diperlukan dalam tahap implementasi sistem. Berikut analisa biaya perangkat keras
(hardware) akan dijelaskan pada tabel 4.21
Tabel 4.21 Tabel Biaya Perangkat Keras (Hardware)

No

Spesifikasi

Harga

1.

Processor Intel Core i3

1.117.000,-

2.

Motherboard

860.000,-

Monitor 16

750.000,-

Hard Disk 250 GB SATA

546.000,-

VGA 256 MB DDR2

503.000,-

RAM DDR2 2GB

408.000,-

Keyboard

105.000,-

Mouse Optik

20.000,-

Total

4.309.000,Sumber : www.hargakomputer.net

4.6.3. Biaya Perangkat Lunak (Software)


Biaya perangkat lunak akan dijelaskan pada tabel 4.22.
Tabel 4.22 Tabel Biaya Perangkat Lunak (Software)
Spesifikasi

Harga

Windows 7

Rp.

Paket Pembuatan Apikasi Web


(Sistem+Hosting 200 MB+ Domain)
Total

600.000

Rp. 2.000.000

Rp. 2.600.000

Sumber : www.hargakomputer.net
4.6.4. Domain dan hosting
Agar Website dapat diakses secara online maka Website yang sudah selesai dibuat harus diupload ke
internetmaka dibutuhkan sebuah nama domain untuk dapat mengakses dan Websitehosting untuk menyimpan

data dan file dari sistem.Hosting yang digunakan pada penulisan skripsi ini merupakan hosting yang tidak
berbayar yaitu www.000webhost.com dengan nama domain butikakiko.com.
Spesifikasi hosting yang digunakan yaitu:
1. Disk space2GB
2. Bandwith 100 GB
3. Support PHP dan MySQL
4. Operating system Linux atau windows
4.6.5. Upload Web ke Hosting
a. Mendaftarkan Domain dan Hosting Di Penyedia Web Space
Sebelum mempublikasikan website ke server, terlebih dahulu harus mendaftarkan domain dan hosting
ke jasa penyedia web space. Kemudian melakukan registrasi dengan cara mengisi form registrasi yang
disediakan oleh penyedia web hosting tersebut dan membayar sesuai dengan harga yang ditetapkan.
Pada penulisan skripsi ini penulis menggunakan web hosting dari idwebhost.com. Adapun langkah-langkah
dalam pendaftaran domain dan hosting adalah sebagai berikut :
1) Buka alamat web idwebhost.com .

Gambar 4.76 Halaman utama www.idwebhost.com


2) Kita dapat mencoba nama domain dengan mengetik nama domain ditampilan awal. Bila nama domain
masih tersedia maka kita dapat membelinya.

Gambar 4.77 Mencoba ketersediaan nama domain


3) Kemudian, klik tombol Beli domain dan hosting
4) Kita akan diberikan form pemesanan. Isi data form pemesanan sampai kebagian akhir.

Gambar 4.78 Form pemesanan domain dan hosting idwebhost.com


Setelah biaya domain dan hosting kita bayar, domain dan hosting akan diaktifkan dan kita mendapatkan
halaman pengelolaan atau halaman control panel (Cpanel) dari idwebhost.com.
b. Membuat dan import basisdata
Untuk menyiapkan basisdata dan upload file website kita harus mengakses halaman control panel melalui
alamat http://butikakiko.com/cpanel. Tampilan halaman control panel ditunjukkan pada Gambar 4.79 Control panel
pengelolaan hosting.

Gambar 4.79 Control panel pengelolaan hosting


Urutan langkah menyiapkan basisdata adalah sebagai berikut :
1. Buat basisdata melalui menu MySQL Database.

Gambar 4.79 Membuat basisdata di server


2. Membuat user basisdata
3. Memberikan hak akses user pada basisdata butikakiko

Gambar 4.80 Memberikan hak akses user ke basisdata


4. Kembali ke control panel, dan pilih menu phpmyadmin untuk membuka halaman pengelolaan basisdata.
Melalui phpmyadmin, basisdata dapat dikelola secara visual.
Import basisdata butikakiko yang berada d komputer kita.

Gambar 4.81 Phpmyadmin untuk import basisdata butikakiko


5. Basisdata telah siap digunakan. Basisdata dapat diakses menggunakan setting/konfigurasi nama server :
localhost, username : user basisdata yang telah dibuat, password : password basisdata yang telah dibuat.
c. Mengupload file website butik akiko
Mengupload file dapat dilakukan menggunakan control panel atau menggunakan sofware FTP client (file
transfer protocol). Untuk proses yang lebih cepat dapat dilakukan dengan menggunakan control panel melalui
fasilitas file manager. Kita dapat mengupload file berbentuk .zip (file yang dimampatkan), kemudian
mengekstraknya apabila file telah berada di server.

Berikut ini adalah tampilan halaman file manager yang diberikan oleh Gambar 4.82 File manager untuk mengelola
file website di server, tampilan mengupload file zip diberikan pada Gambar 4.83 Proses mengupload file
butikakiko.zip, dan tampilan hasil ekstrak file website diberikan oleh Gambar 4.84 Hasil upload dan ekstrak file
website.

Gambar 4.82 File manager untuk mengelola file website di server

Gambar 4.83 Proses mengupload file butikakiko.zip

Gambar 4.84 Hasil upload dan ekstrak file website.


4.7 Konversi Sistem
Konversi adalah sebuah proses pengubahan dari sistem lama ke sistem baru. Konversi sistem merupakan
proses untuk menerapkan atau mengimplementasi secara tepat dan benar.
Konversi yang diterapkan pada Butik Akiko adalah Konversi Paralel. Dalam metode ini dilakukan dengan
mengoperasikan sistem yang baru bersama-sama dengan sistem yang lama selama satu periode tertentu. Kedua

sistem ini dioperasikan bersama untuk menyajikan bahwa sistem yang baru telah berjalan dengan sukses sebelum
meninggalkan sistem yang lama.
Pada periode ini memiliki keuntungan karena dalam periode ini menyediakan suatu proteksi yang tinggi
kepada pihak manajemen terhadap kegagalan dari sistem baru. Pada saat beroperasi bersamaan maka sistem lama
digunakan untuk membandingkan atau menilai sistem baru telah beroperasi dengan baik atau belum. Sistem lama
benar-benar akan dihentikan penggunanya setelah yakin bahwa sistem baru berjalan sesuai yang diharapkan.