T1__Full text Institutional Repository | Satya Wacana Christian University: Perancangan dan Implementasi Sistem Pengaduan Masyarakat Berbasis Web pada Dinas Perhubungan Kota Salatiga Menggunakan Framework Codeigniter T1 Full text

Perancangan dan Implementasi Sistem Pengaduan

Masyarakat Berbasis Web pada Dinas Perhubungan Kota

Salatiga Menggunakan Framework Codeigniter

Artikel Ilmiah

Diajukan kepada

Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

Peneliti :

Satria Rabowo (672013611)

Christine Dewi, S.Kom., M.Cs.

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

1.

Pendahuluan

Dinas Perhubungan Kota Salatiga merupakan unsur pelaksana Pemerintah Daerah Kota Salatiga yang dipimpin oleh Kepala dinas dan berkedudukan di bawah dan bertanggungjawab kepada Walikota melalui Sekretaris Daerah. Dinas Perhubungan Kota Salatiga diarahkan kepada upaya penyelenggaraan pelayanan jasa transportasi guna mewujudkan sistem transportasi di Kota Salatiga yang menjamin keamanan, ketertiban, kelancaran, kenyamanan transportasi dengan biaya yang terjangkau oleh masyarakat. [1] Untuk mencapai hal tersebut Dinas Perhubungan Kota Salatiga bertekad untuk mewujudkan terciptanya tatanan transportasi yang semakin berkualitas antara lain dengan menata sistem transportasi di Kota Salatiga. Manajemen rekayasa lalu lintas pada beberapa pusat-pusat kegiatan terutama di jalan-jalan arteri Kota Salatiga dalam mempercepat distribusi barang dan jasa keberbagai wilayah Kota Salatiga baik melalui manajemen perparkiran maupun penerapan angkutan umum massal berbasis jalan. [2]

Berdasarkan data kecelakaan lalu lintas di Kota Salatiga pada tahun 2015 terjadi kasus kecelakaan sebanyak 2.435 dengan jumlah korban meninggal sebanyak 475 jiwa. [3] Berdasarkan data diatas dapat disimpulkan jumlah kecelakaan lalu lintas di Kota Salatiga masih cukup tinggi, maka dinas terkait seperti Dinas Perhubungan Kota Salatiga akan terus berusaha untuk meningkatkan kinerjanya.

Selain upaya dari pihak Dinas Perhubungan Kota Salatiga, dibutuhkan pula dukungan dan pengawasan dari semua masyarakat Kota Salatiga agar semua program dan peraturan yang telah dibuat dapat dilaksanakan dengan baik dan benar. Dengan demikian Dinas Perhubungan Kota Salatiga membutuhkan kritik dan saran dari masyarakat. Berdasarkan studi kasus di Dinas Perhubungan Kota Salatiga, selama ini pengaduan dari masyarakat

biasanya dilakukan melalui sambungan telepon, email, dan media sosial yang mana kurang

efektif karena kurang terkoordinir dengan baik, hal tersebut terbukti dari dari pengaduan yang dapat ditindaklanjuti yaitu pengaduan yang hanya masuk melalui telepon, yang pada bulan maret-mei 2017 hanya terdapat 2 pengaduan dari masyarakat, padahal dari media sosial dan kotak saran yang terdapat pada Kantor Dinas Perhubungan Kota Salatiga terlihat cukup banyak pengaduan yang masuk, namun dari banyaknya pengaduan tersebut tidak bisa semua ditindak lanjuti karena kurangnya informasi secara lengkap dan terpercaya. Maka dibutuhkan sebuah sistem terpusat yang mampu menampung seluruh aspirasi dan pengaduan dari masyarakat. Mengingat Dinas Perhubungan Kota Salatiga dalam tugasnya tidak lepas dari pekerjaan lapangan yaitu mencakup seluruh wilayah Kota Salatiga maka diperlukan pula sebuah sistem pengaduan yang bisa memberikan petunjuk jelas tentang kejadian di lapangan seperti foto dan lokasi kejadian. Sistem pengaduan tersebut juga harus memudahkan dan mudah diakses masyarakat sehingga masyarakat dapat mengetahui kelanjutan pengaduan mereka.

Berdasarkan latar belakang masalah yang terjadi, dilakukan penelitian yang memiliki tujuan memanfaatkan teknologi untuk mengatasi masalah yang ada. Perancangan dan

dan media pengaduan bagi masyarakat. Teknologi website dipilih karena teknologi tersebut

dapat diakses dimana saja. Sistem yang digunakan menggunakan website sehingga aplikasi

dapat digunakan di berbagai platform yang menggunakan web browser seperti Mozilla

Firefox, Google Chrome, Opera Browser, Safari dan lain-lain. Aplikasi ini dibuat

menggunakan bahasa pemrograman PHP (Hypertext Prepocessor) dengan menggunakan

framework CodeIgniter. Digunakan pula teknologi email sebagai media tanggapan dari pihak Dinas Perhubungan Kota Salatiga supaya pengadu mengetahui kelanjutan aduan. Teknologi

email dirasa cocok digunakan karena jumlah karakter huruf pada email yang bisa digunakan sangat panjang sehingga cocok digunakan sebagai media tanggapan yang efektif daripada media lain seperti sms yang jumlah karakternya terbatas, selain itu sekarang telah banyak

digunakan smartphone yang mempunyai sistem notifikasi push email sehingga para pengadu

akan mendapat pemberitahuan jika pengaduan mereka ditanggapi dan ditindak lanjuti.

Sebagai media petunjuk lokasi, akan digunakan teknologi Google Map API dengan teknologi

tersebut diharapkan mampu memberi petunjuk lokasi yang jelas. Teknologi Google Map API

digunakan karena selain ringan lokasi pada peta Google Map selalu update, maka akan cocok

digunakan sebagai acuan lokasi kejadian yang tepat. Sebagai tanggapan balik dari pengadu kepada Dinas Perhubungan Kota Salatiga atas tanggapan yang telah diberikan akan disediakan pula fitur rating yang berbentuk bintang yang bertujuan sebagai indikator kepuasan dari pengadu atas tanggapan yang telah diberikan. Fitur rating dirasa cocok karena selain praktis, fitur tersebut juga efektif karena tidak akan merepotkan dari sisi administrator. Batasan masalah pada penelitian ini adalah sebagai berikut: 1) Untuk menghindari

identitas palsu dan laporan palsu, maka website ini hanya bisa digunakan oleh user yang

sudah mendaftar. 2) Karena area kerja dari Dinas Perhubungan Kota Salatiga hanya pada

wilayah Kota salatiga, maka cakupan pengaduan dalam website ini hanya dalam wilayah

Kota Salatiga saja. 3) User harus mempunyai akun email untuk bisa melakukan pengaduan,

akun email diperlukan karena selain untuk media notifikasi, akun email juga berguna jika

pihak Dinas Perhubungan Kota Salatiga perlu untuk menghubungi pengadu untuk tindak lanjut pengaduan yang telah dikirimkan.

2.

Tinjauan Pustaka

Penelitian terdahulu dengan judul “Pengembangan Sistem Pengaduan Pelanggan

Pada Perusahaan Daerah Air Minum Kota Salatiga”. Hasil dari penelitian tersebut didapatkan bahwa sistem tersebut dapat menampilkan laporan pengaduan pelanggan dan grafik pengaduan pelanggan berdasarkan jenis pengaduan, area pelayanan, dan durasi penanganan. [4]

Penelitian terdahulu dengan judul “Pemanfaatan Google Map API Pada Sistem

Informasi Geografis Direktori Perguruan Tinggi di Kota Bengkulu”. Pada penelitian tersebut

telah berhasil memanfaatkan teknologi Google Map sebagai aplikasi yang mampu untuk

Dibandingkan penelitian terdahulu, penelitian ini bertujuan untuk merancang sebuah

website sistem pengaduan yang cocok untuk Dinas Perhubungan Kota Salatiga dimana dapat menampilkan lokasi kejadian secara tepat dan untuk mengatasi permasalahan kelanjutan aduan oleh masyarakat supaya dapat diketahui tindak lanjut yang dilakukan oleh pihak Dinas Perhubungan Kota Salatiga.

Website atau situs dapat diartikan sebagai kumpulan halaman halaman yang digunakan untuk menampilkan informasi, teks, gambar diam atau bergerak, animasi, suara, dan atau gabungan dari semuanya itu, baik yang bersifat statis maupun dinamis yang membentuk satu rangkaian bangunan yang saling berkait dimana masing masing

dihubungkan dengan jaringan jaringan halaman (hyperlink) [6].

Framework adalah kerangka kerja. Framework juga dapat di artikan sebagai

kumpulan script (terutama class dan function yang dapat membantu developer / programmer

dalam menagani berbagai masalah-masalah dalam pemrograman seperti koneksi ke database,

pemanggilan variabel, dan file. Sehingga developer lebih fokus dan lebih cepat membangun

aplikasi [7].

CodeIgniter merupakan aplikasi sumber terbuka yang berupa Framework dengan

Model MVC (Model, View, Controller) untuk membangun website dinamis dengan

menggunakan PHP. CodeIgniter memudahkan Developer untuk membuat aplikasi Web

dengan cepat dan mudah dibandingkan dengan membuatnya dari awal. CodeIgniter dirilis

pertama kali pada 28 Februari 2006 [8].

Google Maps adalah layanan gratis yang diberikan oleh Google dan sangat popular.

Google Maps adalah suatu peta dunia yang dapat digunakan untuk melihat suatu daerah.

Dengan kata lain, Google Maps merupakan suatu peta yang dapat dilihat dengan

menggunakan suatu browser. Fitur Google Maps dapat ditambahkan dalam website yang

telah dibuat atau pada blog yang berbayar maupun gratis sekalipun dengan Google Maps

API. Google Maps API adalah suatu library yang berbentuk JavaScript. [5]

Bootstrap adalah sebuah library framework CSS yang dibuat khusus untuk bagian

pengembangan front-end website. Bootstrap juga merupakan salah satu framework HTML,

CSS dan javascript yang paling populer di kalangan web developer yang digunakan untuk

mengembangkan sebuah website yang responsive. Sehingga halaman website nantinya dapat

menyesuaikan sesuai dengan ukuran monitor device (desktop, tablet, ponsel) yang digunakan

pengguna disaat mengakses website dari browser. [9]

3.

Metode dan Perancangan Sistem

Gambar 1 Tahap Penelitian [10]

Pada Gambar 1 dijelaskan tahapan-tahapan yang akan dilakukan dalam penelitian yaitu sebagai berikut, pada tahapan pertama akan dilakukan identifikasi masalah. Disini akan dilakukan analisis masalah melalui wawancara terhadap salah satu pejabat dinas terkait masalah yang biasa terjadi terhadap proses pengaduan yang ada di Dinas Perhubungan Kota Salatiga. Tahap kedua adalah perancangan sistem, berdasarkan masalah yang telah diketahui dalam tahap pertama, disini akan dilakukan perancangan system menggunakan teknologi

yang cocok dengan kasus penelitian menggunakan Unified Modeling Language (UML) dan

perancangan desain untuk user interface yang meliputi use case, class digram dan activity

diagram. Tahap ketiga yaitu pembuatan sistem, disini dilakukan pembangunan sistem yang sesuai dengan rancangan yang telah dibuat dalam tahap kedua, dalam tahap ketiga ini

dilakukan coding dengan bahasa pemrograman PHP (Hypertext Preprocessor) dan

menggunakan Framework CodeIgniter yaitu dengan membuat tampilan website

menggunakan Bootstrap, memasang library yang dibutuhkan dan membangun database

sistem menggunakan SQL (Structured Query Language). Dalam tahap ini dibuat dua user

interface untuk user dan administrator. Tahap selanjutnya yaitu tahap pengujuan dan implementasi, pada tahap ini dilakukan implementasi dengan menguji sistem dan melihat hasil sistem apakah sudah sesuai dengan rancangan yang diinginkan. Apabila masih terjadi kesalahan dan kekurangan maka perlu dilakukan perbaikan sehingga sistem akan sesuai dengan apa yang diinginkan. Dalam melakukan pengujian pada penelitian ini akan digunakan

metode Blackbox, metode ini dipilih karena dapat mengetahui keseluruhan fungsi system

Metode Prototype dipilih sebagai metode pengembangan pada penelitian ini karena dalam pengembangan sistem ini dilakukan komunikasi yang intensif dengan pengguna

sistem. Metode ini membantu pengembang dalam membentuk Model dari sistem yang

dibuat. Metode ini dilakukan secara bertahap dimulai dari mengembangkan suatu prototype

yang sederhana untuk kemudian dapat dikembangkan kembali hingga sistem selesai

dikembangkan. Prototype merupakan bentuk dasar dari sistem atau subsistem. [11]

Gambar 2 Prototyping Model [11]

Pada gambar 2 dapat dilihat tahap-tahap pada metode Prototype yaitu sebaga berikut :

1. Pengumpulan Data

Pada tahap ini dilakukan pengumpulan data dengan cara wawancara kepada pejabat Dinas Perhubungan Kota salatiga yang terkait dengan data yang dibutuhkan, kemudian akan dilakukan kesimpulan tentang sistem yang akan dibangun.

2. Membangun Prototyping

Setelah data yang didapatkan dirasa cukup, kemudian akan dilakukan perancangan

prototype program, program ini bersifat prototype yang berarti hanya sebagai contoh program yang belum final, hal ini bertujuan sebagai contoh program atau gambaran seperti apa program jika sudah selesai nantinya.

3. Evaluasi Prototyping

Dari program prototype yang telah dibuat sebelumnya akan dilakukan evaluasi prototype

pada tahap ini. Evaluasi akan dilakukan oleh pegawai yang bertugas menangani pengaduan, kemudian pegawai terkait akan mengecek apakah fungsi pada aplikasi seperti mengirim pengaduan, menampilkan lokasi, dan mengirim email sudah sesuai dengan yang diinginkan

atau belum dari sisi user maupun administrator, jika belum sesuai akan dilakukan perbaikan

pada program prototype. Tahap ini akan terus diulang sampai program prototype benar-benar

sesuai dengan kebutuhan.

4. Mengkodekan Sistem

Jika program prototype telah disetujui maka akan dilanjutkan tahap selanjutnya yaitu

akan dilakukan pengembangan dengan menerjemahkan program prototype ke dalam Bahasa

pemrograman PHP (Hypertext Preprocessor) menggunakan FrameworkCodeIgniter, pada

tahap ini akan dilakukan desain tampilan website dengan Bootstrap dan pembangunan

database menggunakan SQL (Structured Query Language).

5. Menguji Sistem

Sistem yang telah selesai dibangun akan diuji di tahap ini. Pengujian dilakukan dengan menerapkan sistem pada kantor Dinas Perhubungan Kota Salatiga, kemudian dilakukan

implementasi proses pengaduan menggunakan sistem yang telah dibuat dari sisi user dan

administrator.

6. Evaluasi Sistem

Jika sistem telah selesai diuji baik dari sisi user maupun administrator maka akan

dilakukan evaluasi sistem apakah layak digunakan atau tidak, dan apakah dibutuhkan perbaikan maupun penambahan fitur atau tidak.

7. Menggunakan Sistem

Jika semua fungsi, tampilan, dan database telah disepakati maka sistem akan bisa digunakan dalam proses bisnis Dinas Perhubungan Kota Salatiga.

Gambar 3 Flowchart Proses Bisnis Pengaduan

Gambar 3 Flowchart Proses Bisnis Pengaduan merupakan proses pengaduan yang

berjalan pada Dinas Perhubungan Kota Salatiga menggunakan telepon atau email. Pertama

masyarakat menghubungi Dinas perhubungan Kota Salatiga melalui email atau telepon,

umum dan kepegawaian. Pengaduan yang telah diterima akan ditentukan apakah informasi

tersebut benar (valid) atau tidak dan apakah pengaduan tersebut memenuhi unsur 4W1H

(what, where, when, who, how) atau tidak. Jika pengaduan dinyatakan valid maka pengaduan akan diserahkan kepada seksi bidang terkait untuk ditindaklanjuti. Kelemahan dalam sistem ini yaitu masyarakat tidak tahu kelanjutan pengaduan mereka apakah akan ditindaklanjuti

atau tidak, dan masyarakat akan kesulitan untuk memenuhi unsur 4W1H (what, where, when,

who, how) karena sistem pengaduan ini masih manual.

Gambar 4 Flowchart Proses Bisnis Website Pengaduan

Gambar 4 Flowchart Proses Bisnis Website Pengaduan merupakan alur proses

bisnis dari website sistem pengaduan Dinas Perhubungan Kota Salatiga. Disini pengaduan

dari masyarakat yang melakukan pengaduan melalui website akan diterima oleh

administrator website, kemudian jika pengaduan dinyatakan valid dan memenuhi unsur

4W1H (what, where, when, who, how) maka pengaduan akan diterima kemudian masyarakat

akan menerima notifikasi melalui email tentang status pengaduan dan tanggapan dari

Perancangan Sistem Pengaduan Masyarakat pada Website Sistem Infomasi Dinas

Perhubungan Kota Salatiga Menggunakan Framework Codeigniter dimulai dengan

merancang proses berupa diagram Unified Modelling Language (UML). Diagram UML

meliputi diagram use case diagram, class diagram dan activity diagram.

Gambar 5 Usecase Sistem Pengaduan Masyarakat

Gambar 5 Usecase Sistem Pengaduan Masyarakat merupakan usecase diagram dari

sistem yang dibuat. Dalam usecase tersesebut dijelaskan terdapat tiga aktor dalam sistem,

yaitu aktor user, administrator, dan pegawai berwenang. Aktor user mempunyai beberapa

hak akses seperti mengirim pengaduan, membaca pengaduan yang telah dikirim, menerima

email, dan mengganti data akun. Aktor administrator mempunyai tugas seperti mengelola

data pengaduan, memberikan tanggapan, mengirimkan email, dan melihat data akun. Aktor

pegawai berwenang merupakan pegawai dari Dinas Perhubungan Kota Salatiga yang mempunyai tugas terkait tindak lanjut dari pengaduan sesuai dengan kategori pengaduan tersebut. Pegawai berwenang dapat membaca pengaduan yang dikirimkan kemudian melakukan komunikasi kepada administrator tentang status pengaduan dan tindak lanjut pengaduan.

beri rating tanggapan mengelola data pengaduan

mengelola data artikel

tolak pengaduan insert data artikel _{update data artikel}

Gambar 6 Activity Diagram Kirim Pengaduan Baru

Gambar 6 Activity Diagram Kirim Pengaduan Baru merupakan activity diagram

proses mengirim pengaduan baru. Seperti yang terlihat pada gambar 6 activity diagramuser

diharuskan login terlebih dahulu, kemudian sistem akan mengecek username dan password

yang di masukkan oleh user apakah ada dalam database atau tidak . Setelah user berhasil

login maka sistem akan menampilkan halaman awal menu pengaduan. Untuk melakukan

pengaduan baru user perlu memilih menu tulis pengaduan, kemudian sistem akan

menampilkan form pengaduan baru, disini user harus memilih kategori pengaduan yang disediakan yaitu angkutan, parkir, dan lalu lintas, setelah menulis pengaduan user dapat

memberi lampiran seperti foto dan lokasi. Jika pengisian form pengaduan telah selesai maka

Gambar 7 Activity Diagram KirimTanggapan

Gambar 7 Activity Diagram Kirim Tanggapan merupakan activity diagram yang

menunjukkan tentang proses administrator mengirim tanggapan kepada user. Administrator

akan login pada menu administrator kemudian setelah berhasil masuk sistem akan

menampilkan tampilan awal menu administrator . Administrator akan memilih menu

pengaduan, dalam menu pengaduan ini sistem akan menampilkan seluruh data pengaduan

yang ada dalam database. Administrator menyortir pengaduan yang baru masuk, jika

Gambar 9 Class Diagram Sistem

Gambar 9 Class Diagram Sistem merupakan class diagram dari sistem pengaduan, pada class diagram tersebut merupakan gambaran dari ModelClass dan ControllerClass

pada sistem. Terdapat tiga ModelClass yaitu Tanggapan Model, User Model, dan Pengaduan

Model. ModelClass tersebut saling berelasi antara satu dengan yang lain. Terdapat satu

ControllerClass pada sistem ini yaitu BacaPengaduan Controller.

4.

Hasil dan Pembahasan

Sistem yang telah dibuat mempunyai beberapa fitur yang berkaitan dengan sistem

pengaduan online yaitu mengirim pengaduan beserta lampiran, mengganti data akun,

membaca pengaduan yang sudah dikirimkan. Sistem ini mewajibkan user untuk login

Gambar 10 Halaman Login Menu Pengaduan

Gambar 10 merupakan tampilan menu pengaduan, pada halaman tersebut user diminta

untuk melakukan login. Jika user belum mempunyai akun dapat register dengan klik link

daftar. Pada halaman ini juga ditampilkan grafik pengaduan dari semua pengaduan yang masuk ke database sistem, grafik tersebut ditampilkan menurut kategori yaitu Parkir, Angkutan, Lalu Lintas, Pelayanan KIR dan Lain – Lain.

Pada gambar 11 ditunjukan halaman form pengaduan ketika user ingin melakukan

pengaduan baru, pada form pengaduan terdapat kolom yang harus diisi yaitu judul

pengaduan, ketegori pengaduan, dan isi pengaduan. User juga dapat melampirkan foto dan

lokasi yang bersifat opsional, untuk melampirkan foto user cukup klik tombol browse

kemudian memilih foto yang diinginkan, dan untuk melampirkan lokasi user perlu klik

tombol checklist lampiran lokasi, kemudian user dapat melakukan drag drop pada lokasi

yang dituju pada map yang disediakan, setelah selesai user dapat klik tombol kirim untuk

mengirim pengaduan.

Penggunaan lampiran foto dan lokasi bertujuan agar pengaduan dari masyarakat

memenuhi unsur 4W1H, 4W1H merupakan singkatan dari what, where, when, who, how

merupakan istilah untuk unsur yang harus terdapat pada sebuah pengaduan. What berarti

kejadian yang diketahui, where berarti tempat kejadian, when berarti waktu kejadian, who

berarti siapa yang terlibat, dan how yaitu bagaimana kejadian itu dapat terjadi.

Kode Program 1 View Tulis Pengaduan Baru

Kode Program 1 merupakan kode program pada view yang berguna untuk memanggil

fungsi tulisAduan yang berada pada controller.

Kode Program 2 Fungsi Kirim Pengaduan Baru Pada Controller Aduan

Kode Program 2 merupakan kode program fungsi tulisAduan yang ada pada controller

fungsi tersebut berguna untuk menyimpan pengaduan ke database. disimpan berdasarkan

lokasi dari map yang disimpan oleh user. Baris 1 sampai 5 merupakan fungsi untuk upload

1. <form action="<?=base_url()?>aduan/tulisAduan" method="post" enctype="multipart/form-data"></form>

1. if($_FILES['filefoto']['name']){

2. $config['upload_path'] = './assets/web/images/aduan/'; 3. $this->upload->initialize($config);

4. if ($this->upload->do_upload('filefoto')){ 5. $gbr = $this->upload->data();

6. }if($_POST['lokasi']==!""){ 7. $dt_insert = array(

8. 'judul_pengaduan' => $this->input->post('judul'), 9. 'kategori' => $this->input->post('kategori'), 10. 'isi' => $this->input->post('isi'),

11. 'username' => $this->input->post('username'), 12. 'status' => $this->input->post('status'), 13. 'lat' => $this->input->post('lat'), 14. 'long' => $this->input->post('long'), 15. 'lampiran' =>$gbr['file_name']);

file foto yang user lampirkan. Baris 6 adalah fungsi untuk mengecek apakah user

melampirkan lokasi atau tidak. Baris 7 sampai 16 berfungsi untuk mengambil value dari form

seperti judul pengaduan, isi dan lain lain. Value pada variabel lat dan long berasal dari koordinat latitude dan longitude dari lokasi yang dipilih oleh user melalui map yang disediakan. Baris 16 merupakan fungsi untuk menyimpan data pada tabel tb_pengaduan di

dalam database. Setelah selesai tersimpan akan kembali ke tampilan awal menu pengaduan

melalui fungsi pada baris 17.

Gambar 12 Halaman Administrator Baca Pengaduan

Gambar 13 Halaman Administrator Mengirim Tanggapan

Gambar 12 merupakan tampilan sistem ketika administrator membaca pengaduan yang

masuk, administrator dapat membaca pengaduan, melihat lampiran foto dan lokasi, serta

“terselesaikan”, jika administrator memberi status “ditolak” maka pengaduan akan otomatis terhapus dan jika administrator memberi status “ditindaklanjuti” maka pengaduan akan masuk ke daftar pengaduan yang harus ditindak lanjuti dalam sistem.

Kode Program 3 Script Google Map pada Lampiran Lokasi Baca Pengaduan

Kode Program 3 merupakan kode script google map yang berfungsi untuk

menampilkan map dengan koordinat yang disimpan. Baris 1 merupakan deklarasi variable

map yang akan dipanggil pada view. Baris 2 sampai 4 berfungsi untuk menampilkan lokasi

yang disimpan dengan koordinat latitude dan longitude yang disimpan pada variable lat dan

long. Untuk menampilkan marker pada map digunakan fungsi seperti pada baris 5 sampai

baris 11.

Kode Program 4 Fungsi Kirim Email Pada Controller c_admin

Kode Program 4 merupakan fungsi untuk mengirim email yang dipanggil saat

administrator mengirim tanggapan. Pada baris 1 sampai 11 merupakan konfigurasi dari

1. $ci = get_instance();

2. $ci->load->library('email'); 3. $config['protocol'] = "smtp";

4. $config['smtp_host'] = "ssl://smtp.gmail.com"; 5. $config['smtp_port'] = "465";

6. $config['smtp_user'] = "dishubsala3@gmail.com"; 7. $config['smtp_pass'] = "*******";

8. $config['charset'] = "utf-8"; 9. $config['mailtype'] = "html"; 10. $config['newline'] = "\r\n"; 11. $ci->email->initialize($config);

12. $ci->email->from('dishubsala3@gmail.com', 'Dinas Perhubungan Kota Salatiga');

13. $ci->email->to($alamat);

14. $ci->email->subject('Tanggapan : '.$subject); 15. $ci->email->message($isi);

16. $this->email->send())

17. redirect('c_admin/pengaduan','refresh');

1. var map = new google.maps.Map(document.getElementById('map'), { 2. zoom: 16,

3. center: new google.maps.LatLng(<?php echo $lat; ?>,<?php echo $long;?>), 4. mapTypeId: google.maps.MapTypeId.ROADMAP});

5. var latLng = new google.maps.LatLng(<?php echo $lat; ?>,<?php echo $long; ?>);

6. var marker = new google.maps.Marker({ 7. position : latLng,

8. title : 'lokasi', 9. map : map,

email seperti host, port, dan informasi login email. Baris 12 sampai 15 berisi tentang isi email

yang akan dikirimkan seperti alamat, subject, dan isi email. Variabel alamat, subject, dan isi berisi value yang dilempar pada fungsi ini ketika dipanggil. Baris 16 berisi fungsi mengirim

email dari library email, setelah selesai maka halaman akan refresh otomatis menggunakan fungsi pada baris 17.

Kode Program 5 Fungsi Menampilkan Grafik Pengaduan

Kode Program 5 merupakan kode program pada view yang berguna untuk menampilkan

grafik pengaduan. Pada baris 1 akan ditampilkan div yang bernama report yang berfungsi

memanggil tampilan grafik. Baris 2 dan 3 merupakan deklarasi script jquery dan library

highcharts yang berfungsi mengatur tampilan grafik.

Gambar 14 Email Tanggapan yang Terkirim Kepada User

Gambar 14 merupakan email tanggapan yang telah terkirim kepada user. Dalam email

ini berisi status pengaduan dan isi tanggapan dikirmkan oleh administrator.

Gambar 15 Halaman User Membaca Tanggapan 1. <div id="report"></div>

2. <script src="<?php echo

base_url();?>assets/admin/js/jquery.js"></script> 3. <script src="<?php echo

Gambar 15 merupakan tampilan ketika user ingin membaca tanggapan dari

administrator dan pengaduan yang sudah dikirimkan. Setelah user menerima notifikasi email, user dapat membaca pengaduan melalui website pengaduan, setelah membaca

tanggapan user dapat memberi rating dengan klik ikon bintang dibawah tanggapan sesuai

dengan tingkat kepuasan user terhadap tanggapan yang diberikan.

Pengujian sistem dilakukan untuk mengetahui kesempurnaan sistem dengan mengecek

masing-masing fungsi apakah dapat berjalan dengan baik atau masih ada bug. Pengujian

menggunakan teknik blackbox yaitu pengujian fungsi-fungsi sistem secara langsung tanpa

memperhatikan alur eksekusi program, pengujian ini dilakukan dengan memperhatikan apakah fungsi yang dibuat telah berjalan sesuai rancangan dan sesuai dengan yang diharapkan.

Tabel 1 Hasil Pengujian Blackbox

Fungsi yang diuji Kondisi Output yang

diharapkan

Output yang dihasilkan system

Status Pengujian

Login sukses

Login gagal

Mengisi form Username atau Password dengan benar

Mengisi form Username atau Password salah

Register akun baru Mengisi seluruh form

register

Kirim Pengaduan Baru Semua Form diisi termasuk lampiran

Baca pengaduan terkirim Menampilkan pengaduan tanpa

Update status pengaduan Pilih salah satu data Sukses ubah data Sukses ubah data Valid

Tambah tanggapan Form diisi dengan benar Sukses tambah data Sukses tambahdata Valid

Baca profil pengadu Sukses menampilkan

data

Sukses menampilkan data

Valid

Tabel 1 merupakan hasil pengujian alpha menggunakan metode blackbox, berdasarkan

pengujian ini dapat dilihat seluruh fungsi yang diuji mempunyai status valid yang berarti

fungsi yang diperlukan dalam system pengaduan telah berhasil berjalan dengan baik.

5.

Simpulan

Berdasarkan penelitian yang telah dilakukan, maka dapat disimpulkan bahwa Sistem

Pengaduan Online Dinas Perhubungan Kota Salatiga yang telah dirancang menggunakan

Framework Codeigniter dapat mengatasi masalah yang muncul selama ini seperti perlunya sistem pengaduan terpusat dan terkoordinir karena sistem ini dikelola oleh Dinas

Perhubungan Kota Salatiga sendiri. Penggunaan Framework Codeigniter dapat

mempermudah perancangan sistem karena mendukung model MVC (Model, View,

Controller) sehingga rancangan sistem menjadi terstruktur, Framework Codeigniter juga

mempunyi beberapa library yang berguna seperti library email, selain itu dapat menginstal

library dari pihak ketiga. Framework Codeigniter juga mendukung tampilan yang responsive

sehingga cocok digunakan di berbagai perangkat. Dengan ditambahkanya berbagai fitur

seperti lampiran foto dan lokasi yang menggunakan teknologi Google Map, maka akan

dihasilkan pengaduan masyarakat yang memenuhi syarat 4W1H (what, where, when, who,

how). Setelah syarat 4W1H terpenuhi maka pengaduan dari masyarakat akan mudah ditindak

lanjuti karena informasi yang diberikan sudah cukup lengkap. Pihak Dinas Perhubungan Kota Salatiga sendiri akan terbantu dengan adanya sistem ini karena dapat mempermudah koordinasi dalam melakukan tindak lanjut pengaduan dan melakukan pemberitahuan kepada

pengadu tentang tindak lanjut pengaduan dengan fasilitas notifikasi email. Melalui sistem

pengaduan ini Dinas Perhubungan Kota Salatiga dapat mengetahui jumlah pengaduan yang masuk berdasarkan kategori pengaduan yang ditampilkan melalui grafik pengaduan sehingga pihak Dinas Perhubungan Kota Salatiga dapat menyimpulkan bidang mana yang harus dilakukan evaluasi.

6.

Daftar Pustaka

[1] Novia Rahma, Moch. Saleh Soeaidy dan Minto Hadi . 2009. Peranan Dinas

Perhubungan Dalam Meningkatkan Pelayanan Masyarakat di Bidang Angkutan Kota (Studi pada Dinas Perhubungan Kota Malang). Jurnal Administrasi Publik, Volume 1, No 7.

[2] Wahyudiyanto, Eko. 2013. Perancangan Sistem Informasi Parkir Pada Dinas

[3] “Pelajar Dominasi Pelanggar Lalu Lintas Salatiga”, 2016, dalam

http://m.semarangpos.com/2016/05/27/operasi-patuh-2016-pelajar-dominasi-pelanggar-lalu-lintas-salatiga-723655, diakses pada 5 juni 2017.

[4] Bintarawan, Widya, A. 2013. Pengembangan Sistem Pengaduan Pelanggan

Pada Perusahaan Daerah Air Minum Kota Salatiga.

[5] Rena Ariyanti , Khairil dan Indra Kanedi. 2015. Pemanfaatan Google Map

API Pada Sistem Informasi Geografis Direktori Perguruan Tinggi di Kota Bengkulu. Jurnal Media Infotama, Volume 11, No 2.

[6] Surajino, S.H.R. 2004, Pembelajaran Berbasis Web: Suatu Tujuan dari aspek

Kognitif, Makalah Lokakarya metode Pembelajaran Berbasis Web-Departemen Teknik Penerbangan ITB, Bandung 1 Oktober 2004.

[7] Sharive. 2013. Yii Framework menguasai PHP terbaik, Yogyakarta: Lokomedia.

[8] Septian, Pandu. 2015. CodeIgniter Basic – Cara Menggunakan CodeIgniter,

http://www.kekirian.com/codeigniter-basic-cara-menggunakan-codeigniter.html.Diakses tanggal 8 November 2016.

[9] Akhmad. 2016. Pengertian Bootstrap, fungsi dan juga kelebihannya,

http://galeriprogramer.blogspot.co.id/2016/08/pengertian-bootstrap-fungsi-dan-juga.html. Diakses tanggal 17 Januari 2017

[10] Hasibuan, Z.A., 2007. Metodologi Penelitian Pada Bidang Ilmu Komputer

dan Teknologi Informasi, Konsep, Teknik, dan Aplikasi. Jakarta : Ilmu Komputer Univesitas Indonesia.

[11] Pressman, R.S., 2001, Software Engineering : A Practitioner’s Approach,