TA : Rancang Bangun Toko Online Sentra UKM Merr Surabaya.

(1)

1

RANCANG BANGUN TOKO ONLINE

SENTRA UKM MERR SURABAYA

TUGAS AKHIR

Program Studi

S1 Sistem Informasi

Oleh:

CEFA RAHARDJO

12.41010.0002

FAKULTAS TEKNOLOGI DAN INFORMATIKA

INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA

2016


(2)

1

Halaman

ABSTRAK ... vii

KATA PENGANTAR ... viii

DAFTAR ISI ... ix

DAFTAR GAMBAR ... xiv

DAFTAR TABEL ... xxii

BAB I PENDAHULUAN ... 1

1.1 Latar Belakang Masalah ... 1

1.2 Perumusan Masalah ... 3

1.3 Batasan Masalah ... 4

1.4 Tujuan Penelitian ... 4

1.5 Manfaat Penelitian ... 4

1.6 Sistematika Penulisan ... 5

BAB II LANDASAN TEORI ... 7

2.1 Sistem ... 7

2.2 Sistem Informasi ... 7

2.3 Sistem Penjualan ... 8

2.4 Analisa dan Perancangan Sistem Informasi ... 8


(3)

2

2.5.1. Requirement Analysis... 11

2.5.2. System Design ... 12

2.5.3. Implementation ... 12

2.5.4. Integration and Testing ... 12

2.5.5. Deployment ... 12

2.5.6. Maintenance ... 12

2.6 Website ... 12

2.7 Hypertext Preprocessor ... 13

2.8 MySQL ... 14

2.9 Toko Online ... 15

2.10 Skala Likert ... 15

2.11 Testing ... 15

2.11.1. White Box Testing ... 16

2.11.2. Black Box Testing... 17

BAB III METODOLOGI PENELITIAN DAN PERANCANGAN SISTEM .... 18

3.1 Requirement Gathering and Analysis ... 19

3.1.1 Wawancara ... 19

3.1.2 Pengamatan atau Observasi ... 19

3.1.3 Studi Literatur ... 20


(4)

3

3.2 System Design ... 26

3.2.1 System Flow ... 26

3.2.2 Data Flow Diagram (DFD) ... 40

3.2.3 Entitiy Relationship Diagram ... 50

3.2.4 Struktur Tabel ... 53

3.2.5 Desain Interface ... 58

3.2.6 Implementation ... 81

3.2.7 Integration and Testing ... 82

BAB IV IMPLEMENTASI DAN EVALUASI ... 88

4.1 Implementasi dan Kebutuhan Sistem... 88

4.2 Pembuatan Program / Aplikasi ... 89

4.3 Implementasi sistem... 89

4.3.1 Halaman Utama ... 89

4.3.2 Halaman Detil Produk... 90

4.3.3 Halaman Daftar Pelanggan ... 91

4.3.4 Halaman Login Pelanggan ... 92

4.3.5 Halaman Login Administrasi ... 93

4.3.6 Halaman Utama ... 93

4.3.7 Halaman Master Data UKM ... 94


(5)

4

4.3.9 Halaman Master Data Produk ... 99

4.3.10 Halaman Master Data Kategori Produk UKM ... 102

4.3.11 Halaman Master Jenis Barang ... 104

4.3.12 Halaman Transaksi Penjualan ... 107

4.3.13 Halaman Transaksi Konfirmasi Pembayaran ... 108

4.3.14 Halaman Konfirmasi Pengiriman Barang ... 109

4.3.15 Menampilkan Rekap Data UKM... 109

4.3.16 Menampilkan Rekap Data Pelanggan ... 110

4.3.17 Menampilkan Rekap Data Produk ... 111

4.3.18 Menampilkan Laporan Mutasi Stok ... 112

4.3.19 Menampilkan Laporan Barang Terlaris ... 113

4.3.20 Menampilkan Laporan UKM Terlaris... 114

4.3.21 Menampilkan Laporan Penjualan... 115

4.4 Uji Coba sistem ... 117

4.4.1 Uji Coba Login Administrasi ... 117

4.4.2 Uji Coba Kelola Data Master ... 119

4.4.3 Uji Coba Kelola Data Transaksi ... 124

4.4.4 Uji Coba Pendaftaran Pelanggan ... 125

4.4.5 Uji Coba Login Pelanggan ... 127


(6)

5

4.4.7 Uji Coba Laporan ... 135

4.5 Hasil Respon Pengguna ... 136

BAB V PENUTUP ... 138

5.1 Kesimpulan ... 138

5.2 Saran ... 138


(7)

1

PENDAHULUAN

1.1 Latar Belakang Masalah

Sentra UKM MERR Surabaya adalah sebuah ikon simbolik untuk Usaha Kecil Menengah (UKM) yang dibangun di Surabaya. Sentra UKM MERR Surabaya dibangun dengan tujuan agar tempat ini dapat menjadi tempat berkunjungnya para konsumen dari seluruh Indonesia, bahkan mancanegara. Sentra UKM MERR Surabaya juga dibangun dengan tujuan membantu para UKM, khususnya UKM yang berada di Surabaya untuk memasarkan dan menjualkan produknya.

Sentra UKM MERR Surabaya yang berlokasi di Jl. Ir. Soekarno No.11 Surabaya ini, saat ini sudah ada kurang lebih 165 UKM yang bergabung didalamnya. Setiap UKM yang boleh memasarkan produk di Sentra UKM MERR Surabaya dipilih oleh Sentra UKM MERR Surabaya sendiri. Saat ini proses bisnis Sentra UKM MERR Surabaya masih berjalan secara konvensional dan belum semuanya terkomputerisasi. Sentra UKM MERR Surabaya sudah memiliki aplikasi kasir namun, aplikasi yang ada belum terlalu membantu proses bisnis yang ada. Proses pemasaran produk yang dilakukan UKM hanyalah memamerkan barang dagangannya di Sentra UKM MERR Surabaya dan tinggal menunggu pengunjung yang datang ke Sentra UKM MERR Surabaya. Permasalahan yang ada pada Sentra UKM MERR Surabaya beberapa diantaranya adalah pencatatan stok produk yang masih menggunakan kartu stok sehingga kesalahan pencatatan stok produk masih sering terjadi serta transaksi penjualan yang tidak berjalan dengan baik terbukti


(8)

dengan jumlah pengunjung setiap bulan yang kurang lebih hanya 50 orang sehingga, produk yang ada pun tidak semuanya terjual. Pihak Sentra UKM MERR Surabaya pun sepertinya tidak memberikan promosi-promosi yang menarik agar pengunjung tertarik dan datang ke Sentra UKM MERR Surabaya untuk melihat dan membeli produk yang ada.

Untuk mengatasi beberapa masalah yang dihadapi Sentra UKM MERR Surabaya, maka dibuatkan toko online untuk pemasaran produk dan proses penjualan produk Sentra UKM MERR Surabaya. Aplikasi ini dapat membantu administrasi untuk melihat dan memantau produk yang dijual, serta pencatatan stok tidak perlu menggunakan kartu stok semuanya sudah terkomputerisasi. Sentra UKM MERR Surabaya juga dapat memberikan promosi terbaru pada halaman utama toko online serta diharapkan dengan adanya aplikasi ini komunikasi antara Sentra UKM MERR Surabaya, UKM dan pengunjung menjadi lebih mudah. Proses bisnis yang ada saat ini dapat dilihat pada Gambar 1.1


(9)

1.2 Perumusan Masalah

Berdasarkan latar belakang yang ada, maka perumusan masalah yaitu Bagaimana merancang bangun toko online Sentra UKM MERR Surabaya?


(10)

1.3 Batasan Masalah

Adapun batasan masalah yang dibahas dalam perancangan ini:

1. Aplikasi ini dibuat dengan sistem online dengan bahasa pemrograman PHP dan MYSQL.

2. Aplikasi ini hanya memberikan member kepada administrasi Sentra UKM MERR Surabaya dan Pelanggan yang telah terdaftar.

3. Laporan yang dihasilkan hanya Laporan Penjualan, Laporan UKM Terlaris, Laporan Barang Terlaris, Laporan Mutasi Stok, Rekap Data Produk, Rekap Data Pelanggan dan Rekap Data UKM.

4. Aplikasi ini tidak termasuk e-commerce karena alikasi ini tidak bekerja sama dengan bank manapun. Proses konnfirmasi pembayaran yang dilakukan hanya mengisi form yang didalamnya tertera kolom untuk mengisi nama pemilik rekening, nomor rekening, nama bank dan tanggal transfer.

1.4 Tujuan Penelitian

Sesuai dengan permasalahan yang ada maka tujuan dari dibangunnya website ini adalah merancang bangun toko online Sentra UKM MERR Surabaya. 1.5 Manfaat Penelitian

Manfaat dari pembuatan website yang diberikan pada Sentra UKM MERR Surabaya antara lain, tidak perlu mengecek kepastian data secara manual, semuanya telah terkomputerisasi. Administrasi juga tidak memerlukan biaya tambahan untuk promosi, hanya membuat iklan di halaman utama website, maka semua orang dapat melihat promo apa yang sedang ada di Sentra UKM MERR Surabaya. Manfaat yang dapat dirasakan bagi pengguna adalah dapat melihat dan membeli produk yang dijual oleh Sentra UKM MERR Surabaya tanpa harus datang jauh ke Sentra


(11)

UKM MERR Surabaya terlebih dahulu. Sementara manfaat yang dapat dirasakan bagi Mahasiswa atau pelajara adlaah mendapatkan ilmu bagaimana merancang bangun toko online Sentra UKM MERR Surabaya.

1.6 Sistematika Penulisan

Untuk memberikan gambaran menyeluruh terhadap masalah yang dibahas, maka sistematikan penulisan dibagi kedalam beberapa bab yaitu:

BAB I PENDAHULUAN

Pada bab ini menjelaskan tentang latar belakang dari hal-hal yang berhubungan dengan aplikasi , rumusan masalah, batasan masalah, tujuan yang ingin dicapai, manfaat yang diperoleh dengan adanya aplikasi yang telah dibuat, serta sistematika dari penulisan laporan.

BAB II LANDASAN TEORI

Bab ini menjelaskan tentang landasan teori yang akan di sesuaikan dalam pembangunan Toko Online Sentra UKM MERR Surabaya. Teori yang meliputi adalah pengertian tentang sistem, sistem informasi, SDLC, PHP, analisa dan perancangan sistem informasi, MySQL, Bootstrap dan pengertian tentang toko online.

BAB III METODOLOGI PENELITIAN DAN PERACANGAN SISTEM

Pada bab ini menjelaskan mengenai perancangan system yang terdiri atas penjelasan dari identifikasi masalah, analisis sistem, perancangan sistem, desain sistem desain input output, dan desain uji coba aplikasi toko online Sentra UKM MERR Surabaya.


(12)

BAB IV IMPLEMENTASI DAN EVALUASI

Pada bab ini dibahas tentang impelementasi dari perancangan yang telah dilakukan dalam pembuatan toko online Sentra UKM MERR Surabaya.

BAB V PENUTUP

