FLAS H MX

Pernahkah anda melihat gambar yang bergerak-gerak ketika pertama kali masuk
mengunjungi sebuah situs?atau pernahkah anda melihat kartun yang setiap hari
ditayangkan di televisi kesayangan anda?Mungkin anda bertanya-tanya
bagaimana cara membuatnya bukan?

Melalui tutorial berikut anda diajak jalan-jalan ke dunia animasi dimana

anda dapat berkhayal, berimajinasi bahkan mengimplementasikannya. Kali ini
akan diperkenalkan sebuah aplikasi yang cukup menyenangkan yang bernama
Flash MX. Flash MX merupakan bagian dari keluarga Macromedia yang
digunakan sebagai aplikasi pembuat animasi. Di bawah ini merupakan aplikasi
yang termasuk
ke dalam keluarga Macromedia.

Aplikasi-aplikasi Macromedia:
1. Flash MX.
2. Fireworks.
3. Dreamweaver.
4. Freehand.

Seiring dengan perkembangan zaman maka Flash MX disesuaikan sesuai

kebutuhan akan pembuatan sebuah aplikasi web disamping pembuatan animasi.

1 
 
 POKOK
K BAHA
ASAN

Peendahuluan
n
System
m Requiremeents.
Installaasi Flash MX
X.

Peengenalan komponen-k
k komponen Flash MX
Windo
ow Utilitas Pada
P Flash MX.
M
Menjalankan Flash
h MX Moviie.
Konveersi File mellalui Flash MX.
M

Dasar – Dasaar Menggam

mbar Objek
k Pada Flash MX
Pengettahuan dasarr objek padaa flash MX
Membelah objek dengan
d line tool
Mengg
gambar deng
gan pencil to
ool
Mengg
gambar deng
gan pen tooll
Mewarrnai objek dengan
d brush
h tool

Dasar – Dasaar Pewarnaaan Objek Pada

P Flash MX
M
Pewarn
naan objek dengan
d berb
bagai macam
m tools.

M
Metode pemb
buatan anim
masi
Frame by frame an
nimation.
Tween
ned animatio
on.

M
Membuat An
nimasi
Film Tweening.
T
Film Frame
F by Fraame.

Membuat An
M nimasi Text
- Animaasi Text Hilaang Timbul
- Animaasi Text Munncul Satu Perr Satu
- Animaasi Text denggan Time Linne Effect
M
Mengubah Prresentasi Poower Point ke
k dalam Macromedia
M Flash MX
2 
 PENDAHULUAN
Halaman ini berisi tentang petunjuk beserta persyaratan yang dibutuhkan
dalam installasi dan pengoperasian Flash MX.

System Requirements

Dibawah ini merupakan hardware dan software yang dibutuhkan dalam

penginstallasian dan pengoperasian FlashMX.

Hardware : - Intel Pentium 200 MHz.

- 64 MB RAM (128 MB dianjurkan).

- 85 MB disk space.

- CDROM drive.

- Monitor dengan warna 16-bit dan mampu resolusi sebesar

1024x768. (minimal monitor 15” dengan resolusi 800x600).

Software (OS) : - Windows 98 SE, Windows ME, Windows NT 4.0, Windows

2000, Windows XP.

Installasi Flash MX

Ikuti petunjuk berikut untuk installasi Flash MX.

1. Masukkan CDROM Flash MX ke dalam CDROM drive.

2. Lalu dari Windows Explorer cari drive CDROM Anda.
3. Dari drive CDROM Anda, pilih file Flash MX Installer.exe (Setup.exe).
4. Lalu ikutilah petunjuk installasi yang telah disediakan.
5. Jika diminta untuk restart computer, maka Anda harus merestart komputer
Anda.

3 
P
PENGE
ENALA
AN KOMPONNEN-KO
OMPO
ONEN
FLA
ASH MX
M
Sebeluum membu uat sebuahh animasi ada kallanya And da harus
mengenal dahulu
m d kommponen-kommponen apaa saja yang g dibutuhkan dalam
peembuatan sebuah
s aniimasi. Andda harus mengenal
m sem
mua kompo onen yang
teerdapat di ap
plikasi Flash
h MX ini ag
gar pekerjaaan dalam peembuatan an
nimasi ini
daapat berjalaan dengan lancar. Di bawah ini merupakan n window dari
d Flash
M yang dig
MX gunakan daalam pekerjjaan pembu uatan animasi, baik ittu berupa
grraphic atau animasi beergerak (carrtoon).

C B
D
E

G
F

G
Gambar 1. Window
W Macromedia Flaash MX
Di bawah ini merupakan keterangan dari kegunaaan masing-m
D masing kom mponen Flash
M secara deetail:
MX
A Timelinee, digunak
A. kan untuk mengatur dan n mengontrool isi keselurruhan moviee
A
Anda.

Gambar 2. Timeline Window

W

