Selasa, 22 Januari 2013

Membuat Animasi Rambut Karakter Dengan Adobe Flash CS3


Cara membuat animasi gerak rambut dalam suatu karakter. Sebelumnya saya buat dulu desain wajah karakter yang ingin saya beri animasi rambut. Dari sinilah saya akan membuat gambar animasi rambut karakter tersebut.


Project akhir yang akan kita buat


Langkah 1

Desain awal karakter.
Buat helai rambut pertama karakter tersebut dan ubah menjadi Movie Clip. Lalu klik dua kali  untuk masuk ke dalam Movie Clip tersebut.

Langkah 2

Nah, mulai dari sini kini mulai membuat animasi rambut karakter. Buat tahap demi tahap, frame demi frame gambar rambut karakter tersebut seolah-olah rambut karakter tersebut bergerak oleh hembusan angin. Seperti biasa animasi ini animasi frame demi frame jadi gunakan tombol F7 dan gunakan Onion Skin untuk patokan gambar sebelumnya.
Desain rambut frame demi frame.
Catatan : intinya posisi gambar pangkal rambut tidak berubah, hanya ujung dan bagian lainnya saja yang diubah.

Langkah 3

Hasil akhir dengan Onion Skin.
Oke, silahkan dicoba dengan Ctrl+Enter untuk melihat animasi helai rambut pertama. Semakin banyak gambar animasi rambut yang dibuat semakin halus pula jalannya animasi rambut tersebut.
Nah, seperti contoh animasi helai rambut pertama tadi. Begitu pula animasi helai rambut lainnya. Hanya saja kali ini dibuat dengan mengikuti desain rambut pertama tadi.

Hasil Akhir




Jadi itulah dasarnya membuat animasi rambut karakter versi frame by frame. Oke sampai disini dulu tutorial kali ini. Selamat mencoba!.

Membuat Animasi Kedipan Mata dengan Adobe Flash CS3

Animasi mata adalah salah satu animasi wajah yang paling sering dipakai untuk membuat sebuah karakter agar lebih hidup dan menarik perhatian. Pembahasan kali ini bagaimana cara membuat animasi mata berkedip  yang menarik pada Adobe Flash.

HASIL AKHIR PROJECT YANG AKAN KITA BUAT



Langkah 1

Pertama-tama buatlah sebuah desain wajah baik itu berupa sketsa dahulu ataupun langsung ke gambar wajah karakter. Disini penulis persingkat desain wajah karakter dengan membuat Desain wajah dan animasi mata berada di layer yang berbeda.

Langkah 2

Kunci semua layer kecuali layer mata sehingga gambar mata dapat di edit dengan mudah tanpa merusak layer lainnya. Gunakan F6 dan mulai mengedit gambar mata frame demi frame. Hapus saja bagian atas mata sedikit demi sedikit dan edit pada tiap framenya sampai mata tertutup. Gunakanlah fungsi Union Skin untuk membantu membuat animasi selanjutnya dari gambar frame sebelumnya.

Gambar frame demi frame animasi yang dibuat.

Langkah 3

Dari gambar mata pada tiap frame yang dibuat tertutup, kini giliran membuatnya kembali terbuka. Caranya copy semua frame gambar animasi mata tertutup tersebut dan paste-kan ke frame berikutnya. Lalu balik jalannya animasi semua gambar pada tiap frame tersebut dengan memblok semua frame yang dipastekan tadi dan klik kanan mouse pada daerah blok dan pilih Reverse Frames. Sejajarkan jumlah semua animasi pada tiap Layer dengan tombol F5. Lalu test dengan Ctrl + ENTER untuk melihat hasil animasi mata yang telah dibuat.
Bagaimana, mudah bukan membuat animasi mata berkedip ? Oke sampai jumpa pada tutorial berikutnya. Selamat mencoba ^-^

Hasil Akhir


Membuat Animasi Masking Sederhana Dengan Adobe Flash CS3


Buka program Adobe Flash CS3, Lakukan pengaturan untuk ukuran layer seperti dibawah ini



Import sebuah gambar yang akan diguanakan untuk membuat animasi masking, disni saya gunakan wallpaper linux banten yang tutorialnya telah dibuat 



Maka pada bagian Library (Ctrl+L) akan muncul nama file gambar yang kita import tadi



Lalu drag gambar tadi ke dalam layer bah nama layernya menjadi nama Background, untuk melakukan pengaturan letak tekan Ctrl+K, aktifkan icon Align/Distribute to stage aktif, Pilih Align Horizontal Center dan Distribute Vertikal Center. Maka posisi gambar akan tepat pada tengah layer



