How to cite: Oktaviani. et al (2022) Pembuatan Company Profile Berbasis Website sebagai Media Informasi dan Promosi pada Hari Hari Pasar Swalayan, Syntax Literate: Jurnal Ilmiah Indonesia, 7 (8). E-ISSN:
2548-1398
Published by: Ridwan Institute
Syntax Literate: Jurnal Ilmiah Indonesia p–ISSN: 2541-0849 e-ISSN: 2548-1398 Vol. 7, No. 8 Agustus 2022

## PEMBUATAN  COMPANY  PROFILE  BERBASIS  WEBSITE  SEBAGAI  MEDIA INFORMASI DAN PROMOSI PADA HARI HARI PASAR SWALAYAN
Oktaviani, Endah Kurniasari, Rosdiana, Witari Aryunani, Yeni Setiani Fakultas Ilmu Komputer Universitas Gunadarma, Indonesia Email: oktaviani @staff.gunadarma.ac.id,  endah_ks @staff.gunadarma.ac.id, rosdiana@staff.gunadarma.ac.id, witari_aryunani @staff.gunadarma.ac.id, yeni_setiani @staff.gunadarma.ac.id

## Abstrak
Semakin  hari  kebutuhan  informasi  semakin  meningkat,  banyak  pelanggan  yang membutuhkan  informasi  pada  Hari  Hari Pasar  Swalayan  namun  tidak  ada  media online untuk menemukan informasi tersebut sehingga menjadi permasalahan yang menyebabkan pelanggan harus datang langsung ke tempatnya untuk mendapatkan informasi  atau  mengetahui  promosi  yang  ditawarkan.  Seiring  berkembangnya teknologi,  banyak  lembaga  atau  perusahaan  mulai  menerapkan  suatu  teknologi yang  dapat  membantu  suatu  pekerjaan  menjadi  lebih  efisien.  Oleh  karena  itu, dibuatlah  Company  Profile  Berbasis  Website  Sebagai  Media  Informasi  dan Promosi Pada Hari Hari Pasar Swalayan. Pembuatan website ini menggunakan PHP dan  MySQL  dan  perancangan  UML  (United  Modelling  Language)  meliputi  Use Case  Diagram,  Activity  Diagram,  dan  Class  Diagram.  Website  ini  terdapat informasi  tentang  promo,  informasi  kontak  dan  juga  lokasi  dari  Hari  Hari  Pasar Swalayan melalui fitur yang tersedia di navigasi web. Berdasarkan uji coba maka diperoleh hasil bahwa dengan menggunakan web browser Google Chrome, website beserta fiturnya dapat berjalan dengan baik sesuai fungsinya tanpa kendala.
Kata kunci : Company Profile, Informasi, Promosi, Website

## Abstract
The  need  for  information  is  increasing  day  by  day,  many  customers  need information  on  Hari  Hari  Supermarket  but  there  is  no  online  media  to  find  that information so that it becomes a problem that causes customers to come directly to the  place  to  get  information  or  find  out  the  promotions  offered.  As  technology develops, many institutions or companies begin to implement a technology that can help a job become more efficient. Therefore, a Website-Based Company Profile was created  as  a  Media  for  Information  and  Promotion  on  Hari  Hari  Supermarket. Making  this  website  using  PHP  and  MySQL  and  the  design  of  UML  (United Modeling Language) includes Use Case Diagrams, Activity Diagrams, and Class Diagrams.  This  website  contains  information  about  promos,  contact information and also the location of the day-to-day supermarket through the features available on the web navigation. Based on the trial, the result is that by using the Google Chrome,  Firefox  and  Microsoft  Edge  web  browsers,  the  website  and  its  features can run properly according to their functions without any problems.
Keywords: Company Profile, Information, Promotion, Website

