Tutorial Membuat Animasi Pesawat Tempur dengan Flash

Pada kesempatan kali ini saya akan memberikan contoh tutorial cara membuat sebuah animasi sederhana sebuah pesawat tempur yang dapat dikontrol dengan tombol keyboard ENTER (untuk mnembak), LEFT (bergerak ke kiri), RIGHT (bergerak ke kanan), UP (bergerak ke atas) dan DOWN (bergerak ke bawah). Kategori tutorial: menengah.

Software yang digunakan adalah Adobe Flash CS6 atau versi ke bawah juga bisa, soalnya masih menggunakan action script versi 2.0. Bagaimana langkahnya?

Langkah pertama, gambarlah sebuah pesawat, peluru dan api secara terpisah

pesawat1

Langkah kedua, convert to symbol gambar peluru menjadi sebuah movie clip, beri instance name: peluru. Kemudian beri action script pada movie clip peluru dengan kode:

onClipEvent (enterFrame) {
    if (Key.isDown(Key.ENTER)) {
        this.play();
        this._x = this._parent.pesawat._x;
        this._y= this._parent.pesawat._y;
    }
}
pesawat7

Langkah ketiga, convert to symbol gambar api menjadi sebuah movie clip, beri instance name: api.

Langkah keempat, editlah movie clip peluru menjadi gerakan animasi tween motion (bergerak dari kiri ke kanan, pada frame terakhir beri action script stop();)

pesawat3

Langkah kelima, editlah movie clip api menjadi gerakan animasi tween shape (gerakan api berkobar-kobar, pada frame terakhir beri action script stop();)

pesawat2

Langkah keenam, seleksi gambar pesawat, movie clip peluru dan movie clip api kemudian convert to symbol, beri nama pesawat, jangan lupa beri instance name: pesawat. Berikan action script pada movie clip pesawat sebagai berikut:

pesawat4

onClipEvent (enterFrame) {
    if (Key.isDown(Key.LEFT)) {
        this._x = this._x-4;
    }
    if (Key.isDown(Key.RIGHT)) {
        this._x = this._x+4;
        this.api.play();
    }
    if (Key.isDown(Key.UP)) {
        this._y = this._y-4;
    }
    if (Key.isDown(Key.DOWN)) {
        this._y = this._y+4;
    }
}

pesawat5

Langkah ketujuh, buatlah dua movie clip gerakan gedung yang bergerak dari kanan ke kiri pada layer yang berbeda.pesawat6

Selamat mencoba!

 

Lihat fullscreen

2 Comments
  1. Andi Bus
    • arief qosim

Leave a Reply

Your email address will not be published. Required fields are marked *