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.

Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010

1

Buat object kotak dengan Rectangle Tool tepat di atas pilihan jawaban A. 9. Klik kanan Frame 7 Layer 2. Klik kanan Frame 2 Layer 2. 8. kemudian tekan F6 pada Keyboard untuk meng-copy frame sampai dengan Frame 6. pada kotak Instance Name ketik ‘startbutton’. Pilih Convert to Symbol. Klik kanan pada teks ‘MULAI’ tersebut. Buat Layer baru (Layer 3). Demikian seterusnya sampai dengan soal nomor lima yang ada di Frame 6. kunci Layer 2 dan simpan dulu dengan nama file LATIHAN1. Buat teks ‘MULAI’ dengan Static Text. Klik kanan Frame 2 layer 3. ganti soal beserta jawabannya. Type-nya pilih Button. Klik Frame 2 Layer 2. Sampai di sini. pilih Insert Blank Keyframe.5. lalu klik OK. pilih Insert Blank Keyframe. 6. 7. letakkan di bawah kotak nama. Tekan F8 (Klik kanan 2 Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 . Klik Frame 1. Pastikan Panel Properties aktif. Klik Frame 3. Buat soal beserta pilihan jawabannya dengan tipe teks Static. Klik Selection Tool (tanda panah kanan atas pada Tools). pilih Insert Blank Keyframe.

klik OK.Kopi button kotak tadi (klik kanan. button_b. 11. Tekan F7 6 kali. dan D. Kemudian klik Scene 1 pada Timeline. Kunci Layer 3. pilih Cut Frames. 12. C. }. Seleksi button di atas pilihan jawaban B. button_a. 14. pilih Insert Blank Keyframe. kembali klik Frame 1. pada Type pilih ‘Button’. tekan F6 4 kali untuk men-copy frame.Klik Frame 2 Layer 3. Klik kanan Frame 7 Layer 3.Klik Frame 2 Layer 7. Klik ganda Kotak yang telah dikonversi menjadi button tersebut. onEnterFrame = function () { skor = +score. }. lalu tekan F9 untuk menampilkan panel Action dan masukkan ActionScript berikut (bisa dengan Copy-Paste): stop().onPress = function() { nextFrame(). Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 3 .onPress = function() { nextFrame(). Klik kanan pada Frame Up.Buat Layer baru (Layer 4). pilih Paste Frames. 13. dan di atas pilihan jawaban D menjadi ‘button_d’. Ketik ‘button_a’ pada kotak Instance Name pada Panel properties.}. score = 0.onPress = function() { score += 20.Pastikan button kotak terseleksi. Sampai di sini. Masih di Layer 7. Copy Paste 3 kali) dan masing-masing letakkan tepat di atas pilihan B. simpan dulu (tekan Ctrl+S). }. startbutton. 10. masukkan ActionScript berikut: stop(). nextFrame(). Ubah Instance Name-nya menjadi ‘button_b’. Klik Frame 1 .Convert to Symbol). di atas pilihan jawaban C menjadi ‘button_c’. klik kanan pada Frame Hit.

