See discussions, stats, and author profiles for this publication at: https://www.researchgate.

net/publication/330552757

PEMBUATAN SISTEM INFORMASI E-COMMERCE BERBASIS WEB PADA UMKM

BINAAN ASPAMI (Studi Kasus UMKM Andir Cimahi )

Article · January 2019

CITATIONS READS

0 9,388

1 author:

Reza Abdurrofi
Telkom University
2 PUBLICATIONS   1 CITATION   

SEE PROFILE

Some of the authors of this publication are also working on these related projects:

Perancangan dan Implementasi SI E-Commerce View project

Manajemen Persediaan View project

All content following this page was uploaded by Reza Abdurrofi on 23 January 2019.

The user has requested enhancement of the downloaded file.

PEMBUATAN SISTEM INFORMASI E-COMMERCE BERBASIS WEB
PADA UMKM BINAAN ASPAMI
(Studi Kasus UMKM Andir Cimahi )

KERJA PRAKTEK

Diajukan sebagai Laporan Pelaksanaan Kerja Praktek

Program Studi Sistem Informasi

Oleh :
Reza Abdurrofi
1115123007

PROGRAM STUDI SISTEM INFORMASI

FAKULTAS TEKNIK
UNIVERSITAS WIDYATAMA
BANDUNG
2017
 LEMBAR PENGESAHAN

PEMBUATAN SISTEM INFORMASI E-COMMERCE BERBASIS WEB PADA

UMKM BINAAN ASPAMI
(Studi Kasus UMKM Andir Cimahi )

Oleh:
Reza Abdurrofi
1115123007

Telah disetujui dan disahkan di Bandung, Tanggal 7 Februari 2017

Menyetujui,
Pembimbing Kampus, Pembimbing Lapangan,

Murnawan, S.T., M.T. Yani Hadiyanti

0409017201

Mengetahui,
Ka. Prodi. Sistem Informasi

M. Rozahi Istambul, S.Kom., M.T.

0414106701

Catatan :
*) Tanggal pengesahan diisi oleh Pembimbing Kampus.

i
 SURAT PERNYATAAN

Saya yang bertanda tangan dibawah ini :

Nama : Reza Abdurrofi

NPM : 1115123007

Tempat dan Tanggal Lahir : Bandung, 1 Juli 1993

Alamat : Jl. Telekomunikasi (Kawasan Pendidikan Telkom)

Menyatakan bahwa telah melaksanakan kerja praktek di perusahaan UMKM Andir Cimahi Binaan
ASPAMI. Bila terbukti tidak demikian, saya bersedia menerima segala akibatnya.

Bandung, 7 Februari 2017

Reza Abdurrofi

Catatan : Form ini diisi oleh mahasiswa

ii
 ABSTRAK

UMKM Andir merupakan usaha yang bergerak di bidang penjualan handycraft dan fashion,
Dalam kegiatan operasionalnya, UMKM ini memiliki beberapa kendala yaitu diantaranya, UMKM
Andir belum mempunyai media alternatif yang bisa menyebarluaskan informasi mengenai produk-
produk hasil dari UMKM Andir. Selama ini proses pemasaran dan penjualan yang berjalan masih
belum mencapai target yang diinginkan. Sehingga untuk mencapai target yang diinginkan dalam
pemasaran , agar informasi yang diberikan menjadi lebih cepat diterima pula oleh konsumen. Maka
dibuatlah sebuah website e-commerce. Website dapat dijadikan sebagai media usaha bisnis yang
bersifat efektif dan efisien, sehingga memudahkan pengguna untuk mendapatkan informasi.
Dengan ini kiranya pemasaran produk yang dibuatkan dapat membantu, dan memudahkan serta
meraih kemajuan dalam hal proses usaha UKM Andir. Perancangan sistem informasi yang
digunakan pada website e-commerce ini yaitu use case diagram, sequence diagram, dan diagram
activity. Implementasi website ini menggunakan hosting CMS Wordpress di OpenShift. Dengan
website e-commerce ini pemilik dapat melakukan transaksi jual beli secara online, dapat meng-
edit halaman website sesuai keinginan.

Kata kunci : UMKM, Website, E-Commerce, Wordpress, OpenShift

iii
 KATA PENGANTAR

Puji syukur kehadiran Allah SWT yang telah memberikan nikmat dan karunia-Nya. Tuhan
pembimbing sejati yang terus menunjukkan jalan-Nya dan memudahkan penulis ini hingga bisa
terselesaikan. Adapun laporan kerja praktek ini berjudul “PEMBUATAN SISTEM INFORMASI
E-COMMERCE BERBASIS WEB PADA UMKM BINAAN ASPAMI” adalah untuk
melengkapi sebagian syarat mencapai gelar sarjana pada bidang Sistem Informasi Fakultas
Teknik Universitas Widyatama.

Dengan segala kerendahan hati, dengan ini penulis ingin mengucapkan terima kasih yang sebesar-
besarnya kepada:

1. Pak Murnawan, selaku pembimbing yang telah memberikan dorongan kepada penulis untuk
terus berjuang menyelesaikan penulisan laporan kerja praktek ini dan terima kasih atas
bimbingannya selama ini yang telah memberikan masukannya.
2. Kepada seluruh staff UMKM Andir Cimahi yang telah meluangkan waktu dan kesempatan
untuk penulis dapat melakukan wawancara serta observasi dalam memperoleh data yang
dibutuhkan oleh penulis.
Penulis menyadari bahwa laporan ini jauh dari kesempurnaan. Oleh karena itu, penulis senantiasa
mengharapkan masukan baik kritik maupun saran dari berbagai pihak. Semoga laporan kerja
praktek ini dapat berguna dan memberi tambahan ilmu dan informasi bagi seluruh pihak.

Bandung, Februari 2017

Penulis

iv
 DAFTAR ISI

Program Studi Sistem Informasi ............................................................................................................... 1

LEMBAR PENGESAHAN ........................................................................................................................... i
SURAT PERNYATAAN ............................................................................................................................. ii
ABSTRAK ................................................................................................................................................... iii
KATA PENGANTAR ................................................................................................................................. iv
DAFTAR ISI................................................................................................................................................. v
DAFTAR TABEL....................................................................................................................................... vii
DAFTAR GAMBAR ................................................................................................................................. viii
DAFTAR LAMPIRAN ................................................................................................................................. x
BAB I ............................................................................................................................................................ 1
PENDAHULUAN ........................................................................................................................................ 1
1.1 Latar Belakang Masalah................................................................................................................ 1
1.2 Rumusan Masalah ......................................................................................................................... 1
1.3 Tujuan dan Manfaat ...................................................................................................................... 2
1.4 Ruang Lingkup.............................................................................................................................. 2
1.5 Metodologi Penelitian ................................................................................................................... 2
1.6 Waktu dan Tempat ........................................................................................................................ 3
1.7 Sistematika Penulisan ................................................................................................................... 3
BAB II........................................................................................................................................................... 4
LANDASAN TEORI .................................................................................................................................... 4
2.1 Usaha Mikro Kecil dan Menengah ............................................................................................... 4
2.2 Pemasaran ..................................................................................................................................... 5
2.3 Internet .......................................................................................................................................... 5
2.4 Aplikasi Berbasis Web .................................................................................................................. 6
2.5 Wordpress ..................................................................................................................................... 6
2.6 E-Commerce ................................................................................................................................. 8
2.7 Konsep Pemrograman Berorientasi Objek .................................................................................... 9
2.8 Teori Analisis dan Alat Bantu Implementasi Sistem .................................................................. 10
2.9 Unified Modeling Language (UML)........................................................................................... 12

