Life is Learn

Sabtu, 24 Juni 2017

Animasi Tembak Balon

Games yang seru dan simple bisa dibuat melaluli software flash. Langkah-langkah di bawah ini cukup rumit dan memerlukan ketelitian step by step nya. berikut langkahnya...

1. Buatlah sebuah flash document dengan ukuran 400×400 berwarna putih.

2. Tekan tombol Insert Layer pada timeline sebanyak 2 kali sehingga pada timeline terdapat 3 buah layer.

3. Ubah nama-nama layer menjadi Label, AS, Game dengan posisi seperti gambar di bawah ini :

4. Tahan tombol Ctrl pada keyboard kemudian tekan frame 1, 3, 8, 14 pada semua layer. Jika sudah lepaskan tombol Ctrl lalu tekan F7 maka frame-frame yang anda seleksi tadi menjadi sebuah blank keyframe.

5. Seleksi frame 20 pada semua layer kemudian tekan F5

6. Klik frame 1 layer Label kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan load dalam kotak frame label.

7. Klik frame 3 layer Label kemudian pada panel properties masukkan menu dalam kotak frame label.

8. Klik frame 8 layer Label kemudian pada panel properties masukkan game dalam kotak frame label.

9. Klik frame 14 layer Label kemudian pada panel properties masukkan gameover dalam kotak. Sehingga pada timeline akan tampak seperti di bawah ini :

10. Klik frame 1 layer Game. Buatlah sebuah objek kursor seperti gambar di bawah ini :

11. Buatlah sebuah lingkaran kecil tepat di tengah-tengah objek kursor yang baru di buat tadi sehingga akan berbentuk seperti gambar di bawah ini :

12. Seleksi hanya lingkaran kecil tadi lalu tekan F8. Pada panel yang muncul masukkan titik_kursor sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

13. Seleksi movie clip titik_kursor dan objek kursor lalu tekan F8. Pada panel yang muncul masukkan kursor_mc sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

14. Seleksi movie clip kursor_mc dan pada panel properties masukkan kursor sebagai Instance name.

15. Klik frame 3 layer Game dan buatlah sebuah persegi dengan panjang 400 dan lebar 400. Berikan warna radial dengan perpaduan warna #33FF99 dan #336633 pada persegi tersebut. Letakkan persegi tersebut di tengah-tengah stage.

16. buatlah sebuah static text bertuliskan Tembak Balon. Ukuran, warna, dan jenis hurufnya sesuai keinginan anda, kemudian letakkan di stage bagian atas.

17. Buatlah 3 buah balon dengan menggunakan bantuan oval tool dan line tool. Letakkan ketiga buah balon tadi pada stage bagian tengah.

18. Buatlah sebuah static text dan berikan tulisan Tembak setiap balon yang muncul sebanyak mungkin dengan cara menekan mouse sebelah kiri. Letakkan static text tersebut pada stage bagian bawah.

19. Buatlah sebuah static text dengan warna putih dan berikan tulisan MAIN. Buatlah sebuah persegi panjang dengan panjang dan lebar yang sama dengan panjang dan lebar static text bertuliskan MAIN.

20. Seleksi static text bertuliskan MAIN dan persegi panjang lalu tekan F8. Pada panel yang muncul masukkan main_btn sebagai name dan button sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

21. Seleksi main_btn di stage dan pada panel properties masukkan main_btn sebagai instance name. Klik kanan movie clip main_btn dan tekan Edit.

22. Seleksi frame Over dan Down lalu tekan F6. Ubah warna huruf static text pada frame over menjadi berwarna kuning dan juga ubah warna static text pada frame Down menjadi kuning tua. Tekan Ctrl+E untuk kembali ke stage scene 1

23. Letakkan main_btn di stage bagian bawah sehingga pada frame 3 layer Game akan tampak seperti gambar di bawah ini :

24. Klik frame 8 layer Game dan buatlah sebuah persegi dengan panjang 400 dan lebar 400. Berikan warna radial dengan perpaduan warna #33FF99 dan #336633 pada persegi tersebut. Letakkan persegi tersebut di di tengah-tengah stage.

25. Buatlah 3 buah static text, masing-masing bertuliskan Balon : , Waktu :

, :

26. Buatlah 3 buah dynamic text dengan masing-masing Var pada panel properties adalah score , minute , second.

27. Letakkan seluruh objek di frame 8 layer Game seperti gambar di bawah ini :

