## RANCANG BANGUN PANDUAN PENCAK SILAT BERBASIS WEB MOBILE (STUDI KASUS PERSAUDARAAN SETIA HATI)
Ferdiyani Haris Sistem Informasi - STMIK  Palangkaraya Jl. G. Obos No. 114 Palangkaraya, Kalimantan Tengah E-mail : sabila006@gmail.com

## ABSTRAK
Dalam  dunia  programan website aplikasi  berbasis  mobile  tumbuh  dengan  sangat  pesat  sehingga bertambah banyaknya perangkat mobile phone, Jquery Mobile merupakan salah satu framework yang digunakan untuk membuat aplikasi web mobile. Jquery  Mobile merupakan framework yang dibangun di  atas jquery menyediakan  berbagai element antarmuka  pengguna  ( user  interface )  dalam  pembuatan aplikasi web  mobile .  Pencak  silat  adalah  olahraga  bela  diri  yang  terdiri  dari  gerakan  jasmani  yang lemah gemulai namun  penuh tenaga dan dilandasi dengan rohani yang berbudi luhur. Dalam bela diri pencak silat  ini mengandung unsur bela diri, olahraga, seni  dan budaya yang berisi  teknik pembelaan dan  penyerangan,  Aplikasi  panduan  pencak  silat  persaudaraan  setia  hati  terate  berbasis web  mobile bertujuan untuk memberikan informasi kepada anggota mengenai informasi pencak silat persaudaraan setia  hati  terate  palangkaraya  secara online .  Metode-metode  yang  digunakan  dalam  penelitian  ini meliputi  metode  pengumpulan  data  (observasi,  wawancara,  kepustakaan,  dokumentasi)  metode pengembangan sistem menggunakan waterfall, jenis penelitian  adalah penelitian dan pengembangan, metode pengujian menggunakan Black Box Testing.
Kata Kunci : Aplikasi, Framework, Jquery Mobile, Website

## Abstract
In the world of mobile-based application web site programming that has grown by greatly enhancing mobile devices, Jquery Mobile is one of the frameworks used to create mobile web applications. Jquery Mobile  is  a  framework  built  on  Jquery  providing  various  user  interface  elements  (user  interfaces)  in making  mobile  web  applications.  Pencak  silat  is a  martial  sport  that  consists  of  physical  movements that  are  graceful  but  full  of  strength  and  are  based  on  virtuous  soldiers.  In  martial  arts  martial  arts contain  elements of martial arts, sports, arts and culture that contain defense and assault techniques, the  application  of  pencak  silat  fraternity  applications  of  mobile  heart-based  mobile  terate  fraternity helps  provide  information  to  participants  information  on  martial  arts  fraternity  loyal  heart  terat palangkaraya  on  line  . The  methods  used  in  this study  include  data  collection  methods  (observation, interviews,  literature,  documentation)  system  development  methods  using  waterfalls,  the  type  of research is research and development, testing methods using Black Box Testing.
Keywords : Aplikasi, Framework, Jquery Mobile, Website

