Spesifikasi: Ukuran: 14x21 cm Tebal: 48 hlm (full color) Harga: Rp 25.800 Terbit pertama: Juni 2005 Sinopsis singkat: Buku ini ditujukan untuk mereka yang sudah mengetahui teknik dasar Flash MX 2004 dan ingin lebih lanjut mengembangkan kreativitasnya melalui pembuatan animasi dan efek-efek khusus (special effects). Penjelasan tentang teknik-teknik pembuatan beberapa animasi kartun The Incredibles dipaparkan dengan sangat singkat dan mudah melalui praktek langsung. Buku ini dilengkapi pula dengan CD berisi file-file latihan, source code, Flash MX 2004 demo, Flash Player, dan bonus (game, wallpaper, libraries, screen saver, dll).
MEMB UA T ANIMASI KARTUN THE INCREDIBLES MEMBUA UAT
Membuat Karakter Digital Tokoh ELASTIGIRL PembuatAnimasi Efek Khusus“ Raini Animasi karakter kedua yang akan dibahas adalah animasi karakter tokoh arr Elastigirl. Elastigirl kesehariannya bernama Helen P Parr arr. Ia adalah istri dan Elastigirl ibu dari anak-anak superhero yang bernama Violet, Dash Parr, dan Jack Jack Parr. Kehebatan yang dimilikinya adalah super elastis yang dapat meregangkan tubuhnya dengan sangat fleksibel.
Animasi Karakter Elastigirl
Penggabungan Animasi Tween dan Animasi Frame by Frame Pembuatan projek yang ketiga adalah membuat animasi Elastigirl yang sangat lentur melompat ke udara. Teknik pembuatan animasi ini menggabungkan pembuatan animasi tween dan animasi frame by frame. Teknik lain yang digunakan adalah penggunaan beberapa image yang dibuat dengan FX blur untuk membuat efek pergerakan animasi yang cepat. Persiapan Dokumen Baru Lakukan setting awal dokumen seperti dalam projek-projek terdahulu dengan lebar dimensi Stage 800px X 600px, Frame rate: 25 fps dan warna latar belakang Hitam.
Pembuatan dan Penamaan Layer Baru Buat empat buah layer baru dan beri nama masing-masing layer tersebut sebagai berikut “Background”, ”Blur”, “Elastis ” dan “BackSound”.
Timeline: Buat empat buah layer baru dan beri nama sesuai seperti yang disebutkan di atas.
Pengisian Layer Background Pada Layer Background, buat sebuah Keyframe pada Frame 1, lalu impor sebuah image latar belakang menggunakan perintah File > Import to Stage, lalu arahkan ke sebuah file image berikut: CD:\ Animasi \ Elastigirl \ Asset \ Images \ Background.jpg
Document Properties: Setting file projek dengan ukuran dimensi 800 800px X 600 600px, Frame rate: 25 fps dengan warna latar belakang Hitam.
Letakkan image tersebut di tengahtengah Stage. Pada Frame 1 Layer Back ground perbesar ukuran image sehingga menutupi Stage dan ubah Alpha objek image menjadi 0% lalu buat animasi Tween hingga Frame 35.
11
12
Pengisian Layer Blur Pada Layer Blur, buat sebuah Keyframe pada Frame 60, lalu impor sebuah file image berikut (gunakan perintah File > Import to Stage): CD:\ Animasi \ Elastigirl \ Asset \ Images \ S Blur EG.png
Klik objek S Blur EG pada Stage lalu ubah ukurannya dalam panel Property menjadi W = 50 x H= 312 dan letakkan image tersebut di tengah luar bawah Stage. (Lihat gambar di samping.)
Layer Background: Animasi transisi dengan membuat animasi tween objek image Background.jpg pada Frame 1 - 35 dan diperpanjang sampai Frame 145 - Frame 150.
Lanjutkan dengan mengubah ukuran objek image sesuai dengan ukuran Stage dan ubah Alpha objek image tersebut dalam panel Property menjadi 100%. Masih pada Layer Background perpanjang masa tayang frame (durasi hingga Frame 145) dengan menyisipkan sebuah Keyframe. Tambahkan lagi sebuah Keyframe pada Frame 150 dan ubah Alpha image tersebut dalam panel Property menjadi 0%.
Panel Property: Ukuran dan Posisi Instance S Blur EG pada Frame 60 dan Frame 65 .
Buat sebuah animasi Tween pada objek S Blur EG dengan memperpanjang masa tayang animasi tersebut hingga Frame 65. Masih pada Frame 65 pindahkan posisi objek tersebut ke tengah atas di dalam Stage. Ubah ukuran objek tersebut dalam panel Property menjadi W = 133 X H= 548.
Panel Property: Membuat animasi transisi menggunakan alpha channel objek image Bkg.jpg pada Frame 1 - Frame 35 dan diperpanjang sampai Frame 145 - Frame 150.
MEMB UA T ANIMASI KARTUN THE INCREDIBLES MEMBUA UAT Beralih ke Frame 98, imporlah sebuah file image berikut: CD:\ Animasi \ Elastigirl \ Asset \ Images \ M Blur EG.png
Buka panel Library dan drag symbol bitmap M Blur EG ke dalam Stage. Letakkan Instance M Blur EG tepat di atas posisi bekas hilangnya Instance Small EG. (Cocokkan letak Instance tersebut dengan pengisian Instance lainnya yang terdapat pada Layer Elastis.) Pada Frame 99 lakukan hal yang sama dengan langkah-langkah di atas dengan mengimpor sebuah file image berikut: Animasi Tween: Gambaran posisi dan ukuran objek S Blur EG pada Frame 60 sampai Frame 65 saat berubah dan bergerak dari luar Stage menuju ke dalam pada Layer Blur.
Masih pada Layer Blur, insert sebuah Blank Keyframe pada Frame 66 dan perpanjang masa durasinya hingga Frame 97. Lanjutkan pembuatan animasi ini dengan membuat animasi frame by frame. Masih tetap pada Layer Blur, insert beberapa buah Blank Keyframe pada Frame 98, Frame 99, Frame100 perpanjang durasinya sampai Frame 132, Frame 133, Frame 134, dan Frame 135 perpanjang durasinya hingga Frame 139.
CD:\ Animasi \ Elastigirl \ Asset \ Images \ L Blur EG.png
Letakkan objek L Blur EG tepat di atas posisi bekas hilangnya objek M Blur EG.
Animasi Frame by Frame: Gambaran letak posisi dan ukuran objek M Blur EG pada Frame 98 dan M Blur EG pada Frame 99 masih dalam Layer Blur.
Blank Keyframe: Persiapan pembuatan beberapa Blank Keyframe pada Layer Blur: Frame 98 98, Frame 99, Frame 100 sampai Frame 132 132, Frame 133 133, Frame 134 134, dan Frame 135 sampai Frame 139 139.
Beralih pada Frame 133 lalu buka panel Library dan drag symbol bitmap M Blur EG ke dalam Stage. (Cocokkan letak semua Instance tersebut dengan pengisian Instance lainnya pada Layer Elastis.) Lakukan hal yang sama seperti di atas
13
14
pada Frame 134, lalu geser Instance M Blur EG yang ada pada Stage beberapa milimeter ke bawah dari posisi semula.
Pengisian Layer Elastis Pada Layer Elastis, insert sebuah Blank Keyframe pada Frame 66, lalu impor sebuah file image berikut: CD:\ Animasi \ Elastigirl \ Asset \ Images \ Small EG.png
Beralih pada Frame 140, drag-lah symbol bitmap S Blur EG dari panel Library ke dalam Stage. Letakkan Instance S Blur EG tepat di atas posisi bekas hilangnya Instance Small EG. Pada Frame 140 tersebut buat sebuah animasi Tween hingga Frame 143. Pada Frame 143 pindahkan Instance S Blur EG yang ada di tengah Stage ke luar atas Stage.
Klik objek Small EG yang ada pada Stage lalu ubah ukurannya dalam panel Property menjadi W = 133 X H= 378 dan letakkan objek Small EG tepat di atas posisi bekas hilangnya tampilan objek S Blur EG (Frame 65 pada layer Blur). Buat sebuah animasi Tween pada objek Small EG dengan memperpanjang masa tayang animasi tersebut hingga Frame 70 lalu pindahkan posisi objek tersebut sedikit ke atas Stage. Jangan lupa mengubah ukurannya menjadi W = 133 X H= 248. Lanjutkan pebuatan animasi Tween ini dengan membuat sebuah Keyframe pada Frame 80 lalu pindahkan posisi objek tersebut beberapa mili ke atas Stage dari posisi semula. Ubah ukuran tinggi objek H= 221 dan biarkan ukuran lebar (W) tetap.
Animasi Tween: Gambaran letak posisi animasi tween Speed up Blur pada Frame 140 sampai Frame 143.
Layer Elastis: Posisi objek Small EG dalam membuat animasi Tween pada Frame 66, 70, 80 sampai Frame 97.
Animasi Frame by Frame Frame:: Gambaran letak posisi objek M Blur EG pada Frame 98 dan Frame 99 pada Layer Blur.
MEMB UA T ANIMASI KARTUN THE INCREDIBLES MEMBUA UAT Buat sebuah Keyframe lagi pada Frame 97 lalu pindahkan posisi objek tersebut beberapa mili ke bawah Stage dari posisi semula tanpa mengubah ukuran tinggi dan lebar objek. Lanjutkan dengan meng-insert sebuah Blank Keyframe pada Frame 98 - Frame 99. Sedangkan pada Frame 100 insert sebuah Keyframe lalu impor sebuah file image berikut:
Letakkan objek Big EG tepat di atas posisi bekas hilangnya objek L Blur EG. Buat sebuah sebuah Keyframe lagi pada
Frame 101 lalu ubah tinggi H=700 dan biarkan ukuran lebar (W) tetap. Perpanjang durasinya hingga Frame 132. Lanjutkan dengan meng-insert sebuah Blank Keyframe pada Frame 133 dan Frame 134. Sedangkan untuk Frame 135 insertlah sebuah Keyframe, lalu drag symbol bitmap Small EG yang terdapat pada panel Library menuju ke dalam Stage. Letakkan tepat di tengah hilangnya Instance B Blur EG yang terdapat pada Layer Blur. Buat sebuah animasi Tween dengan memperpanjang durasi animasi tersebut hingga Frame 139. Geser posisi Instance Small EG pada posisi semula yang terletak di tengah Stage beberapa cm ke bawah.
Layer Elastis: Posisi objek Big EG dalam membuat animasi Tween pada Frame 100, 101 sampai Frame 132.
Layer Elastis: Posisi Instance small EG dalam membuat animasi Tween pada Frame 135, sampai Frame 139.
CD:\ Animasi \ Elastigirl \ Asset \ Images \ Big EG.png
Instance: Ilustrasi beberapa posisi animasi dalam membentuk satu kesatuan animasi Tween dan animasi Frame by Frame dalam Stage.
Timeline: Gambaran konfigurasi frame-frame animasi yang terbentuk dalam beberapa layer.
15
16
Agar Animasi Lebih Hidup
Tambahkan Latar Belakang Musik Tambahkan beberapa suara untuk membuat animasi dalam projek ini tampak lebih hidup. Impor dua buah file suara berikut: CD:\ Animasi \ Elastigirl \ Asset \ Sound \ B Sound.mp3 dan Elastigirl.mp3
Pada Layer BackSound, klik Frame 1 kemudian perpanjang durasi frame tersebut hingga Frame 150. Kembali klik Frame 1 pada Layer Backsound kemudian drag Symbol B Sound.mp3 yang berada pada panel Library ke dalam Stage. Beralih ke Frame 35 Layer Background lalu drag Symbol Elastigirl.mp3 yang berada pada panel Library ke dalam Stage.
Timeline: Dengan menambahkan suara latar belakang dan suara-suara lainnya, animasi yang telah dibuat menjadi lebih berbeda.
Tes Movie, Save, Export, dan Selesai Untuk melihat pergerakan animasi yang telah dibuat sesuai dengan yang diinginkan, Anda dapat mengetes movie sebelum menyimpan ke dalam format (*.fla) atau mengekspornya ke dalam format akhir Flash (*.swf).
Animasi K ar akter Tok oh EL ASTIGI R L: Source Code dan Flash Movie CD:/ Animasi/Elastigirl ... Kar arakter okoh ELA IGIR
MEMB UA T ANIMASI KARTUN THE INCREDIBLES MEMBUA UAT
Membuat Animasi Karakter Tokoh VIOLET Animasi karakter yang akan dibahas berikut ini adalah animasi karakter tokoh arr adalah anak tertua dari keluarga Bob Parr. Ia adalah iolet. V iolet P Parr V iolet seorang murid SMP yang memendam rasa cinta kepada temannya yang bernama Tony Rydinger. Kehebatan yang dimilikinya adalah dapat menghilang dan dapat membuat perisai diri yang sanggup menahan segala sesuatu dari serangan musuh.
Animasi Karakter Violet
Penggunaan Layer Masking Pembuatan projek yang keempat ini adalah membuat animasi tokoh kartun Violet yang dapat menghilangkan dirinya dan membuat efek yang dimilikinya berupa tenaga elektromagnetis yang dapat digunakan untuk membuat sebuah perisai. Teknik pembuatan animasi ini menggunakan animasi tween yang berada dalam sebuah Movie Clip.
Pembuatan dan Penamaan Layer Baru Buat sembilan buah layer baru dan beri nama masing-masing layer tersebut sebagai berikut: “Background”, “Violet”, “Hand”, “Beam Ball”, “MC2”, “MC1, “MB2”, “MB1”, “MA2”, “MA1”, dan “BackSound”.
Persiapan Dokumen Baru Lakukan setting awal dokumen seperti dalam projek-projek terdahulu dengan lebar dimensi Stage 800px X 600px, Frame rate: 25 fps dan warna latar belakang Hitam. Timeline: Buat sembilan buah layer baru dan sebuah Layer Folder lalu beri nama masingmasing layer seperti yang disebutkan di atas. Sedangkan untuk semua nama layer yang berawalan “M...” ubah menjadi Layer Mask.
Document Properties: Setting file projek dengan ukuran dimensi 800 px X 600 px, Frame rate: 25 fps dengan warna latar belakang Hitam Hitam.
Ubah Layer “MC2”, “MC1, “MB2”, “MB1”, “MA2”, dan “MA1” menjadi Layer Mask. Supaya rapi, buatlah sebuah Layer Folder dan beri nama Folder Mask dan masukkan keenam buah Layer Mask ke dalam Layer Folder tersebut.
17
18
Pengisian Layer Background
Pengisian Layer Violet
Pada Layer Background, buat sebuah Keyframe pada Frame 1, lalu impor sebuah image latar belakang menggunakan perintah File > Import to Stage, kemudian arahkan ke sebuah file image berikut:
Pada Layer Violet, buat sebuah Keyframe pada Frame 38, lalu impor sebuah file image berikut:
CD:\ Animasi \ Violet \ Asset \ Images \ Background.jpg
Letakkan image tersebut di tengahtengah Stage. Pada Frame 1 Layer Back ground perbesar ukuran image-nya sehingga menutupi Stage dan ubah Alpha objek image tersebut dalam panel Property menjadi 0 % lalu buat animasi Tween hingga Frame 35. Pada posisi Frame 35 ubah ukuran objek image sesuai dengan ukuran Stage dan ubah Alpha objek image tersebut menjadi 100%. Masih pada Layer Background perpanjang masa tayang frame (durasi hingga Frame 100) dengan meng-insert sebuah Keyframe. Tambahkan lagi sebuah Keyframe pada Frame 110 dan ubah Alpha objek image tersebut dalam panel Property menjadi 0%.
Layer Background: Animasi transisi dengan membuat animasi tween objek image Background.jpg pada Frame 1 - 35 dan diperpanjang sampai Frame 100 - Frame 110.
CD:\Animasi\Violet\Asset \Images\Vio.png
Letakkan image tersebut di tengahtengah Stage. Perpanjang durasi frame hingga Frame 100 lalu buat animasi tween pada Frame 100 hingga Frame 122, kemudian ubah Alpha objek image Vio menjadi 0%. Pengisian Layer Hand Pada Layer Hand, buat sebuah Keyframe pada Frame 41, lalu impor sebuah file image berikut: CD:\Animasi\Violet\Asset \Images\Palm.png
Letakkan image tersebut tepat di kedua telapak image Vio. Perpanjang masa tayang. Buat animasi tween pada Frame 41 hingga Frame 46, lalu ubah Alpha objek image Palm panel Property menjadi 0%.
Violet & Hand: Pada Layer Violet objek Vio tampil pada Frame 38-100 dan animasi transisinya terjadi pada Frame 100 -122 sedangkan animasi transisi Objek Palm terjadi dari Frame 41 -46 pada Layer Hand.
MEMB UA T ANIMASI KARTUN THE INCREDIBLES MEMBUA UAT Membuat Efek Beam Ball
Penggunaan Movie Clip Pengisian Layer Beam Ball
Pada Frame 45 klik objek Ball pada Stage lalu ubah ukurannya dalam panel Property menjadi W = 640 x H= 640 dan letakkan image tersebut di tengah Stage (lihat gambar).
Pada Layer Beam Ball, buat sebuah Keyframe pada Frame 42, lalu impor sebuah file image berikut: CD:\Animasi\Violet\Asset\Images\Ball.png
Letakkan image tersebut di tengahtengah Stage. Buat animasi tween pada Frame 42 hingga Frame 45. Pada Frame 42 klik objek Ball pada Stage lalu ubah warna dan Alpha dengan memilih opsi Advanced lalu klik tombol Setting... yang terletak di sebelah kanan dalam panel Property. Dalam kotak dialog Advanced Effect atur setting warna Red = (16 % x R)+ 215, Green = (16 % x R)+ 215, Blue = (16 % x R)+ 215, dan Alhpa = (100 % x R)+ 0.
Panel Property: Pilih opsi Advanced dan klik tombol Settings... yang terletak di sebelahnya. Dalam kotak dialog Advanced Effect atur semua seting nilai warna RGB dan nilai Alpha sesuai yang dijelaskan di atas.
Violet & Ball: Gambaran animasi letak dan perubahan ukuran Instance objek Ball yang tampil pada Frame 42 sampai Frame 45 pada Layer Beam Ball.
Lanjutkan pembuatan efek ini dengan membuat sebuah symbol Movie Clip dengan cara Insert > New Symbol... Dalam kotak dialog Create New Symbol beri nama Symbol yang akan dibuat dengan nama “Beam” lalu pilih Behavior Movie Clip, setelah selesai klik tombol OK. Setelah itu tampilan Stage akan berubah masuk ke dalam Mode Stage dan Timeline Beam. Dalam Timeline Beam tersebut buat sebuah layer baru. Jadi jumlah layer yang ada kini berjumlah dua buah.
Create New Symbol: Buat sebuah Symbol Movie Clip baru dan beri nama “Beam”. Untuk sementara waktu biarkan Anda bekerja dalam Mode Stage dan Timeline Beam.
19
20
Masih dalam Timeline Beam pada Layer 1, klik pada Frame 1, lalu impor sebuah file image berikut: CD:\Animasi\Violet\Asset \Images\BmBall.png
Masih tetap pada Layer 2, klik sebuah Keyframe baru pada Frame 127, lalu putar Instance objek BmBall 190o pada porosnya berlawanan arah jarum jam ke posisi semula.
Letakkan image tersebut di tengahtengah Stage. Buat sebuah animasi tween pada Frame 1 dan perpanjang durasi frame hingga Frame 170. Masih tetap pada Layer 1, klik sebuah Keyframe baru pada Frame 85, lalu putar instance objek Beam 180o searah jarum jam.
Layer 2 Movie Clip Beam: Gambaran animasi letak dan perputaran Instance objek BmBall yang tampil pada Frame 1 - 43 -127 -170.
Layer 1 Movie Clip Beam: Gambaran animasi letak dan perputaran Instance objek BmBall yang tampil pada Frame 1 - 85 - 170.
Pada Layer 2, klik pada Frame 1, lalu drag sebuah Symbol image BmBall dari panel Library ke dalam Stage. Letakkan image tersebut di tengahtengah Stage tepat dengan Instance image BmBall yang pada Layer 1. Buat sebuah animasi tween pada Frame 1 dan perpanjang durasi frame hingga Frame 170. Masih tetap pada Layer 2, klik sebuah Keyframe baru pada Frame 43, lalu putar instance objek BmBall 180o pada porosnya berlawanan arah jarum jam. Klik pada Frame 44 lalu putar instance objek BmBall 10o pada porosnya searah jarum jam.
Anda dapat mengetes hasil efek animasi yang dihasilkan dengan menekan tombol Enter pada Keyboard. Jika hasil efek animasi tersebut telah sesuai dengan yang diharapkan maka kembali ke Timeline Utama dengan mengklik tombol panah berwarna biru yang terletak di kiri atas nama Stage.
Timeline Mo vie Clip Beam: Gambaran titik-tik Movie animasi tween pada beberapa Keyframe animasi yang terdapat pada Layer 1 dan Layer 2 Movie Clip Beam. Timeline Utama: Untuk kembali ke Timeline Utama klik tombol Panah Biru yang terletak di sudut kiri kiri dekat nama Stage.
