## Rancang Bangun Sistem Informasi Penjualan Box Motor Berbasis Web

## Fajar Sidik
Universitas Bina Sarana Informatika Jl. Kamal Raya No. 18, Ringroad. Cengkareng, Jakarta Barat fajars299@gmail.com

## Bibit Sudarsono
Universitas Bina Sarana Informatika Jl. Kamal Raya No. 18, Ringroad. Cengkareng, Jakarta Barat bibit.bbs@bsi.ac.id
Abstrak — Dalam era globalisasi sekarang ini, teknologi informasi melaju dengan cepat. Khususnya  internet,  yang bisa diakses dengan berbagai aplikasi baik dekstop maupun  mobile.  Perkembangan  ini  mempengaruhi  dunia  bisnis  secara  global  dan berpengaruh  terhadap  usaha  yang  bersifat  konvensional,  yaitu  penjualan  aksesoris motor.  Sehingga  para  penjual  harus  ektra  promosi  dalam  memasarkan  produknya, agar produk tersebut laku. Maka dengan sistem penjualan yang ada, harus dibuatkan sebuah  sistem  informasi  penjualan  yang  berbasis  online  (website)  agar  lebih  efektif dan  efisien.  Dengan  adanya  website,  diharapkan  produk  yang  dijual  dapat  dilihat oleh  konsumen  yang  berada  dimana  saja  dengan  jangkauan  penjualan  yang  sangat luas.  Serta  didukung  dengan  metode  pembayaran  yang  sudah  mulai  berkembang, seperti  transfer  bank,  kartu  kredit,  virtual  account  hingga  outlet-outlet  pembayaran yang  sudah  bekerjasama.  Dengan  metode  pembayaran  tersebut,  maka  konsumen tidak perlu bingung dalam bertransaksi pembayaran. Dengan menggunakan beberapa software pendukung dalam membuat website, diharapkan dapat menjadi sebuah web e-commerce  yang  memenuhi  kebutuhan    konsumen  dalam  melakukan  penjualan khususnya box motor.
Kunci— Sistem Informasi, Perancangan Berbasis Web, Penjualan Berbasis Web

## I. PENDAHULUAN
Dikalangan  pengendara  sepeda  motor,  banyak aksesoris  yang dipasang di  motor, salah satunya box. Box  motor  merupakan  aksesoris  yang  harus  dipakai jika bepergian jauh. Dikarenakan untuk mempermudah  meletakan  barang  bawaan  yang mereka  bawa  dan  melindungi  barang  bawaan  jika hujan.  Selain  itu  juga  berfungsi  sebagai  sandaran pengendara yang duduk dibangku belakang, dan juga dapat  meminimalisir  pembawaan  tas  yang  terlalu banyak.    Perkembangan  teknologi  informasi  yang demikian  pesatnya  telah  membawa  manfaat  bagi kemajuan dalam meningkatkan kinerja dan membantu berbagai  kegiatan  untuk  memperoleh  hasil  yang cepat, tepat dan akurat.
Melihat  kemudahan  yang  akan  di  dapat  dari internet, Maka akhir-akhir ini banyak sekali toko-toko dan perusahaan swasta yang menggunakan website e- commerce untuk memperluas pemasaran dan meningkatkan  penghasilan  /  keuntungan  mereka. Prisgunanto  (2015:101-102)  [4],  menyimpulkan bahwa,    kemajuan  teknologi  semakin  pesat  di  segala sektor,  bagaikan  raksasa,  yang  berlari  cepat  dan mereka  yang  tidak  bisa  mengikutinya  akan  tertinggal jauh  dan  dilibas  oleh  perkembangan  teknologi  itu sendiri.
Dengan  meluasnya  perdagangan  global,  tidak cukup  hanya  dengan  mengandalkan  iklan  dan selebaran untuk memajukan bisnis yang dijalankannya  untuk  dapat  mempromosikan  produk yang di jual maka perlu adanya media nternet sebagai sistem  informasi  yang  berupa  web.  Sistem  informasi merupakan  sarana  tercepat  untuk  diakses  sehingga memudahkan  proses  promosi.    Pada  kota-kota  besar
di  indonesia,  sudah  banyak  yang  menjual  aksesoris motor  seperti  box  motor.  Tetapi  sistem  penjualan masih bersifat manual (konvensioanal), yang mengakibatkan  sering  terjadi  kesalahan  yaitu  mulai dari  pencatatan  pesanan  barang  yang  dibeli  oleh konsumen,  sampai  penyimpanan  data-data  yang berhubungan  dengan  proses  pembuatan  laporan. Maka  untuk  meminimalisir  kesalahan  tersebut,  harus dibuatkan sebuah sistem agar lebih efektif dan efisien