4 
B. Stage, merupakan tempat dimana Anda bekerja dalam membuat sebuah animasi.

Gambar 3. Stage untuk bekerja

C. Tools Box, berisi alat-alat yang digunakan untuk menggambar objek pada
stage.

Gambar 4. Window Tools box

Description of Tools Box:

Arrow Tool
Tool ini digunakan untuk memilih suatu objek atau untuk
memindahkannya.

Subselection Tool
Tool ini digunakan untuk merubah suatu objek dengan edit points.

5 
Line Tool
Tool ini digunakan untuk membuat suatu garis di stage.

Lasso Tool
Tool ini digunakan untuk memilih daerah di objek yang akan diedit.

Pen Tool
Tool yang digunakan untuk menggambar dan merubah bentuk
suatu objek dengan menggunakan edit points (lebih teliti & akurat).

Text Tool
Tool ini digunakan untuk menuliskan kalimat atau kata-kata.

Oval Tool
Tool yang digunakan untuk menggambar sebuah lingkaran.

Rectangle Tool
Tool yang digunakan untuk menggambar sebuah segiempat.

Pencil Tool
Tool ini digunakan untuk menggambar sebuah objek sesuai dengan
yang Anda sukai. Tetapi setiap bentuk yang Anda buat akan
diformat oleh Flash MX menjadi bentuk
sempurna.

Brush Tool
Tool ini sering digunakan untuk memberi warna pada objek bebas.

Free Transform Tool

Tool ini digunakan untuk memutar (rotate) objek yang Anda buat atau
mengubah bentuk objek menjadi bentuk lain.

Fill Transform Tool

Tools ini digunakan untuk memutar suatu objek yang diimport dari luar
lingkungan Flash
MX, serta untuk mengatur efek warna.

Ink Bottle Tool

Tool ini digunakan untuk mengisi warna pada objek yang bordernya
telah hilang (tidak ada).

Paint Bucket Tool

Tool ini digunakan untuk mengisi warna pada
6 
 objek yang dipilih.

Eraser Tool
Tool ini digunakan untuk menghapus objek yang Anda bentuk.

Description of Colors Box:

Stroke Color, digunakan untuk memberi warna pada garis /
Border objek.

Fill Color, digunakan untuk memberi warna objek.

Swap Colors, digunakan untuk menukar warna objek(Fill

Color) dengan warna border / garis(Stroke
Color).

Black & White, digunakan untuk memberi warna objek dan

warna border / garis dengan warna
hitam putih.

Description of View Box:

Zoom Tool, digunakan untuk memperbesar tampilan objek
pada stage.

Hand Tool, digunakan untuk menggerakkan suatu tampilan

objek pada stage tanpa merubah posisi
objek tersebut pada stage.

D. Color Window, merupakan window yang digunakan untuk mengatur warna

pada objek yang Anda buat.

Color Window terdiri dari:

1. Color Mixer, digunakan untuk mengatur warna pada objek sesuai
dengan keinginan Anda. Ada 5 pilihan tipe warna,
yaitu: None, Solid, Linear, Radial, Bitmap.

7 
 Gambar 5. Window Color Mixer

2. Color Swatches, digunakan untuk memberi warna pada objek yang

Anda buat sesuai dengan yang warna pada window.

Gambar 6. Window Color Swatches

E. Actions – Frame, merupakan window yang digunakan untuk menuliskan

Action Script untuk Flash MX. Biasanya Action Script
digunakan untuk mengendalikan objek yang Anda buat
sesuai dengan keinginan Anda.

8 
 Gambar 7. Window Actions - Frrame

F.. Properties, merupaakan windo

ow yang diigunakan un
ntuk mengatur properrty
dari ob
bjek yang Anda
A buat.

Gambar 8. Window Pro

operties

G
G. Compo
onents, d
digunakan untuk meenambahkan
n objek untuk
u web
b
application yang nantiinya di publlish ke interrnet.

G
Gambar 9. Window
W Com
mponents

Windo
ow diatas merupakan
m w
window utam
ma yang serring digunak
kan dalam
peembuatan animasi
a seccara windo
ow default layout. Paada dasarnya Flash MX
M
m
mempunyai banyak
b wind
dow layout dalam peembuatan seebuah animaasi, diantaraanya
yaaitu Default Layout, Designer [1024x768], Desig
gner [1280x1024],
9 
Designer [1600x1200], Developer [1024x768], Developer [1280x1024],
Developer [1600x1200]. Untuk merubah window layout Anda dapat membukanya
melalui menu Window lalu pilih Panel sets. Tetapi kali ini kita akan menggunakan
window Default Layout, karena semua tools dan window standart yang kita
butuhkan untuk membuat sebuah animasi ada disini semua.

Window Utilitas Pada Flash MX

Library Window
Window ini digunakan untuk menampilkan objek-objek yang kita import dari
luar lingkungan Flash MX maupun objek-objek bawaan dari Flash MX itupun
sendiri. Untuk menggunakannya Anda dapat menekan tombol F11 pada
keyboard atau dari menu Window pilih Library.