v
BAB III ....................................................................................................................................................... 16
ANALISIS SISTEM ................................................................................................................................... 16
3.1 Gambaran Sistem Saat Ini ........................................................................................................... 16
3.2 Hasil Analisis .............................................................................................................................. 20
BAB IV ....................................................................................................................................................... 21
PERANCANGAN DAN IMPLEMENTASI SISTEM ............................................................................... 21
4.1 Perancangan Sistem .................................................................................................................... 21
4.2 Implementasi Sistem ................................................................................................................... 42
BAB V ........................................................................................................................................................ 51
PENUTUP .................................................................................................................................................. 51
5.1 Kesimpulan ................................................................................................................................. 51
5.2 Saran ........................................................................................................................................... 51
DAFTAR PUSTAKA ................................................................................................................................. 52
LAMPIRAN................................................................................................................................................ 53

vi
 DAFTAR TABEL

Tabel 1. 1 Jadwal Pengerjaan ........................................................................................................................ 3

Tabel 1. 2 Tabel Simbol-simbol Standar Flowchart..................................................................................... 10
Tabel 1. 3 Tabel Simbol-simbol Use Case.................................................................................................... 13
Tabel 1. 4 Tabel Simbol-simbol Activity Diagram........................................................................................ 14
Tabel 1. 5 Tabel Simbol-simbol Sequence Diagram .................................................................................... 15

Tabel 3. 1 Analisis Pengguna ....................................................................................................................... 20

vii
 DAFTAR GAMBAR

Gambar 3. 1 Proses Bisnis Penjualan (Sistem Berjalan) .............................................................................. 16

Gambar 3. 2 Proses Bisnis Penjualan (Sistem Usulan) ................................................................................ 17
Gambar 3. 3 Proses Bisnis Menu Utama (Sistem Usulan).......................................................................... 18
Gambar 3. 4 Proses Bisnis Administrator (Sistem Usulan) ......................................................................... 19

Gambar 4. 1 Use Case ................................................................................................................................. 21

Gambar 4. 2 Sequence Diagram Login ........................................................................................................ 23
Gambar 4. 3 Sequence Diagram Tambah Produk ....................................................................................... 24
Gambar 4. 4 Sequence Diagram Ubah Produk ........................................................................................... 25
Gambar 4. 5 Sequence Diagram Hapus Produk .......................................................................................... 26
Gambar 4. 6 Sequence Diagram Tambah Laman ........................................................................................ 27
Gambar 4. 7 Sequence Diagram Ubah Laman ............................................................................................ 28
Gambar 4. 8 Sequence Diagram Hapus Laman........................................................................................... 29
Gambar 4. 9 Sequence Diagram Tambah Pembelian ................................................................................. 30
Gambar 4. 10 Sequence Diagram Ubah Tema ............................................................................................ 31
Gambar 4. 11 Diagram Activity Login ......................................................................................................... 32
Gambar 4. 12 Diagram Activity Tambah Produk......................................................................................... 33
Gambar 4. 13 Diagram Activity Ubah Produk ............................................................................................. 34
Gambar 4. 14 Diagram Activity Hapus Produk............................................................................................ 35
Gambar 4. 15 Diagram Activity Tambah Laman ......................................................................................... 36
Gambar 4. 16 Diagram Activity Ubah Laman .............................................................................................. 37
Gambar 4. 17 Diagram Activity Hapus Laman ............................................................................................ 38
Gambar 4. 18 Diagram Activity Tambah Pembelian ................................................................................... 39
Gambar 4. 19 Diagram Activity Hapus Pembelian ...................................................................................... 40
Gambar 4. 20 Diagram Activity Pengaturan Tema ..................................................................................... 41
Gambar 4. 21 Implementasi Antarmuka Login ........................................................................................... 42
Gambar 4. 22 Implementasi Antarmuka Pengaturan Laman ..................................................................... 43
Gambar 4. 23 Implementasi Antarmuka Dashboard Pengaturan Plugin.................................................... 43
Gambar 4. 24 Implementasi Antarmuka Penambahan Laman Website .................................................... 44
Gambar 4. 25 Implementasi Antarmuka Pengaturan Header Website ...................................................... 44
Gambar 4. 26 Implementasi Antarmuka Pengaturan Store pada Website ................................................ 45
Gambar 4. 27 Implementasi Antarmuka Produk ........................................................................................ 45
Gambar 4. 28 Implementasi Antarmuka Penambahan Produk .................................................................. 46
Gambar 4. 29 Implementasi Antarmuka Home .......................................................................................... 46
Gambar 4. 30 Implementasi Antarmuka Contact us................................................................................... 47
Gambar 4. 31 Implementasi Antarmuka Shop............................................................................................ 48
Gambar 4. 32 Implementasi Antarmuka Checkout .................................................................................... 48
Gambar 4. 33 Implementasi Antarmuka Billing dan Shipping .................................................................... 49

viii
Gambar 4. 34 Implementasi Antarmuka Pembayaran Transaksi Pembelian ............................................. 49
Gambar 4. 35 Implementasi Antarmuka About Us ..................................................................................... 50
Gambar 4. 36 Implementasi Antarmuka Footer Website ........................................................................... 50

ix
 DAFTAR LAMPIRAN

Gambar 1 Logo Asosiasi Kelompok UPPKS ................................................................................................. 53

Gambar 2 Tempat UPPKS Andir Cimahi ...................................................................................................... 53
Gambar 3 Salah Satu Produk UPPKS Andir Cimahi ..................................................................................... 54
Gambar 4 Ibu Yani Ketua UPPKS Andir Cimahi ........................................................................................... 54

x
 BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

UMKM Andir merupakan usaha yang bergerak di bidang penjualan handycraft dan fashion,
terletak di Jalan Dungus Cariang No. 51 Kabupaten Cimahi. Dalam kegiatan operasionalnya,
UMKM ini memiliki beberapa kendala yaitu diantaranya, UMKM Andir belum mempunyai media
alternatif yang bisa menyebarluaskan informasi mengenai produk-produk hasil dari UMKM
Andir. Selama ini proses pemasaran dan penjualan yang berjalan masih belum mencapai target
yang diinginkan.
Sehingga untuk mencapai target yang diinginkan dalam pemasaran , agar informasi yang diberikan
menjadi lebih cepat diterima pula oleh konsumen. Maka muncul inisiatif dari Universitas
Widyatama khususnya Prodi Sistem Informasi untuk menjalin kerjasama dengan pihak Kadin Kota
Bandung untuk membantu UKM-UKM di Bandung yang belum menggunakan jasa layanan
website.
Website merupakan salah satu media informasi berbasis teknologi yang menyediakan berbagai
macam informasi. Website dapat dijadikan sebagai media usaha bisnis yang bersifat efektif dan
efisien, sehingga memudahkan pengguna untuk mendapatkan informasi. Dengan ini kiranya
pemasaran produk yang dibuatkan dapat membantu, dan memudahkan serta meraih kemajuan
dalam hal proses usaha UKM Andir.

1.2 Rumusan Masalah

Berdasarkan identifikasi masalah diatas, maka dapat dirumuskan permasalahan sebagai berikut :
a Bagaimana membangun website e-commerce mengenai Profil UKM , dan produk yang
dijual agar UKM tersebut dapat berkembang ?
b Bagaimana menyajikan informasi sesuai dengan kebutuhan yang diinginkan konsumen ?

