50 Kreasi Efek Dan Animasi Teks Dengan Flash CS3

5/16/2018 50 Kreasi Efek Dan Animasi Teks Dengan Flash CS3 - slidepdf.com

http://slidepdf.com/reader/full/50-kreasi-efek-dan-animasi-teks-dengan-flash-cs3-55ab57c4d7b

277

Latihan 45

Teks dengan Efek Zoom Inpada Setiap Huruf

Pada latihan ini kita akan membuat animasi teks dengan efek Zoom In di

setiap huruf penyusunnya. Metode animasinya dimulai dari kiri ke kanan

secara lambat, kemudian secara cepat dari kanan ke kiri. Untuk lebih

mudahnya, ikutilah langkah pembuatan berikut.

Langkah 1: Mempersiapkan Area Kerja

1. Buatlah dokumen baru. klik menu File > New (Ctrl+N).

2. Dalam jendela New Document, klik tab General dan pilih FlashFile (ActionScript 2.0). Kemudian klik tombol OK.

3. Dari menu bar, klik menu Modify > Document (Ctrl+J) atau klik

tombol Size yang ada pada panel Properties.

4. Dari jendela Document Properties, ubahlah ukuran Stage dengan

ketentuan, width 250 px, height 70 px, background color putih

standar dan frame rate 35 fps.

Gambar 45.1 Pengaturan halaman Stage



278

Langkah 2: Membuat Huruf dalam Bentuk Layer

1. Klik ikon Text Tool pada toolbox, kemudian klik di dalam area

Stage.

2. Di dalam kotak teks yang muncul, ketikkan “Cantik”. Berikut

contoh hasilnya.

Gambar 45.2 Membuat teks di dalam Stage

3. Klik ikon Selection Tool yang ada pada toolbox.

Kondisi teks terpilih, klik menu Modify > Break Apart (Ctrl + B).

Dengan cara ini, teks akan terpecah menjadi perhuruf.

Gambar 45.3 Teks telah terpecah perhuruf

4. Kondisi semua huruf terpilih (Ctrl+A), klik menu Modify >

Timeline > Distribute to Layer atau dari klik kanan.

Gambar 45.4 Hasil pembuatan layer dari huruf Cantik



279

5. Hapus Layer 1 yang sudah tidak dipakai lagi. Caranya, klik kanan

pada Layer 1, kemudian pilih menu Delete Layer.

Langkah 3: Membuat Efek Zoom In Pada Huruf C

1. Klik Frame 10 Layer C (huruf pertama), kemudian tekan tombol F6

untuk mengaktifkan Insert Keyframe.

Gambar 45.5 Membuat keyframe pada Frame 10 Layer C

2. Klik kanan pada salah satu frame Layer C (antara Frame 1 sampai

dengan Frame 10), kemudian klik menu Create Motion Tween.

Gambar 45.6 Mengaktifkan Motion Tween

3. Klik Frame 5 Layer C (huruf pertama), kemudian tekan tombol F6


4. Klik ikon Free Transform Tool yang ada pada toolbox.

5. Masih pada Frame 5 Layer C, perbesar ukuran huruf C (tekan

Shift+tarik ke atas). Berikut ini contohnya.

Gambar 45.7 Memperbesar ukuran huruf C

Langkah 4: Membuat Efek Zoom In pada Huruf a

1. Klik Frame 5 Layer a (huruf kedua), kemudian tekan tombol F6




280

Gambar 45.8 Membuat keyframe pada Frame 5 Layer a



Gambar 45.9 Membuat keyframe pada Frame 15 Layer a

