Dengan Penerapan Teknologi Responsive Web Design

Perancangan Sistem Lelang Ikan Cupang Online Berbasis Web

Dengan Penerapan Teknologi Responsive Web Design

Artikel Ilmiah

Diajukan kepada

Fakultas Teknologi Informasi

Untuk memperoleh Gelar Sarjana Komputer

Peneliti:

R. Jodi Anjasmara (672013193)

Hindriyanto Dwi Purnomo, ST., MIT., Ph.D.

Program Studi Teknik Informatika


Universitas Kristen Satya Wacana

Salatiga

2019

Perancangan Sistem Lelang Ikan Cupang Online Berbasis Web dengan

Penerapan Teknologi Responsive Web

R. Jodi Anjasmara[1], Hindriyanto Dwi Purnomo[2]


Universitas Kristen Satya Wacana

Jalan Diponegoro 52-60, Salatiga, 50711

E-Mail: [email protected][1], [email protected][2]

Abstrak

Pada zaman modern saat ini, berbelanja secara online menjadi hal yang biasa dilakukan di

tengah masyarakat. Kemudahan, hemat waktu dan biaya dalam bertransaksi online menjadi alasan

banyak masyarakat dalam berbelanja secara virtual. Sistem jual-beli barang secara online beragam

jenis, mulai dari metode direct buy melalui media E-Commerce hingga sistem lelang. Sistem lelang

yang digunakan pada lingkup penjual ikan cupang secara online menggunakan lintas platform yang

bukan dibuat dengan tujuan spesifik untuk layanan transaksi lelang. Oleh karena itu, perlu diciptakan

sebuah platform yang secara khusus dikembangkan untuk mendukung proses jual-beli online dengan

sistem lelang khusus untuk jual-beli ikan cupang. Dengan mengangkat contoh permasalahan yang

dialami oleh Betta Fish Salatiga, dikembangkan sebuah website sebagai media lelang virtual untuk

membantu baik penjual maupun pelanggan yang sedang melakukan proses lelang. Sistem Lelang Ikan

Cupang Online dapat dirancang dengan berbasis web, menggunakan bahasa pemrograman PHP, CSS,

dan Bootstrap untuk penerapan teknologi Responsive Web Design (RWD). Dari hasil pengujian

aplikasi, didapatkan bahwa Sistem Lelang Ikan Cupang Online dapat menyelesaikan permasalahan dan

kebutuhan yang selama ini didapati oleh penjual dan pembeli ikan cupang online di Indonesia.

Kata kunci: belanja online, sistem lelang, ikan cupang, responsive web

1Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya

Wacana

2Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana

Abstract

In this modern era, online shopping is a common thing to do in the community. Convenience,

saving time and money in online transactions are the reasons for many people to shop virtually. Online

trading system has various types, starting from the direct buy method through E-Commerce media up

to the auction system. The auction system that is used in the scope of online betta fish sellers uses cross

platform that is not made with a specific purpose for auction transaction services. Therefore, it is

necessary to create a platform specifically developed to support the online buying and selling process

with a special auction system for betta fish sale and purchase. By raising an example of the problems

experienced by Betta Fish Salatiga, a website was developed as a virtual auction media to help both

sellers and customers who are conducting the auction process. Betta Fish Auction System Online can

be designed with web-based, using PHP, CSS, and Bootstrap programming languages for the

application of Responsive Web Design (RWD) technology. From the results of testing the application,

it was found that Betta Fish Online Auction System can solve problems and needs that have been found

by sellers and buyers of online betta fish in Indonesia.

Keywords: belanja online, sistem lelang, ikan cupang, responsive web

1. Pendahuluan

Dalam era modern saat ini, pola berdagang maupun bertransaksi semakin maju

seiring dengan perkembangan zaman dan kemajuan teknologi. Kini penggunaan

internet dan fasilitas World Wide Web sudah dikenal hampir di seluruh lapisan

masyarakat dunia. Di Indonesia sendiri, pengguna media internet pada tahun 2018

sebanyak ±123.000.000 (seratus dua puluh tiga juta) pengguna. Dan penggunaan

internet secara global di seluruh dunia adalah sebanyak 3,6 miliar pengguna. [1] Hal

tersebut yang menjadi cikal bakal munculnya proses kegiatan jual-beli secara

elektronik. Sistem jual-beli tersebut juga beragam jenisnya mulai dari yang bersifat

pembelian dengan metode direct buy, melalui media E-Commerce yang menggunakan

perantara pihak ketiga (Bukalapak, Tokopedia, Shopee) [2], juga yang menggunakan

sistem lelang dalam proses jual-beli barang. Sistem lelang ini sendiri cukup digemari

dan digunakan pada lingkup penjual ikan cupang secara online. Proses lelang itu

sendiri digunakan secara lintas platform seperti Instagram, Facebook, dan What’s

App Messenger. Lelang tersebut dilakukan secara terbatas, menggunakan fungsi yang

disediakan oleh platform tersebut. Melakukan proses lelang menggunakan platform

yang dibuat dengan tujuan yang tidak spesifik untuk menyediakan layanan transaksi

lelang, bagi sebagian orang bersifat memudahkan, namun juga terkadang menjadi

sulit untuk dilakukan proses manajemennya.

Pada zaman modern saat ini, waktu menjadi terbatas bagi sebagian orang.

Proses digitalisasi merupakan salah satu cara untuk mengefisiensikan waktu dari

pengguna, dan mempermudah proses jual-beli suatu barang / jasa, sehingga waktu

