S KOM 1002492 Appendix (1)

(1)

Aditiarana, 2014

PENERAPAN COGNITIVE LOAD THEORY (CLT) PADA PENGEMBANGAN MULTIMEDIA PEMBELAJARAN INTERAKTIF BERBANTU GAME ‘KUIS ISTILAH’PADA MATERI JARINGAN KOMPUTER DASAR

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

LAMPIRAN A



Flowchart



Storyboard

(2)

(3)

(4)

(5)

(6)

(7)

SOURCE CODE

(8)

Kode Fungsi, Variabel dan Suara

//variabel

var namaPemain: String; var sandiPemain: String; var skorPemain:Number; var karakterPemain:Number; var urutan:Number;

var jatah:Number; jatah = 3; var skor_1:Number;

var skor_2:Number; var skor_3:Number; var skor_4:Number; var frameMateri:Number; var id_karakter:Number; var database : SharedObject = SharedObject.getLocal("tebakkata", "/");

import caurina.transitions.*; //suara - suara

klik = new Sound(this); klik.attachSound("klik"); clos = new Sound(this); clos.attachSound("klik_cl"); klik_next = new Sound(this);

(9)

klik_next.attachSound("klik_next"); jwb_benar = new Sound(this);

jwb_benar.attachSound("jwb_benar"); jwb_salah = new Sound(this);

jwb_salah.attachSound("jwb_salah"); bgSound = new Sound(this);

bgSound.attachSound("menu"); bgSound1 = new Sound(this); bgSound1.attachSound("cerita1"); bgSound2 = new Sound(this); bgSound2.attachSound("cerita2"); bgSound3 = new Sound(this); bgSound3.attachSound("latar"); bgSound4= new Sound(this); bgSound4.attachSound("materi"); bgSound5= new Sound(this);

//melihat isi database

(10)

trace("Nama variabel="+variableNames + " Nilai="+x.data[variableNames]); }

}

//disabled & enabled tombol

function enableTombol(stat:Number){ if (stat==1){

tbl_daftar.enabled = true; tbl_masuk.enabled = true; tbl_tentang.enabled = true; tbl_keluar.enabled = true; }else{

(11)

tbl_keluar.enabled = false; }

}

//load movie clip

function popup(judulmc:String,nilai_x:Number,nilai_y:Number){

attachMovie(judulmc, judulmc,this.getNextHighestDepth(),{_x:nilai_x,_y:nilai_y,_alpha:20}); }

//load movie clip suara

function popupsuara(judulmc:String,nilai_x:Number,nilai_y:Number){ attachMovie(judulmc, judulmc,10,{_x:nilai_x,_y:nilai_y,_alpha:20}); }

//random frame pada kuis istilah - hasil adaptasi dari 'Shuffle Frame' oleh mrhartsclube dalam kirupa.com function shuffleArray (awal:Number,akhir:Number){

(12)

//mengisi array sesuai jumlah frame,awal=nomor frame pertama, akhir=nomor frame terahir for(j=awal;j<=akhir;j++){

//trace(j);

arrayList01.push(j); }

_root.arrayList02 = [];

while (_root.arrayList01.length > 0) {

_root.arrayList02.push(_root.arrayList01.splice(Math.round(Math.random() * (_root.arrayList01.length - 1)), 1)[0]); }

}

//cek frame

function cek_array(){

//kondisi apabila semua frame sudah terbuka

(13)

//trace("sudah habis");

karakter_kuis.removeMovieClip(); stopAllSounds();

gotoAndStop(frameMateri); }else{

i++;

//trace("jawabannya"+jawaban); //trace("belum habis"+i)

} }

//hasil adaptasi dari - 'Membuat Timer' di warungflash.com function waktu(){

fp = 0;

(14)

onEnterFrame = function () {

//menambahkan angka 0 pada second jika detik kurang dari 10 if (detik<10) {

sec = "0"+detik; } else {

sec = detik; }

//fps ditambah 1 secara terus menerus fp++;

//jika fps sama dengan 20 if (fp == 24) {

//fps menjadi 0 fp = 0;

(15)

}

//jika detik sama dengan 0 if (detik == 0) {

fp = 0;

kuis_bantuan1.enabled = true; kuis_bantuan2.enabled = true; }

} }

//menyimpan data pemain function save(nomor:Number){

(16)

database.data.skor_4[nomor] = skor_4; database.flush();

}

Kode untuk Daftar Baru

//event saat tombol daftar diklik tbl_daftar.onRelease = function(){

klik.start(0,0);

