SlideShare a Scribd company logo
Membuat Quiz Sederhana dengan
ActionScript 2.0
Oleh: Gilang Abdul Aziz



Setelah kita selesai membuat skenario, selanjutnya pada akhir skenario kita akan
menampilkan quiz.
Pertama kita membuat Scene baru terlebih dahulu. Kita berinama Scene tersebut ‘Quiz’




                                    Figure 1 - Insert new Scene

Setelah Scene Quiz dibuat, selanjutnya kita persiapkan layer terlebih dahulu. Itu akan
memudahkan kita dalam pembuatan objek-objek yang nanti akan kita pakai.
Kita buat 4 layer, terdiri dari:




                                     Figure 2 - Prepare Layers

Selanjutnya pada layer Pertanyaan Frame 1, kita isi dengan sebuah teks




                                       Figure 3 - Insert Text

Kemudian pada layer Jawaban Frame 1, kita isi dengan 3 buah teks. Perhatikan pula jarak
antara tiap jawaban jangan terlalu dekat.

                                                                                          1
Figure 4 - Insert Text

Selanjutnya kita akan membuat tombol untuk di klik saat memilih jawaban. Ada 3 buah
tombol. Posisi tiap tombol disesuaikan dengan pilihan jawaban nya.
Pada layer Tombol, Frame 1, Pertama-tama kita buat sebuah box,




                                       Figure 5 - Insert Box

Selanjutnya pada box tersebut kita buat sebuah text sesuai dengan pilihan.




                                Figure 6 - Insert Text above the Box

Copy/paste box dan text yang sudah kita buat tersebut ke tiap pilihan jawaban. Tentunya
jangan lupa kita ubah teks nya, sesuaikan dengan pilihan jawaban nya.




                                    Figure 7 - Clone the Object



                                                                                          2
Setelah ketiga objek tersebut siap, sekarang kita akan mengubah ketiga objek tersebut
menjadi tombol yang bisa diklik.
Kita seleksi dulu objek box beserta teks nya.




                                   Figure 8 - Select the Object

Kemudian klik kanan pada objek yang sudah kita seleksi tersebut, pilih Convert to Symbol.




                                   Figure 9 - Convert to Symbol

Selanjutnya akan keluar dialog, pada dialog tersebut kita diharuskan untuk mengisi nama
symbol dan jenis symbol apa yang akan kita buat.
Kita pilih Button dan isi namanya dengan ‘A’




                                  Figure 10 - Convert to Symbol

Jika sudah berhasil, maka pada library akan bertambah satu symbol baru bertipe button.
Seperti di bawah ini.


                                                                                            3
Figure 11 - Library

Selanjutnya adalah kita lakukan ulang untuk tiap objek yang tadi sudah kita buat untuk
pilihan B dan C. Jangan lupa box dan teksnya harus terseleksi sempurna.
Jika sudah, maka pada library akan ada 3 buah symbol bertipe tombol seperti di bawah ini.




                                    Figure 12 - Library Final

Persiapan quiz sudah hampir selesai, sekarang kita akan membuat respon yang terjadi jika
user manjawab. Benar atau salah.
Jika benar, playhead akan berpindah ke Frame 2. Jika salah akan berpindah ke Frame 3.
Selanjutnya pada Layer Respon pada Frame 2, kita insert blank keyframe.




                                   Figure 13 - Insert Keyframe

Lakukan hal yang sama pada frame 3. Sehingga pada layer respon akan tersedia pada
sampai frame 3 seperti di bawah ini.



                                                                                            4
Figure 14 - Keyframe

Kita simpan playhead pada Frame 2 pada layer Respon, kita isi dengan teks:




                                     Figure 15 - Insert Text (True)

Pada Frame 3 kita isi dengan teks:




                                     Figure 16 - Insert Text (False)

Semua persiapan sudah beres, saatnya kita akan melakukan coding. Memberikan
ActionScript 2.0 pada objek-objek yang akan berinteraksi.
Sebelumnya kita buat dulu sebuah layer baru bernama ‘Aksi’. Simpan pada posisi paling
atas, untuk memudahkan.




                                     Figure 17 - Insert new Layer

Kita pilih layer Aksi, pada Frame 1, klik kanan, kemudian pilih Actions:


                                                                                        5