yang dimiliki oleh penggunanya dapat digunakan dengan lebih optimal. [3] Kini

hampir semua proses kegiatan berbasiskan digital mulai dari surat kabar, televisi,

hingga layanan masyarakat oleh pemerintah. Peran teknologi sangat berpengaruh

pada proses jual-beli dan distribusi. Pola ekonomi yang sebelumnya dibatasi oleh

ruang dan waktu, kini menjadi pola ekonomi yang tidak terbatas. [4]

Transaksi online diciptakan untuk memberikan transaksi bisnis yang lebih

praktis dengan tanpa kertas (paperless) dan tidak perlu bertemu secara langsung untuk

melakukan transaksi, sehingga dapat menjadi penggerak ekonomi baru di bidang

teknologi. Apalagi kita sudah mempunyai UU Nomor 11 Tahun 2008 tentang

Informasi Dan Transaksi. Isi dari peraturan tersebut menerangkan bahwa pemanfaatan

Teknologi Informasi berperan penting dalam perdagangan dan pertumbuhan

perekonomian untuk mewujudkan kesejahteraan masyarakat. Disamping itu UU ITE

ini selalu dihubungkan juga dengan UU Nomor 8 Tahun 2008 tentang Perlindungan.

Pada ketentuan menimbang dari UU Konsumen menyebutkan bahwa untuk

meningkatkan harkat dan martabat konsemun perlu meningkatkan kesadaran,

pengetahuan, kepedulian, kemampuan dan kemandirian konsumen untuk melindungi

dirinya serta menumbuhkembangkan sikap perilaku usaha yang bertanggung jawab.

[5]

Media lelang yang saat ini digunakan oleh penjual dan pembeli, sejatinya

diciptakan untuk media berkomunikasi dan bersosialisasi secara virtual, bukan secara

khusus dikembangkan untuk menunjang proses lelang. Namun, fitur yang diberikan

dapat digunakan untuk melakukan proses jual-beli online secara terbatas. [6] Maka

dari itu, ada beberapa batasan yang kerap ditemui oleh penjual dan pembeli dalam

menggunakan media online tersebut dalam bertransaksi. Masalah yang kerap ditemui

oleh pembeli seperti, tidak adanya notifikasi saat proses lelang akan berakhir, buyer

seringkali lupa sedang menaruh bid (harga penawaran lelang) pada lelang yang sudah

selesai dan dimenangkan oleh pembeli lain, kurangnya informasi terkait bid terakhir

yang sedang dipasang, hingga penipuan oleh penjual fiktif. Sedangkan bagi penjual

sering ditemui masalah seperti, bid and run oleh pemenang lelang, kesalahan dalam

menentukan pemenang lelang, hingga penipuan oleh pembeli. [7]

Oleh karena itu, perlu diciptakan sebuah platform yang secara khusus

dikembangkan untuk mendukung proses jual-beli online dengan sistem lelang yang

khusus diciptakan untuk jual-beli ikan cupang. Platform tersebut diharapkan dapat

menurukan resiko yang kerap ditemui oleh penjual dan pembeli saat ini, juga

memberikan jaminan kemanan dan kenyamanan bertransaksi lelang secara online.

Diharapkan juga dapat terbentuk side effect bagi penjual dengan dapat membuat

etalase secara online, sehingga platform tersebut dapat juga bekerja sebagai media

promosi bagi penjual.

Ikan cupang merupakan ikan yang banyak ditemui di negara pada bagian Asia

Tenggara seperti Indonesia, Thailand, Malaysia, Vietnam, Kamboja, dan Brunei. [8]

Sedangkan, pangsa pasar dari peminat ikan cupang justru tersebar hingga ke benua

Australia, Eropa, dan Amerika. Oleh karena itu, peluang pasar internasional dari

penjualan ikan cupang cukup besar, sedangkan proses transaksi yang berjalan masih

terbatas ruang dan waktu. [9] Maka diperlukan sebuah sistem agar peluang pasar

internasional ini dapat dimanfaatkan dengan baik dan optimal.

Betta Fish Salatiga merupakan sebuah toko jual-beli ikan hias cupang hasil

dari peternakan dan pengembang biakan ikan cupang milik pribadi. Betta Fish

Salatiga memiliki peternakan yang terletak di Salatiga, dengan kapasitas berskala

kecil-menengah. Peternakan ini baru berjalan selama 6 bulan, dengan 2 (dua) pusat

peternakan yang terbagi menjadi 2 (dua) jenis biakan ikan yang berbeda konsentrasi.

Peternakan pertama fokus kepada pengembang biakan ikan cupang berjenis

Halfmoon, Crowntail, King Rosetail, dan plakat. Sedangkan untuk peternakan kedua,

berfokus pada ikan cupang yang berjenis Galaxy Koi Multicolor, Hellboy, Blue Rim,

Gold Rim, dan Avatar.

Betta Fish Salatiga memiliki konsumen yang berasal dari berbagai kota di

Indonesia. Namun, sebagian besar pembeli berasal dari pulau Jawa. Untuk pulau di

luar pulau Jawa antara lain, Sumatera, Bali, Lombok, dan Kalimantan. Beberapa

pembeli lain juga datang dari luar negeri, hingga ke luar benua. Proses jual-beli yang

dilakukan oleh toko tersebut untuk sementara ini adalah melalui media sosial seperti

Instagram dan Facebook. Proses jual-beli yang dilakukan oleh penjual dapat

bertransaksi secara langsung dengan harga pas (fixed price), namun toko tersebut

