BAB 4 IMPLEMENTASI DAN EVALUASI
4.1 Implementasi Untuk mengimplementasikan sistem
ini, diperlukan beberapa
kebutuhan yang harus dapat dipenuhi. Kebutuhan yang diperlukan berupa hardware
dan
software.
Berikut
adalah
spesifikasi
minimal
yang
direkomendasikan untuk dapat menjalankan sistem. 4.1.1
Spesifikasi Hardware Kebutuhan hardware minimal untuk dapat menjalankan sistem situs multimedia informasi LSM-LPAB adalah sebagai berikut : 1. Server •
Processor Intel Pentium IV 2,4 GHz
•
Hard disk minimum 2GB free space
•
Memory RAM 1 GB
•
Graphic Card 32bit
•
Mouse dan keyboard
•
Monitor
2. Client • Processor Intel Pentium IV 2,4 GHz • Hard disk minimum 2GB free space • Memory RAM 1 GB • Graphic Card 32bit • Mouse dan keyboard 193
194
• Monitor
4.1.2
Spesifikasi Software Kebutuhan software minimal untuk dapat menjalankan sistem situs multimedia informasi LSM-LPAB adalah sebagai berikut : 1. Server • Sistem Operasi Windows 32-bit seperti 9x, Me, NT, 2000, XP, atau Windows Server 2003 • XAMPP v1.6.8 atau MySQL v5.0 • Browser Mozilla Firefox, Google Chrome, Internet Explorer, Safari, dan lain-lain. • Modem atau Akses Internet 2. Client • Windows XP • Browser Mozilla Firefox, Google Chrome, Internet Explorer, Safari, dan lain-lain. • Modem atau Akses Internet
4.1.3
Spesifikasi Administrator • Memahami sistem kontrol panel web server (cPanel). • Memahami pemrograman berbasis PHP, HTML dan Database MySql (atau SQL server).
195
4.1.4
Instalasi Untuk mengimplementasikan sistem ini, diperlukan instalasi XAMPP sebagai local web server (offline). Berikut ini adalah langkah-langkah instalasi XAMPP untuk Sistem Operasi Windows : 1. Klik dua kali pada file installer XAMPP. 2. Pilih bahasa yang diinginkan, misalnya English, lalu klik OK. 3. Klik “Next” pada jendela Setup Wizard untuk memulai installasi.
Gambar 4.1 XAMPP Setup Wizard versi 1.7.0 4. Selanjutnya pilih lokasi instalasi XAMPP. (Default diletakkan pada disk c:\), lalu klik “Next”.
Gambar 4.2 Memilih Destination Folder 5. Pilih tiga kotak pada bagian Service Section, yaitu Install Apache as service, Mysql as service, dan Filezilla as service, lalu klik Install.
196
6. Klik Finish setelah XAMPP selesai di-install. 7. Kemudian akan muncul dialog, apakah akan menjalankan XAMPP Control Panel sekarang atau lain kali. Klik Yes bila akan menjalankannya. 8. Klik Start masing-masing pada Apache dan MySql. 9. Kemudian coba jalankan pada browser dengan mengetikkan “http://localhost”, bila muncul tampilan seperti di bawah ini maka PC sudah berfungsi sebagai web server.
Gambar 4.3 Tampilan XAMPP setelah Berhasil Di-install Selain instalasi pada local server, berikut ini adalah langkahlangkah untuk instalasi pada web server (online) : 1. Admin masuk ke halaman cPanel yang merupakan fasilitas control panel yang disediakan oleh jasa web hosting.
197
Gambar 4.4 Halaman cPanel pada Web Hosting 2. Buka file manager, melalui file manager, file dapat di-upload, download, dan diatur penempatannya di root server.
Gambar 4.5 Halaman File Manager 3. Upload file aplikasi dalam bentuk .zip yang berisi source code dan image yang digunakan untuk aplikasi ini.
198
Gambar 4.6 Halaman Upload File 4. Ekstrak file .zip tersebut, setelah diekstrak file .zip sudah dapat dihapus. 5. Keluar dari domain redirection dan masuk ke database manager untuk membuat database dan username yang dapat mengakses database tersebut. Pertama, create database, lalu create user. Setelah itu isi add user to database dengan database dan user yang telah dibuat. Nama database, username, dan password akan digunakan untuk melakukan koneksi ke database server dalam aplikasi.
Gambar 4.7 Menambah User ke dalam Database 6. Keluar dari database manager dan kembali masuk ke file manager, ubah isi file config.php dengan nama database, username, dan password yang digunakan dengan menggunakan
199
code editor yang telah disiapkan di Cpanel . Dengan mengubah config.php maka semua file dan modul dalam aplikasi akan terhubung ke database yang dibuat. 7. Setelah melalui semua proses diatas, aplikasi siap dijalankan.
4.2 Tampilan 4.2.1
Tampilan Guest
Gambar 4.8 Tampilan Index Pada halaman Index (Gambar 4.8) terdapat empat buah menu, yaitu Belajar, Permainan, Galeri dan Profil.
Gambar 4.9 Tampilan Belajar Halaman Belajar (Gambar 4.9) berisi Materi, Video dan Faq yang berkaitan dengan Pengenalan dan Pencegahan banjir. Isi Materi
200
disajikan dalam bentuk teks dan gambar (Gambar 4.10). Gambar pada isi materi dimaksudkan untuk memberikan gambaran kepada user dari materi yang disajikan agar lebih mudah dipahami.
Gambar 4.10 Tampilan isi Materi
Gambar 4.11 Tampilan Video Pada halaman video disajikan beberapa video yang berkaitan dengan Pengenalan dan Pencegahan Banjir. User dapat memilih satu dari beberapa video yang disajikan untuk dimainkan. Pada saat video dimainkan, user memiliki akses kontrol pada video (play, pause, stop, dan sebagainya).
201
Gambar 4.12 Tampilan faq Halaman faq berisi pertanyaan-pertanyaan yang sering diajukan saat terjadi bencana banjir. Mulai dari tindakan yang perlu dilakukan saat terjadi bencana banjir, nomor telpon darurat yang dapat dihubungi saat terjadi banjir, dan lain sebagainya.
Gambar 4.13 Tampilan Permainan Halaman Permainan berisi game flash “Game Tebak Kata” dan “Save Earth Shooter”. Game Play dari kedua permainan ini masih mengenai bencana banjir.
202
Gambar 4.14 Tampilan Awal Tebak Kata Gambar 4.14 adalah layar awal dari permainan Game Tebak Kata. Game Tebak kata adalah permainan menjawab pertanyaan mengenai bencana banjir yang terdiri dari satu atau dua kata. Untuk memulai memainkan permainan, user menekan menu “Berani”. Selanjutnya akan ditampilkan layar permainan yang berisi pertanyaan dan baris kosong yang harus diisi (Gambar 4.15). User memilih abjad yang tersedia pada bagian bawah untuk menjawab pertanyaan. Jika abjad yang dipilih benar, baris kosong pada halaman permainan akan diisi dengan abjad yang benar tersebut. Jika salah, batas kesalahan dikurangi satu dari lima batas kesalahan yang diberikan. User memenangkan permainan apabila berhasil menjawab semua abjad kurang dari lima kesalahan (Gambar 4.16). Jika user lima kali salah menebak abjad, maka permainan berakhir (Gambar 4.17).
203
Gambar 4.15 Tampilan Permainan “Tebak Kata”
Gambar 4.16 Tampilan Permainan “Tebak Kata” (Menang)
Gambar 4.17 Tampilan Permainan “Tebak Kata” (Kalah)
204
Gambar 4.18 Tampilan Awal “Save Earth Shooter” Gambar 4.18 adalah layar awal dari permainan Game “Save Earth
Shooter”.
Game
yang mengandalkan ketepatan
untuk
menembak target. Target digambarkan dengan sebuah bulatan dengan ekspresi wajah (Gambar 4.19). Jika user berhasi menembak mengenai target, maka total kill akan bertambah satu. Dan jika user berhasil menembak mengenai target sampai sepuluh kali, maka permainan berakhir dan user dinyatakan menang (Gambar 4.20).
Gambar 4.19 Tampilan Permainan “Save Earth Shooter”
205
Gambar 4.20 Tampilan Permainan “Save Earth Shooter”
Gambar 4.21 Tampilan Galeri foto Halaman Galeri berisi foto-foto dokumentasi dari acara yang dilaksanakan oleh LSM-LPAB. Jika user memilih salah satu dari foto yang terdapat pada galeri, foto yang dipilih akan ditampilkan dengan ukuran yang lebih besar (Gambar 4.22).
206
Gambar 4.22 Tampilan Galeri Foto (Zoom In)
Gambar 4.23 Tampilan Profil Halaman Profil berisi Profil singkat dari LSM-LPAB. Profil yang disajikan antara lain history, program kerja, Gambaran tentang lembaga dan alamat dari LSM-LPAB.
207
4.2.2
Tampilan Admin
Gambar 4.24 Tampilan form Login Gambar 4.24 adalah tampilan halaman login untuk admin. Admin diminta untuk memasukan username dan password untuk mendapatkan akses ke halaman admin. Jika admin belum mengisi form login tetapi sudah menekan tombol login, maka akan tampil pesan error di bawah tombol login (Gambar 4.25). Atau jika username dan password salah atau bukan merupakan username dan password dari admin. maka akan tampil lagi pesan error (Gambar 4.26). Jika username dan password benar, maka akan ditampilkan halaman index admin (Gambar 4.27).
Gambar 4.25 Tampilan form Login (Pesan Kesalahan)
208
Gambar 4.26 Tampilan form Login (Pesan Kesalahan-2)
Gambar 4.27 Tampilan Index Admin
Gambar 4.28 Tampilan Materi Halaman Admin terdiri dari Menu Materi, Video dan Galeri. Pada halaman materi, admin dapat menambah, memperbarui dan
209
menghapus materi. Admin dapat menambah materi dengan memilih menu “Tambah Materi Baru”, setelah itu admin mengisi form Tambah materi baru (Gambar 4.29) yang terdiri dari Judul Materi, Gambar dan Isi Materi kemudian menekan tombol “Tambah”. Setelah itu akan muncul dialog box (Gambar 4.30) yang berisi konfirmasi, dan admin memilih tombol “Ok”.
Gambar 4.29 Tampilan Tambah Materi
Gambar 4.30 Tampilan Tambah Materi (Konfirmasi) Apabila pengisian form gagal (Salah satu dari Judul Materi, Gambar atau Isi Materi tidak diisi), akan muncul pesan error diatas tombol “Tambah” (Gambar 4.31) dan Admin kembali mengisi form Tambah Materi Baru. Jika pengisian form berhasil, maka akan ada pesan
210
pemberitahuan pada halaman materi “Materi berhasil ditambah”, Materi yang baru ditambahkan akan masuk ke tabel Materi dan Total Materi bertambah satu (Gambar 4.32).
Gambar 4.31 Tampilan Tambah Materi (Gagal)
Gambar 4.32 Tampilan Tambah Materi (Berhasil)
211
Gambar 4.33 Tampilan Perbarui Materi Admin dapat memperbarui materi dengan memilih menu “Perbarui” dari materi yang ingin diperbarui pada Tabel Materi. Setelah itu akan tampil form Perbarui Materi (Gambar 4.33) dan admin melakukan edit dari isi Materi. Jika edit isi materi telah selesai, admin menekan tombol “Perbarui” dan akan muncul dialog box untuk meninta konfirmasi (Gambar 4.34). Admin menekan tombol “Ok” untuk melanjutkan.
Gambar 4.34 Tampilan Perbarui Materi (Konfirmasi) Jika Isi materi tidak ada yang diubah sama sekali (Judul, Gambar atau Isi Materi) tetapi admin menekan tombol “Perbarui”, maka akan muncul pesan error diatas tombol “Perbarui” (Gambar
212
4.35) dan Materi Gagal diperbarui. Jika Perbarui Materi berhasil, maka user akan diarahkan ke halaman Materi dan akan ditampilkan pesan pemberitahuan “Materi berhasi diperbarui” dibawah tabel materi (Gambar 4.36).
Gambar 4.35 Tampilan Perbarui Materi (Gagal)
Gambar 4.36 Tampilan Perbarui Materi (Berhasil)
213
Gambar 4.37 Tampilan Hapus Materi (Konfirmasi) Admin dapat menghapus materi dengan memilih menu “hapus” di materi yang ingin dihapus pada table Materi. Setelah admin menekan tombol hapus, akan muncul dialog box yang berisi konfirmasi (Gambar 4.37). Jika admin tetap ingin menghapus materi, maka tekan tombol “Ok”. Setetalh itu akan ditampilkan pesan pemberitahuan “Materi telah dihapus” dan Total materi berkurang satu (Gambar 4.38).
Gambar 4.38 Tampilan Hapus Materi (Berhasil)
214
Gambar 4.39 Tampilan Video Pada halaman video, admin dapat menambahkan dan menghapus video. Video yang ditambahkan dapat berupa file video dari disk storage atau link dari situs (misal: youtube.com).
Gambar 4.40 Tampilan Form Unggah Video – Local Disk Jika file video yang ingin ditambahkan berasal dari disk storage, admin menekan menu “Local Disk”. Setelah itu akan ditampilkan form Tambah Video Baru - Local Disk (Gambar 4.40). User mengisi nama video, dan menekan tombol “Choose File” untuk mencari file video pada direktori disk storage (Gambar 4.41). Kemudian Admin menekan tombol “Unggah”.
215
Setelah itu akan muncul “Dialog Box” berisi konfirmasi (Gambar 4.42) dan Admin menekan tombol “Ok”. Jika Pengisian form gagal, maka akan ditampilkan pesan error pada halaman Tambah Video Baru – Local Disk (Gambar 4.43). Jika berhasil Admin akan diarahkan ke halaman Video dan akan tampil pesan pemberitahuan “Video Berhasil Ditambah” dan Total video bertambah satu (Gambar 4.44).
Gambar 4.41 Tampilan Unggah Video – Local Disk
Gambar 4.42 Tampilan Unggah Video – Local Disk (Konfirmasi)
216
Gambar 4.43 Tampilan Unggah Video – Local Disk (Gagal)
Gambar 4.44 Tampilan Unggah Video – Local Disk (Berhasil)
217
Gambar 4.45 Tampilan Form Unggah Video - Embedded Jika file video yang ingin ditambahkan berasal dari Embedded Link, makan admin menekan menu “Embedded”. Setelah itu akan ditampilkan form Tambah Video Baru - Embedded (Gambar 4.45). Admin menekan tombol “Choose File” untuk memasukkan gambar, mengisi nama video, dan memasukkan link video yang akan di embed (Gambar 4.46). Kemudian Admin menekan tombol “Unggah”. Setelah itu akan muncul “Dialog Box” berisi konfirmasi (Gambar 4.47) dan Admin menekan tombol “Ok”. Jika Pengisian form gagal, maka akan ditampilkan pesan error pada halaman Tambah Video Baru – Embedded (Gambar 4.48). Jika berhasil Admin akan diarahkan ke halaman Video dan akan tampil pesan pemberitahuan “Video Berhasil Ditambah” dan Total video bertambah satu (Gambar 4.49).
218
Gambar 4.46 Tampilan Unggah Video - Embedded
Gambar 4.47 Tampilan Unggah Video –Embedded (Konfirmasi)
Gambar 4.48 Tampilan Unggah Video –Embedded (Gagal)
219
Gambar 4.49 Tampilan Unggah Video –Embedded (Berhasil)
Gambar 4.50 Tampilan Hapus Video (Konfirmasi) Admin dapat menghapus video dengan memilih menu “Hapus” dari video yang ingin dihapus pada table video. Setelah itu akan muncul “Dialog Box” yang berisi konfirmasi (Gambar 4.50). Jika Admin tetap ingin menghapus file video tersebut maka Admin menekan tombol “Ok” dan Admin akan diarahkan ke halaman video. Pada halaman video akan ditampilkan pesan pemberitahuan “Video telah dihapus” dan total video berkurang satu (Gambar 4.51).
220
Gambar 4.51 Tampilan Hapus Video (Berhasil)
Gambar 4.52 Tampilan Galeri Pada halaman Galeri, Admin dapat menambahkan dan menghapus file foto pada Galeri. Admin dapat menambahkan foto dengan menekan menu “Tambah Foto Baru”. Setelah itu akan ditampilkan form Tambah Foto Baru (Gambar 4.53). Admin menekan tombol “Choose File” untuk memilih foto yang ingin diunggah pada direktori dan mengisi nama file lalu menekan tombol “Unggah”. Setelah itu akan muncul “Dialog Box” yang berisi konfirmasi (Gambar 4.54) dan Admin menekan tombol “Ok”. Jika salah satu kolom pada form tidak diisi, maka file foto gagal diunggah dan akan
221
ditampilkan pesan error (Gambar 4.55). Jika file foto berhasil diunggah, maka Admin akan diarahkan ke halama galeri dan akan muncul pesan pemberitahuan “Foto Galeri berhasil ditambah” dan total foto bertambah satu (Gambar 4.56).
Gambar 4.53 Tampilan form Tambah Foto – Galeri
Gambar 4.54 Tampilan form Tambah Foto – Galeri (Konfirmasi)
222
Gambar 4.55 Tampilan form Tambah Foto – Galeri (Gagal)
Gambar 4.56 Tampilan form Tambah Foto – Galeri (Berhasil)
223
Gambar 4.57 Tampilan Hapus (Konfirmasi) Admin dapat menghapus foto pada galeri dengan memilih menu “Hapus” pada tabel Galeri. Setelah itu akan muncul “Dialog Box” yang berisi konfirmasi (Gambar 4.57). Jika Admin tetap ingin menghapus file foto, admin menekan tombol “Ok”. Maka Admin akan diarahkan kehalaman Galeri dan terdapat pesan pemberitahuan “Foto Galeri telah dihapus” dan total foto pada Galeri berkurang sati (Gambar 4.58).
Gambar 4.58 Tampilan Hapus (Berhasil)
224
Gambar 4.59 Tampilan Tambah Profil Admin dapat menambahkan profil dengan memilih menu “Tambah Profil Baru” pada halaman profil Admin. Setelah Admin memilih menu “Tambah Profil” akan muncul form Tambah Profil Baru (Gambar 4.59). Setelah itu admin mengisi form Tambah Profil tersebut, jika sudah admin menekan tombol “Tambah”, akan muncul dialog box yang meminta konfirmasi dari Admin (Gambar 4.60). Jika salah satu kolom pada form tidak diisi, akan muncul pesan error di atas tombol “Tambah” (Gambar 4.61). Jika Pengisian form Tambah Profil Baru sudah terpenuhi, maka akan muncul pemberitahuan pada halama profil bahwa Profil sudah berhasil ditambah (Gambar 4.62).
Gambar 4.60 Tampilan Tambah Profil (Konfirmasi)
225
Gambar 4.61 Tampilan Tambah Profil (Gagal)
Gambar 4.62 Tampilan Tambah Profil (Berhasil)
226
Admin dapat memperbarui profil dengan memilih menu “Perbarui” pada profil yang ingin diperbarui pada tabel profil. Setelah itu akan muncul form dari profil yang ingin diperbarui (Gambar 4.63). Setelah memperbarui judul dan isi profil, admin menekan tombol “Perbarui” dan akan muncul dialog box yang meminta konfirmasi dari Admin (Gambar 4.64). Jika berhasil, akan muncul pesan pemberitahuan pada halaman profil yang menyatakan bahwa profil berhasil diperbarui (Gambar 4.65).
Gambar 4.63 Tampilan Perbarui Profil
Gambar 4.64 Tampilan Perbarui Profil (Konfirmasi)
227
Gambar 4.65 Tampilan Perbarui Profil (Berhasil)
Admin dapat menghapus profil dengan memilih menu “Hapus” pada profil yang ingin dihapus pada tabel Profil. Jika admin menekan menu “Hapus”, akan muncul dialog box yang berisi konfirmasi (Gambar 4.66). Jika admin menekan tombol “Ok”, maka profil akan dihapus dan akan muncul pesan pemberitahuan pada halaman profil bahwa materi berhasil dihapus dan total Profil berkurang satu (Gambar 4.67).
Gambar 4.66 Tampilan Hapus Profil (Konfirmasi)
228
Gambar 4.67 Tampilan Hapus Profil (Berhasil)
Admin dapat menambah permainan dengan memilih menu “Tambah Permainan Baru” pada halaman Permainan Admin. Setelah admin memilih menu “Tambah Permainan Baru”, akan mucul form Tambah Permainan (Gambar 4.68). Jika admin sudah mengisi form yang berisi nama permainan, gambar, file permainan dan deskripsi,
Admin
menekan tombol “Tambah” dan akan muncul dialog box untuk meminta konfirmasi pada Admin (Gambar 4.69). Jika ada kesalahan dalam pengisian form, akan muncul pesan error di atas tombol tambah (Gambar 4.70). Jika berhasil, akan muncul pemberitahuan bahwa permainan berhasil ditambah pada halaman permainan dan total permainan bertambah satu (Gambar 4.71).
229
Gambar 4.68 Tampilan Tambah Permainan
Gambar 4.69 Tampilan Tambah Permainan (Konfirmasi)
Gambar 4.70 Tampilan Tambah Permainan (Gagal)
230
Gambar 4.71 Tampilan Tambah Permainan (Berhasil)
Admin dapat memperbarui permainan dengan memilih menu “Perbarui” pada permainan yang ingin diperbarui pada tabel permainan. Setelah Admin memilih menu “Perbarui”, akan muncul form “Perbarui Permainan”. Admin memperbarui permainan dengan mengganti isi dari form dan menekan tombol “Perbarui”. Setelah itu akan muncul dialog box untuk meminta konfirmasi dari Admin (Gambar 4.72). Jika pengisian form gagal, akan muncul pesan error di atas tombol “Perbarui” (Gambar 4.73). Jika Perbarui Permainan berhasil, akan muncul pesan pemberitahuan pada halam permainan Admin bahwa Permainan berhasil diperbarui (Gambar 4.74).
231
Gambar 4.72 Tampilan Perbarui Permainan (Konfirmasi)
Gambar 4.73 Tampilan Perbarui Permainan (Gagal)
Gambar 4.74 Tampilan Perbarui Permainan (Berhasil)
232
Admin dapat menghapus permainan dengan memilih menu “Hapus” pada permainan yang ingin dihapus pada tabel permainan. Setelah memilih menu “hapus”, akan muncul dialog box untuk meminta konfirmasi dari Admin (Gambar 4.75). Jika Admin menekan tombol “Ok” maka akan muncul pesan pemberitahuan pada halaman Permainan bahwa permainan berhasil dihapus dan total permainan berkurang satu (Gambar 4.76).
Gambar 4.75 Tampilan Hapus Permainan (Konfirmasi)
Gambar 4.76 Tampilan Hapus Permainan (Berhasil)
233
4.3 Evaluasi 4.3.1
Delapan Aturan Emas 1. Konsistensi Tampilan halaman situs, penggunaan warna, ataupun pemilihan font dirancang konsisten pada setiap desain halaman user maupun admin.
Gambar 4.77 Evaluasi – Konsistensi (Halaman User)
Gambar 4.78 Evaluasi – Konsistensi (Halaman Admin)
234
2. Memenuhi kegunaan yang universal Desain navigasi dibuat sesederhana mungkin dan jelas agar user mudah dalam menggunakan situs multimedia informasi ini tanpa memandang usia (tua ataupun muda), pengalaman pengguna (pemula ataupun ahli). Contohnya: menu umumnya diletakkan pada bagian atas atau sisi kiri atau kanan pada halaman situs.
Gambar 4.79 Evaluasi – Memenuhi kegunaan yang universal 3. Memberikan umpan balik informatif Menampilkan
pemberitahuan
letak
halaman
yang
sedang
dikunjungi oleh user. Selain itu gambar menu akan berbeda pada halaman yang sedang dikunjungi.
Gambar 4.80 Evaluasi – Memberikan Umpan Balik yang Informatif
235
4. Merancang dialog yang memberikan keadan akhir Saat
admin
melakukan
penambahan,
penghapusan
atau
pengubahan pada materi, foto pada galeri dan video. Pesan pemberitahuan akan dimunculkan bahwa proses yang dilakukan sudah berhasil.
Gambar 4.81 Evaluasi - Merancang dialog yang memberikan keadan akhir 5. Penanganan Kesalahan Pada saat admin akan melakukan penambahan, penghapusan, atau pengubahan isi materi, foto pada galeri dan video, Message box yang berisi konfirmasi akan ditampilkan untuk memastikan tindakan yang dilakukan dan mengurangi kesalahan-kesalahan yang dilakukan admin.
Gambar 4.82 Evaluasi - Penanganan Kesalahan
236
6. Memungkinkan pengembalian aksi yang mudah Jika user mengalami kesalahan, maka user akan diberikan kemudahan untuk kembali ke halaman sebelumnya. Situs ini menampilkan urutan dari halaman yang sedang dikunjungi, jadi user dapat dengan mudah kembali ke halaman sebelumnya hanya dengan memilih nama halaman dari urutan tersebut.
Gambar 4.83 Evaluasi - Memungkinkan pengembalian aksi yang mudah (click pada nama halaman) 7. Mendukung pusat kendali internal User memiliki kebebasan dalam memilih menu yang ingin dikunjungi tanpa harus kembali ke halaman index. Contoh : Pada saat user sedang berada di halaman materi, user dapat langsung pindah ke halaman permainan dengan menekan menu “Permainan”.
Gambar 4.84 Evaluasi - Mendukung pusat kendali internal 8. Mengurangi beban ingatan jangka pendek Situs multimedia informasi ini didesain sederhana dan konsisten dengan tujuan agar pengguna mudah mengingat fitur maupun
237
navigasi pada situs. Terdapat judul di sisi kiri atas, agar user tahu letak halaman yang sedang dikunjungi.
Gambar 4.85 Evaluasi – Mengurangi beban ingatan jangka pendek (Tombol Menu Sederhana dan Jelas)
4.3.2
Evaluasi Desain Informasi 1. Size Situs multimedia informasi ini menggunakan font size 12 untuk isi materi. 2. Typeface Font Style yang digunakan pada situs ini adalah font Arial yang termasuk jenis font Sans Serif. 3. Line Length Jarak antara text dan kolom tidak terlalu dekat, agar materi nyaman untuk dibaca. 4. Style Memberikan efek bold pada hal yang penting pada teks.
238
5. Alignment Menggunakan left – aliglened, agar jarak antar kata tidak terlalu jauh. 6. Spacing Setiap paragraph diberikan line space, dan setiap kata diberikan jarak satu spasi. 7. Placement Mengunakan grid untuk merancang layout agar bentuk selalu konsisten.
Gambar 4.86 Evaluasi – Placement (Halaman Profil) 8. Color Menggunakan warna hitam, untuk memberikan kesan nyaman pada mata saat membaca.
239
4.3.3
Evaluasi Elemen Multimedia 1. Teks Situs multimedia informasi ini menggunakan teks pada menu, isi materi, isi Profil, pesan error, dan Dialog Box. 2. Suara Situs multimedia informasi ini menggunakan suara backsound pada tiap halaman video dengan format .wav, kecuali halaman Video dan Permainan . 3. Gambar Situs multimedia ini menggunakan gambar pada isi materi dan pada foto galeri (dokumentasi acara). Penggunaan gambar pada materi bertujuan agar isi materi dapat dipahami lebih jelas dengan adanya gambar yang berkaitan dengan isi materi. 4. Video Video ditampilkan pada halaman video. Video yang disajikan merupakan video-video yang berkaitan dengan bencana banjir. 5. Animasi Semua menu dan background pada halama situs menggunakan animasi. Hal ini bertujuan agar user lebih tertarik dalam menggunakan situs multimedia informasi ini.
240
4.3.4
Evaluasi Perbandingan
Tabel 4.3.4.1 Perbandingan Situs multimedia Informasi yang dibuat dengan Situs Multimedia Informasi Sejenis detik.com
granat.or.id
21cineplex.com
lsm-lpab.com
2 s/d 4 detik
7 s/d 9 detik
2 s/d 4 detik
3 s/d 5 detik
Sederhana dan
Kombinasi
menarik dengan
warna tampilan
kombinasi
sederhana dan
warna yang
tepat sehingga
tidak terlalu
terlihat lebih
banyak
menarik
Kecepatan akses (Bandwith 9Mbps) Kompleks. Dengan Desain
pemilihan
tampilan
banyak warna dan terlihat cerah
Navigasi
Desain tampilan sederhana namun tetap menarik
Disusun
Disusun
Disusun
Disusun
horizontal,
horizontal,
horizontal
horizontal
terletak di
terletak di
terletak di
terletak di
bagian atas,
bagian atas,
bagian atas,
bagian atas,
tepat di bawah
tepat di bawah
tepat di bawah
tepat di bawah
header website
header website
header website
header website
Desain layout konsisten, Konsistensi
namun dengan
tampilan
warna yang berbeda pada
Desain layout Desain setiap
Manyajikan
halaman
desain tampilan
konsisten
yang konsisten
setiap kategori
konsisten, dengan background animasi terlihat lebih menarik
Jenis font
Sans Serif
Sans Serif
Fitur
Teks, gambar,
Teks, gambar,
penyampaian
video, dan
video, dan
Informasi
animasi jquery
animasi jquery
Sans Serif
Sans Serif
Teks berupa sinopsis film,
Teks, gambar
dan video
dan video
trailer.
241
4.3.5
Evaluasi Segi Pengguna 4.3.5.1
Wawancara Metode
wawancara
dilakukan
terhadap
Bapak
Agung
Kurniawan selaku Ketua Umum LSM-LPAB dengan tujuan untuk mengetahui tanggapan dari situs multimedia informasi yang dibuat sebagai media penyebaran informasi. Proses wawancara ini dilakukan pada hari Senin, 10 Juni 2013, pukul 16.30 sampai 17.30 WIB. Berikut adalah pertanyaan-pertanyaan dan jawaban-jawaban pada wawancara dengan bapak Agung Kurniawan: 1. Apakah menurut Anda tampilan situs LSM-LPAB yang berisi informasi mengenai “Penanganan dan Penyuluhan Pencegahan Banjir” tersebut menarik? Jawaban: Menurut saya pribadi, tampilan situs ini sudah menarik. 2. Apakah menurut Anda situs ini mudah digunakan? Jawaban: Ya, jelas dan mudah digunakan. Karena bahasa yang digunakan pada situs ini bahasa Indonesia, tentu user akan lebih mudah untuk mempelajari dan menggunakan situs ini. Namun untuk user yang masih jarang menggunakan internet, perlu diberikan panduan untuk menggunakan situs ini. 3. Apakah informasi mengenai “Penanganan dan Penyuluhan Pencegahan Banjir” yang disajikan dalam situs ini sudah jelas? Jawaban:
242
Menurut saya informasi yang disajikan sudah jelas. Pemilihan katakata
ringan,
mudah
dipahami
dan
langsung
pada
fokus
permasalahan. Bisa dikatakan singkat, padat, dan jelas. 4. Apakah elemen multimedia (gambar, video, dan permainan) yang terdapat dalam situs menarik? Jawaban: Ya, menarik. User cenderung memilih mendapatkan informasi dengan hanya melihat dan mendengar, daripada harus membaca teks yang banyak. Memperbanyak materi dalam bentuk video dalam situs ini, akan membuat situs lebih menarik. Sedangkan permainan, targetnya lebih untuk anak-anak. 5. Apakah dengan adanya situs ini Anda merasa terbantu dalam menyebarkan informasi mengenai banjir? Jawaban: Ya, sangat terbantu. Karena saat ini penyebaran informasi yang kami lakukan bergantung pada anggaran yang dikeluarkan oleh Kementrian Dalam Negeri sesuai proposal yang kami berikan, dan setiap proposal tidak selalu diterima. Maka, situs ini merupakan solusi dari permasalahan tersebut. 6. Menurut Anda, apakah situs ini efektif sebagai media penyuluhan terhadap banjir? Jawaban: Ya, sangat efektif. Selain terbatasnya anggaran, sangat sulit menjangkau masyarakat yang berada di daerah-daerah karena kantor kami berada di Jakarta. Namun untuk masyarakat yang
243
belum biasa menggunakan internet, perlu adanya panduan untuk menggunakan situs ini. 7. Saran pengembangan terhadap situs? Jawaban: Perlu dikembangkannya mobile web untuk situs ini. Karena saat ini lebih banyak masyarakat yang mengkases internet melalui perangkat mobile. Selain itu materi yang ditampilkan harus sering diperbarui dan topik materi yang dibahas tidak hanya mengenai bencana banjir. 4.3.5.2
Kuesioner
Kuesioner disebarkan secara langsung kepada masyarakat umum di lingkungan sekitar pada tanggal 8 Juni 2013. Kuesioner terdiri dari 10 pertanyaan yang disebarkan kepada 40 responden. Responden mulai dari usia sekolah dasar sampai dengan usia diatas 25 Tahun. Adapun hasil data yang diperoleh adalah sebagai berikut: 1.
Apa jenis kelamin Anda? o Perempuan (12 responden) o Laki – laki (28 responden)
Gambar 4.87 Jawaban Kuesioner No 1
244
Dari data di atas didapatkan hasil bahwa sebagian besar responden berjenis kelamin laki-laki. 2.
Berapakah umur Anda sekarang? o 7 – 12 tahun (7 responden) o 13 – 18 tahun (5 responden) o 19 – 25 tahun (22 responden) o >25 tahun (6 responden)
Gambar 4.88 Jawaban Kuesioner No 2 Data di atas didapatkan hasil bahwa mayoritas responden berumur antara 19-25 tahun. Pertanyaan nomor satu dan dua untuk mengetahui statistik demografi responden. 3. Apakah menurut Anda tampilan situs LSM-LPAB yang berisi informasi mengenai “Penanganan dan Penyuluhan Pencegahan Banjir” tersebut menarik? o Sangat Menarik (22 responden) o Menarik (17 responden) o Kurang Menarik (1 responden)
245
Gambar 4.89 Jawaban Kuesioner No 3 Dari data di atas didapatkan hasil bahwa user merasa puas dengan tampilan situs multimedia ini. Pertanyaan ini bertujuan untuk mengetahui apakah situs yang dibuat sudah sesuai dengan keinginan user yang menginginkan tampilan situs yang menarik. 4.
Apakah menurut Anda situs ini mudah digunakan? o Sangat Mudah (32 responden) o Mudah (8 responden) o Sulit (0 responden)
Gambar 4.90 Jawaban Kuesioner No 4
246
Dari data di atas didapatkan hasil bahwa situs ini sangat mudah digunakan. Pertanyaan ini memiliki tujuan untuk mengetahui prinsip eight golden rules sudah diimplementasikan dengan baik pada situs ini. 5. Apakah
informasi
mengenai
“Penanganan
dan
Penyuluhan
Pencegahan Banjir” yang disajikan dalam situs ini sudah jelas? o Sangat Jelas (31 responden) o Jelas (9 responden) o Kurang jelas (0 responden)
Gambar 4.91 Jawaban Kuesioner No 5 Dari data di atas didapatkan hasil bahwa informasi yang disajikan pada situs ini sangat jelas. Pertanyaan ini memiliki tujuan untuk mengetahui kejelasan dalam penyajian materi. 6. Apakah informasi yang disajikan dalam situs ini dapat Anda pahami dengan baik? o Ya (40 responden) o Tidak (0 responden)
247
Gambar 4.92 Jawaban Kuesioner No 6 Dari data di atas didapatkan hasil bahwa informasi yang disajikan mudah dipahami oleh user. Pertanyaan ini memiliki tujuan untuk mengetahui informasi yang disampaikan dapat dimengerti dan mudah dipahami user. 7. Apakah elemen multimedia (gambar, video, dan permainan) yang terdapat dalam situs menarik? o Sangat Menarik (33 responden) o Menarik (7 responden) o Kurang Menarik (0 responden)
Gambar 4.93 Jawaban Kuesioner No 7
248
Dari data di atas didapatkan hasil bahwa elemen multimedia yang disajikan dalam situs sangat menarik. Pertanyaan ini memiliki tujuan untuk mengetahui ketertarikan user dengan elemen multimedia yang terdapat pada situs ini. 8. Apakah dengan adanya elemen multimedia (gambar, video) lebih membantu Anda untuk memahami materi mengenai Banjir? o Sangat Membantu (27 responden) o Kurang Membantu (11 responden) o Biasa Saja (2 responden)
Gambar 4.94 Jawaban Kuesioner No 8 Dari data di atas didapatkan hasil bahwa elemen multimedia yang disajikan dalam situs sangat membantu untuk memahami informasi yang disajikan. Pertanyaan ini memiliki tujuan untuk mengetahui apakah fitur-fitur yang disediakan pada situs ini bermanfaat.
249
9. Apakah dengan adanya situs ini Anda merasa terbantu dalam mencari informasi mengenai banjir? o Ya (38 responden) o Tidak (2 responden)
Gambar 4.95 Jawaban Kuesioner No 9 Dari data di atas didapatkan hasil bahwa situs ini membantu user dalam mencari informasi mengenai banjir. Pertanyaan ini memiliki tujuan untuk mengetahui peran situs ini dalam menyebarkan informasi mengenai banjir. 10.
Elemen Multimedia apa yang paling membantu Anda untuk
memahami informasi? (Boleh lebih dari satu) Teks (17 responden) Gambar (25 responden) Video (29 responden) Permainan (12 responden) Lain-lain (5 responden)
250
Gambar 4.96 Jawaban Kuesioner No 10 Dari data di atas didapatkan hasil bahwa elemen multimedia yang paling membantu user untuk memahami informasi adalah video. Pertanyaan ini memiliki tujuan untuk mengetahui elemen multimedia yang paling banyak diminati dan sangat membantu user dalam memahami informasi.