28. Klik frame 14 layer Game dan buatlah sebuah persegi dengan panjang 400 dan lebar 400. Berikan warna radial dengan perpaduan warna #33FF99 dan #336633 pada persegi tersebut. Letakkan persegi tersebut di tengah-tengah stage.

29. Buatlah 3 buah static text masing-masing bertuliskan Waktu Habis , Anda menembak balon sebanyak , buah. Buatlah sebuah dynamic text dan pada panel properties masukkan score sebagai Var.

30. Buatlah sebuah static text dengan warna huruf putih dan berikan tulisan MAIN LAGI. Buatlah sebuah persegi panjang dengan panjang dan lebar yang sama dengan panjang dan lebar static text bertuliskan MAIN LAGI.

31. Seleksi static text bertuliskan MAIN LAGI dan persegi panjang lalu tekan F8. Pada panel yang muncul masukkan mainlagi_btn sebagai name dan button sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

32. Seleksi mainlagi_btn di stage dan pada panel properties masukkan mainlagi_btn sebagai instance name. Klik kanan movie clip mainlagi_btn dan tekan Edit.

33. Seleksi frame Over dan Down lalu tekan F6. Ubah warna huruf static text pada frame over menjadi berwarna kuning dan juga ubah warna static text pada frame Down menjadi kuning tua. Tekan Ctrl+E untuk kembali ke stage scene 1

34. Letakkan seluruh objek di frame 14 layer Game seperti gambar di bawah ini :

35. Klik frame 1 layer AS dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

36. Klik frame 3 layer AS dan pada panel actions masukkan script berikut :

37. Klik frame 8 layer AS dan pada panel actions masukkan script berikut :

38. Klik frame 14 layer AS dan pada panel actions masukkan script berikut :

39. Klik frame 8 layer Game dan buatlah sebuah balon seperti gambar di bawah ini. Seleksi kepala balon tersebut dan tekan F8. Pada panel yang muncul masukkan kepala_balon sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

40. Seleksi movie clip kepala_balon dan pada panel properties masukkan kepala_balon sebagai instance name.

42. Gambarlah sebuah garis pada bagian bawah kepala balon sehingga akan berbentuk seperti ini :

43. Seleksi kepala balon beserta garisnya lalu tekan F8. Pada panel yang muncul masukkan balon_mc sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

44. Hapus movie clip balon_mc dari stage kemudian tekan Ctrl+L. Pada panel library yang muncul, klik kanan movie clip balon_mc dan pilih Linkage. Pada panel yang muncul berikan tanda contreng/centang pada Export for ActionScript dan masukkan balon sebagai Identifier lalu tekan ok.

45. Tekan Ctrl+Enter untuk melihat hasilnya.

Good Luck! ^.^

Animasi Pilihan Ganda

Kelebiha lain dalam menggunakan flash adalah dapat membuat pilihan ganda yang menarik. Cara membuat pilihan ganda di flash cukup rumit dan memerlukan ketelitian. Berikut langkahnya...

1. 1. Buatlah 5 buah Static Text dan masing-masing diberi tulisan berikut:

Tempat sarapan tutorial flash adalah …

a. Warung Makan

b. Warung Tegal

c. Warung Flash

d. Warung Pojok

3. Pastikan anda tidak menyeleksi satu objek pun di stage, lalu tekan Ctrl+F8 maka kotak dialog Create new Symbol akan muncul. Berikan invs_btn sebagai Name dan ubah Type-nya menjadi Button lalu tekan OK

4. Anda akan masuk ke stage invs_btn. Klik frame Hit yang terletak di Timeline lalu tekan F7. Gambarlah sebuah persegi panjang dengan panjang dan lebar yang cukup untuk menutupi jawaban abcd di atas.

5. Tekan Ctrl+E anda akan berada di Stage Scene 1. Buka Library dengan menekan Ctrl+L. Drag invs_btn di Library ke stage hingga jumlahnya 4 buah.

6. Tempatkan 4 buah invs_btn tadi ke masing-masing jawaban abcd. Buatlah titik Registration berada di tengah-tengah huruf abcd.

7. Klik 2 kali salah satu invs_btn di stage. Ubah letak persegi panjang sampai dapat menutupi jawaban seperti gambar di bawah ini :

8. Tekan Ctrl+E untuk kembali ke stage Scene 1. Berikan Instance Name berikut pada masing-masing invs_btn secara berurutan dari atas sampai ke bawah : tombol1a, tombol1b, tombol1c, tombol1d