## II. TINJAUAN PUSTAKA

## A. Konsep Dasar Web
World  Wide  Web  (WWW),  lebih  dikenal dengan web yang merupakan salah satu layanan yang didapat  oleh    pemakai  komputer  yang  terhubung  ke internet dengan fasilitas hypertext untuk menampilkan  data  berupa  teks,  gambar,  suara, animasi  dan  data  multimedia  lainnya.  Sehingga  web pada  awalannya  adalah  ruang  informasi  dalam internet,  dengan  menggunakan  teknologi  hypertext, pemakai  dituntun  menemukan  informasi  dengan mengikuti  link  yang  disediakan  dalam  dokumen  web yang ditampilkan dalam web browser.
B. Internet
Secara  sederhana  dapat  dikatakan,    Kustiyahningsih dan  Namisa  (2011:2)  [3],  internet  adalah  sebuah jaringan  komputer  dunia,  semua  berbicara  dengan bahasa  yang  sama.  Banyak  keuntungan  yang  didapat dari jaringan komputer, diantaranya produktifitas dan efisien.  Jaringan  komputer  menurut  area  atau  lokasi dapat dibagi menjadi empat yaitu:
1.  Lokal  Area  Network  (LAN),  yaitu  jaringan komputer dimana komputer-komputer yang terhubung masih dalam satu area atau lokasi 2.  Wide  Area  Network  (WAN),  yaitu  koneksi  antara LAN-LAN  yang  berbeda  lokasi/area.  Ciri  utamanya adalah  memiliki  bandwith  yang  terbatas  karena disesuaikan  dengan  fungsi  harga,  adanya  problem delay antar stasiun.
3.  Metropolitan  Area  Network  (MAN),  yaitu  sama seperti  LAN  hanya  saja  lebih  luas  areanya  semisal dakam  satu  kota/daerah  dengan  range  mencapai 50km.
4.  Internet  yaitu  kepanjangan  dari  interconnection networking atau juga yang telah menjadi international nerworking merupakan suatu jaringan yang menghubungkan  komputer  diseluruh  dunia  tanpa dibatasi  oleh  jumlah  unit  menjadi  satu  jaringan  yang bisa saling mengakses.
C.  Bahasa Pemrograman Bahasa  pemrograman  adalah  instruksi  standar untuk  memerintah  komputer.  Bahasa  pemrograman ini  merupakan  suatu  himpunan  dari  aturan  sintaks yang dipakai untuk mendefinisikan program komputer. Antara lain sebagai berikut :
1. PHP : Pre Hypertext Preprocessor
Hidayatullah  dan  Kawistara  (2017:244)  [2], mengatakan  PHP  sudah  menjadi  bahasa  scripting umum yang banyak digunakan di kalangan developerweb. Mempunyai banyak kelebihan menjadi alasan  utama  kenapa  PHP  lebih  dipilih  sebagai  basis umum  dalam  membuat  sebuah  web.  Tapi  sebelum kita bahas lebih jauh mengenai PHP itu sendiri, kami akan  sedikit  membahas  mengenai  sejarah  PHP, bagaimana  PHP  dapatmenjadi  salah  satu  bahasa scripting terpopuler saat ini.
2. HTML (Hyper Text Markup Language)
Kustiyahningsih  dan  Namisa  (2011:  13)  [3], bahasa pemprograman HTML kependekan dari Hyper Text Markup Language. Dokumen HTML adalah file text  murni  yang  dapat  dibuat  dengan  editor  teks sembarang.  Dokumen  ini  dikenal  sebagai  web  page. File-file  HTML  ini  berisi  instruksi-  instruksi  yang kemudian  diterjemahkan  oleh  browser  yang  ada dikomputer  client  (user)  sehingga  isi  informasinya dapat ditampilkan secara visual dikomputer pengguna (user).
3. CSS (Cascading Style Sheets)
―Style  Sheet  merupakan  feature  yang  sangat penting dalam membuat Dynamic HTML‖. Meskipun bukan  merupakan  suatu  keharusan  dalam  membuat web,  akan  tetapi  penggunaan  style  sheets  merupakan kelebihan  tersendiri.  Suatu  style  sheets  merupakan tempat dimana anda mengontrol dan memanage style- style  yang  ada.  Style  sheet  mendeskripsikan bagaimana  tampilan dokumen HTML dilayar. Secara teoritis kita bisa menggunakan style sheet technology dengan  HTML.  Akan  tetapi  pada  praktiknya  hanya Cascading  Style  Sheets  (CSS)  technology  yang support  pada  hampir  semua  Web  Browser.  Karena CSS  telah  di  standarkan  oleh  World  Wide  Web Consortium (W3C) untuk digunakan di web browser. CSS adalah kumpulan kode-kode yang berurutan dan saling berhubungan  untuk  mengatur  format/ tampilan suatu  halaman  HTML.  CSS  dapat  dituliskan  pada bagian  <body>,<head>  suatu  dokumen  HTML  atau diletakkan disebuah file eksternal.
4. JavaScript
Kustiyahningsih  dan  Namisa  (2011:2)  [3], memberikan penjelasan mengenai javascript, singkatnya,  adalah  bahasa  yang  berbentuk  kumpulan skrip berjalan pada suatu dokumen HTML. Bahasa ini adalah  bahasa  pemrograman  untuk  memberikan kemampuan  tambahan  terhadap  bahasa  HTML dengan mengizinkan pengeksekusian perintah- perintah  di  sisi  user  artinya  di  sisi  browser  bukan  di sisi  server  web.  Javascript  adalah  bahasa  yang  ―case sensitive‖  artinya  membedakan  penamaan  variable dan  fungsi  yang  menggunakan  huruf  besar  dan  huruf kecil, contoh variable atau fungsi dengan nama TEST berbeda dengan variable dengan nama test dan setiap instruksi diakhiri dengan karakter titik koma(;)
D.  Basis Data Sukamto  dan  Shalahuddin  (2013  :  43)  [7], pengertian istem basis data adalah sistem terkomputerisasai  yang  tujuan  utamanya  adalah memelihara data yang sudah diolah atau infirmasi dan membuat  informasi  tersedia  saat  dibutuhkan‖.  Pada intinya basis data dalah media untuk menyimpan data agar  dapat  diakses  dengan  mudah  dan  cepat.  Pada buku  ini  menggunakan  basus  dara  relasional  yang diimplementasikan  dengan  tabel-tabel  yang  saling memliki relasi seperti pada gambar berikut:
Sumber: Sukamto dan Shalahuddin (2013:43) Gambar I  Ilustrasi Basis Data
E. System Development Life Cycle (SDLC) Dalam  fase  pengembangan  sistem  penulis menggunakan  Framework  System  Development  Life Cycle  (SDLC)  dengan  pendekatan  waterfall  yang terdiri  atas  beberapa  tahapan  aliran  aktifitas  yang
berjalan  satu  arah  dari  awal  sampai  akhir  proyek pengembangan sistem.
Pada Puspitasri dalam Rainardi (2015 : 2) [5], mendefinisikan  metode  waterfall,  ada  beberapa tahapan-tahapan  tertentu  yang  harus  dicapai  secara searah  setelah  tahapan  yang  lain,  dalam  urutan tertentu,  seperti  tangga  atau  air  terjun  bertingkat. Beberapa  tahapan  yang  berbeda  dalam  metode  ini, secara  umum  mulai  dari  studi  kelayakan,  kebutuhan, arsitektur, desain, pengembangan, pengujian, penyebaran dan operasi.
F. Entity Relationship Diagram (ERD) Rosidin  dan Lubis  dalam  (Sukamto & Salahuddin:  2017  )  [6]  ,  Entity  Relationship  Digram merupakan  sebuah  diagram  yang  digunakan  untuk merancang  hubungan  antar  tabel-tabel  dalam  basis data.
F. Logical Record Structured (LRS) Friyadie  (2007:13)  [1],    menyatakan  LRS merupakan  transformasi  dari  penggambaran  ERD dalam  bentuk  yang  lebih  jelas  dan  mudah  untuk dipahami.

