Bab 4 Hasil Penelitian dan Pembahasan - Institutional Repository | Satya Wacana Christian University: Perancangan Sistem Informasi Pemetaan Lokasi SPBU di Kota Semarang Berbasis Web Menggunakan Google Maps API

Bab 4 Hasil Penelitian dan Pembahasan Berdasarkan perancangan yang telah dilakukan pada Bab 3, maka pada bagian Bab 4 dibahas tentang implementasi antarmuka mengenai perancangan sistem

  informasi pemetaan lokasi SPBU berbasis web di Kota Semarang. Tujuan dari implementasi antarmuka sistem adalah untuk memastikan aplikasi web yang sudah selesai dibuat bekerja secara efektif dan efisien sesuai dengan yang diharapkan. Aplikasi perancangan sistem informasi pemetaan lokasi SPBU berbasis web dibangun menggunakan Macromedia Dreamweaver 8 dengan menggunakan Google Maps API untuk menampilkan peta lokasi SPBU dan PHP script untuk user interface nya.

  Pada perancangan aplikasi web yang dibangun menyediakan sistem informasi yang lengkap mengenai lokasi SPBU, fasilitas pendukung pada lokasi SPBU, berita terbaru tentang Pertamina, info SPBU, dan pencarian lokasi yang dituju. Aplikasi web yang dibangun menggunakan Google Maps API yang berfungsi untuk menampilkan titik koordinat lokasi SPBU dengan marker yang akan menampilkan detail titik koordinat saat melakukan klik dengan mouse.

4.1 Antarmuka Sistem

  Tampilan yang dihasilkan sistem pemetaan lokasi SPBU berbasis web berupa yang telah dirancang pada Bab sebelumnya. Tampilan utama website saat

  form

  dijalankan adalah menu halaman Beranda. Tampilan menu halaman Beranda ditunjukkan pada Gambar 4.1.

Gambar 4.1 Menu Halaman BerandaGambar 4.1 adalah tampilan menu halaman Beranda yang berisi sidebar kiri yang menyediakan 5 topik berita, isi konten yang berada posisi tengah halaman, dan

  

sidebar kanan yang berisi voting, viewer, dan kalender. Pada sidebar kiri juga

  menyediakan fungsi link Indek Berita. Apabila user ingin membaca berita lainnya dapat memilih pada link Indek Berita.

  Antarmuka perancangan sistem pemetaan berbasis web dibagi menjadi 2 macam, yaitu: antarmuka user dan antarmuka admin. Berikut ini adalah penjelasan antarmuka sistem.

4.1.1 Antarmuka User

  Antarmuka untuk user dimulai dari halaman Beranda yang ditunjukkan pada

Gambar 4.1. Berdasarkan Gambar 4.1 terdapat 3 menu isi konten yang meliputi:

  1. Menu Navigasi Web

  Menu navigasi web menyediakan 5 menu pilihan untuk user yang terdiri dari menu Beranda, menu Cari Lokasi, menu Daftar SPBU, menu Info SPBU, dan menu

  

Login untuk admin. Menu navigasi web berada dibawah header. Menu navigasi web

ditunjukkan pada Gambar 4.2.

Gambar 4.2 Menu Navigasi Web

  Pada menu navigasi website yang ditunjukkan pada Gambar 4.2 menyediakan 5 menu yang meliputi: 1) Menu Beranda berisi halaman utama web. 2) Menu Cari Lokasi berisi pencarian lokasi SPBU yang dituju oleh user. 3) Menu Daftar SPBU berisi data lengkap lokasi SPBU di Kota Semarang. 4) Menu Info SPBU berisi informasi umum mengenai SPBU. 5) Menu Login digunakan untuk admin masuk pada halaman administrator sehingga dapat mengatur data admin dan data lokasi SPBU.

  2. Menu Kiri

  Menu kiri digunakan untuk menampilkan daftar kategori pilihan apabila user memilih, maka ditampilka informasi lengkap dari kategori pilihan. Pada aplikasi ini disediakan 3 menu kiri yang meliputi:

a. Menu Kiri Beranda Menu kiri beranda berisi Berita Terbaru yang menyediakan 5 topik berita.

  Apabila user memilih menu link Indek Berita, maka user menuju pada halaman Indek Berita. User dapat membaca isi berita dengan memilih link judul berita. Tampilan menu kiri beranda ditunjukkan pada Gambar 4.3.

Gambar 4.3 Menu Kiri Berita b.

   Menu Kiri Cari Lokasi

  Menu kiri cari lokasi berisi pilihan pencarian lokasi dengan kategori pilihan kecamatan. Terdapat 16 pilihan Kecamatan untuk pencarian lokasi di Kota Semarang.

  

