BPK animasi1 mi3

P o l i t e k n i k

P r a t a m a M u l i a

S u r a k a r t a

J l . H a r y o P a n u l a r N o .

1 8 A S u r a k a r t a

0 2 7 1 - 7 1 2 6 3 7

p o l t e k @ p o l i t a m a . a c . i d

w w w . p o l i t a m a . a c . i d

Heru Widayat S.Kom Jurusan DIII Manajemen Informatika

[Animasi menggambarkan objek yang bergerak agar kelihatan

hidup. Membuat animasi berarti menggerakkan gambar seperti

kartun, tulisan dan lain-lain. Animasi mulai dikenal sejak media

televisi menyajikan gambar-gambar bergerak yang berasal dari

rekaman kamera maupun hasil karya seorang Animator.

Animasi sangat baik untuk presentasi, pemodelan, dokumentasi,

video klip dan lain-lain. Software yang digunakan dalam buku

ini adalah Macromedia Flash MX ]

Pemrograman

Animasi

[Pemrograman AnimasiI] Manajemen Informatika

Heru Widayat S.Kom | www.herusastro.web.id | @herusastro 2

BAB I

KONSEP DASAR ANIMASI

Animasi menggambarkan objek yang bergerak agar kelihatan hidup. Membuat animasi berarti

menggerakkan gambar seperti kartun, tulisan dan lain-lain. Animasi mulai dikenal sejak media televisi

menyajikan gambar-gambar bergerak yang berasal dari rekaman kamera maupun hasil karya seorang

Animator. Animasi sangat baik untuk presentasi, pemodelan, dokumentasi, video klip dan lain-lain.

Dahulu pembuatan animasi dilakukan dengan menggabungkan beberapa gambar yang bergerak

menjadi satu alur cerita yang menarik. Untuk membuat animasi selama satu durasi diperlukan jumlah

gambar (Frame) yang cukup banyak. Jumlah frame tiap detik (frame per second /fps) merupakan

satuan yang akan menghasilkan kualitas animasi. Makin banyak frame per detik, makin baik kualitas

animasi yang dihasilkan.

1.1. Animasi dalam Macromedia Flash Multimedia terdiri dari 2 kategori, yaitu linier dan non-linear (Interaktif). Movie non-linier dapat

berinteraksi dengan aplikasi web yang lain, flash movie adalah grafik dan animasi untuk situs

web yang merupakan grafik vector dengan ukuran file kecil, sehingga dapat di-load dalam

waktu singkat.

Flash movie dapat dijalankan dengan Flash Player melalui browser atau pada aplikasi stand

alone. Macromedia Flash dapat digunakan untuk membuat animasi interaktif, dimana

pengunjung dapat memasukkan data,kemudian Flash mengevaluasi dan menampilkan hasilnya.

Gambar 1.2 : Layout Macromedia Flash Profesional 8

Toolbox

Menu

Stage

Timeline

Panel

Properties



1.2. Mengenal Tool-Tool dan Istilah dalam Flash Area Flash terdiri dari atas 6 bagian yaitu :

� Menu, berisi kumpulan instruksi atau perintah-perintah yang digunakan dalam Flash,

misalnya, klik menu File > Save berfungsi untuk menyimpan dokumen,. Menu terletak pada

bagian atas area aFlash.

Gambar 1.1 : Menu Macromedia Flash

� Stage adalah dokumen atau layar yang akan digunakan untuk meletakkan obyek-obyek dalam

Flash. Stage terletak pada bagian tengah area Flash.

� Toolbox, berisi tool-tool yang berfungsi untuk membuat, menggambar, memilih dan

memanipulasi obyek atau isi yang terdapat di layar dan timeline. Toolbox dibagi menjadi 4

bagian, yaitu tools, view, colors, dan options.

Gambar 1.3 : Toolbox

� Timeline, berisi layer dan frame-frame yang berfungsi untuk mengontrol object yang akan

dianimasikan. Timeline terletak dibawah menu.

Gambar 1.4 : Timeline

Arrow

Line

Pen

Oval

Pencil

Free Transform Transform Ink Bottle

Eyedropper

Subselection

Lasso

Text

Rectangle

Brush

Fill Transform

Paint Bucket

Eraser

Hand

Zoom

Colors

Options



� Panels, berisi kontrol fungsi yang dipakai dalam flash, yang berfungsi untuk mengganti dan

memodifikasi berbagai atribut dari objek atau animasi secara cepat dan mudah. Panels

biasanya terletak di bagian kanan area Flash. Untuk menampilkan panel tertentu, klik menu

Window > (nama panel).

�

Gambar 1.5 : Panels Color Swatches

� Properties, berfungsi hampir sama dengan panels, hanya saja properties merupakan

penggabungan atau penyederhanaan dari panel. Jadi dapat lebih mempercepat dalam

mengganti dan memodifikasi berbagai atribut dari objek, animasi, frame dan komponen

secara langsung.

Gambar 1.6 : Properties



BAB II

MENGGAMBAR, MEWARNAI

DAN MEMANIPULASI TEKS

Dalam menggambar objek lingkaran atau segiempat contohnya, secara otomatis gambar yang

terbentuk terdiri dari dua unsur yaitu Fill (Bidang) dan Stroke (bingkai/pinggir)

Gambar 2.1. Fill dan Stroke pada objek lingkaran

2.1. Menggambar Dengan Pencil Tool Pensil tool dapat digunakan untuk membuat garis dan bidang. Supaya garis yang kita dapatkan

halus atau lurus, gunakan drawing mode untuk pencil tool.

a. Pilih Pencil Tool

b. Lihat di bagian bawah area kerja Flash. Terdapat Properties untuk mengubah tebal, warna

dan lainnya.

c. Pilih Drawing mode pada Options dalam Toolbox

� Straighten – untuk menggambar garis lurus.

� Smooth – untuk menggambar kurva yang halus

� Ink – Untuk menggambar garis dengan bebas

2.2. Menggambar Dengan Line Tool

a. Pilih Line Tool

b. Lihat Properties di bawah area kerja Flash untuk menentukan warna, style dan tebal dari

garis.

c. Pilih Arrow Tool dan Seleksi garis yang ada di stage, dengan garis yang masih diseleksi,

ukuran, lebar dan warna garis dapat diubah.

2.3. Menggambar Dengan Pen Tool

a. Pilih Pen Tool

b. Klik Mouse dengan pointer beberapa kali di Stage, maka akan membentuk beberapa titik

dengan garis lurus yang menghubungkannya.

c. Untuk membuat kurva terbuka atau tertutup dapat dilakukan dengan cara:

� Kurva Tertutup – Letakkan Pen Tool diatas titik pertama, kemudian klik tombol

mouse.

� Kurva Terbuka - Klik dua kali pada titik terakhir.

2.4. Menggambar Dengan Brush Tool Brush Tool digunakan untuk menggambar objek seperti dengan kuas pada melukis

a. Pilih Brush Tool

b. Pilih Fill Color, untuk menentukan warna

c. Pilihan Brush Tool

Fill (Bidang) Stroke (pinggir)



� Paint Normal – Lukisan menimpa seluruh gambar pada layer yang sama.

� Paint Fills – Lukisan pada area gambar dan area kosong, garis outline tetap ada

� Paint Behinds – Lukisan di Stage pada area yang kosong dibelakang gambar.

� Paint Selection – Lukisan di dalam area yang terpilih.

� Paint Inside – Lukisan apada area gambar, garis outline tetap ada.

2.5. Menggambar Dengan Oval dan Rectangle Tool

a. Untuk menggambar elips/lingkaran guanakan Oval Tool atau untuk menggambar kotak

dapat digunakan Rectangle Tool

b. Untuk menggambar warna Outline dan bidang dapat dipilih Stoke Color dan Fill Color.

2.6. Menggambar Object tanpa Fill

Telah disebutkan diatas, jika kita menggambar pasti akan terjadi 2 macam komponen. Yang

pertama adalah Stroke dan yang kedua adalah Fill. Untuk menggambar object tanpa Fill ada

caranya yaitu:

1. Misalnya kita ingin membuat oval. Klik Oval tool, lalu atur melalui toolbox bagian colors.

2. klik tombol Fill color, lalu klik tombol No Colors, dan biarkan saja tombol stroke Color.

Gambar 2.2. Pengaturan fill tanpa warna

3. Kemudian, gambarlah lingkaran. Dan hasilnya adalah sebagai berikut

Gambar 2.3. object tanpa fill

2.7. Overlapping Shapes Ketika membuat gambar garis yang melewati garis atau bidang lain, maka garis yang

overlapping akan terbagi menjadi beberapa bagian menurut titik potong.

Untuk melihat efek Overlapping line :

a. Gambar kotak

b. Gambar garis yang berada di atas kotak

c. Pisahkan garis atas dan bawah kotak dengan arrow tool

d. Pisahkan bidang di sebelah kiri garis dan sebelah kanan garis

2.8. Mewarnai Stroke dan Fill dari Toolbox

Untuk mengubah warna objek, objek tersebut harus diseleksi terlebih dahulu

a. Pilih Objek yang akan diubah warnanya.

b. Klik Stroke Color atau Fill Color , maka akan muncul pilihan warna

c. Setelah dipilih warna yang diinginkan, maka warna objek akan berubah.

Tombol Stroke color

Tombol Fill color

Tombol no colors



2.9. Mewarnai dengan Paint Bucket Selain berguna untuk mengisi area yang tertutup, Paint Bucket juga dapat digunakan untuk

mengisi bidang yang tidak tertutup. Tool ini berguna untuk mengisi warna solid, gradient, dan

bitmap.

Untuk menggunakan Paint Bucket Tool :

a. Pilih Bucket Tool

b. Pilih Fill Color pada Toolbox

c. Pada Options, tentukan pilihan Gap Size dapat menutup area yang tidak tertutup dengan

warna.

d. Klik pada Objek di Stage

2.10. Memberi warna solid dan gradasi dengan Panel Mixer

Panel Mixer digunakan untuk mengisi area dengan warna yang diatur dengan nilai pada panel

tersebut.

Gambar 2.4 : Panel color mixer

a. Pilih Window �� Color Mixer

b. Pilih Color mode, dengan mengklik tanda panah di kanan atas panel. Terdapat beberapa

pilihan ,mode yaitu RGB, HSB, dan Hex.

� Klik Color Bar yang berada di bagian bawah panel

� Masukkan nilai-nilai R, G, B bila berada pada mode RGB

� Masukkan nilai alpha

� Klik Kotak Fill atau Stroke untuk memilih warna

