Cara membuat animasi kup-kupu terbang dengan macromedia flash

Pada kesempatan kali ini kami akan membahas tentang bidang animasi 2 dimensi, dalam tutorial ini saya akan memberikan tutorial tentang bagaimana cara membuat animasi kupu- kupu terbang menggunakan software Macromeodia Flash. Software ini kami rasa cukup sederhana untuk digunakan dan mudah untuk dipelajari bagi orang awam, dan software yang kami gunakan adalah Macromedia Flash 8.

Baiklah tanpa basa- basi lagi kami akan memberikan cara- cara dalam membuat animasi kupu- kupu terbang.
Caranya adalah sebagai berikut :

1. Pertama, buka dulu software Macromedia Flash 8. Dan untuk memudahkan kita,kita pakai saja pengaturan langsung secara otomatis. Akan tetapi anda dapat merubah pengaturannya sesuai keinginan.

2. Lalu kita dapat membuat gambar kupu- kupunya langsung dalam Macromedia Flash 8 tersebut ataupun dengan meng-import gambar. Nah kali ini kami akan menggunakan cara  kedua ,karena kami anggap lebih mudah dan tidak membuang banyak waktu. Caranya yaitu kita klik menu File > Import > Import to Library, seperti gambar dibawah ini. 

Setelah itu pilih gambar sesuai kengginan dalam komputer kita.

3. Lalu kita drag ( klik kiri jangan dilepas dan geser sampai layar kerja kita) gambar kupu- kupu dari library kita, seperti gambar berikut.

Dan kita atur ukuran gambarnya sesuai kengingginan kita dengan menggunakan Free Transform Tool atau kita klik gambar + tombol Q. 

4. Lalu kita ubah gambar kupu- kupu kita kedalam bentuk Graphic, yaitu dengan cara klik menu Modify > Convert to Symbol atau dengan cara tekan tombol F8 pada keyboard.

5. Lalu kita pilih Graphic dan kita beri nama sesuai keingginan, misalnya kita beri nama kupu-kupu pada kolom namanya lalu kita klik OK.

6. Selanjutnya kita double clik ( klik dua kali cepat) pada objek kupu- kupu kita. Dan kita akan membuat gerakan kupu- kupu itu seolah mengepakkan sayapnya, yaitu dengan cara kita klik pada frame 2 dan kita klik kanan > pilih Insert Keyframe atau kita pencet tombol F6 pada keyboard.

7. Setelah kita beri keyframe kita ubah saja ukurannya dengan free transform tool untuk membuat kupu- kupu itu seolah- olah mengepakkan sayapnya, tetapi kita hanya merubah ukuran width atau menyamping saja seperti contoh berikut :

8. Setelah itu kita kembali kedalam Scene 1 untuk kembali ke lembar kerja awal untuk membuat jalur yang akan digunakan nantinya, caranya kita klik saja tulisan Scene 1 pada layar bagian atas.

9. Tahap berikutnya kita akan membuat jalur bagi kupu- kupu kita dengan cara menambahkan Motion Guide dengan meng-klik Add Motion Guide.

10. Lalu kita klik frame 1 pada Guide: Layer 1 dan membuat jalur sesuai keinginan kita dengan pencil tool pada daftar tool yang tersedia pada pojok kiri seperti contoh berikut ini :

11. Selanjutnya kita akan membuat kupu- kupu itu bergerak mengikuti jalur yang telah kita buat seperti diatas, yaitu dengan cara kita tempelkan lingkaran putih pada pusat gambar/ objek pada awal garis dan kita arahkan kupu- kupu tersebut depan lintasannya, contohnya sebagai berikut :

12. Kemudian kita buat lagi keyframe pada layer 1 dan insert freme pada frame sesuka kita di Guide: Layer 1 (semakin tinggi frame yang kita letakkan akan semakin lama durasi yang kita berikan ), pada contoh ini kami mengambil frame 140, dan arahkan kupu- kupu kita ke arah akhir jalur dan kita tempelkan pusat objek dengan jalur kita, seperti contoh berikut :

13. Lalu kita berikan Motion Tween pada kupu- kupu di Layer 1 dengan cara klik pada frame diantara 1 – 140 ( frame yang kita gunakan ) lalu klik kanan > pilih Create Motion Tween.

14. Lalu tahap terakhir kita akan memperhalus gerakan kupu- kupu itu dengan menggunakan Orient to path dengan cara klik bagian tengah Motion Tween dan pilih Orient to path pada kotak dialog Properties seperti gambar:

Read more ...

CARA MEMBUAT ANIMASI DENGAN MENGGUNAKAN MACROMEDIA FLASH

Cara membuat animasi dengan macromedia flash

