Institutional Repository | Satya Wacana Christian University: Perancangan dan Implementasi Sistem Informasi Keanggotaan dan Kegiatan GMKI Berbasis Web

  

Perancangan dan Implementasi Sistem Informasi Keanggotaan dan

Kegiatan GMKI Berbasis Web

Artikel Ilmiah

  

Peneliti:

Friza Meilani Sudirman (672014183)

Nina Setyawati, S.Kom., M.Cs.

  

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

  

Januari 2018

  

Perancangan dan Implementasi Sistem Informasi Keanggotaan dan

Kegiatan GMKI Berbasis Web

Artikel Ilmiah

  

Diajukan kepada

Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

  

Peneliti:

Friza Meilani Sudirman (672014183)

Nina Setyawati, S.Kom., M.Cs.

  

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

  

Januari 2018

  

Perancangan dan Implementasi Sistem Informasi

Keanggotaan dan Kegiatan GMKI Berbasis Web

_{1) 2)}

Friza Meilani Sudirman, Nina Setiyawati

  

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Jalan Dr. O. Notohamidjojo, Blotongan, Sidorejo, Salatiga 50715, Indonesia

_{1) 2)}

  

Email : 672014183@student.uksw.edu, nina.setiyawati@staff.uksw.edu

Abstract

  

GMKI is one of an colleger organization which implement management process that involve

many and variety data. GMKI doesn't have an integration system to ease central and branch

committee. A system to organize data especially in member and event registration unit.

Member and event data have been processing using file excel, therefore data processing is

difficult and potentially error. In this research, information system is built to help GMKI

process the data especially in member and event registration unit. The system is built in web-

based application using PHP, MySQL as the database and Bootstrap framework. The results

of the user test show that the GMKI information system helps the GMKI information system

helps central administrators and branch committee control member and activity data because

the system has been integrated so that data can be accessed by the central and branch

committee of GMKI, the system also helps the committee in delivering information about

GMKI, helps public and GMKI's member effectively and efficiently.

  Keywords: Member Registration, Event Registration, Bootstrap Framework, GMKI.

  

Abstrak

Gerakan Mahasiswa Kristen Indonesia (GMKI) sebagai salah satu organisasi mahasiswa yang

melaksanakan proses manajemen yang melibatkan data yang banyak dan beragam. GMKI

saat ini masih belum memiliki sistem yang terintegrasi untuk mempermudah pengurus pusat

maupun cabang GMKI untuk mengolah data terutama bagian registrasi anggota dan registrasi

kegiatan. Pengolahan data anggota dan data kegiatan selama ini masih dilakukan dengan

menggunakan file excel, sehingga pengolahan data sulit dan rawan terjadi kesalahan. Pada

penelitian ini dilakukan pembangunan sistem informasi yang dapat membantu GMKI

mengolah data terutama pada bagian registrasi anggota dan kegiatan organisasi. Sistem yang

dibangun berupa aplikasi berbasis web dengan mengunakan bahasa pemrograman PHP dan

MySQL sebagai database, dan framework Bootsrap. Hasil dari uji pengguna menunjukan

bahwa sistem informasi GMKI membantu pengurus pusat dan pengurus cabang mengontrol

data anggota dan data kegiatan karena sistem telah terintegrasi sehingga data dapat diakses

oleh pengurus pusat maupun cabang GMKI, selain itu sistem juga membantu pengurus

menyampaikan informasi seputar GMKI dan membantu masyarakat umum serta anggota

GMKI itu sendiri mengetahui informasi terbaru GMKI secara lebih efektif dan efisien.

  