Pada bab ini dibahas tentang kesimpulan dari pembuatan toko online Sentra UKM MERR terkait dengan tujuan dan permasalahan, beserta dengan saran– saran yang bermanfaat untuk pengembangan toko online Sentra UKM MERR Surabaya.


(13)

7

LANDASAN TEORI

2.1 Sistem

Menurut Herlambang dan Tanuwijaya (2005), definisi dari sistem dapat dilakukan dengan dua pendekatan, yaitu pendekatan prosedur dan pendekatan komponen. Definisi sistem dengan pendekatan prosedur yaitu sebagai kumpulan dari beberapa prosedur yang mempunyai tujuan tertentu. Sedangkan dengan pendekatan komponen, sistem didefinisikan sebagai kumpulan dari komponen– komponen yang saling berkaitan untuk mencapai tujuan tertentu. Menurut Sukoco (2007), sistem terdiri dari subsistem yang berhubungan dengan prosedur yang membantu pencapaian tujuan. Prosedur tersebut berfungsi untuk melengkapi proses pekerjaan, yang berisi tentang aktivitas operasional atau teknis.

Beberapa manfaat digunakannya pendekatan sistem adalah : 1. Mengoptimalkan hasil dari penggunaan sumber daya yang efisien 2. Salah satu alat pengendali biaya

3. Untuk mengefisiensikan aktivitas yang dilakukan dalam kantor 4. Alat bantu pencapaian tujuan organisasi

5. Alat bantu organisasi dalam menerapkan fungsi-fungsinya. 2.2 Sistem Informasi

Menurut Ferdinandus, dkk (2011), Sistem informasi (SI) adalah kombinasi antara teknologi informasi dan aktivitas orang yang menggunakan teknologi itu untuk mendukung operasi dan manajemen. Dalam arti yang sangat luas, istilah


(14)

sistem informasi yang sering digunakan merujuk kepada interaksi antar orang, proses algoritmik, data dan teknologi.

Sistem Informasi dituntut tidak hanya mengolah data dari dalam organisasi saja, tetapi juga dapat menyajikan data dari pihak luar yang mampu menambah nilai kompetisi bagi organisasi. Dengan demikian, sistem informasi harus memiliki data yang telah terpola dan memiliki integritas dalam hal waktu dan tempat. Hal ini dimaksudkan agar sistem informasi tersebut dapat menyajikan informasi yang tepat bagi pengguna.

2.3 Sistem Penjualan

Penjualan dalam buku Ensiklopedia Ekonomi, Keuangan dan Perdagangan adalah suatu kontrak atau perjanjian atara dua pihak, masing-masing dikenal sebagai penjual, dan pembeli, yang mewajibkan pihak yang pertama itu untuk, atas pertimbangan akan suatu pembayaran, atau suatu janji akan pembayaran sejumlah harga dalam uang tertentu, memindahkan kepada pihak yang terakhir hak dna kepemilikan harta benda (Abdurrachman, 2001). Dari penjelasan tersebut dapat disimpulkan bahwa sistem penjualan adalah suatu sistem yang digunakan oleh perusahaan untuk melakukan aktifitas jual beli atau memasarkan barang kepada konsumen.

2.4 Analisa dan Perancangan Sistem Informasi

Menurut Kristanto (2004), analisa dan perancangan sistem informasi adalah penggunaan dari Sistem Informasi ke dalam bagian sub sistem untuk mengidentifikasi dan mengevaluasi permasalahan, hambatan, kesempatan yang terjadi serta kebutuhan yang diharapkan.


(15)

Tahap analisis dilakukan setelah tahap perencanaan sistem dan sebelum tahap perancangan sistem. Tahap analisis merupakan tahap yang kritis dan sangat penting, karena kesalahan dalam tahap ini akan sangat berpengaruh pada tahap selanjutnya. Langkah-langkah untuk menganalisis sistem tersebut adalah:

1. Mengidentifikasi masalah,

2. Memahami kerja sistem yang ada, 3. Menganalisis sistem,

4. Membuat laporan hasil analisis.

Pada tahap awal, dilakukan identifikasi masalah serta diperlukan adanya analisis yang digunakan untuk menentukan faktor-faktor yang menjadi permasalahan dalam sistem yang telah ada atau digunakan. Data-data yang baik yang berasal dari sumber-sumber internal dan eksternal, data yang berasal dari internal contohnya seperti laporan-laporan, dokumen dan hasil observasi, sementara data yang berasal dari eksternal contohnya seperti uji coba sistem oleh pengguna. Semua data baik dari internal maupun eksternal akan dikumpulkan sebagai bahan pertimbangan analisis. Setelah semua permasalahan diidentifikasi, tahap selanjutnya adalah mempelajari dan memahami alur kerja sistem yang ada.

Setelah mempelajari dan memahami sistem yang ada, dilanjutkan dengan menganalisis dan membandingkan sistem yang lama dengan yang baru. Tahap berikutnya adalah membuat laporan-laporan hasil analisis sistem lama dan sistem yang akan diterapkan. Perancangan sistem adalah proses menyusun atau mengembangkan sistem informasi yang telah ada atau yang akan diterapkan. Dalam tahap ini harus dipastikan bahwa semua persyaratan untuk menghasilkan informasi harus terpenuhi (Jogiyanto, 2005). Perancangan sistem harus mampu memberikan


(16)

gambaran-gambaran yang jelas dan berguna serta lengkap kepada programer serta ahli-ahli teknik yang terlibat.Dalam perencanaan dan perancangan suatu sistem, langkah-langkah yang harus dilakukan adalah :

1. Pembuatan bagan alur sistem, 2. Pembuatan bagan berjenjang, 3. Data Flow Diagram,

4. Entity Relationship Diagram.

2.5 System Development Life Cycle

Menurut Pressman (2015), model System Development Life Cycle (SDLC) dapat disebut juga model waterfall adalah model air terjun kadang dinamakan siklus hidup klasik (classic life cycle). Menurut Kendall (2003), System Development life Cycle (SDLC) adalah pendekatan melalui beberapa tahap untuk menganalisis dan merancang sistem dimana sistem tersebut telah dikembangkan dengan sangat baik melalui penggunaan siklus kegiatan penganalisis dan pemakai secara spesifik. Langkah-langkah dalam SDLC dijalankan secara bertahap, tidak pernah tercapai sebagai satu langkah terpisah. Beberapa aktivitas muncul secara simultan, dan aktivitas tersebut dilakukan berulang-ulang. Ada tujuh tahap di dalam SDLC, tahap-tahap tersebut adalah:

1. Identifikasi masalah,peluang, dan tujuan, 2. Menentukan kebutuhan informasi/data, 3. Menganalisis kebutuhan-kebutuhan sistem, 4. Merancang sistem yang direkomendasikan,

5. Mengembangkan dan mendokumentasikan perangkat lunak, 6. Menguji dan mempertahankan sistem,


(17)

7. Mengimplementasikan dan mengevaluasi sistem.

SDLC memiliki beberapa model yang paling populer seperti Waterfall model, Iterative Model, Spiral Model, V-Model, Big Bang Model, Agile Model, RAD Model , Software Prototype, namun pada studi kasus ini SDLC model yang digunakan adalah SDLC model Waterfall.

Waterfall model adalah model SDLC yang pertama kali digunakan dalam Software Engineering untuk menentukan tingkat kesuksesan dari sebuah proyek (tutorialspoint.com). Tahap - tahap dari SDLC-Waterfall Model dapat dilihat pada Gambar 2.1.

2.5.1. Requirement Analysis

Semua data yang dibutuhkan untuk membangun aplikasi ini, dikumpulkan dan di dokumentasikan dalam sebuah dokumen Requirement System.


(18)

2.5.2. System Design

Setelah analisa permasalahan dan analisa kebutuhan dilakukan, tahap selanjutnya yaitu perancangan sistem dimana pada tahap ini melakukan desain Diagram Input Proses Output, Diagram Himpunan Input Proses Output, System Flow Diagram dan Data Flow Diagram.

2.5.3. Implementation

Dengan masukan dari system design, sistem pertama kali di implementasikan kedalam unit, yang kemudian di integrasikan kedalam tahap selanjutnya.

2.5.4. Integration and Testing

Semua unit yang telah dibuat, di integrasikan menjadi satu dan di uji berdasarkan fungsional atau non- fungsional.

2.5.5. Deployment

Pada tahap ini, aplikasi telah selesai diuji dan siap diimplementasikan serta di lepas ke pasar.

2.5.6. Maintenance

Setiap aplikasi yang telah di lepas ke pasar meskipun sudah melalui pengujian tetap ada masalah yang akan timbul, maka beberapa perubahan harus di luncurkan ke pasar untuk memperbarui aplikasi dan memperbaiki fungsi aplikasi. 2.6 Website

Menurut Shelly dan Vermalat (2010), web adalah koleksi dokumen elektronik milik semua orang di dunia yang mengaksesnya melalui internet menggunakan web browser. Menurut Simarmata (2010), aplikasi web adalah sebuah sistem informasi yang mendukung interaksi pengguna melalui antarmuka


(19)

berbasis web. Fitur-fitur aplikasi web biasanya berupa data persistence, mendukng transaksi dan komposisi halaman web dinamis yang dapat dipertimbangkan sebagai hibridasi, antara hypermedia dan sistem informasi. Aplikasi web adalah bagian dari client-side yang dapat dijalankan oleh browser web. Client-side mempunyai tanggung jawab untuk pengeksekusian proses bisnis. Interaksi web dibagi dalam tiga langkah utama, yaitu:

1. Permintaan

Pengguna mengirimkan permintaan ke server web, biasanya via halaman web yang ditampilkan pada browser web.

2. Pemrosesan

Server web menerima permintaan yang dikirimkan oleh pengguna, kemudian memproses permintaan tersebut.

3. Jawaban

Browser menampilkan hasil dari permintaan pada jendela browser. 2.7 Hypertext Preprocessor

Menurut Oktavian (2010), Hypertext Preprocessor (PHP) adalah suatu bahasa pemrograman berbasiskan kode-kode yang digunakan untuk mengolah suatu data dan mengirimkannya kembali ke web browser menjadi kode HTML.

PHP bermula saat Rasmus Lerdorf membuat sejumlah skrip PERL yang dapat mengamati siapa yang yang melihat-lihat daftar riwayat hidupnya pada tahun 1994. Pada tahun 1995, Ramus menciptakan PHP/FI versi 2, dimana versi tersebut dapat menempelkan kode terstruktur dalam tag HTML dan juga PHP dapat digunakan untuk berkomunikasi dengan database.


(20)

PHP biasanya dipergunakan untuk pemrograman berbasis web yang tidak hanya menampilkan halaman secara statis, namun menampilkan website berbentuk dinamis dimana data diambil dari dalam database. PHP memiliki kelebihan yaitu PHP bersifat sederhana dan memiliki kemampuan untuk menghasilkan berbagai aplikasi web, selain itu PHP juga bersifat multiplatform yakni Windows,Linux, dan Mac.

2.8 MySQL