attachMovie("daftar_mc", "daftar",this.getNextHighestDepth(),{_x:257,_y:134,_alpha:20}); Tweener.addTween(daftar, {time: 0.2,_alpha: 100, transition:"linear"});

enableTombol(0);

//event saat user memasukan data

daftar.simpan_daftar.onRelease=function(){ klik.start(0,0);

(17)

daftar.peringatan.text = "Lengkapi Data!"; Selection.setFocus(daftar.input_nama);

}else if(daftar.input_sandi.text != daftar.input_ulg_sandi.text){ daftar.peringatan.text = "Ulangi Sandi!";

daftar.input_ulg_sandi.text =""; daftar.input_sandi.text = "";

Selection.setFocus(daftar.input_sandi); }else{

for(i=0;i<database.data.nama.length;i++){

if(daftar.input_nama.text == database.data.nama[i]){ hasil = "gagal";

} }

if(hasil=="gagal"){

(18)

hasil=""; }else{

namaPemain = daftar.input_nama.text; sandiPemain = daftar.input_sandi.text; daftar.removeMovieClip();

stopAllSounds();

gotoAndPlay("Cerita",1); }

} }

//event saat tombol close diklik

daftar.tutup_mc.onRelease= function(){ clos.start(0,0);

(19)

enableTombol(1); }

}

Kode untuk Login

tbl_masuk.onRelease=function(){ klik.start(0,0);

attachMovie("login_mc", "login",this.getNextHighestDepth(),{_x:257,_y:150,_alpha:20}); Tweener.addTween(login, {time: 0.2,_alpha: 100, transition:"easeInSine"});

enableTombol(0);

login.simpan_login.onRelease=function(){ klik.start(0,0);

if(login.input_nama.text == "" || login.input_sandi.text == "" ){ login.peringatan.text = "Lengkapi Data";

(20)

}else{

for(var i=0;i<database.data.nama.length;i++){

if(login.input_nama.text == database.data.nama[i] && login.input_sandi.text ==database.data.sandi[i]){ hasil = "berhasil";

urutan = i;

namaPemain = database.data.nama[i]; skorPemain = database.data.skor[i];

karakterPemain = database.data.karakter[i]; skor_1 = database.data.skor_1[i];

skor_2 = database.data.skor_2[i]; skor_3 = database.data.skor_3[i]; skor_4 = database.data.skor_4[i]; }

}

(21)

//login.peringatan.text = "Berhasil"; hasil="";

login.removeMovieClip(); stopAllSounds();

gotoAndStop("Level",1); }else{

login.peringatan.text = "Error !"; }

} }

//event saat tombol close diklik

login.tutup_mc.onRelease= function(){ clos.start(0,0);

(22)

enableTombol(1); }

}

Kode untuk keluar Multimedia

tbl_keluar.onRelease = function(){ klik.start(0,0);

attachMovie("keluar_mc", "keluar",this.getNextHighestDepth(),{_x:203,_y:211,_alpha:20}); Tweener.addTween(keluar, {time: 0.2,_alpha: 100, transition:"easeInSine"});

enableTombol(0);

keluar.ya.onRelease=function(){ clos.start(0,0);

(23)

keluar.tidak.onRelease=function(){ clos.start(0,0);

Tweener.addTween(keluar, {_alpha:0,time: 0.2, transition:"easeOutSine"}); keluar.removeMovieClip();

enableTombol(1); }

}

Kode untuk Mmenyimpan data pemain

var id_karakter:Number;

pilih_karakter.kar_ok.onRelease = function(){ klik.start(0,0);

(24)

var arrKarakter:Array = new Array(); var arrSkor_1:Array = new Array(); var arrSkor_2:Array = new Array(); var arrSkor_3:Array = new Array(); var arrSkor_4:Array = new Array();

//memasukan data dalam database ke dalam array for (var i = 0; i < database.data.nama.length; i++){

(25)

arrSkor_4.push(database.data.skor_4[i]); }

//Menyimpan data user ke dalam database melalui array var skorr = 0;

arrNama.push(namaPemain); arrSandi.push(sandiPemain); arrKarakter.push(id_karakter); arrSkor.push(skorr);

arrSkor_1.push(skorr); arrSkor_2.push(skorr); arrSkor_3.push(skorr); arrSkor_4.push(skorr);

(26)

database.data.karakter = arrKarakter; database.data.skor_1 = arrSkor_1; database.data.skor_2 = arrSkor_2; database.data.skor_3 = arrSkor_3; database.data.skor_4 = arrSkor_4; database.flush();

urutan = database.data.nama.length - 1; karakterPemain = id_karakter;

skorPemain = skorr ;

skor_1 = skorr;skor_2 = skorr;skor_3 = skorr;skor_4 = skorr; gotoAndStop(6);

}

