1

SISTEM LAPORAN CEPAT TANGGAP DESA BOJONGKULUR

MENGGUNAKAN FRAMEWORK BOOTSTRAP 4

1Nelly Sofi, 2Unggul Sulaiman 1nelly_sofi@staff.gunadarma.ac.id, 2unggulsulaiman@student.gunadarma.ac.id

Jurusan Teknik Informatika, Teknologi Industri, Universitas Gunadarma

Jurusan Sistem Informasi, Ilmu Komputer dan Teknologi Informatika, Universitas

Gunadarma

ABSTRAK

Di daerah desa Bojongkulur dalam hal menanggapi laporan warga desa dapat

dikategorikan lambat respondnya, karena kesulitan warga dalam melaporkan segala hal

yang terkait denga napa yang sedang atau sudah terjadi. Pelayanan masyarakat dalam

hal laporan kejadian masih belum maksimal. Penulisan ini bertujuan untuk membuat

sistem Laporan Cepat Tanggap Desa Bojongkulur yang diharapkan dapat membantu

Pemerintah Desa Bojongkulur menindaklanjuti setiap laporan masyarakat perilah

kejadian yang terjadi di wilayah Desa Bojongkulur. Tahapan dalam membuat

perancangan website ini adalah dengan menggunakan metode SDLC (System

Development Life Cycle). Membangun sebuah sistem dengan membuat perancangan

yang berfokus kepada penyajian kebutuhan aplikasi dan alat bantu pemodelan

diantaranya : Use case, perancangan antar muka, Class diagram, Activity Diagram,

Mock up. Pada perancangan dan pembuatan basis data menggunakan Database MySql.

Penyusunan kode program dituliskan menggunakan Bahasa pemrograman PHP

(Hypertext Preprocessor) dengan menggunakan Bootstrap 4. Sistem ini bersifat web

application sehingga mudah diakses. Beberapa fasilitas yang disediakan diantaranya

melihat informasi warga, membuat laporan kejadian, melihat laporan pribadi, melihat

informasi desa, menanggapi laporan warga, membuat laporan kejadian, melihat laporan

pribadi, mengelola data warga.

Kata Kunci : Website, Sistem Informasi, Sistem Laporan Cepat Tanggap, Desa

Bojongkulur

LATAR BELAKANG

Desa Bojongkulur adalah salah satu desa di Kecamatan Gunung Putri, Bogor, Jawa

Barat. Berdasarkan data desa pada Januari tahun 2019 jumlah warga Desa Bojongkulur

adalah 33,161 penduduk. Desa Bojongkulur memiliki 6 Dusun, 41 RW, dan 218 RT.

Pada tahun 2019 Kementerian Desa Pembangunan Daerah Tertinggal dan Transmigrasi

(DPDTT) menerbitkan Indeks Desa Mandiri Tahun 2019. Hasilnya Desa Bojongkulur

terpilih sebagai Desa Mandiri Peringkat 1 dari 416 desa se Kabupaten Bogor, juga

Peringkat 1 dari 5.400 desa se Provinsi Jawa Barat dan peringkat 7 dari 74.000 desa se-

Indonesia. Adapun pada tahun yang sama Desa Bojongkulur juga memenangkan

penghargaan sebagai Desa Digital Terbaik 2019 dalam acara Jabar Digital Innovation

Awards 2019 di The Trans Luxury, Bandung, Jumat (6/12/2019).

2

Mengingat beberapa bencana alam yang terjadi pada tahun ini maupun tahun

sebelumnya. Dengan perkembangan teknologi yang semakin maju, tentunya diperlukan

sebuah sistem yang dapat membantu warga desa untuk menyampaikan laporan tentang

kejadian luar biasa atau bencana alam yang terjadi disekitarnya yang dapat langsung

dengan cepat dan tanggap ditangani oleh pemerintah setempat.

Sejalan dengan uraian di atas, peneliti tertarik membangun Sistem Laporan Cepat

Tanggap Desa Bojongkulur Berbasis Framework Bootstrap 4. Sistem ini diharapkan

akan membantu dan memudahkan warga untuk melaporkan segala kejadian bahkan