Menurut Utdirartatmo (2002), MySQL adalah database server relasional yang gratis di bawah lisensi General Public License (GNU). Dengan sifatnya yang open source, memungkinkan user untuk melakukan modifikasi pada source code-nya untuk memenuhi kebutuhan spesifik mereka sendiri. MySQL merupakan database server multi-user dan multi-threaded yang tangguh yang memungkinkan backend yang berbeda, sejumlah program client dan library yang berbeda, perangkat administrasiistratif, dan beberapa antarmuka pemrograman. MySQL juga tersedia sebagai library yang dapat digabungkan ke aplikasi.

MySQL juga dapat berperan sebagai client/server, dengan kemampuan dapat berjalan baik di Operation System manapun (multiplatform). MySQL menggunakan bahasa standar yaitu Structured Query Language (SQL) yang merupakan bahasa yang sama dengan database lainnya. MySQL lebih sering digunakan bersamaan dengan PHP dalam pengembangan website dinamis atau aplikasi web karena kecepatan dan fleksibilitas yang dimiliki oleh MySQL yang tinggi terhadap PHP.


(21)

2.9 Toko Online

Dari segi bahasa, toko online berasal dari dua suku kata, Toko dan Online. Menurut Kamus Besar Bahasa Indonesia, toko berarti sebuah tempat atau bangunan permanen untuk menjual barang-barang seperti makanan, minuman, dan sebagainya. Sedangkan online yang terjemahan bahasa indonesianya adalah dalam jaringan atau disingkat daring menurut Wikipedia adalah keadaan di saat seseorang terhubung ke dalam suatu jaringan ataupun sistem yang lebih besar. Jadi berangkat dari dua pengertian secara bahasa tersebut kita dapat mengartikan toko online sebagai tempat terjadinya aktivitas perdagangan atau jual beli barang yang terhubung ke dalam suatu jaringan dalam hal ini jaringan internet. (Mujiyana, 2013) 2.10 Skala Likert

Skala Likert digunakan untuk mengukur sikap, pendapat dan persepsi seseorang atau sekelompok tentang kejadian atau gejala sosial. Dalam penelitian gejala sosial ini telah ditetapkan secara spesifik oleh peneliti, yang selanjutnya disebut sebagai variabel penelitian.

Dengan menggunakan skala likert, maka variable yang akan diukur dijabarkan menjadi dimensi, dimensi dijabarkan menjadi sub variabel kemudian sub variabel dijabarkan lagi menjadi indikator-indikator yang dapat diukur. Akhirnya indikator terukur ini dapat dijadikan titil tolak untuk membuat item instrumen yang berupa pertanyaan atau pernyataan yang perlu dijawab oleh responden. (Riduwan, 2012)

2.11 Testing

Menurut Romeo (2003), testing adalah proses pemantapan kepercayaan akan kinerja program atau sistem sebagaimana yang diharapkan. Testing Software


(22)

adalah proses mengoperasikan software dalam suatu kondisi yang dikendalikan untuk verifikasi, mendeteksi error dan validasi. Verifikasi adalah pengecekkan atau pengetesan entitas-entitas, termasuk software, untuk pemenuhan dan konsistensi dengan melakukan evaluasi hasil terhadap kebutuhan yang telah ditetapkan. Validasi adalah melihat kebenaran sistem apakah proses yang telah dituliskan sudah sesuai dengan apa yang dibutuhkan oleh pengguna. Deteksi error adalah testing yang berorentasi untuk membuat kesalahan secara intensif, untuk menentukan apakah suatu hal tersebut tidak terjadi. Test case merupakan suatu tes yang dilakukan berdasarkan pada suatu inisialisasi, masukan, kondisi ataupun hasil yang telah ditentukan sebelumnya. Adapun kegunaan dari test case ini, adalah sebagai berikut:

1. Untuk melakukan testing kesesuaian suatu komponen terhadap desain White Box Testing.

2. Untuk melakukan testing kesesuaian suatu komponen terhadap spesifikasi Black Box Testing.

2.11.1. White Box Testing

Menurut Romeo (2003), white box testing adalah suatu metode desain test case yang menggunakan struktur kendali dari desain prosedural. Seringkali white box testing di asosiasi kan dengan pengukuran cakupan tes, yang mengukur persentase jalur-jalur dari tipe yang dipilih untuk dieksekusi oleh test cases. White box testing dapat menjamin semua struktur internal data dapat dites untuk memastikan validasinya.

Cakupan pernyataan, cabang dan jalur adalah suatu teknik white box testing yang menggunakan alur logika dari program untuk membuat test cases alur


(23)

logika adalah cara dimana suatu bagian dari program tertentu dieksekusi saat menjalankan program. Alur logika suatu program dapat di representasikan dengan flowgraph.

2.11.2. Black Box Testing

Menurut Romeo (2003), Black box testing dilakukan tanpa adanya suatu pengetahuan tentang detail struktur internal dari sistem atau komponen yang dites, juga disebut sebagai fungsional testing. Black box testing berfokus pada kebutuhan fungsional pada software, berdasarkan pada spesifikasi kebutuhan dari software. Dengan adanya black box testing, perekayasa software dapat menggunakan kebutuhan fungsional pada suatu program. Black box testing dilakukan untuk melakukan pengecekan apakah sebuah software telah bebas dari error dan fungsi-fungsi yang diperlukan telah berjalan sesuai dengan yang diharapkan


(24)

18

METODOLOGI PENELITIAN DAN PERANCANGAN SISTEM

Pada sub bab ini akan menjelaskan tentang tahapan-tahapan yang dilakukan dalam merancang dan membangun toko online dengan menggunakan konsep SDLC (Systems Development Life Cycle) – Waterfall Model. Tahapan tersebut diawali dengan analisa permasalahan yang terjadi dalam perusahaan hingga perancangan yang dibuat sebagai solusi dari permasalahan tersebut. Tahapan dalam pembuatan solusi tersebut bisa dilihat pada Gambar 3.1.


(25)

3.1 Requirement Gathering and Analysis

Sebagai tahap awal untuk mengetahui permasalahan yang sedang dihadapi oleh Sentra UKM perlu dilakukan analisis proses bisnis yang ada di dalam Sentra UKM agar solusi yang diberikan sesuai dengan harapan dan memiliki manfaat yang maksimal.

Permasalahan yang terjadi di dalam Sentra UKM adalah terkait dengan kurang dikenalnya Sentra UKM oleh masyarakat serta kurang nya tingkat penjualan produk Sentra UKM. Sehingga perlu dibangun suatu fasilitas untuk membantu peningkatan penjualan produk dan promosi Sentra UKM. Fasilitas yang dibangun adalah aplikasi berbasis web yang akan memudahkan komunikasi antar pelanggan dan Sentra UKM seta menjadi tempat promosi untuk Sentra UKM

Setelah melakukan analisis permasalahan dari Sentra UKM, tahap selanjutnya yaitu melakukan analisa kebutuhan Sentra UKM. Dalam melaksanakan tahap ini, ada 3 cara yang digunakan yaitu wawancara, pengamatan/observasi, dan studi literatur.

3.1.1 Wawancara

Pengumpulan data untuk pengenalan Sentra UKM dilakukan dengan cara wawancara kepada pihak Sentra UKM tentang proses bisnis yang ada saat ini pada Sentra UKM, permasalahan yang dihadapi saat ini serta apa yang dibutuhkan oleh Sentra UKM.

3.1.2 Pengamatan atau Observasi

Langkah ini dilakukan untuk mengetahui apakah solusi yang diberikan kepada Sentra UKM sudah sesuai dengan latar belakang masalah, dengan adanya observasi diharapkan bahwa latar belakang masalah bisa terjawab dalam


(26)

pelaksanaan tugas akhir. Observasi dilakukan untuk mengetahui apakah implementasi yang dilakukan sudah bisa menjawab permasalahan yang ada di Sentra UKM atau belum.

3.1.3 Studi Literatur

Setelah wawancara dan pengamatan secara langsung dilakukan, satu hal yang sangat perlu untuk dilakukan untuk studi literatur. Studi literatur dilakukan untuk mengetahui hal-hal yang berkaitan dengan permasalahan yang ada yaitu mulai dari teori tentang sistem, sistem informasi, bootstrap dan lain-lain. Studi literatur dilakukan dengan mencari buku, jurnal, atau sumber-sumber lain. Informasi penting lainnya yang tidak ada pada saat melakukan wawancara atau observasi dapat terjawab dengan dilakukannya studi literatur ini. Harapan dari dilakukannya Studi literatur yaitu kualitas analisa yang dilakukan sesuai dengan kebutuhan.

3.1.4 System Analysis

Sentra UKM MERR Surabaya adalah sebuah ikon simbolik untuk Usaha Kecil Menengah (UKM) yang dibangun di Surabaya. Sentra UKM MERR Surbaaya dibangun dengan tujuan agar tempat ini dapat menjadi tempat berkunjungnya para konsumen dari seluruh Indonesia, bahkan mancanegara. Sentra UKM MERR Surabaya juga dibangun dengan tujuan membantu para UKM, khususnya UKM yang berada di Surabaya untuk memasarkan dan menjualkan produknya.

Setiap UKM yang boleh memasarkan produk di Sentra UKM dipilih oleh Sentra UKM MERR Surabaya sendiri. Saat ini proses bisnis Sentra UKM masih berjalan secara konvensional dan belum semuanya terkomputerisasi. Sentra UKM


(27)

MERR Surabaya sudah memiliki aplikasi kasir namun, aplikasi yang ada belum terlalu membantu proses bisnis yang ada. Proses pemasaran produk yang dilakukan UKM hanyalah memamerkan barang dagangannya di Sentra UKM MERR Surbaya dan tinggal menunggu pengunjung yang datang ke Sentra UKM MERR Surabaya.

Terkait dengan proses pemasaran, Sentra UKM MERR Surabaya mengalami beberapa kendala dalam pemasaran produk. Kendala ini dapat dilihat dari pengunjung setiap bulan yang kurang lebih hanya 50 orang sehingga, produk yang ada pun tidak semuanya terjual. Pihak Sentra UKM MERR Surabaya pun sepertinya tidak memberikan promosi-promosi yang menarik agar pengunjung tertarik dan datang ke Sentra UKM MERR Surabaya untuk melihat dan membeli produk yang ada.

Untuk mengatasi beberapa masalah yang dihadapi Sentra UKM MERR Surabaya, maka dibuatkan toko online untuk pemasaran produk dan proses penjualan produk sentra UKM. Sentra UKM MERR Surabaya dan UKM yang telah terdaftar dapat melihat dan memantau produk apa saja yang terjual serta Sentra UKM MERR Surabaya tidak perlu lagi mencatat stok di dalam kartu stok lagi. Sentra UKM MERR Surabaya juga dapat memberikan promosi terbaru yang ada di Sentra UKM melalui toko online ini. Diharapkan dengan adanya aplikasi ini komunikasi antara Sentra UKM MERR Surabaya, UKM dan pengunjung dapat lebih mudah serta dapat menambah pembeli tidak hanya dari dalam negeri namun mancanegara. Toko online ini tidak bertujuan untuk mengganti toko konvensional yang telah ada, namun hanya semata untuk membantu proses pemasaran produk UKM.


(28)