2.11. Mengetahui Warna dengan Eyedropper Tool Dengan menggunakan Wyedropper tool dapat diperoleh informasi mengenai warna yang tidak

diketahui pada suatu objek di stage

a. Pilih Eyedropper tool

b. Klik warna pada objek yang ingin diketahui warnanya pada saat itu juga tool berubah menjadi

Ink Bottle tool dan pada kotak fill color dalam toolbox berubah warnanya menjadi warna

objek.

c. Klik arrow tool

d. Klik kotak fill pada toolbox kemudian muncul kode hexadesimal dari warna tersebut di bagian

atas kotak yang berisis tabel warna.

2.12. Mengenal Tipe Dan Properties Teks

Dalam menulis teks di Flash tidak jauh beda dengan microsof Word. Di dalam Flash teks dapat

diedit ukuran, warna, spasi, jenis huruf, dan perataannya. Adapun pengaturannya dilakukan

melalui properties teks.

Terdapat pilihan 1. none 2. solid 3. linier (gradasi) 4. radial (gradasi) 5. bitmap (gambar)



Dalam Flash tipe teks dibedakan menjadi tiga yaitu :

a. Teks Statis (Statis teks)

Tipe teks ini biasanya digunakan untuk menampilkan tranformasi yang bersifat tetap (statis),

sehingga ketika movie dijalankan, teks tidak bisa berubah atau diedit lagi.

b. Teks Dinamis (Dynamic Text)

Tipe teks ini biasanya diguanakan untuk menampilkan informasi yang bersifat dinamis, atau

berubah sehingga ketika movie dijalankan, teks bisa berubah atau di-edit, misalnya untuk

menampilkan tanggal, jam, mengakses teks dari suatu file dan lain-lain.

c. Teks Input (Input Text) Tipe teks ini meminta User untuk memasukkan atau mengisikan tulisan pada kotak yang

telah disediakan sehingga ketika movie dijalankan, user bisa menulis atau memasukkan data

pada kotak tersebut, biasanya digunakan dalam pembuatan form aplikasi seperti login, buku

tamu, dan lain-lain. Aplikasi seperti ini biasanya memerlukan masukan dari user mengenai

nama, alamat, password dan lain-lain.

Didalam Flash terdapat istilah Embeded dan Device font. Embedeb Font adalah font yang telah

diinstal pada sistem dan akan disertakan (embed) pada file SWF, sedangkan Device font adalah

font yang digunakan sesuai dengan font yang ada di komputer lokal. Bila device font tidak ada

pada lokal komputer, flash player akan mengambil font yang mirip dengannya.

2.13. Cara Menulis dengan Text Tool

a. Pilih File �� New untuk memulai pekerjaan baru

b. Klik Text Tool

c. Kursor akan berubah menjadi tanda + saat diarahkan pada stage. Klik pada stage, maka

muncul kotak tulisan.

d. Ketik tulisan pada stage, secara otomatis kotak akan bertambah lebar sesuai panjang teks yang

dibuat

e. Block handle dapat ditarik kekiri dan kekanan untuk mengatur tampilan teks.

2.14. Properties Character Properties Character yang berada di bawah area flas ketika kita mengetikkan suatu teks

digunakan untuk menentukan jenis huruf dengan atributnya .

Gambar 2.5 : Properties Teks

a. Ubahlah sesuai dengan keinginan anda.

b. Untuk dapat mengubah teks, terlebih dahulu teks harus diseleksi

2.15. Transformasi Teks Selain gambar teks di dalam Flash juga dapat di transformasi, yaitu translasi, skala dan rotasi.

Translasi adalah perpindahan posisi teks menurut garis lurus, Skala yaitu perubahan ukuran

teks, Sedangkan Rotasi adalah perubahan lokasi teks menurut garis melingkar.

Untuk melakukan tranformasi terhadap teks :

a. Klik pada teks yang ada di stage

b. Pilih Modify �� Transform, bila teks tersebut akan diubah skalanya pilih Scale, bila ingin

diputar pilih Rotate.



BAB III

LAYER, FRAME, KEYFRAME DAN BLANK KEYFRAME

3.1. Memahami Konsep Layer

Layer (lapisan) diumpamakan seperti tumpukan lembaran yang transparan. Objek yang berada

di layer paling atas akan menutupi objek yang berada di layer bawah.

Gambar 3.1 : Layer

Kegunaan dari layer :

a. Membuat animasi lebih dari Satu

b. Untuk mengkoordinir elemen-elemen dalam suatu movie

c. Agar tidak terjadi pengirisan objek antara yang satu dengan objek yang lain.

d. Agar dapat lebih cepat menemukan objek, dan lain-lain.

Untuk memahami layer, kita akan menggambar objek pada layer yang berbeda, langkah-

langkahnya :

a. Ketika bekerja di Flash, secara otomatis disediakan satu layer (Layer 1), klik Rectangle

tool, lalu gambarlah segiempat.

b. Klik menu Insert �� New Layer untuk menambah layer baru (Layer 2), klik Oval Tool,

lalu gambarlah lingkaran di layer 2

c. Tambahkanlah satu layer lagi (layer 3), klik Rectangle Tool, lalu gambarlah segiempat

memanjang.

d. Klik layer 2 di timeline, lalu pindahkan lingkaran keatas segiempat. Klik layer 3 lalu

pindahkan segiempat memanjang ke atas segiempat dan lingkaran

Dapat disimpulkan bahwa penggunaan layer sangat membantu dalam membuat gambar. Dimana

gambar di layer yang satu dengan gambar di layer yang lain tidak mempengaruhi walaupun

saling bertumpuk dan memotong.

3.2. Menyembunyikan dan Mengunci Layer Dalam Flash terdapat fasilitas untuk menyembunikan dan mengunci layer. Layer yang

disembunyikan diberi tanda � berwarna merah dilambangkan dengan ikon mata dan layer yang

dikunci dilambangkan dengan ikon gembok. Cara menggunakannya:

� Klik titik hitam yang berada di samping kanan layer.

3.3. Memanipulasi Layer Dalam Flash, layer sangat berperan dalam membuat efek-efek sspesial dan animasi yang

menarik. Cara memanipulasi layer :

a. Menambah layer

Klik menu Insert �� Layer

b. Mengganti Nama Layer

Klik 2 kali pada layer, lalu ganti namanya dengan mengetik.

c. Memindahkan urutan layer

Klik layer yang akan dipindah alau seret ke atas atau kebawah layer yang lain.

d. Menghapus layer

Layer



Klik tombol delete layer

3.4. Frame, Keyframe dan Blank Keyframe

Sebelum membuat animasi modal awal yang harus anda ketahui tidak hanya pandai

menggambar, anda harus menguasai layer, frame, keyframe dan blank keyframe. Kenapa anda

harus mengetahui hal tersebut?. Karena disitulah nanti gambar dan animasi anda letakkan.

Gambar 3.2 : tanda frame, keyframe dan blank keyframe.

1. Frame Frame, dapat diumpamakan seperti film, yaitu film merupakan kumpulan gambar yang

dimaikan dengan kecepatan tertentu, sehingga gambar tersebut terlihat bergerak.

2. Keyframe

Keyframe artinya frame tersebut berisi object. Dan pada keyframe isinya dapat dicopy

dengan perintah insert keyframe

3. Blank Keyframe Frame yang kosong. Dilambangkan dengan bulatan putih. Dan apabila blank keyframe ini

berisi objek maka frame ini akan berubah menjadi keyframe

keyframe Blank keyframe frame



BAB IV

LIBRARY, SYMBOL DAN INSTANCE

Library didalam Flash berarti tempat penyimpanan elemen-elemen yang digunakan dalam

movie, seperti gambar, teks, animasi dan suara. Library sangat berperan dalam membuat movie,

didalamnya tersimpan symbol yang berupa gambar, teks, button, animasi maupun suara. Semua objek

di stage yang dijadikan symbol akan tersimpan dalam library.

Sebuah symbol dari library yang diletakkan di stage disebut Instance, sedangkan symbol yang

berada di library disebut Master Symbol.

Untuk mempermudah membuat dan menghapus symbol, mengurutkan symbol, serta membuat folder

untuk memudahkan pengelolaan symbol gunakanlah panel Library.

Gambar 4.1 : Library

4.1 Membuat Symbol

Untuk membuat symbol :

a. Pilih File �� New untuk membuat movie baru

b. Pilih Oval tool, kemudian buat gambar lingkaran di stage

c. Gambar tersebut diseleksi dengan Arrow Tool

d. Pilih Insert �� Convert to Symbol, maka akan keluar kotak dialog symbol properties. Pada

behaviour terdapat tiga macam pilihan, yaitu :

� Movie Clip – symbol yang menggambarkan animasi objek

� Button – symbol yang menggambarkan button yang digunakan untuk interaksi

dengan sesuatu.

� Graphic – symbol yang menggambarkan object lain.

Gambar 4.2 : Convert to symbol



e. Ketik ”lingkaran” pada field name, dan berikan tanda pada pilihan graphic pada behaviour

f. Buka Library, dengan memilih Window �� Library, maka akan tampil symbol graphic

dengan nama “lingkaran”

4.2 Membuat Instance Telah disebutkan sebelumnya. Instance adalah sebuah symbol yang diletakkan di stage. Dengan

satu symbol dapat dibuat banyak instance yang memiliki properties berbeda-beda, sperti warna

dan ukuran. Semua instance memilki bentuk yang sama dengan symbol.

Untuk membuat instance:

a. Drag symbol dari library ke stage

b. Dalam stage muncul gambar yang sesai dengan symbol. Gambar tersebut disebut instance

4.3 Mengubah symbol Untuk mengubah symbol lakukan langkah berikut :

a. klik dua kali symbol pada library yang akan diubah.

b. Maka akan masuk ke dalam editing symbol

c. Lakukanlah perubahan.

4.4 Membuat Button

Button digunakan sebagai tombol interaksi sehingga user dapat melakukan interaksi pada movie.

Button sebenarnya merupakan suatu movie clip interaktif yangterdiri dari 4 frame . setiap frame

mempunyai fungsi sendiri-sendiri :

a. Frame 1 (Up) – tampilan ketika kursor tidak diarea tombol.

b. Frame 2 (Over) – tampilan ketika kursor berada di area tombol

c. Frame 3 (Down) – tampilan ketika tombol ditekan

d. Frame 4 (Hit) – untuk menentuakan area yang merespon saat mouse di-klik. Area ini tidak

kelihatan saat movie berjalan.

Gambar 4.3 : Frame Button

Untuk membuat tombol dengan efek Rollover :

a. Buka file Flash baru

b. Gunakan menu Insert �� New Symbol