kejadian yang luar biasa atau bencana alam yang terjadi di wilayah Desa Bojongkulur

agar dapat langsung ditindak lanjuti untuk ditangani oleh pemerintah Desa.

TELAAH PUSTAKA

Desa Bojongkulur

Bojongkulur menurut kata berasal dari ujung dan lor/kaler karena berada pada di bagian

ujung/utara, Bojongkulur menurut wilayah diapit oleh dua sungai disebelah timur

Sungai Cileungsi dan Sungai Cikeas disebelah barat, kemudian kedua sungai itu

bertemu disebelah utara desa.

Desa Bojongkulur adalah sebuah desa yang dahulunya (sebelum Republik Indonesia

merdeka) merupakan tempat persinggahan tentara Sultan Agung dari Mataram yang

akan menyerang Kumpeni Belanda di Batavia (DKI Jakarta sekarang). Ini di buktikan

dengan adanya makam-makam (situs-situs) seperti makam Raden Kapitan Saleh yang

terletak di Kampung Lembur (tepatnya di samping Perumahan Vila Nusa Indah Blok V

RW 23).

Laporan

Secara sederhana, laporan adalah bentuk penyampaian informasi baik secara lisan

maupun tulisan. Informasi yang disampaikan melalui laporan bisa bermacam-macam

tergantung kebutuhan mulai dari berita, keterangan, pemberitahuan ataupun

pertanggungjawaban.

Website

Website adalah sering juga disebut web, dapat diartikan suatu kumpulan halaman yang

menampilkan berbagai macam informasi seperti teks, data, gambar diam ataupun

bergerak, suara, video maupun gabungan dari semuanya, baik itu yang bersifat statis

maupun yang dinamis, yang dimana membentuk satu rangkaian bangunan yang saling

berkaitan dimana masing-masing dihubungkan dengan jaringan halaman atau sering

disebut dengan hyperlink.

Halaman website biasanya berupa dokumen yang ditulis dalam format Hyper Text

Markup Language (HTML), yang bisa diakses melalui HTTP, HTTP adalah suatu

protokol yang menyampaikan berbagai informasi dari server website untuk ditampilkan

kepada pengguna atau pemakai melalui aplikasi web browser. [11]

3

Unified Modeling Language(UML)

Unified Modeling Language (UML) adalah bahasa pemodelan visual yang digunakan

untuk menspesifikasikan, memvisualisasikan, membangun, dan mendokumentasikan

rancangan dari suatu sistem perangkat lunak. Pemodelan memberikan gambaran yang

jelas mengenai sistem yang akan dibangun baik dari sisi struktural ataupun fungsional.

UML dapat diterapkan pada semua model pengembangan, tingkatan siklus sistem, dan

berbagai macam domain aplikasi. Dalam UML terdapat kosep semantik, notasi, dan

panduan masing-masing diagram. UML juga memiliki bagian statis, dinamis, ruang

lingkup, dan organisasional UML bertujuan menyatukan teknik-teknik pemodelan

berorientasi objek menjadi terstandarisasi.

Bootstrap

Bootstrap adalah sebuah library framework CSS yang dibuat khusus untuk bagian

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

CSS, dan JavaScript yang paling populer di kalangan web developer. Pada saat ini,

hampir semua web developer telah menggunakan Bootstrap untuk membuat tampilan

front-end menjadi lebih mudah dan sangat cepat, karena hanya perlu menambahkan

class-class tertentu, misalnya untuk membuat tombol, grid, navigasi, dan lainnya.

Bootstrap telah menyediakan kumpulan komponen class interface yang telah dirancang

sedemikian rupa untuk menciptakan tampilan yang menarik, bersih, dan ringan. Selain

komponen class interface, Bootstrap juga memiliki fitur grid yang berfungsi untuk

mengatur layout pada halaman website yang bisa digunakan dengan sangat mudah dan

cepat. Selain itu, Bootstrap juga memberikan keleluasaan dalam mengembangkan

tampilan website yang menggunakan Bootstrap, yaitu dengan cara mengubah tampilan

Bootstrap dengan menambahkan class dan CSS. Salah satu contoh website besar yang

menggunakan framework Bootstrap adalah Twitter. Interface Twitter dibangun dengan