justru lebih sering untuk melakukan proses jual-beli ikan dengan menggunakan

metode lelang. Dengan metode tersebut, terbukti lebih banyak konsumen yang tertarik

untuk melakukan transaksi dengan Betta Fish Salatiga, alasannya adalah harga jual

yang didapat bisa lebih murah dari harga jual asli menggunakan harga pas.

Dari latar belakang tersebut, perlu untuk membangun sebuah sistem lelang ikan

cupang secara online, dengan menggunakan website sebagai media lelang virtual.

Website ini diharapkan dapat mendorong proses lelang agar lebih maksimal, dan

meningkatkan penjualan ikan dari Betta Fish Salatiga. Website ini bertujuan untuk

membantu pelanggan yang sedang melakukan lelang, agar dapat terus memantau

jalannya proses lelang, dan tidak ketinggalan informasi terkait lelang tersebut. Selain

itu, website ini juga dapat menjadi etalase online, yang dapat menjadi media promosi,

dan menarik minat pembeli secara lebih luas.

2. Tinjauan Pustaka

Undang-undang No. 19, Tahun 2000 Pasal 1, dijelaskan bahwa pengertian

lelang adalah penjualan barang atau jasa di muka umum yang penawarannya

dilakukan secara lisan atau tertulis melalui usaha pengumpulan peminat atau calon

pembeli. [10] Prof. Polderman (1913), menyatakan bahwa lelang adalah alat untuk

mengadakan perjanjian atau persetujuan yang menguntungkan bagi si penjual dengan

cara menghimpun para peminat. [11] Lalu menurut Mr. M.T. G. Maulenberg, seorang

ahli lelang negeri Belanda dari Department Of Marketing and Agricultural Market

Research, University of Wageningen, lelang adalah media perantara antara pembeli

dan penjual. Tujuan utama dari lelang adalah untuk pencarian harga terbaik. [12]

Peniliti pada Sistem Lelang Online Melalui iPasar Kayu Jati Perum Perhutani

Ditinjau Dari Asas Lelang Yang Berlaku Di Indonesia, menjelaskan dengan cukup

detail terkait struktur dan dasar hukum dari proses lelang konvensional secara umum.

Kemudian penulis melakukan digitalisasi proses lelang pada Perum Perhutani sesuai

dengan aturan yang berlaku dari Perhutani, termasuk proses digitalisasi birokrasi, dsb.

Sebelum dilakukan proses digitalisasi lelang pada perusahaan tersebut, kapasitas

peserta lelang hanya terbatas pada perserta lokal, dengan ruang lingkup hanya di

sekitar perusahaan berada. [13]

Kemudian pada jurnal yang berjudul Sistem Informasi Lelang Online

Kendaraan Salvage Berbasis Web Dengan Fitur SMS Gateway Pada Balai Lelang

Astria Palembang, proses lelang dilakukan secara online dengan menggunakan

website sebagai user interface dalam melakukan proses lelang. Proses lelang diawali

oleh admin yang merupakan pegawai perusahaan dengan membuat thread yang dapat

diakses oleh peserta lelang. Kemudian peserta lelang dapat meletakkan bid sesuai

peraturan yang dibuat oleh admin. SMS gateway digunakan untuk mengirimkan

informasi kepada bidder terkait pemberitahuan pendaftaran lot untuk mengikuti

lelang, pemenang lelang, hingga ke proses pengambilan kendaraan hasil lelang bagi

pemenang. [14]

Perbedaan riset ini dengan riset sebelumnya adalah pada bagian obyek yang

diteliti yaitu ikan cupang – yang saat ini sedang populer dan diminati oleh banyak

orang baik dari dalam maupun luar negeri. Selain itu, sistem yang digunakan pada

riset ini lebih terbuka untuk umum (bukan hanya terbatas pada pihak internal)

sehingga jangkauan sistemnya lebih luas. Riset ini berangkat dari ide peneliti yang

orisinil karena sebelumnya belum ada pengembangan sistem lelang ikan cupang

online berbasis website.

3. Metode Penelitian

Penelitian ini dilakukan dan diselesaikan melalui 8 tahapan penelitian yaitu: 1)

Analisis permasalahan. 2) Pengumpulan literatur. 3) Perumusan masalah. 4)

Metodologi desain. 5) Pengumpulan data. 6) Analisa data. 7) Hasil penelitian. 8)

Refine hipotesis. [15] Tahapan dalam penelitian ini dapat dilihat pada gambar 1.

Gambar 1 Tahapan Penelitian

Berdasarkan bagan pada Gambar 1, dapat dijelaskan bahwa tahapan penelitian

yang dilakukan adalah sebagai berikut:

Tahap pertama, yaitu melakukan analisis permasalahan. Tahap ini merupakan

tahap dimana pengembang aplikasi mencari informasi terkait apa saja permasalahan

yang kerap dihadapi oleh Betta Fish Salatiga yang berkaitan dengan proses

pembuatan sistem kedepannya. Cara untuk memperoleh informasi adalah dengan

melakukan obervasi permasalahan, serta kebutuhan yang terkait dengan proses jual-

beli yang telah dilakukan sampai saat ini. Dari hasil observasi tersebut, ditemukan

bahwa pelanggan dari Betta Fish Salatiga kerap kali mengeluhkan tentang

terlambatnya informasi bid yang terakhir dipasang. Sebagian pelanggan juga

mengeluhkan bahwa mereka kerap kali lupa dengan proses lelang yang sedang

Analisis Permasalahan

Pengumpulan literatur

