Materi diperoleh dari buku paket dan beberapa modul praktikum yang disesuaikan. Materi yang dibahas berupa materi teori dan praktikum.
3. Desain Produk
Tahap desain produk merupakan tahap mulai dari mempersiapkan perancangan desain awal hingga tahap produksi
multimedia pembelajaran yang dikembangkan. Tahap ini terdiri dari beberapa langkah, yaitu sebagai berikut :
a. Desain Awal
Tahap ini diawali dengan membuat desain sistem berupa flowchart pada Gambar 6 yang kemudian dibuat menjadi sebuah
sketsa dasar yaitu berupa storyboard Lampiran 2, bertujuan agar
peneliti dapat dengan mudah merancang desain yang diinginkan dan menyesuaikan konten.
42
Gambar 6. Flowchart
b. Pembuatan Multimedia Pembelajaran
Setelah melalui proses rancangan storyboard, maka dihasilkan
produk multimedia pembelajaran interaktif yang diolah menggunakan aplikasi
software Adobe Flash CS6 Actionscript 2.0. Adapun tampilan multimedia yang dihasilkan sebagai berikut:
1 Halaman Intro
Tampilan intro atau tampilan awal dibuat animasi pada logo UNY,
dengan penambahan tulisan “ Welcome To”. Tampilan menu pembuka
dapat dilihat pada Gambar 7 :
43
Gambar 7. Implementasi Intro 2 Halaman Menu
Login Pada halaman ini terdapat tombol
login, dimana sebelum masuk pada halaman utama, pengguna diwajibkan untuk mengisi kolom nama
lalu menekan tombol login yang telah tersedia, apabila pengguna
belum memasukkan nama dan langsung menekan tombol login maka
akan ada perintah seperti pada Gambar 8. Perintah ini menggunakan kode
action script seperti berikut :
on release { if masuk
{ gotoAndStophome;
} else
{ warning = Hi, Mohon Untuk Mengisi Nama Anda;
} }
Adapun tampilan menu login yang telah didesain seperti pada
Gambar 8.
44
Gambar 8. Implemetasi Menu Login Ketika Tidak Mengisi Nama 3 Halaman Menu Utama
Tampilan menu utama, terdapat tombol petunjuk dan tombol keluar pada pojok kanan atas, identitas yang telah dimasukkan pada
saat login terletak pada pojok kiri atas, tampilan jam dan tanggal pada pojok kiri bawah, animasi berbentuk lingkaran pada pojok kanan
bawah, tombol utama yaitu tombol Materi, Latihan, dan Profil yang masing-masing diberi animasi sehingga terdapat penjelasan singkat
sebagai informasi. Tampilan menu utama dapat dilihat pada Gambar 9:
45
Gambar 9. Implementasi Menu Utama 4 Halaman Menu Materi
Menu materi berisi tombol menu untuk ke halaman peta konsep, kompetensi inti kompetensi dasar, materi
remote server, materi network time protocol server, materi proxy server, referensi dan
glosarium. Pada tombol diberi animasi agar lebih menarik. Tampilan menu materi dapat dilihat pada Gambar 10:
Gambar 10. Implementasi Menu Materi
46
5 Halaman Menu Peta Konsep Menu ini menyajikan tentang peta konsep dari materi yang
tersaji dalam multimedia pembelajaran ini. Tampilan menu peta konsep dapat dilihat pada Gambar 11:
Gambar 11. Implementasi Menu Peta Konsep 6 Halaman Menu KI KD
Halaman Komptensi Inti dan Kompetensi Dasar ini merupakan penjabaran tentang KI KD yang disusun pada matei. Halaman ini
merpakan bagian dari menu materi. Adapun tampilan halaman menu KI KD dapat dilihat pada Gambar 12 :
Gambar 12. Implementasi Menu KIKD 7 Halaman Menu Tujuan Pembelajaran
47
Halaman ini memberikan informasi tentang tujuan pembelajaran setiap pokok materi yang akan dicapai pengguna multimedia
pembelajaran ini. Adapun tampilan halaman tujuan pembelajaran dapat dilihat pada Gambar 13 :
Gambar 13. Implementasi Menu Pembelajaran 8 Halaman Menu Isi Materi
Materi berisi pokok materi yang akan dibahas pada multimedia pembelajaran, dimana berisi tiga pokok pembahasan diantaranya
Remote Server, Network Time Protocol Server, dan Proxy Server. Pada materi diberi Gambar dan animasi agar pengguna akan lebih mudah
memahami isi materi. Tampilan menu isi materi dapat pada Gambar 14:
Gambar 14. Implementasi Menu Isi Materi 9 Halaman Video Pada Materi
48
Halaman ini berisi materi praktek yang disajikan dalam bentuk video tutorial, video dilengkapi dengan
player control guna mempermudah pengguna untuk mempelajari tiap bagian dalam video.
Video diletakkan dalam menu pokok materi agar pengguna bisa memahami materi dengan baik. Tampilan menu video dapat dilihat
pada Gambar 15 :
Gambar 15. Implementasi Menu Video 10
Halaman Menu Glosarium dan Referensi Halaman glosarium memberikan informasi tentang kata kunci
dari penjabaran isi materi pada multimedia pembelajaran ini, sehingga siswa dapat menambah wawasan dalam mempelajari materi. Pada
halaman referensi berisi informasi tentang buku ajar dan modul yang digunakan dalam pembuatan multimedia pembelajaran. Tampilan
menu glosarium dan referensi dapat dilihat pada Gambar 16 dan 17 :
49
Gambar 16. Implementasi Menu Glosarium
Gambar 17. Implementasi Menu Referensi 11
Halaman Menu Latihan Halaman ini berisi petunjuk penggunaan soal latihan, soal
latihan terdiri dari tiga pokok bahasan materi. Pada halaman ini terdapat tiga tombol, tombol materi satu membahas soal tentang
remote server, materi dua membahas tentang network time protocol server, dan materi tiga membahas tentang proxy server. Pada menu
ini, soal latihan menggunakan database dalam bentuk XML. XML
eXtended Markup Language adalah sebuah bahasa markup yang dapat digunakan untuk keperluan penyimpanan data secara ringkas
dengan format yang dibakukan oleh WC3. XML memiliki format yang
sangat sederhana dan dapat diakses oleh beberapa aplikasi termasuk oleh kode
Actionscript Wibawanto, 2017 . Objek berupa tombol yang 50
telah dibuat pada tahap pembuatan belum dapat melakukan fungsi apapun. Oleh karena itu, dilakukan pengkodean menggunakan bahasa
pemrograman. Adapun action script yang digunakan dalam
pembuatan multimedia pembelajaran ini dijabarkan sebagai berikut : a
action script function array stop;
---membuat function array acak Array.prototype.acak = function {
for i=0; ithis.length; i++ { var tmp = this[i];
var acak = randomthis.length; this[i] = this[acak];
this[acak] = tmp;
} };
var array_soal = []; var array_tanya = [];
var array_pilihan_a = []; var array_pilihan_b = [];
var array_pilihan_c = []; var array_pilihan_d = [];
var array_jwb = []; var jawabku;
var nobaru; var totalsoal;
var limit_soal; clearInterval_root.brs;
b action script tombol jawaban dan cek jawaban
----tombol jawab pilihan dan cek jawaban _root.tombol_a_btn.onRelease = function {
_root.jawabku = a; cek_jwb;
_root.nobaru++; tampil_soal_root.nobaru;
}; _root.tombol_b_btn.onRelease = function {
_root.jawabku = b; cek_jwb;
_root.nobaru++; tampil_soal_root.nobaru;
}; _root.tombol_c_btn.onRelease = function {
51
_root.jawabku = c; cek_jwb;
_root.nobaru++; tampil_soal_root.nobaru;
}; _root.tombol_d_btn.onRelease = function {
_root.jawabku = d; cek_jwb;
_root.nobaru++; tampil_soal_root.nobaru;
};
c
action script load data dari xml mysoal = new XML;
mysoal.ignoreWhite = true; mysoal.loadBank_Soal_Multimedia_Pembelajaran_1.xml
; mysoal.onLoad = function {
_root.limit_soal = mysoal.firstChild.attributes.jml; _root.totalsoal =
mysoal.firstChild.childNodes.length; _root.nomorsoal_txt.text = 0;
_root.benar = 0; _root.nilai_txt.text = 0;
for i=0; i_root.totalsoal; i++ {
_root.array_soal[i] = i; }
_root.array_soal.acak; for j=0; j_root.limit_soal; j++ {
_root.array_tanya[j] = mysoal.firstChild.childNodes[_root.array_soal[j]].childNod
es[0].childNodes[0].toString; _root.array_pilihan_a[j] =
mysoal.firstChild.childNodes[_root.array_soal[j]].childNod es[1].childNodes[0].nodeValue;
_root.array_pilihan_b[j] = mysoal.firstChild.childNodes[_root.array_soal[j]].childNod
es[2].childNodes[0].nodeValue; _root.array_pilihan_c[j] =
mysoal.firstChild.childNodes[_root.array_soal[j]].childNod es[3].childNodes[0].nodeValue;
_root.array_pilihan_d[j] =
52
mysoal.firstChild.childNodes[_root.array_soal[j]].childNod es[4].childNodes[0].nodeValue;
_root.array_jwb[j] = mysoal.firstChild.childNodes[_root.array_soal[j]].childNod
es[5].childNodes[0].nodeValue; }
tampil_soal0; };
d
action script menampilkan soal dari array function tampil_soalx:Void {
clearInterval_root.brs; _root.brs = setIntervalcounter, 1000;
if xarray_tanya.length { _root.soal_txt.text =
_root.array_tanya[x]; _root.pilihanjwb_a_txt.text =
_root.array_pilihan_a[x]; _root.pilihanjwb_b_txt.text =
_root.array_pilihan_b[x]; _root.pilihanjwb_c_txt.text =
_root.array_pilihan_c[x]; _root.pilihanjwb_d_txt.text =
_root.array_pilihan_d[x]; _root.jawaban = _root.array_jwb[x];
_root.nobaru = x; _root.nomorsoal_txt.text = x+1+.;
} else { hitung_nilai;
_root.gotoAndStopjawaban_1; }
}
e
action script mengecek jawaban function cek_jwb:Void {
--membandingkan antara jawabku dengan jawaban
if _root.jawabku == _root.jawaban { -- bila benar maka nilai bertambah
_root.benar += 1;
53
_root.nilai_txt.text = _root.benar; }
}
f action script menghitung nilai
function hitung_nilai:Void { _root.nilaiakhir =
Math.ceil100_root.array_tanya.length_root.benar ;
}
g
action script kembali ke soal latihan untuk fungsi tombol jika ingin mencoba soal latihan lagi
stop; _root.cobalagi_btn.onRelease = function {
gotoAndStop1; };
h action script tampilan nilai akhir
clearInterval_root.brs; _root.nilaiakhir_txt.text = _root.nilaiakhir;
if nilaiakhir=75{ _root.ket_txt.text=Selamat, Kamu Lulus;
} else {
_root.ket_txt.text=Belajar lebih giat lagi ya,,;
}
i
action script database soal latihan test jml=10
soal tanyaRemote Server dibagi
menjadi:tanya pilih_a1 Jenis pilih_a
pilih_b2 Jenis pilih_b pilih_c3 Jenis pilih_c
54
pilih_d4 Jenis pilih_d jawabbjawab
soal soal
tanyaPort komunikasi protocol telnet dan ssh adalah :tanya
pilih_aPort 20 dan 22 pilih_a pilih_bPort 22 dan 23 pilih_b
pilih_cPort 23 dan 22 pilih_c pilih_dPort 22 dan 25 pilih_d
jawabcjawab soal
soal tanyaKeamanan komunikasi akses jauh
dengan ssh cukup baik karena:tanya pilih_aData terlindung dari gangguan
pilih_a pilih_bData yang dilalukan dienkripsi
terlebih dahulu pilih_b pilih_cData yang dilalukan diacak
pilih_c pilih_dJawaban tidak ada yang
benarpilih_d jawabbjawab
soal soal
tanyaManakah yang merupakan nama file pada konfigurasi SSHtanya
pilih_aFilesshd_config pilih_a pilih_bFileetcsshd_config pilih_b
pilih_cFilellssshd_config pilih_c pilih_dFilermsshd_config pilih_d
jawabbjawab
55
soal soal
tanyaAntar muka yang digunakan pada aplikasi telnetssh akses jarak jauh adalah:tanya
pilih_aCLI pilih_a pilih_bGUI pilih_b
pilih_cCLI atau GUI, dapat dipilih pilih_c pilih_dJawaban tidak ada yang
benarpilih_d jawabbjawab
soal soal
tanyaTelnet protokol, yang mengirim informasi, terutama password, berbentuk plaintext,
membuat mereka rentan terhadap:tanya pilih_aSerangan virus pilih_a
pilih_bPencurian data pilih_b pilih_cAlamat email pilih_c
pilih_dIntersepsi dan pengungkapan menggunakan analisis paket pilih_d
jawabdjawab soal
soal tanyaSSH-2, diadopsi sebagai standar
keamanan yang lebih baik, misalnya, karena menggunakan algoritma kriptografi: tanya
pilih_aEl Gamal pilih_a pilih_bDiffie-Hellman pilih_b
pilih_cWake pilih_c pilih_dJawaban tidak ada yang benar
pilih_d jawabbjawab
soal
56
soal tanyaRemote acces berbasis GUI dapat
dilakukan pada computer dengan system operasi windows, aplikasi itu adalah: tanya
pilih_aRemote Desktop pilih_a pilih_bRemote Login pilih_b
pilih_cRemote Laptop pilih_c pilih_dRemote Control pilih_d
jawabajawab soal
soal tanyaAplikasi klien remote access berbasis
GUI, putty dapat digunakan untuk koneksi:tanya pilih_atelnet pilih_a
pilih_bssh pilih_b pilih_cRlogin pilih_c
pilih_dSemua jawaban benar pilih_d jawabbjawab
soal soal
tanyaRemote akses server memungkinkan pengguna untuk mendapatkan akses ke file dan layanan
cetak di LAN dari: tanya pilih_alocalhostpilih_a
pilih_blokasi jauh pilih_b pilih_cklien lokasi jauh pilih_c
pilih_dserver lokasi jauhpilih_d jawabbjawab
soal test
Tahap selanjutnya setelah dilakukan proses pengkodean adalah tahap
test movie. Test movie merupakan pengujian yang dilakukan pada keseluruhan tampilan multimedia pembelajaran yang mencakup
57
fungsi dari tiap objek. Adapun hasil dari tahap test movie pada soal
latihan dapat dilihat pada Gambar 18 :
Gambar 18. Implementasi Menu Latihan Tampilan skor latihan memberikan
feedback ke siswa dengan menambahkan keterangan skor dan diberi tombol untuk mencoba
kembali soal latihan yang dibuat acak. Tampilan skor latihan dapat dilihat pada Gambar 19
58
Gambar 19. Implementasi Menu Skor Latihan 12
Halaman Menu Profil Halaman ini menyajikan informasi data diri pengembang yang
bertujuan untuk memberikan informasi mengenai pengembang dari multimedia pembelajaran ini. Pada halaman profil berisi foto, motto
dan data diri. Tampilan menu profil dapat dilihat pada Gambar 20:
Gambar 20. Implementasi Menu Profil
59
13 Halaman Menu Petunjuk
Halaman petunjuk merupakan halaman yang memberikan informasi tentang cara penggunaan produk multimedia pembelajaran.
Pada halaman ini ditampilkan tombol petunjuk penggunaan secara detail dan terdapat tombol musik latar yang berisi musik intstrumental
yang nyaman untuk didengarkan, untuk musik diberi keterangan penggunaannya agar digunakan saat diperlukan dan tidak
mengganggu pada saat pembelajaran diruangan kelas. Pada menu ini tersedia dua pilihan tombol musik yang terdiri dari dua tombol.
Tampilan menu petunjuk dapat dilihat pada Gambar 21:
Gambar 21. Implementasi Menu Petunjuk 14
Halaman Menu Konfirmasi Keluar Halaman konfirmasi keluar berfungsi untuk memberikan
informasi kepada pengguna untuk mengakhiri program atau melanjutkan. Pada tampilan ini terdapat dua tombol “Ya” untuk setuju
keluar dan “Tidak” untuk membatalkan keluar. Tampilan menu-menu konfirmasi keluar dapat dilihat pada Gambar 22:
60
Gambar 22. Implementasi Menu Konfirmasi Keluar
4. Validasi Desain
Pada tahap ini, rancangan awal multimedia yang telah disusun pada tahap desain produk kemudian dinilai atau divalidasi oleh
validator. Data yang diperoleh dari angket yang telah diisi oleh validator materi dan validator media kemudian diolah menggunakan
rumus yang telah dibahas pada bab sebelumnya. Penilaian masing- masing dilakukan oleh 2 orang ahli dengan rekapitulasi data sebagai
berikut: a. Data Hasil Validasi Ahli Materi
Tabel 7. Pengolahan Hasil Validasi Ahli Materi Pernyataan
Jumlah Data
Skor Total Skor
Sangat setuju 18
5 90
Setuju 22
4 88
Netral 3
Tidak setuju 2
Sangat tidak setuju
1 Jumlah Total Skor
178 Persentase
89,00 Berdasarkan Tabel di atas, selanjutnya dibandingkan dengan
kategori penilaian pada Tabel 2 . Skor yang didapat adalah 89,00 61
maka multimedia pembelajaran ini termasuk ke dalam kategori Sangat kuat Sangat Layak untuk digunakan yang kemudian dapat digunakan
untuk uji coba lapangan untuk mengetahui respon peserta didik. b. Data Hasil Validasi Ahli Media
Tabel 8. Pengolahan Hasil Validasi Ahli Media Pernyataan
Jumlah Data
Skor Total Skor
Sangat setuju 15
5 75
Setuju 20
4 80
Netral 2
3 6
Tidak setuju 3
2 6
Sangat tidak setuju
1 Jumlah Total Skor
167 Persentase kelayakan
83,50 Berdasarkan Tabel di atas, selanjutnya dibandingkan dengan
kategori penilaian pada Tabel 2. Skor yang didapat adalah 83,50 maka multimedia pembelajaran ini termasuk ke dalam kategori Sangat
kuat Sangat Layak untuk digunakan yang kemudian dapat digunakan untuk uji coba lapangan untuk mengetahui respon peserta didik.
5. Perbaikan Desain
Perbaikan multimedia pembelajaran merupakan perbaikan multimedia berdasarkan penilaian ahli materi dan ahli media.
Perbaikan multimedia pembelajaran sebelumnya direvisi sesuai saran pembimbing yang selanjutnya dilakukan perbaikan oleh peneliti,
adapun perbaikan yang dilakukan dijabarkan sebagai berikut :
a. Perubahan warna background
Saran dari pembimbing yaitu mengenai warna yang kontras antara warna
background dan teks. Pembimbing menyarankan untuk
62
menggunakan aplikasi online untuk mengecek kontras warna. Adapun
perubahannya seperti Gambar 23.
Sebelum Sesudah
01B0CF 01AEEF
Keterangan : Perubahan warna latar
background Gambar 23. Perubahan Warna
Background
b. Perbaikan tampilan halaman utama
Halaman utama sebelumnya menggunakan gambar sebagai tombol menu , dikarenakan gambar menggunakan kualitas resolusi
rendah dan banyaknya ruang kosong pada halaman utama. Oleh karena itu peneliti mendesain ulang tombol dan menambahkan
penjelasan disetiap menu utama. Adapun perubahannya seperti Gambar 24.
Sebelum Sesudah
Keterangan : Menambahkan penjelasan pada halaman utama
Gambar 24. Perubahan Halaman Utama Adapun masukkan secara umum yang diberikan oleh ahli media
dan ahli materi, yaitu sebagai berikut :
63
1 Icon tombol diperbaiki agar lebih mudah dipahami, menggunakan
icon secara umum. 2 Tombol dibuat proposional
3 Kerapian teks pada isi materi 4 Menambahkan
reward pada latihan 5 Membuat
database untuk memasukkan rekaman materi dari guru berupa
audio. Masukan dari validator kemudian ditindaklanjuti oleh peneliti
dan dilakukan revisi. Adapun revisi sebelum dan sesudah pada multimedia pembelajaran sebagai berikut:
c. Perbaikan tombol navigasi
Penggunaan tombol navigasi sebelumnya dinilai kurang umum untuk digunakan sehingga kesulitan dalam memahami maksud dari
tombol. Peneliti melakukan perbaikan dengan menggunakan tombol yang sudah secara umum digunakan guna mempermudah pengguna.
Adapun perubahannya seperti Gambar 25. Sebelum
Sesudah
Keterangan : Penambahan tombol kembali dan mengganti
icon home atau halaman utama
Gambar 25. Perubahan Tombol Navigasi
d. Perbaikan tombol navigasi halaman