menggunakan Bootstrap karena sebenarnya Bootstrap dikembangkan oleh developer

Twitter sendiri. [7]

PHP

Hypertext Preprocessor atau di singkat PHP adalah suatu bahasa pemerograman yang

digunakan untuk membuat web dinamis, walau bisa juga digunakan untuk membuat

program lain. Tentunya bahasa pemerograman PHP berbeda dengan HTML, pada PHP

Script atau kode yang di buat tidak dapat di tampilkan pada halaman atau muka

website begitu saja, tapi harus diproses terlebih dahulu oleh web server lalu di

tampilkan dalam bentuk halaman website di web browser. Script PHP juga dapat di

sisipkan pada HTML dan script PHP selalu diawali dengan <?php dan di akhiri dengan

?>. Manajamen database yang biasanya digunakan untuk pemerograman PHP misalnya

seperti MySQL, tapi ada juga yang menggunakan Oracle, Microsoft Access, dan lain-

lain. PHP disebut juga sebagai bahasa pemrograman script server side, karena PHP di

proses pada komputer server. [4]

MySQL

4

MySQL pertama kali dirintis oleh seorang programmer database bernama Michael

Widenius. MySQL database server adalah RDBMS (Relasional Database Management

System) yang dapat menanagani data yang bervolume besar, meskipun begitu, tidak

menuntut resource yang besar. MySQL adalah database yang paling popular diantara

database-database yang lain. MySQL adalah Program database yang mampu mengirim

dan menerima data dengan sangat cepat dan multi user. [1]

METODE PENELITIAN

Metode penelitian yang digunakan selanjutnya adalah menggunakan metode SDLC

(System Development Life Cycle). Berikut ini merupakan tahapan -tahapan dari SDLC :

1. Tahap Rencana (Planning)

Pada tahap perencanaan peneliti mengidentifikasi kebutuhan pengguna (user

specification), studi kelayakan (feasibility study) baik dari segi teknik ataupun dari segi

teknologi. Peneliti juga melakukan wawancara dan pengumpulan data untuk kebutuhan

sistem dengan staff, perangkat khusus, dan Kepala Desa Bojongkulur dan juga

membahas penjadwalan proyek sistem atau perangkat lunak agar terpola dari segi

manajemen dan tentunya efisien. Pada tahap ini juga digunakan desain sistem UML

(Unified Modeling Language).

2. Tahap Analisis (Analysis)

Peneliti melihat kembali kebutuhan apa saja yang pengguna perlukan didasarkan pada

segenap permasalahan yang muncul pada pengguna dengan diproses menjadi bentuk

yang sederhana dan merealisasikannya kedalam diagram use case, mengenai komponen

perangkat lunak, hubungan antar objek, dan sebagainya.

3. Tahap Perancangan (Design)

Peneliti mencoba menemukan solusi dari masalah pada tahap analisis dan memodelkann

seluruh hasil analisis yang didapat. Seperti membuat model Hierarchical Task Analysis,

storyboard, struktur navigasi.

4. Tahap Implementasi

Pada tahap ini, proses yang peneliti lakukan adalah mengimplementasikan perancangan

sistem secara fisik kedalam bahasa pemrograman PHP, AJAX, Java Script, CSS dengan

manajemen basis data menggunakan MySQL.

5. Tahap Uji Coba (Testing)

Pada tahap pengujian penting digunakan untuk menentukan apakah sistem sudah sesuai

kebutuhan pengguna atau belum dan mengetahui kesalahan yang ada pada saat

pengoperasian program dan mengkaji ulang ke tahap-tahap sebelumnya. Tujuannya

untuk meminimalisir cacat program sehingga sistem dapat dikembangkan agar benar-

benar membantu pengguna saat melakukan tugas-tugasnya. Uji coba dilakukan

menggunakan laptop Asus A43S Core dengan processor Intel(R) Core(TM) i3-2350M

CPU @ 2.30GHz (4 CPUs), ~2.3GHz dan RAM 4.00 GB. Untuk sistem operasi yang

digunakan adalah Windows 7 Ultimate 64-bit (6.1, Build 7601).

6. Tahap Pemeliharaan (Maintenance)