## III. METODOLOGI PENELITIAN
Penelitian  yang  dilakukan  menggunakan  dua metode  yaitu  teknik  metode  pengumpulan  data  dan pengembangan sistem perangkat lunak:
1. Pengumpulan Data a. Metode Pengamatan (Observasi) Teknik pengumpulan data dengan metode observasi atau pengamatan ini menjelaskan bagaimana  penulis  mengobservasi  web  e-commerce dan toko penjualan box motor yang ada sebagai dasar pertimbangan  dalam  membuat  aplikasi  web  yang penulis buat.
b.  Studi Pustaka
Suatu  metode  pengumpulan  data  yang  dilakukan dengan  mencari  dan  mempelajari  berbagai  data  dari berbagai sumber seperti buku, artikel-artikel baik dari perpustakaan maupun internet.
2.  Metode Pengembangan Perangkat Lunak a. Requirement Analisis
Tahap ini pengembang system diperlukan komunikasi yang bertujuan untuk memahami perangkat  lunak  yang  diharapkan  oleh  pngguna  atau batasanperangkat  lunak  tersebut.  Informasi  ini biasanya  dapat  diperoleh  melalui  wawancara,  diskusi
atau  survey  langsung.  Informasi  dianalisis  untuk mendapatkan data yang dibutuhkan oleh pengguna.
b. System Design Spesifikasi kebutuhan dari tahap sebelumnya akan dipelajari dalam fase ini dan desain system disiapkan. Desain system membantu dalam menentukan perangkat  keras  (hardware)  dan  system  persyaratan dan  juga  membantu  dalam  mendefinisikan  arsitektur sistem secara keseluruhan.
c. Implementation Pada tahap ini, system pertama kali dikembangkan di  program  kecil  yang  disebut  unit  yang  terintegrasi dalam  tahap  selanjutmya.  Setiap  unit  dikembangkan dan  diuji  untuk  fungsionalitas  yang  disebut  sebagai unit testing.
d. Intergration and Testing Seluruh  unit  yang  dikembangkan  dalam  tahap implementasi  diintegrasikan  ke  dalam  system  setelah pengujian  yang  dilakukan  masing-  masing  unit. Setelah integrasi seluruh system diuji untuk mengecek setiap kegagalan maupun kesalahan.
e. Operation and Maintance Tahap  akhir  dalam  model  waterfall.  Perangkat lunak  yang  sudah  jadi,  dijalankan  serta  dilakukan pemeliharaan. Pemeliharaa termasuk dalam memperbaiki  kesalahan  yang  tidak  ditemukan  pada langkah  sebelumnya.  Perbaikan  impelementasi  unit sistem dan peningkatan jasa sistem sebagai kebutuhan baru.