## 1. Pendahuluan
Seiring  dengan  perkembangan  teknologi  yang begitu pesat kebutuhan akan teknologi informasipun sangat  penting  dalam  segala  aspek  bidang kehidupan.  Salah  satunya  melalui  perkembangan internet yang merupakan salah satu media informasi yang telah terbukti sangat efektif dan efisien dalam menangani  sistem  pengolahan  data  maupun penyebaran informasi. Penyebaran informasi melalui perkembangan teknologi internet dapat diakses oleh siapa  saja,  kapan  saja  dan  dimana  saja  karena informasi  yang  dihasilkan  mengandung  nilai  yang benar,  cepat  dan  akurat.  Sehingga  dapat mendukung  keberhasilan  kinerja  pada  suatu
organisasi  baik  dalam  instansi  pemerintah  maupun swasta dalam mencapai tujuannya.
Pencak silat adalah olahraga bela diri yang terdiri dari  gerakan  jasmani  yang  lemah  gemulai  namun penuh  tenaga  dan  dilandasi  dengan  rohani  yang berbudi  luhur.  Dalam  bela  diri  pencak  silat  ini mengandung  unsur  bela  diri,  olahraga,  seni  dan budaya  yang  berisi  teknik  pembelaan  dan penyerangan Pencak silat merupakan olahraga bela diri khas dari Indonesia. Pencak Silat memiliki Badan resmi  yaitu  Ikatan  Pencak  Silat  Seluruh  Indonesia (IPSI).
Berdasarkan  observasi  yang  dilakukan  penulis pada  komesariat  cabang  Persaudaraan  Setia  Hati
Terate di Palangkaraya masih banyak anggota yang belum  menguasai  materi  berupa  Pukulan, Tendangan,  Bantingan,  dan  jurus  serta  sebagian anggota masih ada yang belum mengenali sesama anggota  PSHT  di  Palangkaraya.  Ketua  cabang PSHT  Palangkaraya  sangat  mengharapkan  adanya aplikasi  untuk  mengatasi  permasalahan  tersebut. Karena  dengan  adanya  aplikasi  ini  nantinya  akan mempermudah pelatih memberi materi kepada siswa persaudaraan  setia  hati  terate.  Penelitian  ini menggunakan Web  Mobile karena  aplikasi  ini  bisa diakses  kapan  saja  dan  dimana  saja,  hanya memerlukan  koneksi internet dan  perangkat handphone jenis  apa  saja  yang  memiliki  jaringan internet dan  juga  bisa  diakses  menggunakan komputer atau laptop.
2. Kajian Teori
A. Panduan
Menurut  kamus  besar  bahasa  Indonesia,  kata panduan  berasal  dari  kata  Pandu  yang  berarti penunjuk jalan atau perintis jalan, sedangkan untuk kata pandu sendiri dalam buku berarti petunjuk.
B. Pencak Silat Menurut  Syukur  dalam  Sucipto,  (2001:26- mengatakan  Pencak  adalah  gerakan  langkah keindahan  dengan  menghindar,  yang  disertakan gerakan  berunsur  komedi.  Pencak  dapat dipertontonkan sebagai sarana hiburan. Sedangkan silat  adalah  unsur  teknik  bela  diri  menangkis, menyerang  dan  mengunci  yang  tidak  dapat diperagakan di depan umum.

## C. Web Mobile
Web Mobile adalah halaman web yang dapat di akses  dengan  menggunakan  perangkat  komunikasi tanpa terkendala ruang dan waktu. Menurut  Prasetyo  (2005)  mengatakan  bahwa Web Mobile adalah  sebuah  teknologi  baru  yang  telah mengakomodasi  kebutuhan  akan  akses internet melalui  perangkat mobile (bergerak).  Jika sebelumnya web hanya  dapat  di  akses  melalui komputer,  maka  dengan  adanya  teknologi web mobile, sebuah web akan  dapat  diakses  melalui perangkat mobile  (Ponsel, PDA,  Tablet, dan Smatphone) yang  terhubung pada  sebuah  jaringan telekomunikasi.
D. Black Box Testing Menurut  Pressman  (2001:459)  pada  pengujian Black-Box ,  pengujian  dilakukan  dengan  objek  yang diuji  terfokus  kepada  kebutuhan  fungsional  dari perangkat lunak. Pengujian Black-Box memungkinkan  pembuat  perangkat  lunak  untuk menentukan  kondisi  yang  terjadi  untuk  suatu masukan yang akan menjalankan semua kebutuhan fungsional dari perangkat lunak yang dibuat.
E. Xampp
Menurut  Riyanto  (2011:9),  XAMPP  merupakan paket PHP dan MySQL berbasis Open Source , yang dapat  digunakan  sebagai Tool pembantu pengembangan aplikasi berbasis PHP.
Fungsinya  adalah  sebagai server yang  berdiri sendiri ( localhost ), yang terdiri atas program Apache HTTP Server ,  MySQL Database ,  dan  penerjemah bahasa  yang  ditulis  dengan  bahasa  pemrograman PHP dan Perl . Nama XAMPP merupakan singkatan dari  X  (empat  sistem  operasi  apapun), Apache , MySQL, PHP, dan Perl. Program ini tersedia dalam GNU  ( General  Public  License )  dan  bebas, merupakan Web  Server yang  mudah  digunakan yang  dapat  melayani  tampilan  halaman Web yang dinamis.

## 3. Perancangan Sistem
Pada  tahap  desain  proses  ini,  penulis menggunakan  notasi  UML  ( Unified  Modeling Language), sebagai case  tool dalam  merancang proses Website ,  yakni  dengan  membuat Use Case Diagram,  Activity  Diagram,  Class  Diagram dan Sequence Diagram.
A. Use Case Diagram Diagram use  case mendeskripsikan  sebuah interaksi antara satu atau lebih aktor dengan sistem yang  akan  dibuat.  Diagram use  case digunakan untuk mengetahui fungsi apa saja yang ada di dalam sebuah  sistem  dan  siapa  saja  yang  berhak menggunakan  fungsi-fungsi tersebut.  Sebuah use case merepresentasikan  sebuah  interaksi  antara aktor ( user atau sistem lainya) dengan sistem. Use case menjelaskan  secara  sederhana  fungsi  sistem dari sudut pandang user .
Gambar 1. Use Case Diagram
B. Class Diagram Class  diagram menggambarkan  struktur  dan deskripsi class , package dan  objek  beserta hubungan  satu  sama  lain  seperti containment , pewarisan,  asosiasi,  dan  lain-lain.  C lass  diagram dapat dilihat pada gambar 2 :
Gambar 2. Class Diagram
C. Activity Diagram Gambar berikut merupakan activity diagram data anggota : Gambar 3. Activity Diagram Kelola data anggota D. Sequence Diagram Gambar  berikut  merupakan sequence  diagram data anggota : Gambar 4. Sequence diagram kelola data anggota

## 4. Implementasi Dan Pembahasan
Aplikasi ini dapat berjalan dengan ketentuan
:
1) Perangkat laptop atau handphone memiliki web browser dan jaringan internet;
2) telah  terdaftar  di  aplikasi  panduan  pencak  silat persaudaraan setia hati terate;
3) meinputkan link.
Black  box  testing  yang  dilakukan  meliputi beberapa pengujian yang dapat dikelompokan pada tabel 1.
Nama Pengujian Kriteria Evaluasi Hasil Login Ketik URL Login Masukan username dan password Login Salah  memasukan username dan password Menampilkan  pesan  salah masukan username dan password dan menampilkan halaman login kembali Halaman Beranda Mengirim pesan di chatting group Admin dan anggota dapat melihat pesan. Admin ditandai dengan warna orange sedangkan anggota warna hitam Halaman materi Pilih  menu  materi  Menampilkan pukulan  tendangan  bantingan  dan jurus. Halaman materi silat Pilih  kategori  materi  Menampilkan daftar list kategori materi Halaman materi silat Pilih  daftar  list  kategori  materi  dan sentuh play Menjalankan video Halaman Anggota Pilih menu anggota Menampilkan daftar anggota Halaman Anggota Pilih  salah  satu  daftar  anggota Menampilkan biodata anggota Halaman keSHan Pilih  menu  KeSHan  Menampilkan sejarah, makna dan lambang, semboyan  dan  falsafah,  tingkatan  dan senjata Halaman keSHan Sentuh  salah  satu  list    keSHan Menampilkan penjelasan logout Sentuh  tombol logout Kembali  ke halaman login
Gambar 5. Halaman login
Gambar 6. Halaman beranda
Gambar 7. Halaman Materi silat Gambar 8. Halaman Tambah Materi Gambar 9. Halaman Anggota Gambar 10. Halaman Tambah Anggota
Gambar 11. Halaman Info