5

Pada tahap ini melakukan perawatan dan pembetulan dari kesalahan pada sistem yang

tidak ditemukan pada tahap sebelumnya, meningkatkan kinerja dan layanan sistem

sebagai kebutuhan baru. Sistem akan kembali pada tahap perencanaan jika waktu dalam

penggunaan sistem telah habis.

HASIL DAN PEMBAHASAN

Gambaran Website

Sistem laporan cepat tanggap ini diperuntukkan kepada masyarakat Desa Bojongkulur

untuk memberian laporan yang sedang terjadi seperti bencana alam ataupun kejadian

luar biasa yang terjadi di lingkungan sekitar sehingga dapat langsung memberian

laporannya dengan system laporan cepat tanggap ini.

Perancangan

Pada tahap ini membahas tentang perancangan dan analisis yang telah dilakukan. Sesuai

dengan perancangan dibuat menggunakan Struktur Navigasi, perancangan website

dibuat dengan menggunakan bahasa pemrograman PHP dan menggunakan perancangan

UML serta menggunakan database yaitu MySQL kemudian di Implementasi Website

Struktur Navigasi

Struktur navigasi adalah struktur atau alur dari suatu sistem yang merupakan rancangan

dari beberapa area yang berbeda dan dapat membantu mengorganisasikan seluruh

elemen pembuatan website. Pada website yang peneliti buat struktur navigasi yang

digunakan adalah struktur navigasi campuran merupakan gabungan dari ketiga

struktur sebelumnya yaitu linier, non-linier dan hirarki. Pada situs website ini,

struktur navigasi dibagi menjadi empat, yaitu struktur navigasi umum, struktur navigasi

backend warga, struktur navigasi backend perangkat dan struktur navigasi backend

pengurus.

Struktur navigasi yang digunakan pengunjung tanpa login adalah struktur navigasi

hirarki, yaitu pengunjung dapat melihat aplikasi web secara keseluruhan sehingga

pengunjung mendapatkan informasi yang baik., seperti yang terdapat pada gambar 1.

Gambar 1. Struktur Navigasi Umum

Struktur navigasi yang digunakan pengunjung dengan login adalah Warga adalah user

yang menggunakan web setelah melakukan registrasi dan kemudian login. Sebagai

warga, website ini memberikan fasilitas seperti melakukan laporan, mengelola laporan,

memperbarui data diri, dan sebagainya. Seperti yang terdapat pada gambar 2.

6

Gambar 2. Struktur Navigasi Backend Warga

Gambar 3. Struktur Navigasi Backend Perangkat

Terlihat pada gambar 3 di atas merupakan struktur navigasi backend perangat,

perangkat adalah pengunjung yang bertugas untuk menanggapi laporan kejadian yang

disampaikan oleh warga. Perangkat juga dapat mengelola data warga, mengelola

beberapa laporan, dan sebagainya.

Pengurus adalah pengunjung yang bertugas untuk mengelola data perangkat, warga, dan

laporan, terlihat pada gambar 4 di bawah ini :

Gambar 4. Struktur Navigasi Backend Pengurus

Perancangan UML

Tahap ini menjelaskan alur sistem dan alur data yang dijelaskan melalui diagram use

case, activity diagram, dan sequence diagram. - Use Case Diagram Warga

7

Gambar 5. Use Case Diagram Warga

Pada Gambar 5 menunjukkan warga sebagai aktor yang dapat mengakses informasi

desa pada dashboard, membuat laporan pada website dari kejadian yang terjadi dan

melihat laporan pribadi.

- Use Case Diagram Perangkat

Gambar 6. Use Case Diagram Perangkat

Pada gambar 6 menunjukkan use case diagram perangkat, dimana perangkat adalah

aktor. Pada website ini, perangkat dapat mengelola warga yang telah terdaftar,

menanggapi laporan warga, mengelola laporan warga, membuat laporan kejadian, serta

melihat laporan pribadi.

- Use Case Diagram Pengurus

8

Gambar 7. Use Case Diagram Pengurus

Pada gambar 7 menunjukkan pengurus sebagai aktor yang dapat mengakses informasi

desa pada dashboard, mengelola laporan, mengelola data warga dan mengelola data

