KUIS EDITING VIDEO

8/18/2019 KUIS EDITING VIDEO

1/13

Aplikasi kuis sering kali kita jumpai pada media pembelajaran, game atau aplikasi multimedia. Model kuis

dengan soal yang acak dan jawaban acak menjadi sebuah daya tarik tersendiri dalam sebuah media

pembelajaran. Akan tetapi para pemula pemrograman biasanya mengalami kesulitan dalam membuat sistem

soal acak, jawaban acak dan sistem penilaian. Untuk itu melalui tutorial ini, akan dijelaskan secara sederhana

tentang pembuatan kuis interaktif dengan sistem pengacakan soal, pengacakan jawaban dan sistem penilaian.Hasil akhir dari aplikasi ini dapat anda kembangkan lebih lanjut menjadi sesuatu yang lebih kompleks semacam

game Who Want to be Millionaire, Who has biggest brain dan sebagainya. Hasil akhir yang diharapkan kurang

lebih sebagai berikut :

Untuk membuatnya, perhatikan langkahlangkah berikut :

!ada tutorial ini akan dijelaskan metode yang sangat sederhana dalam membuat "isplay #bject, yaitu dengan

membuat secara langsung tampilan $ aset %isual di &tage. !ada dasarnya metode ini lebih mudah untuk

dipelajari, akan tetapi metode yang lebih baik adalah dengan menggunakan sistem class dan addChild. 'etika

anda sudah memahami konsep sederhana berikut, anda dapat merubahnya agar lebih optimal.

(. )uatlah sebuah file baru, atur properties file untuk keperluan mobile, yaitu dengan resolusi *++ -*+

piel dan + fps.


2/13

/. &elanjutnya buatlah sebuah tampilan untuk aplikasi kuis meliputi background, beberapa static

text sebagai pemanis tampilan, dan dynamic text untuk soal dan untuk score. !erhatikan gambar :

. &eleksi dynamic text untuk soal kemudian buka panel properties kemudian atur jenis huruf, matikan

opsiselectable dan opsi line type menjadi multi line. #psi multi line digunakan agar sebuah dynamic

tet mampu menampilkan beberapa baris teks. &elain itu anda harus menekan tombol embed untuk

menyertakan file huruf ke dalam aplikasi, sehingga aplikasi dapat dijalankan di semua tempat tanpa

mengalami distorsi huruf. !erhatikan gambar :


3/13

-. Untuk membuat tombol pilihan jawaban, buatlah sebuah Movieclip baru dengan memilih opsi Insert >

New Symbol. 'etikan nama alternatif jawaban registrasi point berada di tengah, lalu tekan !.

&elanjutnya buatlah / buah "ayer , pada "ayer # $atas% buatlah sebuah dynamic text untuk

menampilkan jawaban. )uka panelproperties dan tambahkan instance name &jawaban'txt&.

!ada "ayer ( $bawah% buatlah sebuah background berupa kotak.

Untuk mendapatkan efek mouse over , klik frame # layer ( tambahkan !ey)rame $)*%, lalu ubah

warna background jawaban menjadi warna lain. &elanjutnya klik frame # layer # dan tambahkan )rame

$)+%. 0note : 1fek mouse o%er dapat ditampilkan secara otomatis pada symbol bertipe button, akan

tetapi button atau tombol tidak dapat menampilkan objek lain seperti dynamic tet di dalamnya,

sehingga kita harus menggunakan symbol bertipe Mo%ieclip2. !erhatikan gambar :

3. 'embali ke Scene ( kemudian drag Movieclip alternatif jawaban ke &tage sebanyak - kali. Atur

posisinya masingmasing.

4. Agar masingmasing objek dapat diakses oleh kode, maka perlu ditambahkan instance name, klik

objek, kemudian buka panel properties, dan ketikan instance name sesuai dengan gambar berikut:


4/13

5. 'emudian untuk menampilkan apakah jawaban pemain benar atau salah, digunakan metode pop up

dengan sedikit animasi. Untuk itu diperlukan sebuah mo%ieclip yang di dalamnya terdapat beberapa

pesan pop up. Untuk membuatnya buatlah sebuah tampilan popup ketika jawaban benar seperti pada

gambar, lalu seleksi dan pilih convert to symbol $),% dengan nama hasil'mc, registrasi point tepat

di tengah, centang opsi -xport for .ctionscript, lalu tekan !. !erhatikan gambar :

*. 1dit Movieclip hasil'mc dengan cara dobel klik mo%ieclip tersebut, kemudian klik frame # dan

tambahkan!eyframe $)*%, lalu edit konten di frame / menjadi tampilan ketika jawaban salah. "engan

cara yang sama pada frame / buatlah tampilan ketika permainan berakhir 0soal telah habis2. !erhatikan


5/13