Perumusan masalah

Metodologi desain

Pengumpulan data

Analisa data

Hasil penelitian

Refine hipotesis

mereka ikuti saat itu. Hal itu dikarenakan kurangnya informasi yang mereka dapatkan

sebagai pengingat tentang lelang yang sedang mereka ikuti. Beberapa juga

mengatakan bahwa mereka beberapa kali tidak dapat mengikuti lelang ikan yang

menurut mereka bagus untuk diikuti proses lelangnya. Mereka baru mendapat

informasi terkait lelang tersebut saat mereka membuka timeline di Instagram,

Facebook, atau saat mereka membuka akun sosial media dari Betta Fish Salatiga.

Sangat disayangkan mereka tidak dapat mengikuti lelang tersebut karena tenggat

waktu telah habis, padahal mereka tertarik untuk membeli ikan tersebut.

Tahap kedua, yaitu proses pengumpulan literatur. Pada tahap ini, peneliti akan

mencari sumber ide yang berasal dari literatur seperti buku, artikel, majalah, jurnal,

dan lain-lain. Dengan mengumpulkan literatur tersebut, tujuannya adalah untuk

mendapatkan landasan teori mengenai masalah yang akan diteliti. Literatur tersebut

dapat berupa berbagai teori, teknik, dan metode dalam mengembangkan aplikasi yang

dibuat.

Tahap ketiga, yaitu proses perumusan masalah. Dari masalah-masalah yang

telah didapatkan pada awal penelitian, kemudian dilakukan spesifikasi pada setiap

permasalahan yang ditemui. Spesifikasi masalah dilakukan mulai dari masalah yang

bersifat umum, hingga ke masalah yang bersifat spesifik. Setelah mendapat berbagai

statement terkait permasalah yang dialami secara spesifik, kemudian akan dapat

dibuat uraian untuk menjawab masalah tersebut.

Pada tahap keempat, dibuat desain penelitiannya. Desain yang dibuat dapat

berisikan metode, algoritma, pengetahuan, sistem, dan lain sebagainya. Langkah-

langkah yang dibuat pada tahap ini bertujuan untuk memetakan cara untuk

memecahkan masalah yang telah ditetapkan sebelumnya. Pada tahap ini juga akan

ditentukan mengenai pihak yang akan diwawancara terkait dengan pengembangan

sistem.

Tahap kelima, merupakan tahap pengumpulan data dari berbagai sumber. Data

yang dikumpulkan dapat bersifat kualitatif dan kuantitatif. Kemudian dilakukan

penggabungan data agar dapat diperoleh informasi yang dibutuhkan secara garis

besar.

Tahap keenam, merupakan tahap analisa data dari data yang telah

dikumpulkan pada tahap sebelumnya. Pada tahap ini data yang ada akan dilakukan

penelitian terkait dengan kasus dan masalah yang akan diselesaikan. Selain itu, tahap

ini dilakukan untuk interpretasi data yang telah dianalisa. Data akhir yang dimiliki

akan dibandingkan dengan data sebelum dilakukan penelitian.

Tahap ketujuh, merupakan tahap penyampaian hasil penelitian. Interpretasi

yang disampaikan berdasarkan hasil pengolahan dan pengamatan data secara

subyektif, dan dengan penerapan sistem secara real agar dapat dilakukan pengamatan

jangka panjang terkait kebutuhan sistem di masa yang akan datang, dan hambatan

baru yang mungkin ditemui kedepannya.

Tahap kedelapan, merupakan tahap akhir berupa penyampaian kesimpulan

terkait penelitian dan perancangan sistem yang dibuat berdasarkan penelitian yang

dilakukan pada tahapan sebelumnya.

Batasan masalah dalam penelitian ini yaitu: 1) Sistem dirancang dan

diterapkan dengan berbasis web secara online, karena selama ini proses lelang yang

dilakukan masih bersifat manual melalui media sosial Instagram dan Facebook. 2)

Fitur yang tersedia adalah dengan memberikan notifikasi jika ada customer yang

melakukan bid baru, menampilkan bid terakhir, dan mengingatkan kepada customer

jika waktu proses lelang sudah mendekati batas waktu akhir.

Perancangan Arsitektur

INTERNET

HALAMANWEBHTTP/HTTPS

ADMINISTRATOR USER

HTTP/HTTPS

SERVER

DATABASE

SERVERFTP

Gambar 2 Perancangan Arsitektur Website

Pada Gambar 2 merupakan gambar perancangan Arsitektur Website untuk

proses lelang yang dilakukan secara online. Dengan arsitektur tersebut, diharapkan

proses lelang dapat dilakukan secara real-time, dan dilakukan dimana saja oleh

seluruh user yang terdaftar.

Pada Gambar 3 merupakan gambar yang menunjukkan Arsitektur Aplikasi

untuk proses lelang online dari segi admin, pemrosesan, dan user.

Use Case Diagram

ProfilUser

SaldoUser

MembuatUserBaru

MemperbaruiProfilUser

MenghapusUser

MelihatProfilUser

MengurangiSaldo

MenambahSaldo

MencairkanSaldoKepadaUser

MengunciLelang

MenghapusLelang

MembukaLelangYangDikunci

Lelang

MembuatLelangBaru

MemasangHargaPenawaranBaru

PermohonanMengunciLelang

MemberikanNotifikasi

ADMIN

USER

MendaftarSebagaiUserBaru

USER

Gambar 4 Use Case Diagram

Gambar 4 merupakan use case diagram proses bisnis dari sistem yang berjalan