perangkat.

- Activity Diagram Warga

Gambar 8. Activity Diagram Warga

Pada gambar 8 menjelaskan alur kerja yang dilakukan warga untuk melaporkan

kejadian. Untuk melakukan pelaporan, warga diwajibkan login. Kemudian warga

memilih menu laporkan kejadian dan mengisi form laporan, lalu database akan

menyimpan data laporan.

- Activity Diagram Perangkat

9

Gambar 9. Activity Diagram Perangkat

Pada Gambar 9 menjelaskan alur kerja yang dilakukan perangkat untuk menanggapi

laporan. Perangkat dapat menanggapi laporan warga. Lalu database akan mengupdate

status dari laporan tersebut.

- Class Diagram

Gambar 10. Class Diagram

Pada class diagram di atas menjelaskan bahwa tabel admin dan cus berdiri sendiri tanpa

relasi. Tabel user dan laporan memiliki relasi. Relasi antara user dan laporan adalah 1 :

M, yang berarti user dapat mengelola pada banyak laporan.

Perancangan Antarmuka

Perancangan tampilan adalah tahapan merancang antarmuka antara pemakai dan

aplikasi. Pada tahap ini, ada beberapan perancangan tampilan berdasarkan halaman-

halaman yang terdapat pada website SiBokul.

10

Perancangan Landing Page

Halaman landing page ini menjadi halaman utama bagi pengguna dengan tipe warga,

perangkat, dan pengurus. Pada halaman ini, terdapat menu home, about, register,

contact us, dan login. Komponen-komponen tersebut berupa teks, ikon, gambar, dan

number stepper. Keseluruhan komponen tersebut membangun halaman landing page

yang terdapat banyak menu seperti home dan about, FAQ, Berikut adalah perancangan

tampilan landing page yang dapat dilihat pada gambar 11

Gambar 11. Perancangan Tampilan Landing Page

Peracangan login SiBokul

Halaman login diperuntukkan untuk pengguna dengan tipe warga, perangkat dan

pengurus. Komponen yang ada pada halaman ini adalah teks, gambar, text field dan

button. Berikut adalah perancangan tampilan login untuk pengguna dengan tipe warga,

perangkat dan pengurus.

Gambar 12. Form Login SiBokul

11

Perancangan Warga Dashboard

Warga dashboard adalah halaman khusus pengguna dengan tipe warga. Halaman ini

terdiri dari beberapa komponen yaitu button, text, gambar dan ikon. Berikut adalah

perancangan tampilan pengguna dengan tipe warga dashboard.

Gambar 13. Halaman Warga Dashboard

Perancangan Halaman Laporan Warga

Tampilan halaman laporan warga ini berfungi agar pengguna dengan tipe warga dapat

melihat status perkembangan dari laporannya. Oleh karena itu, komponen pembangun

halaman ini adalah text, table, button, drop down, search, dan ikon.

Gambar 14. Halaman Laporan Warga

Perancangan Halaman Form Laporan

Perancangan tampilan form laporan digunakan untuk mengisi data dari kejadian yang

akan dilaporkan. Form laporan dapat diakses dengan menekan tombol “lapor sekarang”

yang ada pada halaman dashboard pengguna dengan tipe warga. Oleh karena itu,

komponen yang terdapat pada halaman ini adalah text field, button, calendar, icon, text,

dan button browse.

12

Gambar 15. Halaman Form Laporan

IMPLEMENTASI

Halaman utama di fokuskan untuk menampilkan informasi desa yang tersedia dan

informasi lokasi dari kantor desa.

Gambar 16. Halaman Utama

Pada gambar 16 warga dapat memilih login untuk masuk ke profile masing-masing

warga, sehingga setelah login akan tampil seperti gambar 17.

Gambar 17. Halaman Warga

13

Bagian halaman perangkat di fokuskan untuk menampilkan informasi desa, manajemen

laporan, manajemen data warga, dan data pribadi. Pada code.php ini, data – data

dihimpun dari query akan dikirimkan ke perangkat.php dalam bentuk array.

Selanjutnya, pada perangkat.php, variabel data – data langsung dapat dipanggil

