P. 1
Tutorial Membuat Kuis Flash

Tutorial Membuat Kuis Flash

|Views: 1,575|Likes:

More info:

Published by: Pang Tobanauli Gultoem on May 19, 2011
Copyright:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as DOC, PDF, TXT or read online from Scribd
See more
See less

06/21/2013

pdf

text

original

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

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

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

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

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

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

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

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

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

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

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

You're Reading a Free Preview

Download
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->