Gambar 10. Window Library

Document Properties Window

Window ini digunakan untuk merubah setting (baik itu ukuran, warna,
maupun kecepatan movie) pada dokumen yang berada pada stage. Untuk
menggunakannya Anda harus menekan tombol Ctrl+j secara bersamaan
pada keyboard Anda, atau dari menu Modify pilih Document….Pada
window yang satu ini Anda dapat merubah warna background dari
dokumen Anda beserta ukurannya.

10 
 G
Gambar 11. Window Do
ocument Pro
operties

Window Layer Prop

perties
Merupakaan window dimana An
nda dapat mengatur setting
s dari layer yang
g
Anda buaat sesuai deengan keing
ginan Andaa. Melalui windowni Anda dapaat
mengatur bagaimanaa sebuah animasi
a berjalan. Untuk
k menjalank
kannya Andaa
dapat mem
milih menu Modify
M lalu pilih Layer…

Gaambar 12. Window

W Layeer Propertiess

Window Scene

11 
 Merupakan window dimana Anda dapat mengatur scene yang ada. Melalui
window ini Anda dapat menambahkan scene, menghapus scene, atau
menduplikasikan sebuah scene. Untuk mengaktifkannya Anda dapat menekan
secara bersamaan tombol Shift+F2 melalui keyboard, atau dengan memilih menu
Modify lalu Scene….

Gambar 13. Window Scene

Menjalankan Flash MX Movie

Untuk menjalankan movie yang telah Anda buat, Anda dapat mengaktifkannya
melalui menu Control lalu pilih Play (tombol Enter pada keyboard). Untuk membuat
movienya Anda dapat menekan tombol Ctrl+Enter secara bersamaan setelah Anda
simpan project Anda.

Konversi File melalui Flash MX

Anda dapat melakukan konversi file melalui flash MX. File yang dikonversi
biasanya berbentuk file *.swf ke dalam bentuk lainnya, seperti *.html, *.exe, *.avi,
dan lain sebagainya. Untuk mengkonversi file flash yang telah Anda buat,
terlebih dahulu Anda harus mengaktifkan konverternya terlebih dahulu. Cara
mengaktifkannya yaitu dengan memberi checkmark pada type file yang Anda
inginkan. Untuk mengaktifkan publish settings Anda dapat memilih menu
File > Publish Settings…
(Ctrl+Shift+F12).

12 
 Gambar 144. Publish Settings
S

K
Keterangan:
Fllash (.swf) : Menghassilkan file *..swf (untuk menjalankaannya
dibutuhk
kan flash plaayer).
H
Html (.html)) : Menghassilkan file *.html
* (diperrlukan interrnet
explorer untuk menjjalankannyaa). Konversi ini
biasanyaa digunakan untuk mem
mbuat web.
G Jpeg, Pn
Gif, ng : Menghassilkan file gaambar.
W
Windows Projector : Menghassilkan file *..exe yang daapat langsun
ng dijalankaan.
M
Macintosh Projector
P : Menghassilkan file *.hqx untuk macintosh.
m

Q
Quick Time : Menghassilkan file *..mov untuk Quick time player.

13 
 DASAR–DASAR MENGGAMBAR OBJEK PADA
FLASH MX

Flash MX menyediakan berbagai macam tools dalam menggambar sebuah

objek. Disini Anda diberikan kebebasan dalam menggambar suatu objek, objek
yang Anda buat tergantung dari imajinasi Anda sendiri.

Pengetahuan Dasar Objek Pada Flash MX

Di dalam Flash MX terdapat berbagai macam objek yang sangat unik

diantaranya yaitu oval tool (yang sering digunakan untuk menggambar
sebuah lingkaran) dan rectangle tool (yang sering digunakan untuk
menggambar sebuah bujur sangkar atau persegipanjang). Kedua tool
tersebut bersifat paten yakni sudah menjadi bawaan Flash MX itu sendiri.
Kedua objek tool tersebut (oval tool & rectangle tool) terdiri dari dua bagian
yaitu: Outline dan fill. Outline merupakan bagian terluar dari objek tersebut,
sedangkan fill merupakan bagian terdalam dari objek tersebut yang dapat diisi
dengan warna atau gambar [Lihat gambar m].

Outline

Fill

Gambar 15. Fill & outline pada objek Flash MX

Outline & Fill dapat disatukan dengan cara membuatnya menjadi satu grup,
yaitu dengan perintah: Group (dapat dipilih melalui menu Modify > Group) atau
dengan cara menekan tombol Ctrl+G secara bersamaan. Tetapi sebelum Anda
menjadikan Outline & Fill menjadi satu grup yang harus Anda lakukan
adalah memblok seluruh bagian Outline & Fill hingga terlihat seperti gambar
m.1. Jika telah diblok maka Anda harus membuatnya menjadi satu grup dengan
14 
 caara yang telaah dijelaskan