1
1.3 Tujuan dan Manfaat
Adapun tujuan dan manfaat yang ingin dicapai dari hasil penelitian ini adalah sebagai berikut:
a Tujuan
Berdasarkan rumusan masalah diatas maka terdapat tujuan penelitian diantaranya:
1) Membangun website e-commerce mengenai Profil UKM , dan produk yang dijual agar
UKM tersebut dapat berkembang.
2) Menyajikan informasi berbasis website bagi UKM Andir agar kebutuhan yang
diinginkan konsumen terpenuhi.

b Manfaat
Berikut adalah manfaat dari penelitian secara praktis yang dapat dirasakan bagi :
1) Bagi pihak UMKM Andir membantu dalam hal penyampaian informasi dan penjualan
produk yang ada menjadi lebih efisien, dan mudah diterima konsumen.
2) Bagi pengakses website, akan lebih mudah dalam pencarian informasi.
3) Bagi mahasiswa yang sedang melakukan penelitian yang sama dapat menjadi acuan atau
referensi dalam menyusun sebuah laporan penelitian.

1.4 Ruang Lingkup

Dari observasi yang telah dilakukan pada UKM Andir ini memiliki cakupan sebagai berikut :
a Website e-commerce yang dapat menampilkan produk handycraft dan fashion melalui foto.
b Proses pembaharuan data dan informasi hanya dapat dilakukan oleh admin.
c Pembuatan website menggunakan domain gratis hanya memasarkan dan menjual produk
saja.

1.5 Metodologi Penelitian

Metodologi yang digunakan dalam penulisan penelitian ini adalah sebagai berikut:
a Observasi
Metode observasi adalah metode pengumpulan data dengan melakukan pengamatan langsung
terhadap objek yang diteliti dengan UMKM terkait untuk mengumpulkan data dan informasi
yang berkaitan dengan permasalahan yang ada. Informasi yang berkaitan adalah proses
jalannya sistem penjualan di instansi tersebut.
b Wawancara
Metode pengumpulan data dengan melakukan tanya jawab kepada manajemen dalam objek
penelitian. Data diperoleh dari berbagai sumber data baik secara langsung. Sumber data
langsung yang dimaksud adalah sumber data yang diperoleh secara langsung di lokasi
penelitian seperti data-data produk, harga produksi, jenis produk dan sebagainya.
c Studi literatur

2
 Metode pengumpulan data dengan mempelajari sumber-sumber buku serta informasi dari
internet yang berkaitan dirangkum sebagai acuan penulisan.Waktu dan Tempat Pelaksanaan.

1.6 Waktu dan Tempat

Waktu dan tempat pelaksaan dilakukan di Jalan Dungus Cariang no. 51 Kabupaten Cimahi. Survey
Awal pada tanggal 4 Juni 2016 dilakukan oleh penulis untuk melakukan pengumpulan data sampai
penyusunan laporan pengabdian masyarakat dari 1 Agustus 2016 sampai 31 Agustus 2016.

Tabel 1. 1 Jadwal Pengerjaan

1.7 Sistematika Penulisan

Sistematika penulisan terdiri dari beberapa bab dan masing masing bab dibagi menurut subbab.
Adapun sistematika dari penulisan laporan penelitian ini adalah sebagai berikut :
a Bab satu pendahuluan, membahas mengenai permasalahan yang dibahas yang meliputi
latar belakang, perumusan masalah, tujuan, ruang lingkup pembangunan sistem pemasaran,
sistematika kerja, dan sistematika pembahasan.
b Bab dua landasan teori, memuat teori yang diperlukan oleh penulis untuk pembahasan
laporan penelitian, diantaranya konsep tools dan membahas secara singkat tentang
pembangunan sistem.
c Bab tiga analisis sistem, membahas mengenai analisis sistem yang ada, identifikasi
masalah, analisis sistem serta hasil dari analisis tersebut mengenai pemanfaatan sistem
website yang dibuat dalam mendukung bisnis pemasaran bagi UKM Andir dan
menganalisa kebutuhan yang diperlukan dalam membangun website tersebut.
d Bab empat perancangan dan implementasi sistem, membahas tentang pengembangan
analisis, pendefinisian dan memecahkan masalah untuk kebutuhan-kebutuhan aplikasi, dan
pada bagian perancangan.
e Bab lima penutup, membahas tentang kesimpulan keseluruhan dari sistem yang telah
dibuat dan saran-saran yang diperoleh dari hasil laporan.

3
 BAB II

LANDASAN TEORI

2.1 Usaha Mikro Kecil dan Menengah

Usaha mikro merupakan kegiatan usaha yang dapat memperluas lapangan pekerjaan serta
memberikan pelayanan ekonomi secara luas kepada masyarakat dan dapat berperan dalam proses
pemerataan dan peningkatan pendapatan masyarakat, mendorong pertumbuhan ekonomi, serta
berperan mewujudkan stabilitas nasional. Selain itu, usaha mikro adalah salah satu pilar utama
ekonomi nasional yang medapatkan kesempatan utama, dukungan, perlindungan serta
pengembangan yang secara luas sebagai wujud pihak yang tegas kepada kelompok usaha ekonomi
rakyat, tanpa harus mengabaikan peranan usaha besar dan badan usaha milik pemerintah. Usaha
Mikro Berdasarkan Undang Undang Nomor 20 Tahun 2008 tentang UMKM (Usaha Menengah
Kecil dan Mikro) adalah usaha produktif milik orang perorangan dan / atau badan usaha
perorangan yang memenuhi kriteria Usaha Mikro sebagaimana diatur dalam Undang-Undang ini
[1].
a Kriteria Usaha Mikro
Kriteria Usaha Mikro menurut Undang-Undang Nomor 20 Tahun 2008 Pasal 6, Usaha Mikro
adalah usaha produktif milik orang perorangan dan atau badan usaha perorangan yang
memiliki kriteria sebagai berikut [1]:
1) Memiliki kekayaan bersih paling banyak Rp 50 juta tidak temasuk tanah dan bangunan
tempat usaha; atau
2) Memiliki hasil penjualan tahunan paling banyak Rp 300 juta.

b Ciri-Ciri Usaha Mikro

Ciri-Ciri Usaha Mikro, yaitu [1]:

1) Jenis barang usahanya tidak tetap,dapat berganti pada periode tertentu;

2) Tempat usahanya tidak selalu menetap, dapat berubah sewaktu-waktu;
3) Belum melaksanakan administrasi keuangan yang sederhana dan tidak memisahkan antara
keuangan keluarga dengan keuangan usaha; Sumber daya manusia (pengusaha) belum
memiliki jiwa enterpreuner yang memadai;
4) Tingkat pendidikan rata-rata relatif rendah;

4
 5) Pada umumnya belum akses ke perbankan, namun sebagian dari mereka sudah akses ke
lembaga keuangan non bank;
6) Umumnya tidak mempunyai izin usaha atau prasyaratan legalitas lainnya termasuk Nomor
Pokok Wajib Pajak (NPWP).

2.2 Pemasaran

Pemasaran dapat didefinisikan sebagai proses penyusunan komunikasi terpadu yang bertujuan
untuk memberikan informasi mengenai barang atau jasa dalam kaitannya dengan memuaskan
kebutuhan dan keinginan calon pelanggan [2].

Berdasarkan definisi di atas, pemasaran dimulai dari menemukan apa yang diinginkan oleh
konsumen. Pada akhirnya pemasaran memiliki tujuan sebagai berikut:

a Konsumen potensial mengetahui secara detail produl uamg kita hasilkan dan perusahaan
dapat menyediakan semua permintaan mereka atas produk yang dihasilkan.
b Perusahaan dapat menjelaskan secara detail semua yang berhubungan dengan pemasaran.
Kegiatan pemasaran ini meliputi berbagai kegiatan, mulai dari penjelasan mengenai
produk, desain produk, promosi produk, pengiklanan produk, komunikasi kepada
konsumen, sampai pengiriman produk agar sampai ke tangan konsumen secara cepat.
c Mengenal dan memahami konsumen sedemikian rupa sehingga produk cocok dengannya
dan terjual dengan sendirinya.

2.3 Internet

Internet adalah jaringan dari ribuan jaringan dan jutaan komputer (disebut host) yang
menghubungkan bisnis, intuisi pendidikan, organisasi pendidikan. Internet menyediakan sekitar
50-600 juta orang di dunia dengan pelayanan seperti email, newsgroup, belanja, riset, instant
messaging, musik, video, dan berita. Tidak ada satu organisasi yang mengontrol internet atau
bagaimana internet berfungsi. Inter juga tak dimiliki oleh seorangpun. Kata internet sendiri
sebenernya berasal dari kata inter network atau koneksi antara dua atau lebih jaringan computer
[2].

5
2.4 Aplikasi Berbasis Web

Aplikasi adalah program siap pakai atau program yang direka untuk melaksanakan suatu fungsi
bagi pengguna atau aplikasi yang lain. Aplikasi juga diartikan sebagai penggunaan atau penerapan
suatu konsep yang menjadi pokok pembahasan atau sebagai program komputer yang dibuat untuk
menolong manusia dalam melaksanakan tugas tertentu. Aplikasi software yang dirancang untuk
penggunaan praktisi khusus, klasifikasi luas ini dapat dibagi menjadi 2 (dua) yaitu [3]:

a Aplikasi software spesialis, program dengan dokumentasi tergabung yang dirancang untuk
menjalankan tugas tertentu.
b Aplikasi paket, suatu program dengan dokumentasi tergabung yang dirancang untuk jenis
masalah tertentu.

Website adalah kumpulan dari halaman-halaman situs, yang biasanya terangkum dalam sebuah
domain. Menurut web adalah sebuah sistem dengan informasi yang disajikan dalam bentuk teks,
gambar, suara, dan lain-lain yang tersimpan dalam sebuah server Web Internet yang disajikan
dalam bentuk hypertext. Aplikasi berbasis web adalah aplikasi yang diakses menggunakan web
browser melalui internet/intranet [3].

2.5 Wordpress

WordPress adalah sebuah aplikasi sumber terbuka (open source) yang sangat populer digunakan
sebagai mesin blog (blog engine). WordPress dibangun dengan bahasa pemograman PHP dan basis
data (database) MySQL. PHP dan MySQL, keduanya merupakan perangkat lunak sumber terbuka
(open source software). Selain sebagai blog, WordPress juga mulai digunakan sebagai sebuah
CMS Content Management System) karena kemampuannya untuk dimodifikasi dan disesuaikan
dengan kebutuhan penggunanya. Keunggulan dan Fitur Wordpress, yaitu [2]:

a WordPress memiliki banyak keunggulan dan fitur, antara lain:

b Berbasis kode sumber terbuka (open source). Pengguna dapat melihat dan memperoleh
barisan kode-kode penyusun perangkat lunak WordPress tersebut secara bebas, sehingga

6
 pengguna tingkat lanjut yang memiliki kemampuan pemrograman dapat bebas melakukan
modifikasi, bahkan dapat mengembangkan sendiri program WordPress tersebut lebih lanjut
sesuai keinginan.
c Template atau desain tampilannya mudah dimodifikasi sesuai keinginan pengguna.
Sehingga apabila pengguna memiliki pengetahuan HTML yang memadai, maka pengguna
tersebut dapat berkreasi membuat template sendiri. Pengguna yang tidak mengerti HTML,
tentu saja masih dapat memilih ribuan template yang tersedia di internet secara bebas, yang
tentu saja gratis.
d Pengoperasiannya mudah.
e Satu blog WordPress, dapat digunakan untuk banyak pengguna (multi User). Sehingga
WordPress juga sering digunakan untuk blog komunitas. Anggota komunitas tersebut dapat
berperan sebagai kontributor.
f Jika pengguna sebelumnya telah mempunyai blog tidak berbayar, misalnya di alamat
Blogger, LiveJournal, atau TypePad, pengguna dapat mengimpor isi blog-blog tersebut ke
alamat hosting blog pribadi yang menggunakan perangkat lunak WordPress. Dengan
demikian pengguna tidak perlu khawatir isi blog yang lama akan menjadi sia-sia setelah
menggunakan perangkat lunak WordPress.
g Selain pengguna yang banyak, banyak pula dukungan komunitas (community support)
untuk WordPress.
h Tersedia banyak plugin yang selalu berkembang. Plugin WordPress sendiri yaitu sebuah
program tambahan yang bisa diintegrasikan dengan WordPress untuk memberikan fungsi-
fungsi lain yang belum tersedia pada instalasi standar. Misalnya plugin anti-spam, plugin
web counter, album foto.
i Kemampuan untuk dapat memunculkan XML, XHTML, dan CSS standar.
j Tersedianya struktur permalink yang memungkinkan mesin pencari mengenali struktur
blog dengan baik.
k Kemungkinan untuk meningkatkan performa blog dengan ekstensi.
l Mampu mendukung banyak kategori untuk satu artikel. Satu artikel dalam WordPress
dapat dikatogorisasikan ke dalam beberapa kategori. Dengan multikategori, pencarian dan
pengaksesan informasi menjadi lebih mudah.

7
 m Fasilitas Trackback dan Pingback. Juga memiliki kemampuan untuk melakukan otomatis
Ping (RPC Ping) ke berbagai search engine dan web directory, sehingga website yang
dibuat dengan WordPress akan lebih cepat ter index pada search engine.
n Fasilitas format teks dan gaya teks. WordPress menyediakan fitur pengelolaan teks yang
cukup lengkap. Fitur – fitur format dan gaya teks pada kebanyakan perangkat lunak
pengolah kata seperti cetak tebal, cetak miring, rata kanan, rata kiri, tautan tersedia di
WordPress.
o Halaman statis (Halaman khusus yang terpisah dari kumpulan tulisan pada blog).
p Mendukung LaTeX.
q Mempunyai kemampuan optimalisasi yang baik pada Mesin Pencari (Search Engine
Optimizer).

2.6 E-Commerce

E-commerce adalah dimana dalam satu website menyediakan atau dapatmelakukan Transaksi
secara online atau juga bisa merupakan suatu cara berbelanja atau berdagang secara online atau
direct selling yang memanfaatkan fasilitas Internet dimana terdapat website yang dapat
menyediakan layanan “get and deliver“. E-commerce akan merubah semua kegiatan marketing
dan juga sekaligus memangkas biaya-biaya operasional untuk kegiatan trading (perdagangan) [2].

a Jenis-Jenis E-Commerce

Kegiatan E-Commerce mencakup banyak hal, untuk membedakannya E-Commerce

dibedakan menjadi 2 berdasarkan karakteristiknya [2]:

1) Business to Business, karakteristiknya:

a) Trading partners yang sudah saling mengetahui dan antara mereka sudah terjalin
hubungan yang berlangsung cukup lama.
b) Pertukaran data dilakukan secara berulang-ulang dan berkala dengan format data yang
telah disepakati bersama.
c) Salah satu pelaku tidak harus menunggu rekan mereka lainnya untuk mengirimkan data.
d) Model yang umum digunakan adalah peer to peer, di mana processing intelligence dapat
didistribusikan di kedua pelaku bisnis.