## Gambar 12. Halaman KeSHan
5. Kesimpulan dan Saran
A. Kesimpulan
1) Aplikasi website telah  berhasil  dibuat dengan  menggunakan  bahasa  pemrograman framework jquery  mobile dan  alat  bantu  dalam program web yaitu javascript yang  digunakan untuk  membuat  sebuah  aplikasi web  mobile. Database yang  digunakan  berbasis Struktured Query Languange (SQL) yaitu MySQL . 2)
Hasil  dari  pengujian black  box Aplikasi Panduan  Pencak  Silat  Persaudaraan  Setia  Hati Terate  Berbasis Web  Mobile Menggunakan
Framework  Jquery  Mobile sesuai harapan penulis .

## B. Saran
1) Sistem ini hendaknya lebih ditingkatkan lagi dari segi penyajian informasi yang lebik banyak baik berupa  pengajaran  materi  pencak  silat  untuk anggota  Persaudaraan  Setia  Hati  Terate palangkaraya melalui aplikasi web mobile ini..
2) Dapat  ditambahkan  materi  materi  yang  baru apabila  terdapat  materi  yang  belum  dimasukan dan dipublikasikan.
Daftar Pustaka
Andi. 2013. Pengembang Aplikasi Web Mobile. Setia Kawan Peras, Jakarta Elbarnaz.  2000. Dimensi  Moralitas  Dalam  Pencak
Silat. Andi. Yogyakarta. Habibi. 2009. Sejarah Pencak Silat Indonesia (Studi Historis Perkembangan PSHT Di  Madiun Periode Tahun 1922-2000) . Institut Agama Islam Negeri Sunan Kalihaga. Yogyakarta Hakim,  2010. Bikin  Website  Super  Keren  Dengan PHP & jQuery . Lokomedia. Yogyakarta Haris,  Ferdiyani.  2018. Rancang  Bangun  Aplikasi Ensiklopedia Berbasis Android . Jurnal Sains
Komputer  dan  Teknologi  Informasi.  Vol  1
Issue 1 e-ISSN 2655-7460. https://doi.org/10.33084/jsakti.v1i1.448 Kamus Besar Bahasa Indonesia, 2005. Graha Ilmu, Jakarta Madcoms.  2009. Aplikasi  Program  PHP  +  MySQL
Untuk  Membuat  Website  Interaktif ,  Andi, Yogyakarta. Nugroho.  2010. Rekayasa  Perangkat  Lunak Menggunakan  UML  dan  JAVA. Andi, Yogyakarta Riyanto  2011, Membuat  Sendiri  Aplikasi  E- commerce  dengan  PHP  dan  MySQL Menggunakan Codeigniter dan JQuery. Andi,
Yogyakarta. Sadeli,  Muhammad.  2011. 7  Jam  Belajar  Interaktif Dreamweaver  CS5  untuk  Orang Awam: Maxikom, Palembang.
Sam’ani. Annisa,  S.,  Heri.,  2018. Rancang  Bangun Aplikasi  Pengawasan  Dan  Pengendalian Komputer  Laboratorium  Multimedia  STMIK Palangkaraya .  Jurnal  Sains  Komputer  dan Teknologi  Informasi.  Vol  1  Issue  1  e-ISSN 2655-7460. https://doi.org/10.33084/jsakti.v1i1.548 Sam’ani, Qamaruzzaman,  M.  H,  2019. Rancang Bangun  Visualisasi  Pembelajaran  Berbasis Android Untuk Anak . Jurnal SISTEMASI. Vol 8 No 3 e-ISSN 2540-9719. https://doi.org/10.32520/stmsi.v8i3.518 Sammervile. 2010. Software Engineering (Rekayasa Perangkat Lunak). Erlangga. Jakarta Septian  Gugun .,  2011.  “ Trik  Pintar  Menguasai CodeIgniter”, Jakarta  :  PT  Alex  Media Komputindo.
Sondakh,  2009.  “ Olahraga  Prestasi”, Elex  Media Komputindo, Jakarta.
.