## Pendahuluan
Pada zaman sekarang, teknologi semakin berkembang di berbagai bidang. Hal ini ditandai dengan banyaknya penggunaan teknologi untuk mengakses berbagai hal. Oleh karena  itu,  banyak  perusahaan  atau  pertokoan  mulai  menerapkan  teknologi  untuk membantu  kegiatan  usahanya  agar  menjadi  lebih  efisien  dan  berkembang.  Teknologi yang  banyak  digunakan  saat  ini  adalah  Web.  Web  merupakan  protokol  yang menyampaikan  informasi  dari  server  untuk  ditampilkan  kepada  para  pemakai  melalui web  browser.  Web  banyak  sekali  digunakan  di  segala  bidang,  salah  satunya  untuk meningkatkan  layanan  informasi  untuk  para  pelanggan  yaitu  berupa  Web  Company Profile.
Salah  satu  toko  yang  membutuhkan  web  company  profile  yaitu  Hari  Hari  Pasar Swalayan. Biasanya para pelanggan hanya untuk mendapatkan informasi ataupun melihat promo  produk  harus  datang  langsung  ke  toko  karena  tidak  ada  media  informasi  yang memudahkan.  Permasalahan  yang  terjadi  akibat  tidak  adanya  media  informasi  online pada Hari Hari Pasar Swalayan yaitu membuang waktu karena harus datang langsung ke toko  dan  minimnya  informasi  mengenai  promo  produk  pada  pelanggan  sehingga  toko swalayan menjadi kurang berkembang dan sepi pengunjung.
Oleh karena itu, dibuatlah sebuah web company profile berbasis website sebagai media  informasi  dan  promosi  Hari  Hari  Pasar  Swalayan  yang  diharapkan  dapat memberikan  kemudahan  untuk  para  pelanggan  untuk  bertanya  dan  melihat  berbagai macam  promo  produk  dan  informasi  tentang  toko  swalayan  tersebut.  Pelanggan  dapat mengetahui  informasi  berbagai  macam  promo  produk  yang  dijual  dan  dapat menghubungi  melalui  fitur  kontak  untuk  mengetahui  informasi  tentang  toko  swalayan tersebut.

## Metode Penelitian
Metode  penelitian  yang  digunakan  dalam  penelitian  ini  dengan  menggunakan metode  pendekatan  System  Development  Life  Cycle  (SDLC).  Tahap-tahap  yang dilakukan  adalah  :  1)  Tahap  perencanaan  (Planning)  pada  tahap  ini  menentukan  tema pembahasan dan objek penelitian. 2) Tahap (Analysis) pengumpulan data dari berbagai sumber dan referensi untuk menunjang penelitian untuk mengatasi permasalahan terkait yaitu dengan wawancara pihak Hari Hari Pasar Swalayan dan membaca referensi di buku, jurnal  maupun  internet.  3)  Tahap  (Design)  pada  tahap  ini  mulai  mendesign  struktur navigasi  dan  alur  program,  lalu  membuat  tampilan  aplikasi  (Interface)  dan  kemudian melakukan perancangan basis data. 4) Tahap (Coding) pada tahap ini mulai menulis code dengan  bahasa  pemrograman  PHP  dan  membuat  database  menggunakan  MYSQL.  5) Tahap  (Testing)  tahap  ini  dilakukan  implementasi  dari  rancangan  sebelumnya  dan melakukan uji coba terhadap web.

## Hasil dan Pembahasan Struktur Navigasi
Pada pembuatan website ini menggunakan struktur  navigasi campuran yang terdiri atas struktur navigasi linear dan struktur navigasi hirarki. Gambar 1 menyajikan struktur navigasi  user.  Setelah  masuk  ke  aplikasi  web,  maka  user  akan  langsung  masuk  ke halaman home di halaman utama yang akan menampilkan overview tentang Hari Hari Pasar  Swalayan.  Pada  halaman  promosi  katalog,  akan  menampilkan  katalog  promo sedangkan halaman belanja online, untuk berbelanja secara online melalui kartu kontak yang tersedia. Pada halaman lokasi toko, akan menampilkan daftar dari lokasi cabang. Pada  halaman  kontak  terdapat  form  kontak  untuk  dapat  mengirim  pesan  kepada  pihak Hari Hari Pasar Swalayan.

## Gambar 1 Struktur Navigasi User
Gambar  2  menyajikan  struktur  navigasi  Admin.  Setelah  login  admin  maka  akan masuk  ke  halaman  dashboard,  pada  halaman  dashboard  hanya  menampilkan  overview selamat  datang.  Pada  halaman  data  master,  terdapat  data  master  user  untuk  mengelola web  dan  data  master lokasi  untuk  mengupdate  setiap  cabang  dari  lokasi  toko  hari-hari swalayan. Pada halaman transaksi, terdapat data contact yang berisi data dari pengaduan dan pesan dari pelanggan. Pada halaman laporan, terdapat card yang menampilkan jumlah data master.

## Gambar 2 Struktur Navigasi Admin