n diatas.

Gam
mbar 16. fill ungrouped
u Gambar 17.. fill grouped
d

belah Objek
Memb k dengan Line
L Tool
S
Selain itu dalam p
pemotongan
n gambar melalui Flash M
MX tools
s
sangatlah mudah,
m kareena Anda dapat
d menggunakan beerbagai maccam cara.
M
Misalnya dalam memoto
ong sebuah fill dengan menggunaka
m an line tool.

(i) (ii) (iii)

Gam
mbar 18. (i) merupakan
m f yang belu
fill um dipotong
g dengan lin ne tool, (ii) merupakan
m f
fill
yang
g dipotong dengan
d line tool, (iii) merupakan
m fill yang telah
h terbelah menjadi
m dua.

Mengggambar dengan Pencil Tool

D
Dalam mem
mbuat sebuah
h objek, An
nda dapat meenggunakan
n tool yang terdapat
p
pada Tools box,
b yaitu pencil
p tool.

Straighteen S
Smooth Ink
k

J
Jika Anda memilih Sttraighten maka
m objek yang And
da buat akan berbentu
uk
b
bujur sangkaar yang rap
pi. Tetapi jika
j Anda memilih Sm
mooth makaa objek yan
ng
A
Anda buat akan
a tampak
k halus garisnya meskip
pun tidak seerapih straiighten. Begiitu
p
pula dengan
n Ink bentuknya jug
ga tidak serapih S
Straighten, tetapi yan
ng
m
membedakan
n antara In
nk dengan Sm
mooth adalaah garisnya yang kurang
g halus(massih
t
terlihat kasarr).

15 
Menggambar dengan Pen Tool
Pen tool biasanya digunakan untuk menggambar objek dengan metode
edit points. Untuk menggambar sebuah objek, Anda tinggal menentukan posisi
dari edit points yang Anda inginkan.

Edit points

Gambar 19. objek dengan pen tool

Mewarnai objek dengan Brush Tool

Brush yang artinya sendiri adalah sikat/kuas. Tool ini digunakan untuk mewarnai
sebuah objek secara keseluruhan. Ada 5 metode pemberian warna pada brush tool
(lihat gambar dibawah ini).

(i) (ii) (iii) (iv) (v) (vi)

(i).Gambar asli, (ii).Paint normal, (iii).Paint behind, (iv).Paint selection, (v).Paint

fills, (vi).Paint inside.

Merubah Bentuk Objek dengan Arrow Tool

Merubah dalam flash mx sangatlah mudah dan efisien. Untuk mengubah

bentuk suatu objek Anda dapat menggunakan arrow tool. Dengan arrow tool
Anda tinggal mengubah suatu objek dengan menggerakkan outline (garis
objek) dari objek tersebut.
16 
 Gambar 20. merubah bentuk objek dengan arrow tool

Merubah Bentuk Objek dengan Subselection Tool

Merubah bentuk suatu objek dengan menggunakan Subselection tool

sangatlah mudah dan menyenangkan, karena dengan subselection tool Anda
dapat merubah suatu objek tool menjadi suatu objek yang Anda inginkan.
Lihat gambar dibawah ini yang telah dipilih dengan menggunakan
subselection tool.

Gambar 21. merubah bentuk objek dengan subselection tool

Dengan menggunakan subselection tool maka objek diatas dapat diubah menjadi
objek baru (seperti gambar dibawah ini).

Gambar 22.Objek yang telah diubah

17 
 DASAR – DASAR PEWARNAAN OBJEK PADA FLASH MX

Untuk memberikan efek yang baik pada suatu animasi ada kalanya kita harus
mengatur warna suatu objek agar terlihat menarik. Dalam pewarnaan suatu
objek pada Flash MX kita dapat menggunakan berbagai macam tools,
diantaranya yaitu:
A. Color Mixer.
B. Color Swatches.
C. Paint Bucket Tools.
D. Ink Bottle Tools.
E. Brush Tools.
F. Fill Transform Tools. (Untuk mengatur efek warna radial)

Jika Anda menginginkan animasi yang Anda buat mempunyai tampilan

menarik dan indah, maka Anda harus memberi efek warna yang baik pula.
Oleh karena itu kali ini kita akan belajar bagaimana memberikan efek warna
pada suatu objek agar terlihat lebih indah.

Memberi warna dengan Color Mixer & Color Swatches

Untuk memberi efek warna pada objek pada Flash MX hanya membutuhkan 2 color
tool, yaitu: Color
Mixer & Color Swatches. Saat ini kita akan membahas tentang bagaimana cara
menggunakan tools tersebut.

18 
 Penentu Warna

Penentu Warna Transparan

Penentu Type Fill

Penentu Brightness

Ruang Warna

Gambar 23. Color Mixer

Didalam Color mixer terdapat 5 macam type fill:

1. None – tidak memberi warna apapun pada fill.