Buat 2 layer baru Beri nama Kotak dan logo, Pada layer kotak kita buat objek kotak dengan mneggunakan Rectatangle Tools (R), matikan pada bagian stoke color, Lakukan pengaturan pada warna sebagai berikut :


Type : Linear


Berikan warna tengah dengan warna putih, dan warna kiri dan kanan ubah nilai alpha menjadi nol
Maka akan jadi objek kotak seperti ini


Pada layer logo kita akan membuat sebuh objek untuk menutupi logo tersebut menggunakan pen tool dan oval tool.
Buat 2 buah objek oval dan tempatkan seperti ini



Seleksi objek oval biru tekan delete, maka hasilnya seperti ini



Selanjutnya kita akan membuat objek menggunakan pen tool untuk menutup objek menaranya
Kira-kira jadinya nanti akan seperti ini



Putar objek kotak yang tadi kita buat menggunakan free transform tool (Q)



Blok semua layer pada frame 25 klik kanan >> insert Keyframe atau tekan F6



Maka akan menjadi



Klik pada frame 25 layer kotak hingga objek kotak menjadi aktif, kemudian geser menggunakan tombol panah atau di drag ke sebelah kanan



Klik kanan frame satu layer kotak pilih create motion tween



Maka layer kotak akan menjadi


Selanjutnya letakkan layer logo diatas layer kotak, klik kanan pada layer logo kemudian pilih mask


Selesai juga deh… bim salabim ka arba arba… Hhee
Untuk menjalankan tekan Ctrl+Enter

Mengenal Adobe flash CS3


CARA MEMBUKA

Untuk membuka program Adobe Flash CS3 Professional, kamu dapat melakukan salah satu cara berikut:
# Klik icon Adobe Flash CS3 Professional pada dekstop (Layar monitor)


# Klik Start Menu All Programs Adobe Design premium CS3 lalu pilih Adobe Flash CS3 Professional. Beberapa saat akan muncul jendela dialog seperti berikut :

# Untuk memulai membuat file baru, pilih Flash File (ActionScript 2.0),
# Untuk membuka file flash pilih Open a Recent New – Open,

MENGENAL JENDELA KERJA
1. Mengenal Menu Dasar
Layar Flash terbagi dalam 7 area utama, yaitu menubar, layer, panel properties, toolbar, timeline, stage, dan panel,.
Berikut merupakan tampilan standar jendela kerja Adobe Flash CS3 Professional, saat Anda memulai membuat file baru.


Jendela kerja Adobe Flash CS3 terdiri atas :

Menubar
Berisi kumpulan menu atau perintah-perintah yang digunakan dalam Adobe Flash CS3.


*Toolbar
Toolbar Adalah panel berisi berbagai macam tool. Tool-tool tersebut dikelompokkan menjadi empat kelompok : Tools
; berisi tombol-tombol untuk membuat dan mengedit gambar, View; untuk mengatur tampilan lembar kerja, Colors; menentukan warna yang dipakai saat mengedit, Option; alat bantu lain untuk mengedit gambar.
Dan berikut fungsi dari Tools pada Flash :




















*Timeline
Timeline/garis waktu merupakan komponen yang digunakan untuk mengatur atau mengontrol jalannya animasi. Timeline terdiri dari beberapa layer. Layer digunakan untuk menempatkan satu atau beberapa objek dalam stage agar dapat diolah dengan objek lain. Setiap layer terdiri dari frame-frame yang digunakan untuk mengatur kecepatan animasi. Semakin panjang frame dalam layer, maka semakin lama animasi akan berjalan.


*Stage
Stage digunakan untuk memainkan objek-objek yang akan diberi animasi. Dalam stage kita dapat membuat gambar, teks, memberi warna dan lain-lain.

*Panel
Beberapa panel penting dalam Adobe Flash CS3 Professional, diantaranya panel: Properties, Filters & Parameters, Actions,
Library, Color dan Align & Info & Transform

*Properties
Panel Properties akan berubah tampilan dan fungsinya mengikuti bagian mana yang sedang diaktifkan. Misalnya Anda sedang mengaktifkan Line tool, maka yang muncul pada jendela properties adalah fungsi-fungsi untuk mengatur line/garis seperti besarnya garis, bentuk garis, dan warna garis.

*Library
Panel Library mempunyai fungsi sebagai perpustakaan simbol/media yang digunakan dalam animasi yang sedang dibuat. Simbol merupakan kumpulan gambar baik movie, tombol (button), sound, dan gambar statis (graphic).

2. Document Properties
Fungsi Document Properties adalah untuk melakukan pengaturan ukuran layar, warna background, framerate, dan dimensi dari animasi yang akan dibuat. Untuk memanggil kotak dialog Document Properties, pilih jendela Properties di bawah layar, kemudian pilih tombol Size.


SElamat Mencoba...