8
 2) Business to Consumer, karakteristiknya:
a) Terbuka untuk umum, di mana informasi disebarkan secra umum pula.
b) Servis yang digunakan juga bersifat umum, sehingga dapat digunakan oleh orang
banyak.
c) Servis yang digunakan berdasarkan permintaan.

b Tujuan E-Commerce

Tujuan suatu perusahaan menggunakan sistim E-Commerce adalah dengan menggunakan E-

Commerce maka perusahaan dapat lebih efisien dan efektif dalam meningkatkan
keuntungannya.

2.7 Konsep Pemrograman Berorientasi Objek

Dalam konsep berorientasi objek, abstraksi dilakukan pada level objek. Objek adalah representasi
dunia nyata kedalam bahasa pemrograman. Objek bisa dalam bentuk benda nyata seperti manusia,
hewan, kendaraan. Di dalam pemrograman berorientasi objek, kode dan data yang saling terkait
dibungkus dalam satu entitas [4].

Ada 3 prinsip utama berorientasi objek, yaitu:

a Enkapsulasi

Enkapsulasi adalah mekanisme penggabungan kode dan data yang dimanipulasi oleh kode
tersebut. Mekanisme ini juga menjaga kode dan data tetap aman dari interferensi dan
penggunaan oleh pihak yang tidak berhak.

b Pewarisan ( inheritance )

Inheritance adalah proses pewarisan data dan method dari suatu kelas kepada kelas yang lain.
Pewarisan ini bersifat menyeluruh, sehingga semua data dan method yang dimiliki oleh kelas

9
 asalnya akan diturunkan kepada kelas yang baru. Pewarisan ini adalah konsep untuk
meningkatkan guna ulang (reuse) perangkat lunak.

2.8 Teori Analisis dan Alat Bantu Implementasi Sistem

a Flowchart

Flowchart atau bagan alir merupakan teknik analitis yang digunakan untuk menjelaskan
aspek-aspek Sistem informasi secara jelas, tepat, dan logis. Flowchart atau bagan alir
menggunakan serangkaian simbol standar untuk menguraikan prosedur pengolahan transaksi
yang digunakan oleh sebuah perusahaan, sekaligus menguraikan aliran data dalam sebuah
Sistem [5].

Ada beberapa pedoman yang harus diperhatikan dalam membuat flowchart , seperti.

1) Flowchart digambarkan dari halaman atas ke bawah dan dari kiri kekanan.
2) Aktivitas yang digambarkan harus didefinisikan secara hati-hati dan definisi ini harus dapat
dimengerti oleh pembacanya.
3) Kapan aktivitas dimulai dan berakhir harus ditentukan secara jelas.
4) Setiap langkah dari aktivitas harus diuraikan dengan menggunakan deskripsi kata kerja.
5) Setiap langkah dari aktivitas harus berada pada urutan yang benar.
6) Gunakan simbol-simbol flowchart yang standar.

Tabel 1. 2 Tabel Simbol-simbol Standar Flowchart

SIMBOL NAMA PENJELASAN

Dokumen Sebuah dokumen atau laporan,
dokumen dapat dibuat dengan
tangan atau dicetak oleh
komputer.

10
 Dokumen Digambarkan dengan menumpuk
rangkap simbol dokumen dan pencetakan
nomor dokumen di bagian
belakang dokumen.

Input/Output Digunakan untuk menggambarkan

berbagai media Input dan output
dalam sebuah bagan alir program.

Pemasukan data Entri data oleh alat online seperti

Online terminal CRT atau komputer
pribadi.

Tampilan Informasi ditampilkan oleh alat

output online seperti terminal CRT
atau memonitor komputer PC.

SIMBOL NAMA PENJELASAN

Pemrosesan Sebuah fungsi pemrosesan yang

komputer dilaksanakan oleh komputer,
biasanya menghasilkan perubahan
terhadap data atau informasi.

Kegiatan manual Sebuah kegiatan pemrosesan yang

dilaksanakan secara manual.

Penyimpanan Data disimpan sementara dalam

Online file online dalam sebuah media
direct access.

Arsip Arsip dokumen disimpan dan

diambil secara manual.

11
 Arus dokumen Arah arus dokumen atau
atau pemrosesan pemrosesan, arus normal adalah
ke kanan atau ke bawah.

Penghubung Menghubungkan bagan alir pada

dalam sebuah halaman yang sama. Simbol ini
halaman digunakan untuk menghindari
terlalu banyak anak panah yang
saling melintang dan
membingungkan.
Terminal Digunakan untuk memulai,
mengakhiri, atau titik henti dalam
sebuah proses atau program, juga
digunakan untuk menunjukkan
pihak eksternal.
Sebuah tahap pembuatan
keputusan, digunakan dalam
Keputusan bagan alir program komputer
untuk menunjukkan cabang bagi
alternatif cara.

2.9 Unified Modeling Language (UML)

Unified Modeling Language (UML) adalah himpunan struktur dan teknik untuk pemodelan dan
desain program berorientasi objek serta aplikasinya. UML adalah metodologi untuk
mengembangkan sistem OOP dan sekelompok tool untuk mendukung pengembangan sistem
tersebut. UML mulai diperkenalkan oleh Object Management Group. Sekarang UML sudah mulai
banyak digunakan oleh para praktisi OOP. UML merupakan dasar bagi tool desain berorientasi
objek dari IBM [4].

Jenis-jenis Unified Modeling Language (UML) :

a Use Case Diagram

Use case diagram digunakan untuk memodelkan proses berdasarkan perspektif pengguna
sistem. Use case diagram terdiri dari atas diagram untuk use case dan actor. Actor

12
 merepresentasikan orang yang akan mengoperasikan atau orang yang berinteraksi dengan
sistem aplikasi .

Use case mempresentasikan operas-operasi yang dilakukan oleh actor. Terkadang sebuah use
case memiliki beberapa percabangan atau alur alternatif. Percabangan ini digambarkan
menggunakan garis extends.

Tabel 1. 3 Tabel Simbol-simbol Use Case

NO GAMBAR NAMA KETERANGAN

1 Actor
2 Dependency
3 Generalization perilaku dan struktur data dari objek yang ada di atasnya
4 Include
5 Extend
6 Association
7 System
Menspesifikasikan himpuan peran yang pengguna
mainkan ketika berinteraksi dengan use case.
Hubungan dimana perubahan yang terjadi pada suatu
elemen mandiri (independent) akan mempengaruhi
elemen yang bergantung padanya elemen yang tidak
mandiri (independent).
Hubungan dimana objek anak (descendent) berbagi
objek induk (ancestor).
Menspesifikasikan bahwa use case sumber secara
eksplisit.
Menspesifikasikan bahwa use case target memperluas
perilaku dari use case sumber pada suatu titik yang
diberikan.
Apa yang menghubungkan antara objek satu dengan objek
lainnya.
Menspesifikasikan paket yang menampilkan sistem secara
terbatas.

Deskripsi dari urutan aksi-aksi yang ditampilkan sistem

8 Use Case yang menghasilkan suatu hasil yang terukur bagi suatu
aktor
Interaksi aturan-aturan dan elemen lain yang bekerja sama
9 Collaboration untuk menyediakan prilaku yang lebih besar dari jumlah
dan elemen-elemennya (sinergi).
Elemen fisik yang eksis saat aplikasi dijalankan dan
10 Note
mencerminkan suatu sumber daya komputasi

13
b Activity Diagram

Activity diagram menggambarkan berbagai alur aktivitas dalam sistem yang sedang
dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan
bagaimana mereka berakhir [4].

