5 Modul
ANIMASI FLASH Bagian 3
KOMPETENSI Setelah menyelesaikan modul ini, mahasiswa diharapkan dapat mengetahui dan membuat jenis animasi menggunakan Action Script
1. TUJUAN • Mahasiswa mengerti tentang konsep animasi • Mahasiswa mengerti tentang jenis-jenis animasi • Mahasiswa mengerti dasar-dasar Script • Mahasiswa mengerti metode pembuatan animasi menggunakan Action Script
2. TUGAS PENDAHULUAN a. Jelaskan apa yang anda ketahui tentang Action Script? b. Jelaskan perbedaan ActionScript 2.0 dan 3.0 ! 3. TEORI 1.1 Action Script ActionScript adalah bahasa pemograman yang digunakan didalam program flash yang berfungsi untuk memberikan perintah didalam animasi flash. Untuk memahami ActionScript tidaklah susah seperti memahami bahasa pemograman lainnya, dengan memahami prinsip penggunaan ActionSript yang biasa digunakan,maka kita sudah dapat memmanfaatkan nya untuk berbagai keperluan. Untuk membuka panel ActionScript atau ingin memasukan Script caranya dengan meng klik Window > Action atau juga bisa dengan menekan tombol F9 pada keyword. Lihat gambar dibawah tampilan ActionScript pada Flash 8.
1.2 Jenis ActionScript dalam flash dibagi menjadi 3 berdasarkan letak Script. 1. Actionscript pada frame
ActionScript pada frame adalah Actionscript yang diletakan pada frame, atau juga sering disebut FrameScript. FrameScript ini hanya bisa dilakukan pada keyframe atau blankkeyframe.untuk melihat frame yang telah diberikan script terdapat tanda berupahurup 'a'kecil yang menandakan keberadaan sebuah Script.
2. ActionScript pada MovieClip ActionScript yang diletakan pada MovieClip sering disebut MovieScript. yang harus diingat adalah untuk membuat movieScript tentunya harus ada MovieClip tempat kita meletakan ActionScript tersebut. MovieClip memiliki bahasa (syntax) sebagai berikut. onClipEvent (event) { perintah } Arti syntax movieScript diatas adalah : • Kata 'onClipEvent' menunjukan
bahwa
perintah
ini
ditujukan
untuk
MovieCliptempat diletakannya Script. • Kata 'event' menunjukan event yang terjadi pada movieClip tersebut.sebenarnya
Event di MovieClip ada 9 diantaranya :load, enterFrame, unload, Mouse up, Mouse Down,Key down, Key up, dan data.Namun diantara semua itu yang sering digunakan yaitu load dan enter Frame. • Kata 'perintah' menunjukan perintah yang dapat diberikan pada MovieClip.
3. ActionScript pada Button Hal yang perlu diingat yaitu ActionScript pada button tentunya harus ada Button tempat meletakanActionScript tersebut.Secara umum syntax yang digunakan dalam
penulisan
ActionScript
pada
Button
hampir
sama
dengan
penulisan
MovieScript.Perhatikan syntax berikut ini ;
on (event) { perintah }
Arti syntax movieScript diatas adalah : •
Kata 'on' menunjukan bahwa perintah ini ditujukan untuk MovieClip tempat diletakannya scriptdan ini merupakan syarat utama untuk Script yang digunakan pada Button.
•
Kata 'event' menunjukan event yang terjadi pada Button tersebut. ada 7 event yang terdapat pada buttonyaitu press, release, rollOver, rollOut, dragOver, dragOut, dan keypress.
Meski
demikian
hanya
dua
event
yang
sering
digunakan
yaitu press danrelease.
1.3 PRAKTIKUM a. Peralatan dan Bahan • Perangkat komputer / PC / Laptop / Notebook / Netbook • Sistem operasi Windows • Macromedia Flash versi 8.0 atau di atasnya b. Keselamatan Kerja • Baca dan pahami semua langkah kerja dari praktikum ini dengan cermat • Pastikan diri anda terlindungi dari efek kejutan listrik yang dapat dikarenakan oleh grounding instalasi listrik yang tidak sempurna. c. Langkah Kerja • Siapkan alat dan bahan praktek. • Selalu memperhatikan keselamatan kerja. • Jalankan perangkat dengan menggunakan tools Macromedia. • Organisasikan dengan baik folder pribadi anda untuk masing – masing modul praktikum.
1.5 METODE PEMBUATAN ANIMASI 1. Buka program macromedia flash atau adobe flash (sama saja karena script yang digunakan masih action script 2.0) 2. Setting ukuran stage menjadi 800x600 pixel. Buat movie clip baru dengan memilih menu Insert > New Symbol. Beri nama nyamuk. 3. Pada editor movieclip, buatlah gambar nyamuk!
4. Pada frame 2, buat blank keyframe baru (F7). lalu gambarlah objek darah seperti di bawah ini.
5. Ubah gambar darah tadi menjadi movie clip dengan mengklik kanan pada objek pilih Convert to Symbol.
6. Pada frame 10, buat keyframe(F6) kemudian buka panel properties. Kemudian ubah color dengan alpha dengan persentase 0%.
7. Klik kanan di tengah frame lalu pilih Create Motion Tween.
8. Pada frame 1. Buka panel action kemudian beri perintah stop(); 9. Keluar dari editor, lalu masukan movieclip nyamuk yang telah kita buat dari library ke stage dengan cara mendrag nya. Letakkan movieclip nyamuk di luar area stage karena movieclip yang asli tidak kita gunakan. 10. Klik movie clip nyamuk kemudian buka panel action. Ketikan script di bawah ini. this._y=0; } else if(this._y<0) { this._y=600; } else if(this._x<0) { this._x=800; } else if(this._x>800) { this._x=0; } } else { moveX=0; moveY=0; } this._x +=moveX; this._y +=moveY; //menghapus movieclip nyamuk yang mati if(this._currentframe==10) { removeMovieClip(this); } } //kondisi saat nyamuk terpukul raket onClipEvent(mouseDow n) { if(this.hitTest(_root.raket.area)&&this._currentframe==1) { this.play(); nyamukMati=1; } }
11. Buka panel properties, kemudian pada kolom instance name beri namanyamuk
12. Selanjutnya, buat movie clip baru dengan nama raket. 13. Buatlah 3 buah keyframe dan pada masing-masing frame gambarkan sebuah raket dengan bentuk berbeda-beda seperti di bawah ini.
Langkah di atas di maksudkan untuk animasi raket saat tombol mouse di tekan. 14. Seleksi gambar raket pada frame 1 dengan Selection Tool (V) tetapi tidak dengan pegangan raket. Liat gambar dibawah.
15. Setelah
diseleksi,
ubah
menjadi
movieclip.
Pada
properties,
beri
nama area pada instance name. 16. Pada frame 1, beri perintah stop(); 17. Keluar dari editor, masukan movieclip raket ke stage kemudian beri action script di bwah ini: //menghilangkan pointer w indow onClipEvent(load) { Mouse.hide(); } //mengganti pergerakan pointer dengan raket onClipEvent(enterFrame) { startDrag(this, true); updateAfterEvent(); } //animasi raket saat tombol mouse ditekan onClipEvent(mouseDow n) { this.play(); }
Lalu, buka panel propertise, beri nama instance “raket”
18. Langkah
terakhir,
pada
frame
1
main
//memperbanyak movieclip nyamuk for(i=0;i<10;i++) { duplicateMovieClip(_root.nyamuk,"nyamuk"+i,i); _root["nyamuk"+i]._x=Math.random()*800; _root["nyamuk"+i]._y=Math.random()*600; } //menyembunyikan movieclip nyamuk yang asli _root.nyamuk._visible=0;
19. Jalankan movie (CTRL+ENTER). 6.
EVALUASI DAN PERTANYAAN -
movie
ketikan
script
berikut:
7.
STUDI KASUS Buatlah sebuah animasi 2D awan yang bergerak dengan suasana hujan, background yang digunakan tidak ada ketentuan, imajinasikan sekreatif mungkin.
8.
KESIMPULAN
9.
Hasil Review Date
Result (1 – 5)
Signature