## Perancangan Unified Modelling Language (UML)
Perancangan  Unified  Modelling Language  (UML)  yaitu menggunakan  Use Case Diagram, Activity  Diagram,  dan  Class  Diagram.  Pada  website  ini,  pengguna  aplikasi
terdiri  dari  pelanggan  dan  admin.  Pelanggan  atau  user  sebagai  pengguna  sistem sedangkan  admin  sebagai  pengelola  sistem.  Pelanggan  atau  user  dapat  mengakses website. Admin dapat melakukan verifikasi pesan kontak yang ada dan dapat mengelola data  keseluruhan.  Gambar  3  menyajikan  Use  Case  Diagram  User  dan  Gambar  4 menyajikan Use Case Diagram admin.

## Gambar 3 Use Case Diagram User

## Gambar 4 Use Case Diagram Admin

## Activity Diagram
Gambar 5 menyajikan activity diagram user atau pelanggan yang dapat dilakukan adalah melakukan transaksi pembelian secara online dan melakukan pengiriman pesan kepada pihak Hari Hari Pasar Swalayan.
Gambar 5 Activity Diagram User
Gambar 6 menyajikan activity diagram admin , yang dapat dilakukan adalah masuk ke  halaman  admin  setelah  login  terlebih  dahulu  selanjutnya  akan  menampilkan  data master yang berisi data lokasi dan data user. Kemudian, ada data transaksi dan laporan. Di halaman admin dapat mengolah data dengan menambah menghapus dan mengedit data serta dapat melihat tampilan laporan hasil data yang masuk pada bagian laporan.

## Class Diagram
Class Diagram website ini disajikan pada Gambar 7 berikut ini:

## Gambar 7 Class Diagram Activity
Perancangan Database
Database yang digunakan pada web ini dibuat dengan menggunakan PHPMyadmin. Penulis  membuat  nama  databasenya  dengan  tabel  Admin,  yang  digunakan  untuk menyimpan  data  admin  untuk  melakukan  akses  login  admin,  tabel  Lokasi,  yang digunakan untuk menampilkan data lokasi untuk melihat cabang lokasi dan tabel Kontak, yang digunakan untuk menampilkan data kontak dari Hari Hari Pasar Swalayan.

## Implementasi dan Ujicoba
Gambar  8  merupakan  halaman  home  yang  merupakan  halaman  awal  ketika  masuk website.  Pada  halaman  ini  terdapat  informasi  tentang  thumbnail,  konten  dan  layanan aplikasi website Hari Hari Pasar Swalayan.

## Gambar 8
Tampilan Halaman Home
Gambar  9  merupakan  halaman  promosi  katalog  yang  merupakan  halaman  untuk melihat promosi katalog pada Hari Hari Pasar Swalayan.

## Gambar 9 Tampilan Halaman Promosi Katalog
Gambar  10  merupakan  halaman  belanja  online  yang  merupakan  halaman  untuk melakukan  belanja  secara  online  melalui  sebuah cart kontak  whatsapp,  dari  masing- masing cabang Hari Hari Pasar Swalayan. Pada halaman ini pelanggan hanya mengklik tombol yang langsung masuk ke dalam api whatsapp.

## Gambar 10 Tampilan Halaman Belanja Online
Gambar 11 merupakan halaman lokasi untuk melihat informasi mengenai cabang Hari Hari Pasar Swalayan di seluruh jabodetabek.

## Gambar 11 Tampilan Halaman Lokasi
Gambar  12  merupakan  halaman  kontak  untuk  mengirim  informasi  pengaduan melalui  form  kontak  yang  dapat  dikirim  langsung  ke  halaman  admin  toko  hari  hari swalayan.

## Gambar 12 Tampilan Halaman Kontak
Gambar  13  adalah  tampilan  dari  halaman  Admin,  pada  halaman  ini  juga  dapat menambahkan data usernya.

## Gambar 13 Tampilan Halaman Admin
Gambar  14  adalah  tampilan  dari  halaman  admin  data  laporan.  Pada  halaman  ini terdapat laporan hasil jumlah dari 3 data yaitu data master user, data master lokasi dan transaksi data contact contact.

## Gambar 14

