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
Salatiga
Juni 2017
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
1
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]
2
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.
3
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.
4
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
5
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
6
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.
7
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.
insert data artikel
terima email tanggapan
baca artikel
mengelola data user
update data artikel
lihat data user
kirim pengaduan
mengelola data artikel
delete data artikel
user
lihat data pengirim
administrator
edit data diri
tolak pengaduan
beri rating tanggapan
lihat data pengaduan
mengelola data pengaduan
baca pengaduan
kirim email
melakukan tindak lanjut
pegawai berwenang
mengirim tanggapan
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.
8
user
sistem
login
database
cek data
akun
invalid
pilih menu tulis
pengaduan
mengambil
data akun
valid
tampilan home
pengaduan
menampilkan form
pengaduan baru
mengisi form
pengaduan
menyimpan data
pengaduan
mengirim
pengaduan
logout
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.
9
administrator
login
sistem
cek data
akun
database
mengambil
data akun
invalid
valid
pilih menu
pengaduan
tampilan home
administrator
mengambil data
pengaduan
baca
pengaduan
menampilkan data
pengaduan
lihat data
pengirim
menetapkan status
pengaduan
kirim
tanggapan
mengirim email
notifikasi
menyimpan
data tanggapan
logout
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.
10
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.
11
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
12
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
1. ,);
6. var marker = new google.maps.Marker({
7. position : latLng,
8. title : 'lokasi',
9. map : map,
10. draggable : false
11. });
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
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');
Kode Program 4 merupakan fungsi untuk mengirim email yang dipanggil saat
administrator mengirim tanggapan. Pada baris 1 sampai 11 merupakan konfigurasi dari
15
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
1.
2.
3.
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.
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
1
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]
2
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.
3
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.
4
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
5
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
6
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.
7
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.
insert data artikel
terima email tanggapan
baca artikel
mengelola data user
update data artikel
lihat data user
kirim pengaduan
mengelola data artikel
delete data artikel
user
lihat data pengirim
administrator
edit data diri
tolak pengaduan
beri rating tanggapan
lihat data pengaduan
mengelola data pengaduan
baca pengaduan
kirim email
melakukan tindak lanjut
pegawai berwenang
mengirim tanggapan
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.
8
user
sistem
login
database
cek data
akun
invalid
pilih menu tulis
pengaduan
mengambil
data akun
valid
tampilan home
pengaduan
menampilkan form
pengaduan baru
mengisi form
pengaduan
menyimpan data
pengaduan
mengirim
pengaduan
logout
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.
9
administrator
login
sistem
cek data
akun
database
mengambil
data akun
invalid
valid
pilih menu
pengaduan
tampilan home
administrator
mengambil data
pengaduan
baca
pengaduan
menampilkan data
pengaduan
lihat data
pengirim
menetapkan status
pengaduan
kirim
tanggapan
mengirim email
notifikasi
menyimpan
data tanggapan
logout
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.
10
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.
11
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
12
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
1. ,);
6. var marker = new google.maps.Marker({
7. position : latLng,
8. title : 'lokasi',
9. map : map,
10. draggable : false
11. });
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
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');
Kode Program 4 merupakan fungsi untuk mengirim email yang dipanggil saat
administrator mengirim tanggapan. Pada baris 1 sampai 11 merupakan konfigurasi dari
15
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
1.
2.
3.