Diagram ini sangat mirip dengan flowchart karena memodelkan workflow dari satu aktivitas
ke aktivitas lainnya atau dari aktivitas ke status. Menguntungkan untuk membuat activity
diagram pada awal pemodelan proses untuk membantu memahami keseluruhan proses.
Activity diagram juga bermanfaat untuk menggambarkan parallel behaviour atau
menggambarkan interaksi antara beberapa use case.

Tabel 1. 4 Tabel Simbol-simbol Activity Diagram

NO GAMBAR NAMA KETERANGAN

Memperlihatkan bagaimana masing-masing

1 Actifity kelas antarmuka saling berinteraksi satu sama
lain

State dari sistem yang mencerminkan eksekusi

2 Action
dari suatu aksi

3 Initial Node Bagaimana objek dibentuk atau diawali.

Actifity Final
4 Bagaimana objek dibentuk dan dihancurkan
Node

Satu aliran yang pada tahap tertentu berubah

5 Fork Node
menjadi beberapa aliran

14
c Sequence Diagram
Diagram sekuen menggambarkan kelakuan objek pada use case dengan mendeskripsikan
waktu hidup objek dan message yang dikirimkan dan diterima antar objek. Oleh karena itu
untuk menggambar diagram sekuen maka harus diketahui objek-objek yang terlibat dalam
sebuah use case beserta metode-metode yang dimiliki kelas yang diinstansiasi menjadi
objek itu. Membuat diagram sekuen juga dibutuhkan untuk melihat scenario yang ada pada
use case [4].

Tabel 1. 5 Tabel Simbol-simbol Sequence Diagram

NO GAMBAR NAMA KETERANGAN

Objek entity, antarmuka yang saling
berinteraksi.
1 LifeLine

Spesifikasi dari komunikasi antar

objek yang memuat informasi-
2 Message
informasi tentang aktifitas yang
terjadi

15
 BAB III

ANALISIS SISTEM

3.1 Gambaran Sistem Saat Ini

a Sistem Berjalan
Analisis sistem dalam suatu perusahaan sangat penting karena fungsi dari analisis itu sendiri
yaitu untuk mengetahui bagaimana sistem itu berjalan agar sistem yang dibuat dapat
menghasilkan output yang diinginkan dan dapat mencapai tujuan yang direncanakan.
Proses bisnis sistem berjalan merupakan proses aktivitas bisnis yang terjadi atau yang telah
menjadi rutinitas sebelum sistem baru diterapkan. Gambaran sisem yang sedang berjalan pada
UKM Andir terdiri dari 1 proses bisnis , yaitu proses bisnis penjualan produk.
1) Proses Bisnis Penjualan Produk (Sistem yang sedang berjalan)
Prosedur sistem yang sedang berjalan pada proses penjualan produk adalah sebagai berikut:
a) Pemilik UKM memproduksi setiap produk yang akan dijual.
b) Produk yang sudah selesai diproduksi akan dipajang di took/tempat UKM Andir.
c) Pembeli akan membeli produk yang diinginkan, sebelumnya stok produk dicek terlebih
dahulu oleh pemilik apakah tersedia atau tidak.
d) Pembeli membayar produk yang dibeli
Proses Bisnis Penjualan (Sistem yang sedang
berjalan)

Pemilik

Mulai

Produksi
item
setiap Y
produk

Barang di
display/
Stock tersedia
dipajang
?
di toko

Stock
terjual

Konsumen
membayar

Selesai

Gambar 3. 1 Proses Bisnis Penjualan (Sistem Berjalan)

16
b Sistem Usulan
Proses Bisnis sistem usulan merupakan proses aktivitas bisnis yang diusulkan berdasarkan
sistem baru yang akan dibuat agar proses bisnis menjadi lebih baik dari sistem sebelumnya.
Sistem yang penulis usulkan untuk UKM Andir terdiri dari 3 proses bisnis, yaitu proses bisnis
pemasarran produk, proses bisnis penjualan produk dan Pencatatan transaksi penjualan.
1) Proses Bisnis Penjualan Produk (sistem usulan)
a) Pelanggan mengakses alamat website uppks-andirs.rhcloud.com
b) Pelanggan memilih produk yang diinginkan
c) Jika pembeli membeli produk, maka harus mengisi form pembelian
d) Setelah itu, sisitem akan memberitahu total pembayaran yang harus dibayarkan sesuai
total pembelian
e) Pembeli memilih tipe pembayaran
f) Setelah pembeli melakukan pembayaran, selanjutnya pembeli melakukan konfirmasi
pembayaran.

Proses bisnis Penjualan (Sistem Usulan)

Pelanggan

Mulai

Transfer
Memilih metode Bayar ke
Mengakses pembayaran ditempat Rekening
uppks- Pemilik
andir.rhcloud.com

Bukti Transfer
Tanda Terima
Memilih produk Metode
yang diingiinkan pembayaran

Beli atau tidak jadi Pemberitahuan

total pembayaran

Mengisi formulir Selesai

pembelian dan
identitas, alamat

Gambar 3. 2 Proses Bisnis Penjualan (Sistem Usulan)

17
2) Proses Bisnis Manajemen Halaman Utama Website (Sistem usulan)
a) Ketika pelanggan mengakses halaman website akan disajikan 3 menu utama, yaitu
home, contact, dan shop.
b) Didalam halaman home sendiri terdiri dari berbagai menu seperti abaout us, news,
gallery dan lain-lain.

Proses Bisnis Menu Utama (Usulan)

Pelanggan

Mulai

Tampilan
web

Pilih link
pada

Home

Contact

Shop

Selesai

Gambar 3. 3 Proses Bisnis Menu Utama (Sistem Usulan)

18
3) Proses Bisnis Manajemen Administrator (Sistem usulan)
a) Pada halaman administrator sebelum memanajemen website admin haru login terlebih
dahulu.
b) Setelah berhasil login, admin akan langsung masuk ke halaman dashboard wordpress.
c) Admin bisa langsung menambah, mengubah, dan menghapus halaman, post, media,
plugin dan lain-lain.

Proses Bisnis Administrator (Sistem Usulan)

Admin

Mulai

Login

Buka hal data

produk

Data sudah
Tampilkan
disimpan
data produk

database
Isi form

Simpan
Tambah data simpan
produk

Isi record
simpan
dibatalkan

Pilih data
Database
Simpan

Produk

Edit dari Db Simpan

Produk

Isi record
Simpan
dibatalkan

Hapus Isi Record dihapus X

Selesai

Gambar 3. 4 Proses Bisnis Administrator (Sistem Usulan)

19
3.2 Hasil Analisis

a Analisis Sistem
Ada beberapa kelemahan dalam sistem lama, yaitu proses pemasaran dan penjualan produk
yang masih bersifat manual dan kurangnya minat konsumen yang akibatnya kurang informasi
tentang produk – produk yang ada pada UKM Andir. Dengan adanya sistem baru yang sudah
dirancang akan bisa mengelola permasalahn-permasalahn yang ada pada proses bisnis yang
lama.
b Analisis Pengguna
Aktor yang terlibat dalam proses Sistem Informasi E-Commerce UKM Andir adalah sebagai
berikut:

Tabel 3. 1 Analisis Pengguna

No Aktor Deskripsi
1. Melakukan Login.
2. Mengelola seluruh content dan informasi yang akan
1 Admin ditampilkan pada halaman website.
3. Mengelola antar muka website.
4. Mengelola user.
1. Dapat melihat seluruh informasi dan memberikan
komentar pada setiap informasi yang ditampilkan
2. User pada halaman website.
2. Dapat mengakses semua link yang ada pada website.