9. Klik tombol1a lalu tekan F9 dan masukan script berikut :

10. Klik tombol1b lalu tekan F9 dan masukan script berikut :

10. Klik tombol1c lalu tekan F9 dan masukan script berikut :

10. Klik tombol1d lalu tekan F9 dan masukan script berikut :

13. Buatlah sebuah garis silang dengan luas yang dapat menutupi huruf a, b, c, d. Klik garis tersebut dan tekan F8. Pada kotak dialog yang muncul berikan silang sebagai Name dan Movie clip sebagai Type lalu tekan OK.

14. Klik Movie clip silang tadi dan berikan silang1 sebagai Instance Name

15. Buatlah sebuah garis lingkaran dengan diameter yang dapat menutupi huruf a, b, c, d. Klik garis tersebut dan tekan F8. Pada kotak dialog yang muncul berikan lingkaran sebagai Name dan Movie clip sebagai Type lalu tekan OK.

16. Klik Movie clip lingkaran tadi dan berikan lingkaran1 sebagai Instance Name. Letakan Movie clip lingkaran1 huruf (a/b/c/d) jawaban yang benar dengan titik Registration berada tepat di tengah-tengah huruf.

17. Pastikan anda masih menyeleksi Movie clip lingkaran1, lalu buka panel Properties (Ctrl+F3) dan ubah Colornya menjadi Alpha dengan nilai 0%

18. Buatlah Static Text bertuliskan Koreksi. Gambarlah persegi panjang dan tempatkan di tengah-tengah Static Text Koreksi.

19. Seleksi Static Text koreksi dan persegi panjang tadi lalu tekan F8. Berikan koreksi_btn sebagai Name dan pilih Button sebagai Typenya lalu tekan ok.

20. Klik koreksi_btn lalu tekan F9 dan berikan script berikut :

21. Buatlah Static Text bertuliskan Reset. Gambarlah persegi panjang dan tempatkan di tengah-tengah Static Text Reset.

22. Seleksi Static Text Reset dan persegi panjang tadi lalu tekan F8. Berikan reset_btn sebagai Name dan pilih Button sebagai Typenya lalu tekan ok.

23. Klik reset_btn lalu tekan F9 dan berikan script berikut :

24. Buatlah 3 buah Static Text dan beri masing-masing tulisan berikut Benar: , Salah: , Nilai:

25. Buatlah 3 buah Dynamic Text dengan masing-masing Var benar, salah, nilai. Lalu tempatkan koreksi_btn, reset_btn, 3 buah Static Text dan Dynamic Text tadi seperti gambar di bawah ini :

26. Klik frame 1 pada Timeline Scene 1 dan tekan F9. Pada kotak Action masukan script berikut :

27. Tekan Ctrl + Enter untuk melihat hasilnya.

Good Luck! ^.^

Animasi Pukul Tikus

Teknik animasi yang akan kita coba kali ini sama seperti sebuah permain game yang simple. pembuatan nya cukupmembuuhkan ketelitian dalam penulisan scriptnya. berikut langkahnya...

1. Buat lembar kerja flash

2. Kemudian buatlah sebuah objek seperti di bawah ini:

3. Buatlah sebuah lingkaran berbentuk oval seperti gambar di bawah ini :

4. Seleksi lingkaran berbentuk oval tersebut dan tekan F8. Pada panel yang muncul masukkan lingkaran sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

5. Seleksi movie clip lingkaran di stage dan tekan Ctrl+D sebanyak 5 kali.

6. Seleksi salah satu movie clip lingkaran dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan lingkaran1 sebagai instance name. Lakukan hal yang sama pada movie clip lingkaran lainya dengan masing-masing instance name lingkaran2, lingkaran3, lingkaran4, lingkaran5, lingkaran6

7. Buatlah sebuah static text bertuliskan Jumlah Terpukul.

8. Buatlah sebuah dynamic text dan pada panel propertiesnya masukkan jumlah sebagai var

9. Tempatkan seluruh objek yang dibuat tadi seperti gambar di bawah ini :

10. Buatlah sebuah palu, dengan warna yang berbeda agar terlihat lebih menarik.

11. Seleksi palu tersebut dan tekan F8. Pada panel yang muncul masukkan palu sebagai name dan movie clip sebagai type lalu tekan ok. Seleksi movie clip palu di stage dan pada panel properties masukkan palu sebagai instance name.

12.Klik kanan movie clip palu di stage dan pilih Edit maka anda akan masuk ke dalam stage movie clip palu.