gambar :

6ahapan selanjutnya adalah penambahan kode. )uatlah sebuah layer baru agar tidak mengganggu objek yang

sudah anda buat pada langkah di atas. &elanjutnya klik frame ( layer #, dan ketikan kode berikut :

1 var nilai:Number = 0;

2 var no_soal:Number = 0;

3 var max_soal:Number = 10;

4 var hasil:hasil_mc;

5 // struktur soal 0. oal 1!4 "a#aban$ %a#aban benar &iletakkan no 1

' var soal:(rra) = **+ia,akah ,enemu mesin ua, -+$ +%ames att+$ +avinci+$

+ssac Ne#ton+$ +%ames bon&+$

*+(kar &ari '' a&alah -+$ +2'+$ +24+$ +1'+$ +34+$


6/13

*+aian tumbuhan )an ber,eran ,entin &alam 6otosintesis

a&alah -+$ +7loro6il+$ +7ambium+$ +8,i&ermis+$ +7romatin+$

9 *+enulis triloi or& o6


7/13

25

2' 6unction acak_soalAB:voi&J

2 //menacak soal

2 tem,_soal = soal.sliceA0$ soal.lenthB;

29 6or Avar i:Number = 0; i K soal.lenth; iCCBJ

30 var acak:Number = Dath.6loorADath.ran&omABLsoal.lenthB;

31 var tem,:(rra) = tem,_soal*acak;

32 tem,_soal*acak = tem,_soal*i;

33 tem,_soal*i = tem,;

34 M

35 M

3' 6unction restartAB:voi&J

3 //restart kuis$ semua variabel &ikembalikan ke ,osisi semula

3 acak_soalAB;

39 nilai = 0;

40 no_soal = 0;

41 max_soal = 10;

42 score_txt.text = +0+;

43 restart_btn.visible = 6alse;

44 M

45

4' 6unction tam,ilkan_soalAB:voi&J

4 //tam,ilkan soal

4 soal_txt.text = tem,_soal*no_soal*0;


8/13

49 //acak "a#aban

50 tem,_"a#aban = tem,_soal*no_soal.sliceA1$ 5B;

51 6or Avar i:Number = 0; i K tem,_"a#aban.lenth; iCCBJ

52 var acak:Number = Dath.6loorADath.ran&omABLtem,_"a#aban.lenthB;

53 var tem,:trin = tem,_"a#aban*acak;

54 tem,_"a#aban*acak = tem,_"a#aban*i;

55 tem,_"a#aban*i = tem,;

5' M

5 //tam,ilkan "a#aban

5 "a#aban_1."a#aban_txt.text = tem,_"a#aban*0;

59 "a#aban_2."a#aban_txt.text = tem,_"a#aban*1;

'0 "a#aban_3."a#aban_txt.text = tem,_"a#aban*2;

'1 "a#aban_4."a#aban_txt.text = tem,_"a#aban*3;

'2 M

'3

'4 6unction setu,_a#alAB:voi&J

'5 restartAB;

'' tam,ilkan_soalAB;

' //menatur "a#aban

' "a#aban_1.sto,AB;

'9 "a#aban_2.sto,AB;

0 "a#aban_3.sto,AB;

1 "a#aban_4.sto,AB;

2 "a#aban_1.a&&8ventistenerADouse8vent.>>7$ cek_"a#abanB;


9/13




' //listener untuk e6ek tombol

"a#aban_1.a&&8ventistenerADouse8vent.DF8_I8$ mouse_overB;

"a#aban_2.a&&8ventistenerADouse8vent.DF8_I8$ mouse_overB;

9 "a#aban_3.a&&8ventistenerADouse8vent.DF8_I8$ mouse_overB;

0 "a#aban_4.a&&8ventistenerADouse8vent.DF8_I8$ mouse_overB;

1 //mouse out

2 "a#aban_1.a&&8ventistenerADouse8vent.DF8_F


10/13

9 6unction cek_"a#abanAe:Douse8ventB:voi&J

9 var no_"a#aban:Number = NumberAe.current


11/13

121 M

122

123 6unction erak_hasilAe:8ventB:voi&J

124 var ob:b"ect = e.current


12/13

145 M

14' 6unction ulaniAe:Douse8ventB:voi&J

14 hasil.remove8ventistenerA8vent.8Nhil&Ais,la)b"ectAhasilBB;

149 restartAB;

150 tam,ilkan_soalAB;

151 M

152 setu,_a#alAB;

7alankan aplikasi dengan menekan tombol Ctrl0-nter , maka hasil dari tutorial ini adalah sebagai berikut:


13/13

&elanjutnya anda dapat melakukan perubahan database soal, menambahkan sistem perhitungan waktu,

bantuan dan sebagainy

Documents

KUIS EDITING VIDEO