Kode untuk memunculkan karakter

(27)

karak = "kar_"+karakterPemain; namapemain.text=namaPemain;

attachMovie(karak, "karakter",this.getNextHighestDepth(),{_x:400,_y:200});

Kode untuk Save

save_lv.onRelease=function(){ klik.start(0,0);

skorPemain = skor_pemain.text; save(urutan);

popup("save_mc",240,165); save_mc._alpha = 100;

save_mc.ok.onRelease = function(){ clos.start(0,0);

(28)

}

Kode untuk memilih Level/Raja

//--- Level 1

#include "function.as" stop();

//menampilkan nama dan skor pemain saat ini nama_pemain.text= namaPemain;

skor_pemain.text= database.data.skor[urutan]; skorLevel1.text = skor_1+"/33";

worm.onRelease=function(){

konfirm.removeMovieClip(); klik.start(0,0);

(29)

popup("konfirm",255.85,159.9); konfirm._alpha = 100;

worm.enabled = false; //untuk melihat materi

konfirm.materiLv.onRelease = function(){ klik.start(0,0);

worm.enabled = true; stopAllSounds();

gotoAndStop("Scene 9",frameMateri); konfirm.removeMovieClip();

}

//untuk memulai kuis

konfirm.kuisLv.onRelease = function(){ klik.start(0,0);

(30)

konfirm.removeMovieClip(); stopAllSounds();

//kondisi apabila pemain sudah melakukan kuis sebelumnya dan berhasil if(skor_1 > 0){

popup("konfirm_ulang",240,143); konfirm_ulang._alpha = 100; worm.enabled = false;

konfirm_ulang.ya.onRelease = function(){ klik.start(0,0);

worm.enabled = true;

skorPemain = skorPemain - skor_1; stopAllSounds();

gotoAndStop("Kuis",1);

(31)

konfirm_ulang.tidak.onRelease = function(){ klik.start(0,0);

konfirm_ulang.removeMovieClip(); }

}else{

stopAllSounds();

gotoAndStop("HelpKuis",1); }

}

konfirm.tutup_mc.onRelease = function(){ clos.start(0,0);

(32)

}

Kode untuk membuka Gembok Raja

//---membuka level 2

if(_root.skor_pemain.text > 33 && _root.skor1 > 33){ levelgembok._alpha = 0;

gelapninja._alpha = 0; }

Kode untuk bermain Kuis Istilah

//-- contoh kode untuk 4 buah kotak jawaban

#include "function.as" function hapus(){

(33)

h11.text = ""; h21.text = ""; h31.text = ""; h41.text = ""; }

play(); hapus(); waktu();

jawaban = "WIFI"; trace(jawaban);

h11.restrict = "A-Z";h21.restrict = "A-Z";h31.restrict = "A-Z";h41.restrict = "A-Z"; kuis_bantuan1.enabled = false;

(34)

kesempatan2._alpha = 100; kesempatan1._alpha = 100;

var kotak_jawab:Object = new Object(); kotak_jawab.onKeyDown = function() {

//spasi untuk menghapus isian if (Key.isDown(Key.SPACE)){

hapus(); }

if (h11.text.length == 1){ Selection.setFocus(h21); }

(35)

if (h31.text.length == 1){ Selection.setFocus(h41); }

if (h41.text.length == 1){

if (Key.isDown(Key.SHIFT)){

tebak = h11.text + h21.text + h31.text + h41.text; trace (tebak);

if(tebak == jawaban && jatah >= 1){ jwb_benar.start(0,0);

gotoAndStop(arrayList02[i]); //gotoAndStop(11);

cek_array();

(36)

}else{

if (jatah == 3){

kesempatan3._alpha = 20; kuis_lewati.enabled = true;

//setelah sekali menebak, bisa skip kuis_lewati.onRelease= function(){

klik_next.start(0,0);

gotoAndStop(arrayList02[i]); cek_array();

skor = skor_kuis + 0; skor_kuis = skor; }

}else if(jatah == 2){

(37)

kesempatan1._alpha = 20;

//bantuan apabila waktu dan kesempatan sudah habis kuis_bantuan1.onRelease = function(){

popup("bantuan1",215,210); bantuan1._alpha=100;

bantuan1.ya.onRelease=function(){ klik.start(0,0);

skor_kuis = skor_kuis - 2; bantuan1.removeMovieClip();

popup("bantu1",166,149); bantu1._alpha=100;

//klu tambahan di bantuan 1 atau berupa gambar yang berkaitan

bantu1.isiTeks.text = "Agar terkoneksi, biasanya menggunakan password. Singkatan dari Wireless Fidelity";

(38)

bantu1.removeMovieClip(); }

}

bantuan1.tidak.onRelease=function(){ clos.start(0,0);

bantuan1.removeMovieClip(); }

}

//hangman

kuis_bantuan2.onRelease = function(){ popup("bantuan2",215,210); bantuan2._alpha=100;

(39)

popup("hangman",8,77); hangman._alpha=100;

hangman.ya.onRelease=function(){ klik.start(0,0);

hangman.removeMovieClip(); }

}

bantuan2.tidak.onRelease=function(){ clos.start(0,0);

bantuan2.removeMovieClip(); }

} }else{

(40)

jwb_salah.start(0,0); jatah--;

hapus(); }

} } }