20
 BAB IV

PERANCANGAN DAN IMPLEMENTASI SISTEM

Berdasarkan hasil analisis sistem pada bab sebelumnya, maka pada bab ini berisi uraian tentang
perancangan dan implementasi sistem yang diusulkan untuk Sistem Pemasaran UKM Andir.
4.1 Perancangan Sistem

4.1.1. Use Case

Berikut gambar use case diagram untuk Sistem informasi E-Commerce UKM Andir ini .

Gambar 4. 1 Use Case

a Deskripsi Use Case

Deskripsi Use Case merupakan penjelasan dari use case atau proses-proses yang
berlangsung di dalam kegiatan Sistem Informasi e-commerce. Adapun deskripsi dari Use
Case dari Sistem Informasi e-commerce UMKM Andir adalah sebagai berikut :

21
 Tabel 4. 1 Deskripsi Use Case

No Use Case Deskripsi

1 Login Login merupakan proses otentikasi untuk melakukan

perubahan pada website. Kegiatan ini dilakukan oleh
admin.

2 Manajemen laman Merupakan kegiatan pengelolaan laman yang terdiri

dari menambah, menghapus dan mengubah laman.

3 Menambah laman Proses menambah laman pada website

4 Menghapus lama Proses menghapus laman pada website

5 mengubah laman Proses mengubah laman pada website

6 Manajemen komentar Merupkan kegiatan pengelolaan komentar yang terdiri

dari mengizinkan, menghapus dan verifikasi komentar.
7 Mengizinkan komentar Proses moderasi komentar pada website

8 Hapus komentar Proses menghapus komentar pada website

9 Manajemen antarmuka Kegiatan mengatur tampilan antarmuka website bagi

pelanggan mencakup penggantian tema dan warna
background.
10 Menganti tema Kegiatan mengganti tema tampilan dari website.

11 Mengganti latar Kegiatan mengganti warna atau gambar tampilan dari

belakang (background) latar belakang website.
12 Merubah pengguna Proses perubahan User pada website.

13 Input komentar Kegiatan User dalam menanggapi postingan admin.

22
4.1.2. Sequence Diagram
a Sequence Diagram Login

Gambar 4. 2 Sequence Diagram Login

Sequence diagram di atas merupakan sequence diagram proses login. Diasumsikan jika
user melakukan kesalahan dalam memasukan username dan password, maka program
akan menampilkan pesan bahwa user memasukan data yang tidak tepat.

23
b Sequence Diagram Tambah Produk

Gambar 4. 3 Sequence Diagram Tambah Produk

Sequence diagram di atas merupakan sequence diagram proses tambah produk dimana
actor yang terlibat yaitu admin dapat menambahkan daftar produk fashion dan handycraft
ke website untuk diperjual belikan.

24
c Sequence Diagram Ubah Produk

Gambar 4. 4 Sequence Diagram Ubah Produk

Sequence diagram di atas merupakan sequence diagram proses ubah atau edit produk yang
sudah dipublish kehalaman website. Admin dapat mengedit produk jika memang ada data-
data dari produk yang perlu dirubah.

25
d Sequence Diagram Hapus Produk

Gambar 4. 5 Sequence Diagram Hapus Produk

Sequence diagram di atas merupakan sequence diagram proses menghapus produk dari
halaman website yang dimana admin dapat menghapus langsung produk-produk yang
diinginkan mungkin karena sudah tidak diproduksi lagi atau sebagainya.

26
e Sequence Diagram Tambah Laman

Gambar 4. 6 Sequence Diagram Tambah Laman

Sequence diagram di atas merupakan sequence diagram proses menambah halaman baru
di dalam website dimana actor yang terlibat yaitu admin dapat menambahkan halaman baru
sesuai dengan kebutuhan UMKM Andir.

27
f Sequence Diagram Ubah Laman

Gambar 4. 7 Sequence Diagram Ubah Laman

Sequence diagram di atas merupakan sequence diagram proses ubah atau edit halaman
yang sudah dipublish kehalaman website. Admin dapat mengedit halaman jika memang
diperlukan untuk memperbaharui tampilan website.

28
g Sequence Diagram Hapus Laman

Gambar 4. 8 Sequence Diagram Hapus Laman

Sequence diagram di atas merupakan sequence diagram proses menghapus halamanyang

sudah ada dari halaman website yang dimana admin dapat menghapus langsung halaman
yang akan dihapus jika memang diperlukan.

29
h Sequence Diagram Tambah Pembelian

Gambar 4. 9 Sequence Diagram Tambah Pembelian

Sequence diagram di atas merupakan sequence diagram proses menambah pembelian baru
di dalam website dimana actor yang terlibat yaitu pembeli dapat menambahkan produk
baru yang diinginkan kedalam daftar belanjanya, tidak ada batasan jumlah produk yang
bisa dipilih selama stock produk yang dijual masih tersedia.

30
i Sequence Diagram Ubah Tema

Gambar 4. 10 Sequence Diagram Ubah Tema

Sequence diagram di atas merupakan sequence diagram proses merubah tema halaman di
dalam website dimana actor yang terlibat yaitu admin dapat merubah tema website sesuai
dengan kebutuhan untuk merubah tampilan website yang diinginkan.

31
4.1.3. Diagram Activity
a Diagram Activity Login

Gambar 4. 11 Diagram Activity Login

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses login
dari sistem informasi e-commerce yang akan dibangun berdasarkan aliran kerja.

32
b Diagram Activity Tambah Produk

Gambar 4. 12 Diagram Activity Tambah Produk

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

tambah produk dari sistem informasi e-commerce yang akan dibangun berdasarkan aliran
kerja.

33
c Diagram Activity Ubah Produk

Gambar 4. 13 Diagram Activity Ubah Produk

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

merubah atau mengedit dari sistem informasi e-commerce yang akan dibangun berdasarkan
aliran kerja.

34
d Diagram Activity Hapus Produk

Gambar 4. 14 Diagram Activity Hapus Produk

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

menghapus produk dari sistem informasi e-commerce yang akan dibangun berdasarkan
aliran kerja.

35
e Diagram Activity Tambah Laman

Gambar 4. 15 Diagram Activity Tambah Laman

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

menambah halaman dari sistem informasi e-commerce yang akan dibangun berdasarkan
aliran kerja.

36
f Diagram Activity Ubah Laman

Gambar 4. 16 Diagram Activity Ubah Laman

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

merubah atau mengedit halaman dari sistem informasi e-commerce yang akan dibangun
berdasarkan aliran kerja.

37
g Diagram Activity Hapus Laman

Gambar 4. 17 Diagram Activity Hapus Laman

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

menghapus halaman dari sistem informasi e-commerce yang akan dibangun berdasarkan
aliran kerja.

38
h Diagram Activity Tambah Pembelian

Gambar 4. 18 Diagram Activity Tambah Pembelian

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

menambah pembelian produk dari sistem informasi e-commerce yang akan dibangun
berdasarkan aliran kerja.

39
i Diagram Activity Hapus Pembelian

Gambar 4. 19 Diagram Activity Hapus Pembelian

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

menghapus pembelian produk dari sistem informasi e-commerce yang akan dibangun
berdasarkan aliran kerja.

40
j Diagram Activity Pengaturan Tema

Gambar 4. 20 Diagram Activity Pengaturan Tema

Activity diagram di atas merupakan activity diagram untuk mendeskripsikan proses

pengaturan tema dari sistem informasi e-commerce yang akan dibangun berdasarkan aliran
kerja.

41
4.2 Implementasi Sistem