c. Pada kotak dialog symbol properties, berikan nama “tombol” pada kotak name dan pilih

behaviour Button, kemudian tekan tombol OK, Flash menampilkan empat buah frame

untuk tombol pada timeline.

d. Buat bentuk kotak dengan warna gradient putih hitam pada frame UP. Setelah kotak terbuat,

flash secara otomatis mengubah frame UP menjadi suatu keyframe, perhatikanlah

perubahan yang terjadi pada timeline.

e. Tetap di posisi frame UP ketik tulisan UP diatas gambar.



f. Klik kanan tombol mouse pada kotak frame Over, kemudian pilih Insert keyframe untuk

membuat frame over menjadi suatu keyframe, Flash menyalin kotak pada frame UP untuk

frame Over.

g. Gantiwarna gradient dengan mengubahnya menjadi hitam putih, untuk melkukan hal itu,

klik tool Paint Bucket pada toolbox, kemudian tombol transform Fill pada bagian bawah

toolbox.

h. Klik pada warna gradien. Pindahkan lingkaran kecil disisi kanan atas kotak ke sisi bawah

kotak. Flash mengubah warna gradien menjadi hitam putih.

i. Ganti tulisan “UP” dengan “Over” pada tombol tersebut.

j. Buat frame dengan menjadi suatu keyframe dengan mengklik tom kanan mouse, dan

kwemudian pilih Insert Keyframe.

k. Ganti tulisan “Over” dengan “Down” pada tombol tersebut.

l. Ganti warna gradient dengan gradient lingkaran hitam putih

m. Buat frame Hit menjadi suatu keyframe kemudian ubah warnanya menjadi hitam semua.

n. Akhiri pembuatan tombol dengan mengklik Scene1 di atas pojok kiri atas timeline.

o. Buka panel Library dengan menekan Ctrl+L. lalu tarik symbol untuk tombol tersebut ke

stage.

p. Pada menu comtrol, pilih Enable Simple Button untuk mengaktifkan tombol di stage

q. Cobalah untuk meletakkan mouse di atas tombol, menekan tombol, dan kemudian

melepaskannya.

4.5 Common Libraries Common Libraries adalah Library yang sudah ada dan disediakan oleh flash untuk diguanakan,

sehingga tidak perlu membuatnya lagi. Dalam common Libraries terdapat button, Graphics.,

Learning Interaction, Movie Clip, Smart Clip, dan Sound. Cara menggunakan Common Libraries

:

a. Pilih Window �� Common Libraris �� Button

b. Ambil salah satu button dari common libraries dan drag ke dalam stage.

4.6 Shared Library Shared library adalah library yang dapat digunakan bersama-sama oleh movie. Menggunakan

shared library akan mengoptimalkan aliran program, sehingga mempercepat waktu loading.

Shared Library bermanfaat untuk :

a. Menggunakan file suara antar site

b. Menyediakan sumber tunggal untuk font dalam elemen animasi yang dapat diguanakan oleh

beberapa scene dan movie

c. Membuat library pusat untuk digunakan bersama.

4.7 Memodifikasi Instance Setiap instance pada stage bisa memiliki atribut yang berbeda-beda. Instance tersebut bisa

memutar memperbesar, memperkecil, mengubah warna, mengatur kecerahan, dan membuat

transparan.

Khusus untuk perubahan warna instance :

a. Klik instance yang ingin diubah

b. Tampilkan Properties dengan menggunakan menu Window �� Properties

Pada menu yang terseleksia pilih:



� Brightness - untuk mengubah kecerahan warna

� Tint – mengubah warna

� Alpha – membuat transparan

� Advanced – kombinasi dari ketiga pilihan.



BAB V

A N I M A S I

Animasi dibuat dengan mengubah dan memindahkan suatu objek pada setiap frame.

Pembuatan animasi bila dilakukan terhadap suatu objek atau banyak secara bersamaan.

Pada dasarnya ada tiga teknik pembuatan animasi dalam flash:

a. Animasi frame, - yaitu animasi yang dibuat dengan mengubah objek pada setiap frame. Pada

animasi frame, kitra harus secara manual membuat objek pada setiap frame. Ini merupakan

cara yang digunakan dalam pembuatan animasi tradisional

b. Animasi bentuk – Motion Shape , - yaitu animasi yang dibuat dengan mengubah bentuk

suatu objek.

Yang dimaksud dengan animasi bentuk dalam flash adalah Anda membuat suatu bentuk pada

awal frame dan kemudian mengubah bentuknya di akhir frame, flash yang mengerjakannya

perubahan bentuk tersebut untuk anda sehingga menjadi suatu animasi.

Selain membuat perubahan bentuk, dalam waktu yang bersamaan Anda juga bisa memberikan

efek perubahan warna, ukuran dan lokasi.

Flash tidak dapat mengubah bentuk gambar bitmap, teks, objek gabungan, dan symbol, untuk

membuat animasi bentuk terhadap objek-objek tersebut Anda harus mematahkannya terlebih

dahulu dengan menggunakan Break Apart.

c. Animasi gerakan – Motion Tween, - yaitu animasi yang dibuat dengan memindahkan posisi

suatu objek. Pada animasi gerak di Flash bisa didefinisikan perubahan posisi, ukuran, warna,

dan rotasi suatu objek pada awal keyframe dan akhir keyframe. Animasi gerak hanya dapat

digunakan untuk objek gabungan dan smbol. Objek yang kita buat di stage akan berubah

langsung menjadi symbol sewaktu kita membuat animasi gerak. Ini perbedaan utama dengan

animasi bentuk yang justru tidak dapat bekerja pada objek gabungan dan harus menggunakan

objek yang dapat dibentuk ulang agar dapat dibuat menjadi animasi.

Untuk pembuatan animasi yang komplek, ketiga teknik ini dapat digunakan secara bersamaan.



LATIHAN A

LATIHAN A 01

Membuat Animasi Frame

Sebagai contoh latihan, kita akan membuat animasi frame sederhana, yaitu suatu oval yang

berputar 360 derajat. Untuk membuat animasi frame, buatlah setiap frame menjadi keyframe,

perhatikan bahwa setiap kali Anda menambahkan keyframe, timeline akan membuat bulatan

hitam pada frame tersebut.

Gambar 5.1. Animasi oval berputar

a. Pada frame 1, buatlah bentuk oval

b. Klik kanan tombol mouse pada frame 2, pilih menu Insert keyframe.

c. Pilih menu Modify �� Transform �� Rotate 900 CW untuk memutar oval 90 derajat

kekanan.

d. Klik kanan tombol mouse pada frame 3, pilih menu Insert keyframe.

e. Pilih Menu Modify �� Transform �� Rotate 900 CW untuk memutar oval 90 derajat

kekanan.

f. Klik kanan tombol mouse pada frame 4, pilih menu Insert keyframe.

g. Pilih Menu Modify �� Transform �� Rotate 900 CW untuk memutar oval 90 derajat

kekanan.

h. Pilih menu Control �� Test Movie, untuk mencoba menjalankan animasi.

Menambah Frame Untuk Memperlambat Animasi Untuk memperlambat jalannya animasi frame, bisa didapat dengan menambah frame.

a. Klik keyframe1, pada animasi yang telah dibuat sebelumya, kemudian tambahkan frame

dengan cara

- Tekan tombol F5 atau klik kanan tombol mouse pada keyframe1, pilih Insert Frame

atau gunakan menu Insert Frame.

b. Tekan terus tombol F5 sampai keyframe kedua mancapai frame 10. Flash menambahkan

kotak kosong berwarna abu-abu untuk penanada suatu frame. Tanda kotak kecil

menyatakan bahwa frame tersebut merupakan akhir dari suatu keyframe.

Gambar 5.1. Insert frame pada frame 1 hingga frame 10



c. Klik keyframe 2, lakukanlah seperi langkah 1 - 2, demikian dengan keyframe-keyframa

yang lain.

Menghapus Frame Untuk menghapus frame lakukan langkah berikut :

a. Klik kanan frame yang akan dihapus.

b. Muncul menu Remove Frame, klik menu tersebut. Atau langsung dengan kombinasi

tombol keyboard shift + F5.

Melihat isi setiap frame dengan Onion Skinning

Setiap Anda berpindah fram, stage hanya memperlihatkan objek pada frame tersebut, jika

diinginkan Anda dapat menampilkna isi beberapa frame atau semua frame sekaligus pada

stage dengan menggunakan Onion Skinning.

Gambar 5.3. Penggunaan Onion Skining

a. Klik pada frame yang isi frame-frame disekitarnya yang ingin ditampilkan.

b. Klik tombol Onion Skinning yang terletak di bagian bawah timeline.

Gambar 5.4. hasil Onion Skining pada animasi perpindahan bola

LATIHAN A 02

Membuat Animasi Bentuk Untuk mengerti apa animasi bentuk itu, perhatikan dan cobalah animasi perubahan oval menjadi kotak

persegi.

a. Bentuk Oval di Frame 1

b. Kilk frame 15 dan pili Insert �� Keyframe atau tekan tombol F6 untuk membuat keyframe akhir.

c. Hapus gambar oval pada frame 15 dan gantikan dengan gambar kotak.

Onion Skining



Gambar 5.5. Animasi perubahan bentuk oval menjadi kotak

d. Klik salah satu frame antara keyframe awal (frame 1) dan keyframe akkhir (frame 15)

e. Lihat properties frame, pilih Shape dari menu Tweening. Flash menambahkan anak panah pada

timeline yang menyatakan bahwa ada suatu animasi di dalamnya.

f. Jalankan animasi dengan Control �� Test Movie.

Membuat Animasi Bentuk Teks

Untuk teks, bitmap dan objek gabungan,kita tidak bisa melakukan perubahan begitu saja.

Untuk mengubahnya kita harus mematahkannya dengan perintah Modify �� Break Apart.

Pada Latihan ini kita akan mengubah angka 1 menjadi angka 2.

Gambar 5.6. Animasi perubahan bentuk angka 1 menjadi angka 2

a. Buka file Flash Baru.

b. Klik Tool Text pada toolbox

c. Ketikkan angka 1 pada stage

d. Buatlah tebal dan perbesar ukuran supaya nantinya perubahan bentuk mudah untuk dilihat.

e. Patahkan tulisan angka 1 dengan menggunakan menu Modify �� Break Apart, dengan

catatan angka 1 masih terseleksi.

f. Buat keyframe akhir pada frame 15, guanakan menu Insert �� Keyframe.



g. Hapus angka 1 yang baru saja dipatahkan.

h. Klik Tool Text, ketikkan angka 2.

i. Patahkan dengn menu Modify �� Break Apart agar bisa diubah bentunya. Flash kembali

