Drop Down MenusCSS Drop Down MenuPure CSS Dropdown Menu
Selamat datang di blog mahmud media
Tampilkan postingan dengan label Logo Animasi. Tampilkan semua postingan
Tampilkan postingan dengan label Logo Animasi. Tampilkan semua postingan

Jumat, 27 Februari 2009

Membuat Logo Animasi


Tingkatkan kreasimu dengan membuat logo animasi dari flash.
Tutorial ini menampilkan sebuah lemon jatuh ke dalam suatu karakter dan menjalankan animasi nya

Untuk memulainya silahkan buka vector logo design dalam Adobe Illustrator.


Export vector logo file diatas menjadi sebuah Macromedia SWF file dan select Preserve Editability checkbox.


Buka Macromedia Flash dan ciptakan new document dengan dimensi yang telah anda tentukan sebelumnya, dan pastikan Frame Rate menjadi 24fps untuk sebuah smooth animation.


File > Import > Import to Stage dan pilih logo SWF file anda. Ini akan menempatkan logo dalam format vector dalam Flash artboard


Select semua objects yang membuat bentuk lemon shape dan group ken mereka dengan menekan (Ctrl/CMD + G), lalu "Cut" lemon dan "Paste" pada layer baru. Ingat untuk memberi nama pada layer2 anda untuk referensi kedepannya.


Pilih frame 50 pada kedua layer dan Masukkan sebuah Keyframe (Click Kanan > Insert Keyframe), ini akan memberikan beberapa space pada timeline untuk bekerja.


Dalam frame pertama, Copy gambar lemon lalu drag gambar tsb kedalam stage secara vertical. Masukkan sebuah Keyframe pada frame 5 dan Edit > Paste In Place, lemon nya, hapus lemon yang di atas pada frame ini.


Klik kanan antara kedua Keyframes ini dan select Create Motion Tween. Anda akan melihat warna biru dan symbol panah antara frames tersebut.


Masukkan sebuah Keyframe pada frame 7, lalu kembali pada frame 5 pindahkan lemon kebawah secara pelan-pelan dengan Free Transform Tool, tahan ALT untuk merubah satu sudut.
Ciptakan sebuah Motion Tween antara frames 5 dan 7.


Ciptakan layer baru dibawah layer lemon dan berinama Shadow. dalam layer ini gambar sebuah oval dengan gradient abu-abu ke putih dari tengan. Pakai Gradient Transform Tool untuk me-ngedit bentuk dari gradient untuk memberikan perspective.


Masukkan sebuah Keyframe pada frame 5 pada layer ini dan skala perkecil bayangandan berikan kesan bahwa lemon sangat jauh. Ciptakan sebuah Motion Tween antara frame2 ini.


Untuk memulai getaran pada lemon, Masukkan sebuah Keyframe pada frame 53 dan 56. Rubah ukuran lemon menjadi lebih besar sec. perlahan2 pada frame 53. Ciptakan sebuah Motion Tween antara frames 50-56.


Copy frames ini dan Paste pada frame 65 untuk getaran perulangan.




Untuk menciptakan getaran lebih cepat masukkan sebuah Keyframe pada 75, lalu Copy frame 68 dan Paste pada frame 77.


Copy frames antara 75-77 dan paste pada frames 79, 82, 85 dan 91 untuk mengulangi getaran pelan dan cepat.




Ciptakan sebuah getaran yang lebih cepat dengan meng-Copy frame 77 dan mem-Paste nya pada frame 94, Copy frame 77 dan Paste pada 95, lalu Copy frames 94-95. Paste frame ini pada 96, 98, 100, 102, 104, 106, 108 dan 110.


Untuk mengakhirinya buatlah lemon pop dan menghilang masukkan sebuah Keyframe pada 112 dan perbesar lemon. Pada panel properties rubah warna ke Alpha dan set pada 50%.


Masukkan sebuah Blank Keyframe (Click Kanan > Insert Blank Keyframe) pada frame 114.
Pindahkan layer2 Shadow dan Logo kedalam layer yang sekarang ini pada timeline dengan inserting frames (F5) pada frame 150.


Jika kamu ingin memainkan animation ini tekan (Enter) kamu akan melihat bagaimana semua Motion Tweens memerikan lemon sebuah animasi, bagaimanapun juga hal yang sama harus terjadi pada bayangan untuk mengikuti pergerakan bentuk dari lemon.
Pada layer Shadow masukkan Keyframes untuk menyamakan layer Lemon diatas dan merubah bayangan menjadi lebih besar secara tepat pada frame 53. Ciptakan Motion Tweens antara 50-55.


Copy frames 50-55 dan paste pada frame 65.
Ulangi proses ini sama seperti yang anda lakukan pada lemon, sampai bayangan memiliki getaran pergerakan yang sama dengan lemon.masukkan sebuah Blank Keyframe pada frame 113




Satu langkah terakhir adalah untuk membuat warna putih mendahului bayangan pada logo text. Mudah dengan men-drag layer Text menjadi diatas layer Shadow.




Tekan Ctrl + Enter untuk mem-publish animation menjadi SWF.


Sumber dari situs Ilmu Website dalam kategori flash dengan judul Membuat Logo Animasi