User dapat memilih sesuai dengan lokasi SPBU yang dituju dengan memilih pilihan

kategori kecamatan. Menu kiri cari lokasi dapat ditunjukkan pada Gambar 4.4.

Gambar 4.4 Menu Kiri Cari Lokasi

c. Menu Kiri Info SPBU

  Menu kiri Info SPBU berisikan daftar pilihan mengenai informasi umum mengenai SPBU mulai dari definisi istilah, persyaratan standar PT. Pertamina untuk sarana dan prasarana, bangunan, lokasi dan perijinan umum, serta ketetapan initial fee SPBU. Menu kiri Info SPBU ditunjukkan pada Gambar 4.5.

Gambar 4.5 Menu Kiri Info SPBU

3. Menu Kontent

  Menu kontent menampilkan semua informasi mengenai sistem pemetaan lokasi SPBU di kota Semarang. Pada menu ini terdapat 4 jenis kontent yang ditampilkan antara lain menu kontent index, menu kontent lihat peta, menu kontent cari lokasi, dan menu kontent info SPBU.

a. Menu Kontent Beranda

  Menu kontent beranda menyediakan 2 tabel yaitu: tabel pertama adalah tampilan gambar SPBU yang terdapat pada tabel bagian atas. Tampilan hasil gambar dibangun dengan aplikasi WOW Slider yang dimasukkan ke dalam PHP. Tabel kedua yang terdapat pada tabel bagian bawah berisi penulisan yang meliputi tujuan dan manfaat dari perancangan aplikasi web. Tampilan menu kontent beranda ditunjukkan pada Gambar 4.6.

Gambar 4.6 Menu Kontent Beranda b.

   Menu Kontent Cari Lokasi

  Menu kontent cari lokasi menampilkan 2 tampilan hasil pencarian lokasi SPBU menurut kategori pilihan kecamatan yang meliputi: 1) Tampilan hasil pencarian berupa peta Google Maps yang terdapat pada bagian halaman atas isi kontent. Isi kontent cari lokasi pada peta Google Maps ditunjukkan pada Gambar 4.7.

Gambar 4.7 Isi Kontent Peta Cari Lokasi

  2) Tampilan hasil pencarian berupa tabel yang terdapat pada bagian halaman bawah setelah peta Google Maps. Isi kontent cari lokasi dalam bentuk tabel ditunjukkan pada Gambar 4.8.

Gambar 4.8 Isi Kontent Tabel Cari Lokasi

c. Menu Kontent Daftar SPBU

  Menu ini menampilkan dengan 2 bagian konten dari menu Daftar SPBU, yaitu bagian pertama adalah form kontent yang berfungsi untuk pencarian lokasi. Bagian kedua menampilkan tabel kontent yang berfungsi untuk menampilkan hasil pencarian lokasi SPBU berupa tabel. Menu kontent Daftar SPBU berfungsi untuk user mencari lokasi SPBU yang dituju. Hasil pencarian ditampilkan pada bagian tabel kontent. Pengujian pencarian lokasi dengan memilih kategori pilihan kecamatan untuk lokasi SPBU dengan menggunakan memilih kecamatan

  ‘Banyumanik’ pada form pilihan kontent, maka ditampilakan hasil pencarian yang ditunjukkan pada Gambar 4.9.

Gambar 4.9 Isi Kontent Menu Daftar SPBU d.

   Menu Kontent Info SPBU

  Isi kontent dari menu Info SPBU menyediakan informasi umum mengenai SPBU, mulai dari definisi istilah, persyaratan standar PT. Pertamina untuk sarana dan prasarana, bangunan, lokasi dan perijinan umum, serta ketetapan initial fee SPBU. Isi konten info ditampilkan saat user memilih pilihan daftar info pada menu kiri. Kemudian sistem menampilkan informasi pada isi kontent Info SPBU. Menu kontent Info SPBU ditunjukkan pada Gambar 4.10.

Gambar 4.10 Menu Kontent Info SPBU

4.1.2 Antarmuka Admin

  Antarmuka admin pertama kali dijumpai adalah halaman login yang terdapat pada menu Login. Halaman login ditunjukkan pada Gambar 4.11.

Gambar 4.11 Halaman Login Admin

  Admin melakukan proses login terlebih dahulu dengan mengisi form login yang

  ditunjukkan pada Gambar 4.11. Kemudian memasukkan username dan password sesuai dengan akun database yang terdaftar. Apabila login berhasil, maka admin ditampilkan menuju ke halaman admin. Pada halaman admin terdapat 2 fasilitas untuk mengatur data admin dan mengatur data lokasi SPBU. Halaman admin ditunjukkan pada Gambar 4.12.