menampilkan tanda titik-titik kecil pada tulisan ini.

j. Klik sembarang frame di antara keyframe awal dan keyframe akhir lalu pada panel frame,

pilihlah shape sebagai jenis tweening.

k. Jalankan animasi.

Menggunakan Shape Hint Untuk mengatur perubahan bentuk yang terjadi, anda bisa menggunakan shape hint. Shape

hint ditandai dengan lngkaran kecil berwarna dengan huruf didalamnya (a samapai z). Anda

bisa mambuat sebanyak 26 shape hint untuk setiap objek. Untuk menngunakan shape hint :

Gambar 5.7. Animasi perubahan bentuk angka 1 menjadi angka 2 dengan shape hint

a. Klik Keyframe pertama dari suatu animasi bentuk

b. Gunakan menu Modify �� Shape �� Add Shape Hint. Untuk menambahkan shape hint

pada objek. Flash menampilkan huruf “a” di dalam lingkaran kecil.

c. Pndahkan shape hint ke tempat yang ingin ditandai.

d. Klik Keyframe akhir

e. Pindahkan Shape hint ke suatu posisi di objek dari keyframe akhir.

f. Mainkan animasinya.

Animasi Dengan Efek Perubahan Warna Animasi ini tidak merubah posisi dari objek, tetapi hanya mengubah warna. Untuk

memperjelas, coba dan pelajari contoh berikut :

a. Buat file baru

b. Pada frame 1 buat lingkaran dengan warna merah.

c. Kemudian pada frame 10 pilih Insert �� keyFrame.

d. Tetap pada posisi frame 10 ubah warna lingkaran dengan warna orange.

e. Klik salah satu frame diantara fram 1 sampai dengan frame 10

f. Pada Propertis pilih Shape pada boxlist Tween

g. Jalankan animasi



LATIHAN A 03

Membuat Animasi perpindahan

Animasi perpindahan adalah animasi yang menunjukkan perpindahan suatu benda dari tempat pertama

menuju ketempat kedua atau berikutnya.

Contoh animasi perpindahan balok

1. Buat file baru di Flash

2. Pada timeline di Frame1 buat suatu balok dengan menggunakan rectangle tool

3. kemudian klik frame 1 di timeline pilih menu insert > create motion tween

4. kemudian pilih salah satu frame disebelah kanan frame 1. misalnya frame 10. Maka klik frame

10 kemudian pilih menu Insert Keyframe.

5. Masih tetap bekerja di frame 10. klik balok kemudian drage ke tempat yang lain. Misalnya

kesebelah kanan.

Gambar 5.8. Animasi perpindahan

6. Jalankan animasinya.

Animasi Motion Guide Tween Yang dimaksud dengan animasi motion guide tween adalah animasi yang mengikuti suatu

alur/jalur/lintasan. Cara membuatnya:

1. Buat file baru di Flash

2. Pada timeline di Frame1 buat suatu bola dengan menggunakan oval tool

3. kemudian klik frame 1 di timeline pilih menu insert > create motion tween

4. kemudian pilih salah satu frame disebelah kanan frame 1. misalnya frame 10. Maka klik

frame 10 kemudian pilih menu Insert Keyframe.

5. Masih tetap bekerja di frame 10. klik bola kemudian drage ke tempat yang lain. Misalnya

kesebelah kanan.

Gambar 5.9. Animasi perpindahan bola

6. kemudian pilih menu insert > motion guide, maka di timeline akan muncu; layer baru dengan

nama Guide layer.

Gambar 5.10. Guide layer pada di timeline

Drag

drag



7. pada guide : layer 1, klik frame 1, lalu klik pencil tool dan gambarlah garis seperti berikut:

Gambar 5.11. garis sebagai lintasan

8. setelah garis selesai dibuat. Secara otomatis bola pada frame 1 akan menepati pada awal

lintasan, dan bola pada frame 10 (frame terakhir) akan menempati ujung garis (akhir lintasan)

dan animasi siap untuk dijalankan.

Membuat Bola Memantul dengan Animasi Gerak

Efek bola memantul dari atas ke bawah dan kembali lagi keatas dibuat dengan hanya dengan

mengubah posisi bola tersebut, yaitu dengan memindahkannya ke bawah dan kemudian

memantulkannya lagi keatas.

Gambar 5.12 Animasi bola memantul

a. Buat file Flash baru.

b. Pada Timeline, pilih Frame 1

c. Dalam toolbox,pilih Tool Oval untuk membuat bola

d. Hilangkan stroke dengan mengunakan Stroke Color pada bagian color dalam Toolbox,

dan kemudian klik No Color.

e. Masih di frame 1. gunakan Insert �� Create Motion Tween untuk membuat animasi

gerak. Flash mengubah bola menjadi suatu symbol dan menempatkannya di library.

f. Pada timeline, klik frame 5

g. Gunakan menu insert �� keyframe.

h. Pada frame 5, klik tool arrow, kemudian pindahkan bola ke bawah untukmembuat gerakan

bola jatuh ke bawah, pada timeline flash mengganti tanda garis-garis dengan tanda anak

panah yang menandakan bahwa animasi gerak telah lengkap. Perhatikan juga bahwa Flash

secara otomatis mengubah frame 5 menjadi suatu keyframe dengan menambahkan suatu

tanda bulatan hitam pada frame.



i. Untuk memantulkan bola ke atas, tambahkanlah frame dengan mengklik frame 10

kemudian pilih Insert �� keyFrame.

j. Pindahkan bola kembali keatas.

k. Mainkan animasi dengan Control �� Test Movie.

Animasi Rotasi Animasi Rotasi adalaah animasi objek atau teks yang berputar seperti putaran roda, jam, kincir

angin, helicopter, dan lain-lain. Kita bisa memutarnya searaah jarum jam (CW : Clock Wise)

atau sebaliknya (CCW : Counter Clock Wise)

Pada contoh ini,kita akan membuat abjek segiempat panjang yang memutar searah jarum jam

dari kiri ke kanan.

a. Klik rectangle Tool lalu gambarlah segiempat panjang di layar.

b. Pada timeline, klik kanan pada frame 1, pilihlah Create Motion Tween.

c. Klik kanan pada frame 15, pilihlah Insert keyframe, lalu pindahkankan segi empat

panjang ke kanan layar.

d. Klik Frame 1 untuk kembali ke frame 1. lalu atur Properties isikan pada Rotate : CW

dengan nilai 2.

Gambar 5.13 Animasi Rotasi

Rotate : CW



LATIHAN A 04

Animasi Masking

Animasi masking adalah animasi yang menyembunyikan sebagian dari object. Animasi ini biasanya

digunakan unruk efek kaca pembesar atau lampu sorot. Cara membuat animasi masking.

1. Buat file baru

2. Di frame 1, layer 1 pergunakan Text tool untk membuat tulisan “The Mask”

3. Klik Frame 25 kemudian pilih menu insert > Frame

4. Klik menu insert > new layer untuk membuat layer baru (layer 2). Klik oval tool, lalu gambar

lingkaran di sebelah kiri teks

Gambar 5.14 lingkaran di kiri the mask

5. Pada timeline klik kanan frame 1, pilih insert > create motion tween

6. klik frame 25 pilih insert > keyframe,lalu pindahkan lingkaran ke sebelah kanan tulisan.

Gambar 5.15 lingkaran di kanan the mask

7. Pilihlah layer 2 kemudian klik kanan pilih mask

Gambar 5.16 Pembuatan layer Mask

8. Akan terjadi layer seperti gambar dibawah ini. Dan animasi siap untuk dijalankan.

Gambar 5.17 tampilan layer Mask



LATIHAN A 05

Animasi Transparan

Yang dimaksud dengan animasi transparan pada point ini adalah animasi perubahan suatu

benda/tulisan dari kelihatan menjadi tidak kelihatan dengan suatu proses samar-samar

Cara membuatnya:

1. Buat file baru

2. Di timeline di frame 1 layer 1 buatlah suatu tulisan misalnya “Welcome to my room”

3. Kemudian klik frame 1 pilih menu insert > create motion tween

4. klik frame 10 (sebagai frame terakhir) pilih menu insert > keyframe

5. Masih bekerja di frame 10 pilih tulisan “welcome to my room” aktifkan panel properties (jika

belum aktif pilih menu window > properties) pada listbox color pilih alpha dengan presentase

0%

Gambar 5.14 Properties alpha

6. Dengan memilih presentase 0%, maka benda/tulisan akan tidak tampak. Dan animasi siap untuk

dijalankan.

Gambar 5.15 animasi transparan

LATIHAN A 06

Memasukkan file suara kedalam Library sebagai Symbol a. Bukalah file animasi yang akan diberi efek suara.

b. Klk Menu File �� Import, lalu pilih file suara dengan format MP3 atau WAV.

c. Klik menu Window �� Library, akan terlihat file suara hasil import tadi klik dan seret suara tadi

ke dalam objek.

Catatan :

� File suara juga dapat digunakan untuk membantu mempercantik animasi tombol

(button) sesuai dengan keadaannya, maksudnya, apakah dalam keadaa Up , down, atau

over

� Untuk mengetahui bahwa efek suara sudah ada pada animasi, lihatlah frame di

timeline berubah menjadi gelombang.

� Penambahhan suara ke dalam animasi akan memperbesar ukuran file.

� Flash juga menyertakan suara siap pakai, klik menu Windows �� Common Libraries

�� Sounds.



Gambar 6.1 : Library-sounds

LATIHAN A 07

Impor Gambar dan Pengelolaannya

Kita bisa menyertakan atu mengimpor suatu gambar dengan format Jpg atau Gif ke Flash untuk

dianimasikan atau hanya sebagai gambar statis (background). Gambar yang ita sertakan tersebut

adalah gambar jenis bitmap. Sehingga mempengaruhi ukuran file flash menjadi lebih besar sedangkan

Flash berbasis vektor, karena gambar vektor mempengaruhi ukuran yang sangat kecil, sehinnga cepat

dijalankan.

Oleh karena itu, Flash menyediakan suatu fasilitas Trace Bitmap yang dapat mengubah atau

mengkonversi bitmap menjadi Vektor. Adapun caranya adalah sebagai berikut :

a. Klk Menu File �� Import, lalu pilih gambar dengan format Jpeg atau Gif.

b. Setelah mencul di stage klik Arrow Tool, lalu klik pada gambar untuk memilihnya.

c. Klik menu Modify �� Trace Bitmap, isikan pada color Trehold : 10, minimum ara : 1 pixel,

