Animasi Revolusi Bulan dan Bumi

Tutorial ini adalah lanjutan dari revolusi bulan. Sebelumnya kita membuat bulan yang mengitari bumi dalam tampilan 3d. Kali ini kita akan membuatnya dalam tampilan 2d. Tetapi kita tidak hanya akan membuat bulan mengitari bumi tetapi juga buminya mengitari matahari. Cara membuatnya masih sama dengan membuat revolusi bulan yaitu dengan menggunakan motion guide.

1. Buatlah sebuah flash document dengan panjang 300px serta lebar 300px dan juga 12fps sebagai frame rate. Berikan background sesuai yang anda inginkan.

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. Klik Layer 1, masukan gambar bumi atau anda dapat membuat sebuah lingkaran cukup besar (berfungsi sebagai bumi) berwarna Radial dengan kode #B4B5FE dan #4545FE.

5. Klik 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. Klik Layer 2, masukan gambar bulan

7. Pada kotak dialog yang muncul masukkan bulan sebagai Name 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. Klik kanan frame 31 Layer 3 dan pilih Insert Frame.

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

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

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

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

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

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

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

16. Masukkan 2 buah layer baru sehingga timeline akan tampil seperti di bawah ini:

17. Klik Layer 1 Klik Layer 2, masukan gambar matahari

18. Klik 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. Klik kanan frame 120 Layer 1 dan pilih Insert Frame.

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

22. Klik kanan frame 121 Layer 2 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. Klik frame 1 Layer 2 dan pilih Create Motion Tween.

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

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

26. Klik kanan frame 121 Layer 3 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.

Revolusi Bulan

Kali ini kita akan membuat animasi bulan mengitari bumi. Animasi ini menggunakan Motion Guide dengan sedikit tambahan.

1. Buatlah 4 buah layer dengan mengklik tombol Insert Layer untuk memasukan layer baru. Pastikan posisi masing-masing layer seperti gambar di bawah ini:

2. Pastikan anda aktif di Layer 1. Gambarlah sebuah lingkaran besar (sebagai bumi) atau anda bisa langsung memasukan gambar bumi dan tempatkan di tengah-tengah stage. Seleksi seluruh lingkaran tadi dan tekan Ctrl+C untuk mengcopy lingkaran tersebut

3. Klik Layer 4 agar anda aktif di layer tersebut. Setelah anda berada di Layer 4, klik kanan stage dan pilih Paste in Place.

4. Klik Layer 3 agar anda aktif di layer tersebut. Gambarlah sebuah garis berbentuk oval seperti di bawah ini:

5. Hilangkan sedikit garis di bagian atas garis oval tersebut sehingga akan ada 2 ujung di garis oval tersebut (Pastikan kedua ujungnya terpisah)

6. Klik Layer 2 agar anda aktif di layer tersebut. Gambarlah sebuah lingkaran kecil (sebagai bulan) atau anda bias langsung memasukan gambar bulan di stage Layer 2.

7. Seleksi gambar tersebut dan tekan F8. Pada kotak dialog yang muncul masukan bulan sebagai Name dan Movie Clip sebagai type lalu tekan OK.

8. Tempatkan movie clip ini di ujung garis oval sebelah kiri (pastikan titik registration movie clip ini berada di ujung garis)

9. Klik kanan frame 70 Layer 3 dan pilih Insert Frame

10. Klik kanan frame 70 Layer 2 dan pilih Insert Keyframe. Ubah letak movie clip di frame 70 layer 2 ke ujung garis oval bagian kanan (pastikan titik registration movie clip ini berada di ujung garis)

11. Klik kanan frame 1 Layer 2 dan pilih Create Motion Tween

12. Klik kanan Layer 3 dan pilih Guide. Singgungkan Layer 2 ke Layer 3.

13. Klik kanan frame 30 Layer 1 dan pilih Insert Keyframe.

14. Klik kanan frame 63 dan pilih Insert Frame

15. Hapus lingkaran besar di frame 1 Layer 1

16. Klik kanan frame 70 Layer 4 dan pilih Insert Frame.

17. Klik kanan frame 64 Layer 4 dan pilih Insert Keyframe

18. Klik kanan frame 30 Layer 4 dan pilih Insert Keyframe. Hapus lingkaran besar di frame 30 Layer 4 ini

19. Sehingga di Timeline akan tampak seperti di bawah ini:

20. Tekan Ctrl+Enter untuk melinat hasilnya.

Animasi Motion Shape

Tween Shape berguna menganimasikan objek berjenis shape tanpa harus merubahnya menjadi symbol. Berikut ini adalah contoh sedeharnanya:

1. Buat sebuah background sesuai dengan yang anda inginkan.

2. Buat sebuah persegi empat pada frame 1 dan letakan tepat di tengah-tengah stage.

3. Buat sebuah lingkaran pada frame 20 dan letakan tepat di tengah-tengah stage.

4. Klik frame 1 lalu buka panel properties (tekan CTRL+F3). Ubah Tween dari None menjadi Shape.

5. Terakhir test movie dengan menekan CTRL+ENTER.

Animasi Motion Guide