3. Klik kanan pada salah satu frame Layer A (antara Frame 5 sampai




5. Klik ikon Free Transform Tool pada toolbox.

6. Perbesar ukuran huruf a (tekan Shift+tarik ke atas). Berikut contoh

dan hasilnya.

Gambar 45.10 Memperbesar ukuran huruf a

7. Kembali lagi pada Frame 1 Layer a, kemudian tekan tombol Delete

dari keyboard untuk menghapus nilai frame awal.

Gambar 45.11 Menghapus nilai pada frame 1 dari layer a



281

Langkah 5: Membuat Efek Zoom In pada Huruf n

1. Klik Frame 10 Layer n (huruf ketiga), kemudian tekan tombol F6


Gambar 45.12 Membuat keyframe pada Frame 10 Layer n



Gambar 45.13 Membuat keyframe pada Frame 20 Layer n

3. Klik kanan pada salah satu frame Layer n (antara Frame 10 sampai





6. Perbesar ukuran huruf n (tekan Shift+tarik ke atas). Berikut contoh

dan hasilnya.

Gambar 45.14 Memperbesar ukuran huruf n

7. Klik kembali Frame 1 Layer n, kemudian tekan tombol Delete dari

keyboard untuk menghapus nilai frame awal.



282

Gambar 45.15 Menghapus nilai pada Frame 1 Layer n

Langkah 6: Membuat Efek Zoom In pada Huruf t

1. Klik Frame 15 Layer t (huruf keempat), kemudian tekan tombol F6


Gambar 45.16 Membuat keyframe pada Frame 15 Layer t



Gambar 45.17 Membuat keyframe pada Frame 25 Layer t

3. Klik kanan pada salah satu frame Layer t (antara Frame 15 sampai





6. Perbesar ukuran huruf t (tekan Shift+tarik ke atas). Berikut contoh

dan hasilnya.

Gambar 45.18 Memperbesar ukuran huruf t



283

7. Klik kembali Frame 1 Layer t, kemudian tekan tombol Delete dari


Gambar 45.19 Menghapus nilai pada Frame 1 Layer t

Langkah 7: Membuat Efek Zoom In pada Huruf i

1. Klik Frame 20 Layer i (huruf kelima), kemudian tekan tombol F6


Gambar 45.20 Membuat keyframe pada Frame 20 Layer i



Gambar 45.21 Membuat keyframe pada Frame 30 Layer i

3. Klik kanan pada salah satu frame Layer i (antara Frame 20 sampai





6. Perbesar ukuran huruf i (tekan Shift+tarik ke atas).



284

Berikut ini contoh dan hasilnya.

Gambar 45.22 Memperbesar ukuran huruf i

7. Klik kembali Frame 1 Layer i, kemudian tekan tombol Delete dari


Langkah 8: Membuat Efek Zoom In pada Huruf k

1. Klik Frame 25 Layer k (huruf terakhir), kemudian tekan tombol F6


Gambar 45.23 Membuat keyframe pada Frame 25 Layer k

2. Klik Frame 35 Layer k (huruf terakhir), kemudian tekan tombol F6


Gambar 45.24 Membuat keyframe pada Frame 35 Layer k

3. Klik kanan pada salah satu frame Layer k (antara Frame 25 sampai


4. Klik Frame 30 Layer k (huruf keempat), kemudian tekan tombol F6



6. Perbesar ukuran huruf k (tekan Shift+tarik ke atas).



285

Berikut contoh dan hasilnya.

Gambar 45.25 Memperbesar ukuran huruf k

7. Klik kembali Frame 1 Layer k, kemudian tekan tombol Delete dari


Langkah 9: Meratakan Keyframe dan Menyimpan

1. Klik Frame 35 Layer k (huruf terakhir), tekan tombol Shift pada

keyboard, kemudian klik pada Frame 35 Layer C (huruf layer

pertama).

Gambar 45.26 Memilih semua Frame 35

2. Setelah Frame 35 dari semua layer terpilih, tekan tombol F6 untuk

mengaktifkan Insert Keyframe.

Gambar 45.27 Membuat keyframe pada Frame 35



286

3. Dari menu File > Save, simpan latihan ini dengan nama

Lat45_EfekHurufZoomIn.fla.

4. Untuk mengetahui hasilnya, tekan Ctrl+Enter.

Gambar 45.28 Contoh hasil efek zoom in

Documents

50 Kreasi Efek Dan Animasi Teks Dengan Flash CS3