13. Sesuaikan letak dan rotasi palu pada frame 1 seperti gambar di bawah ini :

14. Klik kanan frame 2 dan pilih Insert Keyframe. dan posisikan palu menjadi horizontal.

15. Klik kanan frame 6 dan pilih Insert Keyframe.

16. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

17. Klik frame 6 dan pada panel actions yang muncul masukkan script berikut :

18. Tekan Ctrl+E untuk kembali ke stage scene 1. Letakkan movie clip palu di luar stage.

19. Buatlah sebuah kepala tikus seperti gambar di bawah ini :

20. Seleksi kepala tikus tersebut dan tekan F8. Pada panel yang muncul masukkan tikus sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

21. Klik kanan movie clip tikus di stage dan pilih Edit maka anda akan masuk ke dalam stage movie clip tikus.

22. Klik kanan frame 2 dan pilih Insert Keyframe. Ubah mata tikus di frame 2 menjadi X sehingga berbentuk seperti gambar di bawah ini :

23. Klik kanan frame 7 dan pilih Insert Blank Keyframe.

24. Seleksi frame 1 dan panel actions masukkan script berikut :

25. Seleksi frame 7 dan pada panel actions masukkan script berikut :

26. Tekan Ctrl+E untuk kembali ke stage scene 1. Hapus movie clip tikus dari stage kemudian tekan Ctrl+L. Pada panel library yang muncul, klik kanan movie clip tikus dan pilih Linkage.

27. Pada panel yang muncul berikan tanda contreng/centang pada Export for ActionScipt dan masukkan tikus sebagai identifier alalu tekan ok.

28. Klik frame 1 dan pada panel actions masukkan script berikut :

29. Tekan Ctrl+Enter untuk melihat hasilnya. Klik kepala tikus yang muncul untuk memukulnya.

Animasi Soal Essay

Kegunaan lain yang lebih menarik dari flash adalah dapat membuat soal essay yang dapat di koreksi pointnya dan di reset. ini juga bisa digunakan sebagai bentuk game interaktif. berikut langkah-langkahnya...

1. Buatlah 5 daftar pertanyaan dan tulis masing-masing pertanyaan pada sebuah Static Text

2. Buatlah 5 buah Input Text dengan masing-masing Var diberi jawaban_user1, jawaban_user2, jawaban_user3, jawaban_user4, jawaban_user5 pada panel properties (tekan Ctrl+F3 untuk memunculkannya).

3. Dan juga ubah nilai Maximum characters pada masing-masing Input Text menjadi 12

Membuat tanda centang benar dan salah

4. Pastikan anda tidak menyeleksi objek di stage lalu tekan Ctrl+F8, berikan benar_salah pada Name dan pilih Movie clip sebagai Typenya lalu tekan OK.

5. Anda akan masuk kedalam stage Movie clip benar_salah. Seleksi Frame 2 dan 3 lalu tekan F7. Klik Frame 1 dan tekan F9, berikan script dibawah ini pada kotak dialog yang muncul. Lakukan hal yang sama pada frame 2 dan 3

6. Klik Frame 2 gambarlah tanda centang di dalamnya

7. Klik Frame 3 gambarlah tanda silang didalamnya. Jika sudah tekan Ctrl+E maka anda akan kembali ke Stage Scene 1

8. Buka panel Library dengan menekan F11, drag Movie clip benar_salah ke stage.

9. Klik Movie clip benar_salah yang sudah berada di stage lalu tekan Ctrl+D sebanyak 4 kali maka Movie clip benar_salah akan menjadi 5 buah.

10. Berikan tanda1, tanda2, tanda3, tanda4, tanda5 pada masing-masing Instance Name Movie clip benar_salah.

Membuat nilai serta tombol koreksi dan reset

11. Buatlah 3 buah Static Text dan beri tulisan Nilai: , / , 5

12. Buatlah sebuah Dynamic Text dan beri Var : nilai

13. Buatlah sebuah button dengan tulisan koreksi di bagian dalam tombol. Dan juga berikan koreksi sebagai Instance Name-nya. Seleksi button tersebut lau tekan F9 dan masukkan script berikut:

14. Buatlah sebuah button dengan tulisan reset dibagian dalam tombol. Seleksi button tersebut lau tekan F9 dan masukkan script berikut:

15. Klik frame 1 lalu tekan F9 dan masukan script berikut :

17. Tekan Ctrl+Enter untuk mengetesnya.

Good Luck! ^.^