## IV. HASIL DAN PEMBAHASAN

## A. Analisis Kebutuhan
Sistem penjualan secara online ini, customer tidak perlu  datang  ke  toko  untuk  membeli  tetapi  bisa dilakukan  melalui  browser,  customer  dapat  memesan produk  yang  diinginkan.  Berikut  ini  spesifkasi kebutuhan  (sistem  requirement)  dari  sistem  e- commerce.
1. Analisa Kebutuhan Pengguna
1.1. User
a) User dapat melihat halaman media.
b) User dapat melihat Produk terlaris.
c) User dapat melihat Produk.
d) User  tidak  dapat  melakukan  pembelian barang  sebelum terdaftar sebagai member.
e) User  dapat  melihat  ketentuan  yang  berisi tentang cara pembayaran dan pemesanan.
f) User dapat melihat kategori produk
1.2 Administrator
a) Admin dapat melakukan login.
b) Admin dapat mengolah kategori produk.
c) Admin dapat mengolah produk.
d) Admin dapat mengolah ongkos kirim.
e) Admin dapat mengolah order.
f) Admin dapat mengolah profil toko online.
g) Admin dapat mengolah info rekening toko.
h) Admin dapat mengolah laporan
1.3 Member
a) Customer  dapat melakukan pembelian produk.
b) Customer  dapat  melihat  halaman  index pelanggan.
c) Customer  dapat  melihat  katalog  dan  detail produk.
d) Customer dapat melihat kategori produk.
e) Customer  dapat  melakukan  update  jumlah produk di keranjang belanja dan menampilkan total pembelian.
f) Customer dapat mengisi alamat pengiriman.
g) Customer dapat melihat struk pembayaran.
B. Entity Relationship Diagram (ERD) (Lampiran 1)
C. Logical Record Structure (LRS) (Lampiran 2)
D.Implementasi Rancangan Antar Muka
Berikut  adalah  implementasi  rancangan  antar  muka pada  penjualan  box  motor  berdasarkan  hasil rancangan antar muka.
1. Tampilan Login Gambar 2.  User Login
2. Dashboard Pengelolaan Admin
Gambar 3. Data Pengelolaan Admin
3. Tampilan Daftar Member Gambar 4. Tampilan Pendaftaran Member
4. Tampilan Kategori Produk
Gambar 5. Tampilan Data Produk
5. Tampilan Konfirmasi Pembayaran
Gambar 6. Status Pembayaran 6. Tampilan Pengujian Black Box Testing
Tabel 1 Black Box Testing
E. Spesifikasi Sistem Komputer Berikut ini adalah spesifikasi perangkat keras dan perangkat  lunak  minimum  yang  dibutuhkan  untuk mengimplementasikan aplikasi website untuk penjualan box motor.
1. Spesifikasi Perangkat Keras
Perangkat  keras  (hardware)  adalah  suatu  bagian terpenting  yang  akan  digunakan  dalam  menjalankan software dan pemilihan perangkat keras apa saja yang dibutuhkan  untuk  menjalankan  aplikasi  tersebut,
sehingga  program  yang  telah  dihasilkan  dapat berjalan dengan baik.
Dalam hal ini perangkat keras yang digunakan penulis adalah sebagai berikut:
a. Processor  : Intel Core TM i3-8130U Processor b. Memory RAM : 4.00 GB
c. Harddisk   : 500 GB
d. Monitor    : 14‖ Inch
e. Keyboard   : Standard (84 keys)
f. Mouse      : Standard Mouse
2. Perangkat Lunak (Software) Bagian  terpenting  yang  lain  yang  mendukung program  adalah  perangkat  lunak  (software)  yang digunakan  dengan  menjalankan  web  serta  sistem operasi  yang  digunakan  untuk  menjalankan  program tersebut.  Adapun  perangkat  lunak  yang  digunakan penulis adalah:
A. Adobe Photoshop
Photoshop  adalah  sebuah  perangkat  lunak  editor citra  buatan  adobe  sistem  yang  dikhususkan  untuk pengeditan foto/gambar dan pembuatan efek. Perangkat lunak ini banyak digunakan oleh fotografer digital  atau  perusahaan  iklan  sehingga  dianggap sebagai  pemimpin  pasar  (market  leader)  untuk perangkat  lunak  pengolah  gambar  atau  foto  dan bersama  Adobe  Acrobat,  dianggap  sebagai  sebagai produk  terbaik  yang  pernah  diproduksi  oleh  Adobe System.
B. Paket Program XAMPP
a. Xampp  web  server  yang  berfungsi  untuk menerima dan mengolah permintaan web browser.
b. MySQL  yang  berfungsi  sebagai  database  untuk menyimpan dan mengolah data yang dinamis dari sebuah aplikasi web.
C. Adobe Dreamweaver CS 6
Aplikasi  ini  yang  berfungsi  untuk  mengolah  dan menterjemahkan  kode-kode  HTML  serta  design website itu sendiri.

