BAB 8 : ANIMASI TEKS
DURASI: 2 JAM
Pengertian Animasi teksAnimasi teks pada prinsipnya sama dengan menggunakan Motion Tween, tinggal bagaimana kiat mengatur animasi tersebut. Kemudian terdapat juga efek flash yang dapat digunakan untuk diterapkan pada animasi teks ini. Selainnya itu terdapat pula software third party yang mensup-portnya.
Membuat animasi teks standar
1. Buat sebuah teks LIVE dengan font Arial Black Size 90. Modify > Break Apart
2. Pilih satu huruf, Convert to Symbol, Graphic, beri nama sesuai hur-ufnya: L, I, V, E
3. Seleksi semua huruf tersebut, pilih Modify > Timeline > Distribute to Layer, otomatis seluruh huruf menempati layernya masing-mas-ing. hapus Layer 1 yang tidak terpakai.
4. Untuk semua layer, Insert Frame 15. Insert Keyframe 10 dan buat Motion Tween antara 1 - 10 untuk semua layer.
5. Pada frame 1 ubah letak tiap huruf, misalnya L ke kiri, I ke atas, V ke bawah, E ke kanan
6. Contoh ada di dalam folder Bab 08/08a.fla Membuat animasi teks berputar
1. Buat sebuah teks SAMSARA dengan font Arial Black Size 90. Modify > Break Apart
2. Pilih satu huruf, Convert to Symbol, Graphic, beri nama sesuai hur-ufnya: S, A, M, S2, A2, R, A3
3. Seleksi semua huruf tersebut, pilih Modify > Timeline > Distribute to Layer, otomatis seluruh huruf menempati layernya masing-mas-ing. hapus Layer 1 yang tidak terpakai.
4. Untuk semua layer, Insert Frame 70. Insert Keyframe 10 dan buat Motion Tween antara 1 - 10 untuk semua layer.
5. Pada frame 1 pada semua layer ubah ukuran dan properti tiap hur-uf. Dengan Window > Transform ubah ukuran menjadi 300%. Pada Properties ubah Color Alpha = 0%
6. Pada frame 1 pada semua layer ubah Properties Motion Tween den-gan Rotate CW 1
7. Contoh ada di dalam folder Bab 08/08b.fla Membuat animasi teks loncat
1. Buat sebuah teks JUMP dengan font Arial Black Size 90. Modify > Break Apart
2. Pilih satu huruf, Convert to Symbol, Graphic, beri nama sesuai hur-ufnya: J, U, M, P
3. Seleksi semua huruf tersebut, pilih Modify > Timeline > Distribute to Layer, otomatis seluruh huruf menempati layernya masing-mas-ing. hapus Layer 1 yang tidak terpakai.
4. Untuk semua layer, Insert Frame 35. Insert Keyframe 10, 20 dan buat Motion Tween antara 1 - 10 - 20 untuk semua layer.
5. Pada frame 10 pada semua layer ubah letak tiap huruf. Dengan cara memindahkan ke atas.
6. Untuk membuat gerakan bergantian, pindahkan motion tween awal untuk huruf U di frame 5, M di frame 10, P di frame 15
jumping text rotating text animated text
7. Agar gerakan animasinya halus, ubah Frame Rate menjadi 24 fps pada Flash Properties
8. Contoh ada di dalam folder Bab 08/08c.fla Membuat animasi teks warna berputar
1. Buat sebuah teks COLOR dengan font Arial Black Size 90. Modify > Break Apart
2. Pilih satu huruf, Convert to Symbol, Graphic, beri nama sesuai hur-ufnya: C, O, L, O2, R
3. Seleksi semua huruf tersebut, pilih Modify > Timeline > Distribute to Layer, otomatis seluruh huruf menempati layernya masing-mas-ing. hapus Layer 1 yang tidak terpakai.
4. Untuk semua layer, Insert Frame 50. Seleksi tiap huruf, buka Proper-ties Color : Tint 100%. Ubah tiap huruf mempunyai warna yang ber-beda. Insert Keyframe 15, 20, 30, 35, 45 dan buat Motion Tween antara 1 - 15, 20 - 30, 35 - 45 untuk semua layer.
5. Pada frame 1 pada semua layer letak, ukuran dan properti tiap hur-uf. Dengan Window > Transform ubah ukuran menjadi 300%. Pada Properties ubah Color Tint = 100% ubah warna yang berbeda den-gan frame 15. Posisikan tiap huruf menyebar di luar stage. Proper-ties Frame 1 masukkan Rotate CW 1
6. Pada frame 30 pada semua layer ubah Properties Color Tint = 100% dengan warna yang berbeda. Dan pada frame 45 kondisinya sama dengan frame 20, jadi Copy Frame 20, Paste Frame 45
7. Contoh ada di dalam folder Bab 08/08d.fla Membuat animasi teks dengan efek dari Flash
Membuat animasi dengan efek yang sudah disediakan oleh Flash adalah hal yang mudah. Buat sembarang teks, contoh di sini sesuai dengan efek yang ada di Flash yaitu BLUR, EXPAND, dan EXPLODE. Seleksi teks kemudian pilih menu Insert > Timeline Effects> Effects > Blur, Ex -pand atau Explode. Atur properti dalam efek itu, seperti durasi, scale, expand, squeeze, direction, rotate. Contoh ada di dalam folder Bab
08/08e.fla, 08f.fla, 08g.fla rotating color text
BAB 8 : ANIMASI TEKS
DURASI: 2 JAM
Membuat animasi teks dengan SWISH
Swish merupakan software third party untuk animasi. Pada versi awal-nya software ini bertujuan untuk menciptakan animasi teks dengan efek-efek animasi khusus, dimana bila kita kerjakan di Flash akan me-makan waktu lebih banyak. Setelah kita membuat efek teks yang kita inginkan, kita dapat meng-ekspornya dalam format swf. Yaitu format file flash. Versi Swish yang terakhir yaitu SwishMax
1. Buka aplikasi Swish Max, Properti Movie ada di sebelah kanan, Atur supaya sesuai dengan ukuran pada Flash misal 550 x 400
2. Pilih menu Insert > Text, tuliskan teks yang diinginkan di editor yang ada di sebelah kanan.
3. Seleksi semua teks tersebut, klik kanan pilih Effect. Di sini terdapat beberapa bagian yaitu Core Effect, Fade, Zoom, Slide, Blur, dan
ratusan efek yang lain. Pilih salah satunya. Bila ingin memainkan-nya tekan tombol play yang ada di atas menu
4. Bila ingin meng edit efek yang sudah dipakai, klik kanan timelinenya pilih Properties.
5. Setelah semuanya sesuai, pilih File > Export > SWF, beri nama filenya.
6. Buka aplikasi Flash, pilih Import to Library, drag symbol Mov-ieclipnya ke stage atur peletakannya.
7. Contoh ada di dalam folder Bab 08/08h.fla, 08i.fla text effect dari SWISH
BAB 8 : ANIMASI TEKS
DURASI: 2 JAM
BAB 9 : SYMBOL & SOUND
DURASI: 2 JAM
Symbol dalam Flash
Obyek yang sering digunakan dalam timeline berulang kali menyebab-kan file Flash bertambah besar. Untuk memperkecil ukuran maka suatu obyek diubah menjadi simbol, sehingga data obyek itu hanya satu kali terdefinisi. Simbol yang sama ini dapat berulang kali dimasukkan ke dalam stage. Salinan simbol ini dinamakan instance.
Cara membuat symbol
Jika obyek terdapat di dalam stage, kita dapat memilihnya kemudian pilih menu Modify > Convert to Symbol. Atau klik kanan Convert to Symbol. Atau bila simbol itu dibuat pada awal pembuatan file Flash dilakukan dengan cara menu Insert > New Symbol
Behaviour dalam Symbol
Ada 3 behaviour symbol dalam Flash yaitu Graphic, Button dan Mov-ie clip. Setiap kali kita membuat symbol akan diberi option untuk penamaan yang secara default diberi nama Symbol 1, 2 dst.
Penamaan Symbol
Penamaan untuk Symbol ini untuk mempermudah dalam penggunaan hints pada actionscript (akan dibahas di Bab 10) sebaiknya mengikuti aturan sebagai berikut. Untuk Symbol Movie clip diberi nama dengan akhiran _mc, contohnya roda_mc. Symbol Button diberi nama den-gan akhiran _btn, contohnya tombol_btn. Untuk graphic tidak ada penamaan khusus, karena tidak ada pengaruhnya dalam actionscript. Sebagai tambahan untuk text diberikan tambahan _txt, contohnya nas-kah_txt.
Timeline Utama vs Timeline Symbol
Setiap simbol mempunyai 2 Timeline, yang pertama Timeline Utama dan Timeline Symbol. Timeline Utama adalah timeline ketika kita per-tama membuka aplikasi baru dalam Flash. Sedang bila kita dalam posisi untuk mengedit Symbol maka yang terbuka adalah Timeline Symbol. Editing Symbol
Cara mengedit simbol dapat dilakukan dengan berbagai cara. Dengan memilih symbol dalam stage Timeline Utama, kemudian pilih menu Edit > Edit Symbol, atau Edit > Edit Selected atau klik kanan Edit, mode ini akan masuk ke dalam Timeline Symbol dimana terdapat obyek symbol itu saja dalam stage Timeline Symbol.
Pilihan lain dengan menu Edit > Edit in Place atau klik kanan Edit in Place atau Double Click Symbol tersebut. Mode ini akan mengedit symbol tersebut sambil mengetahui posisinya di Timeline utama, hal ini nampak pada obyek lain yang tidak diedit berada dalam keadaan transparan. Untuk kembali ke Timeline Utama: Edit > Edit Document Library
Simbol-simbol yang telah dibuat dikumpulkan dalam tempat yang ber-nama Library. untuk memunculkan pilih menu Window > Library. Den-gan semakin banyaknya symbol yang digunakan dalam Flash ini akan menyebabkan semakin banyaknya anggota dalam Library. Untuk itu penamaan symbol diperlukan agar tidak membingungkan
create new symbol
timeline utama
timeline simbol graphic
timeline simbol button
BAB 9 : SYMBOL & SOUND
DURASI: 2 JAM
Membuat Symbol Graphic
1. Import to Stage sebuah gambar, kemudian pilih klik kanan Convert to Symbol, pilih Behaviour Graphic
2. Buat sebuah bentuk shape pada stage, double click obyek tersebut untuk memilih Fill dan Strokenya, kemudian pilih klik kanan Con-vert to Symbol, pilih Behaviour Graphic
3. Buat sebuah teks tulisan pada stage, kemudian pilih klik kanan Con-vert to Symbol, pilih Behaviour Graphic.
4. Contoh ada di dalam folder Bab 09/09a.fla Membuat Symbol Button
1. Buat sebuah bentuk shape peresegipanjang pada stage, double click obyek tersebut untuk memilih Fill dan Strokenya, kemudian pilih klik kanan Convert to Symbol, pilih Behaviour Button
2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline Symbol. Pada timeline terdapat 4 frame yaitu Up, Over, Down, Hit 3. Up state adalah keadaan ketika mouse berada di luar area symbol
tombol ini.
4. Over state adalah keadaan ketika mouse berada di atas area symbol tombol ini. Insert Keyframe pada Over, kemudian ubah warna Fill-nya untuk membedakan keadaanFill-nya.
5. Down state adalah keadaan ketika mouse ditekan di atas area sym-bol tomsym-bol ini. Insert Keyframe pada Down, kemudian ubah warna Fillnya untuk membedakan keadaannya.
6. Hit state adalah area yang melingkupi simbol tombol itu sendiri, dimana kursor berubah dari panah menjadi tanda “tangan”. Insert Keyframe pada Hit, tanpa perlu diadakan perubahan apa apa, kare-na hanya diambil bentuk shapenya saja.
7. Tambahkan layer baru, kemudian Insert Keyframe pada Over State. Berilah teks “over” di atas bentuk tombol tadi. Insert Keyframe lagi pada Down State dan ganti teksnya dengan “down”. Untuk Hit State, klik kanan Insert Blank Keyframe untuk mengosongkan ar-eanya.
4. Contoh ada di dalam folder Bab 09/09b.fla, 09c.fla
Membuat Symbol Button dengan gambar
1. Import 3 buah gambar dengan ukuran yang sama ke dalam Library. Drag salah satu gambar, kemudian pilih klik kanan Convert to Sym-bol, pilih Behaviour Button
2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline Symbol. Pada timeline terdapat 4 frame yaitu Up, Over, Down, Hit 3. Insert Keyframe untuk Over, Down dan Hit State.
4. Pada Over state pilih gambar yang ada di Stage Timeline Symbol ini, kemudian buka Properties dan pilih Swap, ubah dengan gambar shape, teks, gambar
BAB 9 : SYMBOL & SOUND
DURASI: 2 JAM
yang berbeda.
5. Lakukan hal yang sama untuk Down state. 6. Contoh ada di dalam folder Bab 09/09d.fla Membuat Symbol Button dengan teks
1. Buat sebuah teks tulisan “CARPE DIEM” Arial Black Size 70, kemu-dian pilih klik kanan Convert to Symbol, pilih Behaviour Button 2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline
Symbol. Pada timeline terdapat 4 frame yaitu Up, Over, Down, Hit
3. Insert Keyframe untuk Over, Down dan Hit State.
4. Pada Over state pilih teks tersebut ubah warnanya, lakukan hal yang sama untuk Down State
5. Contoh ada di dalam folder Bab 09/09e.fla Menggunakan Button Common Library
Cara praktis untuk memakai simbol button adalah menggunakan simbol yang sudah tersedia di Flash. Letak Buttons ini ada di menu Windows > Common Libraries > Buttons. Pada Common Libraries ini terdapat banyak kategori button, mulai yang berbentuk arcade untuk game, elips, kotak, tombol untuk player. Penerapannya tinggal di drag dari Library itu ke dalam stage. Mulai ingin mengeditnya dapat dilakukan dengan cara Edit Symbol.
Membuat Symbol Movie Clip
1. Buat sebuah bentuk shape bintang pada stage, double click obyek tersebut untuk memilih Fill dan Strokenya, kemudian pilih klik kan-an Convert to Symbol, pilih Behaviour Movie Clip
2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline Symbol. Insert Frame di frame 5, seleksi semua frame dari 1 - 5, klik kanan, Convert to Keyframe.
3. Pilih frame 2, ubah warna Fill nya, pilih frame 3 dan seterusnya sampai frame 5 dan ubah warna Fill nya. Klik icon Scene 1 untuk kembali ke Timeline Utama
4. Contoh ada di dalam folder Bab 09/09f.fla
Symbol Movie Clip melakukan Motion Tween di Timeline Utama 1. Movie Clip bintang yang telah dibuat di dalam latihan sebelumnya
digunakan kembali
2. Pada Timeline Utama, Insert Frame pada frame 90, Insert Keyframe pada frame 1, 30, 60, 90. Berikan Motion Tween di antara frame 1 - 30 - 60 - 90.
3. Ubah letak star pada frame 30, 60. Hal ini menyebabkan pada Time-line Utama star itu bergerak dari satu bagian ke bagian lain, sambil bergerak, star tadi juga berkedip berganti warna.
4. Contoh ada di dalam folder Bab 09/09g.fla
5. Kombinasi lain dilakukan dengan menggunakan gambar, dimana movie clip ini berisi gambar-gambar yang berganti ganti sambil bergerak tween dari satu bagian ke bagian lain. Prinsipnya sama dengan latihan sebelumnya, hanya yang diubah adalah penggunaan gambar. Contoh pada Bab 09/09h.fla
Up Over Down State Symbol Button Teks
BAB 9 : SYMBOL & SOUND
DURASI: 2 JAM
Symbol Movie Clip melakukan Motion Tween di Timeline Symbol 1. Import sebuah gambar ke dalam Stage, kemudian pilih klik kanan
Convert to Symbol, pilih Behaviour Movie Clip
2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline Symbol. Dalam hal ini, kita merencanakan untuk membuat Motion Tween di Timeline Symbol Movie clip ini. Untuk itu gambar yang ad di Timeline Symbol ini kita Convert to Symbol dengan Behaviour Graphic. Insert Frame di frame 80, Insert Keyframe pada frame 1, 30, 50, 80. Berikan Motion Tween antara frame 1 - 30 dan 50 - 80. 3. Pilih Frame 1, ubah Properties Color Alpha = 0%, lakukan hal yang
sama untuk Frame 80
4. Kembali ke Timeline Utama, biarkan tanpa ada perubahan di sini 5. Contoh ada di dalam folder Bab 09/09j.fla
6. Kombinasi lain dilakukan dengan melakukan Tweening juga pada Timeline Utama. Contoh pada Bab 09/09k.fla
Kombinasi Button dengan Movie Clip
1. Buat sebuah bentuk shape lingkaran pada stage, double click obyek tersebut untuk memilih Fill dan Strokenya, kemudian pilih klik kan-an Convert to Symbol, pilih Behaviour Button
2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline Symbol. Pada timeline terdapat 4 frame yaitu Up, Over, Down, Hit 3. Up state adalah keadaan ketika mouse berada di luar area symbol
tombol ini.
4. Over state adalah keadaan ketika mouse berada di atas area symbol tombol ini. Insert Keyframe pada Over, kemudian ubah warna Fill-nya untuk membedakan keadaanFill-nya.
5. Down state adalah keadaan ketika mouse ditekan di atas area sym-bol tomsym-bol ini. Insert Keyframe pada Down, kemudian ubah warna Fillnya untuk membedakan keadaannya.
6. Hit state adalah area yang melingkupi simbol tombol itu sendiri, dimana kursor berubah dari panah menjadi tanda “tangan”. Insert Keyframe pada Hit, tanpa perlu diadakan perubahan apa apa, kare-na hanya diambil bentuk shapenya saja.
7. Tambahkan layer baru, kemudian Insert Keyframe pada Over State. Buat sebuah bentuk yang melingkari obyek di bawahnya. Bentuk itu di Convert to Symbol > Behaviour Movie Clip. Untuk Hit State, klik kanan Insert Blank Keyframe untuk mengosongkan areanya.
8. Double Click Movie Clip yang baru dibuat tadi, untuk masuk ke dalam Timeline Symbol Movie Clip itu. Seleksi obyek yang berada di Timeline Symbol Movie Clip dan Convert to Symbol > Behaviour Graphic. Insert Keyframe pada frame 10, Buat Motion Tween di antaranya. Poperties Frame 1, ubah menjadi Rotate CW 1. Klik icon Scene 1 untuk kembali ke Timeline Utama
4. Contoh ada di dalam folder Bab 09/09l.fla Tween dalam Timeline Symbol
BAB 9 : SYMBOL & SOUND
DURASI: 2 JAM
Sound dalam Flash
Sound merupakan salah satu unsur multimedia yang digunakan dalam flash. Format-format yang digunakan dalam pemakaian Flash yaitu for-mat wav, mp3, aif.
Import Sound
Mengimport suara dalam Flash sama halnya seperti mengimport obyek lain seperti gambar, video. Pilih File > Import to Library, kemudian drag obyek sound itu ke stage
Property Sound
Bila kita men drag sound dari Library ke stage, maka dalam Timeline terdapat garis yang menandakan sudah terdapat sound dalam stage. Pada Properties Sound terdapat file suara yang digunakan.
Pilihan Effect :
None: diterapkan bila tidak menggunakan efek apapun
Left Channel/Right Channel: memainkan sound dari kanal kiri atau kanan saja
Fade Left to Right/Fade Right to Left: berpindah sound dari kanal satu ke kanal lain
Fade In: secara perlahan menaikkan volume suara Fade Out: secara perlahan menurunkann volume suara Custom: mengedit secara bebas sound yang telah diterapkan Pilihan Sync:
Event: merupakan pilihan bila kita menginginkan Flash memainkan ke-seluruhan sound tanpa terpengaruh oleh panjangnya Timeline, bahkan bila ketika movie pada Timeline sudah selesai dimainkan, sound akan terus dimainkan sampai selesai. Dipakai untuk penggunaan sound un-tuk button seperti suara klik
Start: hampir sama dengan Event Stop: menghentikan sound
Stream: sound jenis ini tergantung pada jumlah durasi frame di Time-line. Dipakai misalnya untuk narasi karakter yang sedang berbicara. Repeat: untuk mengulangi sound yang digunakan dengan jumlah ter-tentu.
Loop: untuk mengulangi sound dengan jumlah yang tidak terbatas Mengimpor Sound
1. Pilih File > Import to Library, pilih file wav, drag dari Library ke Stage, ubah pilihan Properties Sound menjadi Event, Repeat 1, Test. Contoh ada di dalam folder Bab 09/09m.fla
2. Buat file baru, pilih File > Import to Library, pilih file mp3, drag dari Library ke Stage, ubah pilihan Properties Sound menjadi Event, Repeat 1, Test. Contoh ada di dalam folder Bab 09/09n.fla
3. Buat file baru, pilih File > Import to Library, pilih file mp3, drag dari Library ke Stage, ubah pilihan Properties Sound menjadi Event, Repeat 1, tambahkan frame menjadi 20, Test. Contoh ada di dalam folder Bab 09/09o.fla
4. Buat file baru, pilih File > Import to Library, pilih file mp3, drag dari Library ke Stage, ubah pilihan Properties Sound menjadi Stream,
Repeat 1, tambahkan frame menjadi 20, Test. Contoh ada di dalam folder Bab 09/09p.fla
Tombol ber Sound
1. Buat sebuah lingkaran, kemudian pilih klik kanan Convert to Sym-bol, pilih Behaviour Button. Pilih Import to Library , 2 buah sound yang berbeda.
2. Double Click Obyek Symbol tersebut untuk masuk dalam Timeline Symbol. Pada timeline terdapat 4 frame yaitu Up, Over, Down, Hit 3. Insert Keyframe untuk Over, Down dan Hit State.
4. Tambahkan layer baru, Insert Keyframe pada frame Over, kemudian dari Library, drag salah satu sound ke dalam stage. Insert Keyframe pada frame Down, drag sound yang lain. pada frame Hit, Insert Blank Keyframe
5. Contoh ada di dalam folder Bab 09/09p.fla