Key.addListener(kotak_jawab); stop();

Kode untuk menampilkan hasil kuis istilah

(41)

#include "function.as" if(skor_kuis<34){

status_level.text = "Maaf, ";

ucapan_level.text = "Skor kamu belum mencapai skor minimal untuk bisa lanjut ke level berikutnya. Pelajari kembali materi dan coba lagi !!" }else{

status_level.text = "Selamat !!! ";

ucapan_level.text = "Kamu berhasil melewati level ini dan dapat melanjutkan ke level berikutnya !!"; }

lanjut2.onRelease = function(){ klik.start(0,0);

karakter_kuis.removeMovieClip(); if(skor_kuis < 0){

skor_kuis = 0;

(42)

skorPemain = skorPemain + Number(skor_kuis); }else{

skor_1 = Number(skor_kuis);

skorPemain = skorPemain + Number(skor_kuis); }

stopAllSounds();

gotoAndStop("Level",1); save(urutan);

delete this.onEnterFrame; }

Kode kuis istilah Raja terakhir

(43)

x 220,243 x590,243 x400,313

x220,393 x590,393 */

var i = 0; //inisialisasi untuk acak frame shuffleArray(36,54);//fungsi acak frame trace (arrayList02);

play();

//skor_kuis = skorPemain; skor_kuis = 0;

(44)

popup("jawab_benar",220,243); jawab_benar._alpha = 100;

jawab_benar.onRollOver = function(){ jawab_benar._alpha = 70; }

jawab_benar.onRollOut = function(){ jawab_benar._alpha = 100; }

jawab_benar.isi_text.text = "Wireline";//tulisan pada kotak jawaban jawab_benar.onRelease = function(){

(45)

jawab_salah3.enabled = false; jawab_salah4.enabled = false;

//tombol lanjut muncul setelah jawaban benar dipilih lanjut._alpha = 100;

lanjut.enabled = true;

lanjut.onRelease = function(){ klik.start();

//lanjut ke soal berikutnya

jawab_benar.removeMovieClip(); jawab_salah1.removeMovieClip(); jawab_salah2.removeMovieClip(); jawab_salah3.removeMovieClip(); jawab_salah4.removeMovieClip(); //gotoAndStop(36);

(46)

cek_array(); }

//load kotak jawaban salah

attachMovie("jawab_salah","jawab_salah1",this.getNextHighestDepth(),{_x:590,_y:243}); jawab_salah1.isi_text.text = "Wireless";

jawab_salah1.onRelease = function(){ jawab_salah1.gotoAndStop(2); skor = skor_kuis - 5;

skor_kuis = skor;

jawab_salah1.enabled = false; }

(47)

jawab_salah1._alpha = 70; }

jawab_salah1.onRollOut = function(){ jawab_salah1._alpha = 100; }

attachMovie("jawab_salah","jawab_salah2",this.getNextHighestDepth(),{_x:400,_y:313}); jawab_salah2.isi_text.text = "WiFi";

skor_kuis = skor;

(48)

attachMovie("jawab_salah","jawab_salah3",this.getNextHighestDepth(),{_x:220,_y:393}); jawab_salah3.isi_text.text = "Client";

skor_kuis = skor;

(49)

attachMovie("jawab_salah","jawab_salah4",this.getNextHighestDepth(),{_x:590,_y:393}); jawab_salah4.isi_text.text = "Server";

skor_kuis = skor;

(50)

(51)

STORY BOARD

(52)

NO. TAMPILAN MEDIA DESKRIPSI

Tampilan Menu Utama

1. T1 :“#KejarKitjar”

T2 :

“multimedia pembelajaran

interaktif Jaringan

Komputer Dasar” B : “Suara” B1 : “Daftar” B2 : “Masuk” B3 : “Tentang” B4 : “Keluar”