## V. KESIMPULAN DAN SARAN
Hasil  penelitian  yang  telah  dilakukan  dalam pembahasan  dapat  disimpulkan  internet  merupakan sebuah layanan dimana setiap orang dapat melakukan akses  kapan  dan  dimana  saja.  Aplikasi  yang  dibuat dan  bisa  di  akses  dalam  internet  harus  sudah dipersiapkan  secara  matang,  salah  satunya  adalah penyimpanan data yang berhubungan dengan transaksi  karena  menggunakan  database  dalam
komputer,  sehingga  data  yang  ada  harus  benar-benar aman  agar  tidak  terjadi  pencurian  data  serta  harus mengurangi resiko data tercampur, rusak dan hilang.
Rancangan  bangun  sistem  informasi  penjualan berbasis  web  ini  merupakan  langkah  alternatif  untuk meningkatkan penjualan, serta mempermudah konsumen  dalam  memilih  barang  yang  sudah disediakan.  Sistem  informasi  berbasis  web  ini  akan memberkan  kemudahan  dalam  bertransaksi  dan pengiriman barang yang lebih aman karena menggunakan jasa pihak ketiga yang telah bekerjasama.
Dari  beberapa  kesimpulan  yang  telah  penulis uraikan  diatas,  penulis  dapat  memberikan  beberapa saran  yang  mungkin  dapat  menjadi  tolak  ukur  untuk perancangan web yang lebih baik dan berjalan secara optimal juga dapat  meningkatkan jumlah pengunjung web. Berikut saran-saran yang dapat penulis berikan : 1. Dikarenakan  jenis  web  ini  merupakan  web  e- commerce , maka sebaiknya dilakukan pembaharuan  data  dan  informasi  setiap  harinya sesuai  dengan  kebutuhan  pengunjung  maupun konsumen.
2. Dilakukan  Back  up  data  untuk  menghindari kehilangan  data  atau  hal  –  hal  yang  tidak  di inginkan.
3. Senantiasa melakukan kegiatan pemeliharaan baik hardware  maupun  software  dengan  memeriksa keadaan perangkat-perangkat tersebut.