2. Solid – memberi warna padat pada fill.
3. Linier – memberi warna berbentuk linier pada fill.

4. Radial – memberi efek warna radial pada fill.

5. Bitmap – memberi image pada fill. (untuk mengimpor file gambar gunakan
import to library pada file menu).

Untuk memberi warna pada objek yang ditentukan, Anda harus menggunakan
tools yang bernama paint bucket tool. Biasanya yang diberi warna pada object
ialah fill-nya saja. Untuk memberi warna pada outline, Anda harus
menggunakan ink bottle tool.
Pada pojok kanan window color mixer terdapat R, G, B (yang biasa disebut
sebagai penentu warna). R(Red) digunakan untuk memberi nilai seberapa besar
kemerahan warna objek tersebut. G(Green) digunakan untuk memberi nilai
seberapa besar kehijauan warna objek tersebut. B(Blue) digunakan untuk
memberi nilai seberapa besar kedalaman warna biru pada objek tersebut. Alpha
memberi efek warna transparan pada objek yang dituju.

19 
 Gambar 24. Color Swatches

Pada color swatches untuk memberi warna pada object prinsipnya sama saja
dengan color mixer, yang membedakannya yaitu kalau pada color mixer Anda
dapat mencampurkan berbagai warna sekaligus memodifikasinya menjadi suatu
efek warna sesuai dengan keinginan Anda. Tetapi kalau pada color swatches
efek warna sudah ditentukan oleh system. Melalui color mixer Anda dapat
membuat warna baru di color swatches.

Mengatur Tata letak warna pada Objek

Untuk mengatur tata letak warna pada objek dapat menggunakan tool yang
b ernama Fill Transform

Tool. Cara menggunakannya yaitu:

1. Pilih seluruh area dari objek tersebut. Kemudian pilih Fill Transform Tool dari
Tools Box.
2. Setelah itu klik kembali objek yang akan diatur warnanya.
Maka hasilnya akan seperti gambar dibawah ini.

20 
 Gambar 25. Object yang diatur warnanya

Selain cara-cara diatas Anda masih dapat mengontrol warna lewat tools box. Hanya
saja warna pilihan untuk outline beserta fill bersifat solid. Kunci kesuksesan
dalam membuat suatu animasi bersifat interaktif terletak dalam pengaturan
warnanya.
Jika Anda memberikan warna yang solid saja pada animasi Anda maka
animasi yang Anda buat tersebut akan terlihat kurang menarik. Karena itu efek
warna sangat diperhitungkan dalam pembuatan
suatu animasi.

21 
 METODE PEMBUA
P ATAN AN
NIMASI

Fram
me by Framee Animation
n
Frrame by frame animation merup
pakan suatu metode peembuatan animasi
a dalaam
flaash mx yaang menggu
unakan fram
me pada tim
meline. Biasaanya animassi yang dibu
uat
deengan metode ini prinssipnya samaa dengan membuat
m seb
buah film pada
p window
ws
m
movie makerr, tetapi bed
danya pada flash mx Anda
A harus menyesuaiikan kuncin
nya
teerlebih dahu
ulu dan meletakkan fillm tersebutt pada kuncci yang telaah dibuat dan
d
diisesuaikan.
U
Untuk membu
uat animasi ini sangatlaah mudah, ik
kutilah petunjuk berikut ini.

1. Gamb
barlah oval tool pada stage.
s Kemu
udian klik kanan
k pada frame kedu
ua
lalu pilih
p Insert

Keyfraame.

Gambaar 26. Memaasukkan key

yframe

2. Setelaah itu dengaan menggunakan eraser tool hapuslaah sebagian

n dari oval to
ool
yang telah Anda buat hinggaa menyerupai gambar dibawah
d inii. Sebelumn
nya
di bag
gian option ubahlah era
aser mode menjadi
m erasse normal.

22 
 Gamb
bar 27. Menghapus ovall tool

3 . Ikutilaah cara diattas untuk menghapus

m b
bagian yang
g lain dari oval
o tool.
Perhatian:: Sebelum menghapus
m oval tool, harus
h memassukkan keyfframe terleb
bih
dahulu. Hapuslah
H perrlahan-lahan
n hingga ovaal tool habiss sesuai den
ngan keyfram
me
yang Anda buat.

Gambar 28. Menyesuaaikan objek dengan

d fram
me
4. Jika Anda
A telah selesai
s mem
mbuatnya, jallankan mov
vie tersebut dengan
d caraa
menekan tombol

Enter. Untuk meng

g-compile film
fi tersebutt tekan Ctrl+
+Enter.