pada website lelang online. Sistem ini memiliki 2 (dua) privilege yaitu bagian admin,

dan user. Pada bagian admin, privilege yang diberikan hampir mencakup seluruh

pengendalian system environment yang berjalan mulai dari akses pembuatan user

baru, proses top up saldo user, hingga ke proses lelang online. Namun, admin tidak

diperbolehkan untuk membuka thread lelang. Hal tersebut untuk menghindari

monopoli bisnis, sehingga menyebabkan environment menjadi tidak fair. Admin

hanya berfungsi sebagai ‘wasit’ dalam sistem lelang tersebut.

Pada bagian user, privilege yang diberikan juga merupakan privilege umum

seperti update profile, request untuk top up saldo, request untuk membuka thread

lelang baru, dll. Selain itu, user juga diberikan kesempatan untuk membuka lelang,

dan mengikuti lelang yang dibuat oleh user lain dengan syarat saldo yang dimiliki

adalah minimum sebesar open bid yang dibuka oleh thread starter yang kemudian

kekurangannya akan dilunasi dan ikan hasil lelang dikirim penjual.

Class Diagram

Class diagram merupakan penjelasan yang dapat menjabarkan konektivitas

antar relasi yang terbentuk pada bagian database. Class diagram memberikan

gambaran terkait struktur dan deskripsi class, package, dan object beserta

keterkaitannya satu sama lain.

Gambar 5 Class Diagram

Activity Diagram

Activity diagram menggambarkan aliran kontrol dari satu aktivitas ke aktivitas

lain. Activity diagram juga menampilkan decision yang dapat terjadi dalam sistem,

dan menampilkan bagaimana keputusan tersebut berakhir.

start

register Menerimainputanproses Menampilkanhalamanregistrasi

MemasukkanData

loginMenampilkanhalaman

loginMemasukkanData

Menampilkanhalamanmenu

MelihatMenu

MemilihMenu

“UserProfile” Melihat/mengubahprofiluser

login

register

Apakahdatasesuai? Tidak

Ya

Apakahdata

sesuai?Tidak

Ya

Menyimpankedatabase

“ViewAuctionThreads” Menampilkan

halamandaftarlelangMelihatdaftardanmemilih

lelang Apakahsaldocukup? MengubahBid

TidakYa

“Viewbidongoing”

Menampilkanhalamandaftarlelangyangdiikuti

Melihatdaftardanmemilihlelang

Memasukkanbidbaru

Apakahsaldocukup?

Ya

Tidak

“AddNewAuction”

Membuatlelangbaru

Ya

Apakahdatasesuai?

Tidak

start

login

MelihatMenu

MemilihMenu

“ViewTransactionHistory”

Menampilkandaftarlelangyangdibuat

Melihatdaftardanmemilih

lelang

Apakahlewatbataswaktulelang? Ya

Permohonanpencairansaldo

Tidak

“UserProfile”CRUDprofiluser

“ViewAuctions”Menampilkanhalamandaftar

lelang

Melihat/HapusLelang

“Inbox”

logout

end

logout

end

Apakahadapembeli“BuyNow”?

Tidak

Permohonanpenguncianlelang

Permohonanpenguncianlelang?

PenguncianLelang

Ya

TidakMengirimnotifikasi

Gambar 6 Activity Diagram

Pada gambar 6 tersaji proses pada aplikasi secara keseluruhan mencakup dari

pihak user, sistem yang mengolah secara online berbasis website, juga dari

administrator yang mengontrol proses berjalan pada lelang ikan cupang online.

MenuAdmin

RegisterNewMember

AddNewMember

ViewAuction AuctionListsMengunci/

MembukaKunciLelang

ViewMemberLists MemberLists

MemperbaruiDataUser

MenghapusUser

ViewTransactionHistory

MemberListsMenampilkanhistorytransaksi

user

User/MemberMenu

BidNow! AuctionThreadList

Melakukanbidbaru

Membuatthreadlelangbaru

ViewBidOngoing AuctionLists Linkmenujuke

lelang

ViewTransactionHistory

Menampilkanhistorytransaksi

user

ViewProAile Menampilkandetaildatauser

4. Hasil dan Pembahasan

Setelah proses perancangan sistem selesai dilakukan, rancangan sistem

tersebut dapat mulai diimplementasikan pada website yang dibangun menggunakan

hosting & domain. Dengan menggunakan web platform yang bersifat responsive

sehingga memudahkan pengguna dalam mengakses website baik melalui PC, laptop,

maupun mobile. Berikut merupakan bagan dari menu yang tersedia bagi admin

maupun user:

Gambar 7 Bagan Pada Menu Admin

Gambar 8 Bagan Pada Menu User / Member

Gambar 7 dan 8 merupakan struktur bagan menu secara keseluruhan

yang dapat diakses setelah melakukan registrasi sehingga dapat login ke dalam

sistem. Menu yang ditampilkan pada bagian admin dan user berbeda, menyesuaikan

dengan kapasitas serta kebutuhan dari penggunanya.

Setelah proses implementasi selesai, selanjutnya dilakukan pengujian alpha

terhadap aplikasi. Pengujian dilakukan dengan tujuan untuk mengetahui apakah

aplikasi telah sesuai dengan kebutuhan pengguna dengan menguji fungsi yang

terdapat dalam aplikasi. Pengujian dilakukan dengan 3 (tiga) metode yaitu, blackbox

testing, compatibility testing, dan usability testing. Pengujian dilakukan pada

komputer dengan spesifikasi sebagai berikut:

