Arsip mwmag[Files]  [Up]© 2002 PT Masterweb Media

Seri BabaFlash:

Membuat Animasi Rumput

  1. Langkah-Langkah
  2. Hasil
  3. Penutup

Figures

  1. Menggambar rumput
  2. Memilih opsi Close Large Gaps
  3. Rumput dengan bayangan
  4. Mengubah gambar rumput menjadi simbol
  5. Setting animasi "rumput1"
  6. Setting animasi "rumput2"
  7. Menghapus frame yang tidak diperlukan
  8. Setelah frame-frame sisa dihapus
  9. Mengisi stage kosong kembali

Files

  1. rumput.fla
  2. rumput_animasi.fla
  3. rumput_animasi.swf

 

Zeembry Yohanes

Kadang sering kita melihat animasi latar belakang yang berulang-ulang seperti awan berarak. Kali ini kita akan membuat animasi latar belakang rumput yang bergerak dari kiri ke kanan dan berulang-ulang.

Langkah-Langkah

Langkah 1: Menggambar rumput. Gambarlah rumput seperti di Gambar 1. Perhatikan tinggi di pinggir kiri dan pinggir kanan harus sama untuk memudahkan penyambungan.


Fig 1. Menggambar rumput

Langkah 2: Mewarnai rumput. Pilih tool Paint Bucket dan berilah rumput kita warna hijau. Tetapi sebelum itu, pada opsi Paint Bucket, pilih Close Large Gaps (Gambar 2). Ini dikarenakan banyak gap atau lubang yang tidak tertutup rapat pada gambar rumput awal kita sehingga kalau kita memilih opsi standarnya, maka rumput tidak akan bisa diwarnai.


Fig 2. Memilih opsi Close Large Gaps

Langkah 3: Memberi bayangan pada rumput. Pilih tool Brush dan beri warna hijau gelap. Tetapi sebelum itu, pada opsi pilihlah mode Paint Fills supaya stroke atau outline rumput tidak ikut diberi bayangan. Hasilnya bisa Anda lihat di Gambar 3.


Fig 3. Rumput dengan bayangan

Langkah 4: Mengubah gambar rumput menjadi simbol. (Gambar 4).


Fig 4. Mengubah gambar rumput menjadi simbol

Langkah 5: Animasi dari kiri ke kanan. Buat panjang animasi 30 frame seperti yang terlihat pada Gambar 5. Beri nama layer “rumput1”. Posisikan keyframe 1 di kiri sebelum masuk stage. Posisikan keyframe 2 di kanan sesudah melewati stage. Perhatikan bahwa koordinat Y kedua keyframe harus sama sehingga animasi dapat berjalan halus. Gunakan panel Info (Ctrl-I) untuk melihat koordinat Y tersebut. Maka Anda akan melihat gerakan rumput bergerak dari kiri ke kanan melewati stage.


Fig 5. Setting animasi "rumput1"

Stage yang pertama kosong akan dilewati oleh rumput dari kiri ke kanan. Dan sekarang kita akan ke langkah berikutnya untuk melengkapi background berulang tersebut.

Langkah 6: Mengisi stage kosong. Buat layer “rumput 2”. Buat panjang animasi 30 frame seperti yang terlihat pada Gambar 6. Posisikan tepi kiri gambar rumput di keyframe 1 tepat di tepi kanan gambar rumput di layer “rumput 1”. Posisikan tepi kiri gambar rumput di keyframe 2 tepat di tepi kanan gambar rumput di layer “rumput 1”. Jalankan animasi tersebut.


Fig 6. Setting animasi "rumput2"

Pertama kali Anda akan melihat animasi rumput yang berjalan dari kiri ke kanan.

Tetapi setelah head melewati frame ke-15, stage kiri akan terlihat kosong kembali karena gambar rumput pada layer “rumput 1” tidak cukup untuk menutupi stage kosong tersebut.

Langkah 7: Memotong frame yang tidak diperlukan. Setelah melewati frame ke-15, Anda akan melihat gambar rumput di layer “rumput 2” sudah keluar dari stage, yang artinya tidak akan dilihat oleh user. Oleh karena itu kita harus memotongnya karena kita tidak memerlukannya. Pada layer “rumput 2”, klik frame 16 (setelah gambar rumput pada layer “rumput 2” sudah keluar stage), dan tekan F6 (Insert Keyframe). Setelah itu klik frame 17 dan sambil menekan tombol Shift klik frame 30 untuk menyeleksi frame-frame tersebut. Klik kanan pada frame yang terseleksi tersebut dan pilih menu Remove Frames untuk menghapus frame sisanya. Lihat Gambar 7. Sehingga kita akan mendapati frame tersebut seperti pada Gambar 8.


Fig 7. Menghapus frame yang tidak diperlukan


Fig 8. Setelah frame-frame sisa dihapus

Langkah 8: Mengisi stage kosong kembali. Buat layer “rumput 2b” untuk menyiapkan rumput baru. Tekan F7 pada frame ke-16 untuk memberi tempat pada gambar rumput. Ambil gambar rumput dari library dan letakkan di stage dan buat dua keyframe awal dan akhir. Sesuaikan dengan panjang frame, yaitu 30 frame. Posisikan tepi kiri gambar rumput di keyframe 1 tepat di tepi kanan gambar rumput di layer “rumput 1”. Posisikan tepi kiri gambar rumput di keyframe 2 tepat di tepi kanan gambar rumput di layer “rumput 1”. Jalankan animasi. Lihat Gambar 9.


Fig 9. Mengisi stage kosong kembali

Kini Anda dapat menghapus garis pembatas di tepi kiri dan kanan gambar rumput tersebut agar animasi terlihat lebih bagus. Atau memberi warna yang sesuai dengan warna rumput agar garis pembatas tersebut tidak kelihatan seperti garis pembatas. Anda juga dapat menyesuaikan kecepatan animasi rumput tersebut bila dirasa terlalu cepat pergerakan animasinya. Di sini Anda harus hati-hati karena jalannya animasi bisa saja mengganggu gerakan gambar rumput sehingga akan kelihatan terputus sambungannya.

Hasil

Hasil animasi rumput bisa Anda lihat di file rumput_animas.swf, yang tersedia di CD atau di situs mwmag.com.

Penutup

Mau menggambar ombak mengalir dari kiri ke kanan? Juga bisa, gampang saja! Anda tinggal mengubah warna dari gambar rumput tersebut menjadi warna yang sesuai dengan ombak, misalkan biru. Yang penting mirip, he he.

Zeembry pendiri babaflash.com, penulis buku, dan praktisi animasi menggunakan 3DS Max, Director, dan Flash. Dapat dihubungi di zeembry@babaflash.com.

[Last-Modified: Fri Nov 29 14:47:02 2002]

Arsip mwmag[Files]  [Up]www.master.web.id/mwmag