Figure 18 - To The Actions

Nanti akan tampil Panel Actions, seperti ini




                                    Figure 19 - Actions Panel in Frame 1

Kita isi dengan code berikut ini:




                                        Figure 20 - ActionScript 2.0

Selanjutnya kita pilih Button A pada layer Tombol di Frame 1, klik kanan pilih Actions seperti
tadi. Kita isikan dengan code seperti di bawah ini:




                                        Figure 21 - ActionScript 2.0

                                                                                             6
Lakukan hal yang sama untuk Button B dan C. Tapi perhatikan terlebih dahulu, pada Button
B dan C, parameter yang dimasukan adalah 3, itu artinya jawaban B dan C adalah salah,
jawaban A adalah benar.




                                  Figure 22 - ActionScript 2.0




Selanjutnya kita test movie, maka quiz sederhana sudah kita buat.
Ketika user meng-klik jawaban A akan tampil respon jawaban anda benar. Sebaliknya jika
user memilih B atau C akan tampil respon jawaban salah.

Setelah berhasil membuat quiz ini kita akan bisa mengembangkan untuk membuat quiz
dengan tipe yang sama dan tentunya dengan soal yang lebih banyak serta interaksi yang
lebih kompleks.




                                                                                           7

More Related Content

What's hot

Cara membuat latihan pilihan ganda di macromedia flash
Cara membuat latihan pilihan ganda di macromedia flashCara membuat latihan pilihan ganda di macromedia flash
Cara membuat latihan pilihan ganda di macromedia flash
Vidi Al Imami
 
Membuat storyboard
Membuat storyboardMembuat storyboard
Membuat storyboard
Sayugo
 
Pertemuan 9 preferences dan menu
Pertemuan 9 preferences dan menuPertemuan 9 preferences dan menu
Pertemuan 9 preferences dan menu
heriakj
 
Pertemuan 8 google map
Pertemuan 8 google mapPertemuan 8 google map
Pertemuan 8 google map
heriakj
 

What's hot (20)

Cara membuat latihan pilihan ganda di macromedia flash
Cara membuat latihan pilihan ganda di macromedia flashCara membuat latihan pilihan ganda di macromedia flash
Cara membuat latihan pilihan ganda di macromedia flash
 
3. interface scratch
3. interface scratch3. interface scratch
3. interface scratch
 
Membuat storyboard
Membuat storyboardMembuat storyboard
Membuat storyboard
 
Animasi tradisional
Animasi tradisionalAnimasi tradisional
Animasi tradisional
 
12 prinsip animasi
12 prinsip animasi12 prinsip animasi
12 prinsip animasi
 