Dalam implementasi program/aplikasi toko online Sentra UKM MERR Surabaya diperlukan beberapa perangkat untuk menunjang pembuatan toko online. Beberapa diantaranya adalah :

A. User Requirement

Berisi tentang kebutuhan pengguna untuk mendukung implementasi program/aplikasi. Pengguna untuk Toko Online Sentra UKM MERR Surabaya terdiri dari Administrasi dan Koordinator Sentra UKM. Administrasi terdiri dari dua level yaitu level satu dan dua, sedangkan Koordinator Sentra UKM memiliki level tertinggi yakni level tiga. Administrasi level satu mempunyai wewenang untuk input dan update data master. Administrasi level dua mempunyai wewenang untuk input, update, delete data master serta dapat mengolah data transaksi seperti data konfirmasi pembayaran dan data konfirmasi pengiriman barang. Koordinator Sentra UKM hanya dapat melihat data seperti data master dan data transaksi, pengguna level tiga juga berhak untuk melihat, menyimpan dan mencetak laporan seperti laporan rekap data ukm, rekap data pelanggan, rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris dan laporan penjualan. A.1. Pengelolaan Data Master

Pengelolaan data master ini terdiri dari input data, update data dan hapus data. Pengelolaan data master ini merupakan salah satu proses utama yang dilakukan agar proses transaksi penjualan berjalan dengan lancar. Pengelolaan data master ini meliputi data master ukm, sentra ukm, produk, kategori produk dan jenis barang. Penjelasan user requirement pengelolaan data master dapat dilihat pada Tabel 3.1.


(29)

Tabel 3. 1. User Requirement Pengelolaan Data Master Deskripsi

Fungsi ini digunakan oleh Administrasi untuk mengelola data master yang berupa data ukm, data administrasi sentra ukm, data produk, data kategori produk, dan data jenis barang.

Aktor Administrasi

Input

1. Data ukm 2. Data Produk

3. Data administrasi sentra ukm 4. Data produk

5. Data kategori produk 6. Data jenis barang Proses

1. Input data master 2. Update data master

3. Hapus data master

Output 1. Data master terbaru

2. Data master yang sudah diolah

Peraturan

1. Data yang di masukkan tidak boleh sama.

2. Penghapusan data dapat dilakukan apabila data master yang akan dihapus mempunyai status tidak aktif.

3. Administrasi yang dapat memasukkan dan mengubah data hanya administrasi dengan level satu dan dua.

4. Administrasi yang dapat menghapus data adalah administrasi dengan level dua.

A.2. Pengelolaan Data Transaksi

Pengelolaan data transaksi ini meliputi data penjualan, data konfirmasi pembayaran data konfirmasi pengiriman barang. Pengelolaan data transaksi ini merupakan salah satu proses utama yang dilakukan agar proses transaksi penjualan berjalan dengan lancar. Penjelasan user requirement pengelolaan data transaksi dapat dilihat pada Tabel 3.2.

Tabel 3. 2. User Requirement Pengelolaan Data Transaksi

Deskrpisi Fungsi ini digunakan oleh Administrasi untuk mengelola transaksi yang terdiri dari data transaksi penjualan, data


(30)

konfirmasi pembayaran dan data konfirmasi pengiriman barang.

Aktor Administrasi

Input

1. Data Penjualan

2. Data Konfirmasi Pembayaran 3. Data Konfirmasi Pengiriman barang

Proses

1. Memastikan data yang telah dikirim pelanggan benar adanya.

2. Mengirim e-mail kepada pelanggan terkait dengan data konfirmasi.

3. Mengupdate status data konfirmasi pembayaran dan data konfirmasi pengiriman barang.

4. Menghapus data konfirmasi pembayaran, konfirmasi pengiriman barang dan data penjualan.

Output

1. Data transaksi terbaru

2. E-mail konfirmasi pembayaran dan pengiriman barnag kepada pelanggan.

Peraturan

1. Administrasi yang dapat mengelola data transaksi hanya administrasi level dua.

2. Penghapusan data dapat dilakukan apabila data master yang akan dihapus mempunyai status tidak aktif.

A.3. Pencetakan Laporan

Pencetakan laporan ini meliputi rekap data ukm, rekap data pelanggan, rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris dan laporan penjualan. Pencetakan laporan ini berguna untuk membantu proses evaluasi Sentra UKM MERR Surabaya. Penjelasan user requirement pencetakan laporan dapat dilihat pada Tabel 3.3.

Tabel 3. 3. User Requirement Pencetakan Laporan

Deskripsi Fungsi ini digunakan oleh Koordinator Sentra UKM MERR Surabaya untuk mencetak laporan yang meliputi rekap data ukm, rekap data pelanggan, rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris dan laporan penjualan.

Aktor Koordinator Sentra UKM MERR Surabaya Tabel 3. 3. Lanjutan User Requirement Pencetakan Laporan

Input 1. Tanggal periode

Proses 1. Input data tanggal periode

Output 1. Rekap data ukm 2. Rekap data pelanggan 3. Rekap data produk


(31)

4. Laporan mutasi stok 5. Laporan barang terlaris 6. Laporan ukm terlaris

Peraturan 1. Tanggal periode yang dimasukkan harus tanggal yang valid

2. Hanya Koordinator Sentra UKM MERR Surabaya yang dapat mencetak dan melihat laporan

B. Functional Requirements

Pada Diagram Input Proses Output dijelaskan secara detil data yang dibutuhkan, proses apa saja yang dilakukan hingga keluaran yang dihasilkan. Data ini disesuaikan dengan hasil analisis permasalahan yang sudah dilakukan. Alur proses sistem secara umum, dijelaskan pada Diagram Input Proses Output yang dapat dilihat pada Gambar 3.2


(32)

Gambar 3. 2. Diagram Input Proses Output 3.2 System Design

Setelah analisis permasalahan dan analisa kebutuhan dilakukan, tahap selanjutnya yaitu perancangan sistem dimana pada tahap ini melakukan Desain System Flow Diagram, Data Flow Diagram, dan Entity Relationship Diagram. 3.2.1 System Flow

System Flow (Sysflow) adalah penggambaran alur sistem yang akan diimplementasi kedalam sistem toko online Sentra UKM MERR Surabaya. Seperti yang sudah digambarkan pada diagram berjenjang sebelumnya maka sysflow yang dirancang juga mengikuti diagram berjenjang. Sysflow pada sistem ini terdiri dari


(33)

sysflow mengolah data master (administrasi sentra ukm, ukm, pelanggan, penerima, produk, kategori produk, jenis barang), sysflow mencatat dan mengolah data transaksi (penjualan, konfirmasi pembayaran, konfirmasi pengiriman barang) dan sysflow mencetak laporan (rekap data ukm, rekap data pelanggan, rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris, laporan penjualan).

A. System Flow Mengolah Data Master Administrasi Sentra UKM

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master administrasi Sentra UKM MERR Surabaya mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master administrasi Sentra UKM MERR Surabaya beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel sentra ukm Sysflow mengolah data master administrasi Sentra UKM MERR Surabaya dapat dilihat pada Gambar 3.3.

B. System Flow Mengolah Data Master UKM

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master ukm mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master ukm beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel data_ukm. Sysflow mengolah data master ukm dapat dilihat pada Gambar 3.4.


(34)

(35)

(36)

C. System Flow Mengolah Data Master Pelanggan

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master pelanggan mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master pelanggan beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel pelanggan. Sysflow mengolah data master pelanggan dapat dilihat pada Gambar 3.5.

D. System Flow Mengolah Data Master Penerima

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master penerima mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master penerima beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel penerima. Sysflow mengolah data master penerima dapat dilihat pada Gambar 3.6.

E. System Flow Mengolah Data Master Produk

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master produk mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master produk beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel produk. Sysflow mengolah data master produk dapat dilihat pada Gambar 3.7.


(37)

(38)

(39)

(40)

F. System Flow Mengolah Data Master Kategori Produk

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master kategori produk mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master kategori produk beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel kategori produk. Sysflow mengolah data master kategori produk dapat dilihat pada Gambar 3.8.

G. System Flow Mengolah Data Master Jenis Barang

System Flow (Sysflow) ini menjelaskan tentang alur sistem mengolah data master jenis_barang mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Proses yang terdapat dalam mengelola data master jenis barang beberapa diantaranya adalah input data, update data, ubah status dan delete data dimana semua proses ini disimpan pada tabel jenis_barang. Sysflow mengolah data master jenis barang dapat dilihat pada Gambar 3.9.


(41)

(42)

(43)

H. System Flow Transaksi Penjualan

System Flow (Sysflow) ini menjelaskan tentang alur Transaksi Penjualan mulai dari input data pemesanan yang di lakukan oleh pelanggan, setelah pelanggan memasukkan data pemesanan maka pelanggan akan menerima e-mail yang berisi nota pembelian dan link untuk mengisi konfirmasi pembayaran. Administrasi akan mengecek apakah bukti transfer yang diisi oleh pelanggan benar atau tidak. Apabila terbukti benar maka administrasi akan mengubah status konfirmasi pembayaran menjadi oke dan mengirim e-mail kepada UKM yang bersangkutan bahwa produk UKM tersebut terjual dan link untuk mengisi form konfirmasi pengiriman barang. Sysflow transaksi penjualan dapat dilihat pada Gambar 3.10.

I. System Flow Mencetak Laporan

System Flow (Sysflow) ini menjelaskan tentang alur sistem mencetak laporan mulai dari awal hingga database apa saja yang digunakan pada sysflow ini. Laporan yang akan menjadi output aplikasi ini adalah rekap data ukm, rekap data pelanggan, rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris, dan laporan penjualan. Sysflow mencetak laporan dapat dilihat pada Gambar 3.11.


(44)

(45)

39


(46)

3.2.2 Data Flow Diagram (DFD)

Data Flow Diagram (DFD) menunjukkan aliran data yang ada dalam rancang bangun toko online Sentra UKM MERR Surabaya.

A. Context Diagram

Gambar 3. 12. Context Diagram Toko Online Sentra UKM MERR Surabaya Gambar 3.12 adalah gambaran proses sistem toko online Sentra UKM MERR Surabaya. Context Diagram ini mempunyai empat entitas yaitu Koordinator Sentra UKM, Administrasi dan Pelanggan. Kegiatan yang dilakukan Administrasi adalah mengolah data (input, update, delete) sebagai dasar dari sistem. Selanjutnya, kegiatan yang dilakukan oleh pelanggan adalah melakukan pemesanan barang dengan melakukan input data pemesanan dan berikutnya akan menerima nota pembayaran, setelah pelanggan melakukan pembayaran dan pembayaran itu telah di konfirmasi oleh pihak Sentra UKM maka, pelanggan akan mendapatkan nota pemesanan. Setelah konfirmasi pembayaran sudah dilakukan maka pihak UKM


(47)

akan mengirim barang pesanan dan memasukkan bukti bahwa barang telah dikirim(upload foto nomor resi dan input nomor resi). Entitas selanjutnya adalah koordinator Sentra UKM, yang akan menerima hasil proses sistem berupa laporan seperti yang ada pada Gambar 3.12.

B. Diagram Berjenjang