Curve Fit : Pixels, dan corner Threshold : Many Corners. (ingat isisan pada masing-masing

inputan angka tergantung gambar).

Catatan :

� Gambar Bitmap yang dikonversi menjadi Vektor terkadang akan menjadi rusak dan

tidak bagus apabila dalam gambar tersebut terlalu banyak warna atau gradasi.

LATIHAN A 08

Impor Video dan Pengelolaannya Format file Video yang dapat diimpor oleh Flash Profesional 8 adalah Mpeg Movie (*.mpeg), video

for windows (*.avi), Quick Time Movie (*.Mov) dan digita movie (*.dv dan *.dvi). ini karena pada

flahs MX sudah terdapat Codec Sorenson Spark, suatu program yang dapat menampilkan video

dengan ukuran kecil, tetapi tetap menjaga kualitas dari Video tersebut.

Pada contoh dibawah ini, kita akan mencoba mengimpor video yang berformat *.mpeg Movie

kedalam Flash



a. Buat file bau, lalu klik menu File �� import to library dan carilah file video, misalnya

payung.mpeg, maka akan tampil kotak dialognya.

b. Setelah anda klijk tombol Ok, maka akan tampil keterangan bahwa anda memerlukan sekian

frame (misalnya 100 frame) untuk menampilkan video tersebut di flash, jawab Yes.

Catatan:

Keterangan dari kotak dialog Import Video Setting :

� Quality – Mengatur kualitas video, semakin tinggi nilainya semakin bagus video yang

akan ditampilkan, tetapi semakin besar pula ukuran filenya.

Gambar 6.3 : Impor Video

� Keyframe interval – Mengatur frekuensi keyframe video, semakin kecil nilainya,

semakin cepat video yang ditampilkan, tetapi semakinbessar pula ukuran filenya.

� Scale – Mengatur ukuran video yang ditampilkan apabila 100% berarti video ditampilkan

sesuai dengan ukuran asli video tersebut.

� Syncronize Video to Maromedia Flash Document Rate –Menyesuaikan frame di video

frame dengan frame di Flash.

� Number of Video frames to encode per number of macromedia Flash frames –

menentukan kecepatan frame di video dengan frame di Flash. Apabila 1:1, kecepatan

frame di video sama dengan kecepatan frame di Flash. Pada contoh file video : payung

.Mpeg, kita bisa melihat di kotak dialog import Video pada bagian length terlihat 30

Frame, berarti kita membuat perbandingan kira-kira 1:2.

� Impot audio – menyertakan suara video ketika ditampilkan di Flash.



BAB VI

ACTIONSCRIPT DAN ANIMASI INTERAKTIF

ActionsScript bisa disebut dengan bahasa pemrogramannya Flash. Dengan Actions Script ini, kita

bisa membuat movie yang interaktif, maksudnya user bisa berinteraksi dengan movie tersebut, seperti

mengontrol navigasi, memasukkan informasi, menggerakkan ubjek dengan keyboard, mengubah bentuk

kursor mouse, membuat menu dan lain sebagainya.

ActionsScript atau Action dibagi menjadi dua, yaitu :

� Action Frame adalah Action yang diberikan pada Frame, frame yang berisi Action terdapat tanda a

pada framenya.

Gambar 7.1 : Frame 20 berisi action

� Action Objek adalah Action yang diberikan pada objek, baik berupa tombol atau movie clip.

ActionScript mempunyai panel, didalamnya kita bisa memberikan dan mengatur action. Untuk

menampilkannya, klik menu Window �� Action.

� Action Category – menunjukkan action diberikan pada frame atau pada objek (button atau movie

clip)

Gambar 7.2 : Panel Action

� Action Toolbox – berisi kumpulan action yang disediakan oleh Flash dan dapat dipakai langsung

dengan melakukan klik dua kali pada action yang diinginkan.

� Action Parameter – adalah properti dari suatu action, kits bisa mengisikan nilai didalamnya dan

setipa action memiliki properti yang berbeda.

� Script Pane – merupakan tempat dituliskannya kode dan action.

� View Options – merupakan tombol untuk berpindah mode tampilan editor action

Ada dua mode tampilan editor action, yaitu :

� Mode Normal – adalah mode standar yang dapat memudahkankita untuk melakukan script

denganhanya meilih Actions yang sudah disediakan Flash disebelah kiri Panel Actions yang disebut

Tollbox list atau dengan menekan tombol plus (+).

� Mode Expert – adalah mode yang disediakan Flash bagi yangsudah terbiasa dengan pemrograman

script. Sehingga dapat dengan bebas menuliskan script-scriptnya.

Gambar 7.3 : Mode Action



Untuk berpindah dari satu mode ke mode yang lainnya, klik tombol view options, lalu pilih mode yang

diinginkan .

Catatan :

� Cara paling mudah untuk membedakan antar action frame dengan action objek, lihat pada action

category-nya,seperti pada gambar 7.2. pada pojok kiri atas.

� Selain menggunakan action toolbox, kitajuga menggunakan action dengan memilih tanda plus (+).



LATIHAN B

LATIHAN B 01

Membuat Tombol Tombol (Button )merupakan salah satu unsure yang sangat penting dalm membuat animasi yng

interaktif, fungsi utamanya untuk navigasi dan pengontrolan.

Button sebenarnya merupakan suatu movie clip interaktif yangterdiri dari 4 frame . setiap frame

mempunyai fungsi sendiri-sendiri :

a. Frame 1 (Up) – tampilan ketika kursor tidak diarea tombol.

b. Frame 2 (Over) – tampilan ketika kursor berada di area tombol

c. Frame 3 (Down) – tampilan ketika tombol ditekan

d. Frame 4 (Hit) – untuk menentuakan area yang merespon saat mouse di-klik. Area ini tidak

kelihatan saat movie berjalan.

Untuk membuat tombol dengan efek Rollover :

a. Buka file Flash baru

b. Gunakan menu Insert �� New Symbol

c. Pada kotak dialog symbol properties, berikan nama “tombol” pada kotak name dan pilih

behaviour Button, kemudian tekan tombol OK, Flash menampilkan empat buah frame untuk

tombol pada timeline.

Gambar 7.4 : Frame Button

d. Buat bentuk kotak dengan warna gradient putih hitam pada frame UP. Setelah kotak terbuat,

flash secara otomatis mengubah frame UP menjadi suatu keyframe, perhatikanlah perubahan

yang terjadi pada timeline.

e. Tetap di posisi frame UP ketik tulisan UP diatas gambar.

f. Klik kanan tombol mouse pada kotak frame Over, kemudian pilih Insert keyframe untuk

membuat frame over menjadi suatu keyframe, Flash menyalin kotak pada frame UP untuk

frame Over.

g. Ganti warna gradient dengan mengubahnya menjadi hitam putih, untuk melkukan hal itu, klik

tool Paint Bucket pada toolbox, kemudian tombol transform Fill pada bagian bawah toolbox.

h. Klik pada warna gradien. Pindahkan lingkaran kecil disisi kanan atas kotak ke sisi bawah kotak.

Flash mengubah warna gradien menjadi hitam putih.

i. Ganti tulisan “UP” dengan “Over” pada tombol tersebut.

j. Buat frame dengan menjadi suatu keyframe dengan mengklik tom kanan mouse, dan

kwemudian pilih Insert Keyframe.

k. Ganti tulisan “Over” dengan “Down” pada tombol tersebut.

l. Ganti warna gradient dengan gradient lingkaran hitam putih

m. Buat frame Hit menjadi suatu keyframe kemudian ubah warnanya menjadi hitam semua.

n. Akhiri pembuatan tombol dengan mengklik Scene1 di atas pojok kiri atas timeline.

o. Buka panel Library dengan menekan Ctrl+L. lalu tarik symbol untuk tombol tersebut ke stage.

p. Pada menu control, pilih Enable Simple Button untuk mengaktifkan tombol di stage

q. Cobalah untuk meletakkan mouse di atas tombol, menekan tombol, dan kemudian

melepaskannya.

LATIHAN B 02

Menghentikan Animasi yang Berulang Secara default, Movie animasi yang dibuat dengan Flash akan menghasilkananimasi yang berulang-

ulang sampai kita menutup jendela tempat animasi dimainkan. Namun, terkadang hal tersebut

mebuat kita bosan dan merasa terganggu.

Untuk menghentikan animasi lihat penggunaan action script berikut:



Gambar 7.5 : Action Stop

Langkah-langkah:

a. Buka file animasi yang akan dihentikan, misalnya animasi1.fla

b. Klik pada frame 20 (frame terakhhir) kita akan menghentikan animasi pada frame tersebut,

lalu klik Window �� Action untuk menampilkan panelnya.

c. Pada Actions-Frame ini, klik dua kali Action Stop di action toolbox

LATIHAN B 03

Membuat Tombol Link Yang dimaksud dengan tombol link adalah tombol yang bila di-klik akan menuju ke alamat URL

tertentu di internet.

Langkah-langkah untuk membuatnya: a. Buka file beserta tombol yang telah dibuat.

b. Pilih tombol, kemudian klik menu Window �� Action untuk menampilkan panelnya.

c. Pada Actions – Button ini, klik dua(2) kali Action getURL di action tolbox, lalu isiskan

parameternya pada bagian URL : http://www.politama.ac.id dan Window: _blank.

Gambar 7.5 : Action getURL

LATIHAN B 04

Mengontrol Animasi dengan Tombol Kita bisa mengontrol animasi yang sedang dimulai misalnya kita menghentikan animasi tersebut

pada saat gerakannya ada ditengah layar.

Langkah-langkahnya:

a. Buka salah satu animasi gerak yang telah anda nuat

b. Buat layer baru, lalu buatlah dua tombol yang sudah disediakan Flash (klik menu Window ��

Common Libraries �� Button), maka akan tampil library button, pilih jenis Circle Button

dan drag tombol Stop dan Play

c. Pilih tombol Play, lalu buka panel Actions dan klik dua kali Action Play



Gambar 7.6: Action Play

d. Pilih tombol Stop,lalu di panel Actions, klik dua kali Action Stop

e. Jalankan Animasinya

LATIHAN B 05

Mengontrol Suara Yang dimaksud dengan pengontrolan suara pada Flash adalah mematikan atau memainkan suara,

mengontol volume dan lain-lain.

Contoh:

a. klik menu insert �� New Symbol, lalu pilih pada Behavior: Button, sekarang anada berada di

mode edit button, dan gambarlah lingkaran.

b. Klik kanan Frame Down, lalu pilih insert keyframe.

c. Imporlah suara yang agak panjang, misalnya lagu mp3 (File import), lalu klik menu Window