Tween
ned Animattion
Tw
weened anim
mation merrupakan suaatu animasi yang memaanfaatkan faasilitas motiion
daari Flash MX.
M Untuk membuat
m su
uatu animaasi motion sangatlah mudah
m kareena
A
Anda tingg
gal menen
ntukan pan
njang lamaa animasi tersebut diijalankan laalu
m
menggerakka
an dari satu sisi
s ke sisi laainnya. Biassanya objek yang telah di tween paada
tim
meline akan
n terlihat taanda panah
h. Untuk meenggunakan
n animasi tw
ween terseb
but
m
maka ikutilah
h petunjuk berikut
b ini.
1.. Gambar objek (missal: rectang
gle tool) paada stage, kemudian
k b
buatlah objeek
tersebut menjadi
m satu
u group (Ctrrl+G).
2.. Setelah itu klik kanan
k padaa objek laalu pilih Distribute to layers..
23 
 Kemudian
n beri nam
ma layer terssebut dengaan nama kottak dengan cara doublee
click item
m tersebut di timeline.

Gambar 29. Memberi

M nam
ma layer dan
n penentuan
n waktu anim
masi

3. Melalui timeline
t ten
ntukanlah panjang
p anim
masi tersebu
ut berjalan dengan carra
klik kanaan pada fram
me ke 15 lallu pilih inserrt keyframe. (lihat gamb
bar 4)

4. Kemudian
n klik kanaan pada fraame yang telah
t terben
ntuk. Sebelu
umnya blok
k
dahulu keeseluruhan frame terseb
but. Lalu piilih Create Motion Tweeen…. Makaa
frame yan
ng Anda blo
ok tadi akaan keluar seebuah tandaa panah (sessuai panjang
g
frame).

Gambar 300. Membuat motion tween animatio

on

5. Anda gerrakkan objek yang And

da buat dari tempat yan
ng semula kee tempat yaang
lain. Jika objek sudah
h Anda pind
dahkan, silaahkan tekan enter untuk
k menjalank
kan
animasi yang
y Anda disain.
d Makaa objek yan
ng Anda buat
b tadi akan
a bergerrak
dari sisi awal
a menuju ke sisi yang
y lainnyaa secara oto
omatis.

24 
 MEMBUAT ANIMASI TEXT

Animasi  teks  merupakan  salah  satu  bagian  animasi  yang  dapat 

diimplementasikan  untuk  menambahkan  efek  animasi  dan  mempercantik  tampilan 
paket  bahan  ajar  multimedia  yang  akan dikembangkan. Dengan memberikan sedikit 
sentuhan  animasi  pada  teks,  akan  dapat  meningkatkan  “atensi”  pengguna  CD 
interaktif terhadap teks yang dibuat. 

A. Animasi Teks Hilang Timbul

Pada  latihan  ini  kita  akan  membuat  sebuah  animasi  sederhana,  berupa  animasi  
teks  hilang timbul, dengan langkah sebagai berikut : 
1.    Buat   sebuah   file   dokumen   flash   yang   baru,   dengan   ukuran   200   x   800  
pixel,  warna background seting menjadi hitam. 

Gambar 31. Setingan dokumen flash

2.    Buat dua buah layer, masing‐masing layer ubah namanya menjadi teks 1 
(untuk layer 1) dan teks 2 (untuk layer 2). 

Gambar 32. Pembuatan 2 layer pada dokumen flash

3.        Pada   layer   Teks1,   klik      frame   1,   kemudian   klik   Text   Tool   (  ),   untuk  
membuat  sebuah teks  pada  layer Teks1, dengan setingan seperti  terlihat pada 
Gambar 33. 

25 
 Gambar 33. Setingan Huruf teks yang akan dibuat

4.    Kemudian,  tempatkan  text  tool  pada  halaman  dokumen  flash,  dan  drag  
sesuai    dengan  ukuran  teks  yang  akan  digunakan,  kemudian  ketikkan 
“Teknik  Informatika  FT  UMP”,  atau  sesuaikan  dengan  teks  yang  akan 
dibuat. 

Teknik Informatika FT UMP

Gambar 34. Teks pada layer Teks 1

5.    Selanjutnya, konvert teks tersebut menjadi symbol (convert to symbol = F8), 
pilih opsinya menjadi grafik dan namakan dengan teks1 

Gambar 35. Konversi teks menjadi symbol grafik

6.    Pada  layer  1,  klik  kanan  pada  frame  ke  30,  pilih  Insert  Key  Frame,  untuk  
membuat sebuah key frame pada frame ke 30, Kemudian lakukan hal sama pada 
frame ke 7 dan 25 

26 
 Gambar 36. Penempatan key frame pada frame 7, 25 dan 30

7.   Rencana  animasi  teks  yang  akan  kita  buat  adalah,  teks  “Teknik  Informatika  
FT    UMP    “  tersebut  semula  tidak  tampak,  kemudian  muncul  dan  setelah  itu 
hilang kembali. 

8. Klik frame 1 pada layer Teks 1, kemudian klik tulisan teks yang telah dikonversi 
menjadi  grafik,  kemudian  pilih  property  color,  seting  nilai  alpha‐nya  menjadi 
0% 

Gambar 37. Pengaturan alpha teks menjadi 0%