Sistem Operasi : Windows 10 Enterprise Edition 64-bit

Processor : Intel Core i3 @2.40 GHz

VGA : Intel HD

RAM : 5 GB Dual Channel (4 GB + 1 GB)

SSD : Midasforce 120 GB

HDD : Hitachi 320 GB 5400 RPM

Blackbox Testing dilakukan dengan tujuan untuk mengetahui apakah fungsi

yang terdapat pada sistem dapat bekerja secara tepat, dengan menjalankan semua

fungsi yang ada pada aplikasi dan membandingkan hasil yang diharapkan dengan

hasil yang diberikan oleh aplikasi. Hasil dari pengujian blackbox testing dapat dilihat

pada Tabel 1. Tabel 1 Hasil Blackbox Testing

No Data Uji Input Harapan Hasil Output Hasil

Pengujian Kesimpulan

1. Login

Login

menggunakan

akun admin,

dan user

Dapat masuk ke

halaman utama

admin/ user

Masuk ke

halaman utama

admin / user

Valid

2. Register

User

melakukan

pendaftaran

secara online

Hasil

pendaftaran

tersimpan di

database dan

dapat digunakan

login

Data tersimpan di

database dan dapat

digunakan untuk

login

Valid

3. Add User

Admin

melakukan

pendaftaran

user baru

Hasil

pendaftaran

tersimpan di

database dan

Data user tersimpan

di database dan

dapat digunakan

untuk login oleh

Valid

melalui

dashboard

dapat digunakan

login oleh user

user

4. View User Admin melihat

daftar user

Muncul daftar

nama user

beserta

keterangan lain

secara lengkap

Nama user beserta

keterangan lain

berhasil

ditampilkan

Valid

5. Edit User

Admin

mengubah

detail yang

ada pada user

Admin dapat

mengubah detail

user

Detail user dapat

di-update Valid

6. Delete User

User dihapus

dari daftar

user dan

database

Admin dapat

menghapus user

melalui menu

tersebut

User berhasil

dihapus dari

database

Valid

7. View

Auction

Admin melihat

transaksi

lelang yang

aktif

Admin dapat

melihat seluruh

daftar lelang

yang sedang

berjalan

Admin dapat

melihat seluruh

transaksi lelang

Valid

8.

View

Transaction

History

Admin melihat

transaksi user

Admin dapat

melihat daftar

transaksi secara

spesifik

berdasarkan

user

Admin dapat

melihat history

transaksi yang

pernah dilakukan

oleh user terpilih

Valid

9. Bid Now

User

memasang

harga

penawaran

lelang

User memasang

harga

penawaran

lelang pada

transaksi yang

aktif pada daftar

transaksi yang

tersedia

User dapat

memasang harga

penawaran sesuai

keinginan dan saldo

yang dimiliki.

Valid

10. View Bid

Ongoing

User melihat

daftar lelang

yang sedang

diikuti

User dapat

melihat hasil

daftar lelang

yang sedang

diikuti dan

bersifat aktif

User dapat melihat

daftar lelang yang

sedang diikuti

Valid

11.

View

Transaction

History

User melihat

history

transaksi

User dapat

melihat daftar

lengkap

transaksi lelang

yang pernah

diikuti

User dapat melihat

daftar lelang yang

pernah diikuti

Valid

12. View Profile

User dapat

melihat profil

lengkap

User dapat

melihat profil

user itu sendiri

sesuai dengan

yang terdaftar di

database

User dapat melihat

profil secara

lengkap

Valid

Berdasarkan pada hasil pengujian black box yang telah dilakukan, dapat dilihat

bahwa fungsi yang terdapat pada aplikasi telah berhasil dijalankan dan memenuhi

kriteria yang dibutuhkan serta aplikasi berjalan dengan baik secara fungsional.

Selanjutnya dilakukan compatibility testing. Pengujian tersebut dilakukan

untuk mengetahui apakah sistem yang telah dibuat dapat dijalankan dengan normal

menggunakan beberapa media browser yang secara umum digunakan oleh user. Hasil

pengujian compatibility testing ditampilkan pada Tabel 2. Tabel 2 Compatibility Testing

Browser Resolution

≤ 800 x 600 1024 x 768 1366 x 768 Mobile

Google Chrome √ √ √ √

Mozilla Firefox √ √ √ √

Microsoft Edge √ √ √

Internet Explorer 11 √ √ √

Safari √ √ √ √

Android Browser √

Berdasarkan hasil compatibility testing pada Tabel 2, maka dapat disimpulkan

bahwa sistem yang telah dibuat dapat berjalan dan diakses melalui browser yang

secara umum digunakan oleh user secara baik.

Pada tahap pengujian terakhir, dilakukan User Acceptance Test (UAT). Pada

tahapan pengujian tersebut, dilakukan pengujian secara beta dengan tujuan untuk

mengetahui apakah sistem telah memenuhi kebutuhan user, mempermudah pola

bertransaksi user, serta mudah digunakan oleh user. Untuk memperoleh jawaban atas

pertanyaan tersebut, maka perlu dilakukan pengujian dengan melibatkan user sample.

Pengujian UAT dilakukan kepada 15 user sample untuk Aplikasi Sistem Lelang Ikan

Cupang Online, yang mana user sample ini terdiri dari beberapa anggota komunitas

cupang hias Salatiga, melalui kuesioner. Hasil jawaban kuesioner tersebut dapat

dilihat pada Tabel 3. Tabel 3 User Acceptance Test

No Pertanyaan Jawaban