Berikut adalah implementasi Sistem I formasi E-Commerce UKM Andir.

a Implementasi Antarmuka Login
Sebelum user melakukan transaksi atau inputan, user diwajibkan untuk melakukan login terlebih
dahulu. Form login digunakan untuk memperoleh hak akses, sehingga pengguna sistem dapat
melakukan pengelolaan website. Pada form login terdapat username dan password. Setelah
mengisi kedua field tersebut, sistem akan mencari kebenaran dari data tersebut, jika kombinasi
username dan password benar maka user berhak mengakses sistem. Pada sistem ini terdapat 1
user sebagai admin dengan hak akses untuk mengelola website. Bagian admin login dengan
username admin dan passwordnya kotaktissu1.

Gambar 4. 21 Implementasi Antarmuka Login

42
b Implementasi Antarmuka Pengaturan Laman
Berikut merupakan tampilan halaman dashboard jika admin ingin melakukan penggaturan
halaman yang terdapat di dalam website.

Gambar 4. 22 Implementasi Antarmuka Pengaturan Laman

c Implementasi Antarmuka Dashboard Pengaturan Plugin

Berikut merupakan tampilan halaman dashboard jika admin ingin melakukan penggaturan plugin
untuk menambah fitur-fitur baru ke dalam halaman website.

Gambar 4. 23 Implementasi Antarmuka Dashboard Pengaturan Plugin

43
d Implementasi Antarmuka Penambahan Laman Website
Berikut merupakan tampilan halaman pengaturan jika admin ingin melakukan penambahan
halaman kedalam website.

Gambar 4. 24 Implementasi Antarmuka Penambahan Laman Website

e Implementasi Antarmuka Pengaturan Header Website

Berikut merupakan tampilan halaman pengaturan header jika admin ingin melakukan penggaturan
pada header website seperti pengaturan slide, warna tulisan pada website, jenis tulisan pada
website dan lain-lain.

Gambar 4. 25 Implementasi Antarmuka Pengaturan Header Website

44
f Implementasi Antarmuka Pengaturan Store pada Website
Berikut merupakan tampilan halaman setting store jika admin ingin melakukan penggaturan pada
halaman store pada website seperti pengaturan taxes,shipping, payment, dan checkout.

Gambar 4. 26 Implementasi Antarmuka Pengaturan Store pada Website

g Implementasi Antarmuka Produk

Berikut merupakan tampilan halaman dashboard admin jika ingin melihat produk apa saja yang
sudah diinputkan kedalam website.

Gambar 4. 27 Implementasi Antarmuka Produk

45
h Implementasi Antarmuka Penambahan Produk
Berikut merupakan tampilan halaman produk jika admin ingin melakukan penambahan produk
untuk di jual di dalam halaman website.

Gambar 4. 28 Implementasi Antarmuka Penambahan Produk

i Implementasi Antarmuka Home

Berikut merupakan tampilan halaman home jika admin atau customer. Laman home merupakan
laman awal dari website e-commerce UMKM Andir.

Gambar 4. 29 Implementasi Antarmuka Home

46
j Implementasi Antarmuka Contact us
Berikut merupakan tampilan halaman contact us yang bisa digunakan oleh customer jika customer
ingin menghubungi admin selaku pemilik UMKM Andir.

Gambar 4. 30 Implementasi Antarmuka Contact us

k Implementasi Antarmuka Shop

Berikut merupakan tampilan halaman shop yang dapat diakses oleh customer untuk membeli
barang-barang yang diinginkan.

47
 Gambar 4. 31 Implementasi Antarmuka Shop

l Implementasi Antarmuka Checkout

Berikut merupakan tampilan halaman checkout yang dapat diakses oleh customer untuk melihat
daftar belanjanya sebelum melakukan pembayaran.

Gambar 4. 32 Implementasi Antarmuka Checkout

m Implementasi Antarmuka Billing dan Shipping

Berikut merupakan tampilan halaman proses pengisian form billing dan shipping untuk proses
sebelum melakukan pembayaran transaksi pembelian produk yang dilakukan oleh customer .

48
 Gambar 4. 33 Implementasi Antarmuka Billing dan Shipping

n Implementasi Antarmuka Pembayaran Transaksi Pembelian

Berikut merupakan tampilan halaman Trasaction Result yang akan muncul setelah customer
setelah selesai mengisi data-data di form billing dan shipping. Pada halaman ini berisi informasi
kembali jumlah pembayaran yang harus dibayarkan oleh customer sesuai jumlah produk yang
dibeli dan kemana customer harus mentransfer uangnya.

Gambar 4. 34 Implementasi Antarmuka Pembayaran Transaksi Pembelian

49
o Implementasi Antarmuka About Us
Berikut merupakan tampilan halaman about us pada website berisi informasi tentang pemilik
UMKM Andir dan mahasiswa yang sedang melakukan penelitian pada UMKM Andir yang bisa
dilihat oleh customer di halaman home .

Gambar 4. 35 Implementasi Antarmuka About Us

p Implementasi Antarmuka Footer Website

Berikut merupakan tampilan footer pada bagian website yang terletak dibagian bawah website
yang bisa dilihat oleh customer.

Gambar 4. 36 Implementasi Antarmuka Footer Website

50
 BAB V

PENUTUP

5.1 Kesimpulan

Dari berbagai penjelasan yang telah diuraikan dalam laporan ini, maka dapat disimpulkan berbagai
hal sebagai berikut:
a Dengan adanya aplikasi E-Commerce berbasis web ini, pemilik usaha dapat
menyebarluaskan informasi mengenai produk-produk ke lebih banyak khalayak, tidak
terbatas di wilayah usaha dan pengunjung saja sehingga usahanya bisa lebih berkembang.
b Dengan adanya aplikasi Sistem Informasi E-Commerce ini, pemilik usaha dapat
menyajikan informasi sesuai dengan kebutuhan yang diinginkan konsumen.

5.2 Saran

Demi kelancaran operasional secara umum dan manfaat yang diberikan, maka penulis berusaha
untuk mengajukan beberapa pemikiran berupa saran sebagai pertimbangan, antara lain:
a Melihat sistem aplikasi yang penulis buat ini menangani masalah promosi pemasaran dan
penjualan produk, penulis menyarankan untuk dikembangkan lagi kearah tampilan
penjualan produk (e-commerce) yang lebih canggih dan user friendly, sehingga pembeli
dan calon pembeli dapat lebih tertarik lagi.
b Perlu dibangun sistem pembayaran untuk pembelian produk yang lebih beragam tidak
hanya sekedar ATM transfer.

51
 DAFTAR PUSTAKA

[1] P. K. B. B. K. Berencana, Profil Kelompok UPPKS Kota Bandung, Bandung: Pemerintah Kota Bandung,
2013.

[2] GM.Susanto, Revolusi Internet Marketing Indonesia Dengan cara Smart Street, Yogyakarta: Gava
Media, 2013.

[3] B. Nugroho, Dasar Pemrograman Web PHP-MySQL, Yogyakarta: Gava Media, 2013.

[4] R. A. d. M. Salahudin, Rekayasa Perangkat Lunak, Bandung: Informatika, 2013.

[5] A. Kristanto, Perancngan Sistem Informasi, Yogyakarta: Gava Media, 2011.

52
 LAMPIRAN

Gambar 1 Logo Asosiasi Kelompok UPPKS

Gambar 2 Tempat UPPKS Andir Cimahi

53
 Gambar 3 Salah Satu Produk UPPKS Andir Cimahi

Gambar 4 Ibu Yani Ketua UPPKS Andir Cimahi

54

View publication stats