## R EFERENCES
[1] Frieyadie.  2007.  Belajar  sendiri  pemprograman database  menggunakan  fox  pro  9.0.  Jakarta: Elex Media Komputindo.
[2] Hidayatullah,  Priyanto  dan  Jauhari  Khairul Kawistara.  2017.  Pemrograman  Web.  Bandung: Informatika.
[3] Kustiyahningsih, Yeni dan Devie Rosa Anamisa. 2011.  Pemrograman  Basis  Data  Berbasis  Web Menggunakan PHP & MySQL:Yogyakarta.
[4] Prisgunanto,  Ilham.  2015.  Pengaruh  Sosial Media  Terhadap  Tingkat  Kepercayaan  Bergaul Siswa.  Jakarta:  Jurnal  Penelitian  Komunikasi dan Opini Publik. Vol. 9, No. 2:101-112.
[5] Puspitasari,  D.  (2015).  Rancang  Bangun  Sistem Informasi  Koperasi  Simpan  Pinjam  Karyawan Berbasis Web. Jurnal Pilar Nusa Mandiri, XI(2), 11.
[6] Rosidin,  &  Lubis,  B.  O.  (2017).  Implementasi Program  Persediaan  Barang  pada  CV  .  Ardho Teknik Bekasi. Jurnal  Sistem Informasi STMIK Antar Bangsa, (2), 172–180.
[7] Sukamto, Rosa Ariani dan Muhammad Shalahudin.  2013.  Rekayasa  Perangkat  Lunak Terstruktur dan   Berorientasi Objek. Bandung : Informatika