Gambar 4.12 Halaman Admin

  Halaman admin yang ditunjukkan pada Gambar 4.10 terdapat 4 menu admin, antara lain sebagai berikut:

  1. Menu Admin

  Secara default antarmuka utama admin setelah proses login berhasil adalah halaman admin. Menu admin berisi tabel daftar admin yang menyediakan fungsi ubah dan hapus data admin yang ditunjukkan pada Gambar 4.12.

  2. Menu Data SPBU

  Menu ini berisi data lokasi berupa tabel yang memiliki 8 kolom yaitu: nomor urut, nomor SPBU, lokasi SPBU, kecamatan, latitude, longitude, fasilitas, keterangan yang menyediakan fungsi ubah dan hapus data lokasi SPBU. Tampilan menu data SPBU ditunjukkan pada Gambar 4.13.

Gambar 4.13 Menu Data SPBU

  Menu Data SPBU yang ditunjukkan pada Gambar 4.13 terdapat fungsi link pada tabel kolom kecamatan dan keterangan. Link pada tabel kolom Kecamatan berfungsi untuk menampilkan titik koordiat lokasi SPBU berupa peta Google Maps

  

API . Sedangkan untuk fungsi link pada kolom Keterangan digunakan untuk

  mengubah dan hapus data. Apabila admin memilih link ubah, kemudian admin menuju pada tampilan form ubah data, apabila admin memilih link hapus maka data lokasi pada baris yang dipilih terhapus oleh sistem.

3. Menu Tambah Data

  Menu tambah data menyediakan 2 tabel yang berisi form tambah data SPBU yang berada di sebelah kiri, dan form tambah admin yang berada di sebelah kanan.

  

Admin memasukkan data sesuai dengan tipe dari struktur di database. Menu tambah

data ditunjukkan pada Gambar 4.14.

Gambar 4.14 Menu Tambah Data Lokasi SPBU

  Menu tambah data untuk form tambah admin yang ditunjukkan pada Gambar 4.14 terdapat 2 keterangan untuk bagian input username dan password bahwa panjang input yang diisi maksimal 10 huruf atau angka. Keterangan tersebut telah sesuai dengan tipe struktur di database yaitu berupa tipe vachar dengan values=10.

4. Menu Logout

  Menu ini berisi tombol Logout yang digunakan untuk admin keluar dari halaman admin. Saat admin memilih tombol logout, kemudian admin kembali menuju pada menu halaman login.

4.2 Pengujian Sistem Pengujian sistem dilakukan dengan menggunakan metode Blackbox testing.

  Pengujian Blackbox dilakukan untuk menemukan kesalahan yang terjadi seperti fungsi yang tidak benar atau hilang, kesalahan interface, kesalahan struktur data, kesalahan kinerja, atau kesalahan inisialisasi atau terminasi. Pengujian dilakukan pada sisi user dan admin pada sistem pemetaan web ini. Sistem diujikan pada 30 user secara acak, dan kemudian user mengisi kuisioner yang berfungsi sebagai penilaian terhadap sistem.

  4.2.1 Pengujian User

  dengan benar Sukses menampilkan tabel pencarian lokasi

  4.2.2 Pengujian Admin

  Berdasarkan hasil pengujian yang ditunjukkan pada Tabel 4.1 terlihat bahwa status status pengujian dari setiap fungsi valid. Fungsi-fungsi yang diuji dapat berjalan dengan baik sehingga sistem sukses menghasilkan output yang diinginkan oleh user, maka disimpulkan bahwa aplikasi ini berjalan dengan baik dan sesuai yang diharapkan.

  Sukses menampilkan info SPBU Valid

  dengan benar Sukses menampilkan info SPBU

  Form di isi

  Lihat Info SPBU

  Sukses menampilkan titik pencarian lokasi Valid

  dengan benar Sukses menampilkan titik pencarian lokasi

  Form di isi

  Lihat Titik dari Pencarian Lokasi

  Sukses menampilkan tabel pencarian lokasi Valid

  Form di isi

  Pengujian aplikasi dilakukan pada sisi user atau pengunjung dari website. Hasil pengujian user ditunjukkan pada Tabel 4.1.

  Melakukan Pencarian Lokasi

  Suskses menampilkan Peta Valid

  dengan benar Suskses menampilkan Peta

  Form di isi

  Lihat Peta

  Sukses menampilkan berita terkini Valid

  dengan benar Sukses menampilkan berita terkini

  Form di isi

  Lihat Berita Terkini

  Output yang dihasilkan sistem Status Pengujian

  Fungsi yang diuji Kondisi Output yang diharapkan

Tabel 4.1 Hasil Pengujian Aplikasi Web User

  Pengujian aplikasi web juga dilakukan pada sisi admin dari website ini. Hasil pengujian aplikasi pada admin ditunjukkan pada Tabel 4.2.

