TUTORIAL
Membuat
Kuis Pilihan Ganda dengan Flash
Langkah-Langkah:
1. Aktifkan program Macromedia Flash anda. Pada Creat
New, pilih Flash Document.
2.Opsional: Pada Frame 1 Layer 1, buat background
dengan rectangle tool. Klik kanan frame 7, pilh Insert Keyframe. Kunci Layer 1.
3.Klik Insert Layer (sudut kiri bawah timeline) untuk
membuat Layer baru (layer 2).
4.
Klik Frame 1 Layer
2, buat judul kuis dengan Static Text. Di bawah judul, buatlah kotak nama
dengan Input Text (aktifkan ‘Show border around text’). Pada Var, ketik ‘nama’.
Tambahkan petunjuk pengisian kotak nama di atas Input Text. Sejauh ini hasilnya
seperti gambar di bawah.
5.Klik kanan Frame 2 Layer 2, pilih Insert Blank
Keyframe. Buat soal beserta pilihan jawabannya dengan tipe teks Static.
6. Klik Frame 2 Layer 2, kemudian tekan F6 pada
Keyboard untuk meng-copy frame sampai dengan Frame 6. Klik Frame 3, ganti soal
beserta jawabannya. Demikian seterusnya sampai dengan soal nomor lima yang ada
di Frame 6.
7.Klik kanan Frame 7 Layer 2, pilih Insert Blank
Keyframe. Sampai di sini, kunci Layer 2 dan simpan dulu dengan nama file
LATIHAN1.
8.
Buat Layer baru
(Layer 3). Klik Frame 1, Buat teks ‘MULAI’ dengan Static Text, letakkan di bawah kotak nama.
Klik Selection Tool (tanda panah kanan atas pada Tools), Klik kanan pada teks
‘MULAI’ tersebut, Pilih Convert to
Symbol, Type-nya pilih Button, lalu klik OK. Pastikan Panel Properties aktif,
pada kotak Instance Name ketik ‘startbutton’.
9. Klik kanan
Frame 2 layer 3, pilih Insert Blank Keyframe. Buat object kotak dengan Rectangle
Tool tepat di atas pilihan jawaban A. Tekan F8 (Klik kanan Convert to Symbol),
pada Type pilih ‘Button’, klik OK. Klik ganda Kotak yang telah dikonversi
menjadi button tersebut. Klik kanan pada Frame Up, pilih Cut Frames, klik kanan
pada Frame Hit, pilih Paste Frames. Kemudian klik Scene 1 pada Timeline.
10.
Pastikan button
kotak terseleksi, Ketik ‘button_a’ pada kotak Instance Name pada Panel
properties.
11.
Kopi button kotak
tadi (klik kanan, Copy Paste 3 kali) dan masing-masing letakkan tepat di atas
pilihan B, C, dan D. Seleksi button di atas pilihan jawaban B, Ubah Instance
Name-nya menjadi ‘button_b’, di atas pilihan jawaban C menjadi ‘button_c’, dan
di atas pilihan jawaban D menjadi ‘button_d’. Sampai di sini, simpan dulu
(tekan Ctrl+S).
12.
Klik Frame 2 Layer
3, tekan F6 4 kali untuk men-copy frame. Klik kanan Frame 7 Layer 3, pilih
Insert Blank Keyframe. Kunci Layer 3.
13.
Buat Layer baru
(Layer 4). Klik Frame 1 . Tekan F7 6 kali. Masih di Layer 7, kembali klik Frame
1, lalu tekan F9 untuk menampilkan panel Action dan masukkan ActionScript
berikut (bisa dengan Copy-Paste):
stop();
score = 0;
startbutton.onPress
= function() {
nextFrame();
};
14.
Klik Frame 2 Layer 4,
masukkan ActionScript berikut:
stop();
onEnterFrame =
function () { skor = +score;};
button_a.onPress
= function() {
nextFrame();
};
button_b.onPress
= function() {
score += 20;
nextFrame();
};
button_c.onPress
= function() {
nextFrame();
};
button_d.onPress
= function() {
nextFrame();
};
Keterangan:
Soal no. 1 kunci jawabannya B. Jika button_b (pilihan jawaban B) diklik skor
bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya.
15.
Klik Frame 3 (masih
di Layer 4), masukkan ActionScript berikut:
stop();
onEnterFrame =
function () { skor = +score;};
button_a.onPress
= function() {
score += 20;
nextFrame();
};
button_b.onPress
= function() {
nextFrame();
};
button_c.onPress
= function() {
nextFrame();
};
button_d.onPress
= function() {
nextFrame();
};
Keterangan:
Soal no. 2 kunci jawabannya A. Jika button_a (pilihan jawaban A) diklik skor
bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya.
16.
Klik Frame 4 (masih
di Layer 4), masukkan ActionScript berikut:
stop();
onEnterFrame =
function () { skor = +score;};
button_a.onPress
= function() {
score += 20;
nextFrame();
};
button_b.onPress
= function() {
nextFrame();
};
button_c.onPress
= function() {
nextFrame();
};
button_d.onPress
= function() {
nextFrame();
};
Keterangan:
Soal no. 3 kunci jawabannya A. Jika button_a (pilihan jawaban A) diklik skor
bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya.
17.
Klik Frame 5 (masih
di Layer 4), masukkan ActionScript berikut:
stop();
onEnterFrame =
function () { skor = +score;};
button_a.onPress
= function() {
nextFrame();
};
button_b.onPress
= function() {
nextFrame();
};
button_c.onPress
= function() {
score += 20;
nextFrame();
};
button_d.onPress
= function() {
nextFrame();
};
Keterangan:
Soal no. 4 kunci jawabannya C. Jika button_c (pilihan jawaban C) diklik skor
bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya.
18.
Klik Frame 6 (masih
di Layer 4), masukkan ActionScript berikut:
stop();
onEnterFrame =
function () { skor = +score;};
button_a.onPress
= function() {
nextFrame();
};
button_b.onPress
= function() {
score += 20;
nextFrame();
};
button_c.onPress
= function() {
nextFrame();
};
button_d.onPress
= function() {
nextFrame();
};
Keterangan:
Soal no. 5 kunci jawabannya B. Jika button_b (pilihan jawaban B) diklik skor
bertambah 20 dan menuju frame berikutnya.
Sampai di
sini, simpan dulu (tekan Ctrl+S).
19.
Selanjutnya, buka
kunci Layer 2 dengan cara klik tanda gambar gembok di Layer tersebut. Klik
kanan kotak Input Text yang telah dibuat di Frame 1 Layer 2, Copy dan Paste-kan
di Frame 7 (masih di Layer 2). Klik ganda kotak Input Text dan ketik ‘tanpa
nama’.
Di bawah kotak
Input Text, ketik ‘Nilai anda:’ dengan ukuran Font 15 (Type Text-nya Static
Text). Di bawah teks ‘Nilai anda:’, buat Dynamic Text kosong dengan
cara klik Text Tool (A) pada panel Tools, pastikan panel Properties
aktif, kemudian pilih Dynamic Text dengan ukuran font 50, klik di bawah teks
‘Nilai anda:’ dan drag ke kanan. Pada kotak ‘Var’, ketik ‘skor’.
Di bawah
‘Dynamic Text’ dengan nama Variable ‘skor’, ketik dengan tipe teks Static Text
‘Kriteria ketuntasan Minimal (KKM): 80’
Di bawah teks
‘Kriteria ketuntasan Minimal (KKM): 80’, buat lagi Dynamic Text kosong dengan
nama variable ‘keterangan’. Kembali kunci Layer 2.
Tampilan Stage
pada Frame 7 Layer 2 seperti Gambar di bawah.
20.
Selanjutnya, buka
kunci Layer 3. Klik Frame 7 Layer 3. Ketik ‘ULANGI’ dengan tipe teks Static.
Klik kanan teks tersebut, pilih Convert to Symbol, tipenya Button. Pastikan
panel Properties aktif dan pada kotak Instance Name ketik ‘restart_button’.
Kembali kunci Layer 3.
21.
Klik Frame 7 Layer
4 (pastikan Layer 4 tidak terkunci) kemudian tekan F9 untuk mengaktifkan panel
Action dan masukkan ActionScript berikut:
if
(score>=80) {
keterangan = "Bagus! Pertahankan
Prestasi!";
}
if
(score<=60) {
keterangan = "Anda belum tuntas.
Belajar lagi, ya!";
}
restart_button.onPress
= function() {
gotoAndStop(1);
};
22.
Selesai dan tekan
Ctrl+S untuk menyimpan. Di bawah adalah tampilan akhir jendela Flash Ducument
frame terakhir (7).
23.
Untuk melihat
hasilnya, tekan Ctrl+Enter.
SELAMAT
MENCOBA DAN MEMODIFIKASINYA.
SAMPAI
JUMPA LAGI PADA TUTORIAL BERIKUTNYA.
Salam
Kreatif!
Baguez.Satanic.Corps
2012