Kata Kunci: Registrasi Anggota, Registrasi Kegiatan, Framework Bootstrap, GMKI.

  Data merupakan sekumpulan fakta mentah yang mewakili kejadian-kejadian yang terjadi dalam organisasi atau lingkungan fisik perusahaan [1]. Setiap organisasi membutuhkan dan menghasilkan data dalam melakukan proses manajemennya. Gerakan Mahasiswa Kristen Indonesia (GMKI) sebagai salah satu organisasi mahasiswa yang melaksanakan proses manajemen yang melibatkan data yang banyak dan beragam, meliputi data anggota, kegiatan organisasi, dokumen kongres, berita, petisi, opini, serta informasi cabang GMKI.

  Pendataan anggota merupakan salah satu proses manajemen data yang utama dalam GMKI. Proses pendataan anggota memiliki proses yang panjang, salah satu proses yang penting didalamnya adalah registrasi anggota. Registrasi anggota diawali proses pendaftaran di kantor pengurus cabang berdasarkan daerah yang dekat dengan tempat tinggal calon anggota. Calon anggota yang mendaftar harus mengikuti dan lolos masa perkenalan (maper) untuk menjadi anggota tetap GMKI. Proses manajemen data GMKI lainnya adalah dokumentasi kegiatan yang ada di dalam organisasi ini, baik berupa pegumuman kegiatan dan respon anggota mengenai kegitaan yang diadakan.

  Berdasarkan analisis yang dilakukan terhadap proses registrasi anggota dan kegiatan organisasi didapatkan beberapa kekurangan. Proses registrasi anggota dan kegiatan organisasi masih belum memiliki sistem yang terintegrasi untuk mempermudah pengurus pusat maupun cabang GMKI untuk mengolah data, karena selama ini data tersimpan dalam bentuk file excel, sehingga pengolahan data sulit dan rawan akan kesalahan, seperti ketidaksamaan antara data anggota yang ada dalam dokumen pengurus cabang dengan data anggota yang ada dalam dokumen pengurus pusat.

  Berdasarkan masalah tersebut maka diperlukan sistem yang terintegrasi untuk dapat mempermudah pengolahan data. Data tersebut disusun dan dikelola dalam sebuah sistem informasi. Sistem informasi dapat berupa kombinasi dari manusia, perangkat keras, piranti lunak, jaringan komunikasi dan data yang mengumpulkan, mengolah dan mendistribusikan informasi dalam sebuah organisasi [2]. Sistem informasi yang tepat untuk proses manajemen data GMKI yaitu sistem informasi berbasis web, karena sistem informasi berbasis web akan lebih mempermudah dalam pengaksesan, dapat dilakukan dimanapun kapanpun tanpa harus melakukan penginstalan, hanya dengan mengaksesnya melalui browser, serta dapat diakses dengan sistem operasi manapun dan juga tidak perlu spesifikasi komputer yang tinggi [3].

  Sistem informasi GMKI nantinya diharapkan dapat membantu pengurus dalam menyampaikan informasi seputar GMKI kepada anggota serta guest, mengontrol dan mengatur data anggota, mengontrol kehadiran anggota dari setiap kegiatan yang diadakan, memantau perkembangan dari setiap cabang GMKI, serta menjadi sarana untuk setiap pengurus cabang GMKI menyampaikan informasi mengenai cabang yang diatasi. Sedangkan pada sisi anggota, sistem informasi ini juga membantu untuk para anggota GMKI mendapatkan informasi baik mengenai berita, maupun kegiatan yang diadakan oleh pengurus GMKI, serta dapat langsung melakukan registrasi anggota, melakukan petisi, dan melakukan respon kegiatan yang diadakan oleh pengurus GMKI. Oleh karena itu, manajemen data GMKI dapat menjadi efektif dan efisien.

  Sistem informasi GMKI mempunyai 4 user yaitu administrator pusat, administrator cabang, anggota tetap, dan guest dengan hak akses masing-masing. Sistem informasi GMKI ini dibangun menggunakan Framework Bootstrap agar lebih responsif untuk semua platform, bahasa pemrograman PHP dan MySQL sebagai

  database .

  Berdasarkan latar belakang yang telah dijelaskan, didapatkan rumusan masalah dari penelitian ini yaitu bagaimana membangun sistem informasi yang dapat membantu GMKI mengolah data terutama pada bagian registrasi anggota dan kegiatan organisasi.

  Terdapat beberapa penelitian mengenai sistem informasi keanggotaan dan kegiatan berbasis web yang telah dilakukan sebelumnya. Salah satunya adalah penelitian mengenai perancangan sistem informasi manajemen kegiatan pertemuan Pejabat Pembuat Komitmen (PKK) Universitas Satya Negara Indonesia (USNI) berbasis web. Penelitian ini merancang suatu sistem informasi menggunakan PHP dan MySQL untuk dapat membantu PKK USNI mengorganisasikan kegiatan pertemuan yang dilaksanakan, dan membantu mendokumentasikannya, memudahkan pengguna dalam mengoptimalkan penjadwalan kegiatan dengan tepat waktu, serta memudahkan mahasiswa mendapat informasi mengenai kegiatan yang diadakan PPK USNI [4].

  Penelitian kedua adalah perancangan dan implementasi sistem informasi manajemen anggota Gereja GKI Calvaria Angkasapura-Jayapura berbasis web menggunakan teknologi HMVC (Hierarchichal Model, View, Controller). Penelitian ini bertujuan untuk merancang dan membuat sistem informasi Gereja GKI Calvaria Angkasapura-Jayapura sebagai pusat informasi data statistik jemaat, majelis, pendeta serta mempermudah dalam pendataan artikel, bacaan, galeri GKI menggunakan teknologi HMVC yang dibuat seperti mengatur modul-modul yang terpisah berdasarkan pengguna web agar memudahkan peneliti dalam mengatur data serta batasan hak akses dari setiap pengguna [5].

  Penelitian ketiga mengenai pembangunan sistem informasi menggunakan

  

Framework Bootstrap yang telah dilakukan juga sebelumnya. Penelitian dengan judul

  “Implementasi Bootstrap pada Sistem Informasi Perpustakaan untuk Meningkatkan

Pelayanan Mahasiswa pada Perguruan Tinggi Raharja” yang bertujuan untuk membangun sistem informasi perpustakaan yang memiliki tampilan yang responsif

  untuk menunjang pelayanan terhadap mahasiswa, membantu menghasilkan laporan peminjaman buku, laporan pengembalian buku, mengetahui koleksi buku yang disimpan, mengetahui data anggota perpustakaan dan mengetahui data petugas perpustakaan [6].

  Berdasarkan penelitian sebelumnya, sistem informasi berbasis web yang telah dirancang dan dibuat mempermudah organisasi dalam pengelolaan data keanggotaan dan pengelolaan manajemen kegiatan organisasi. Sistem informasi berbasis web dibuat bukan sekedar bertujuan untuk mempermudah proses manajemen didalam organisasi saja, namun dapat sekaligus sebagai sarana untuk memberikan informasi kepada masyarakat luas tentang informasi perihal organisasi itu sendiri. Oleh karena pengguna sistem informasi bukan hanya dari kalangan internal organisasi, maka sistem informasi harus dibuat menarik dan responsif untuk semua platform. Sama dengan penelitian ketiga sistem informasi berbasis web dibagun dengan Framework

  

Bootstrap untuk mendapatkan tampilan web yang responsif sehingga pengguna dapat