Sebelum merancang Data Flow Diagram (DFD), terlebih dahulu dibuat diagram berbenjang yang akan memudahkan proses pembuatan Data Flow Diagram. Diagram berjenjang menggambarkan ada tiga proses yang terjadi di dalam sistem toko online Sentra UKM MERR Surabaya yaitu proses mengolah data master, mencatat dan mengolah data transaksi serta mencetak laporan. Diagram berjenjang dapat dilihat pada Gambar 3.13.

Gambar 3. 13. Diagram berjenjang level 0

Diagram berjenjang level 0 ini kemudian akan di bagi lagi menjadi beberapa sub proses dari sub proses utama namun prosesnya masih saling berhubungan satu dengan lainnya. Sub proses yang pertama adalah sub proses Mengolah Data Master, proses yang terjadi diantaranya adalah proses mengolah data master administrasi sentra ukm, ukm, pelanggan, penerima, produk, kategori produk dan jenis barang. Sub proses Mengolah Data Master dapat dilihat pada Gambar 3.14.


(48)

42


(49)

Sub proses kedua adalah proses mencatat dan mengolah data transaksi yang di dalamnya juga terdapat beberapa sub proses seperti mencatat transaksi penjualan, mengolah data konfirmasi pembayaran dan mengolah data konfirmasi pengiriman barang. Proses mencatat dan mengolah data transaksi dapat dilihat pada Gambar 3.15.

Sub proses terakhir adalah proses mencetak laporan, di dalam proses ini terdapat beberapa sub proses yaitu mencetak rekap data ukm, rekap data pelanggan, rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris, dan laporan penjualan. Proses mencetak laporan dapat dilihat pada Gambar 3.16.


(50)

44 Gambar 3. 15. Diagram berjenjang sub proses mencatat dan mengolah data transaksi


(51)

45 Gambar 3. 16. Diagram berjenjang sub proses mencetak laporan


(52)

C. Data Flow Diagram Level 0