menggunakan fungsi php.

Gambar 18. Halaman Perangkat

Bagian halaman pengurus di fokuskan untuk menampilkan informasi desa, manajemen

data perangkat, manajemen data warga, manajemen laporan dan data pribadi. Pada

code.php ini, data – data dihimpun dari query akan dikirimkan ke pengurus.php dalam

bentuk array. Selanjutnya, pada pengurus.php, variabel data – data langsung dapat

dipanggil menggunakan fungsi php.

Gambar 19. Halaman Pengurus

.

Uji Coba

Pada uji coba ini dilakukan pada 4 device yang berbeda dan pada browser yang berbeda.

Tahap selanjutnya setelah proses implementasi yaitu uji coba website untuk mengetahui

apakah website sudah sesuai dengan yang diharapkan atau belum.

Uji Coba pada Web Browser

Menggunakan dua web browser berbeda yaitu Google Chrome dan Mozilla Firefox

untuk menguji apakah website Laporan Cepat Tanggap Desa Bojongkulur dapat

berjalan dengan baik atau tidak.

14

Tabel 1. Uji Coba Browser

Browser Versi Hasil

Google Chrome 83.0.4103.106 • Website dapat berjalan dengan baik

• Tidak terjadi perubahan bentuk

website

• Tidak terjadi perubahan pada font dan

ukuran font

• Tidak terjadi perubahan pada gambar-

gambar tampilan.

• Halaman pengguna baik itu bertipe

warga, perangkat, ataupun pengurus

dapat berjalan dengan baik

Mozilla Firefox 77.0.1 • Website dapat berjalan dengan baik

• Tidak terjadi perubahan bentuk pada

website

• Tidak terjadi perubahan font dan

ukuran font

• Tidak terjadi perubahan pada gambar-

gambar tampilan

• Halaman pengguna baik itu bertipe

warga, perangkat, ataupun pengurus

dapat berjalan denga baik

Black Box Testing

Black box testing adalah metode pengujian perangkat lunak yang hanya mengamati

hasil keluaran dari program yang dijalankan dan memeriksa fungsionalitas program.

- Login

Tabel 2. Pengujian Login

Data Masukan Hasil yang

diharapkan

Hasil Kesimpulan

Username: fajar

Password: 123

Dapat login ke dalam

website

Dapat login ke

dalam website

Berhasil

Username: fajar

Password: 456

Tidak dapat login

karena password

salah

Tidak dapat

login

Berhasil

Username dan

password tidak diisi

Diperintahkan untuk

mengisi email dan

password

Diperintahkan

untuk mengisi

email dan

password

Berhasil

15

- Register

Tabel 3. Pengujian Register

- Warga Melakukan Laporan

-

Tabel 4. Pengujian Warga Melakukan Laporan

Data Masukan Hasil yang

diharapkan

Hasil Kesimpulan

NIK/KTP: 123456789

Nama: Dwi Santi

Kampung/Perumahan:

Bumi Mutiara

RT : 001

RW : 001

Alamat : Bumi Mutiara

Blok AB10

No Handphone:

081212341234

Upload Foto : Insert File

Email: dwi@gmail.com

Username:

dwi

Password: asdf

Confirm password: asdf

Dapat registrasi

dan login ke

dalam website

Dapat

registrasi dan

login ke dalam

website

Berhasil

Semua form diisi kecuali

upload gambar

Tidak dapat

registrasi karena

gambar tidak di

upload

Tidak dapat

registrasi

Berhasil

Nilai password dan confirm

password berbeda

Muncul pesan

kesalahan

Muncul pesan

kesalahan

Berhasil

Data Masukan Hasil yang

diharapkan

Hasil Kesimpulan

Judul :

Pohon Tumbang

Isi : Menyebabkan

kemacetan di wilayah

kampung bubulak

Waktu : 2020-08-10

16.00

Gambar : upload file

Data tesimpan pada

menu laporan baru,

dan tampil di

halaman perangkat

berdasarkan

wilayah perangkat

yang sesuai dengan

warga

Laporan

berhasil

dengan

berstatus

“laporan baru”

dan menunggu

ditanggapi oleh

perangkat

Berhasil

16