mudah dalam mengaksesnya.

  Jika dibandingkan pada penelitian sebelumnya penelitian ini berfokus pada proses registrasi anggota dan proses registrasi kegiatan sehingga bagaimana keamanan data tidak dibahas dalam bahasan ini. Selain itu fokus dari penelitian ini adalah bagaimana menyelesaikan permasalahan yang ada sehingga dapat membantu meningkatkan kinerja dari pengurus pusat serta pengurus cabang GMKI untuk mengelola data dan membantu anggota serta masyarakat luas mengetahui informasi seputar GMKI.

  Sistem informasi adalah suatu sistem dalam suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian yang mendukung fungsi operasi organisasi yang bersifat manajerial dengan kegiatan strategi dari suatu organisasi untuk dapat menyediakan kepada pihak luar tertentu dengan informasi yang diperlukan untuk pengambilan keputusan. [7].

  Web adalah suatu metode untuk menampilan informasi di internet, baik berupa

  teks, gambar, suara maupun video yang interaktif dan mempunyai kelebihan untuk menghubungkan (link) satu dokumen dengan dokumen lainnya (hypertext) yang dapat diakses melalui sebuah browser [8].

  Framework dapat didefinisikan sebagai kumpulan script (terutama class dan

function ) yang dapat membantu developer dalam menangani berbagai masalah dalam

  pemrograman seperti koneksi ke database, pemanggilan variabel dan fungsi-fungsi lainnya sehingga developer dapat lebih fokus dan lebih cepat membangun aplikasi [9].

  Bootstrap merupakan framework yang biasa digunakan untuk membuat aplikasi

web ataupun situs web responsif secara cepat, mudah dan gratis. Twitter Bootstrap

  adalah framework CSS open source yang awalnya dikembangkan oleh tim twitter untuk para web designer yang terdiri dari CSS dan HTML untuk menghasilkan Grid,

  

Layout, Typography, Table, Form, Navigation dan lain-lain. Selain itu, di dalam

Bootstrap juga sudah terdapat jQuery plugins untuk menghasilkan komponen user

interface yang lebih menarik seperti Transitions, Modal, Dropdown, Scrollspy,

Tooltip, Tab, Alert dan lain-lain [10].

  PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995. Pada saat tersebut PHP adalah sekumpulan script yang digunakan untuk mengolah data dari

  

form dari suatu web. Berbeda dengan javascript yang eksekusinya dilakukan di

browser (client), PHP dijalankan di dalam server. Karena berjalan di server maka

  PHP biasanya digunakan sebagai back-end untuk mengakses data yang ada dalam database seperti MySQL, Oracle, dan lain sebagainya [11].

  MySQL adalah sebuah implementasi dari sistem manajemen basis data relasional (RDBMS) yang didistribusikan secara gratis dibawah lisensi GPL (General

  

Public License ). Setiap pengguna dapat secara bebas menggunakan MySQL, namun

  dengan batasan perangkat lunak tersebut tidak boleh dijadikan produk turunan yang bersifat komersial. MySQL sebenarnya merupakan turunan salah satu konsep utama dalam basis data yang telah ada sebelumnya yaitu SQL (Structured Query Language) [12].

  Gerakan Mahasiswa Kristen Indonesia adaVisi organisasi ini adalah terwujudnya kedamaian, kesejahteraan, keadilan, kebenaran, keutuhan ciptaan dan demokrasi di Indonesia berdasarkan kasih. Misi organisasi ini adalah a) mengajak mahasiswa dan warga perguruan tinggi lainnya kepada pengenalan akan Yesus Kristus selaku Tuhan dan Penebus dan memperdalam iman dalam kehidupan dan pekerjaan sehari-hari, b) membina kesadaran selaku warga gereja yang esa di tengah-tengah mahasiswa dan perguruan tinggi dalam kesaksian memperbaharui masyarakat, manusia dan gereja, c) mempersiapkan pemimpin dan penggerak yang ahli dan bertanggung jawab dengan menjalankan panggilan di tengah-tengah masyarakat, negara, gereja, perguruan tinggi dan mahasiswa, dan menjadi sarana bagi terwujudnya kesejahteraan, perdamaian, keadilan, kebenaran dan cinta kasih di tengah-tengah manusia dan alam semesta [13].

  Penelitian ini dilakukan dan diselesaikan melalui 5 tahapan penelitian yaitu: 1) Analisis kebutuhan, 2) Perancangan sistem, 3) Implementasi sistem, 4) Pengujian sistem serta analisis hasil pengujian, dan 5) Penulisan laporan hasil penelitian.

  8 Makassar, Tana Toraja, Kendari, Mamasa, Mamuju, Palopo, Polewali Mandar

  Pengurus pusat maupun pengurus cabang mempunyai kendala dalam mengelola data anggota dan data kegiatan karena banyaknya anggota yang tersebar di banyak cabang, sehingga membutuhkan sistem yang terintegrasi untuk membantu proses registrasi anggota dan registrasi kegiatan. Sebelumnya, pengurus GMKI menyimpan data hanya dalam file excel sehingga sangat rentan untuk terjadi kesalahan.

  15 Ternate, Tobelo, Bacan, Jailolo

  14 Pontianak, Bengkayang, Sintang

  13 Dumai, Batam, Pekanbaru, Padang, Tanjungpinang

  12 Jayapura, Fak-Fak, Biak, Sorong, Serui, Sentani, Merauke, Manokwari, Nabire, Kaimana, Wamena

  11 Ambon, Tual, Masohi, Saumlaki

  10 Manado, Tondano, Tomohon, Kotamobagu, Bitung, Airmadidi

  9 Palu, Luwuk Banggai, Tentena, Poso

  7 Kefamenanu, Kupang, Kalabahi, Ende, Tambolaka, Ba'a, Waingapu

  Tahapan-tahapan yang dilakukan dalam penelitian ini dapat dilihat pada Gambar 1.

  6 Samarinda, Balikpapan, Banjarbaru, Banjarmasin, Palangkaraya, Tarakan

  5 Surabaya, Malang, Mataram, Denpasar, Badung

  4 Yogyakarta, Purwokerto, Salatiga, Semarang, Surakarta

  3 Jakarta, Bandung, Bekasi, Bogor, Depok, Jakarta Barat, Sumedang, Serang

  2 Bandar Lampung, Jambi, Bengkulu, Palembang

  1 Medan, Kutacane, Sidikalang, Sibolga, Gunung Sitoli, Pematangsiantar, Padang Sidempuan, Tarutung, Kabanjahe, Teluk Dalam, Rantauprapat

  Tabel 1. Cabang GMKI Berdasarkan Wilayah Wilayah Kota Cabang

  Berdasarkan bagan pada Gambar 1 dapat dijelaskan bahwa tahap pertama yang dilakukan adalah menganalisis kebutuhan, dimana dilakukan pencarian informasi mengenai kebutuhan dari pengguna yang berhubungan dengan permasalahan GMKI, dengan melakukan wawancara secara langsung kepada Ketua Bidang Media Komunikasi Informasi GMKI, Bob Humisar Simbolon. Berdasarkan hasil wawancara didapatkan informasi bahwa GMKI mempunyai 90 cabang yang dibagi menjadi 15 wilayah (Tabel 1), dan mempunyai 53.144 anggota tetap dari semua cabang GMKI (data tahun 2017).

  Gambar 1. Tahapan Penelitian

  Tahap selanjutnya yaitu perancangan sistem, implementasi sistem, dan pengujian sistem serta analisis hasil pengujian, dilakukan dengan metode prototype, karena selama proses pengembangan dilakukan komunikasi secara intensif dengan pengguna. Pengembagan perangkat lunak dengan metode ini dilakukan secara bertahap, yaitu dengan membuat prototype yang sederhana, prototype tersebut akan dikembangkan dari waktu ke waktu hingga perangkat lunak selesai dikembangkan atau sudah sesuai dengan kebutuhan dari pengguna [14]. Tahap-tahap yang dilakukan pada metode prototype ditunjukan pada Gambar 2.

  