Pengertian
Animasi adalah hasil dari pengolahan gambar tangan sehingga menjadi gambar bergerak. Pada awalnya animasi dibuat dari berlembar-lembar kertas yang kemudian diputar sehingga muncul gambar bergerak. Dengan bantuan komputer pembuatan animasi menjadi lebih cepat dan mudah. Perkembangan animasi kini tidak hanya dalam bentuk 2 dimensi, tetapi sudah 3 dimensi.
Flash adalah program grafis multimedia keluaran macromedia yang banyak dipakai untuk pengembangan situs web yang interaktif (lebih hidup) dan kebanyakkan digunakan untuk membuat gambar bergerak/animasi (lengkap dengan suara).
Langkah-langkah membuat animasi
Untuk memahami animasi di flash, kita harus mengerti apa itu tweening? Tweening berasal dari kata “between in”. Dalam flash, tweening adalah istilah yang digunakan untuk animasi. Dengan tweening kita bisa menggerakkan/memindahkan objek/symbol dari satu titik ke titik lain, lalu flash melakukan animasi diantara kedua titik tersebut. Selain itu, tweening juga bisa melakukan pemutaran objek ketika bergerak (seperti roda), objek yang berganti warna, objek yang memudar dan lain-lain. Kita akan memulainya dengan tweening yang pertama, yaitu Motion Tween (jangan khawatir, ini mudah,sederhana dan menyenangkan).

Ikutilah langkah-langkah berikut :      

1. ATUR MOVIE
Pengaturan movie dapat dilakukan melalui Movie Properties. Klik menu Modify > Movie…, isikan Width: 200 px, Height: 100 px dan Background Color: Hitam.

2. MENGATUR DAN MENULIS TEKS
Aturlah huruf yang akan dituliskan, klik menu Text > Character…, lalu pilih Arial Black pada bagian Font dan ukurannya: 14. Kemudian pada bagian Colors yang terletak di bagian kiri layar Flash, klik Text Tool , dan tulislah kalimat ‘NeoTek’ di Movie.

3. MEMBUAT SYMBOL
Sebelum bisa dianimasikan, tulisan tersebut harus diubah menjadi symbol. Klik Arrow Tool yang terdapat pada bagian Colors, lalu klik pada tulisan untuk memilihnya. Selanjutnya, klik menu Insert > Convert to Symbol…, isikan name: Neotek, lalu pilih Graphic pada bagian Behaviour dan klik tombol OK. Maka akan terlihat tanda plus (+) ditengah tulisan yang menandakan tulisan tersebut sudah menjadi symbol.

4. MENGATUR TIMELINE
Timeline terletak diatas Movie, terdiri dari frame-frame. Sekarang klik pada frame 15 lalu klik menu Insert > Keyframe untuk memberikan Keyframe pada frame 15. Lakukan hal yang sama pada frame 30.

5. MEMPERBESAR TULISAN
Klik pada frame 15, lalu klik menu Modify > Transform > Scale and Rotate…, isikan Scale: 150 %, lalu klik tombol OK.

6. ANIMASI TULISAN
Inilah saatnya untuk memberikan animasi. Klik pada frame 1 lalu pilih menu Modify > Frame…, pilihlah Motion pada bagian Tweening. Lakukan hal yang sama pada frame 15.

7. JALANKAN ANIMASI
Motion Tween ditunjukkan dengan frame berwarna ungu dan garis panah yang menunjuk dari titik hitam ke titik hitam lainnya . Sekarang klik menu Control >Test Movie untuk menjalankan animasi.

8. TAMBAHKAN EFEK TINT
Hentikan animasi yang telah dijalankan, sekarang kita akan menambahkan sedikit efek pada animasi yang sudah kita buat tadi. Klik pada frame 1, lalu klik menu Window > Panels > Effect, Pilihlah Tint pada drop-down menu dan Tint Color: Biru. Lakukan hal yang sama pada frame 15 dengan Tint Color: Merah dan frame 30 dengan Tint Color: Ungu.

9. MENAMBAHKAN SUARA
Agar tampak lebih cool, tambahkan suara ketika animasi dimainkan. Klik pada frame 1, lalu klik menu Window > Common Libraries > Sounds, maka daftar Libray Sounds yang telah disediakan Flash akan tampil, pilih salah satu, misalnya: Beam Scan. Drag ke atas tulisan ‘NeoTek’ yang berada di Movie.

10. PUBLIKASI KE BROWSER
Sebelum dipublikasikan simpanlah terlebih dahulu animasi yang telah dibuat, klik menu File > Save As…. Selanjutnya, untuk menampilkan di browser, klik menu File > Publish Preview > HTML. Maka sekarang anda sudah mempunyai file neotek.html.

Read more ...