Motion guide adalah salah satu fasilitas dari flash yang digunakan untuk membuat animasi motion tween bergerak sesuai jalur (guide) yang telah kita buat. Hasil animasi motion guide ini selain halus (karena motion tween) juga lebih teratur karena animasi bergerak sesuai jalur yang kita buat. Berikut ada 2 contoh penggunaannya:

1. Buatlah sebuah flash document.

2. Buatlah sebuah background sesuai pilihan anda.

3. Buatlah sebuah lingkaran berwarna merah dengan hitam sebagai warna garisnya.

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

5. Klik sekali tombol Add Motion Guide pada timeline sehingga di timeline muncul layer guide baru bernama Layer 2.

6. Pastikan anda aktif di Layer 2 kemudian buatlah sebuah garis di stage seperti gambar di bawah ini:

7. Letakkan bagian tengah movie clip bola pada ujung garis bagian kiri seperti gambar di bawah ini:

8. Klik kanan frame 45 Layer 2 dan pilih Insert Frame.

9. Klik kanan frame 45 Layer 1 dan pilih Insert KeyFrame.

10. Ubah letak movie clip bola pada frame 45 ke ujung garis bagian kanan. Pastikan bagian tengah movie clip bola yang berada di ujung garis tersebut seperti gambar di bawah ini :
11. Klik kanan frame 1 Layer 1 dan pilih Create Motion Tween.
12. Tekan Ctrl+Enter untuk melihat hasilnya.

Animasi Jam Analog

Pada tutorial kali ini kita akan mempelajari cara membuat sebuah jam analog. Tampilan jam analog yang akan kita buat di sini masih sederhana. Anda dapat mengembangkannya dengan memperbaiki bagian grafiknya. Sehingga nantinya jam akan terlihat lebih bagus lagi.
1. Buatlah flash document.
2. Pada frame 1 layer 1 buatlah sebuah gambar seperti di bawah ini. Anda dapat menggunakan oval tool, text tool, dan panel transform untuk membuatnya.
3. Untuk garisnya kami akan membuat ukurannya seperti ini: garis jam lebih pendek dari garis menit, garis menit lebih pendek dari garis detik, garis detik lebih panjang dari garis jam dan garis menit. Anda dapat mengubah ukurannya sesuai keinginan anda, seperti gambar di bawah ini:

4. Seleksi garis yang paling kecil, kemudian tekan F8. Pada panel yang muncul masukkan jam_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.

5. Seleksi movie clip jam_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan jam_mc sebagai instance name.
6. Seleksi garis kedua (garis yang tidak terlalu panjang), kemudian tekan F8. Pada panel yang muncul masukkan menit_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.
7. Seleksi movie clip menit_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan menit_mc sebagai instance name.
8. Seleksi garis ketiga (garis yang paling panjang), kemudian tekan F8. Pada panel yang muncul masukkan detik_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.
9. Seleksi movie clip menit_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan detik_mc sebagai instance name.
10. Letakan movie clip jam_mc, menit_mc dan detik_mc di tengah lingkaran yang kita buat sebelumnya. Seperti gambar dibawah ini:

11. Setelah semuanya terpasang, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :
onEnterFrame = function () {
            waktu = new Date();
                        jam = waktu.getHours();
                        menit = waktu.getMinutes();
                        detik = waktu.getSeconds();
            if (jam>12) {
                        jam -= 12;
            }
            jam_mc._rotation = jam*30+(menit/2)
                        menit_mc._rotation = menit*6;
            detik_mc._rotation = detik*6;
};
12. Terakhir, tekan Ctrl+Enter untuk melihat hasilnya.

Animasi Frame By Frame

Animasi frame by frame ini mudah untuk membuatnya, hanya perlu membuat objek yang berbeda-beda pada setiap framenya, tapi semakin banyak frame yang kita gunakan maka .swf yang kita buat akan berjalan lambat namun akan terlihat lebih halus. Berikut hanya sekedar contoh saja, anda dapat membuat yang lebih bagus dari ini, disini saya hanya menyediakan empat layer dengan masing-masing layer di beri nama bola, garis, bayangan, dan background seperti di bawah ini:

1. Pada frame 1 layer 1 beri nama bola, lalu buat objek lingkaran atau kita bisa mendownloadnya.

2. Pada frame 1 layer 2 beri nama garis, lalu buat objek garis lurus (jika anda tidak memakai background, anda dapat menggunakan garis ini sebagai tumpuan untuk bola memantul).

3. Pada frame 1 layer 3 beri nama bayangan, lalu buat objek.

4. Pada frame 1 layer 4 beri nama background, lalu buat background sesuai keinginan anda, maka akan seperti gambar dibawah ini:

5. Pada frame 2 layer 1 buat objek seperti gambar di bawah ini:

6. Pada frame 3 layer 1 buat objek seperti gambar di bawah ini:

7. Pada frame 4 layer 1 buat objek seperti gambar di bawah ini:

8. Pada frame 5 layer 1 buat objek seperti gambar di bawah ini:

9. Pada frame 6 layer 1 buat objek seperti gambar di bawah ini:

10. Pada frame 6 layer 2, 3, dan 4 masukan insert frame atau tekan F5. Terakhir test movie dengan menekan CTRL+ENTER.

Short film - SIAL