SS S CS TS STS

1 Aplikasi ini telah menjawab kebutuhan penjual dan

pembeli ikan cupang berbasis online. 12 3 0 0 0

2 Aplikasi ini membuat penjual semakin produktif dalam

beternak ikan cupang. 14 1 0 0 0

3

Pengaturan informasi serta menu pada aplikasi telah

tertata dengan baik, sehingga dapat dengan mudah

bertransaksi melalui aplikasi.

12 2 1 0 0

4 Aplikasi yang dibuat bersifat sederhana, mudah

dipahami, dan mudah digunakan. 15 0 0 0 0

5

Tampilan yang digunakan pada aplikasi dapat dilihat

dengan jelas, baik dari segi huruf, tombol, dan warna

yang dipilih.

15 0 0 0 0

6 Aplikasi terlihat menarik untuk digunakan. 10 4 1 0 0

Berdasarkan hasil jawaban dari UAT tersebut, maka dilakukan perhitungan

presentase jawaban responden dari user sample yang telah mengisi kuesioner tersebut.

Hasil analisis data jawaban untuk pertanyaan 1, menunjukkan sebanyak 12 responden

menjawab Sangat Setuju, dan 3 responden menjawab Setuju. Sehingga dapat

disimpulkan bahwa aplikasi ini telah menjawab kebutuhan terkait bisnis ikan cupang

secara online.

Hasil analisis data jawaban untuk pertanyaan 2, menunjukkan sebanyak 14

responden menjawab Sangat Setuju, dan 1 responden menjawab Setuju. Sehingga

dapat disimpulkan bahwa aplikasi ini membuat penjual semakin bersemangat dan

menjadi lebih produktif dalam beternak ikan cupang.


responden menjawab Sangat Setuju, 2 responden menjawab Setuju, dan 1 responden

menjawab Cukup Setuju. Sehingga dapat disimpulkan bahwa aplikasi ini memberikan

informasi yang cukup jelas untuk dapat dipahami oleh pengguna awam sekalipun. Hal

tersebut juga memudahkan user dalam bertransaksi.


responden menjawab Sangat Setuju. Sehingga dapat disimpulkan bahwa aplikasi ini

bersifat user-friendly dalam penggunaannya. Selain itu, aplikasi ini juga tidak

membingungkan bagi pengguna baru.


responden menjawab Sangat Setuju. Sehingga dapat disimpulkan bahwa pemilihan

huruf, warna background, serta gambar pendukung lain tidak mengganggu proses

bertransaksi melalui aplikasi ini.


responden menjawab Sangat Setuju, 4 responden menjawab Setuju, dan 1 responden

menjawab Cukup Setuju. Sehingga dapat disimpulkan bahwa aplikasi ini menarik

untuk digunakan oleh user kedepannya.

Oleh karena itu berdasarkan dari semua hasil analisis data jawaban UAT,

maka didapat kesimpulan bahwa Sistem Lelang Ikan Cupang Online Berbasis Web

telah menjawab keluhan pada transaksi lelang ikan cupang online yang sebelumnya

masih dilakukan secara konvensional pada platform yang bukan ditujukan untuk

menjadi marketplace ikan cupang online. Aplikasi ini memberikan kemudahan

bertransaksi, jaminan penjualan dan pembelian, serta meningkatkan produktifitas dari

peternak cupang. Dengan tampilan aplikasi yang menarik, serta dapat diakses dimana

saja, menggunakan media apa saja baik menggunakan smartphone, laptop, maupun

PC, menjadikan aplikasi ini efisien untuk digunakan semua orang.

5. Kesimpulan & Saran

Berdasarkan penelitian dan pengujian yang telah dilakukan, maka didapatkan

bahwa Sistem Lelang Ikan Cupang Online dapat dirancang dengan berbasis web,

menggunakan bahasa pemrograman PHP, CSS, dan Bootstrap untuk penerapan

teknologi Responsive Web Design (RWD) sehingga dapat menyesuaikan pada device

yang digunakan. Dengan adanya teknologi RWD, jangkauan user dapat dilakukan

secara luas karena tidak membutuhkan spesifikasi khusus untuk dapat menggunakan

aplikasi tersebut.

Dari hasil pengujian aplikasi, didapatkan bahwa Sistem Lelang Ikan Cupang

Online dapat menyelesaikan permasalahan dan kebutuhan yang selama ini didapati

oleh penjual dan pembeli ikan cupang online di Indonesia. Sebelum adanya sistem ini,

penjual dan pembeli bertransaksi melalui media sosial yang sejatinya tidak

diperuntukkan sebagai platform lelang online, sehingga didapati beberapa masalah

dan hambatan dalam bertransaksi. Masalah yang paling sering ditemui adalah kasus

bid and run, yaitu kasus di mana penjual dan pembeli sudah melakukan proses lelang

dan ditemukan pemenang lelang, namun pada saat jatuh tempo pembayaran, pembeli

tersebut menghilang dan tidak dapat dihubungi. Juga kasus penipuan saat pembeli

telah melakukan transfer uang kepada penjual, namun penjual menghilang dan ikan

tidak dikirimkan. Atau ketika ikan telah dikirim, namun ikan yang diterima tidak

sesuai dengan yang dilelang. Hal-hal tersebut dapat diminimalisir karena pada sistem

ini, admin berperan sebagai perantara dan pihak ketiga yang dapat dipercaya oleh

kedua belah pihak. Sehingga jika ada masalah yang terjadi setelah proses lelang