Gambar 2. Metode Prototype [14]

  Berdasarkan bagan pada Gambar 2 dapat dijelaskan bahwa tahapan pembangunan sistem metode prototype adalah sebagai berikut:

  Prototype 1 a.

Listen to customer, yaitu melakukan wawancara dengan pengurus GMKI untuk mengetahui informasi mengenai kebutuhan pengguna yang akan

  diimplementasikan dalam sistem. Berdasarkan informasi yang telah diperoleh dari wawancara dengan Bob Humisar Simbolon, didapatkan informasi mengenai aturan untuk menjadi anggota tetap GMKI dan aturan mengikuti kegiatan yang dilaksanakan oleh GMKI. Adapun aturan untuk menjadi anggota tetap adalah sebagai berikut: 1) Data anggota terdaftar di pengurus cabang (cabang berdasarkan tempat tinggal), 2) Mengikuti masa perkenalan (maper) yang diadakan oleh pengurus cabang, 3) Data anggota terdaftar, 4) Anggota mempunyai nomor anggota. Berdasarkan aturan yang ada dapat dibuat flowchart seperti pada Gambar 3.

  Gambar 3. Flowchart Registrasi Anggota Menggunakan Cara Manual

  Gambar 3 terlihat bahwa calon anggota harus mendaftarkan diri ke kantor pengurus cabang, cabang yang dipilih berdasarkan cabang yang dekat dengan tempat tinggal. Setelah melakukan pendaftaran, calon anggota mengikuti maper yang dilakukan oleh pengurus cabang. Jika tidak lolos maper, maka calon anggota harus mengulang maper. Jika lolos maper, maka data calon anggota akan masuk ke pengurus pusat dan diberikan nomor anggota sebagai bukti telah menjadi anggota tetap. Adapun aturan untuk mengikuti kegiatan adalah sebagai berikut: 1) Peserta kegiatan adalah anggota tetap GMKI, 2) Telah melakukan registrasi di kantor cabang atau kantor pusat GMKI untuk bersedia mengikuti kegiatan.

  b.

  Build / revise mock-up. Pada tahap kedua dari model prototype yaitu diawali dengan membuat flowchart baru berdasarkan flowchart yang sudah ada dan aturan registrasi anggota dan registrasi kegiatan yang akan diterapkan pada sistem informasi GMKI. Berikut adalah flowchart registrasi anggota yang ditunjukan pada Gambar 4.

  

Gambar 4. Flowchart Registrasi Anggota Menggunakan Sistem

  Gambar 4 menunjukkan alur registrasi anggota GMKI, yang diawali dengan mendaftarkan diri melalui web GMKI. Jika data yang dimasukkan sudah benar maka pendaftar harus mengikuti maper. Jika pendaftar lolos maper maka data pendaftar akan diverifikasi oleh pengurus cabang menjadi data anggota cabang dan tetap, sehingga anggota mendapatkan nomor serta hak akses untuk login ke

web GMKI. Adapun flowchart registrasi kegiatan ditunjukkan pada Gambar 5.

  

Gambar 5. Flowchart Registrasi Kegiatan Gambar 5 menunjukkan alur registrasi kegiatan, yang diawali dengan anggota melakukan login pada web GMKI. Jika data yang dimasukkan benar maka anggota dapat form registrasi kegiatan GMKI. Jika data pada form registrasi benar maka data akan disimpan. Jika anggota memilih tidak mengikuti kegiatan maka proses registrasi selesai, jika anggota memilih mengikuti kegiatan maka anggota harus hadir dalam kegiatan berdasarkan tempat dan waktu yang telah ditentukan. Dalam tahap ini juga dilakukan perancangan sistem dalam bentuk diagram UML (Unified Modeling Language). Diagram UML yang dibangun meliputi use case

  

diagram , activity diagram dan relasi database. Berikut ini akan dijelaskan use

case diagram yang ditunjukkan pada Gambar 6.

  

Gambar 6. Use Case Diagram

  Gambar 6 merupakan use case diagram yang menjelaskan bagaimana sistem informasi akan dibuat. Sistem ini memiliki 4 aktor yaitu administrator pusat, administrator cabang, anggota tetap, guest. Aktor administrator pusat mempunyai hak akses yang paling tinggi, sehingga dapat melakukan semua pengolahan data, yaitu: mengelola data anggota tetap, anggota cabang, pendaftar, kegiatan, registrasi kegiatan. Aktor administrator cabang mempunyai hak akses untuk mengelola data anggota cabang dan data pendaftar berdasarkan masing-masing cabang yang ditempati, melihat data anggota tetap, melihat data kegiatan, dan melihat data registrasi kegiatan. Aktor anggota mempunyai hak akses untuk melihat data anggota tetap, melihat data anggota cabang, melihat data kegiatan, serta melakukan registrasi sebagai anggota tetap dan registrasi (respon) kegiatan.

  

Guest mempunyai hak akses yang paling rendah, yaitu hanya dapat melihat data

  anggota tetap dan data anggota cabang, serta mendaftarkan diri menjadi calon anggota jika berminat. Berdasarkan use case diagram yang telah dibuat, berikut akan dijelaskan activity diagram registrasi anggota yang akan ditunjukkan pada Gambar 7.

  

Gambar 7. Activity Diagram Registrasi Anggota

  Gambar 7 menggambarkan proses registrasi pendaftaran untuk menjadi anggota GMKI. Aktivitas dimulai dari pendaftar atau calon anggota melakukan registrasi melalui portal web

GMKI di menu “Ayo Gabung GMKI” dengan mengisi data diri pada form pendaftaran anggota GMKI. Sistem akan melakukan validasi data

  jika pendaftar tidak memasukkan data dengan benar maka sistem akan memberi peringatan kepada pendaftar dan akan diarahkan ke form pendaftaran untuk mengisi ulang, jika pendaftar memasukkan data benar maka data akan disimpan ke dalam data pendaftar. Pengurus cabang akan memberikan informasi mengenai maper. Para pendaftar mempunyai kewajiban untuk mengikuti maper yang diadakan oleh pengurus cabang. Data pendaftar yang lolos maper akan diverifikasi dengan menambahkan tahun maper oleh pengurus cabang untuk menjadi anggota cabang, kemudian akan diverifikasi kembali oleh pengurus cabang untuk menjadi anggota tetap dan sistem secara otomatis membuat nomor anggota sebagai

  

username dan membuat password secara random untuk anggota dapat login di

web GMKI ini dengan akun tersebut. Aktivitas akan selesai ketika sistem akan

  mengirim email yang berisi informasi keanggotaan secara otomatis ke setiap alamat email anggota. Adapun activity diagram kegiatan ditunjukkan pada Gambar 8.

  

Gambar 8. Activity Diagram Registrasi Kegiatan Gambar 8 menggambarkan proses registrasi kegiatan. Aktivitas dimulai dari anggota melakukan login pada portal web GMKI di menu “Login” dengan mengisi

  username dan password. Sistem akan melakukan validasi data, jika anggota tidak

  memasukkan data dengan benar maka sistem akan memberi peringatan kepada anggota dan akan diarahkan ke form login anggota untuk mengisi ulang, jika pendaftar memasukkan data benar maka akan diarahkan ke halaman utama web dengan hak akses sebagai anggota telah terbuka. Anggota harus memilih menu media untuk melihat data kegiatan dan memilih kegiatan. Sistem akan menampilkan form pendaftaran peserta kegiatan, secara otomatis data anggota telah ada di form tersebut karena anggota sudah melakukan login, sehingga anggota cukup memilih untuk hadir atau tidak hadir dalam kegiatan tersebut kemudian mengirim form pendaftaran. Sistem akan memvalidasi data, jika terjadi kesalahan maka sistem akan secara otomatis memberi peringatan dan mengembalikan ke halaman form registrasi kegiatan, jika berhasil maka sistem akan menyimpan data peserta kegiatan dan mengirimkan email ke masing-masing alamat email peserta kegiatan mengenai informasi peserta kegiatan. Berikut akan dijelaskan database relation yang ditunjukkan pada Gambar 9.

  Gambar 9. Database Relation Gambar 9 menunjukan relasi tabel yang ada di database Sistem Informasi GMKI.

  Sistem Informasi GMKI mempunyai 21 tabel. Setelah dilakukan perancangan sistem, maka dilanjutkan dengan pembangunan sistem.

  c.

Customer test drives mock-up. Pada tahap ini dilakukan dengan mendemokan sistem kepada pengguna sistem (administrator pusat GMKI dan anggota GMKI)

  Pada tahap ini pengurus GMKI meminta penambahan fasilitas yaitu menampilkan pertumbuhan anggota secara keseluruhan maupun setiap cabang menggunakan grafik untuk memberikan informasi kepada anggota maupun mempermudah pengurus GMKI mengontrol anggota GMKI.

  Prototype 2 a.

  Listen to customer. Berdarkan hasil evaluasi pada prototype 1 yaitu untuk menambahkan grafik pertumbuhan anggota, maka dilakukan diskusi dengan pengurus GMKI mengenai data yang akan ditampilkan dalam grafik. Berdasarkan hasil diskusi grafik yang akan dibuat untuk menunjukan pertumbuhan jumlah keseluruhan anggota GMKI dan pertumbuhan jumlah anggota GMKI setiap cabang berdasarkan tahun lulus maper.

  b.

  Build / revise mock-up. Pada tahap ini grafik pertumbuhan keseluruhan anggota GMKI ditambahkan pada halaman “Tentang Kami”, sedangkan grafik pertumbuhan anggota setiap cabang ditambahkan pada halaman masing-masing cabang.

  c.

  Customer test drives mock-up. Hasil dari evaluasi oleh pengurus GMKI pada

  prototype 2, sistem informasi GMKI sudah tidak ada penambahan fitur lagi. Hasil sistem informasi akan dibahas pada bab hasil implementasi dan pembahasan.

  Sistem informasi GMKI memiliki 4 (empat) user dengan hak akses yang berbeda, yaitu administrator pusat, administrator cabang, anggota tetap dan guest. Administrator pusat dapat mengelola semua data yang ada didalam web, sedangkan administrator cabang hanya dapat mengelola data berdasarkan cabangnya masing- masing. Para administrator pusat maupun cabang harus melakukan login ke dashboard administrator (Gambar 10) sebelum melakukan proses pengolahan data.

  

Gambar 10. Halaman Dashboard Administrator GMKI

  Anggota GMKI yang telah lolos maper diwajibkan untuk mengisi form registrasi anggota tetap GMKI di menu “Registrasi” (Gambar 11), sedangkan masyarakat umum yang ingin bergabung dengan GMKI, dapat melakukan pendaftaran melalui web GMKI di menu “Ayo Gabung”.

  

Gambar 11. Halaman Registrasi Anggota Tetap GMKI

  Gambar 11 menunjukkan form registrasi anggota GMKI, pada halaman ini pendaftar harus mengisi nomor induk mahasiswa, nama lengkap, tempat dan tanggal lahir, alamat domisili, jenis kelamin, cabang, nomor telepon, alamat email, asal perguruan tinggi, fakultas, pengalaman berorganisasi, riwayat pelatihan, profesi/pekerjaan, serta keahlian. Sistem akan memberi peringatan jika ada kesalahan penulisan. Jika data yang masukkan sudah benar maka sistem secara otomatis akan memberitahu mengenai maper yang harus diikuti oleh pendaftar. Pengurus cabang akan memverifikasi data setelah pendaftar lolos maper untuk menjadi anggota cabang dan anggota tetap GMKI. Berikut tabel data anggota cabang yang ditunjukkan pada Gambar 12.

  

Gambar 12. Halaman Verifikasi Anggota GMKI

  Pada Gambar 12 menunjukkan halaman yang menampilkan tabel data anggota cabang. Terdapat 3 aksi yang dapat dilakukan oleh administrator baik pusat maupun cabang yaitu aksi verifikasi data, aksi menghapus data, dan aksi mengubah. Setiap administrator cabang berhak melakukan aksi pada data anggota cabang berdasarkan masing-masing cabang yang dikelola, sedangkan administrator pusat berhak melakukan aksi pada semua data yang ada di tabel data anggota cabang. Aksi verifikasi berfungsi untuk memeriksa ulang data yang ada untuk dimasukkan pada data anggota tetap. Aksi mengubah data berfungsi untuk memperbaiki data jika terjadi kesalahan dalam penulisan atau kesalahan informasi. Aksi menghapus data berfungsi untuk menghapus data yang salah pada tabel tersebut.

  Data anggota yang ada pada Sistem Informasi GMKI telah diintegrasikan sehingga pengurus pusat maupun daerah dapat mengakses data yang sama. Pengurus pusat dapat mengelola semua data anggota yang ada di semua cabang GMKI (Gambar

  13), sedangkan pengurus cabang hanya dapat mengelola data anggota berdasarkan cabang yang dikelola (Gambar 14).

  

Gambar 13. Halaman Data Anggota Cabang (Login sebagai Administrator Pusat)

Gambar 14. Halaman Data Anggota Cabang (Login sebagai Administrator Cabang)

  Pada Gambar 13 menunjukan bahwa administrator pusat dapat mengelola semua data anggota dari semua cabang GMKI, sedangkan pada Gambar 14 menunjukan bahwa adminitrator cabang Bengkulu hanya dapat mengelola data anggota cabang Bengkulu. Gambar 13 dan Gambar 14 juga menunjukkan kesamaan data anggota cabang Bengkulu yang ditampilkan pada dashboard administrator pusat maupun dashboard administrator cabang Bengkulu, yang menunjukkan adanya integrasi data pada sistem informasi GMKI.

  Pada sistem informasi ini juga ditampilkan grafik pertumbuhan anggota GMKI berdasarkan tahun lulus masa perkenalan (maper), seperti terlihat pada Gambar 15 dibawah ini.

  

Gambar 15. Halaman Pertumbuhan Anggota GMKI Gambar 15 terlihat pertumbuhan anggota GMKI berdasarkan tahun maper yang dimulai dari tahun 1950 hingga 2017. Ada 420 anggota yang sudah masuk sampai dengan November 2017. Halaman grafik pertumbuhan anggota GMKI juga terdapat pada halaman informasi masing-masing cabang, sehingga dapat mengetahui pertumbuhan anggota di masing-masing cabang GMKI (Gambar 16).

  

Gambar 16. Halaman Pertumbuhan Anggota GMKI Cabang Bandung

  Gambar 16 menunjukkan pertumbuhan anggota GMKI cabang Bandung berdasarkan tahun lolos maper. Berdasarkan grafik diatas, jumlah data anggota GMKI cabang Bandung yang sudah masuk sampai dengan November 2017 sebanyak 278 anggota. Setiap tahunnya menunjukan peningkatan dan penurunan peserta yang lolos maper. Pada halaman web GMKI juga tersedia fitur registrasi kegiatan untuk anggota GMKI melakukan respon terhadap kegiatan yang diadakan oleh pengurus (Gambar 17).

  

Gambar 17. Halaman Registrasi Kegiatan

  Anggota dapat melakukan respon kegiatan jika sudah melakukan login pada

  

web . Pada form yang ada di halaman registrasi kegiatan, anggota GMKI wajib

  memilih respon kehadiran terhadap kegiatan yang diadakan, sehingga pengurus dapat memastikan kehadiran peserta kegiatan, melihat antusiasme anggota GMKI dalam mengikuti sebuah kegiatan yang diadakan oleh pengurus GMKI dan menjadi salah satu bahan evaluasi untuk pengurus GMKI dalam membuat kegiatan yang akan diadakan selanjutnya. Pada form registrasi kegiatan, anggota tidak perlu mengisi nama, tempat dan tanggal lahir, cabang, nomor telepon, serta email karena anggota sudah melakukan login sehingga data secara otomatis masuk ke dalam form tersebut, peserta hanya diwajibkan untuk mengecek ulang data diri peserta dan dapat mengubah jika masih ada kesalahan. Pada halaman tersebut juga menampilkan jumlah perespon kegiatan, baik yang hadir ataupun tidak hadir, agar pengurus dan anggota GMKI dapat melihat langsung antusiasme anggota dalam mengikuti kegiatan.

  Berdasarkan fungsi dari setiap halaman yang sudah dijelaskan, berikut akan menjelaskan kode program yang mewakilkan setiap fungsi. Fungsi utama dari sistem informasi GMKI adalah menyimpan data anggota, berikut akan dijelaskan pada Kode Program 1.

  Kode Program 1. Menyimpan Data Pendaftar Anggota GMKI ke Database

  Baris 1 menunjukan bahwa kode program menggunakan script PHP. Baris 2 memanggil fungsi koneksi database yang sudah dibuat sebelumnya. Pada baris 3 menentukan zona waktu yang akan dipakai untuk memasukkan tanggal dalam

  

database . Baris 4-14 untuk mengumpulkan nilai dalam sebuah form registrasi anggota

  yang ada di halaman web. Pada baris 15-20 merupakan query untuk mengambil semua data yang ada dalam tb_pendaftaran yang berfungsi untuk mencocokan data agar tidak ada penggandaan data (baris 21-23). Jika data yang dimasukkan sama dengan data yang sudah ada dalam database maka sistem akan memberi peringatan kepada user dan sistem akan kembali ke halaman utama, jika tidak maka sistem akan menyimpan data ke database (baris 25-35). Setelah data berhasil disimpan di database sistem akan memberi pemberitahuan mengenai tahap selanjutnya melalui alert, kemudian secara otomatis sistem kembali ke halaman utama (baris 37-41).

  1. <?php 2. include("../koneksi.php");

  3. date_default_timezone_set("Asia/Jakarta"); 4. if(count($_POST)){ 5. $nim = $_POST["nim"];$nama = $_POST["nama"];$ttl = $_POST["ttl"];

  6. $alamat = $_POST["alamat"];$jenis_kelamin = $_POST["jenis_kelamin"]; 7. $cabang = $_POST["cabang"];$nomortelepon = $_POST["telp"]; 8. $email = $_POST["email"];$tahunmaper = date('Y'); 9. $asal_perguruan_tinggi = $_POST["asal_perguruan_tinggi"]; 10. $jurusan = $_POST["jurusan"]; 11. $pengalaman_beroganisasi =$_POST["pengalaman_berorganisasi"]; 12. $riwayat_pelatihan = $_POST["riwayat_pelatihan"]; 13. $profesi = $_POST["profesi"];$keahlian = $_POST["keahlian"]; 14. $tglmasuk = date('d-m-Y H:i:s'); $id_pendaftaran = date('mdyHis');

15. $data = mysqli_num_rows(mysqli_query($conn, "SELECT * FROM `tb_pendaftaran`

  16. WHERE `nama` like '%$nama' and `ttl` like '%$ttl' and `alamat` 17. like '%$alamat' and `jenis_kelamin` like '%$jenis_kelamin' and `cabang`

  18. like '%$cabang' and `nomortelepon` like '%$nomortelepon' and `email` 19. like '%$email' and `tahunmaper` like '%$tahunmaper' and 20.

  `asal_perguruan_tinggi` like '%$asal_perguruan_tinggi'")); 21. if($data > 0){ 22. echo '<script language="JavaScript"> alert("Data yang anda inputkan sudah

  23. ada di database ini!!"); 24. document.location="../index.php"</script>'; 25. }else { 26. $sql = "INSERT INTO `tb_pendaftaran`(`nomor`, `id_pendaftaran`, `nim`, 27. `nama`, `ttl`,`alamat`,`jenis_kelamin`,`cabang`, `nomortelepon`, 28. `email`,`tahunmaper`,`asal_perguruan_tinggi`,`jurusan`,

29. `pengalaman_beroganisasi`,`riwayat_pelatihan`, `profesi`, `keahlian`,

30. `tglmasuk`) VALUES ('', '$id_pendaftaran', '$nim', '$nama', '$ttl', 31. '$alamat','$jenis_kelamin', '$cabang', '$nomortelepon','$email', 32. '$tahunmaper','$asal_perguruan_tinggi','$jurusan',

  33.

  '$pengalaman_beroganisasi','$riwayat_pelatihan','$profesi','$keahlian' 34. ,'$tglmasuk')"; 35. $hasil = mysqli_query($conn,$sql); 36. if(!$hasil){die(mysqli_error()); 37. else{echo'<script language="JavaScript">

  

38. alert("Anda Telah terdaftar, selanjutnya nanti anda akan mendapatkan

39. email dari Pengurus Pusat untuk mengikuti Pelatihan Perekrutan

  40. GMKI untuk menjadi anggota. Terima Kasih"); 41. document.location="../index.php"</script>';} 42. } 43. } 44. $conn->close(); 45. ?>

  Berdasarkan data anggota GMKI yang sudah terverifikasi akan ditampilkan dalam bentuk grafik, berikut akan dijelaskan kode program untuk menampilkan grafik pertumbuhan anggota GMKI berdasarkan tahun maper pada Kode Program 2.

  Kode Program 2. Menampilkan Grafik Pertumbuhan Anggota GMKI

  Pada baris ke 5-7 menunjukan id dari fungsi grafik, judul grafik, serta letak judul pada grafik. Baris 8-10 adalah sumbu x yang menunjukan tahun lolos maper, sedangkan baris 11 menunjukan sumbu y yang merupakan jumlah anggota GMKI. Baris 12 menunjukan warna garis yang akan terbentuk pada grafik. Pada baris 14-15 merupakan fungsi untuk menampilkan data di titik tertentu di grafik saat mouseover. Baris 20-29 merupakan data anggota sebagai nilai di sumbu y pada grafik.

  Fungsi yang tidak kalah penting yaitu mengubah data karena dalam melakukan pengolahan data pasti akan ada informasi yang akan diubah, berikut akan dijelaskan fungsi mengubah data kegiatan (Kode Program 3) sebagai perwakilan dari fungsi mengubah data yang ada dalam sistem informasi GMKI ini.

  Kode Program 3. Mengubah Data Kegiatan 1. $(function () { 2. var chart; 3. $(document).ready(function() { 4. chart = new Highcharts.Chart({ 5. chart: { 6. renderTo: 'grafik', marginRight: 130, marginBottom: 25 }, 7. title: {text: '<b>Pertumbuhan Anggota GMKI</b>',}, 8. xAxis: {categories: ['1950-1959', '1960-1969', '1970-1979', 9. '1980-1989','1990-1999','2000-2009', 10.

  '2010-2014','2015','2016','2017']}, 11. yAxis: { title: {text: 'jumlah anggota'}, 12. plotLines: [{color: '#808080' }]}, 13. tooltip: { 14. formatter: function() { return '<b>'+ this.series.name

  

15. +'</b><br/>'+ this.x +': '+ this.y ;}},

16. legend: { 17. layout: 'vertical', align: 'right', verticalAlign: 'top'}, 18. series: [ 19. {name:'jumlah anggota GMKI berdasarkan tahun masa perkenalan', 20. data: [ <?php echo $jumlah1950_1959; ?>, 21. <?php echo $jumlah1960_1969; ?>, 22. <?php echo $jumlah1970_1979; ?>, 23. <?php echo $jumlah1980_1989; ?>, 24. <?php echo $jumlah1990_1999; ?>,

  25.

  <?php echo $jumlah2000_2009; ?>, 26. <?php echo $jumlah2010_2014; ?>, 27. <?php echo $jumlah2015; ?>, 28. <?php echo $jumlah2016;?>, 29. <?php echo $jumlah2017; ?>]}]

  30. }); 31. }); 32. });

  1. <?php 2. include("../../koneksi.php"); 3. $id_kegiatan = $_POST['id_kegiatan']; 4. $nama = $_POST['nama']; $tanggal = $_POST['tanggal']; 5. $waktu = $_POST['waktu']; 6. $tempat = $_POST['tempat']; 7. $deskripsi = $_POST['deskripsi']; 8. $sql ="UPDATE `tbl_kegiatan` SET `nama`='$nama',`tanggal`='$tanggal', 9. `waktu`='$waktu', `tempat`='$tempat',`deskripsi`='$deskripsi'

  10. WHERE `id_kegiatan`='$id_kegiatan';"; 11. if (mysqli_query($conn,$sql) == TRUE) { 12. echo ' <script language="JavaScript"> alert("Kegiatan telah di Update"); 13. document.location="../informasi.php?link=kegiatan/lihatkeg.php"</script>';

  14.

  } else { 15. echo ' <script language="JavaScript"> alert("Kegiatan gagal Update"); 16. document.location="../informasi.php?link=kegiatan/lihatkeg.php"</script>';

  17.

  } 18. ?>

  Baris 1 menunjukan bahwa kode program menggunakan script PHP. Baris 2 memanggil fungsi koneksi database yang sudah dibuat sebelumnya. Baris 3-7 untuk mengumpulkan nilai dalam sebuah form update yang ada di halaman web. Pada baris 8-10 merupakan query untuk mengubah data didalam tbl_kegiatan berdasarkan id_kegiatan. Baris 11-13 merupakan fungsi peringatan jika data berhasil diubah, sedangkan baris 14-15 merupakan fungsi peringatan jika data gagal diubah.

  Fungsi berikutnya adalah menghapus data, berikut akan dijelaskan fungsi menghapus data kegiatan (Kode Program 4) sebagai perwakilan dari fungsi menghapus data yang ada dalam sistem informasi GMKI ini.

  Kode Program 4. Menghapus Data Kegiatan 1. <?php 2. include('../../koneksi.php'); 3. $id_kegiatan = $_GET["id_kegiatan"]; $show = mysqli_query($conn,

  4.

  "DELETE FROM tbl_kegiatan WHERE id_kegiatan = $id_kegiatan"); 5. ?> 6.

  7. 8. <script language="javascript"> alert('Berhasil Di Hapus'); 9. document.location="../informasi.php?link=kegiatan/lihatkeg.php"; 10. </script>