Pembuatan Aplikasi untuk Masing-Masing Bahan Pelajaran.

Gambar 3.9 Rancangan halaman kuis

3.3 Pembuatan Aplikasi untuk Masing-Masing Bahan Pelajaran.

Berikut adalah langkah-langkah pembuatan dari aplikasi pembelajaran bahasa Inggris menggunakan Macromedia Flash Professional 8 : 1. Pembuatan dokumen flash baru a. Buka program Macromedia Flash 8.0 b. Pilih flash document pada bagian create new c. Pada panel properties atur warna background menjadi warna putih fff dan ukuran 800 pixel X 600 pixel. 2. Pembuatan dan pengaturan layer pada scene. Universitas Sumatera Utara a. Tambahkan 4 layer baru sehingga di scene terdapat 5 layer. b. Ganti nama masing-masing layer dari atas ke bawah yaitu action, kursor, tgl, menu dan lesson. 3. Memasukkan gambar dan suara ke dalam library. a. Pilih menu File Import Import to Library … b. Kemudian pilih dan seleksi gambar dan suara yang akan digunakan dalam aplikasi. c. Buka library dengan menekan tombol ctrl+L. d. Kemudian pilih simbol yang sudah ada di library untuk diletakkan ke scene utama.

4. Pembuatan halaman selamat datang.Pilih Insert New Symbol.

a. Pilih Type Movie Clip dengan nama „mv_opening‟. b. Aktifkan keyframe pada frame 1 Layer 1. Kemudian Insert Frame di frame 35. Buat background pada layer 1 dengan Rectangle Tool berukuran 800x600. Kemudian Import gambar animasi owl.jpg ke stage layer 1. Universitas Sumatera Utara c. Kemudian tambahkan layer baru dengan nama layer 2. Insert Keyframe di frame 35 dan buat kalimat “Fun Learning in English” dengan menggunakan Text Tool . d. Kemudian copy Text tersebut ke frame 1. Klik kanan pada Keyframe di frame

1, lalu pilih Create motion tween.