Data Flow Diagram (DFD level 0 adalah hasil decompose dari context diagram yang ada pada Gambar 3.12. DFD level 0 memiliki tiga sub proses antara lain mengolah data master, mencatat dan mengolah data transaksi, dan mencetak laporan. DFD level 0 dapat dilihat pada Gambar 3.17.

D. Data Flow Diagram Level 1 Mengolah Data Master

Data Flow Diagram (DFD) level 1 mengolah data master merupakan hasil decompose dari DFD level 0 mengolah data master, di dalam DFD ini terdapat beberapa proses diantaranya adalah mengolah data administrasi sentra ukm, data ukm, data pelanggan, data penerima, data produk, data kategori produk dan data jenis produk. Pada tiap proses dijelaskan secara detil alur data yang terjadi pada Aplikasi Toko Online Sentra UKM MERR Surabaya ini mulai dari data apa saja yang terlibat hingga database apa saja yang digunakan untuk menyimpan data master. DFD level 1 mengolah data master dapat dilihat pada Gambar 3.18.


(53)

(54)

E. Data Flow Diagram Level 1 Mencatat dan Mengolah Data Transaksi

Data Flow Diagram (DFD) level 1 mencatat dan mengolah data transaksi merupakan hasil decompose dari DFD level 0 mencatat dan mengolah data, di dalam DFD ini proses yang terjadi adalah mencatat dan mengolah data transaksi konfirmasi pembayaran, konnfirmasi pengiriman barang dan penjualan. Pada tiap proses dijelaskan secara detil alur data yang terjadi pada Aplikasi Toko Online Sentra UKM MERR Surabaya ini mulai dari data apa saja yang terlibat hingga


(55)

database apa saja yang digunakan untuk menyimpan data transaksi. DFD level 1 mencatat dan mengolah data transaksi dapat dilihat pada Gambar 3.19.

Gambar 3. 19. DFD Level 1 Mengolah Data Transaksi Penjualan F. Data Flow Diagram Level 1 Mencetak Laporan

Data Flow Diagram (DFD) level 1 pembuatan laporan merupakan hasil decompose dari DFD level 0 mencetak laporan, di dalam DFD Level 1 ini, pihak koordinator mendapatkan laporan seperti rekap data ukm, rekap data produk, rekap data pelanggan, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris dan laporan penjualan. DFD level 1 mencetak laporan dapat dilihat pada Gambar 3.20.


(56)

3.2.3 Entitiy Relationship Diagram

Entity Relationship Diagram (ERD) yaitu alat untuk mempresentasikan semua kebutuhan-kebutuhan sistem yang berkaitan dengan field-field yang digunakan berupa tipe dan atribut dari field-field tersebut, serta relationship dari tabel-tabel yang mendukung sistem. ERD ini terdiri dari Conceptual Data Model(CDM) dan Physical Data Model(PDM). PDM ini lah yang berguna sebagai acuan untuk membangun database Aplikasi Toko Online Sentra UKM MERR Surabaya.

A. Conceptual Data Model

Pada Conceptual Data Model (CDM) terdapat beberapa tabel yang masing-masing berisi atribut-atribut yang berfungsi sebagai data pada sistem informasi ini, kemudian diolah menjadi Physical Data Model yang dihasilkan dari proses generate model dari tabel yang terdapat pada CDM. Conceptual Data Model Rancang Bangun Toko Online Sentra UKM MERR Surabaya dapat dilihat pada Gambar 3.21.

B. Physical Data Model

Physical Data Model (PDM) merupakan hasil generate dari Conceptual Data Model (CDM). Tabel PDM ini berikutnya akan di generate ke dalam sql dan akan menjadi tabel database Toko Online Sentra UKM MERR Surabaya. Physical Data Model Toko Online Sentra UKM MERR Surabaya dapat dilihat pada Gambar 3.22.


(57)

51


(58)

52


(59)

3.2.4 Struktur Tabel

Dalam sub bab ini menjelaskan lebih rinci tentang tabel apa saja yang ada di dalam database. Mulai dari atribut apa saja yang ada sampai tipe data atribut tersebut. Struktur tabel database dapat dilihat dalam tabel-tabel dibawah ini: Nama Tabel : Pelanggan

Primary Key : id_pelanggan Foreign Key : id_provinsi, id_kota

Fungsi : Untuk menyimpan data pelanggan.

Tabel 3. 4 Struktur Tabel Pelanggan

Nama_Field Tipe Data Constraint

id_pelanggan Varchar(10) pk

id_provinsi Varchar(10) Fk1

id_kota Varchar(10) Fk2

nama_pelanggan Varchar(150) alamat_pelanggan Varchar(200) Kodepos_pelanggan Varchar(10)

Jenis_kelamin Varchar(20)

email_pelanggan Varchar(100) telp_pelanggan Varchar(12)

tgl_daftar Date

username_pelanggan Varchar(10) password_pelanggan Varchar(10)

confirm Varchar(20)

Poto Varchar(1024)

Status_pelanggan Varchar(20) Nama Tabel : Data_UKM

Primary Key : id_UKM

Foreign Key : id_kota, id_provinsi Fungsi : Untuk menyimpan data UKM


(60)

Tabel 3. 5 Struktur Tabel Data_UKM

Nama_Field Tipe Data Constraint

id_UKM Varchar(10) pk

id_kota Varchar(10) Fk2

id_provinsi Varchar(10) Fk1

nama_UKM Varchar(150)

alamat_UKM Varchar(200)

Kodeposukm Varchar(10)

notelp_UKM Varchar(12)

tanggal_berdiri Date

tanggal_daftar Date

nama_pemilik Varchar(150)

email_pemilik Varchar(100) notelp_pemilik Varchar(12)

logo_UKM Varchar(1024)

Status Varchar(20)

Nama Tabel : Sentra_UKM Primary Key : username Foreign Key : -

Fungsi : Untuk menyimpan data UKM

Tabel 3. 6 Struktur Tabel Sentra_UKM

Nama_Field Tipe Data Constraint

Username Varchar(10) pk

nama_admin Varchar(150)

password Int

level Int

Nama_Field Tipe Data Constraint

Nama Tabel : produk Primary Key : id_produk

Foreign Key : id_kategori, id_UKM, id_jenisbrg Fungsi : Untuk menyimpan data produk

Tabel 3. 7 Struktur Tabel Produk

Nama_Field Tipe Data Constraint

id_produk Varchar(20) pk

id_kategori Varchar(10) Fk1

id_UKM Varchar(10) Fk2

id_jenisbrg Varchar(10) Fk3


(61)

Nama_Field Tipe Data Constraint nama_produk Varchar(150)

harga Float

warna Varchar(50)

ukuran Varchar(50)

stok Int

berat Int

satuan_berat Varchar(50) keterangan Varchar (250)

gambar Varchar(1024)

status_prod Varchar(20)

Nama Tabel : kategori Primary Key : id_kategori Foreign Key : -

Fungsi : Untuk menyimpan data kategori produk

Tabel 3. 8 Struktur Tabel Kategori Produk

Nama_Field Tipe Data Constraint

id_kategori Varchar(10) pk

nama_kategori Varchar(150) status_ketegori Varchar(20) Nama Tabel : penjualan

Primary Key : id_penjualan

Foreign Key : id_konfirmasi, id_provinsi, id_pelanggan, noresi Fungsi : Untuk menyimpan data penjualan

Tabel 3. 9 Struktur Tabel penjualan

Nama_Field Tipe Data Constraint

id_penjualan Varchar(10) Pk

id_konfirmasi Varchar(10) Fk1

id_pelanggan Varchar(10) Fk3

noresi Varchar(10) Fk2

total_bayar Float

tanggal_transaksi Date status_penjualan Varchar(5)


(62)

Primary Key : id_konfirmasi Foreign Key : username

Fungsi : Untuk menyimpan data konfirmasi pembayaran

Tabel 3. 10 Struktur Tabel konfirmasi_pembayaran

Nama_Field Tipe Data Constraint

id_konfirmasi Varchar(10) pk

username Varchar(10) fk

namapemilik_rekening Varchar(150) nomor_rekening Varchar(20)

nama_bank Varchar(25)

tanggal_trf Date

bukti_byr Varchar(1024)

status Varchar(20)

Nama Tabel : detill_penjualan Primary Key : id_detil_penjualan Foreign Key : id_produk, id_penjualan

Fungsi : Untuk menyimpan data detail penjualan

Tabel 3. 11 Struktur Tabel detill_penjualan

Nama_Field Tipe Data Constraint

id_detilpenjualan Varchar(10) pk

id_produk Varchar(10) Fk1

id_penjualan Varchar(10) Fk2

jumlah_barang int

Nama Tabel : konf_pengirimanbarang Primary Key : noresi

Foreign Key : -

Fungsi : Untuk menyimpan data konfirmasi pengiriman barang Tabel 3. 12 Struktur Tabel konf_pengirimanbarang

Nama_Field Tipe Data Constraint

noresi Varchar(16) pk

status_brg Varchar(20)

bukti_resi Varchar(1024)


(63)

Primary Key : id_provinsi Foreign Key : -

Fungsi : untuk menyimpan data provinsi

Tabel 3. 13 Struktur Tabel provinsi

Nama_Field Tipe Data Constraint

id_provinsi Varchar(10) pk

nama_provinsi Varchar(150) Nama Tabel : kota

Primary Key : id_kota Foreign Key : id_provinsi

Fungsi : Untuk menyimpan data kota

Tabel 3. 14 Struktur Tabel Kota

Nama_Field Tipe Data Constraint

id_kota Varchar(10) pk

id_provinsi Varchar(10) fk

nama_kota Varchar(150)

biaya_kirim Float

Nama Tabel : penerima Primary Key : id_penerima

Foreign Key : id_provinsi, id_pelanggan, id_kota Fungsi : Untuk menyimpan data kota

Tabel 3. 15 Struktur Tabel penerima

Nama_Field Tipe Data Constraint

id_penerima Varchar(10) pk

id_provinsi Varchar(10) Fk2

id_pelanggan Varchar(10) Fk1

id_kota Varchar(10) Fk3

nama_penerima Varchar(150) alamat_penerima Varchar(150) kodepospenerima Varchar(10) notelp_penerima Varchar(12) status_penerima Varchar(20)


(64)

Nama Tabel : jenis_barang Primary Key : id_jenisbrg Foreign Key : id_kategori

Fungsi : Untuk menyimpan data penjualans

Tabel 3. 16 Struktur Tabel jenis_barang

Nama_Field Tipe Data Constraint

id_jenisbrg Varchar(10) Pk

id_kategori Varchar(10) Fk

nama_jenisbrg Varchar(150) status_jenisbrg Varchar(20) 3.2.5 Desain Interface

Dalam sub bab ini akan dijelaskan rancangan antar muka front-end dan back-end toko Online Sentra UKM MERR Surabaya beserta penjelasan singkat rancangan antar muka.

A. Rancangan Antar Muka Halaman Utama

Pada halaman utama ini, pelanggan dapat melihat yang dijual pada toko online ini, kategori produk yang ada, harga produk, profil, visi misi Sentra UKM MERR Surabaya, serta dapat masuk login atau mendaftar untuk dapat melakukan transaksi penjualan. Rancangan antar muka halaman utama dapat dilihat pada Gambar 3.24.


(65)

B. Rancangan Antar Muka Halaman Detail Produk

Pada halaman ini pelanggan dapat melihat nama produk, harga, keterangan produk, estimasi biaya kirim, ukm yang menjual produk tersebut beserta data pemiliknya. Rancangan antar muka halaman detail produk dapat dilihat pada Gambar 3.24.

Gambar 3. 24. Rancangan Antar Muka Halaman Detail Produk C. Rancangan Antar Muka Halaman pembayaran

Halaman ini adalah halaman setelah pembeli memilih produk yang ingin dibeli dan melanjutkan ke halaman pembayaran. Pelanggan harus sudah terdaftar menjadi member untuk bisa melanjutkan transaksi pembelian. Rancangan antar muka halaman pembayaran dapat dilihat pada Gambar 3.25.


(66)

Gambar 3. 25. Rancangan Antar Muka Halaman Antar Muka Pembayaran D. Rancangan Antar Muka Halaman Login Pelanggan

Halaman ini adalah halaman login pelanggan, hanya pelanggan yang sudah terdaftar yang dapat login dan melakukan transaksi penjualan. Rancangan antar muka halaman login pelanggan dapat dilihat pada Gambar 3.26.

Gambar 3. 26. Rancangan Antar Muka Halaman Login Pelanggan E. Rancangan Antar Muka Halaman Daftar Pelanggan

Halaman ini adalah halaman daftar pelanggan. Pelanggan yang ingin mendaftar menjadi anggota wajib menginputkan data - data pada form yang telah disediakan. Rancangan antar muka halaman daftar pelanggan dapat dilihat pada Gambar 3.27.


(67)

Gambar 3. 27. Rancangan Antar Muka Halaman Daftar Pelanggan F. Rancangan Antar Muka Halaman Konfirmasi E-mail

Pada halaman ini, pelanggan yang sudah melakukan pendaftaran akan menerima email dan akan melakukan konfirmasi dengan cara mengklik link yang ada pada e-mail tersebut. Rancangan antar muka halaman konfirmasi e-mail dapat dilihat pada Gambar 3.28.


(68)

G. Rancangan Antar Muka Halaman Login Administrasi

Pada halaman ini, administrasi yang sudah terdaftar akan memasukan username dan password yang telah diberikan ke dalam form login. Rancangan antar muka halaman login administrasi dapat dilihat pada Gambar 3.29.

Gambar 3. 29. Rancangan Antar Muka Halaman Login Administrasi H. Rancangan Antar Muka Halaman Utama Administrasi

Halaman ini didapati setelah administrasi login pada halaman sebelumnya yang ada pada Gambar 3.29. Pada halaman ini, admin dapat melihat info seperti jumlah akun yang harus di konfirmasi, jumlah produk yang ada saat ini, jumlah UKM terdaftar, Jumlah data transaksi penjualan, Konfirmasi penjualan yang harus di konfirmasi. Rancangan antar muka halaman utama administrasi dapat dilihat pada Gambar 3.30.


(69)

Gambar 3. 30. Rancangan Antar Muka Halaman Utama Admin I. Rancangan Antar Muka Halaman Master data UKM

Pada halaman ini, admin dapat melihat data ukm yang ada, dapat menambah data ukm, mengubah, mengganti status dan menghapus data ukm yang sudah ada. Rancangan antar muka halaman master data ukm dapat dilihat pada Gambar 3.31 sementara, untuk rancangan antar muka untuk mengubah data UKM dapat dilihat pada Gambar 3.32 dan untuk mengganti status UKM dapat dilihat pada Gambar 3.33 serta untuk menghapus data UKM dapat dilihat pada Gambar 3.34.


(70)

Gambar 3. 32. Rancangan Halaman Ubah Master data UKM


(71)

Gambar 3. 34. Rancangan Antar Muka Halaman Hapus data UKM

J. Rancangan Antar Muka Halaman Master data Administrasi Sentra UKM

Pada halaman ini, admin dapat melihat data ukm yang ada, dapat menambah data admin sentra UKM, mengubah, mengganti status dan menghapus data Admin Sentra UKM yang sudah ada. Rancangan antar muka halaman master data administrasi sentra ukm dapat dilihat pada Gambar 3.35 sementara, untuk rancangan antar muka untuk mengubah data Admin Sentra UKM dapat dilihat pada Gambar 3.36 dan untuk mengganti status Admin Sentra UKM dapat dilihat pada Gambar 3.37 serta untuk menghapus data Admin Sentra UKM dapat dilihat pada Gambar 3.38


(72)

Gambar 3. 35. Rancangan Antar Muka Halaman Master data Admin Sentra UKM


(73)

Gambar 3. 37. Rancangan Antar Muka Halaman Hapus data Admin Sentra UKM K. Rancangan Antar Muka Halaman Master Data Produk UKM

Pada halaman ini, administrasi dapat melihat data produk yang ada, dapat menambah data produk, mengubah, mengganti status dan menghapus data produk yang sudah ada. Rancangan antar muka halaman master data produk ukm dapat dilihat pada Gambar 3.38 sementara, rancangan antar muka untuk mengubah data produk dapat dilihat pada Gambar 3.39 dan untuk mengganti status Produk UKM dapat dilihat pada Gambar 3.40, serta untuk menghapus data Produk UKM dapat dilihat pada Gambar 3.41.


(74)

Gambar 3. 38. Rancangan Antar Muka Halaman Master data Admin Sentra UKM


(75)

Gambar 3. 40. Rancangan Antar Muka Halaman Master Ubah Status data Produk Sentra UKM

Gambar 3. 41. Rancangan Antar Muka Halaman Master Hapus data Produk Sentra UKM

L. Rancangan Antar Muka Halaman Master data Pelanggan

Pada halaman ini, admin dapat melihat data pelanggan yang ada, dapat menambah data pelanggan, mengubah, mengganti status dan menghapus data pelanggan yang sudah ada. Rancangan antar muka halaman master data pelanggan dapat dilihat pada Gambar 3.42 sementara, untuk rancangan antar muka untuk


(76)

mengubah data pelanggan dapat dilihat pada Gambar 3.43 dan untuk mengganti status Pelanggan dapat dilihat pada Gambar 3.44 serta untuk menghapus data Pelanggan dapat dilihat pada Gambar 3.45.

Gambar 3. 42. Rancangan Antar Muka Halaman Master data Pelanggan


(77)

Gambar 3. 44. Rancangan Antar Muka Halaman Master Ubah Status data Pelanggan

Gambar 3. 45. Rancangan Antar Muka Halaman Master Hapus data Pelanggan M. Rancangan Antar Muka Halaman Master Kategori Produk UKM

Pada halaman ini, admin dapat melihat data kategori produk yang ada, dapat menambah data kategori produk, mengubah, dan menghapus data kategori produk yang sudah ada. Rancangan antar muka halaman master kategori produk


(78)

UKM dapat dilihat pada Gambar 3.46 sementara, untuk rancangan antar muka mengubah data kategori produk dapat dilihat pada Gambar 3.47 dan untuk menghapus data Produk UKM dapat dilihat pada Gambar 3.48.

Gambar 3. 46. Rancangan Antar Muka Halaman Master Kategori Produk UKM

Gambar 3. 47. Rancangan Antar Muka Halaman Master Ubah Data Kategori Produk UKM


(79)

Gambar 3. 48. Rancangan Antar Muka Halaman Master Ubah Data Kategori Produk UKM N. Rancangan Antar Muka Halaman Transaksi Penjualan

Pada halaman ini, admin dapat melihat data penjualan yang telah terjadi menurut tanggal yang di pilih. Rancangan antar muka halaman transaksi penjualan dapat dilihat pada Gambar 3.49.


(80)

O. Rancangan Antar Muka Halaman Transaksi - Konfirmasi Pembayaran

Pada halaman ini, admin dapat melihat data pembayaran yang harus di konfirmasi dan mengecek secara manual apakah uang sudah ditransfer atau belum agar proses transaksi pengiriman barang dapat dilakukan. Data Konfirmasi pembayaran dapat dipilih dalam bentuk harian atau bulanan. Rancangan antar muka halaman transaksi konfirmasi pembayaran dapat dilihat pada Gambar 3.50.

Gambar 3. 50. Rancangan Antar Muka Halaman Transaksi – Konfirmasi Pembayaran

P. Rancangan Antar Muka Halaman Transaksi - Konfirmasi Pengiriman Barang

Pada halaman ini, admin dapat melihat data pengiriman barang yang telah terjadi menurut tanggal yang di pilih dan mengecek apakah nomor resi yang di masukkan sudah ada di dalam database jasa pengiriman tersebut atau tidak. Rancangan antar muka halaman transaksi konfirmasi pengiriman barang dapat dilihat pada Gambar 3.51.


(81)

Gambar 3. 51. Rancangan Antar Muka Halaman Transaksi Konfirmasi Pembayaran Q. Rancangan Antar Muka Halaman Laporan - Rekap Data UKM

Pada halaman ini, admin dapat melihat data, menyimpan dan mencetak rekap data UKM yang telah terdaftar. Data yang akan di cetak atau disimpan dapat dipilih mulai dari dan sampai tanggal berapa. Laporan ini berguna untuk mengetahui berapa jumlah UKM yang telah terdaftar dan dapat menyimpan data UKM yang telah terdaftar. Rancangan antar muka halaman laporan rekap data ukm dapat dilihat pada Gambar 3.52 sementara, untuk rancangan antar muka print rekap data UKM dapat dilihat pada Gambar 3.53.


(82)

Gambar 3. 52. Rancangan Antar Muka Halaman Laporan Rekap Data UKM

Gambar 3. 53. Rancangan Antar Muka Halaman Laporan print Rekap Data UKM R. Rancangan Antar Muka Halaman Laporan - Rekap Data Pelanggan

Pada halaman ini, admin dapat melihat data, menyimpan dan mencetak rekap data Pelanggan yang telah terdaftar. Data yang akan di cetak atau disimpan dapat dipilih mulai dari dan sampai tanggal berapa. Laporan ini berguna untuk mengetahui berapa jumlah Pelanggan yang telah terdaftar dan dapat menyimpan data Pelanggan yang telah terdaftar. Rancangan antar muka halaman laporan rekap


(83)

data pelanggan dapat dilihat pada Gambar 3.54 sementara, untuk rancangan antar muka print rekap data UKM dapat dilihat pada Gambar 3.55.

Gambar 3. 54. Rancangan Antar Muka Halaman Laporan Rekap Data Pelanggan

Gambar 3. 55. Rancangan Antar Muka Halaman Laporan print Rekap Data Pelanggan

S. Rancangan Antar Muka Halaman Laporan - Rekap Data Produk Pada halaman ini, admin dapat melihat data, menyimpan dan mencetak rekap data produk UKM yang telah terdaftar. Data yang akan di cetak atau disimpan dapat dipilih mulai dari dan sampai tanggal berapa. Laporan ini berguna untuk mengetahui berapa jumlah produk UKM yang telah terdaftar dan dapat menyimpan


(84)

data produk UKM yang telah terdaftar. Rancangan antar muka halaman laporan rekap data produk dapat dilihat pada Gambar 3.56 sementara, untuk rancangan antar muka print rekap data produk UKM dapat dilihat pada Gambar 3.57.

Gambar 3. 56. Rancangan Antar Muka Halaman Laporan Rekap Data Produk

Gambar 3. 57. Rancangan Antar Muka Halaman Laporan print Rekap Data Produk

T. Rancangan Antar Muka Halaman Laporan Mutasi Stok

Pada halaman ini, admin dapat melihat data, menyimpan dan mencetak laporan mutasi stok. Data yang akan di cetak atau disimpan dapat dipilih mulai dari dan sampai tanggal berapa. Laporan ini berguna untuk mengetahui berapa jumlah


(85)

stok yang masuk dan terjual hari ini dan dapat menyimpan data mutasi stok. Rancangan antar muka halaman laporan mutasi stok dapat dilihat pada Gambar 3.58 sementara, untuk rancangan antar muka print laporan mutasi stok dapat dilihat pada Gambar 3.59.

Gambar 3. 58. Rancangan Antar Muka Halaman Mutasi Stok

Gambar 3. 59. Rancangan Antar Muka Halaman print Laporan Mutasi U. Rancangan Antar Muka Halaman Laporan Barang Terlaris

Gambar 3.60 menunjukkan rancangan antar muka halaman laporan barang terlaris toko online Sentra UKM MERR Surabaya. Pada halaman ini, admin dapat melihat data, menyimpan dan mencetak laporan barang terlaris. Data yang akan di cetak atau disimpan dapat dipilih mulai dari dan sampai tanggal berapa. Laporan


(86)

ini berguna untuk mengetahui barang apa saja yang menjadi barang terlaris serta dapat menyimpan data barang terlaris tersebut. Rancangan antar muka halaman laporan barang terlaris dapat dilihat ada Gambar 3.60 sementara, untuk rancangan antar muka print laporan barang terlaris dapat dilihat pada Gambar 3.61.

Gambar 3. 61. Rancangan Antar Muka Halaman print Laporan Barang Terlaris V. Rancangan Antar Muka Halaman Laporan UKM Terlaris

Pada halaman ini, admin dapat melihat data, menyimpan dan mencetak laporan UKM terlaris. Data yang akan di cetak atau disimpan dapat dipilih mulai dari dan sampai tanggal berapa. Laporan ini berguna untuk mengetahui UKM apa


(87)

saja yang menjadi UKM terlaris serta dapat menyimpan data UKM terlaris tersebut. Rancangan antar muka halaman laporan ukm terlaris dapar dilihat pada Gambar 3.62 sementara, untuk rancangan antar muka print laporan UKM terlaris dapat dilihat pada Gambar 3.63.

Gambar 3. 62. Rancangan Antar Muka Halaman Laporan UKM Terlaris

Gambar 3. 63. Rancangan Antar Muka Halaman print Laporan UKM Terlaris 3.2.6 Implementation

Pada tahap ini, toko online mulai dibangun. Proses coding berjalan dengan menggunakan beberapa tools dan bahasa pemrograman. Bahasa pemrograman yang digunakan dalam studi kasus ini adalah bahasa pemrograman PHP


(88)

3.2.7 Integration and Testing

Pada tahap ini, program sudah berjalan dan selanjutnya yang dilakukan adalah proses pengujian ini di lakukan untuk menemukan kesalahan yang terjadi pada aplikasi ini. Pada studi kasus ini, pengujian yang dilakukan adalah black box testing.

Tabel 3.13. Rencana Pengujian

Object yang diuji Fungsi yang diuji

Pendaftaran Pelanggan Dapat mendaftar menjadi member Toko online Sentra UKM MERR Surabaya

Login Pelanggan Dapat Login

Penjualan Melakukan transaksi penjualan

Menampilkan nota pemesanan

Login Admin Dapat Login

Kelola Data Master Melakukan fungsi CRUD (Create, Read, Update, Delete) pada data UKM Kelola Data Transaksi Dapat mengubah status menjadi “oke”

pada data konfirmasi pembayaran dan konfirmasi pengiriman

Kelola Laporan Menampilkan Rekap Data UKM Menampilkan Rekap Data Pelanggan Menampilkan Rekap Data Produk Laporan Mutasi Stok

Laporan Barang Terlaris Laporan UKM Terlaris Laporan Penjualan A. Desain Uji Coba Pendafataran Pelanggan

Desain ini bertujuan untuk menguji apakah fungsi pendaftaran pelanggan dapat berjalan dengan benar. Desain uji coba pendaftaran pelanggan dapat dilihat pada Tabel 3.14.

Tabel 3. 17. Desain Uji Coba Pendaftaran Pelanggan

Test Case ID Tujuan Input Keterangan

1 Memasukkan data pelanggan ke sistem id_pelanggan,id_provinsi, id_kota,nama_pelanggan, alamat_pelanggan, Jenis_kelamin, email_pelanggan, telp_pelanggan, tgl_daftar, username_pelanggan, Data pelanggan berhasil disimpan dan berhasil mengirimkan e-mail ke pelanggan


(89)

Test Case ID Tujuan Input Keterangan password_pelanggan,

confirm 2 Konfirmasi

e-mail pelanggan

Update table pelanggan, ubah status menjadi ‘yes’

Status pelanggan berhasil di ubah

menjadi ‘yes’ B. Desain Uji Coba Login Pelanggan

Desain ini bertujuan untuk menguji apakah fungsi login dapat berjalan dengan benar. Desain uji coba login pelanggan dapat dilihat pada Tabel 3.15.

Tabel 3. 18. Desain Uji Coba Login Test

Case ID

Tujuan Input Keterangan

3 Login eccr94, 12345

Login berhasil, kembali ke halaman utama sistem dan muncul notifikasi “hello (username)”.

4 Login Gagal eccr94,12345 Muncul alert

login gagal. C. Desain Uji Coba Transaksi Penjualan

Desain ini bertujuan untuk menguji apakah fungsi penjualan dapat berjalan dengan benar. Desain uji coba penjualan dapat dilihat pada Tabel 3.16.

Tabel 3. 19. Desain Uji Coba Transaksi Penjualan Test

Case ID

Tujuan Input Keterangan

5 Input data pesanan

Tas Ayu Tenun Sumbawa, 3 barang

Jumlah cart bertambah 6 Ubah data

pesanan

Mengganti jumlah barang yang akan dibeli menjadi 1 barang

Data total harga penjualan, jumlah barang


(90)

Test Case ID

Tujuan Input Keterangan

7 Hapus data

pesanan Tekan tombol hapus

Data pesanan yang sebelumnya

sudah dipilih terhapus dan data total harga

serta jumlah barang yang ada

di cart juga ikut terhapus.

8

Input data pembelian dan mengirim e-mail kepada pembeli

Nama penerima, alamat penerima, kodepos penerima,

notelp penerima.

Data Pembelian yang diisi oleh

pembeli di masukkan ke dalam tabel penjualan dan mengirim e-mail kepada pembeli yang sudah terdaftar 9 Gagal mengirim

e-mail Muncul alert Gagal mengirim e-mail! Silahkan cek koneksi anda!

10 Konfirmasi Pembayaran

Nama pemilik rekening, nomor rekening, nama bank, bukti

pembayaran(berupa foto) Setelah menerima e-mail, pelanggan akan melakukan pembayaran ke nomor rekening yang sudah di berikan di e-mail

dan berikutnya pelanggan akan melakukan konfirmasi pembayaran dengan cara meng-klik URL yang ada pada e-mail tersebut.


(91)

D. Desain Uji Coba Login Admin

Desain ini bertujuan untuk menguji apakah fungsi login dapat berjalan dengan benar. Desain uji coba login pelanggan dapat dilihat pada Tabel 3.17.

Tabel 3. 20. Desain Uji Coba Login Admin

E. Desain Uji Coba Kelola Data Master

Desain uji coba kelola data Master bertujuan untuk menguji apakah fungsi CRUD (Create, Read, Update, Delete) pada data Master UKM bisa berjalan sesuai yang diharapkan. Desain uji coba ini juga dilakukan pada data Master lainnya (Data Data Master Admin Sentra UKM, Data Produk, Data Kategori Produk, Data Jenis Produk, Data Pelanggan, Data Penerima, Data Kota, Data Provinsi). Desain uji coba data UKM dapat dilihat pada tabel 3.18.

Tabel 3. 21. Desain Uji Coba Kelola Data Master

Test Case ID Tujuan Input Keterangan

13 Menampilkan

data Master UKM

Memilih menu Data UKM

Menampilkan data UKM

14 Input data Master UKM id_UKM, nama_UKM, alamat_UKM, notelp_UKM, tanggal_berdiri, tanggal_daftar, nama_pemilik, email_pemilik, notelp_pemilik, Data UKM berhasil disimpan

dan di tampilkan pada tabel data

ukm Test

Case ID

Tujuan Input Keterangan

11 Login Username, password

Login berhasil, masuk ke halaman utama sistem dan muncul notifikasi “hello (username)”.

12 Login Gagal Username, password Muncul Alert


(92)

Test Case ID Tujuan Input Keterangan logo_UKM,

Status 15 Gagal input data

Master UKM

Muncul Alert Gagal input data,

harus isi semua kolom form.

16 Update data

Master UKM Mengubah nama pemilik menjadi Budi Data Master UKM berhasil diubah dan disimpan pada tabel data ukm dan muncul alert

bahwa data Master UKM berhasil ditambah 17 Gagal update data

Master UKM

Muncul alert gagal update data

Master UKM

18 Ubah status data Master UKM

Mengubah status data Master UKM

Status data UKM berhasil diubah dan muncul alert

bahwa data Master UKM berhasil diubah

19 Hapus data

Master UKM Memilih data yang akan dihapus Data Master UKM berhasil dihapus dan muncul alert bahwa data Master UKM berhasil dihapus 20 Gagal hapus data

Master UKM

Muncul alert gagal Hapus Data

UKM F. Desain uji coba Kelola data Transaksi

Desain uji coba kelola data Transaksi bertujuan untuk menguji apakah fungsi Update pada data Transaksi Konfirmasi Pembayaran bisa berjalan sesuai yang diharapkan. Desain uji coba ini juga dilkakukan pada data Transaksi Lainnya (Konfirmasi Pengiriman Barang) Desain uji coba data Konfirmasi Pembayaran dapat dilihat pada tabel 3.19.


(93)

Tabel 3. 22. Desain Uji Coba Kelola Data Transaksi Test

Case ID

Tujuan Input Output yang

diharapakan

21

Menampilkan data Transaksi –

Konfirmasi Pembayaran

Memilih menu

Konfirmasi Pembayaran

Menampilkan data

Konfirmasi Pembayaran

22

Update status Konfirmasi Pembayaran

Mengubah status yang sebelumnya no menjadi ‘yes’

Data konfirmasi

pembayaran berhasil diupdate dan di tampilkan pada tabel data Konfirmasi Pembayaran

G. Desain Uji Coba Laporan

Desain uji coba laporan bertujuan untuk menguji apakah fungsi Menampilkan Rekap Data UKM dapat berjalan sesuai yang diharapkan. Desain uji coba ini juga dilakukan pada Rekap Data UKM, Rekap Data Pelanggan, Rekap Data Produk, Laporan Mutasi Stok, Laporan Barang Terlaris, Laporan UKM Terlaris dan Laporan Penjualan. Desain uji coba Rekap Data UKM dapat dilihat pada tabel 3.20.

Tabel 3. 23. Desain Uji Coba Rekap Data UKM Test

Case ID

Tujuan Input Keterangan

23 Menampilkan Rekap Data UKM Memilih tanggal,bulan, tahun data UKM yang ingin ditampilkan

Tampilan Rekap Data UKM


(1)

Gambar 4. 83. E-mail data transaksi pembelian yang dikirim kepada pembeli

Gambar 4. 84 Tampilan Halaman Konfirmasi Pembayaran

Gambar 4. 85. Data konfirmasi pembayaran pada database tabel konfirmasi pembayaran


(2)

135

Gambar 4.77. Membuktikan saat tombol beli di klik maka jumlah barang yang ada di cart akan otomatis bertambah, berikutnya adalah mengubah data produk yang akan dibeli menjadi satu barang saja. System akan otomatis mengubah data yang ada pada cart menjadi satu barang seperti yang ada pada Gambar4.79. Selanjutnya, mencoba menghapus data yang sudah dipilih dan terbukti berhasil seperti yang ada pada Gambar 4.80.

Uji coba berikutnya adalah input data ke database penjualan dan mengirim e-mail kepada pembeli yang telah terdaftar dalam toko online Sentra UKM Merr Surabaya, Form pembelian dapat dilihat pada Gambar 4.81. Setelah pembeli mengisi data pembelian dan meng-klik tombol submit maka sistem otomatis menyimpan data pada tabel penjualan dan mengirim e-mail kepada pelanggan. Hasil dari uji coba ini dapat dilihat pada Gambar 4.82. untuk bukti bahwa data penjualan berhasil masuk kedalam database dan Gambar 4.83. untuk e-mail yang dikirim kepada pelanggan. Selanjutnya, uji coba konfirmasi pembayaran, form konfirmasi pembayaran dapat dilihat pada Gambar 4.84 dan bukti bahwa data konfirmasi pembayaran yang diisi oleh pembeli masuk kedalam database terdapat pada Gambar 4.85.

4.4.7 Uji Coba Laporan

Uji coba ini dilakukan untuk melihat menguji apakah fungsi menampilkan laporan berjalan dengan baik atau tidak. Uji coba ini juga telah dilakukan untuk Rekap Data UKM, Rekap Data Pelanggan, Rekap Data Produk, Laporan Mutasi Stok, Laporan Barang Terlaris, Laporan UKM terlaris, Laporan Penjualan. Hasil uji coba Kelola Data Kategori Produk dapat dilihat pada Tabel 4.7.


(3)

Tabel 4. 7 Uji Coba Laporan Test

Case ID Tujuan Input

Output yang

diharapakan Output

19

Menampilkan Rekap Data

UKM

Memilih tanggal,bulan, tahun data UKM yang ingin ditampilkan (2016-06-06 sampai 2016-06-29)

Tampilan Rekap Data UKM

Pada Gambar

4.86

Gambar 4. 86 Pdf Rekap Data UKM

4.5 Hasil Respon Pengguna

Hasil respon pengguna didapatkan dengan cara memberikan kuesioner kepada lima orang pengguna yang ada di Sentra UKM MERR Surabaya. Perhitungan hasil kuesioner tersebut menggunakan landasan skala likert tentang pendapat atau persepsi seseorang yaitu sangat baik dengan bobot empat, baik dengan bobot tiga, buruk dengan bobot dua dan sangat buruk dengan bobot satu. Perhitungan hasil kuesioner dapat dilihat pada Tabel 4.8.


(4)

137

Tabel 4. 8. Perhitungan Hasil Kuesioner No. Pernyataan

Bobot Total

Respond en

1 2 3 4

1. Tampilan Website Menarik. 0 0 2 3 5

2. Login berhasil sesuai dengan

password masing-masing. 0 0 1 4 5

3. Website User Friendly. 0 0 3 2 5

4. Fungsi berjalan dengan baik. 0 0 1 4 5 5. Notifikasi berjalan dengan

baik. 0 0 2 3 5

6. Berhasil mengirim e-mail ke

pengguna. 0 0 1 4 5

7.

Hanya memerlukan waktu yang singkat untuk

memproses data.

0 0 2 3 5

8. Data yang diberikan sesuai

harapan. 0 0 1 4 5

Jumlah Bobot 0 0 13 27 40

Prosentase 0% 0% 32,5% 67,5% 100%

Berdasarkan hasil pada Tabel 4.8 dapat dilihat bahwa jumlah bobot yang menjawab sangat baik untuk keseluruhan pernyataan berjumlah 27 (67,5%), sedangkan jumlah bobot yang menjawab baik untuk keseluruhan pernyataan berjumlah 13 (32, 5 %). Tidak ada responden yang menjawab sangat buruk (0%) dan buruk (0%). Pengguna aplikasi Toko Online yang akan diimplementasi ini puas terhadap hasil aplikasi yang telah dibangun. Dengan demikian Toko Online layak diimplementasi dan digunakan oleh pihak Sentra UKM MERR Surabaya agar dapat membantu permasalahan yang ada saat ini.


(5)

138 PENUTUP

5.1 Kesimpulan

Kesimpulan yang dapat ditarik dari Tugas Akhir Rancang Bangun Toko Online Sentra UKM MERR Surabaya adalah :

1. Berhasil merancang dan membangun Toko Online Sentra UKM MERR Surabaya yang dapat mengelola data transaksi penjualan secara online, mencatat stok produk serta menghasilkan laporan beberapa diantaranya adalah rekap data ukm, rekap data pelanggan , rekap data produk, laporan mutasi stok, laporan barang terlaris, laporan ukm terlaris dan laporan penjualan.

2. Toko online Sentra UKM MERR Surabaya layak diimplementasikan karena, berdasarkan hasil evaluasi pengguna diperoleh nilai 67,5% menyatakan sangat baik dan 32,5% menyatakan baik serta tidak ada pengguna yang menilai aplikasi ini dengan nilai buruk atau sangat buruk.

5.2 Saran

Saran yang dapat diberikan untuk pengembangan toko online Sentra UKM MERR Surabaya ini adalah :

1. Dalam memperbaiki toko online Sentra UKM MERR Surabaya diharapkan kedepannya untuk mengintegrasikan dengan sistem penyedia jasa kirim. 2. Memperluas pasar dengan cara menyediakan tampilan toko online berbahasa


(6)

DAFTAR PUSTAKA

Abdurrachman. (2001). Sistem Informasi Akuntansi. Jakarta: Salemba Empat.

Ferdinandus, S. d. (2011). Perancangan Aplikasi Surat Masuk dan Surat Keluar pada PT. PLN (Persero) Wilayah Suluttenggo. e-Journal Teknik Elektro dan Komputer Unsrat.

Herlambang, Soendoro dan Tanuwijaya, Haryanto. (2005). Sistem Informasi; Konsep, Teknologi,dan Manajemen. Yogyakarta: Graha Ilmu.

Jogiyanto. (2005). Analisis dan Desain Sistem Informasi, Edisi III. Yogyakarta: Andi Yogyakarta. Kendall, K., & Kendall, J. (2003). Analisis dan Perancangan Sistem Jilid 1. Jakarta: Prenhallindo. Kristanto, A. (2003). Perancangan Sistem Informasi dan Aplikasinya. Yogyakarta: Gava Media. Kristanto, H. (2004). Analisis dan Perancangan Sistem Informasi. Jakarta: Gramedia Utama. Mujiyana, I. E. (2013). Analisis Faktor - Faktor yang Mempengaruhi Keputusan Pengguna Via

Internet. 5382-11797-1-SM.

Oktavian, D. P. (2010). Menjadi Programmer Jempolan dengan Menggunakan PHP. Yogyakarta: Mediakom.

Pressman, R. (2015). Softeware Engineering A Practitioner's Approach Seventh Edition. Yogyakarta: Andi.

Riduwan, D. M. (2012). Skala Pengukuran Variabel-variabel Penelitian. Bandung: Alfabeta. Romeo. (2003). Testing dan Implementasi Sistem Edisi Pertama. Surabaya: STIKOM.

Shelly, G. d. (2010). Discovering Computer 2010: Living in a Digital World, complete. Boston: Course Technology.

Simarmata, J. (2010. ). Rekayasa Perangkat Lunak. Yogyakarta: Andi Offset.

Sukoco, B. M. (2007). Manajemen Administrasi Perkantoran Modern. Surabaya: Erlangga. Utdirartatmo, F. (2002). Mengelola Database Server MySQL di Linux dan Windows. Yogyakarta:

Andi.

Web Desain. (2015). Beberapa Elemen Penting Dalam Desain web Responsive. Retrieved from Web Desain: (http://www.tutorial-webdesign.com/elemen-penting-dalam-desain-web-responsive/ diakses 2 Januari 2016)