## Tampilan Halaman admin data laporan
Uji coba website ini menggunakan metode BlackBox Testing. Pengujian halaman website  dapat dilihat pada tabel 1 dan tabel 2.
Tabel 1 Pengujian Halaman Website Pelanggan No  Fungsi Skenario Hasil yang diharapkan Hasil 1 Belanja Online Masuk  ke  dalam  Api whatsapp hari-hari swalayan Masuk ke whatsapp milik hari-hari swalayan Sukses 2 Lokasi Toko Mencari lokasi toko cabang hari- hari swalayan Muncul daftar lokasi cabang  toko  hari-  hari swalayan Sukses 3 Kontak Mengisi  form  contact yang tersedia untuk pengaduan Pesan  terkirim  dan  tidak ada alert error Sukses Tabel 2 Pengujian Halaman Website Admin No Fungsi Skenario Hasil yang diharapkan Hasil 1 Login Admin Mengisi Username dan Password Muncul Notifikasi Login Berhasil Halaman Dialihkan Sukses 2 Tambah  Data  User Admin Mengisi  form  data user admin Muncul  Notifikasi  data berhasil ditambah Sukses 3 Edit Data User Admin Mengubah  data  user admin Muncul  Notifikasi  data berhasil diubah Sukses 4 Hapus  Data  User Admin Menghapus data user admin Muncul  Notifikasi  data berhasil dihapus Sukses 5 Tambah Data Lokasi  Menambah data lokasi Muncul  Notifikasi  data berhasil ditambah Sukses 6 Edit Data Lokasi Mengubah data lokasi Muncul  Notifikasi  data berhasil diubah Sukses 7 Hapus Data Lokasi Menghapus data lokasi Muncul  Notifikasi  data berhasil dihapus Sukses 8 Hapus Transaksi Data Contact Menghapus data contact Muncul Notifikasi data berhasil dihapus Sukses

## Spesifikasi Hardware dan Software
Perangkat keras yang digunakan untuk membuat website ini adalah sebuah laptop yang  memiliki  spesifikasi  sebagai  berikut:    Processor  Intel®  core™  i5-7200U  CPU @2.50Ghz(4CPUs),  ~2.7GHz,  GPU  Intel®  HD  Graphics  620,  Driver  Model  WWDM 2.1.  Sedangkan perangkat lunak yang digunakan Sistem Operasi Windows 10 Pro 64-bit, Xampp,  Visual  Studio  Code,  Browser  Google  Chrome,  Bahasa  Pemrograman  PHP, HTML, CSS dan Database MySQL.

## Kesimpulan
Company  profile berbasis  website  pada  Hari  Hari  Pasar  Swalayan  telah  berhasil dibuat sebagai media informasi dan promosi sehingga dapat memberikan kemudahan bagi para pelanggan untuk bertanya dan melihat berbagai macam promo produk dan informasi tentang  toko  swalayan,  mengetahui  informasi  promo  produk  serta  dapat  menghubungi melalui fitur kontak. Website ini terdapat informasi tentang promo, informasi kontak dan juga lokasi dari Hari Hari Pasar Swalayan melalui fitur yang tersedia di navigasi web. Berdasarkan uji coba maka diperoleh hasil  bahwa  dengan  menggunakan  web browser Google Chrome, website beserta fiturnya sukses berjalan dengan baik sesuai fungsinya. Adapun untuk pengembangan website selanjutnya adalah menambahkan fitur live chat agar  pelanggan  dapat  berinteraksi  secara  langsung  di  website  dan  menambahkan informasi  yang  lebih  lengkap  mengenai  produk  dan  promosi  produk  terbaru  serta membuat metode pembayaran langsung di website tanpa melalui api whatsapp.

## BIBLIOGRAFI
Abdulloh, Rohi. (2016). Easy & Simple Web Programming. Jakarta: PT. Elex Media Komputindo
Jaya,  T.  S.  (2018).  Pengujian  Aplikasi  dengan  Metode  Blackbox  Testing  Boundary Value  Analysis  (Studi  Kasus:  Kantor  Digital  Politeknik  Negeri  Lampung)”. Jurnal Informatika: Jurnal Pengembangan IT, 3(1), 45-48.
Jubilee  Enterprise.  (2016).  Pengenalan  HTML  dan  CSS.  Jakarta:  PT.  Elex  Media Komputindo
Ramadiani,  dkk.  (2016).  “Trace  Study  Menggunakan  Framework  Bootstrap”. Prosiding Seminar Ilmu Komputer dan Teknologi Informasi ISSN 2540-7902. Vol. 1, No. 1, September 2016.
Sukarno, Prayudi Suryo (2016). Rancang Bangun Company Profile Berbasis Web pada Instansi Pemerintahan Desa Padusan. Undergraduate thesis, Institut Bisnis dan Informatika Stikom Surabaya.
Supono dan Virdiandry Putratama. (2018). Pemrograman Web dengan Menggunakan PHP dan Framework Codeigniter, Ed. 1. Yogyakarta: CV. Budi Utama

## Copyright holder:
Oktaviani, Endah Kurniasari, Rosdiana, Witari Aryunani, Yeni Setiani (2022)
First publication right:
Syntax Literate: Jurnal Ilmiah Indonesia
This article is licensed under: