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

Salatiga

Juni 2017

1

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

implementasi akan dibangun sebuah website yang akan digunakan sebagai sistem informasi

2

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

mengetahui lokasi dan profil perguruan tinggi yang ada di Kota Bengkulu. [5]

3

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

Dalam penelitian ini terdapat lima tahapan yang harus dilakukan, yaitu : 1)

Identifikasi Masalah. 2) Perancangan Sistem. 3) Pembuatan Sistem. 4) Pengujian Sistem dan

Implementasi serta Analisis Hasil Pengujian. 5) Penulisan Laporan Hasil Penelitian.

4

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

apakah bisa berjalan dengan baik atau tidak. Tahap terakhir yaitu penulisan laporan hasil

penelitian, fungsi dari tahap ini adalah sebagai bentuk dokumentasi dan laporan dari hasil

penelitian.

5

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

mengkodekan sistem atau pembangunan sistem, berdasarkan program prototype sebelumnya

6

akan dilakukan pengembangan dengan menerjemahkan program prototype ke dalam Bahasa

pemrograman PHP (Hypertext Preprocessor) menggunakan Framework CodeIgniter, 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,

kemudian pengaduan akan diterima oleh Dinas Perhubungan Kota Salatiga melalui bagian

7

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

pengaduan yang sudah dikirimkan, kemudian pengaduan tersebut akan diserahkan kepada

bidang terkait untuk ditindaklanjuti.

8

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.

terima email tanggapan

baca artikel

kirim pengaduan

edit data diri

user

beri rating tanggapan mengelola data pengaduan

mengelola data artikel

tolak pengaduan

insert data artikel update data artikel

delete data artikel

administrator

lihat data usermengelola data user

kirim email

lihat data pengirim

lihat data pengaduan

mengirim tanggapan

melakukan tindak lanjutpegawai berwenang

baca pengaduan

9

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 diagram user

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

data pengaduan tersebut akan tersimpan dalam database dan dapat diakses oleh

administrator.

login

pilih menu tulis

pengaduan

mengisi form

pengaduan

mengirim

pengaduan

logout

cek data

akun

tampilan home

pengaduan

menampilkan form

pengaduan baru

mengambil

data akun

menyimpan data

pengaduan

invalidvalid

databasesistemuser

10

Gambar 7 Activity Diagram Kirim Tanggapan

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

administrator ingin membaca salah satu pengaduan tersebut, sistem akan mengambil data

pengaduan dan data pengadu yang ingin dibaca sehingga administrator dapat sekaligus

mengetahui profil pengirim, administrator harus menentukan status pengaduan tersebut

apakah ditolak, ditindak lanjuti atau terselesaikan. Selanjutnya administrator dapat memberi

tanggapan pada pengaduan tersebut, ketika tanggapan terkirim maka tanggapan tersebut akan

terkirim melalui email dan tersimpan dalam database dan dapat ditampilkan dalam website

user sehingga dapat dibaca oleh user.

menyimpan

data tanggapan

login

pilih menu

pengaduan

baca

pengaduan

lihat data

pengirim

kirim

tanggapan

logout

menetapkan status

pengaduan

cek data

akun

tampilan home

administrator

menampilkan data

pengaduan

mengirim email

notifikasi

mengambil

data akun

mengambil data

pengaduan

invalid

valid

databasesistemadministrator

11

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

terlebih dahulu sebelum menggunakan sehingga user harus register terlebih dahulu, tampilan

awal menu pengaduan bisa dilihat pada gambar 10.

12

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.

Gambar 11 Halaman Form Kirim Pengaduan Baru

13

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.

14

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

administrator dapat melihat profil pengirim melalui tab data pengirim dan mengirimkan

tanggapan serta merubah status pengaduan pada tab tanggapan seperti dapat dilihat melalui

gambar 13. Terdapat empat status pengaduan yaitu “diterima”, “ditolak”, “ditindak lanjuti”,

15

“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(,), 4. mapTypeId: google.maps.MapTypeId.ROADMAP}); 5. var latLng = new google.maps.LatLng(,);

6. var marker = new google.maps.Marker({ 7. position : latLng, 8. title : 'lokasi', 9. map : map, 10. draggable : false 11. });

16

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. 2.

17

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

Berhasil Login

Tidak bisa Login

Sukses Login

Gagal Login

Valid

Valid

Register akun baru Mengisi seluruh form register

Tidak mengisi seluruh

form register

Sukses tambah data

Gagal tambah data

Sukses tambah data

Gagal tambah data

Valid

Valid

Kirim Pengaduan Baru Semua Form diisi

termasuk lampiran

Semua form diisi tanpa lampiran

Sukses tambah data

Sukses tambah data

Sukses tambah data

Sukses tambah data

Valid

Valid

Baca pengaduan terkirim Menampilkan

pengaduan tanpa lampiran

Menampilkan pengaduan dengan

lampiran

Sukses menampilkan

data

Sukses menampilkan data

Sukses menampilkan

data

Sukses menampilkan data

Valid

Valid

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

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

Baca profil pengadu Sukses menampilkan data

Sukses menampilkan data

Valid

Kirim email tanggapan Alamat email benar Sukses mengirim email Sukses mengirim email Valid

Tampilkan grafik

pengaduan

Data pengaduan tidak

kosong

Sukses menampilkan

grafik

Sukses menampilkan

grafik

Valid

Memberi rating

tanggapan

Tanggapan belum diberi

rating

Tanggapan suadah diberi rating

Sukses tambah data

Sukses ubah data

Sukses tambah data

Sukses ubah data

Valid

Valid

18

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

Perhubungan Informasi dan Informatika Kabupaten Pacitan. Seminar Riset

Unggulan Nasiaonal Informatika dan Komputer FTI UNSA, Volume 2, No 1.

19

[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,

Amerika Serikat : R.S. Pressman and Associates.

https://www.blogger.com/profile/01663862657692622113http://galeriprogramer.blogspot.co.id/2016/08/pengertian-bootstrap-fungsi-dan-juga.html