�� Library, maka didalamnya terdapat lagu yang telah kita impor, seretlah lagu tersebut ke

tombol.

Gambar 7.7: Proses memasukkan lagu dari library ke tombol

d. Klik menu Edit �� Edit Document untuk kembali ke movie utama yang masih kosong,

seretlah simbol dari library ke stage. Lihat gambar 7.7.

e. Buatlah satu tombol baru disebelah tombol sebelumnya yang nantinya akan berfungsi sebagai

tombol untuk menghentikan suara yang dimainkan.

f. Pilih tombol Stop, lal buka panel actions dan klik dua kali action StopAllSound.

Gambar 7.8: action stopAllSound()

g. Jalankan Animasinya.

Drag



LATIHAN B 06

Memberi Label Frame

Yang dimaksud dengan label frame adalah nama frame. Secara default untuk menuju ke suatu

frame diperlukan yang yang namaya Frame Number, tetapi dengan pemberian label frame kita

tidak usah mengingat-ingat di frame berapa kita harus mengarahkan animasinya. Kita hanya

cukup mengingat nama frame/ frame labelnya saja. Label frame banyak digunakan untuk

mempermudah penamaan di actionscript terutama saat membuat navigasi,karena apabila frame

sudah diberi nama, kita tinggal memanggil nama framenya untuk menuju ke frame tersebut.

Contoh aplikasi:

a. Buat file baru, klik kanan pada frame 6, lalu pilih Insert Blank Keyframe. Lakukan hal yang

sama pada frame 12 dan 19.

b. Klik frame 1, lalu lihat di Properties. Isikan pada bagian frame : satu, maka frame 1 bernama

satu.

Gambar 7.9: Properties untuk memberi label Frame

c. Beri nama juga untuk frame 12 dengan nama dua dan frame 19 dengan nama tiga.

Gambar 7.10: Masing-masing frame sudah mempunyai nama

d. Sekarang untuk menuju frame 12, anda cukup memanggil namanya saja dengan action

gotoAndPlay(“dua”);

Gambar 7.11: Penggunaan Frame Label pada Action

LATIHAN B 07

Membuat Navigasi yang efektif

Navigasi berfungsi untuk membawa pengunjung menjelajah dari satu halaman ke halaman yang

lain melalui media link, tombol,atau menu

Untuk lebih mengerti perhatikan contoh berikut:

a. Klik menu Inser �� New Layer (layer 2), lalu buatlah sebuah tombol dan teks “Hal. Satu”

diatasnya.

Gambar 7.12: Tombol dan teks

Frame Label

dua



b. Klik Kanan pada frame 10, lalu pilih Insert Keyframe, ubah teksnya menjadi “hal. Dua”

lakukan yang sama pada frame 20 dan ubah teksnya menjadi “hal. Tiga”, sekarang terlihat

tiga keyframe di layer 2.

c. Klik frame 1, lalu pilih tombolnya saja (teknya jangan dipilih) dan buka panel Actions, lalu

klik dua kali action goto, pada parameternya pilh Go to and Stop, Type : frame label dan

Frame : dua.

Gambar 7.13: Action Goto

d. Berikan action goto juga pada tombol di frame 10 yang berfungsi untuk menuju halaman

tiga.

e. Terakhir, klik frame 1 di layer 1, lalu di panel Action, berikan Stop.

f. Jalankan animasinya

LATIHAN B 08

Menggunakan Variabel untuk menyapa User

Variabel digunakan untuk menyimpan atau menampung data sementara agar data yang sudah

didefinisikan dapat diproses lebih lanjut. Variabel mempunyai nilai yang selalu berubah-ubah

tergantung pada datanya. Nilai dalam suatu variabel dibagi dalam beberapa tipe data. Ada 4

(empat) tipe data di Flash, yaitu Number (angka), String (karakter/teks), boolean (rue/false)

dan Object.

Contoh Aplikasi:

a. klik text tool, pilih tipe teksnya : Input text dan klik tombol Show Border Arround Text,

lalu klik layar, setelah itu baru bagian Var aktif, di Properties teks, isikanlah pada Var :

nama.

Gambar 7.14: Properties text dengan jenis input teks

b. Tambahkan static text dengan tulisan “nama” disebelah kiri input text, dan tambahkanlah

juga sebuah tombol di sebelah kanannya.

Gambar 7.15: Penambahan teks dan tombol

c. Klik kanan frame 10. pilih insert Blank Keyframe. Klik text tool,lalu pilih tipe teksnya :

Dynamic Text, lalu klik di layar dan isikan pada bagian Var : tampil di properties text.

Input Text

Show Border Arround Text

Var : nama



Gambar 7.15: Penambahan Dynamic Text

d. Klik Frame 1, lalu buka panel Actions dan berikan Actions Stop. Kemudian, pilih pada

bagian tombol saja, lalu berikan action goto. Pilihlah Go to and stop . Type : Frame

Number dan Frame : 10

e. Klik frame 10, lalu berikan action set variable, isikan pada Variable : tampil, value : “Hai

“+nama+” Selamat Datang” dan berikan tanda cek (centang) pada Expresion.

f. Jalankan animasinya.

LATIHAN B 09

Membuat Web Dengan Macromedia Flash

A. Mensetting File 1. Bua file baru

2. Pilih menu File �� Publish Setting, untuk menseting halaman. Dan akan muncul window

seperti berikut :

- Pada tab Format filih Flash dan HTML

- Pada tab HTML pilih dimensions dengan pilihan Percent, kemudian klik OK.

B. Merubah background Halaman

Pilihlah menu Modify �� Document akan muncul window seperti ini :

Dynamic Text tampil



Pada Pilihan Background Color pilih warna putih.

C. Menyimpan dokumen Untuk menyimpan dokumen pilihlah menu File �� Save, namai dengan nama index.

D. Melihat Tampilah halaman di Internet Explorer Pilih menu File �� Publish Preview �� HTML

E. Membuat Logo web 1. Ganti nama layer 1 dengan klik ganda pada nama layer 1 dan ketik nama Logo.

2. Kemudian buatlah logo web anda tepat dipojok kanan atas stage, seperti gambar berikut :

F. Membuat Background 1. Buat layer baru dibawah layer logo dengan nama background

2. Pada Layer Background buatlah background dengan rectangle tool dengan properties warna

stroke : hitam, warna fill : orange : radius corner : 0, tebal garis : 1.



3. Tambahkanlah objek kotak dengan radius corner : 30, tebal garis 10, warna stroke : abu-abu,

warna fill : Putih. Hingga mengahAsilkan objek seperti ini :

G. Membuat symbol Tombol 1. Buat layer baru letakkan dibawah layer logo dengan nama layer Tombol.

2. Di layer tombol buatlah bentuk tombol seperti kapsul dengan cara : Gunakanlah Rectangle

tool, dan pada radius corner : 30, tebal garis : 1, warna stroke : hitam, warna fill : putih.



3. Kemudian objek kapsul tersebut diubah menjadi symbol tombol dengan cara : Klik layer

tombol frame 1, kemudian pilih menu Insert �� Convert to Symbol, dan akan muncul

window sebagai berikut :

Pada Name : Isi dengan ketik tombol

Behavior : pilih Button

4. Untuk mengedit symbol hanya dengan cara klik dua kali objek kapsul dengan arrow tool

hingga di atas stage terdapat tulisan Scene 1 | tombol seperti gambar berikut :

Kemudian lakukan pengeditan sesuai kehendak untuk posisi Over dan Down. Juga kalo perlu

masukkanlah file suara yang ada di menu Window �� Common Libraries �� Sounds

5. Kalo sudah masuklah kembali ke scene 1 dengan cara mengklik tulisan scene 1 yang ada

diatas stage.

6. Bukalah panel library dengan cara : pilih menu Window �� Library. Akan muncul panel

isinya sebagai berikut :



7. Kemudian drag masukkanlah symbol tombol itu ke dalam stage hingga berjumlah 4 seperti

gambar berikut :

H. Membuat label tombol

1. Buat Layer baru dengan nama label, letakkan diatas layer tombol

2. Di layer tersebut buatlah tulisan home, profil, gallery, contact seperti dibawah ini sebagai

menu

I. Membuat Content 1. Buat layer baru dengan nama content letakkan dibawah layer logo

2. buat keyframe kosong di frame 2, 3 4 pada layer content dengan cara klikkanan pada frame

tersebut dan pilih Insert blank, kemudian dengan cara klik kanan masukkan action stop pada

frame 1, 2, 3, 4 layer content.



3. Agar semua objek kelihatan, panjangkan frame logo, label, tombol, background dengan cara

klik frame 1 pada layer logo tekan tombol F5 3 kali. Dan lakukanjuga pada layer label, tombol

dan background.

3. Kemudian masuklah pada frame 1 layer content ketikkan tulisan HOME di Stage, di frame 2

pada stage ketikkan PROFIL, frame 3 pada stage ketikkan GALERY, frame pada stage

ketikkan CONTACT.

4. Masukklah ke layer tombol, klik tombol home kemudian klik kanan pilih action, berikan

action go to



Pilihlah go to and stop pada frame isikan 1.

Lakukan juga pada tombol profil, gallery dan Contact dengan isi frame 2, 3 dan 4.

LATIHAN B 10

Menggerakkan obyek dengan Action Script

1. Buat object lingkaran sperti gambar dibawah

2. Seleksi lingkaran tersebut,kemudian jadikan symbol movieclip “lingkaran”

3. Setelah di klik OK , klik Kanan symbol movie clip “lingkaran: tersebut pilih

action. Apabila panel action masih berada pada mode Normal.,klik ikon

dibagian kanan panel dan pilih Expert Mode.



Ketikkan Action Script berikut

onClipEvent(enterFrame) {

_x +=10; //perubahan koordinat sumbu x

_y +=10; //perubahan koordinat sumbu y

}

4. Jalankan Animasi!

LATIHAN B 11

Test Tumbukan

Script utama tumbukan adalah:

hitTest(_root.NAMA INSTANCE MOVIECLIP YANG AKAN DITABRAK)

Langkah2:

1 . Buat symbol movieclip bola

2. Buatlah symbol movieclip balok. Letakkan balok disebelah kiri

bola seperti tampak pada gambar berikut:

3. Klik Pada symbol movieclip balok buka panel properties . isi textbox <instance

name> dengan ‘balok’

4. Klik kanan pada symbol movieclip bola pilih action masukkan actionscript

berikut:



onClipEvent(load) {

arah =10;

//menentukan variable awal arah pergerakan bola

}

onClipEvent(enterFrame) {

_x +=arah;

//menggerakkan bola pada sumbu x sebesar variable arah

if(hitTest(_root.balok)){

//deteksi tumbukan antara bola dng balok

arah = -arah;

}

}