9.    Lakukan langkah yang sama (langkah 8) pada frame 30 

10.  Klik kanan pada frame 3, 15 dan 27, pilih Create Motion Tween 

Gambar 38. Pembuatan sebuah Motion Tween

11.  Jika  ingin  memperoleh  waktu  animasi  yang  lebih  panjang,  maka  silahkan  
atur  durasi panjang frame yang akan digunakan. 
12.   Kemudian      pada      layer      Teks2,      gunakan      kembali      Text      Tool,      untuk   
membuat   teks “Mempersembahkan”, dengan setingan sebagai berikut : 

27 
 Gambar 39. Setingan teks Mempersembahkan

13.  Kemudian drag, frame 1 ke frame 31 

14.  Setelah  itu  dikonversi  menjadi  symbol,  dengn  nama  Teks2,  dan  behaviornya 
Graphic 
 

Gambar 40. Konversi teks ke symbol Teks2

15.  Pada layer Teks2, klik kanan pada  frame ke 60, pilih  Insert Key Frame, untuk 

membuat  sebuah  key  frame  pada  frame  ke  60,  Kemudian  lakukan  hal  sama 
pada frame ke 37 dan 50. 

Gambar 41. Penempatan key frame pada frame 37, 50 dan 60

16.  Rencana  animasi  teks  yang  akan  kita  buat  adalah,  teks  “Mempersembahkan“  
tersebut semula tidak tampak, kemudian muncul dan setelah itu hilang kembali. 
17.    Klik  frame  31  pada  layer  Teks  2,  kemudian  klik  tulisan  teks  yang  telah 
dikonversi menjadi grafik, kemudian pilih properti color, seting nilai alpha‐nya 
menjadi 0% 

Gambar 42. Pengaturan alpha teks menjadi 0%

28 
 18.  Lakukan langkah yang sama (langkah 17) pada frame 60 

19.  Klik kanan pada frame 33, 45 dan 57, pilih Create Motion Tween 

Gambar 43. Pembuatan sebuah Motion Tween

20.  Jika  ingin  memperoleh  waktu  animasi  yang  lebih  panjang,  maka  silahkan  
atur  durasi panjang frame yang akan digunakan. 

 
B.  Animasi Teks Muncul Satu Persatu 

Pada    latihan    ini    kita    akan    membuat    sebuah    animasi    teks,    yang  
memperlihatkan    tulisan  teksnya  muncul  perkarakter,  kemudian  hilang  kembali 
perkarakter. 
Ikuti langkah kerja berikut ini : 

1.    Buat   sebuah   file   dokumen   flash   yang   baru,   dengan   ukuran   200   x   800  
pixel,  warna background seting menjadi hitam. 

Gambar 44. Setingan dokumen flash

2.    Layer 1 ubah namanya menjadi teks 1. 

3.  Aktifkan   Text   Tool,   kemudian   tempatkan   sebuah   teks   baru   “CD   Interaktif”  
dengan setingan huruf, sama dengan setingan di atas (lihat langkah 3 Latihan A) 

Gambar 45. Setingan Teks CD Interaktif

29 
 4.   Kemudian  pisahkan  masing  –  masing  karakter  huruf  dengan  menggunakan 
break  apart  yang    dapat    dilakukan    dengan    mengklik    menu    modify      
break  apart  atau  dengan mengklik tombol Ctrl+B secara bersamaan. 
 

Gambar 46. Pemisahan huruf dengan break apart

5.  Kemudian  masing‐masing  huruf  diditribusikan  menjadi  layer  terpisah  dengan  

distribute to  layer  dengan  mengklik  menu  Modify    Timeline    Ditribute 
to Layer atau dengan mengklik tombol Ctrl+Shift+D 

Gambar 47. Hasil pendistribusian karakter

6.    Layer Teks1 saat ini sudah dapat dihapus. 

7.    Kemudian,    selanjutnya    kita    atur    urutan    munculnya    huruf    satu    persatu,  
dengan    jarak  muncul    masing‐masing    huruf    adalah    2    frame,    maka  
masing‐masing    huruf    kita    atur  posisinya    pada    frame    dan    layer  
masing‐masing.  Misalnya  Huruf  C  kita  biarkan  berada pada  frame  1,  huruf  
D  digeser  ke  frame  3,  huruf  I  digeser  ke  frame  5  dan  seterusnya, sehingga  
masing‐masing    karakter    digeser    per    dua    frame    pada    masing‐masing  
layernya secara berurutan. Hasilnya dapat dilihat pada Gambar 48. 

30 
 Gambar 48. Pengurutan tampilan huruf

8.    Selanjutnya pada layer C, klik kanan pada frame 31, pilih Insret Frame 