Ketika tombol B1 – B4 diklik, maka akan muncul pop up masing-masing yang akan berjalan sesuai fungsinya. Adapun fungsi dari setiap tombol adalah sebagai berikut :

B : untuk pengaturan suara latar (fungsi ini berlaku sama pada setiap tombol B dalam multimedia ini)

B1 : untuk membuat akun baru B2 : untuk melanjutkan permainan

B3 : menampilkan informasi mengenai multimedia

(53)

Tampilan Cerita

2. B1 : Sebelumnya B2 : Selanjutnya G : Skenario Cerita

(54)

3. T : “Pilih Karakter”

B1 : Sebelumnya B2 : Selanjutnya

B3 : “OK”

G : Karakter

(55)

4. B1 : “MULAI”

G : Skenario Cerita

(56)

Tampilan Level

5. T1 : Nama Pemain T2 : Skor Pemain T3 : Pencapaian setiap level

B1 : “simpan” B2 : “keluar”

B3 : Sebelumnya B4 : Selanjutnya B5 : Raja

Ketika menekan tombol B5, maka akan muncul pop up untuk memilih

mempelajari materi (menuju Tampilan Materi), atau langsung melakukan game

kuis istilah (menuju Tampilan Petunjuk Bermain).

(57)

(58)

Tampilan Petunjuk Bermain

6. T1 : Nama Pemain T2 :

“Sebelum memulai permainan, ada beberapa hal yang perlu kamu ketahui...”

B1 : “Lewati” B2 : “Lanjut”

(59)

7. T1 : Petunjuk bermain T2 : Keterangan tambahan B1 : Lanjut

G : Keterangan tambahan

T1 merupakan petunjuk utama, sedangkan T2 dan G merupakan

(60)

Tampilan Materi

8. T1 :

“Materi 1/2/3. Pilih materi yang akan dipelajari”

B1 :

“kembali”

B2 – B4 : Pilihan Materi

Tombol B2-B4 digunakan untuk memilih materi yang tersedia sesuai Level.

(61)

9. T1 : Judul Materi T2 : Teks sesuai materi G : Penunjang T2 B1 : Sebelumnya B2 : Selanjutnya

(62)

10. T1 : Judul Materi T2 : Konten (berisi penjelasan materi berupa teks, gambar, animasi sederhana, dan video) B1 : kembali

B2 : “1,2,3..”

(63)

Tampilan Kuis

11. T1 : Monolog Raja

B1 : “Mulai” B2 : “Tidak”

G : Karakter Raja

Tampilan ini muncul setiap akan memulai

game kuis istilah. Tombol B1 digunakan untuk memulai dan tombol B2 digunakan untuk kembali ke Tampilan Level.

(64)

(65)

12. T1 : Pernyataan / clue

G3 : Kesempatan

I1 – I4.. : Kotak Jawaban

(66)

tambahan

B1 : “OK”

Tampilan ini merupakan tampilan berupa

pop up untuk Bantuan 1 pada kuis. Setelah menekan tombol B1, pop up

(67)

14. T : Jawaban benar

B1 : “OK” B2 : “Coba Lagi”

Tampilan ini merupakan tampilan berupa

pop up untuk Bantuan 2 pada kuis. Pengguna menekan pada salah satu huruf yang ada sampai menemukan jawaban yang benar. Apabila tidak berhasil, maka tombol B2 akan muncul. Setelah

(68)

T3 : Skor

T4 : Nama Pemain T5 : Nama Raja B1 : Pilihan jawaban

B2 : “Lanjut”

Tampilan ini merupakan tampilan pada saat melawan raja terakhir. Pengguna harus memilih jawaban pada B1. Setelah jawaban benar, tombol B2 akan muncul. Tombol B2 digunakan untuk

(69)

16. T1 : Nama Pemain T2 :

“Untuk melaju ke level selanjutnya, kamu harus mengumpulkan skor minimal .. . Kamu berhasil mengumpulkan skor sebanyak : ”

T3 : Skor

B1 : “Lanjut”

Tampilan ini merupakan tampilan

(70)

17. T1 : Ucapan

T2 : Status pencapaian pengguna

B1 : “Lanjut”

Isi dari T1 adalah “Selamat !!!” (ketika pengguna berhasil) dan “Maaf’ (ketika pengguna gagal). Sedangkan T2 berisi

“Kamu berhasil melewati level ini dan dapat melanjutkan ke level berikutnya !!”

(ketika pengguna berhasil) dan “Skor

kamu belum mencapai skor minimal

untuk bisa lanjut ke level berikutnya. Pelajari kembali materi dan coba lagi !!”

(ketika pengguna gagal).

(71)