5. Test Movie!

LATIHAN B 12

Menggerakkan Object dengan Keyboard

1. Buat object balok di stage/area kerja flash seperti gbr berikut:

2. Seleksi balok tersebut kemudian jadikan symbol movieclip balok

3. Setelah itu ,klik kanan symbol movieclip balok tersebut pilih action. Ketikkan

action berikut:

onClipEvent (enterFrame) {

//gerakan ke atas

if(Key.isDown(Key.UP)){

_y -=10;

}

//gerakan ke bawah

if(Key.isDown(Key.DOWN)){

_y +=10;

}

//gerakan ke kiri

if(Key.isDown(Key.LEFT)){

_x -=10;

}

//gerakan ke kekanan

if(Key.isDown(Key.RIGHT)){

_x +=10;

}

}

4. Test Movie !

LATIHAN B 13

Animasi Gelembung



Langkah2 membuat

1. Pembuatan Movieclip Bubble

2. Penuliasn Actionscript pada movieclip bubble

3. pembuatan movieclip control

4. pembuatan button untuk keluar

1. Pembuatan Movieclip bubble

a. Buat dokument baru atur lebar 400px dan tinggi 550px. Background: #97D4F7

atau biru muda

b. Pilih Publish Setting, aktifkan Windows projector utk menghasilkan file

*.exe

c. Simpan dengan nama buble.fla

d. Buat bubble dengan oval tool

e. Ubah obyek bola tersebut menjadi movieclip (convert to symbol) beri nama

bubble

f. Kemudian movieclip tersebut beri nama instance “bubble”

2. Penulisna Actionscript pada movieclip bubble

a. Pilih movieclip bubble

b. Kemudian pada panel properties, tulis script berikut:

onClipEvent (enterFrame) {

//yang bergerak hanya movieclip yang diduplikasi

if (_name!="bubble") {

//selama posisi _y>0

if (this._y>0) {

//posisi y dikurangi posisi sebelumnya sebanyak 10

this._y -=10;

//bergerak secara acak dari kiri kekanan

this._x += (random(2)*2-1)*random(10);

}

//apabila posisi _y sudah <0 , maka movicelip dihapus

else{

this.removeMovieClip();

}

}

}

//apabila mouse melewati movieclip,maka movieclip dihapus

on (rollOver) {

this.removeMovieclip();

}



LATIHAN B 14

Membuat permainan tembak sederhana

Siapkan layer dengan urutan sebagai berikut

1. Untuk membuat permainan tembak sederhana, langkah pertama adalah dilayer target buat movie

clip yang akan bergerak mengikuti kursor mouse, kemudian beri nama instance “target_mc”.

2. Langkah kedua adalah dilayer sasaran buat movieclip sasaran yang akan menjadi object tembak,

kemudian beri nama instance “sasaran_mc”.

3. Langkah ketiga adalah dilayer area membuat movieclip area yang akan menjadi area tembak,

buat kotak dengan Rectangle Tools, kemudian sesuaikan ukuran width dan height movieclip

area tersebut dengan ukuran panjang dan lebar movie flash. Misal panjang movie flash = 550,

lebar movie flash = 400 (ini adalah ukuran standart flash). Maka movieclip area ini berukuran

width = 550 dan height = 400, kemudian letakan pada posisi X = 0, dan Y = 0. Setelah

disesuaikan posisinya, kemudian ubah property alpha movie clip tersebut menjadi 0 dan beri

nama instance “area_mc”.

4. Langkah ke empat adalah membuat text skor dan meleset, untuk melihat berapa skor dan

tembakan yang meleset. Caranya buat dengan Text Tools, dua Static Text yang berisi text

“SKOR” dan “MELESET”, kemudian buat juga dua Dynamic Text, yang berisi nama variable

“skor” dan “meleset”. Sesuaikan posisi sehingga tampak enak dilihat mata.

Letakan langkah pertama sampai langkah ke empat di frame ke-1, sehingga tampilannya

menjadi seperti gambar di bawah ini :

Tampilan Frame ke-1, Permainan Tembak Sederhana

5. Langkah kelima adalah membuat tampilan pada Frame ke-2 pada layer text, hapus semua

gambar yang ada pada frame ke-2, kemudian buat Static Text “SELESAI”

6. Langkah keenam adalah membuat Dynamic Text dengan nama variable “akhir”, kemudian

diproperties ubah Line Type dari Single Line, menjadi Multiline, kemudian letakan sedemikian

rupa sehingga tampilan menjadi seperti gambar di bawah ini :



Tampilan Frame ke-2, Permainan Tembak Sederhana

Berikut adalah Struktur Timeline permainan Tembak Sederhana :

Struktur Timeline, Permainan Tembak Sederhana

7. Langkah ketujuh adalah memberikan Script pada frame 1, seperti berikut ini :

stop();

skor = 0;

meleset = 0;

startDrag(target_mc, true);

Mouse.hide();

area_mc.onRelease = function() {

if (target_mc.hitTest(sasaran_mc)) {

skor += 1;

} else {

meleset += 1;

}

};

function acakSasaran() {

sasaran_mc._x = random(550);

sasaran_mc._y = random(400);

}

setInterval(acakSasaran,750);

_root.onEnterFrame = function() {

if (skor >= 25) {

gotoAndStop(2);

delete _root.onEnterFrame;

}

}

Penjelasan Script :

stop();

skor = 0;

meleset = 0; stop() akan membuat playhead tetap pada frame 1, skor = 0 dan meleset = 0 akan

mendeklarasikan variable awal skor dan meleset yaitu 0.



startDrag(target_mc, true);

Mouse.hide();

Action startDrag() akan membuat target_mc mengikuti kursor mouse, sedangkan

true adalah lock, jika bernilai true maka mouse akan selalu berada ditenggah-

tenggah movieclip sedang jika bernilai false maka sebaliknya. Mouse.hide(); akan

menyembunyikan kursor mouse, sehingga hanya ada target_mc saja yang tampak

seperti kursor mouse.

area_mc.onRelease = function() {

if (target_mc.hitTest(sasaran_mc)) {

skor += 1;

} else {

meleset += 1;

}

}; saat mouse diklik kemudian dilepas (area_mc.onRelease)