9.  Kemudian, selanjutnya kita atur urutan hilangnya huruf satu persatu, dengan 
jarak hilang masing‐masing huruf adalah 2 frame, maka masing‐masing huruf 
kita  atur  posisinya  pada  frame  dan  layer  masing‐masing.  Misalnya  Huruf  C 
kita biarkan insert frame pada frame 31 (langkah 8), huruf D diinsert frame 
pada  frame  33,  huruf  I  diinsert  frame  pada  frame  35  dan  seterusnya, 
sehingga  masing‐masing  karakter  diinsert  frame    per  dua  frame  pada 
masing‐masing  layernya  secara  berurutan.  Hasilnya  dapat  dilihat  pada 
Gambar 49. 

Gambar 49. Hasil pengaturan muncul dan hilang huruf pada flash

10.  Jalankan dengan menekan CTRL+Enter 

31 
C.  Animasi Teks dengan Time Line Effect 

Selain  membuat  animasi  dengan  menggunakan  fasilitas  rancangan  sendiri, 

seperti  langkah  di  latihan  A  dan  B,  banyak  aefek  teks  lainnya  dapat  dibuat 
dengan Flash menggunakana fasilitas time line effect yang ada pada flash. 
Langkah    untuk    memanfaatkan   fasilitas    timeline    effect    ini   adapat    dilakukan  
dengan  langkah sebagai berikut : 
1.    Buatlah sebuah dokumen flash baru, seperti pada latihan A dan B 

2.    Buatlah sebuah teks seperti : Jaringan Komputer 

Gambar 50. Teks Jaringan Komputer

3.    Gunakan sub selection tool (   ), klik pada teks 

4.  Klik  menu  Insert  Timeline  Effect  Effect  kemudian  pilih  beberpa  efek  yang 
tersedia, seperti terlihat pada Gambar 51. 

Gambar 51. Beberapa efek pada timeline efek

5.    Untuk  membuat  efek  mengabur  (blur),  efek  membayang  (Drop  Shadow),   
efek  mebesar  (ekspand)    dan    efek    Berserakan    (Explode)    silahkan    pilih  
sesuai   dengan   efek   yang   anda  inginkan,  kemudian  untuk  menjalankannya 
tekan tombol  Ctrl+Enter 

32 
Latihan

1.    Buatlah    sebuah    animasi    pembuka    (welcome    screen)    sebuah    CD    Interaktif  
seperti    yang  terlihat  pada  contoh  file  latihan  yang  telah  tersedia  pada  site 
penulis. 
2.  Animasi   welcome   screen   disesuaikan   dengan   paket   CD   Interaktif   yang   
akan   akan dikembangkan 

33 
 MENGUBAH PRESENTASI POWER POINT KE DALAM
MACROMEDIA FLASH MX

Untuk mengubah Power Point ke dalam Macromedia Flash MX dibutuhkan beberapa langkah
antara lain:

• Buka Slide power point yang ada pada harddisc Komputer anda.
• Klik File > Save As > pada Save as type pilih windows metafile.

Gambar 52.Menyimpan dengan tipe windows metafile..

• Jika ditanya, apakah anda mau menyimpan semua slide, maka jawaban adalah setiap slide
(every slide).
• Buka Macromedia Flash MX > File > Import > Import to Stage> pilih slide .wmf yang akan
diimport > open.
• Setelah itu kita dapat mengedit sesuai dengan keinginan kita.
Dalam mengubah Power Point ke dalam Macromedia Flash terdapat beberapa kelemahan
antara lain kita harus menata ulang tampilan Power Point pada Flash dan sangat tidak efisien
kalau Slide yang akan diubah terlalu banyak jumlahnya.

34 
Memasukan Animasi Flash ke dalam Power Point.

Langkah-langkah yang diperlukan untuk memasukan animasi Flash ke dalam Power Point
antara lain:

• Buka file Power point pada Komputer anda.

• Klik menu View pada Power Point > Toolbars > Control Toolbox.

Gambar 53.Tampilan dari menu view.

• Pilih Shockwave Flash Object.

35 
 Gambar 54. Ttampilan dari control too box.

• Klik pada stage Power Point.

Gambar 55. Tampilan flash obyek pada stage.

• Klik kanan > Properties sehingga muncul menu seperti gambar dibawah ini.

36 
 Gambar 56. Tampilan properties shockwave flash.

• Klik dua kali pada (Custom) maka akan muncul kotak dialog properties pages > isi Movie URL
sesuai dengan lokasi file .swf yang kita letakan, misalnya di e:\fla/home.swf.

Gambar 57. Masukan path dimana flash obyek berada..

• Pada Properties Pages > Scale > NoBorder > OK.

• Tekan F5 untuk melihat hasilnya.
Memasukan animasi Flash ke dalam Power Point jauh lebih efisien dari pada mengubah Power
Point menjadi animasi Flash.

37 
Referensi :
http://www.prasdikatamajr.co.nr/
Copyright © 2003 – 2006 IlmuKomputer.Com

Komunitas eLearning IlmuKomputer.Com

Copyright © 2003-2008 IlmuKomputer.Com

38