selesai, kedua belah pihak tidak ada yang dirugikan. Kepastian dari keberhasilan

transaksi juga menjadi jaminan melalui sistem ini.

Penelitian ini masih dapat dikembangkan lagi seperti penambahan fitur yang

belum tersedia dan bersifat revolusioner, maupun perbaikan pada bagian user

interface, sehingga aplikasi sistem lelang online ini dapat berkembang menjadi lebih

baik. Peningkatan atau perbaikan pada user interface, serta sejumlah fitur di dalamnya

diperlukan untuk meningkatkan efisiensi, serta keamanan dan kenyamanan bagi

pengguna dimanapun dan kapanpun aplikasi ini diakses.

Saran untuk pengembangan aplikasi ke depannya dapat berupa peningkatan

dalam hal skalabilitas aplikasi yang saat ini masih terbatas pada proses bid yang

hanya dapat dilakukan satu per satu. Pola proses transaksi juga sebaiknya dapat

terintegrasi secara online bekerja sama dengan pihak bank, maupun penyedia jasa

keuangan lain, sehingga sistem dapat lebih bersifat sederhana, cepat, dan terpadu.

Selain itu, pada bagian user interface dapat dikembangkan dengan menyederhanakan

proses dan tampilan agar dapat semakin user friendly.

6. Daftar Pustaka

[1] Wicak Hidayat, 2014, Pengguna Internet Indonesia Nomor Enam Di Dunia,

[online], (https://www.kominfo.go.id/content/detail/4286/pengguna-internet-

indonesia-nomor-enam-dunia/0/sorotan_media/, 24 November 2014).

[2] Ulti Desi Arni, 2018, Perbedaan Bukalapak, Tokopedia, dan Shopee, [online],

(https://garudacyber.co.id/artikel/1487-perbedaan-bukalapak-tokopedia-dan-

shopee, 28 Desember 2018).

[3] Bakri, Rajib A., Fitriawan, Helmy, Nama, Gigih Fordha. 2013. Sistem Lelang

Online Berbasi Web. Lampung: Universitas Lampung.

[4] Wuryanta, AG. Eka Wenats. 2004. Digitalisasi Masyarakat: Menilik Kekuatan

dan Kelemahan Dinamika Era Informasi Digital dan Masyarakat Informasi.

Jakarta: Universitas Mercu Buana.

[5] Palomes, SE., MH., 2016, Senjakala Surat Kabar Cetak dan Analoginya Bagi

Lelang di Era Digital Ekonomi, [online],

(https://www.djkn.kemenkeu.go.id/artikel/baca/11251/Senjakala-Surat-Kabar-

Cetak-dan-Analoginya-Bagi-Lelang-di-Era-Digital-Ekonomi.html, 16

September 2016).

[6] Hardi, Vincentius. 2017. Pengembangan Aplikasi Lelang Ikan Hias di

Indonesia. Bandung: Universitas Katolik Parahyangan.

[7] Mela Arnani, 2018, Waspada Penipuan Lelang, Ini Imbauan Ditjen Kekayaan

Negara, [online],

(https://ekonomi.kompas.com/read/2018/08/02/192415426/waspada-

penipuan-lelang-ini-imbauan-ditjen-kekayaan-negara?page=all, 02 Agustus

2018)

[8] Cecep Risnandar, 2019, Mengenal Jenis-jenis Ikan Cupang, [online],

(https://alamtani.com/mengenal-jenis-jenis-ikan-cupang/, 2019).

[9] ANT, 2016, Ikan Cupang Asal Kudus Menembus Pasar Dunia, [online],

(https://economy.okezone.com/read/2016/06/27/320/1426689/ikan-cupang-

asal-kudus-menembus-pasar-dunia, 27 Juni 2016).

[10] BPKP, 2000, Undang-undang Republik Indonesia Nomor 19 Tahun 2000

Tentang Perubahan Atas Undang-undang Nomor 19 Tahun 1997 Tentang

Penagihan Pajak Dengan Surat Paksa, [pdf],

(http://www.bpkp.go.id/uu/filedownload/2/43/358.bpkp, 2000).

[11] Susilo Dwi Margono, 2018, [online],

(https://www.djkn.kemenkeu.go.id/artikel/baca/12648/Lelang-Tanpa-Risalah-

Lelang-Menafsirkan-Kembali-Pasal-35-Vendu-Reglement.html, 02 Februari

2018).

[12] Tista, Adwin. 2013. Perkembangan Sistem Lelang di Indonesia. Banjarmasin:

Universitas Islam Kalimantan Muhammad Arsyad Al Banjari.

[13] Ananta, Melani. 2011. Sistem Lelang Online Melalui Ipasar Kayu Jati Perum

Perhutani Ditinjau Dari Asas Lelang Yang Berlaku Di Indonesia. Depok:

Universitas Indonesia.

[14] Lesmana, Edwin Indra., Yunizar, Febri., Rachmadi, Muhammad. Sistem

Informasi Lelang Online Kendaraan Salvage Berbasis Web Dengan Fitur

SMS Gateway Pada Balai Lelang Astria Palembang. Palembang: Sekolah

Tinggi Manajemen Informatika dan Komputer, Global Informatika MDP.

[15] Hasibuan, Zainal A. 2007. Metodologi Penelitian Pada Bidang Ilmu Komputer

Dan Teknologi Informasi. Jakarta: Ilmu Komputer Universitas Indonesia.

Dengan Penerapan Teknologi Responsive Web Design

Documents

Transcript of Dengan Penerapan Teknologi Responsive Web Design