- Perangkat Menanggapi Laporan

Tabel 5. Perangkat Menanggapi Laporan

- Contact Us

Tabel 6. Pengujian Contact Us

Data Masukan Hasil yang

diharapkan

Hasil Kesimpulan

Melihat laporan

dengan status

“laporan baru”,

lalu menekan

tombol “proses”

Status berubah menjadi

“laporan diproses” dan

menampilkan nama

perangkat dan waktu

saat laporan tersebut di

proses

Status laporan

berhasil

berubah

menjadi

“laporan

diproses”

dengan

menyimpan

nama perangkat

dan waktu

laporan di

proses

Berhasil

Melihat laporan

yang diproses, lalu

menekan tombol

“selesai”,

memasukkan

keterangan dan

upload file gambar

Status berubah menjadi

selesai dan

menampilkan

keterangan dan juga

waktu laporan selesai

Status berhasil

berubah

menjadi

“laporan

selesai” dan

menyimpan

keterangan dan

gambar

Berhasil

Data Masukan Hasil yang

diharapkan

Hasil Kesimpulan

Nama : adnan

Email :

adnan@gmail.com

No Telpon :

081212345678

Pesan :

Sangat Membantu.

Menampilkan

pesan terkirim

Berhasil,

pesan

tersimpan

kedalam

database

Berhasil

17

- Pengurus Memanajemen Warga

-

Tabel 7. Pengujian Pengurus Memanajemen Warga

Data Masukan Hasil yang

diharapkan

Hasil Kesimpulan

NIK/KTP: 123456789

Nama: Abdul

Kampung/Perumahan:

Villa Nusa Indah 3

RT : 012

RW : 015

Alamat : Villa Nusa

Indah 3

No Handphone:

08128761236

Upload Foto : Insert

File

Email:

abdul@gmail.com

Username:

abdul

Password: 1234

Confirm password:

1234

Data warga

ter input ke

dalam

database

Berhasil

menambah

data warga

Berhasil

Merubah data warga

abdul dengan

merubah nomor

handphone menjadi

087798987676

Nomor

handphone

warga atas

nama abdul

berubah

Berhasil

merubah no

handphone

warga yang

bernama

abdul

Berhasil

Menghapus data

warga dengan

menekan tombol

hapus pada kolom

tabel

Data warga

terhapus

Berhasil

menghapus

data warga

dari database

Berhasil

Mengetik kata pada

kolom pencarian

Muncul data

warga

berdasarkan

kata kunci

Berhasil

memunculkan

data warga

berdasarkan

kata kunci

yang

dimasukkan

Berhasil

18

- Pengurus Memanajemen Perangkat

Tabel 8. Pengujian Pengurus Memanajemen Perangkat

Data

Masukan

Hasil yang

diharapkan

Hasil Kesimpulan

Menambah

perangkat

dengan

memasukkan

nik/ktp dan

foto

Status warga

berubah menjadi

perangkat

Berhasil

merubah status

warga menjadi

perangkat

Berhasil

Merubah data

perangkat

abdul dengan

merubah

nomor

handphone

menjadi

089672837465

Nomor handphone

perangkat atas

nama abdul

berubah

Berhasil

merubah no

handphone

perangkat yang

bernama abdul

Berhasil

Menghapus

data perangkat

dengan

menekan

tombol hapus

pada kolom

tabel

Data perangkat

terhapus

Berhasil

menghapus

data perangkat

dari database

Berhasil

Mengetik kata

pada kolom

pencarian

Muncul data

perangkat

berdasarkan kata

kunci

Berhasil

memunculkan

data perangkat

berdasarkan

kata kunci

yang

dimasukkan

Berhasil

19

- Menghapus komentar

Tabel 9. Pengujian Menghapus Komentar

- Pengujian Logout

Tabel 10. Pengujian Logout

Berdasarkan hasil uji coba pada browser dan blackbox testing untuk tampilan dan fitur

website SiBokul sesuai dengan fungsi yang diinginkan oleh pembuat dan warga artinya

website tersebut responsive.

Website juga telah diuji coba kepada 21 pengguna serta diminta untuk mengisikan

kuisioner yang berisikan 12 pertanyaan terkait dengan website SiBokul seperti