Klik Frame 3 (masih di Layer 4).}. button_c. onEnterFrame = function () { skor = +score. Keterangan: Soal no. nextFrame().onPress = function() { nextFrame(). }.onPress = function() { nextFrame().onPress = function() { score += 20. masukkan ActionScript berikut: stop(). 1 kunci jawabannya B.onPress = function() { nextFrame(). 2 kunci jawabannya A. }. Jika button_b (pilihan jawaban B) diklik skor bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya.onPress = function() { nextFrame(). Keterangan: Soal no. Jika button_a (pilihan jawaban A) diklik skor bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya. Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 4 . button_a. button_b. }.button_c. }.onPress = function() { nextFrame(). 15. }. button_d. }. button_d.

button_c.}. }. onEnterFrame = function () { skor = +score. button_a. button_b.}. nextFrame().Klik Frame 5 (masih di Layer 4). Jika button_a (pilihan jawaban A) diklik skor bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya. }. }.onPress = function() { nextFrame().onPress = function() { nextFrame(). button_d. 17. masukkan ActionScript berikut: stop().onPress = function() { nextFrame(). }. 3 kunci jawabannya A.16.Klik Frame 4 (masih di Layer 4). button_a. masukkan ActionScript berikut: stop(). }.onPress = function() { nextFrame().onPress = function() { nextFrame(). Keterangan: Soal no. onEnterFrame = function () { skor = +score. button_b.onPress = function() { score += 20. Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 5 .

onPress = function() { score += 20. }. button_d. button_b.}. 4 kunci jawabannya C. nextFrame().Klik Frame 6 (masih di Layer 4). Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 6 . }. }.onPress = function() { nextFrame().onPress = function() { nextFrame(). }. button_a. onEnterFrame = function () { skor = +score. Keterangan: Soal no. button_c.onPress = function() { nextFrame(). button_c.}.onPress = function() { score += 20. 18. nextFrame().onPress = function() { nextFrame(). masukkan ActionScript berikut: stop(). }. Jika button_c (pilihan jawaban C) diklik skor bertambah 20 dan menuju frame berikutnya yang berisi soal berikutnya. }. button_d.

Klik kanan kotak Input Text yang telah dibuat di Frame 1 Layer 2. ketik dengan tipe teks Static Text ‘Kriteria ketuntasan Minimal (KKM): 80’ Di bawah teks ‘Kriteria ketuntasan Minimal (KKM): 80’. kemudian pilih Dynamic Text dengan ukuran font 50. pastikan panel Properties aktif. ketik ‘Nilai anda:’ dengan ukuran Font 15 (Type Text-nya Static Text). buat lagi Dynamic Text kosong dengan nama variable ‘keterangan’. klik di bawah teks ‘Nilai anda:’ dan drag ke kanan. Kembali kunci Layer 2. Sampai di sini. buka kunci Layer 2 dengan cara klik tanda gambar gembok di Layer tersebut. simpan dulu (tekan Ctrl+S).Selanjutnya. Di bawah ‘Dynamic Text’ dengan nama Variable ‘skor’. Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 7 . Pada kotak ‘Var’. 19. Copy dan Paste-kan di Frame 7 (masih di Layer 2). ketik ‘skor’. Tampilan Stage pada Frame 7 Layer 2 seperti Gambar di bawah. buat Dynamic Text kosong dengan cara klik Text Tool (A) pada panel Tools. 5 kunci jawabannya B. Jika button_b (pilihan jawaban B) diklik skor bertambah 20 dan menuju frame berikutnya.Keterangan: Soal no. Klik ganda kotak Input Text dan ketik ‘tanpa nama’. Di bawah teks ‘Nilai anda:’. Di bawah kotak Input Text.

Selanjutnya.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!". Klik Frame 7 Layer 3. ya!". } if (score<=60) { keterangan = "Anda belum tuntas. Belajar lagi. buka kunci Layer 3.20. Ketik ‘ULANGI’ dengan tipe teks Static. } Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 8 . 21. pilih Convert to Symbol. Klik kanan teks tersebut. tipenya Button. Pastikan panel Properties aktif dan pada kotak Instance Name ketik ‘restart_button’. Kembali kunci Layer 3.

restart_button. Salam Kreatif! M Mursyid PW 2010 Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 9 . SAMPAI JUMPA LAGI PADA TUTORIAL BERIKUTNYA.onPress = function() { gotoAndStop(1).Selesai dan tekan Ctrl+S untuk menyimpan. 22. SELAMAT MENCOBA DAN MEMODIFIKASINYA. }. Di bawah adalah tampilan akhir jendela Flash Ducument frame terakhir (7). tekan Ctrl+Enter. 23.Untuk melihat hasilnya.

imageshack. Sekarang kita telah mempunyai animasi pada "asabutton ( Movie Clip )". http://img18. 14.us/img17/5189/gb11. http://img8. Tambahkan satu Layer dan beri nama seperti gambar 13.jpg 17. Seleksi Frame 10 pada pada kedua Layer.us/img25/1420/gb07. klik kanan dan pilih "Insert Keyframe" ( gb 07 ). Seleksi Frame 5 pada Layer "sript".imageshack.us/img18/9942/gb01. Seleksi Frame 1 pada pada kedua Layer.jpg 9. http://img25.us/img11/5686/gb09.imageshack. Kembali pada "Scene 1".imageshack.".imageshack. klik kanan lalu Convert To Symbol. http://img10.us/img6/9189/gb06.jpg 2. 3. Seleksi Frame 5 pada Lyer BG.imageshack.langkahnya sebagai berikut : 1. klik kanan dan pilih "Copy Frame" ( gb 10 ).imageshack. gb 04 ). http://img7. Pilih Movie Clip dan berilah nama ( gb 02 ). klik kanan dan pilih "Insert Keyframe".jpg 4." seperti pada gambar 12. Beri nama pda Instance Name seperti pada gambar 03 yaitu "asaButtonMc". 18. Buatlah kotak sepeti pada gambar 01.Langkah .us/img8/1473/gb13. lalu rubah posisi dan warna ( gb 08 ). 15. Seleksi layer Text.imageshack.jpg Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 1 0 . lalu ketik "stop().jpg 6. klik kanan dan pilih "Paste Frame" ( gb 11 ). klik kanan dan pilih "Actions". 5.jpg 8. http://img17. Seleksi kotak tersebut.us/img7/5106/gb05n.imageshack. Klik kanan dan pilih "Actions". 16. Seleksi layer pertama pada kedua layer. klik kanan. Seleksi di Frame 5 pada kedua layer.jpg 7. http://img6. Seleksi Frame 1 pada Layer "sript". http://img11.jpg 11. lalu ketik "stop(). lalu pilih "Create Classic Tween" ( gb 06 ). lalu klik tombol Text untuk menulis kata "ASA STUDIO Tutorial" ( gb 05 ).us/img18/1796/gb10.us/img10/9366/gb03.jpg 10. 13. http://img18.imageshack. lalu rubah warna ( gb 09 ). lalu beri nama pada layer ( BG & Text.jpg 12. dan tambahkan satu layer.us/img22/813/gb08. Double klik Movie Clip.imageshack. Tekan "Enter" untuk melihat hasil animasi. Seleksi Frame 5 pada Layer Text.us/img10/7206/gb12. http://img10. http://img22. Tambahkan satu Layer lagi dan beri nama "sript".

jpg 20.imageshack.19. Tutorial Flash: Membuat Kuis Pilhan Ganda_mmursyidpw2010 1 1 . http://img7. Lalu ketik seperti gambar 14. Seleksi Frame 1 pada Layer Cript. Tutorial telah selesai.us/img7/6872/gb14. lalu tekan F9 untuk mengeluarkan "Actions Script Panel". sekarang "Test Movie" atau "Ctr+Enter".

Sign up to vote on this title
UsefulNot useful

Master Your Semester with Scribd & The New York Times

Special offer for students: Only $4.99/month.

Master Your Semester with a Special Offer from Scribd & The New York Times

Cancel anytime.