Animasi 2D dan 3D KD : Memahami prinsip dasar pembuatan animasi 2 dimensi (ve...
Animasi 2D dan 3D KD : Memahami prinsip dasar pembuatan animasi 2 dimensi (ve...Animasi 2D dan 3D KD : Memahami prinsip dasar pembuatan animasi 2 dimensi (ve...
Animasi 2D dan 3D KD : Memahami prinsip dasar pembuatan animasi 2 dimensi (ve...
 
Materi Pelatihan_Steganografi Metode LSB
Materi Pelatihan_Steganografi Metode LSBMateri Pelatihan_Steganografi Metode LSB
Materi Pelatihan_Steganografi Metode LSB
 
5. motion scartch
5. motion scartch5. motion scartch
5. motion scartch
 
Otomatisasi sistem perparkiran
Otomatisasi sistem perparkiranOtomatisasi sistem perparkiran
Otomatisasi sistem perparkiran
 
Laporan pengolahan citra digital
Laporan pengolahan citra digitalLaporan pengolahan citra digital
Laporan pengolahan citra digital
 
Makalah ham
Makalah hamMakalah ham
Makalah ham
 
Pertemuan 9 preferences dan menu
Pertemuan 9 preferences dan menuPertemuan 9 preferences dan menu
Pertemuan 9 preferences dan menu
 
PRESENTACIÓN DE LA ASOCIACIÓN DE MUJERES AFGANAS EN ESPAÑA (AMAE)
PRESENTACIÓN DE LA ASOCIACIÓN DE MUJERES AFGANAS EN ESPAÑA (AMAE)PRESENTACIÓN DE LA ASOCIACIÓN DE MUJERES AFGANAS EN ESPAÑA (AMAE)
PRESENTACIÓN DE LA ASOCIACIÓN DE MUJERES AFGANAS EN ESPAÑA (AMAE)
 
Modul praktikum pbo java swing
Modul praktikum pbo java swingModul praktikum pbo java swing
Modul praktikum pbo java swing
 
Pertemuan 7 camera
Pertemuan 7 cameraPertemuan 7 camera
Pertemuan 7 camera
 
Unity遊戲設計- 應用Sprite物件
Unity遊戲設計- 應用Sprite物件Unity遊戲設計- 應用Sprite物件
Unity遊戲設計- 應用Sprite物件
 
Presentasi TIK kelas IX Bab 1
Presentasi TIK kelas IX Bab 1Presentasi TIK kelas IX Bab 1
Presentasi TIK kelas IX Bab 1
 
Soal UAS Pemrograman Berorientasi Objek kelas 12 SMK semester ganjil tahun aj...
Soal UAS Pemrograman Berorientasi Objek kelas 12 SMK semester ganjil tahun aj...Soal UAS Pemrograman Berorientasi Objek kelas 12 SMK semester ganjil tahun aj...
Soal UAS Pemrograman Berorientasi Objek kelas 12 SMK semester ganjil tahun aj...
 
Mengenal Sistem Operasi Windows
Mengenal Sistem Operasi WindowsMengenal Sistem Operasi Windows
Mengenal Sistem Operasi Windows
 
Pertemuan 8 google map
Pertemuan 8 google mapPertemuan 8 google map
Pertemuan 8 google map
 

Similar to Membuat Quiz dengan Flash

Belajar macromedia flash 8 bagi pemula
Belajar macromedia flash 8 bagi pemulaBelajar macromedia flash 8 bagi pemula
Belajar macromedia flash 8 bagi pemula
Izza Anshory
 
Membuat game j2 me nuril
Membuat game j2 me nurilMembuat game j2 me nuril
Membuat game j2 me nuril
Norel_Brew
 
Tutorial membuat-kuis-flash
Tutorial membuat-kuis-flashTutorial membuat-kuis-flash
Tutorial membuat-kuis-flash
bass91
 
Sulhan Animasidgimageready
Sulhan AnimasidgimagereadySulhan Animasidgimageready
Sulhan Animasidgimageready
Raden Alif
 
Three Days Making Android Game (with Flash) DAY 2
Three Days Making Android Game (with Flash) DAY 2Three Days Making Android Game (with Flash) DAY 2
Three Days Making Android Game (with Flash) DAY 2
Aryo Prakoso
 
Modul pembelajaran dst tmk thn 2 sk
Modul pembelajaran dst tmk thn 2 skModul pembelajaran dst tmk thn 2 sk
Modul pembelajaran dst tmk thn 2 sk
wmzuri
 
Modul Pembelajaran DST TMK Tahun 2
Modul Pembelajaran DST TMK Tahun 2Modul Pembelajaran DST TMK Tahun 2
Modul Pembelajaran DST TMK Tahun 2
Lieya Rayyan
 
Modul Pembelajaran TMK Tahun 2
Modul Pembelajaran TMK Tahun 2Modul Pembelajaran TMK Tahun 2
Modul Pembelajaran TMK Tahun 2
inazaliahmad
 
Teks Berjalan di Aplikasi Dekstop dengan VB.Net
Teks Berjalan di Aplikasi Dekstop dengan VB.NetTeks Berjalan di Aplikasi Dekstop dengan VB.Net
Teks Berjalan di Aplikasi Dekstop dengan VB.Net
Nazær Upiin
 

Similar to Membuat Quiz dengan Flash (20)

Laporan praktikum modul 4
Laporan praktikum modul 4Laporan praktikum modul 4
Laporan praktikum modul 4
 
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdfANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
 
Modul2
Modul2Modul2
Modul2
 
Belajar macromedia flash 8 bagi pemula
Belajar macromedia flash 8 bagi pemulaBelajar macromedia flash 8 bagi pemula
Belajar macromedia flash 8 bagi pemula
 
Membuat game j2 me nuril
Membuat game j2 me nurilMembuat game j2 me nuril
Membuat game j2 me nuril
 
Tutorial membuat-kuis-flash
Tutorial membuat-kuis-flashTutorial membuat-kuis-flash
Tutorial membuat-kuis-flash
 
Modul 5 pengembangan aplikasi mobile learning menggunakan intel xdk sesi 2
Modul 5   pengembangan aplikasi mobile learning menggunakan intel xdk sesi 2Modul 5   pengembangan aplikasi mobile learning menggunakan intel xdk sesi 2
Modul 5 pengembangan aplikasi mobile learning menggunakan intel xdk sesi 2
 
Sulhan Animasidgimageready
Sulhan AnimasidgimagereadySulhan Animasidgimageready
Sulhan Animasidgimageready
 
Laporan pratikum v mulmet
Laporan pratikum v mulmetLaporan pratikum v mulmet
Laporan pratikum v mulmet
 
8
88
8
 
Three Days Making Android Game (with Flash) DAY 2
Three Days Making Android Game (with Flash) DAY 2Three Days Making Android Game (with Flash) DAY 2
Three Days Making Android Game (with Flash) DAY 2
 
Modul pembelajaran dst tmk thn 2 sk
Modul pembelajaran dst tmk thn 2 skModul pembelajaran dst tmk thn 2 sk
Modul pembelajaran dst tmk thn 2 sk
 
Modul Pembelajaran DST TMK Tahun 2
Modul Pembelajaran DST TMK Tahun 2Modul Pembelajaran DST TMK Tahun 2
Modul Pembelajaran DST TMK Tahun 2
 
Modul Pembelajaran TMK Tahun 2
Modul Pembelajaran TMK Tahun 2Modul Pembelajaran TMK Tahun 2
Modul Pembelajaran TMK Tahun 2
 
Membuat kuis interaktif sederhana
Membuat kuis interaktif sederhanaMembuat kuis interaktif sederhana
Membuat kuis interaktif sederhana
 
Laporan praktikum multimedia_4-4
Laporan praktikum multimedia_4-4Laporan praktikum multimedia_4-4
Laporan praktikum multimedia_4-4
 
Teks Berjalan di Aplikasi Dekstop dengan VB.Net
Teks Berjalan di Aplikasi Dekstop dengan VB.NetTeks Berjalan di Aplikasi Dekstop dengan VB.Net
Teks Berjalan di Aplikasi Dekstop dengan VB.Net
 
Laporan praktikum multimedia 5 5
Laporan praktikum multimedia 5 5Laporan praktikum multimedia 5 5
Laporan praktikum multimedia 5 5
 
Merubah foto jadi sebuah slide puzzle
Merubah foto jadi sebuah slide puzzleMerubah foto jadi sebuah slide puzzle
Merubah foto jadi sebuah slide puzzle
 
Tutorial cara menjadi master desain grafis tanpa sekolah dan kuliah
Tutorial cara menjadi master desain grafis tanpa sekolah dan kuliahTutorial cara menjadi master desain grafis tanpa sekolah dan kuliah
Tutorial cara menjadi master desain grafis tanpa sekolah dan kuliah
 

Membuat Quiz dengan Flash

  • 1. Membuat Quiz Sederhana dengan ActionScript 2.0 Oleh: Gilang Abdul Aziz Setelah kita selesai membuat skenario, selanjutnya pada akhir skenario kita akan menampilkan quiz. Pertama kita membuat Scene baru terlebih dahulu. Kita berinama Scene tersebut ‘Quiz’ Figure 1 - Insert new Scene Setelah Scene Quiz dibuat, selanjutnya kita persiapkan layer terlebih dahulu. Itu akan memudahkan kita dalam pembuatan objek-objek yang nanti akan kita pakai. Kita buat 4 layer, terdiri dari: Figure 2 - Prepare Layers Selanjutnya pada layer Pertanyaan Frame 1, kita isi dengan sebuah teks Figure 3 - Insert Text Kemudian pada layer Jawaban Frame 1, kita isi dengan 3 buah teks. Perhatikan pula jarak antara tiap jawaban jangan terlalu dekat. 1
  • 2. Figure 4 - Insert Text Selanjutnya kita akan membuat tombol untuk di klik saat memilih jawaban. Ada 3 buah tombol. Posisi tiap tombol disesuaikan dengan pilihan jawaban nya. Pada layer Tombol, Frame 1, Pertama-tama kita buat sebuah box, Figure 5 - Insert Box Selanjutnya pada box tersebut kita buat sebuah text sesuai dengan pilihan. Figure 6 - Insert Text above the Box Copy/paste box dan text yang sudah kita buat tersebut ke tiap pilihan jawaban. Tentunya jangan lupa kita ubah teks nya, sesuaikan dengan pilihan jawaban nya. Figure 7 - Clone the Object 2
  • 3. Setelah ketiga objek tersebut siap, sekarang kita akan mengubah ketiga objek tersebut menjadi tombol yang bisa diklik. Kita seleksi dulu objek box beserta teks nya. Figure 8 - Select the Object Kemudian klik kanan pada objek yang sudah kita seleksi tersebut, pilih Convert to Symbol. Figure 9 - Convert to Symbol Selanjutnya akan keluar dialog, pada dialog tersebut kita diharuskan untuk mengisi nama symbol dan jenis symbol apa yang akan kita buat. Kita pilih Button dan isi namanya dengan ‘A’ Figure 10 - Convert to Symbol Jika sudah berhasil, maka pada library akan bertambah satu symbol baru bertipe button. Seperti di bawah ini. 3
  • 4. Figure 11 - Library Selanjutnya adalah kita lakukan ulang untuk tiap objek yang tadi sudah kita buat untuk pilihan B dan C. Jangan lupa box dan teksnya harus terseleksi sempurna. Jika sudah, maka pada library akan ada 3 buah symbol bertipe tombol seperti di bawah ini. Figure 12 - Library Final Persiapan quiz sudah hampir selesai, sekarang kita akan membuat respon yang terjadi jika user manjawab. Benar atau salah. Jika benar, playhead akan berpindah ke Frame 2. Jika salah akan berpindah ke Frame 3. Selanjutnya pada Layer Respon pada Frame 2, kita insert blank keyframe. Figure 13 - Insert Keyframe Lakukan hal yang sama pada frame 3. Sehingga pada layer respon akan tersedia pada sampai frame 3 seperti di bawah ini. 4
  • 5. Figure 14 - Keyframe Kita simpan playhead pada Frame 2 pada layer Respon, kita isi dengan teks: Figure 15 - Insert Text (True) Pada Frame 3 kita isi dengan teks: Figure 16 - Insert Text (False) Semua persiapan sudah beres, saatnya kita akan melakukan coding. Memberikan ActionScript 2.0 pada objek-objek yang akan berinteraksi. Sebelumnya kita buat dulu sebuah layer baru bernama ‘Aksi’. Simpan pada posisi paling atas, untuk memudahkan. Figure 17 - Insert new Layer Kita pilih layer Aksi, pada Frame 1, klik kanan, kemudian pilih Actions: 5
  • 6. Figure 18 - To The Actions Nanti akan tampil Panel Actions, seperti ini Figure 19 - Actions Panel in Frame 1 Kita isi dengan code berikut ini: Figure 20 - ActionScript 2.0 Selanjutnya kita pilih Button A pada layer Tombol di Frame 1, klik kanan pilih Actions seperti tadi. Kita isikan dengan code seperti di bawah ini: Figure 21 - ActionScript 2.0 6
  • 7. Lakukan hal yang sama untuk Button B dan C. Tapi perhatikan terlebih dahulu, pada Button B dan C, parameter yang dimasukan adalah 3, itu artinya jawaban B dan C adalah salah, jawaban A adalah benar. Figure 22 - ActionScript 2.0 Selanjutnya kita test movie, maka quiz sederhana sudah kita buat. Ketika user meng-klik jawaban A akan tampil respon jawaban anda benar. Sebaliknya jika user memilih B atau C akan tampil respon jawaban salah. Setelah berhasil membuat quiz ini kita akan bisa mengembangkan untuk membuat quiz dengan tipe yang sama dan tentunya dengan soal yang lebih banyak serta interaksi yang lebih kompleks. 7