kemudahan menggunakan, tampilan pada website, manfaat dengan adanya website

seperti informasinya, mempermudah atau tidak sampai dengan proses pelaoprannya.

Berdasarkan hasil rekapan kuisioner dihitung dengan menggunakan likert,

menghasilkan bahwa 88.9% website Si Bokul ini dapat diterima oleh pengguna

berdasarkan aspek kemudahan, kualitas tampilan antarmuka, dan manfaat.

KESIMPULAN DAN SARAN

Kesimpulan

Website Lapoan Cepat Tanggap Desa Bojongkulur telah berhasil dibuat. Setelah tahap

pengujian dilakukan, didapati bahwa aplikasi dapat melakukan aktivitas utama,

yaitu warga yang membuat laporan dan perangkat menanggapi laporan tersebut,

registrasi data warga untuk pembuatan akun baru, pengurus memanajemen data warga

dan perangkat, admin menambah data pengurus, perubahan data diri dan password, serta

menampilkan laporan dari setiap proses laporan. 88.9% berdasarkan hasil kuesioner dari

21 responden menyatakan bahwa website ini sudah dapat diterapkan dalam menindak

lanjuti setiap laporan masyarakat perihal kejadian yang terjadi di wilayah Desa

Bojongkulur. Berdasarkan hasil uji coba pada web browser dan dengan menggunakan

Data

Masukan

Hasil yang

diharapkan

Hasil Kesimpulan

Menekan

tombol hapus

pada table

inbox

Komentar terhapus Berhasil

menghapus

komentar dari

database

Berhasil

Data

Masukan

Hasil yang

diharapkan

Hasil Kesimpulan

Logout Keluar dan

menghapus session

pengguna

Keluar dan

menghapus

session

pengguna

Berhasil

20

metode black box testing, website Laporan Cepat Tanggap Desa Bojongkulur dapat

berjalan dengan baik pada dua web browser yaitu chrome dan firefox,serta website ini

berhasil menjalankan fungsionalitasnya dari hasil keluaran program yang dijalankan.

Saran

Perlunya pengembangan pada fitur website ini dengan menambah fitur chat sebagai

forum agar warga dan perangkat dapat berinteraksi dan menambah fitur share location

agar dengan tepat perangkat dapat mendatangi sumber laporan.

DAFTAR PUSTAKA

[1] Anhar, ST. (2015). Panduan Menguasai PHP & MySQL Secara Otodidak. Jakarta:

Mediakita.

[2] Ir. Harianto Kristanto. 2014. Konsep Dan Perancangan Database. Yogyakarta:

ANDI.

[3] Koesheryatin & Taryana Suryana. 2014. Aplikasi Internet Menggunakan HTML,

CSS, dan JavaScript. Elex MediaKomputindo, Jakarta.

[4] Lukmanul Hakim. 2014. Rahasia Inti Master PHP dan MySql. Lokomedia,

Yogyakarta

[5] Nurul Khomairah. 2014. Analis Perbangingan Motivasi Konsumen Berbelanja di

Pasar Tradisional Kemiri Muka dengan Pasar Moderen Carrefour ITC

Depok. Penulisan Ilmiah. Tidak Diterbitkan. Fakultas Ekonomi. Universitas

Gunadarma: Jakarta.

[6] Syarif Sagaf Adibaji. 2018. Sistem Informasi Silsilah Alawiyyin di Indonesia

Berbasis Website. Penulisan Ilmiah. Tidak Diterbitkan. Fakultas Ilmu

Komputer dan Teknologi Informasi.Universitas Gunadarma: Jakarta.

[7] URL: https://www.nesabamedia.com/pengertianbootstrap/, diakses pada September

2020.

[8] URL: https://salamadian.com/sdlc-system-development-life-cycle/, diakses pada

Oktober 2020.

[9] URL: https://www.dosenpendidikan.co.id/xampp-adalah/, diakses pada Oktober

2020

[10] URL :https://www.codepolitan.com/unified-modeling-language-uml, diakses pada

September 2020.

[11] URL :https://www.boc.web.id/pengertian-website-webhosting-

domainname/, diakses pada Nopember 2020.