Animasi Revolusi Bumi dan Bulan

Jika sebelumnya telah kita coba bagaimana membuat revolusi bulan, maka sekarang kita coba membuat revolusi bumi dan bulan. berikut langkah-langkah nya..

1. Buatlah sebuah flash document dengan panjang 300px serta lebar 300px dan juga 12fps sebagai frame rate. Berikan warna hitam pada Backgroundnya

2. Tekan Ctrl+F8 untuk memunculkan kotak dialog Create New Symbol. Masukkan revolusi bulan sebagai Name dan Movie clip sebagai Typenya lalu tekan OK.

3. Anda akan masuk ke dalam stage movie clip revolusi bulan. Masukkan 2 buah layer baru sehingga timeline akan tampil seperti di bawah ini:

4. Pada layer 1 buat lah sebuah lingkaran dengan warna gradasi seperti di bawah ini. berfungsi sebagai matahari.

5. Pada layer 3, buatlah sebuah garis lingkaran (berfungsi sebagai jalur bulan) yang lebih besar dari lingkaran di Layer 1. Hilangkan sedikit garis di bagian atas garis lingkaran sehingga garis lingkaran bagian atas tersebut terpisah.

6. Di Layer 2, buatlah sebuah lingkaran kecil (berfungsi sebagai bulan) seperti gambar di bawah ini.

7. Klik lingkaran yang berfungsi sebagai bulan, tekan F8. Pada panel yang muncul berikan nama sebagai Bulan dan Movie clip sebagai Type lalu tekan OK. Letakkan movie clip bulan ini ke ujung garis lingkaran bagian kiri di Layer 3 (titik registration movie clip bulan harus berada tepat di ujung garis).

8. Pada Layer 3 Klik kanan di frame 31 Insert Frame.

9. Sedangkan pada Layer 2 frame 31 klik kanan Insert Keyframe. Ubah letak movie clip bulan di Layer 2 ke ujung garis lingkaran bagian kanan di Layer 3 (titik registration movie clip bulan harus berada tepat di ujung garis).

10. Layer 2 klik kanan frame 1 dan pilih Create Motion Tween.

11. Layer 3 Klik kanan frame 31 dan pilih Remove Frames.

12. Layer 2 Kilk kanan frame 30 dan pilih Insert Keyframe.

13. Layer 2 Klik kanan frame 31 dan pilih Remove Frames.

14. Layer 1 Klik kanan frame 30 dan pilih Insert Frame.

15. Pada Layer 3 Klik kanan pilih Guide. Singgungkan Layer 2 ke Layer 3.Jika sudah tekan Ctrl+E untuk kembali ke stage Scene 1.

16. Masukka 2 layer baru pada time line.

17. Di layer 1 buatlah lingkaran yang berfungsi sebagai matahari, seperti di bawah ini:

18. Pada Layer 3 dan buatlah sebuah garis lingkaran (berfungsi sebagai jalur bumi) yang lebih besar dari lingkaran di Layer 1. Hilangkan sedikit garis di bagian atas garis lingkaran sehingga garis lingkaran bagian atas tersebut terpisah.

19. Klik Layer 2 agar anda aktif di layer tersebut kemudian bukalah panel Library dengan menekan Ctrl+L pada keyboard. Drag movie clip revolusi bulan ke stage pada Layer 2 frame 1. Letakan movie clip ini ke ujung garis lingkaran bagian kiri di Layer 3 (titik registration movie clip revolusi bulan harus berada tepat di ujung garis).

20. Layer 1 Klik kanan frame 120 dan pilih Insert Frame.

21. Layer 3 Klik kanan frame 121 dam pilih Insert Frame.

22. Layer 2 Klik kanan frame 121 dan pilih Insert Keyframe. Ubah letak movie clip revolusi bulan di frame 121 Layer 2 ke ujung garis lingkaran bagian kanan di Layer 3 (titik registration movie clip bulan harus berada tepat di ujung garis).

23. Layer 2 Klik frame 1 dan pilih Create Motion Tween.

24. Layer 2 Klik kanan frame 120 dan pilih Insert Keyframe.

25. Layer 2 Klik kanan frame 121 dan pilih Remove Frames.

26. Layer 3 Klik kanan frame 121 dan pilih remove Frames.

27. Klik kanan Layer 3 dan pilih Guide. Singgungkan Layer 2 dengan Layer 3.

28. Terakhir Test Movie dengan menekan Ctrl+Enter.

Good Luck! ^.^