Table 4.2 Hasil Pengujian Aplikasi Web Admin

  

Fungsi yang Output yang Output yang Status

diuji Kondisi diharapkan dihasilkan sistem Pengujian Username dan Password benar Sukses Login Sukses Login Valid Username dan Password salah

  atau kosong Gagal Login Gagal Login

  Login Valid

Form di isi Sukses tambah Sukses tambah

  dengan benar data data Valid

  Form di isi

  Tambah Data beberapa yang Gagal tambah Gagal tambah SPBU kosong data data Valid Ubah Data Form di isi Sukses ubah SPBU dengan benar data Sukses ubah data Valid Hapus Data Form di isi Sukses hapus SPBU dengan benar data Sukses hapus data Valid Load Data Form di isi Sukses load Sukses load data Lokasi SPBU dengan benar data lokasi lokasi Valid

  Berdasarkan hasil pengujian admin yang ditunjukkan pada Tabel 4.2 terlihat bahwa status pengujian dari setiap fungsi valid. Fungsi-fungsi yang diuji dapat berjalan dengan baik sehingga sistem sukses menghasilkan output yang diinginkan oleh admin, maka disimpulkan bahwa aplikasi ini berjalan dengan baik dan sesuai yang diharapkan.

4.3 Analisis Hasil Pengujian Sistem

  Analisis pengujian yang dilakukan yaitu dengan melakukan pengujian beta, di mana pengujian yang dilakukan oleh orang yang tidak ikut dalam pembuatan aplikasi atau calon pengguna aplikasi. Pengujian beta dilakukan dengan menggunakan kuesioner, yaitu dengan membagikan kuesioner pada sample user. Kemudian sample

  user mengisi kuesioner yang disediakan untuk mendapatkan data sebagai bahan analisis.

  Sample user yang mengisi kuesioner berjumlah 30 responden dan dipilih secara

  acak. Sample user pada pengujian ini adalah orang yang bertempat tinggal di kota

  Semarang. Berdasarkan pernyataan dalam kuesioner yang ada pada lampiran, menghasilkan data yang ditunjukkan pada Tabel 4.3.

Tabel 4.3 Hasil Jawaban Kuesioner

  

No Pernyataan SS S CS TS STS

  1

  12

  14

  3

  1 Pertanyaan 1

  2

  10

  13

  4

  2

  1 Pertanyaan 2

  3 Pertanyaan 3

  9

  16

  4

  1

  4 Pertanyaan 4

  13

  12

  3

  2

  5 Pertanyaan 5

  11

  9

  8

  2 Setelah semua jawaban diketahui pada Tabel 4.3, maka yang dilakukan adalah menghitung presentase jawaban responden yang telah mengisi kuesioner. Perhitungan dilakukan menggunakan skala Likert, di mana masing-masing jawaban diberi skor 1- 5 dengan penjelasan sebagai berikut:

  1. = 5 Sangat Setuju (SS)

  2. = 4 Setuju (S)

  3. = 3 Cukup Setuju (CS)

  4. = 2 Tidak Setuju (TS) 5.

  Sangat Tidak Setuju (STS) = 1 Hasil analisi data untuk pertanyaan 1 menunjukkan sebanyak 40,00% responden menjawab sangat setuju, 46,67% responden menjawab setuju, 10,00% responden menjawab cukup setuju. Jadi disimpulkan bahwa aplikasi ini mudah digunakan.

  Hasil analisis data untuk pertanyaan 2 menunjukkan sebanyak 33,33% responden menjawab sangat setuju, 43,33% responden menjawab setuju, 13,33% responden menjawab cukup setuju. Jadi disimpulkan bahwa aplikasi ini dapat dilihat dengan jelas.

  Hasil analisis data untuk pertanyaan 3 menunjukkan sebanyak 30,00% responden menjawab sangat setuju, 53,33% responden menjawab setuju, 13,33% responden menjawab cukup setuju. Jadi disimpulkan bahwa menu-menu pada aplikasi ini mudah dipahami dan tidak membingungkan.

  Hasil analisis data untuk pertanyaan 4 menunjukkan sebanyak 43,33% responden menjawab sangat setuju, 40,00% responden menjawab setuju, 10,00% responden menjawab cukup setuju. Jadi disimpulkan bahwa aplikasi ini membantu dan mempermudah masyarakat untuk mengetahui informasi lokasi SPBU di kota Semarang.

  Hasil analisis data untuk pertanyaan 5 menunjukkan sebanyak 36,67% responden menjawab sangat setuju, 30,00% responden menjawab setuju, 26,67% responden menjawab cukup setuju. Jadi disimpulkan bahwa aplikasi ini bermanfaat untuk digunakan oleh pengendara maupun masyarakat.