e. Aktifkan keyframe di frame 35 layer 2, tekan F9. Lalu ketikkan ActionScript untuk memberhentikan movie agar tidak terjadi perulangan saat dijalankan. Stop; g. Kemudian drag „mv_opening‟ dari Library ke scene 1 pada layer lesson, frame 1. 5. Pembuatan halaman belajar abjad a. Pilih Insert New Symbol. Pilih Type Movie Clip dan beri nama „mv_abjad‟. b. Ganti nama layer 1 dengan background. Kemudian gambar background dengan menggunakan Rectangle Tool berukuran 800x600. Kemudian Insert Frame di frame 780. c. Aktifkan keyframe di frame 780. Tekan tombol F9. Lalu ketikkan ActionScript seperti berikut : stop; Universitas Sumatera Utara d. Import file suara untuk pengejaan abjad. Dengan cara pilih File Import Import to Library. Kemudian pilih file ABC song.mp3. Lalu OK. e. Cari file suara tersebut di dalam Panel Library. Kemudian klik kanan, pilih Linkage . f. Aktifkan Export for ActionScript dan Export at first frame. Ketikkan „snd_alphabet‟ pada identifier. Klik OK. g. Tambahkan layer baru, lalu ganti nama layer dengan „song‟. Insert keyframe di frame 29. Tekan tombol F9, lau ketikkan ActionScript seperti berikut ini : MySound = new Sound; MySound.attachSound“snd_alphabeth”; MySound.stop; MySound.start; g. Tambahkan layer baru, ganti nama layer dengan „A‟. Letakkan keyframe di frame 137 sesuai dengan suara abjad yang keluar. Gunakan Text Tool untuk menuliskan abjad. Lakukan hal tersebut sampai dengan Z. h. Kembali ke scene 1. Aktifkan keyframe 2 pada layer lesson. Kemudian drag mv_abjad dari Library menuju ke frame 2 tersebut. 6. Pembuatan halaman belajar angka a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_number. Universitas Sumatera Utara b. Plih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1 sampai 1193. Lalu gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 1193. Tekan tombol F9, lalu ketikkan ActionScript sebagai berikut : stop; d. Import file suara untuk menghitung angka. Dengan cara pilih File Import Import to Library . Kemudian pilih file „spell_number.mp3‟. Lalu OK. e. Cari file suara tersebut di dalam Panel Library. Kemudian klik kanan, pilih Linkage. f. Aktifkan Export for ActionScript dan Export at first frame. Ketikkan snd_number pada identifier. Klik OK. g. Tambahkan layer baru, lalu ganti nama layer dengan „song‟. Insert keyframe di frame 28. Tekan tombol F9, lau ketikkan ActionScript seperti berikut ini : MySound = new Sound; MySound.attachSound“snd_number”; MySound.stop; MySound.start; Universitas Sumatera Utara h. Tambahkan layer baru, ganti nama layer dengan „count‟. i. Letakkan keyframe di frame sesuai dengan suara angka yang keluar. Gunakan Text Tool untuk menuliskan angka tersebut. Lakukan hal tersebut sampai dengan angka 20. j. Kembali ke scene 1. Aktifkan keyframe 3 pada layer lesson. Kemudian drag movie_number dari Library menuju ke frame 3 tersebut. 7. Pembuatan halaman belajar buah a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_fruit. b. Pilih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1 sampai 30. Lalu gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 30. Tekan tombol F9, lalu ketikkan ActionScript sebagai berikut : stop; d. Buat masing-masing buah sebagai tombol. Pilih Insert New Symbol. Ketikkan btn_apple pada kotak name. dan pilih Button pada Type. e. Aktifkan keyframe Up. Gambarkan buah apel pada frame Up. Kemudian Insert Frame hingga frame Hit. Buat efek pada masing-masing frame. Universitas Sumatera Utara f. Import file suara untuk menyebutkan buah tersebut. Dengan cara pilih File Import Import to Library . g. Kemudian letakkan suara tersebut ke frame Down pada tombol. Agar suara tersebut keluar saat tombol ditekan. h. Kembali ke scene 1. Aktifkan keyframe 4 pada layer lesson. Kemudian drag movie_fruit dari Library menuju ke frame 4 tersebut. 8. Pembuatan halaman belajar angka a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_animal. b. Pilih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1 sampai 1163. Gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 1163. Lalu ketikkan ActionScript sebagai berikut : stop; d. Import file suara untuk menyebutkan nama hewan. Dengan cara pilih File Import Import to Library . Kemudian pilih file animal.mp3. Lalu OK. e. Cari file suara tersebut di dalam Panel Library. Kemudian klik kanan, pilih Linkage . Universitas Sumatera Utara f. Aktifkan Export for ActionScript dan Export at first frame. Ketikkan „snd_animals‟ pada identifier. Klik OK. g. Tambahkan layer baru, lalu ganti nama layer dengan „song‟. Insert keyframe di frame 6. Tekan tombol F9, lau ketikkan ActionScript seperti berikut ini : MySound = new Sound; MySound.attachSound “snd_animals”; MySound . stop; MySound.start; h. Tambahkan layer baru, ganti nama layer dengan „animal‟. i. Letakkan keyframe di frame sesuai dengan suara yang keluar. Gunakan Text Tool untuk menuliskan nama hewan tersebut tersebut. Lakukan hal tersebut sampai dengan pengucapan selesai. j. Kembali ke scene 1. Aktifkan keyframe 5 pada layer lesson. Kemudian drag movie_animal dari Library menuju ke frame 5 tersebut. 9. Pembuatan halaman belajar benda a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_things. Universitas Sumatera Utara b. Pilih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1 sampai 1012. Lalu gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 1012. Tekan tombol F9, lalu ketikkan ActionScript sebagai berikut : stop; d. Import file suara untuk menyebutkan benda. Dengan cara pilih File Import Import to Library . Kemudian pilih file snd_things.mp3. Lalu OK. e. Cari file suara tersebut di dalam Panel Library. Kemudian klik kanan, pilih Linkage . f. Aktifkan Export for ActionScript dan Export at first frame. Ketikkan snd_things pada identifier. Klik OK. g. Tambahkan layer baru, lalu ganti nama layer dengan „song‟. Insert keyframe di frame 1. Tekan tombol F9, lau ketikkan ActionScript seperti berikut ini : MySound = new Sound; MySound.attachSound “snd_things”; MySound . stop; MySound.start; h. Tambahkan layer baru, ganti nama layer dengan „thing‟. Universitas Sumatera Utara i. Letakkan keyframe di frame sesuai dengan suara pengucapan yang keluar. Gunakan Text Tool untuk menuliskan nama benda tersebut. Lakukan hal tersebut sampai dengan pengucapan selesai. j. Kembali ke scene 1. Aktifkan keyframe 6 pada layer lesson. Kemudian drag movie_things dari Library menuju ke frame 6 tersebut. 10. Pembuatan halaman belajar bagian tubuh a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_body. b. Pilih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1 sampai 30. Lalu gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 30. Tekan tombol F9, lalu ketikkan ActionScript sebagai berikut : stop; d. Buat tombol baru untuk bagian tubuh kepala, badan dan kaki. Dengan cara Insert New Symbol . Pilih Type Button dengan nama btn_head. Aktifkan frame Up, kemudian masukkan gambar kepala. Lakukan sampai bagian kaki. e. Kembali ke scene 1. Aktifkan keyframe 7 pada layer lesson. Kemudian drag movie_body dari Library menuju ke frame 7 tersebut. Universitas Sumatera Utara f. Letakkan tombol btn_head, btn_body, btn_leg pada layer lesson frame 7. g. Select btn_head, kemudian tekan F9. Ketikkan ActionScript seperti berikut : onrelease{ gotoAndStop8; } 11. Pembuatan halaman belajar bagian tubuh kepala a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_bodyhead. b. Pilih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1. Lalu gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 1. Tekan tombol F9, lalu ketikkan ActionScript sebagai berikut : stop; d. Buat masing-masing bagian tubuh sebagai movie clip. Pilih Insert New Symbol. Ketikkan movie_forehead pada kotak name. dan pilih Movie Clip pada Type. e. Masukkan btn_part di layer 1 frame 1. Kemudian Insert Keyframe di frame 2. Gunakan Text Tool untuk menuliskan forehead. Universitas Sumatera Utara f. Masukkan layer baru. Aktifkan frame 1, kemudian tekan tombol F9. Lalu ketikkan ActionScript seperti berikut : stop; g. Import file suara untuk menyebutkan bagian tubuh tersebut. Dengan cara pilih File Import Import to Library . h. Kemudian letakkan suara tersebut ke frame 2 pada layer 1. Agar suara tersebut keluar saat tombol ditekan. i. Kembali ke movie_bodyhead. Aktifkan keyframe 1 pada layer 2. Kemudian drag movie_forehead dari Library menuju ke frame 2 tersebut. Letakkan sesuai dengan namanya. j. Lakukan butir i sampai dengan bagian tubuh yang terakhir. k. Kembali scene 1. Aktifkan keyframe 8. Letakkan movie_bodyhead di layer lesson frame 8. 12. Pembuatan halaman about a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian beri nama movie_about. Universitas Sumatera Utara b. Pilih layer 1 lalu ganti nama layer dengan background. Aktifkan frame 1 sampai 25. Lalu gambarkan background dengan Rectangle Tool dengan ukuran 800x600. c. Aktifkan keyframe di frame 25. Tekan tombol F9, lalu ketikkan ActionScript sebagai berikut : stop; d. Import file musik untuk melengkapi halaman about. Dengan cara pilih File Import Import to Library . Kemudian pilih file about.mp3. Lalu OK. e. Cari file suara tersebut di dalam Panel Library. Kemudian klik kanan, pilih Linkage. f. Aktifkan Export for ActionScript dan Export at first frame. Ketikkan snd_things pada identifier. Klik OK. g. Tambahkan layer baru, lalu ganti nama layer dengan „song‟. Insert keyframe di frame 1. Tekan tombol F9, lau ketikkan ActionScript seperti berikut ini : MySound = new Sound; MySound.attachSound “snd_about”; MySound . stop; MySound.start; Universitas Sumatera Utara h. Tambahkan layer baru. Gunakan Text Tool untuk menuliskan kalimat. Kenudian klik kanan pada keyframe 1 layer 2. Create Motion Tween. i. Tambahkan layer baru. Masukkan gambar ke dalam stage. Kemudian klik kanan pada keyframe 1 layer . Create Motion Tween. j. Kembali ke scene 1. Aktifkan keyframe 11 pada layer lesson. Kemudian drag movie_things dari Library menuju ke frame 11 tersebut. 13. Pembuatan halaman kuis a. Pilih Insert New Symbol. Pilih Movie Clip pada Type. Kemudian ketikkan movie_quiz pada kotak nama. b. Aktifkan frame 1 sampai 30 di layer background. Buat background dengan menggunakan Rectangle Tool dengan ukuran 800x600. Aktifkan keyframe 1. Kemudian tekan tombol F9. Ketikkan script berikut : stop; c. Tambahkan layer baru dengan nama „pertanyaan‟. d. Aktifkan keyframe 1 pada layer pertanyaan. Buat kotak nama dengan Input Text aktifkan show border around text. Pada Var, ketik „input‟. e. Klik kanan frame 2 layer pertanyaan, pilih Insert Keyframe. Buat soal beserta pilihan jawaban. Universitas Sumatera Utara f. Klik frame 2 layer pertanyaan, kemudian tekan F6 pada keyboard untuk meng- copy frame sampai dengan frame 6. Klik frame 3, ganti soal dan jawabannya. Demikian seterusnya sampai dengan soal nomor 5. g. Klik frame 1 layer pertanyaan. Buat tombol untuk memulai kuis. Lalu ketikkan ActionScript sebagai berikut : Onrelease{ gotoAndStop2; } h. Kemudian buat button jawaban dengan cara pilih Insert New Symbol. Pilih Type button dengan nama btn_jawab. i. Setelah selesai, tambahkan layer baru dengan nama „jawab‟. Lalu letakkan button jawab di setiap pertanyaan dari frame 2 sampai frame 6 layer „jawab‟. Tuliskan pilihan jawaban yang sesuai. j. Seleksi button, kemudian ketikkan „answer_a‟ pada kotak Instance name pada kotak Properties. Lakukan hal yang sama untuk button b,c dan d. k. Buat layer baru dengan nama action. Klik frame 1. Kemudian tekan F7 sebanyak 6 kali. Kembali ke frame 2. Tekan tombol F9 untuk menampilkan Panel Action . Kemudian ketikkan ActionScript seperti berikut : stop; nilai=0; Universitas Sumatera Utara onEnterFrame = function { skor = +nilai; }; answer_a.onRelease = function { nextFrame; }; answer_b.onRelease = function { nextFrame; }; answer_c.onRelease = function { nilai+=20; nextFrame; }; answer_d.onRelease = function { nextFrame; }; l. Ketikkan ActionScript tersebut di layer action semua kuis. Letakkan nilai sesuai dengan jawaban yang benar. m. Kemudian ketikan ActionScript berikut dalam keyframe 7 layer action untuk menghitung nilai yang didapat. Stop; onEnterFrame = function { ifskor = 60 { gotoAndStop8; } Ifskor 60 { gotoAndStop9; } }; n. Selanjutnya, tambahkan layer baru dengan nama hasil. Masukkan keyframe di frame 8. Masukkan Dynamic Text, kem udian ketikkan „nama‟ ada Var. Universitas Sumatera Utara o. Masukkan Dynamic Text untuk nilai, kemudian ketikkan ‟skor‟ pada Var. p. Pilih layer Action, frame 8. Ketikkan ActionScript sebagai berikut : onEnterFrame = function { nama = +input; skor = +nilai; } q. Kemudian buat desain yang sama unutk menampilkan nilai jelek. Masukkan keyframe di frame 9. Masukkan Dynamic Text , kemudian ketikkan „nama‟ ada Var. r. Masukkan Dynamic Text untuk nilai, kemudian ketikkan ‟skor‟ pada Var. s. Pilih layer Action, frame 9. Ketikkan ActionScript sebagai berikut : onEnterFrame = function { nama = +input; skor = +nilai; } Universitas Sumatera Utara BAB 4 IMPLEMENTASI SISTEM

4.1 Hasil Aplikasi