if(target_mc.hitTest(sasaran_mc) akan mengecek, jika target_mc menyentuh atau

bersinggungan dengan sasaran_mc, maka statement di bawahnya akan dijalankan

yaitu skor += 1 (atau menambah skor dengan angka 1), yang artinya berhasil

menembak dengan akurat, namun sebaliknya, jika gagal menyentuh atau

bersinggungan dengan sasaran_mc, maka statement di bawah else yang akan

dijalankan, yaitu, meleset += 1 (atau menambahkan meleset dengan angka 1),

yang artinya gagal menembak dengan akurat.

function acakSasaran() {

sasaran_mc._x = random(550);

sasaran_mc._y = random(400);

}

setInterval(acakSasaran,750); function acakSasaran berfungsi untuk mengacak posisi x dan y sasaran_mc

sehingga tidak diketahui dimana selanjutnya posisi dari sasaran_mc, yang

diaktifkan dari setInterval(acakSasaran,750); angka 750 berarti setiap 750/1000

detik, function acakSasaran akan dijalankan yang berarti akan diacak posisi

sasaran_mc di tempat yang berdeda.

_root.onEnterFrame = function() {

if (skor >= 25) {

gotoAndStop(2);

delete _root.onEnterFrame;

}

}

onEnterFrame adalah Event Handler yang akan menjalankan statement di

bawahnya secara berulang-ulang, sehingga cocok digunakan untuk mengetahui

permainan masih berjalan atau sudah berakhir, jika skor sudah lebih besar atau

sama dengan 25, maka statement di bawahnya akan dijalankan, yaitu

gotoAndStop(2) yang akan memerintahkan playhead menuju frame ke-2 yang

berisi tampilan permaian yang sudah berakhir, kemudian delete

_root.onEnterFrame akan menghilangkan _root.onEnterFrame, sehingga statement

di bawah _root.onEnterFrame tidak akan dijalankan lagi.

8. Langkah kedelapan adalah memberikan Script pada frame 2, seperti berikut ini :

stop();

Mouse.show();

skorAkhir = skor-meleset;

if (skorAkhir<0) {



skorAkhir = 0;

}

akhir = "Anda telah berhasil menyelesaikan permainan ini, skor akhir Anda adalah = "

+skorAkhir;

Penjelasan Script : Mouse.show();

Akan kembali menampilkan kursor mouse yang tadi di hide.

skorAkhir = skor-meleset;

if (skorAkhir<0) {

skorAkhir = 0;

} skorAkhir adalah nilai yang didapat dari skor dikurangi meleset yang artinya semakin sering

menembak tanpa meleset maka akan semakin tinggi skorAkhir. Kondisi jika skorAkhir kurang

dari 0 maka skorAkhir disamadengankan 0, untuk menghindari skorAkhir yang minus, jika

terlalu banyak nilai melesetnya.

akhir = "Anda telah berhasil menyelesaikan permainan ini, skor akhir Anda adalah = "

+skorAkhir; Script diatas menyambung, adalah memberikan kalimat pada variable akhir, yang juga

menampilkan skorAkhir dari pemain.

Membuat CD interaktif 1. Buat sebuah folder dengan nama CDKU, sebagai contoh penulis membuat folder CDKU si folder My

Document

2. kemudian didalam folder CDKU buat sebuah folder dengan nama fileku

3. Kemudian di folder fileku copykan 2 buah file flash (*.swf) yang sudah dibuat. Disini penulis meng-

copykan dua buah file flash yang sudah jadi yaitu file bola.swf dan lilin.swf

4.

5. Langkah selanjutnya adalah dengan menggunakan Macromedia Flash 8 membuat file menu CD

interatif-nya



6. Buat dokument baru

7. kemudian setting ukuran file flash dengan cara klik menu Modify �� Document

Maka akan muncul panel spserti gambar berikut, ubah ukuran 800px X 600px

8. langkah selanjutnya adalah menyimpan file flash tersebut kedalam folder CDKU, dengan cara pilih

menu File �� Save. Beri nama utama.fla

bila sudah tersimpan di folder CDKU akan tampak sebuah file baru utama.fla

9. Kembali lagi ke flash, siapkan dua buah layer dengan nama action, menu, dan background.

10. pada layer frame 1 layer background buat tampilan di stage seperti ini:



11. Langkah berikutnya memberikan action stop di frame 1 layer action. Caranya klik kanan fame 1 layer

action, pada tanda plus di panel action script pilih: Global Function �� Timeline Control �� Stop.

12. kemudian di frame 1 layer menu buat tampilan menu sperti berikut:

13. Seleksi icon dan tulisan Jalankan Animasi Lilin, klik kanan pilih Convert to symbol, muncul panel

convert to symbol, beri nama tombol_animasi_lilin. Dengan type button.

14. sama seperti langkah no.13, seleksi icon dan tulisan Jalankan Animasi bola, muncul panel convert to

symbol, beri nama tombol_animasi_bola. Dengan type button.

15. sama seperti langkah no.13 dan 14, seleksi icon dan tulisan Keluar, muncul panel convert to symbol,

beri nama tombol_keluar. Dengan type button.

16. langkah berikutnya adalah menyiapkan scene untuk tampilan animasi bola dan lilin

Pilih menu Window �� Other Panels �� Scene



Akan muncul panel scene seperti dibawah ini:

Klik tanda plus(+) untuk menambahkan sebuah scene, secara otomatis muncul scene 2, klik 2x nama

scene 2 untuk merubah namanya menjadi scene_lilin

17. Langkah berikutnya masih di panel scene, klik tanda plus, kemudian gant nama scene 3 menjadi

scene_bola

18. Langkah selajutnya adalah klik scene_lilin untuk masuk ke area editor scene_lilin

Sebagai bukti kita sudah masuk di area editor scene_lilin, maka di atas timeline akan muncul tulisan

scene_lilin. Lihat gambar dibawah:



19. masih bekerja di scene_lilin, siapkan sebuah tombol dengan tuliasan Kemabali ke Menu, letakkan di

sudut kiri bawah.

Kemudian di tombol tersebut berikan action Global Function �� Timeline Control �� goto

Muncul panel action, pili Go to and paly, pada combo scene, pilih scene 1. lihat gambar dibawah:

20. masih berkerja di scene_lilin, buat sebuah symbol movie clip yang kosong, dengan cara seperti

berikut:

- pilih menu insert �� New Symbol, muncul panel new symbol, beri nama blank dan type movie

clip, lihat gambar berikut:

- setelah klik OK, maka ada perubahan di atas timeline yaitu muncul tulisan blank, ini menandakan

kalo kita bekerja di editor symbol movieclip blank.

- Jangan menambahkan obyek apapun di stage, kecuali klik tombol scene_lilin.

21. setelah kembali ke editor scene_lilin, aktifkan panel symbol, seret (drag) symbol blank ke sudut kiri

atas stage. Lihat gambar:



Jika berhasil maka akan muncul sebuah lingkaran kecil yang sudut kiri atas, menandakan jika

ditempat itu ada sebuah sybol yang kosong.

Kemudian seleksi symbol blank yang baru saja kita letakkan, buka panel properties, di bagan instance

name, ketik tulisan symbol_tempat.

22. masih bekerja di editor scene_lilin, langkah selanjutnya adalah meberikan action di frame1, layer1,

dengan cara klik kanan pilih action kemudian klik tanda plus(+) pilih Global Functions ��

Browser/Network �� loadMovie.

Muncul panel action, isikan URL dengan fileku/lilin.swf, dan panada Location pilih Target, ketiikan

symbol_tempat

23. langkah selanjutnya adalah mengkopi frame1 layer1 di scene_lilin ke frame1 layer1 di scene_bola

(ini dilakukan untuk lebih memudahkan kita daripada membuat ulang obyek2 yang sama, sangat

membantu bila kita menggunakan scene yang banyak)



klik kanan frame1 layer1 di scene_lilin, kemudian pilih copy frame.

Kemudian buka panel scene, klik scene_bola (maka kita akan bekerja di editor scene_bola)

klik kanan frame1 layer1 di scene_bola, kemudian pilih paste frame.

Jika sudah kita paste,langkah selanjutnya adalah merubah pada bagian action di frame1 layer1,

caranya klik kanan fame 1 layer1 di scene_bola pilih action,

Munculah panel action seperti gambar berikut, ubahlah pada bagian URL dengan mengetikkan

fileku/bola.swf.

Klik kanan pilih Copy

Frames

Klik kanan pilih Copy

Frames



24. Langkah berikutnya adalah pemberian action pada bagian menu di scene1, langkahnya buka panel

scene, klik scene1.

25. klik kanan pada tombol Jalankan animasi lilin, pilih action berikan action, Glogal function ��

timeline control �� goto, muncul panel, pilih Go to amd stop, pada bagian scene pilih scene_lilin

26. Sama seperti langkah no 25, klik kanan pada tombol Jalankan animasi Bola, pilih action berikan

action, Glogal function �� timeline control �� goto, muncul panel, pilih Go to amd stop, pada

bagian scene pilih scene_bola.

27. Langkah selanjutnya adalah memberkikan action pada tombol keluar. Klik kanan tombol keluar

pilih action, muncul panel action berikan action Global function �� Browser/Network ��

fscommand.

Pada panel action di bagian command for standalon palyer pilih quit



28. langkah selanjutnya adalah setting publikasi file. Pilih menu File Publish �� Setting, centang pada

bagianWindows Projector (exe)

Klik OK

29. Kemudian pilih menu File �� Publish. Maka akan terjadilah sebuah file utama.exe

30. CD siap diburning dengan satu syarat file autorun harus dibuat.



LAMPIRAN

Fungsi-fungsi ActionScript

� Stop, berfungsi untuk menghentikan movie atau animasi.

� Play, berfungsi untuk memainkan animasi.

� GetURL, berfungsi untuk memanggil alamat URL di internet.

� StopAllSound, berfungsi untuk menghentikan semua suarayang sedang dimainkan.

� Goto, berfungsi untuk melompat atau berpindah dari frame satu ke frame yang lain atau movie

satu ke movie yang lain. Action goto terbagi menjadi 2, yaitu:

o Go to and play, berfungsi untuk melompat ke frame tertentu dan memainkan animasi

mulai frame tersebut sampai frame yang ditentukan.

o Go to and Stop, berfungsi untuk melompat ke frame teretentu dan berhenti di frame

tersebut.

� Event-event mouse/keyboard

o Press : keadaan ketika kursor mouse barada di tasa tombol dan mouse sedang ditekan.

o Release : keadaan ketika kursor mouse berada di atas tombol dan mouse sudah ditekan

dan dilepaskan (hampir sama dengan Press)

o Release Outside : keadaan ketika kursor mouse berada diatas tombol dan mouse sudah

ditekan dan dilepaskan di luar area tombol.

o Key Press : keadaan ketika tombol keboard ditekan, jadi mendeteksi penekanan tombol

keyboard.

o Roll Over : keadaan ketika kursor berada diatas tombol

o Roll Out : keaddan ketika kursor mouse bergerak diluar area tombol

o Drag Over : Keadaan ketika kursor mouse berada diatas tombol dan mouse sudah

ditekan, kemudian kursor bergerak keluar area tombol, lalu kembali sambil mouse tetap

ditekan.

o Drag Out : Keadaan ketika kursor berada diatas tombol dan mouse sudah ditekan,

kemudian kursor keluar area tombol.

� StartDrag, berfungsi untuk membuat movie klip mengikuti gerakan pointer mouse.

� StopDrag, merupakan kebalikan dari startDr

� Mouse.hide, berfungsi untukmenyembunyikan pointer mouse.

� Set variable, berfungsi untuk membuat suatu variabel dengan nilai tertentu.

� Evaluate, berfungsi untuk menambah pernyataan baru atau variabel yang akan diperlakukan

sebagai ekspresi.

� Event-event Movie clip o Load : keadaan ketika movie klip diload di timeline atau movie klip pertama dijalankan.

o EnterFrame : keadaan ketika setiap frame atau movie klip dihapus ditimeline.

o Unload : keadaan ketika movie klip dihapus di timeline.

o Mouse Down : keadaan ketika tombol kiri mouse ditekan.

o Mouse Up : keadaan ketika tombol mouse dilepaskan.

o Mouse Move : keadaan ketika mouse bergerak.

o Key Down : keadaan ketika tombol keyboard ditekan

o Key Up : keadaan ketika tombol mouse dilepaskan

o Data : keadaan ketika data movie swf di load dalam movie flash.

� SetProperty berfungsi untuk medefinisikan suatu nilai bagi properti movie klip. Setproperty

mempunyai beberapa pilhan property, yaitu:

o _alpha : menentukan nilai transparan movie klip

o _focusrect :: menentukan apakah tanda kotak akan muncul saat navigasi.

o _height : mengubah tinggi movie klip

o _heightquality : mengubah ketajaman dari object dari movie klip

o _name : memberikannama baru pada movi klip.

o _quality : mengubah ketajaman object dari klip secara keseluruhan.

o _rotation : memutar movie klip

o _soundbuftime : menetukan waktu pada movie untuk memulai suara.

o _visible : menetukanapakah movie klip terlihat atau tidak.

o _width : mengubah lebar movie klip

o _x : mengubah posisi horisontal movie klip

o _xscale : mengubah dimensi horisontal movie klip

o _y : mengubah posisi vertikal movie klip

o _yscale : mengubah dimensi vertikal movie klip.



� If, berfungsi untuk menyeleksi kondisi dari suatu pernyataan artinya jalankanlah pernyataan jika

kondisi benar.

� Else, berfungsi untuk menjalankan pernyataan apabila kondisi dari suatu pernyataan tidak

memenuhi syarat dari acction if.

� Call function, berfungsi untuk memanggil suatu fungsi yang disediakan oleh flash.

� Key.isDown, berfungsi untuk mendeteksi penekanan tombol tertentu di keyboard

� Key , mempunyai beberapa property, yaitu:

o Left : kode untuk penekanan tombol panah kiri di keyboard.

o Right : kode untuk penekanan tombol panah kanan keyboard.

o Up : kode untuk penekanan tombol panah ke atas di keyboard

o Dan masih banyak lagi antara lain Enter, Escape, Pgup, pgdn dan lain-lain

� Fscommand, berfungsi untuk mengatur tampilan movie di proyektor.

� IfFrameLoaded, berfungsi untuk mendeteksi apakah seluruh frame pada movie utama sudah

selesai di download.

� LoadVariables, befungsi untuk memanggil variabel dari file-file luar, seperti file teks (*.txt) atau

file pemrograman (*.php dan *.asp)

� LoadMovie , berfungsi intuk memanggil movie dari lua, seperi shockwave(*swf), gambar (*.jpg

atau *.gif)

� Comment, berfungsi untuk memberi komentar pada script dengan tanda (//), dan komentar ini

tidak diproses oleh action

BPK animasi1 mi3

Documents

Transcript of BPK animasi1 mi3