SlideShare a Scribd company logo
1
Modul Adobe Flash CS.5
Tujuan Instruksional Umum
Mahasiswadapatmembuatmediapembelajaran berbasis animasi, video dan audio (multimedia) secara
interaktif.
A. Mengenal Tools Pengolah Multimedia (Adobe Flash CS5)
Program ini berbasis vektor grafis, jadi aksesnya lebih cepat dan terlihat halus pada skala
resolusi layar berapapun. Program ini juga dapat diisi dengan bitmap yang di-impor dari
program lain. Salah satu keunggulannya adalah ukurannya yang begitu kecil namun dapat
menampilkan animasi web yang mengagumkan. Flash juga mempunyai kemampuan untuk
membuat animasi secara streaming, yaitu dapat menampilkan animasi langsung meskipun
proses download dan loading belum selesai seluruhnya. Selain itu, dengan Flash juga dapat
dibuat movie kartun dan aplikasi web interaktif yang memungkinkan pengguna dapat
berinteraksi langsung dengan aplikasi yang dibuat. Movie Flash juga bisa memasukkan unsur
interaktif dalam movie-nyadengan Action Script(bahasapemrogramandi Flash) sehingga user
bisa berinteraksi dengan movie melalui keyboard atau mouse untuk berpindah ke bagian-
bagianyang berbeda dari sebuah movie, memindahkan objek-objek, memasukkan informasi
melalui form, dan operasi-operasi lainnya.
Kelebihan lain yang dimiliki program Adobe Flash adalah mampu membuat tombol
interaktif dengan sebuah movie atau objek yang lain. Adobe Flash mampu membuat
perubahan transparansi warna dalam movie. Adobe Flash mampu membuat perubahan
animasi dari satu bentuk ke bentuk lain dan mampu membuat gerakan animasi dengan
mengikuti alur yang telah ditetapkan. Dengan Adobe Flash, file dapat dikonversi dan
dipublikasikan (publish) ke dalam file aplikasi (exe).
2
B. Memahami User Interface Adobe Flash CS.5
Ini adalah interface dari macromedia Adobe Flash CS5.
Gambar 1. Interface Adobe Flash CS5 (Caption)
Gambar 2. Lingkungan kerja adobe flash cs5 (Caption)
Toolsbox
Stage
Action
Layer
Timeline
Color/ swatches
Propertis
Library
3
Keterangan Lingkungan Kerja Adobe Flash CS5 :
 Toolbox,kumpulantool atauperalatanyangmempunyai fungsi-fungsi tersendiri untuk
berbagai keperluan seperti desain, editing, dan pengaturan gambar atau objek.
 Title Bar, merupakan nama file atau judul program yang sedang aktif atau sedang
digunakan.
 Action Script, actionScript adalah bahasa pemprograman di flash. Adobe Flash CS5
mendukung semua versi ActionScript 2.0. ActionScript digunakan untuk mengontrol
objek, navigasi, animasi, dll. Untuk membuat program yang dibuat lebih interaktif.
 Timeline Panel, atau garis waktu mempunyai fungsi untuk membantu penempatan
objek pada fungsi waktu.
 Stage, halaman kerja yang digunakan untuk menempatkan berbagai macam objek
flash yang akan ditampilkan.
 Color Mixer Panel, panel yang berfungsi untuk pengaturan warna dari gambar atau
objek.
 Transform
 Library Panel, panel yangmenyimpanobjek-objekseperti movie clip, graphic, button,
sound, video, dll, yang digunakan dalam pembuatan aplikasi.
 Layer, dapat dianalogikan sebagai kanvas suatu lukisan. Jumlah layer bisa lebih dari
satu,dalam kata lainberlapis-lapis. Layer yang berada paling atas adalah kanvas yang
terdepan.
Mengenal Toolbox dan Panel
 Toolbox
FasilitasToolbox sepertitelahdijelaskansekilas diawal adalah sekumpulan tool atau alat
yang mempunyai fungsi-fungsi tersendiri untuk keperluan desaindsb, berikut ini
penjelasan setiap tool yang ada di Toolbox.
4
Gambar 3. Toolbox (Caption)
Tabel 1. Keterangan toolbox
No Gambar Keterangan
1 Arrow Tool (V) atau disebut juga Selection Tool berfungsi
untuk memilih atau menyeleksi suatu objek.
2 SubselectionTool (A),berfungsi menyeleksi bagian objek
lebih detail dari pada Selection Tool.
3 Free Transform Tool (Q), berfungsi untuk
menstransformasi objek yang terseleksi.
4 Gradient Transform Tool (F), berfungsi untuk
mentransformasi warna dari fiil objek yang terseleksi.
5 Lasso Tool (S), digunakanuntukmelakukanseleksi dengan
mengambar sebuah garis seleksi.
6 Pen Tool (P), digunakan untuk mengambar garis dengan
bantuan titik-titik bantu.
7 Add Anchor Point Tool (=), berfungsi untuk menambah
Anchor Point dari garis, kurva atau gambar.
8 Delete Anchor Point Tool (-), berfungsi untuk menghapus
Anchor Point dari garis, kurva, atau gambar.
5
9 Convert Anchor Tool (C), berfungsi untuk mengkonfersi
garis, kurva atau gambar.
10 Text Tool (T), digunakan untuk membuat objek text.
11 Line Tool (N), digunakanuntukmengambarataumembuat
garis.
12 Rectangle Tool (R), digunakan untuk mengambar bentk
persegi panjang atau bujur sangkar.
13 Oval Tool (O), digunakan untuk membuat bentuk bulat
atau oval.
14 Poly Star Tool, digunakan untuk menggambar bentuk
dengan jumlah segi yang diinginkan.
15 Pencil Tool (V), digunakan untuk membuat garis.
16 Brush Tool (B), digunakanuntukmengambarbentukgaris-
garis dan bentuk-bentuk bebas.
17 Ink Bottle (S), digunakan untuk mengubah warna garis,
lebar garis, dan style garis, atau garis luar sebuah bentuk.
18 Paintbucket Tool (K), digunakan untuk mengisi area-area
kosong atau digunakan untuk mengubah warna area
sebuah objek yang telah diwarnai, paint bucket dapat
digunakan untuk mewarnai warna solid, pengisian warna
gradiasi dan pengisian bitmap.
19 Eyedropper Tool (I), digunakan untuk mengambil sampel
sebuah warna dari gambar atau objek.
20 Eraser Tool (E), digubakan untuk menghapus objek.
21 Hand Tool (H), digunakanuntukmenggesertampilan stage
tanpa mengubah pembesaran.
22 Zoom Tool (M,Z), digunakan untuk memperbesar atau
memperkecil tampilan stage.
6
23 Stroke Color digunakan untuk memilih atau memberi
warna pada suatu garis.
24 Fiil Color digunakan untuk memilih atau memberi warna
pada suatu objek.
25 Black and White digunakan hanya untuk memilih warna
hitam dan putih saja.
 Adobe Flash Player
Flash Player digunakan sebagai player untuk menjalankan file-file yang berekstension .
swf (shockwave flash). Untuk mengeksekusi file fla. Ke swf , silahkan tekan ctrl + enter.
Gambar 4. Flash player (swf) (Caption)
7
 Cara Menyimpan File
Klik File -> klik save as -> Ketik nama filenya -> Pilih atau buat folder baru untuk
menyimpan file -> Klik save.
Gambar 5. Menyimpan file (Caption)
C. Membuat Animasi Sederhana
1. Dasar Animasi
Dalampembutananimasi selalu berhubungan dengan frame. Frame adalah suatu bagian dari
layer yangterdapatdalam panel timeline yangdigunakanuntukmengaturpembuatananimasi.
Gambar. 6. Bagian Panel Timeline
Suatuanimasi dapatberjalanolehadanyaperpindahandari frame ke frame. Semakin panjang
frameyang dibutuhkanmakasemakinlamaanimasi ituberjalan.Suatuanimasibisaterdiri dari
8
beberapa layer. Suatu layer dapat diikuti layer guide dan layer mask. Layer guide berfungsi
untuk memberikan panduan pada layer yang diguide. Layer mask berfungsi untuk
menyembunyikansertamenampilkanbagianlainpada layerdimasking.Berikutini dasar-dasar
dari animasi.
 Motion Tween
Motion Tween adalah animasi yang digunakan untuk menggerakkan objek yang sudah
dikonversi ke dalam bentuk simbol berdasarkan batas suatu keyframe tertentu. Simbol-
simbol dalam flash yaitu movie clip, button dan graphic.
Cara pembuatan animasi motion tween adalah :
 Tentukan frame awal dari animasi
 Buat objek animasi
 Konversi objek ke dalam symbol yang diinginkan
 Tentukan frame akhir dari animasi
 Sisipkan create motion tween diantara frame awal dan frame akhir sehingga muncul
garis panah
 Pada frame akhir tentukan letak posisi objek -> Eksekusi animasi dengan test movie.
Gambar. 7 Bentuk Layer pada Tehnik Motion Tween
 Shape Tween
Shape Tween adalah animasi yang digunakan untuk mengubah satu bentuk ke bentuk
yang lain. Objek harus berupa objek normal (objek ter-break a part).
Frame Akhir
Objek
Twen ShapeFrame Awal
9
Cara pembuatan animasi shape tween
sama seperti pada motion tween, perbedaannya objek tidak dalam bentuk simbol.
Animasi ini posisi objek tidak berubah, hanya mengalami perubahan bentuk.
Gambar. 8 Bentuk Layer pada Tehnik Shape Twee
 Teknik Guide
Teknik guide adalah teknik menggerakkan animasi sesuai guide yang telah dibuat pada
layer guide. Guide yang dibuat berupa garis yang mempunyai arah dan lintasan tertentu
Gambar. 9 Bentuk Layer Pada Tehnik Guid
Cara membuatGuide adalah sebagai berikut:
 Buka lembarkerjaAdobe FlashCS.5
Frame Awal
Twen Shape
Frame Akhir
Objek tidak terkonfersi dalam simbol
Layer yangdi guideLayer guide
Garis guideObjek animasi
10
 Buatlahsebuahobjeklingkarandalamstage padalayer1 dan frame 1
Membuat Motion Guide 1
 Ubah lingkaranyangtelahdibuatmenjadi bentukmovieclip.Caranyaklikkanan
pada objeklingkaran→converttosymbol→isikan Name denganlingkaran, Type :
Movie clip, Registrationberadadi tengah→OK,makaakanmenjadi seperti
berikut;
Membuat Motion Guide 2
Terdapatseleksi persegi disekelilinglingkaran.
11
 Klikkananpada layer1, lalupilihAddClassicMotionGuide.
Membuat Motion Guide 3
 Lalu akanmuncul Layer Guide.
Membuat Motion Guide 4
 Pada LayerGuide buatlahlintasanuntukpergerakandari objeklingkarandengan
menggunakanPencil Tool.
12
Membuat Motion Guide 5
 Tempatkan lingkarantepatdiujunggarislintasanyangtelahdibuat.Registration
pointobject(Titiktengahyangtedapatpadalingkaran) wajibtepatdi titikpaling
ujunggaris.
13
Membuat Motion Guide 6
Membuat Motion Guide 7
14
 Blokframe 10 pada masing-masinglayer.Laluklikkanan→InsertFrame
Membuat Motion Guide 8
 Klikkananpada frame 10 Layer1→pilihInsertKeyFrame
Membuat Motion Guide 9
 Pada layer1 frame 10 tersebutpindahkanobjeklingkaranke ujunggarislintasan
yang laindenganposisi Registrationpointobjecttepatpadaujunggaris.
15
Membuat Motion Guide 10
 Klikkananpada frame 1 layer1→pilihCreate ClassicTween
Membuat Motion Guide 11
16
 Lalu time line akanmenjadi sepertiberikut.
Membuat Motion Guide 12
 Lalu untukmengujinyatekanCtrl+Enter
Membuat Motion Guide 13
17
 Teknik Masking
Teknik masking digunakanuntuk menyembunyikan isi layer lain tetapi akan ditampilkan
saat movie dijalankan. Animasi masking mempunyai dua metode dasar, yang pertama
adalah area masking yang bergerak sedang objek yang dimask diam, yang kedua adalah
area masking yangdiamsedangobjekyangdimask bergerak. Kedua teknik tersebut akan
menampilkan animasi yang berbeda.
Gambar.10 Bentuk Layer Pada Teknik Masking
 Membuat Animasi Huruf Dengan Masking
 Siapkan tiga buah layer dengan cara menekan icon New Layer yang tersedia dibawah
Timeline. Perhatikan gambar dibawah !
 Lalu layer akan bertambah seperti berikut :
Layer masking
Membuat Animasi HurufDengan
Masking 1
18
Membuat Animasi Huruf Dengan Masking 2
 Ubah nama Layer 1 dengannama yangdiinginkan.Disini silahkandenganganti dengan
nama Objek1 dengan cara klik dua kali pada Layer 1.
Membuat Animasi HurufDengan Masking 3
 Klik frame 1 pada layer Objek1 dan buatlah sebuah teks pada Stage. Buatlah teks
bertuliskan “Maskingku” dengan warna bebas.
19
Membuat Animasi HurufDengan Masking 4
 SekarangubahLayer 2 dengannamaObjekCopydengancara seperti mengubah nama
layer 1. Lalu Copy-kan teks “Maskingku” dari layer Objek1. Posisi harus sama persis
dengan cara klik kanan→Paste In Place di stage frame 1 Layer Objek Copy.
20
Membuat Animasi HurufDengan Masking 5
 Seolah tidak ada perubahan, akan tetapi apabila teks tersebut digeser maka akan
terlihat teks tersebut sudah ter-Copy
 Ubahlah warna teks”Maskingku” pada layer Objek Copy cengan warna yang berbeda
dengan teks “Makingku” di Layer Objek1.
21
Membuat Animasi HurufDengan Masking 6
 Pembedaanwarnatersebutakan berpengaruh ketika animasi berjalan. Warna kilatan
yang akan muncul, sesuai dengan warna teks pada Layer Objek Copy.
 Ubah nama Layer 3 dengan nama Animasi. Lalu pada frame 1, buatlah objek dengan
warna bebas serta posisi seperti berikut :
22
Membuat Animasi HurufDengan Masking 7
 Lalu, untuk menggerakkan animasi, tambahkan frame pada setiap layer dengan cara
blok frame 10 pada masing masing layer→klik kanan→Insert Frame. Maka akan
muncul seperti berikut :
Membuat Animasi HurufDengan Masking 8
23
 Blok frame 10 pada layer animasi, Lalu klik kanan→insert key frame.
Membuat Animasi HurufDengan Masking 9
 Ubah posisi objek animasi ke tempat yang berbeda
Membuat Animasi HurufDengan Masking 10
24
 Agar animasi dapat berjalan dengan halus, maka dibutuhkan tweening. Caranya klik
frame 1 layer Animasi→klik kanan→Create Classic Tween hingga tampilan frame
menjadi seperti berikut :
Membuat Animasi HurufDengan Masking 11
 Langkah terakhir klik kanan pada layer Animasi→mask. Maka tampilan akan seolah –
olahhilangdankembali seperti semula.Akantetapi hal tersebutmenandakan masking
telah berhasil.
 Lalu untuk melihat hasilnya, silahkan tekan tombol Ctrl+Enter maka akan jadi seperti
berikut ;
Membuat Animasi HurufDengan Masking 12
25
2. Mengenal Common Libraries
Common libraries adalah semacam perpustakaannya adobe flash. Untuk mengaktifkan dari
common libraries tersebut silahkan :
 Klik Window
 Klik Common Libraries
 Klik library yang diinginkan (Buton, Classes, Sounds).
Gambar.11 Common Libraries
26
Ini adalah tampilan dari Common Library Button :
Gambar.12 Libraries Button
Ini adalah tampilan dari Common Library Classes :
Gambar.13 Libraries Classes
27
Ini adalah tampilan dari Common Library Sounds :
Gambar.14 Libraries Sounds
28
2.1. Membuat Variasi Teks
Didalamadobe Flashjugaterdapatberbagai variasi teks yang bisa digunakan dalam membuat
animasi. Diantaranya ada Static Text, Dynamic Text, dan Input Text.
Static Text : Jenis Teks yang tidak dapat diubah secara dinamis, Tulisan yang tertera pada
Static Text tidak akan berubah selama movie dijalankan.
Gambar.15 Static Text
Dynamic Text : Jenis teks yang dapat diubah secara dinamis. Tulisan yang tertera pada
Dynamic Text dapat berubah selama movie dijalankan.
Gambar.16 Dynamic Text
29
Input Text : Jenisteksberupakotakisian,danpemakai dapat memasukkan input didalamnya.
Input text biasa digunakan dalam form aplikasi.
Gambar.17 Input Text
2.2. Membuat Teks
Teksyang dibuatFlashdapatberupa teks mendatar (horizontal), atau teks vertikal. Teks yang
kita buat
dapat dimodifikasi menggunakan Properties Text Tool.
Gambar.18 Properties Text Tool
 Klik Text Tool pada Toolbox
 Didalam Properties Text Tool isilah sesuai yang diinginkan.
 Klik area dalam stage, sehingga muncul kotak tempat menuliskan teks.
30
D. Mengenali dan Membuat symbol
1. Mengenali Symbol
Symbol terdiri dari graphic, button, atau movieclip yang dibuat pada Flash Pro menggunakan
button (Action Script 2.0), Simple Button (Action Script 3.0), dan Movie Clip. Yang dapat
digunakan kembali dalam dokumen lain.
 Gunakan symbol Graphic ( ) untuk gambar statis dan untuk membuat potongan
animasi yang terkait dalam timeline utama. Animasi interaktif dan suara tidak dapat
digunakandalamsymbol Graphic.Tambahkansymbol Graphicdalamdokumenflashkarena
Graphic tidak membutuhkan timeline, tidak seperti button dan Movie Clip.
 Gunakan symbol Button ( ) untuk membuat tombol interaktif yang merespon
klik mouse, rollover, atau perintah lainnya. Untuk informasi lebih lanjut, lihat tutorial
selanjutnya. (cari tutor ttg AS)
 Gunakan symbol Movie Clip ( ) untukmembuatpotongan-potongan animasi yang
dapat digunakan kembali. Movie Clip memiliki Timeline multiframe sendiri yang
independen dari Timeline utama-bisa disebut multiframe dalam Movie Clip tergabung
dalam Timeline utama yang dapat berisi control interaktif, suara, dan bahkan Movie Clip
yang lainnya.Selainitu,Movie Clipdapatdiletakkandi dalamTimeline symbol Buttonuntuk
membuat Button animasi. Sebagai tambahan, Movie Clip juga dapat diberi Action Script.
 Gunakan symbol Font untuk meng-eksport sebuah font dan menggunakannya pada
dokumen Flash Pro yang lain.
2. Membuat Symbol
Membuat symbol yang berisi animasi yang dibuat dengan aplikasi Flash Pro memungkinkan
untuk membuat banyak variasi dan meminimalkan ukuran file. Jika animasi yang digunakan
berulang-ulang atau menggunakan gerakan yang sama-sebagai contoh, gerakan naik-turun
pada sayap burung. Untuk menambah symbol dalam dokumen, gunakan Library Assets yang
31
berisi symbol-symbol yang telah digunakan atau yang sedang digunakan. Dengan cara men-
drag symbol dari Library Assets ke dalam Stage.
Mengubah Sebuah Elemen Menjadi Symbol
 Lakukan salah satu dari berikut
 Pilih Modify-> Convert to Symbol atau dengan menekan shortcut F8
32
 Drag elemen yang diseleksi ke panel Library
 Klik kanan>dan pilih Convert to Symbol dari Context Menu
33
 Di dalam kotak Convert to Symbol, tulis nama symbol dan pilih jenis symbol (Movie Clip, Button, atau
Graphic).
 Klik OK.
*Setelahmenjadi symbol,secaraotomatiselemenyangdijadikansymbol akan masukke dalam
Library. Untuk mengedit symbol, dapat dilakukan dengan memilih Edit -> Edit Symbol atau
dengan Edit -> Edit In Place.
Membuat Symbol Kosong
Lakukan salah satu dari berikut :
 Pilih Insert -> New Symbol
34
 Klik tombol New Symbol pada kiri bawah pada panel Library
 Pilih New Symbol dari menu panel Librarydi sudut kanan atas panel Library
 Pada kotak dialog Create New Symbol, tulis nama symbol dan pilih jenis symbol.
 Klik OK.
35
 Untuk membuatisisymbol,gunakantimeline,menggambar dengan drawing tools, mengimpor media,
atau membuat turunan dari symbol lainnya.
Untuk kembali ke mode document-editing, lakukan salah satu dari berikut :
 Klik tombol Back
 Pilih Edit -> Edit Document
36
 Klik nama scene di Edit Bar.
FlashPro menambahkansymbol ke Librarydanberalihke mode symbol-editing. Dalam mode
symbol-editing, nama symbol muncul di kiri atas Stage, dan titik hitam menandakan
registration point symbol tersebut.
3. Membuat Symbol Button
 Frame pertama adalah Up state, mewakili penampilan button setiap kali pointer mouse tidak
menyentuh button.
 Frame kedua adalah Over state, mewakili penampilan button setiap kali pointer mouse menyentuh
button.
 Frame ketiga adalah Down state, mewakili penampilan button setiap kali button diklik.
37
 Frame keempat adalah Hit state, mendefinisikan area fisik yang merespon klik mouse. Daerah ini
terlihat setiap kali file SWF bermain di Flash Player.
Mengedit Symbol Button
Lakukan cara berikut :
 Double klik pada button tersebut atau masuk edit kemudian pilih edit symbol
 Untuk membuat isi symbol, gunakan timeline, menulis text , menggambar dengan drawing tools,
mengimpor media, atau membuat turunan dari symbol lainnya.
E. Sound dan Video
Tentang Jenis File yang Dapat di-Import
 Graphic Format
File Type Extension File Type Extension
Adobe Illustrator
.ai Adobe Photoshop .psd
AutoCAD DXF
.dxf Bitmap .bmp
Enhanced Windows
.emf Future Splash Player .spl
38
Metafile
GIF dan Animated
GIF
.gif JPEG .jpg
PNG
.png Flas Player 6/7 .swf
Windows Metafile
.wmf Adobe XML Graphic
File
.fxg
 Sound Format
File Type Extension File Type Extension
Adobe Soundboth
.asnd Wave .wav
MP3
.mp3
 Video Format
File Type Extension File Type Extension
Video Adobe Flash
.flv, .f4v Quick Time Movie .mov, .qt
Video for Windows
.avi MPEG .mpg, .mlv, .m2p,
.m2t, .m2ts, .mts,
.tod, .mpe, .mpeg
MPEG-4
.mp4, .m4v, .avc Digital Video .dv, .dvi
3GPP/3GPP2 for
mobile devices
.3gp, .3gpp, .3gp2,
.3gpp2, .3p2
 Import Sound
39
 Pilih File -> Import -> Import to Library.
 Pada kotak dialog Import, pilih file yang akan dimasukkan ke dalam Flash.
Import Sound ke Timeline
 Import suara ke dalam Librarylebih dahulu.
40
 Pilih Insert -> Timeline -> Layer.
 PadaLayer yang baru, drag Sounddari Libraryke dalam Stage. Dianjurkan,tiapsounddiletakkanpada
Layer yang berbeda.
 Pada Timeline, pilih frame pertama yang berisi file sound
 Pilih Window -> Properties -> klik tanda panah di sudut kanan bawah untuk memperluas Property
Inspector.
 Pada Propertyinspector, pilih file sound dari pop-up menu.
Efek Pop-up Menu
 Pilih salah satu efek dari pop-up menu :
41
 None, untuk menghapus efek yang sebelumnya diterapkan.
 Left Channel/Right Channel, untuk memainkan suara dari channel kanan/kiri
saja.
 Fade In, secara bertahap meningkatkan volume suara.
 Fade Out, secara bertahap mengurangi volume suara.
 Custom, memungkinkan untuk membuat custom in dan out point
menggunakan Edit Envelope.
 Pilih pilihan sinkronisasi dari pop-up menu.
Catatan : Jikamemasukkanlebihdari satusounddalamsatu layer,gunakanpilihan
Stop.
42
 Masukkan value untuk menentukan berapa kali suara mau diulangi (loop), pilih loop
untuk mengulangi suara terus menerus.
 Untuk mengetessuara,tarikplayheadke frame yangberisi suara ataugunakantombol
yang ada pada Controller menu.
43
F. Action Script
1. Menjelaskan Bahasa syntax action script 2.0
Pengunaan Action Script pada movie clip selalu diikuti dengan event. Jadi Action Script
tersebutakandijalankanpadasaatevent berlangsung. Bila ingin membuat Action Script pada
movie clip, clik movie clip hingga muncul tulisan Action – Movie Clip di atas docker Action
Script. Lalu ketik listing program pada tempat yang disediakan.
Ada beberapa event yang lain misalnya :
 Load : Saat movie clip loading
 EnterFrame : Setiap movie clip menjalankan frame
 Unload : Saat movie clip di unload
 Mouse down : Setiap klik mouse di tekan
 Mouse up : Setiap klik mouse di lepas setelah di klik
 Mouse move : Setiap mouse digerakkan
 Key down : Setiap tombol keyboard ditekan
 Key up : Setiap tombol keyboard dilepas setelah ditekan
G. Mengaplikasikan action :
play(),stop(),gotoAndStop(),gotoAndPlay
Goto adalah perintah yang banyak terdapat pada berbagai bahasa pemrograman. Tak
terkecuali padaActionScriptFlash.BahkanpadaActionScriptFlash goto ada berbagai macam.
Pada pokoknya ada 2 macam goto yang dibedakan karena proses melompatnya yaitu :
 gotoAndPlay perintah ini digunakan untuk melompat ke suatu tempat dan langsung
berjalan ke frame berikutnya atau animasi tetap berjalan tanpa berhenti.
 gotoAndStop perintahini digunakan untuk melompat ke suatu tempat dan berhenti, jadi
setelah melompat ke tempat tertentu animasi akan berhenti.
Selain ke 2 perbedaan di atas, goto juga dibedakan tujuannya/typenya.
 Frame Number pada type ini perintah goto diikuti dengan angka numerik yang
menunjukkan ke frame berapa animasi harus melompat.
44
 Frame Label pada type ini perintah goto diikuti dengan nama/label frame yang berarti
animasi akan melompat ke nama/label frame yang sesuai.
 nextFrame () pada type ini perintah goto yang berarti melompat dan berhenti ke frame
berikutnya.
 preFrame () pada type ini perintah goto yang berarti melompat dan berhenti ke frame
sebelumnya.
Contoh Penerapan
Untuk lebih jelasnya mari kita membuat contoh aplikasinya.
Pada gambar di atas memperlihatkan tampilan materi yang berisi 3 tombol navigasi dimana
masing masing tombol memiliki masa tampil yang berbeda-beda. Untuk tombol home berisi
Acrionscript
on (release) {
gotoAndStop(1);
}
Untuk tombol backberisi Acrionscript
on (release) {
prevFrame();
}
45
Untuk tombol next berisi Acrionscript
on (release) {
nextFrame();
}
H. Load Movie
Biasanya cara yang kita gunakan dalam memasukkan movie clip adalah dengan memasukkan
movie cliptersebutkedalamlibrary,setelahituklik&dragfile tersebutkitamasukkankedalam
frame yang kitainginkan.Apabilakitamemasukkanmovieclipsecaralangsungdidalamproject
falsh kita seperti itu, biasanya proses eksekusi/loading akan terasa lama, apalagi bila movie
yang dipanggil banyak,filenyabesardankomputeryang kita gunakan speknya minim pastilah
loadingnyaakan lama. Berikut 2 cara untuk memanggil movie clip secara eksternal yang akan
meringankan loading movie clip kita.
Load movie dengan Level
 File swf dan diisi dengan animasi dengan nama movie1
 Buat file baru dengan nama movie2
 Masukkan sebuah gambar pada stage
 Buat sebuah tombol dan masukkan script berikut pada Action Panel
on (release) {
loadMovieNum (“movie1.swf”,1);
}
46
 Test Movie
Load movie dengan Target
 File swf dan diisi dengan animasi dengan nama movie1
 Buat file baru dengan nama movie2
 Masukkan sebuah gambar pada stage
 Buat sebuah rectanggel tool dengan alpha 100%
 Confert rectanggel tool tersebut menjadi movie clip dengan instant name “target”
 Buat sebuah tombol dan masukkan script berikut pada Action Panel
on (release) {
loadMovie (“movie1.swf”,”targt”);
}
 Test Movie
I. Membuat Kuis dengan Bantuan Action Script
 Buka program Adobe Flash CS5.
 Adobe flash akan melakukan initializing. Tunggu hingga selesai.
 Lalu akan muncul jendela Adobe Flash Profesional CS5.
47
 Pilih Action Script 2.0 pada kategori Create New.
 Lalu akan muncul stage/lembar kerja Adobe Flash.
 Lalu siapkan 3 buah layer. Masing masing beri nama script, content, dan background.
 Pada layer content frame 1 isikan dengan judul pembukaan dari soal yang akan dibuat.
Bisa diiisi dengan kalimat pembuka sebelum menuju pada lembar soal.
48
 Setelah dirasa cukup, maka pilih layer background untuk membuat tampilan background
agar terlihat lebih menarik.
 Tetap pada layer yang sama, buatlah sebuah tombol untuk menghubungkan tampilan
pembuka menuju tampilan berikutnya. Tombol ini bisa dibuat secara manual maupun
menggunakan tombol yang sudah disediakan Adobe Flash Profesional CS5.
 Membuat tombol secara manual :
o Buatlah objek bebas dengan menggunakan rectangular, oval, pencil
tool, maupun pen tool. Buat tombol sesuai dengan keinginan. Bisa
juga disisipkan teks pada tombol tersebut.
49
o Setelahobjek selsai dibuat, seleksi objek tersebut dan ubah menjadi
button dengan cara seleksi objek →klik kanan→pilih convert to
symbol→pada “Type”, ubah menjadi Button→beri nama tombol
dengan mengetikkan nama pada kolom “Name”→pilih OK.
o Maka Tombolpun telah selesai dibuat.
 Membuat tombol dengan fasilitas Common Libraries
o Pilihlah menu Window pada Menu Bar
o Lalu pilih Common Libraries
o Pilih Button. Maka akan muncul jendela Library Button
o Pilih jenis Button sesuai keinginan
50
o Drag kearah stage maka Tombol siap diiisi dengan Script
o Teks “Enter”yang telah tersedia dapat diganti dengan teks yang
diinginkan. Caranya :
 Double klik pada tombol Enter tersebut
 Maka akan muncul timeline button
 Buka kunci dengan mengklik ikon lock ( ) pada layer text
 Hapus bjek pada frame up lalu ganti dengan teks yang
diinginkan.
 Jangan lupa untuk mengganti pula teks yang terdapat pada
frame down karena akan berpengaruh pada tombol ketika
tombol dijalankan.
 Setelah pengerjaan content selesai, maka langkah selanjutnya adalah mengisikan script
pada tombol. Script berfungsi untuk memberikan perintah pada program yang dibuat.
51
Hubungkan frame pembuka dengan frame selanjutnya untuk memulai kuis. Caranya klik
kananpada Button (tombol )yangtelahdibuat→ pilihactions→ lalu isikan script berikut :
 Setelah button terisi dengan script, maka selanjutnya adalah bekerja pada layer script.
Pada frame 1 isikan script berikut :
 Setelah layer script frame 1 terisi oleh script, maka akan terdapat lambang alpha sebagai
tanda bahwa frame tersebut telah terisi oleh script seperti berikut :
 Jikahalamandepantelahselesai dibuat, selanjutnya membuat pertanyaan atau soal-soal
yang inginditampilkan.Soal yangakandibuattersebutletakkan di frame selanjutnya yaitu
frame 2. Caranya, blok frame 2 pada setiap layer→ pilih insert→pilih timeline→blank
keyframe pada setiap layer. Maka akan menjadi seperti berikut :
52
 Pada layer content, masukkan soal yang akan ditampilkan.
 Lakukan langkah yang sama untuk membuat pertanyaan – pertanyaan pada frame
berikutnya.
53
 Jika pertanyaan dan jawaban selesai dibuat, maka langkah selanjutnya adalah membuat
tombol pada setiap opsi jawaban. Tombol dapat dibuat dengan cara manual maupun
dengan menggunakan fasilitas common libraries seperti langkah membuat tombol yang
telah dibuat sebelumnya.
 Lakukan hal yang sama pada frame berikutnya.
 Setelah tombol terpasang pada tempatnya, isi tombol tersebut dengan script. Hal ini
dimaksudkanagarketikatombol ditekan,makaakanmenujupadapertanyaan-pertanyaan
pada frame berikutnya dan mendapatkan nilai. Isikan dengan script berikut :
 Untuk tombol yang memuat nilai untuk jawaban benar, maka perlu tambahan script
seperti berikut :
 Lakukan pula hal yang sama untuk tombol – tombol yang terdapat pada frame lain.
 Jika seluruh soala dan tombol selasi dibuat, maka isikan script ( ) pada layer
script pada masing masing frame hinggga terlihat tampilan seperti berikut :
54
 Jikascriptsudah dimasukkan,makalanagkah selanjutnya adalah membuat tampilan skor.
Caranya tambahkan frame baru pda masing-masing layer.
 Pada layer content isi dengan :
 Untuk menampilkan skor dari soal yang telah dikerjakan, dapat dibuat dengan
menggunakan Dynamic text. Caranya pilih text tool ( ), lalu pada jendela properties,
ubah Static Text menjadi Dynamic Text.
 Buat Dynamic Text tersebut kedalam layer content.
55
 Pada setiap Dynamic Text tersebut isikan :
 Dynamic Text disebelah kanan jawaban benar :
 Instance name = skor
 Variable = skor
 Dynamic Text disebelah kanan Jawaban salah :
 Instance name = salah
 Variable = salah
 Dynamic Text disebelah kanan nilai :
 Instance name = nilai
 Variable = nilai
 Atur jenis tampilan yang akan masuk ke dalam Dynamic Text agar tampil menjadi angka
atau bilangan dengan cara melekaukan embed pada Dynamic Text.
56
 Lalu akan muncul jendela Font Embedding
 Pada kolom Character ranges tandai pada “All (1332/93514 glyphs)”
 Pilih OK
 Sekarang kembali pada layer script. Pada layer script frame 1 silahkan tambahkan script
berikut :
 Lalu pada frame lembar nilai pada layer script isikan dengan script berikut :
57
 Maka kuis telah siap ditampilkan. Untuk mencoba silahkan tekan Ctrl + Enter.
J. Latihan
1. Buatlahsebuahprodukpembelajaraninteraktif ! (Ketentuanpersyaratan
pembelajarandari pembimbing)

More Related Content

What's hot

E-Book mahir photoshop CS 5
E-Book mahir photoshop CS 5E-Book mahir photoshop CS 5
E-Book mahir photoshop CS 5
Rizki Dinda Safitri
 
Tugas TIK
Tugas TIKTugas TIK
Tugas TIK
Andri Lubis
 
Membuat file-presentasi-dengan-flash-mengenal-action-script1
Membuat file-presentasi-dengan-flash-mengenal-action-script1Membuat file-presentasi-dengan-flash-mengenal-action-script1
Membuat file-presentasi-dengan-flash-mengenal-action-script1
Nina Safitri
 
Membuat CD Interaktif dengan SWiSH MAX4
Membuat CD Interaktif dengan SWiSH MAX4Membuat CD Interaktif dengan SWiSH MAX4
Membuat CD Interaktif dengan SWiSH MAX4
Muhadi Tri
 
MATERI_FLASH_XI
MATERI_FLASH_XIMATERI_FLASH_XI
MATERI_FLASH_XI
Kartiwa G.S., S.Kom
 
Mengenal Lembar Kerja Adobe Photoshop CS3
Mengenal Lembar Kerja Adobe Photoshop CS3Mengenal Lembar Kerja Adobe Photoshop CS3
Mengenal Lembar Kerja Adobe Photoshop CS3
Sabrianah Badaruddin
 
Ebook corel draw x3 lengkap
Ebook corel draw x3 lengkapEbook corel draw x3 lengkap
Ebook corel draw x3 lengkap
TAufik Hidayat
 
PPT-ANIMASI MACROMEDIAFLASH-8
PPT-ANIMASI MACROMEDIAFLASH-8PPT-ANIMASI MACROMEDIAFLASH-8
PPT-ANIMASI MACROMEDIAFLASH-8
Elisabeth Singarimbun
 
Template presentasi menggunakan powerpoint
Template presentasi menggunakan powerpoint Template presentasi menggunakan powerpoint
Template presentasi menggunakan powerpoint
El Azadivon Fhelsi
 
Bab 1 tik
Bab 1 tikBab 1 tik
Belajar corel draw x3
Belajar corel draw x3Belajar corel draw x3
Belajar corel draw x3
almunajib
 
Membuat animasi dengan menggunakan macromedia flash
Membuat animasi dengan menggunakan macromedia flashMembuat animasi dengan menggunakan macromedia flash
Membuat animasi dengan menggunakan macromedia flash
dhamar3
 
MATERI_ULEAD_XI
MATERI_ULEAD_XIMATERI_ULEAD_XI
MATERI_ULEAD_XI
Kartiwa G.S., S.Kom
 
Menu dan Ikon Grafis
Menu dan Ikon GrafisMenu dan Ikon Grafis
Menu dan Ikon Grafis
Naveza
 
Mei
MeiMei
BAB1 TIK POWER POINT 2007
BAB1 TIK POWER POINT 2007BAB1 TIK POWER POINT 2007
BAB1 TIK POWER POINT 2007
Revitasalmaa
 

What's hot (17)

E-Book mahir photoshop CS 5
E-Book mahir photoshop CS 5E-Book mahir photoshop CS 5
E-Book mahir photoshop CS 5
 
Tugas TIK
Tugas TIKTugas TIK
Tugas TIK
 
Membuat file-presentasi-dengan-flash-mengenal-action-script1
Membuat file-presentasi-dengan-flash-mengenal-action-script1Membuat file-presentasi-dengan-flash-mengenal-action-script1
Membuat file-presentasi-dengan-flash-mengenal-action-script1
 
Membuat CD Interaktif dengan SWiSH MAX4
Membuat CD Interaktif dengan SWiSH MAX4Membuat CD Interaktif dengan SWiSH MAX4
Membuat CD Interaktif dengan SWiSH MAX4
 
MATERI_FLASH_XI
MATERI_FLASH_XIMATERI_FLASH_XI
MATERI_FLASH_XI
 
Mengenal Lembar Kerja Adobe Photoshop CS3
Mengenal Lembar Kerja Adobe Photoshop CS3Mengenal Lembar Kerja Adobe Photoshop CS3
Mengenal Lembar Kerja Adobe Photoshop CS3
 
Ebook corel draw x3 lengkap
Ebook corel draw x3 lengkapEbook corel draw x3 lengkap
Ebook corel draw x3 lengkap
 
PPT-ANIMASI MACROMEDIAFLASH-8
PPT-ANIMASI MACROMEDIAFLASH-8PPT-ANIMASI MACROMEDIAFLASH-8
PPT-ANIMASI MACROMEDIAFLASH-8
 
Template presentasi menggunakan powerpoint
Template presentasi menggunakan powerpoint Template presentasi menggunakan powerpoint
Template presentasi menggunakan powerpoint
 
Bab 1 tik
Bab 1 tikBab 1 tik
Bab 1 tik
 
Belajar corel draw x3
Belajar corel draw x3Belajar corel draw x3
Belajar corel draw x3
 
Membuat animasi dengan menggunakan macromedia flash
Membuat animasi dengan menggunakan macromedia flashMembuat animasi dengan menggunakan macromedia flash
Membuat animasi dengan menggunakan macromedia flash
 
MATERI_ULEAD_XI
MATERI_ULEAD_XIMATERI_ULEAD_XI
MATERI_ULEAD_XI
 
Tik bab4
Tik bab4Tik bab4
Tik bab4
 
Menu dan Ikon Grafis
Menu dan Ikon GrafisMenu dan Ikon Grafis
Menu dan Ikon Grafis
 
Mei
MeiMei
Mei
 
BAB1 TIK POWER POINT 2007
BAB1 TIK POWER POINT 2007BAB1 TIK POWER POINT 2007
BAB1 TIK POWER POINT 2007
 

Viewers also liked

Facebook Blog 2B
Facebook Blog 2BFacebook Blog 2B
Facebook Blog 2B
Brendan Bleijenberg
 
¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom
¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom
¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom
Iolanda Grau
 
Education Today and its Questions and scopes in B.Sc
Education Today and its Questions and scopes in B.ScEducation Today and its Questions and scopes in B.Sc
Education Today and its Questions and scopes in B.Sc
Ayush Agrawal
 
แกะสลักเทียน
แกะสลักเทียนแกะสลักเทียน
แกะสลักเทียน
kingkaew049
 
Makers
MakersMakers
Makers
Rocco Tolve
 
WhatsApp Policy Primer
WhatsApp Policy PrimerWhatsApp Policy Primer
WhatsApp Policy Primer
Sharmini93
 
Breaking down the World of Warcraft Terms of Use Agreement
Breaking down the World of Warcraft Terms of Use Agreement Breaking down the World of Warcraft Terms of Use Agreement
Breaking down the World of Warcraft Terms of Use Agreement
CTondut
 
Frank gambale -_chop_builder
Frank gambale -_chop_builderFrank gambale -_chop_builder
Frank gambale -_chop_builder
GregLachlan
 
Test for convergence
Test for convergenceTest for convergence
Test for convergence
Ayush Agrawal
 
George harrison Dark Horse/Best of george Harrison
George harrison Dark Horse/Best of george HarrisonGeorge harrison Dark Horse/Best of george Harrison
George harrison Dark Horse/Best of george Harrison
GregLachlan
 
Psychodynamic Theory of Personality Bangladesh
Psychodynamic Theory of Personality BangladeshPsychodynamic Theory of Personality Bangladesh
Psychodynamic Theory of Personality Bangladesh
Mahir Chowdhury
 
Cyclic group- group theory
Cyclic group- group theoryCyclic group- group theory
Cyclic group- group theory
Ayush Agrawal
 
Drosophila development
Drosophila developmentDrosophila development
Drosophila development
ravina15
 
frank gambale
 frank gambale frank gambale
frank gambale
GregLachlan
 
Hình giải tích 12 1đ
Hình giải tích 12   1đHình giải tích 12   1đ
Hình giải tích 12 1đ
Quốc Nguyễn
 
Frank gambale technique book 2 (2)
Frank gambale technique book 2 (2)Frank gambale technique book 2 (2)
Frank gambale technique book 2 (2)
GregLachlan
 

Viewers also liked (16)

Facebook Blog 2B
Facebook Blog 2BFacebook Blog 2B
Facebook Blog 2B
 
¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom
¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom
¿De dónde viene el agua de la lluvia? Proyecto Flipped Classroom
 
Education Today and its Questions and scopes in B.Sc
Education Today and its Questions and scopes in B.ScEducation Today and its Questions and scopes in B.Sc
Education Today and its Questions and scopes in B.Sc
 
แกะสลักเทียน
แกะสลักเทียนแกะสลักเทียน
แกะสลักเทียน
 
Makers
MakersMakers
Makers
 
WhatsApp Policy Primer
WhatsApp Policy PrimerWhatsApp Policy Primer
WhatsApp Policy Primer
 
Breaking down the World of Warcraft Terms of Use Agreement
Breaking down the World of Warcraft Terms of Use Agreement Breaking down the World of Warcraft Terms of Use Agreement
Breaking down the World of Warcraft Terms of Use Agreement
 
Frank gambale -_chop_builder
Frank gambale -_chop_builderFrank gambale -_chop_builder
Frank gambale -_chop_builder
 
Test for convergence
Test for convergenceTest for convergence
Test for convergence
 
George harrison Dark Horse/Best of george Harrison
George harrison Dark Horse/Best of george HarrisonGeorge harrison Dark Horse/Best of george Harrison
George harrison Dark Horse/Best of george Harrison
 
Psychodynamic Theory of Personality Bangladesh
Psychodynamic Theory of Personality BangladeshPsychodynamic Theory of Personality Bangladesh
Psychodynamic Theory of Personality Bangladesh
 
Cyclic group- group theory
Cyclic group- group theoryCyclic group- group theory
Cyclic group- group theory
 
Drosophila development
Drosophila developmentDrosophila development
Drosophila development
 
frank gambale
 frank gambale frank gambale
frank gambale
 
Hình giải tích 12 1đ
Hình giải tích 12   1đHình giải tích 12   1đ
Hình giải tích 12 1đ
 
Frank gambale technique book 2 (2)
Frank gambale technique book 2 (2)Frank gambale technique book 2 (2)
Frank gambale technique book 2 (2)
 

Similar to Modul adobe flash_cs.5

MODUL_FLASH_TIK_XI
MODUL_FLASH_TIK_XIMODUL_FLASH_TIK_XI
MODUL_FLASH_TIK_XI
Kartiwa G.S., S.Kom
 
Animasi 2D
Animasi 2DAnimasi 2D
Penegenalan Macromedia flash 8
Penegenalan Macromedia  flash 8Penegenalan Macromedia  flash 8
Penegenalan Macromedia flash 8
Houtman Ambarita
 
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdfANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
IcukIcum
 
Bab 1 pengenalan-adobe-flash
Bab 1 pengenalan-adobe-flashBab 1 pengenalan-adobe-flash
Bab 1 pengenalan-adobe-flash
Ihm Sheva Hambuako
 
modul animasi.pdf
modul animasi.pdfmodul animasi.pdf
modul animasi.pdf
EkoSetiawan735957
 
Adobe flash cs5 profesional
Adobe flash cs5 profesionalAdobe flash cs5 profesional
Adobe flash cs5 profesional
Slamet Ariyanto
 
Membuat Presentasi (BAB 2)
Membuat Presentasi (BAB 2)Membuat Presentasi (BAB 2)
Membuat Presentasi (BAB 2)
Peppy Paidi
 
Bab 2
Bab 2Bab 2
Modul1
Modul1Modul1
Modul1
tohopaloh
 
Microsoft power point(ibu okta )
Microsoft power point(ibu okta )Microsoft power point(ibu okta )
Microsoft power point(ibu okta )
jokolia
 
TIK BAB 1 KELAS 9
TIK BAB 1 KELAS 9TIK BAB 1 KELAS 9
TIK BAB 1 KELAS 9
Mujiati Nuur Istiqomah
 
TIK Bab 1 kelas 9
TIK Bab 1 kelas 9TIK Bab 1 kelas 9
TIK Bab 1 kelas 9
AnisaPutriB
 
Bab 1
Bab 1Bab 1
Presentasi kelas 9D absen 6 bab 1
Presentasi kelas 9D absen 6 bab 1Presentasi kelas 9D absen 6 bab 1
Presentasi kelas 9D absen 6 bab 1
andika9d06
 
Macromedia flash intan nur afifah xii ipa 3
Macromedia flash intan nur afifah xii ipa 3Macromedia flash intan nur afifah xii ipa 3
Macromedia flash intan nur afifah xii ipa 3
Poltekkes Kemenkes Banten
 
Tugas modul tik
Tugas modul tikTugas modul tik
Tugas modul tik
Suliana OneStar
 
DASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptx
DASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptxDASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptx
DASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptx
bk6439hf
 
Tik bab 1-6 kelas9
Tik bab 1-6 kelas9Tik bab 1-6 kelas9
Tik bab 1-6 kelas9
Nur Zain Ongcrapyacity
 

Similar to Modul adobe flash_cs.5 (20)

MODUL_FLASH_TIK_XI
MODUL_FLASH_TIK_XIMODUL_FLASH_TIK_XI
MODUL_FLASH_TIK_XI
 
Animasi 2D
Animasi 2DAnimasi 2D
Animasi 2D
 
Penegenalan Macromedia flash 8
Penegenalan Macromedia  flash 8Penegenalan Macromedia  flash 8
Penegenalan Macromedia flash 8
 
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdfANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
ANIMASI FRAME BY FRAME DAN ANIMASI TWEENING.pdf
 
Bab 1 pengenalan-adobe-flash
Bab 1 pengenalan-adobe-flashBab 1 pengenalan-adobe-flash
Bab 1 pengenalan-adobe-flash
 
modul animasi.pdf
modul animasi.pdfmodul animasi.pdf
modul animasi.pdf
 
Adobe flash cs5 profesional
Adobe flash cs5 profesionalAdobe flash cs5 profesional
Adobe flash cs5 profesional
 
Membuat presentasi
Membuat presentasiMembuat presentasi
Membuat presentasi
 
Membuat Presentasi (BAB 2)
Membuat Presentasi (BAB 2)Membuat Presentasi (BAB 2)
Membuat Presentasi (BAB 2)
 
Bab 2
Bab 2Bab 2
Bab 2
 
Modul1
Modul1Modul1
Modul1
 
Microsoft power point(ibu okta )
Microsoft power point(ibu okta )Microsoft power point(ibu okta )
Microsoft power point(ibu okta )
 
TIK BAB 1 KELAS 9
TIK BAB 1 KELAS 9TIK BAB 1 KELAS 9
TIK BAB 1 KELAS 9
 
TIK Bab 1 kelas 9
TIK Bab 1 kelas 9TIK Bab 1 kelas 9
TIK Bab 1 kelas 9
 
Bab 1
Bab 1Bab 1
Bab 1
 
Presentasi kelas 9D absen 6 bab 1
Presentasi kelas 9D absen 6 bab 1Presentasi kelas 9D absen 6 bab 1
Presentasi kelas 9D absen 6 bab 1
 
Macromedia flash intan nur afifah xii ipa 3
Macromedia flash intan nur afifah xii ipa 3Macromedia flash intan nur afifah xii ipa 3
Macromedia flash intan nur afifah xii ipa 3
 
Tugas modul tik
Tugas modul tikTugas modul tik
Tugas modul tik
 
DASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptx
DASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptxDASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptx
DASAR-DASAR PEMBUATAN ANIMASI DENGAN FLASH.pptx
 
Tik bab 1-6 kelas9
Tik bab 1-6 kelas9Tik bab 1-6 kelas9
Tik bab 1-6 kelas9
 

Recently uploaded

Kosmetik Kemasan Pasir Pogor Sindangkerta
Kosmetik Kemasan Pasir Pogor SindangkertaKosmetik Kemasan Pasir Pogor Sindangkerta
Kosmetik Kemasan Pasir Pogor Sindangkerta
kemasankarduscustoml
 
template ppt contoh seminar refleksi projek kepemimpinan
template ppt contoh seminar refleksi projek kepemimpinantemplate ppt contoh seminar refleksi projek kepemimpinan
template ppt contoh seminar refleksi projek kepemimpinan
NilamSari27266
 
Daftar Id Slot Gacor Anti Rungkad Di WINJUDI
Daftar Id Slot Gacor Anti Rungkad Di WINJUDIDaftar Id Slot Gacor Anti Rungkad Di WINJUDI
Daftar Id Slot Gacor Anti Rungkad Di WINJUDI
IDMPO
 
Kisi-kisi Ujian Praktik sbk 2024 2024.doc
Kisi-kisi Ujian Praktik sbk 2024 2024.docKisi-kisi Ujian Praktik sbk 2024 2024.doc
Kisi-kisi Ujian Praktik sbk 2024 2024.doc
virnanda781
 
Surat Pemberitahuan LDKS.pdf educationnn
Surat Pemberitahuan LDKS.pdf educationnnSurat Pemberitahuan LDKS.pdf educationnn
Surat Pemberitahuan LDKS.pdf educationnn
adearief3
 
STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024
STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024
STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024
sayangkamuu240203
 
Pedoman Identitas Visual HUT RI KE-79- Publik
Pedoman Identitas Visual HUT RI KE-79- PublikPedoman Identitas Visual HUT RI KE-79- Publik
Pedoman Identitas Visual HUT RI KE-79- Publik
nurh19621007
 
IDEBET >> Bandar Slot Jili Deposit Bank DKI
IDEBET >> Bandar Slot Jili Deposit Bank DKIIDEBET >> Bandar Slot Jili Deposit Bank DKI
IDEBET >> Bandar Slot Jili Deposit Bank DKI
infoide7
 
Kemasan Roti Aoka Cisaranten Kidul Gedebage
Kemasan Roti Aoka Cisaranten Kidul GedebageKemasan Roti Aoka Cisaranten Kidul Gedebage
Kemasan Roti Aoka Cisaranten Kidul Gedebage
pusatcetakkemasanlar
 
IDEBET : Situs Slot Jili Bisa Deposit Bank Bali
IDEBET : Situs Slot Jili Bisa Deposit Bank BaliIDEBET : Situs Slot Jili Bisa Deposit Bank Bali
IDEBET : Situs Slot Jili Bisa Deposit Bank Bali
infoide7
 
Sosialisasi kurikulum merdeka dan perangkat ajar
Sosialisasi kurikulum merdeka dan perangkat ajarSosialisasi kurikulum merdeka dan perangkat ajar
Sosialisasi kurikulum merdeka dan perangkat ajar
AndriJpn1
 
MPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptx
MPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptxMPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptx
MPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptx
noviani43
 
PROGRAM MPLS KELAS 1 untuk sd kelas 1.docx
PROGRAM MPLS KELAS 1 untuk sd kelas 1.docxPROGRAM MPLS KELAS 1 untuk sd kelas 1.docx
PROGRAM MPLS KELAS 1 untuk sd kelas 1.docx
noviani43
 
Toko Jual Dus Cupcake dan Cibogo Lembang
Toko Jual Dus Cupcake dan Cibogo LembangToko Jual Dus Cupcake dan Cibogo Lembang
Toko Jual Dus Cupcake dan Cibogo Lembang
pusatcetakkemasanlar
 
Tempat jasa cetak dus roti di Cililin? Yuk Kesini Aja
Tempat jasa cetak dus roti di Cililin? Yuk Kesini AjaTempat jasa cetak dus roti di Cililin? Yuk Kesini Aja
Tempat jasa cetak dus roti di Cililin? Yuk Kesini Aja
kareaeluts09
 
KALENDER PENDIDIKAN T.A 2024-2025 (1).pdf
KALENDER PENDIDIKAN T.A 2024-2025 (1).pdfKALENDER PENDIDIKAN T.A 2024-2025 (1).pdf
KALENDER PENDIDIKAN T.A 2024-2025 (1).pdf
MuhammadIqbal362702
 
Cetak Kemasan Dus Murah Margajaya Ngamprah
Cetak Kemasan Dus Murah Margajaya NgamprahCetak Kemasan Dus Murah Margajaya Ngamprah
Cetak Kemasan Dus Murah Margajaya Ngamprah
pusatcetakkemasanlar
 
berekayasa & berteknologi dalam membangun nkri.pptx
berekayasa & berteknologi dalam membangun nkri.pptxberekayasa & berteknologi dalam membangun nkri.pptx
berekayasa & berteknologi dalam membangun nkri.pptx
ayuningtias00
 
DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬
DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬
DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬
🔥🤑SLOT GACOR MUDAN JP🤑🔥 MUDAH MENANG WINJUDI
 
jadwal piket untuk design kelas 7a smp islam
jadwal piket untuk design kelas 7a smp islamjadwal piket untuk design kelas 7a smp islam
jadwal piket untuk design kelas 7a smp islam
MUFIDATULRAHMAWATI1
 

Recently uploaded (20)

Kosmetik Kemasan Pasir Pogor Sindangkerta
Kosmetik Kemasan Pasir Pogor SindangkertaKosmetik Kemasan Pasir Pogor Sindangkerta
Kosmetik Kemasan Pasir Pogor Sindangkerta
 
template ppt contoh seminar refleksi projek kepemimpinan
template ppt contoh seminar refleksi projek kepemimpinantemplate ppt contoh seminar refleksi projek kepemimpinan
template ppt contoh seminar refleksi projek kepemimpinan
 
Daftar Id Slot Gacor Anti Rungkad Di WINJUDI
Daftar Id Slot Gacor Anti Rungkad Di WINJUDIDaftar Id Slot Gacor Anti Rungkad Di WINJUDI
Daftar Id Slot Gacor Anti Rungkad Di WINJUDI
 
Kisi-kisi Ujian Praktik sbk 2024 2024.doc
Kisi-kisi Ujian Praktik sbk 2024 2024.docKisi-kisi Ujian Praktik sbk 2024 2024.doc
Kisi-kisi Ujian Praktik sbk 2024 2024.doc
 
Surat Pemberitahuan LDKS.pdf educationnn
Surat Pemberitahuan LDKS.pdf educationnnSurat Pemberitahuan LDKS.pdf educationnn
Surat Pemberitahuan LDKS.pdf educationnn
 
STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024
STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024
STARJUDI 💎 Situs Slot Gacor Maxwin Server Thailand Terpercaya Hari Ini 2024
 
Pedoman Identitas Visual HUT RI KE-79- Publik
Pedoman Identitas Visual HUT RI KE-79- PublikPedoman Identitas Visual HUT RI KE-79- Publik
Pedoman Identitas Visual HUT RI KE-79- Publik
 
IDEBET >> Bandar Slot Jili Deposit Bank DKI
IDEBET >> Bandar Slot Jili Deposit Bank DKIIDEBET >> Bandar Slot Jili Deposit Bank DKI
IDEBET >> Bandar Slot Jili Deposit Bank DKI
 
Kemasan Roti Aoka Cisaranten Kidul Gedebage
Kemasan Roti Aoka Cisaranten Kidul GedebageKemasan Roti Aoka Cisaranten Kidul Gedebage
Kemasan Roti Aoka Cisaranten Kidul Gedebage
 
IDEBET : Situs Slot Jili Bisa Deposit Bank Bali
IDEBET : Situs Slot Jili Bisa Deposit Bank BaliIDEBET : Situs Slot Jili Bisa Deposit Bank Bali
IDEBET : Situs Slot Jili Bisa Deposit Bank Bali
 
Sosialisasi kurikulum merdeka dan perangkat ajar
Sosialisasi kurikulum merdeka dan perangkat ajarSosialisasi kurikulum merdeka dan perangkat ajar
Sosialisasi kurikulum merdeka dan perangkat ajar
 
MPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptx
MPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptxMPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptx
MPLS-Masa-Pandemi-COVID-19 UNTUK DIDOWNLOAD.pptx
 
PROGRAM MPLS KELAS 1 untuk sd kelas 1.docx
PROGRAM MPLS KELAS 1 untuk sd kelas 1.docxPROGRAM MPLS KELAS 1 untuk sd kelas 1.docx
PROGRAM MPLS KELAS 1 untuk sd kelas 1.docx
 
Toko Jual Dus Cupcake dan Cibogo Lembang
Toko Jual Dus Cupcake dan Cibogo LembangToko Jual Dus Cupcake dan Cibogo Lembang
Toko Jual Dus Cupcake dan Cibogo Lembang
 
Tempat jasa cetak dus roti di Cililin? Yuk Kesini Aja
Tempat jasa cetak dus roti di Cililin? Yuk Kesini AjaTempat jasa cetak dus roti di Cililin? Yuk Kesini Aja
Tempat jasa cetak dus roti di Cililin? Yuk Kesini Aja
 
KALENDER PENDIDIKAN T.A 2024-2025 (1).pdf
KALENDER PENDIDIKAN T.A 2024-2025 (1).pdfKALENDER PENDIDIKAN T.A 2024-2025 (1).pdf
KALENDER PENDIDIKAN T.A 2024-2025 (1).pdf
 
Cetak Kemasan Dus Murah Margajaya Ngamprah
Cetak Kemasan Dus Murah Margajaya NgamprahCetak Kemasan Dus Murah Margajaya Ngamprah
Cetak Kemasan Dus Murah Margajaya Ngamprah
 
berekayasa & berteknologi dalam membangun nkri.pptx
berekayasa & berteknologi dalam membangun nkri.pptxberekayasa & berteknologi dalam membangun nkri.pptx
berekayasa & berteknologi dalam membangun nkri.pptx
 
DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬
DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬
DAFTAR KAN TEMEN MU DAPAT BONUS AJAK TEMEN SETIAP BULAN NYA👬
 
jadwal piket untuk design kelas 7a smp islam
jadwal piket untuk design kelas 7a smp islamjadwal piket untuk design kelas 7a smp islam
jadwal piket untuk design kelas 7a smp islam
 

Modul adobe flash_cs.5

  • 1. 1 Modul Adobe Flash CS.5 Tujuan Instruksional Umum Mahasiswadapatmembuatmediapembelajaran berbasis animasi, video dan audio (multimedia) secara interaktif. A. Mengenal Tools Pengolah Multimedia (Adobe Flash CS5) Program ini berbasis vektor grafis, jadi aksesnya lebih cepat dan terlihat halus pada skala resolusi layar berapapun. Program ini juga dapat diisi dengan bitmap yang di-impor dari program lain. Salah satu keunggulannya adalah ukurannya yang begitu kecil namun dapat menampilkan animasi web yang mengagumkan. Flash juga mempunyai kemampuan untuk membuat animasi secara streaming, yaitu dapat menampilkan animasi langsung meskipun proses download dan loading belum selesai seluruhnya. Selain itu, dengan Flash juga dapat dibuat movie kartun dan aplikasi web interaktif yang memungkinkan pengguna dapat berinteraksi langsung dengan aplikasi yang dibuat. Movie Flash juga bisa memasukkan unsur interaktif dalam movie-nyadengan Action Script(bahasapemrogramandi Flash) sehingga user bisa berinteraksi dengan movie melalui keyboard atau mouse untuk berpindah ke bagian- bagianyang berbeda dari sebuah movie, memindahkan objek-objek, memasukkan informasi melalui form, dan operasi-operasi lainnya. Kelebihan lain yang dimiliki program Adobe Flash adalah mampu membuat tombol interaktif dengan sebuah movie atau objek yang lain. Adobe Flash mampu membuat perubahan transparansi warna dalam movie. Adobe Flash mampu membuat perubahan animasi dari satu bentuk ke bentuk lain dan mampu membuat gerakan animasi dengan mengikuti alur yang telah ditetapkan. Dengan Adobe Flash, file dapat dikonversi dan dipublikasikan (publish) ke dalam file aplikasi (exe).
  • 2. 2 B. Memahami User Interface Adobe Flash CS.5 Ini adalah interface dari macromedia Adobe Flash CS5. Gambar 1. Interface Adobe Flash CS5 (Caption) Gambar 2. Lingkungan kerja adobe flash cs5 (Caption) Toolsbox Stage Action Layer Timeline Color/ swatches Propertis Library
  • 3. 3 Keterangan Lingkungan Kerja Adobe Flash CS5 :  Toolbox,kumpulantool atauperalatanyangmempunyai fungsi-fungsi tersendiri untuk berbagai keperluan seperti desain, editing, dan pengaturan gambar atau objek.  Title Bar, merupakan nama file atau judul program yang sedang aktif atau sedang digunakan.  Action Script, actionScript adalah bahasa pemprograman di flash. Adobe Flash CS5 mendukung semua versi ActionScript 2.0. ActionScript digunakan untuk mengontrol objek, navigasi, animasi, dll. Untuk membuat program yang dibuat lebih interaktif.  Timeline Panel, atau garis waktu mempunyai fungsi untuk membantu penempatan objek pada fungsi waktu.  Stage, halaman kerja yang digunakan untuk menempatkan berbagai macam objek flash yang akan ditampilkan.  Color Mixer Panel, panel yang berfungsi untuk pengaturan warna dari gambar atau objek.  Transform  Library Panel, panel yangmenyimpanobjek-objekseperti movie clip, graphic, button, sound, video, dll, yang digunakan dalam pembuatan aplikasi.  Layer, dapat dianalogikan sebagai kanvas suatu lukisan. Jumlah layer bisa lebih dari satu,dalam kata lainberlapis-lapis. Layer yang berada paling atas adalah kanvas yang terdepan. Mengenal Toolbox dan Panel  Toolbox FasilitasToolbox sepertitelahdijelaskansekilas diawal adalah sekumpulan tool atau alat yang mempunyai fungsi-fungsi tersendiri untuk keperluan desaindsb, berikut ini penjelasan setiap tool yang ada di Toolbox.
  • 4. 4 Gambar 3. Toolbox (Caption) Tabel 1. Keterangan toolbox No Gambar Keterangan 1 Arrow Tool (V) atau disebut juga Selection Tool berfungsi untuk memilih atau menyeleksi suatu objek. 2 SubselectionTool (A),berfungsi menyeleksi bagian objek lebih detail dari pada Selection Tool. 3 Free Transform Tool (Q), berfungsi untuk menstransformasi objek yang terseleksi. 4 Gradient Transform Tool (F), berfungsi untuk mentransformasi warna dari fiil objek yang terseleksi. 5 Lasso Tool (S), digunakanuntukmelakukanseleksi dengan mengambar sebuah garis seleksi. 6 Pen Tool (P), digunakan untuk mengambar garis dengan bantuan titik-titik bantu. 7 Add Anchor Point Tool (=), berfungsi untuk menambah Anchor Point dari garis, kurva atau gambar. 8 Delete Anchor Point Tool (-), berfungsi untuk menghapus Anchor Point dari garis, kurva, atau gambar.
  • 5. 5 9 Convert Anchor Tool (C), berfungsi untuk mengkonfersi garis, kurva atau gambar. 10 Text Tool (T), digunakan untuk membuat objek text. 11 Line Tool (N), digunakanuntukmengambarataumembuat garis. 12 Rectangle Tool (R), digunakan untuk mengambar bentk persegi panjang atau bujur sangkar. 13 Oval Tool (O), digunakan untuk membuat bentuk bulat atau oval. 14 Poly Star Tool, digunakan untuk menggambar bentuk dengan jumlah segi yang diinginkan. 15 Pencil Tool (V), digunakan untuk membuat garis. 16 Brush Tool (B), digunakanuntukmengambarbentukgaris- garis dan bentuk-bentuk bebas. 17 Ink Bottle (S), digunakan untuk mengubah warna garis, lebar garis, dan style garis, atau garis luar sebuah bentuk. 18 Paintbucket Tool (K), digunakan untuk mengisi area-area kosong atau digunakan untuk mengubah warna area sebuah objek yang telah diwarnai, paint bucket dapat digunakan untuk mewarnai warna solid, pengisian warna gradiasi dan pengisian bitmap. 19 Eyedropper Tool (I), digunakan untuk mengambil sampel sebuah warna dari gambar atau objek. 20 Eraser Tool (E), digubakan untuk menghapus objek. 21 Hand Tool (H), digunakanuntukmenggesertampilan stage tanpa mengubah pembesaran. 22 Zoom Tool (M,Z), digunakan untuk memperbesar atau memperkecil tampilan stage.
  • 6. 6 23 Stroke Color digunakan untuk memilih atau memberi warna pada suatu garis. 24 Fiil Color digunakan untuk memilih atau memberi warna pada suatu objek. 25 Black and White digunakan hanya untuk memilih warna hitam dan putih saja.  Adobe Flash Player Flash Player digunakan sebagai player untuk menjalankan file-file yang berekstension . swf (shockwave flash). Untuk mengeksekusi file fla. Ke swf , silahkan tekan ctrl + enter. Gambar 4. Flash player (swf) (Caption)
  • 7. 7  Cara Menyimpan File Klik File -> klik save as -> Ketik nama filenya -> Pilih atau buat folder baru untuk menyimpan file -> Klik save. Gambar 5. Menyimpan file (Caption) C. Membuat Animasi Sederhana 1. Dasar Animasi Dalampembutananimasi selalu berhubungan dengan frame. Frame adalah suatu bagian dari layer yangterdapatdalam panel timeline yangdigunakanuntukmengaturpembuatananimasi. Gambar. 6. Bagian Panel Timeline Suatuanimasi dapatberjalanolehadanyaperpindahandari frame ke frame. Semakin panjang frameyang dibutuhkanmakasemakinlamaanimasi ituberjalan.Suatuanimasibisaterdiri dari
  • 8. 8 beberapa layer. Suatu layer dapat diikuti layer guide dan layer mask. Layer guide berfungsi untuk memberikan panduan pada layer yang diguide. Layer mask berfungsi untuk menyembunyikansertamenampilkanbagianlainpada layerdimasking.Berikutini dasar-dasar dari animasi.  Motion Tween Motion Tween adalah animasi yang digunakan untuk menggerakkan objek yang sudah dikonversi ke dalam bentuk simbol berdasarkan batas suatu keyframe tertentu. Simbol- simbol dalam flash yaitu movie clip, button dan graphic. Cara pembuatan animasi motion tween adalah :  Tentukan frame awal dari animasi  Buat objek animasi  Konversi objek ke dalam symbol yang diinginkan  Tentukan frame akhir dari animasi  Sisipkan create motion tween diantara frame awal dan frame akhir sehingga muncul garis panah  Pada frame akhir tentukan letak posisi objek -> Eksekusi animasi dengan test movie. Gambar. 7 Bentuk Layer pada Tehnik Motion Tween  Shape Tween Shape Tween adalah animasi yang digunakan untuk mengubah satu bentuk ke bentuk yang lain. Objek harus berupa objek normal (objek ter-break a part). Frame Akhir Objek Twen ShapeFrame Awal
  • 9. 9 Cara pembuatan animasi shape tween sama seperti pada motion tween, perbedaannya objek tidak dalam bentuk simbol. Animasi ini posisi objek tidak berubah, hanya mengalami perubahan bentuk. Gambar. 8 Bentuk Layer pada Tehnik Shape Twee  Teknik Guide Teknik guide adalah teknik menggerakkan animasi sesuai guide yang telah dibuat pada layer guide. Guide yang dibuat berupa garis yang mempunyai arah dan lintasan tertentu Gambar. 9 Bentuk Layer Pada Tehnik Guid Cara membuatGuide adalah sebagai berikut:  Buka lembarkerjaAdobe FlashCS.5 Frame Awal Twen Shape Frame Akhir Objek tidak terkonfersi dalam simbol Layer yangdi guideLayer guide Garis guideObjek animasi
  • 10. 10  Buatlahsebuahobjeklingkarandalamstage padalayer1 dan frame 1 Membuat Motion Guide 1  Ubah lingkaranyangtelahdibuatmenjadi bentukmovieclip.Caranyaklikkanan pada objeklingkaran→converttosymbol→isikan Name denganlingkaran, Type : Movie clip, Registrationberadadi tengah→OK,makaakanmenjadi seperti berikut; Membuat Motion Guide 2 Terdapatseleksi persegi disekelilinglingkaran.
  • 11. 11  Klikkananpada layer1, lalupilihAddClassicMotionGuide. Membuat Motion Guide 3  Lalu akanmuncul Layer Guide. Membuat Motion Guide 4  Pada LayerGuide buatlahlintasanuntukpergerakandari objeklingkarandengan menggunakanPencil Tool.
  • 12. 12 Membuat Motion Guide 5  Tempatkan lingkarantepatdiujunggarislintasanyangtelahdibuat.Registration pointobject(Titiktengahyangtedapatpadalingkaran) wajibtepatdi titikpaling ujunggaris.
  • 13. 13 Membuat Motion Guide 6 Membuat Motion Guide 7
  • 14. 14  Blokframe 10 pada masing-masinglayer.Laluklikkanan→InsertFrame Membuat Motion Guide 8  Klikkananpada frame 10 Layer1→pilihInsertKeyFrame Membuat Motion Guide 9  Pada layer1 frame 10 tersebutpindahkanobjeklingkaranke ujunggarislintasan yang laindenganposisi Registrationpointobjecttepatpadaujunggaris.
  • 15. 15 Membuat Motion Guide 10  Klikkananpada frame 1 layer1→pilihCreate ClassicTween Membuat Motion Guide 11
  • 16. 16  Lalu time line akanmenjadi sepertiberikut. Membuat Motion Guide 12  Lalu untukmengujinyatekanCtrl+Enter Membuat Motion Guide 13
  • 17. 17  Teknik Masking Teknik masking digunakanuntuk menyembunyikan isi layer lain tetapi akan ditampilkan saat movie dijalankan. Animasi masking mempunyai dua metode dasar, yang pertama adalah area masking yang bergerak sedang objek yang dimask diam, yang kedua adalah area masking yangdiamsedangobjekyangdimask bergerak. Kedua teknik tersebut akan menampilkan animasi yang berbeda. Gambar.10 Bentuk Layer Pada Teknik Masking  Membuat Animasi Huruf Dengan Masking  Siapkan tiga buah layer dengan cara menekan icon New Layer yang tersedia dibawah Timeline. Perhatikan gambar dibawah !  Lalu layer akan bertambah seperti berikut : Layer masking Membuat Animasi HurufDengan Masking 1
  • 18. 18 Membuat Animasi Huruf Dengan Masking 2  Ubah nama Layer 1 dengannama yangdiinginkan.Disini silahkandenganganti dengan nama Objek1 dengan cara klik dua kali pada Layer 1. Membuat Animasi HurufDengan Masking 3  Klik frame 1 pada layer Objek1 dan buatlah sebuah teks pada Stage. Buatlah teks bertuliskan “Maskingku” dengan warna bebas.
  • 19. 19 Membuat Animasi HurufDengan Masking 4  SekarangubahLayer 2 dengannamaObjekCopydengancara seperti mengubah nama layer 1. Lalu Copy-kan teks “Maskingku” dari layer Objek1. Posisi harus sama persis dengan cara klik kanan→Paste In Place di stage frame 1 Layer Objek Copy.
  • 20. 20 Membuat Animasi HurufDengan Masking 5  Seolah tidak ada perubahan, akan tetapi apabila teks tersebut digeser maka akan terlihat teks tersebut sudah ter-Copy  Ubahlah warna teks”Maskingku” pada layer Objek Copy cengan warna yang berbeda dengan teks “Makingku” di Layer Objek1.
  • 21. 21 Membuat Animasi HurufDengan Masking 6  Pembedaanwarnatersebutakan berpengaruh ketika animasi berjalan. Warna kilatan yang akan muncul, sesuai dengan warna teks pada Layer Objek Copy.  Ubah nama Layer 3 dengan nama Animasi. Lalu pada frame 1, buatlah objek dengan warna bebas serta posisi seperti berikut :
  • 22. 22 Membuat Animasi HurufDengan Masking 7  Lalu, untuk menggerakkan animasi, tambahkan frame pada setiap layer dengan cara blok frame 10 pada masing masing layer→klik kanan→Insert Frame. Maka akan muncul seperti berikut : Membuat Animasi HurufDengan Masking 8
  • 23. 23  Blok frame 10 pada layer animasi, Lalu klik kanan→insert key frame. Membuat Animasi HurufDengan Masking 9  Ubah posisi objek animasi ke tempat yang berbeda Membuat Animasi HurufDengan Masking 10
  • 24. 24  Agar animasi dapat berjalan dengan halus, maka dibutuhkan tweening. Caranya klik frame 1 layer Animasi→klik kanan→Create Classic Tween hingga tampilan frame menjadi seperti berikut : Membuat Animasi HurufDengan Masking 11  Langkah terakhir klik kanan pada layer Animasi→mask. Maka tampilan akan seolah – olahhilangdankembali seperti semula.Akantetapi hal tersebutmenandakan masking telah berhasil.  Lalu untuk melihat hasilnya, silahkan tekan tombol Ctrl+Enter maka akan jadi seperti berikut ; Membuat Animasi HurufDengan Masking 12
  • 25. 25 2. Mengenal Common Libraries Common libraries adalah semacam perpustakaannya adobe flash. Untuk mengaktifkan dari common libraries tersebut silahkan :  Klik Window  Klik Common Libraries  Klik library yang diinginkan (Buton, Classes, Sounds). Gambar.11 Common Libraries
  • 26. 26 Ini adalah tampilan dari Common Library Button : Gambar.12 Libraries Button Ini adalah tampilan dari Common Library Classes : Gambar.13 Libraries Classes
  • 27. 27 Ini adalah tampilan dari Common Library Sounds : Gambar.14 Libraries Sounds
  • 28. 28 2.1. Membuat Variasi Teks Didalamadobe Flashjugaterdapatberbagai variasi teks yang bisa digunakan dalam membuat animasi. Diantaranya ada Static Text, Dynamic Text, dan Input Text. Static Text : Jenis Teks yang tidak dapat diubah secara dinamis, Tulisan yang tertera pada Static Text tidak akan berubah selama movie dijalankan. Gambar.15 Static Text Dynamic Text : Jenis teks yang dapat diubah secara dinamis. Tulisan yang tertera pada Dynamic Text dapat berubah selama movie dijalankan. Gambar.16 Dynamic Text
  • 29. 29 Input Text : Jenisteksberupakotakisian,danpemakai dapat memasukkan input didalamnya. Input text biasa digunakan dalam form aplikasi. Gambar.17 Input Text 2.2. Membuat Teks Teksyang dibuatFlashdapatberupa teks mendatar (horizontal), atau teks vertikal. Teks yang kita buat dapat dimodifikasi menggunakan Properties Text Tool. Gambar.18 Properties Text Tool  Klik Text Tool pada Toolbox  Didalam Properties Text Tool isilah sesuai yang diinginkan.  Klik area dalam stage, sehingga muncul kotak tempat menuliskan teks.
  • 30. 30 D. Mengenali dan Membuat symbol 1. Mengenali Symbol Symbol terdiri dari graphic, button, atau movieclip yang dibuat pada Flash Pro menggunakan button (Action Script 2.0), Simple Button (Action Script 3.0), dan Movie Clip. Yang dapat digunakan kembali dalam dokumen lain.  Gunakan symbol Graphic ( ) untuk gambar statis dan untuk membuat potongan animasi yang terkait dalam timeline utama. Animasi interaktif dan suara tidak dapat digunakandalamsymbol Graphic.Tambahkansymbol Graphicdalamdokumenflashkarena Graphic tidak membutuhkan timeline, tidak seperti button dan Movie Clip.  Gunakan symbol Button ( ) untuk membuat tombol interaktif yang merespon klik mouse, rollover, atau perintah lainnya. Untuk informasi lebih lanjut, lihat tutorial selanjutnya. (cari tutor ttg AS)  Gunakan symbol Movie Clip ( ) untukmembuatpotongan-potongan animasi yang dapat digunakan kembali. Movie Clip memiliki Timeline multiframe sendiri yang independen dari Timeline utama-bisa disebut multiframe dalam Movie Clip tergabung dalam Timeline utama yang dapat berisi control interaktif, suara, dan bahkan Movie Clip yang lainnya.Selainitu,Movie Clipdapatdiletakkandi dalamTimeline symbol Buttonuntuk membuat Button animasi. Sebagai tambahan, Movie Clip juga dapat diberi Action Script.  Gunakan symbol Font untuk meng-eksport sebuah font dan menggunakannya pada dokumen Flash Pro yang lain. 2. Membuat Symbol Membuat symbol yang berisi animasi yang dibuat dengan aplikasi Flash Pro memungkinkan untuk membuat banyak variasi dan meminimalkan ukuran file. Jika animasi yang digunakan berulang-ulang atau menggunakan gerakan yang sama-sebagai contoh, gerakan naik-turun pada sayap burung. Untuk menambah symbol dalam dokumen, gunakan Library Assets yang
  • 31. 31 berisi symbol-symbol yang telah digunakan atau yang sedang digunakan. Dengan cara men- drag symbol dari Library Assets ke dalam Stage. Mengubah Sebuah Elemen Menjadi Symbol  Lakukan salah satu dari berikut  Pilih Modify-> Convert to Symbol atau dengan menekan shortcut F8
  • 32. 32  Drag elemen yang diseleksi ke panel Library  Klik kanan>dan pilih Convert to Symbol dari Context Menu
  • 33. 33  Di dalam kotak Convert to Symbol, tulis nama symbol dan pilih jenis symbol (Movie Clip, Button, atau Graphic).  Klik OK. *Setelahmenjadi symbol,secaraotomatiselemenyangdijadikansymbol akan masukke dalam Library. Untuk mengedit symbol, dapat dilakukan dengan memilih Edit -> Edit Symbol atau dengan Edit -> Edit In Place. Membuat Symbol Kosong Lakukan salah satu dari berikut :  Pilih Insert -> New Symbol
  • 34. 34  Klik tombol New Symbol pada kiri bawah pada panel Library  Pilih New Symbol dari menu panel Librarydi sudut kanan atas panel Library  Pada kotak dialog Create New Symbol, tulis nama symbol dan pilih jenis symbol.  Klik OK.
  • 35. 35  Untuk membuatisisymbol,gunakantimeline,menggambar dengan drawing tools, mengimpor media, atau membuat turunan dari symbol lainnya. Untuk kembali ke mode document-editing, lakukan salah satu dari berikut :  Klik tombol Back  Pilih Edit -> Edit Document
  • 36. 36  Klik nama scene di Edit Bar. FlashPro menambahkansymbol ke Librarydanberalihke mode symbol-editing. Dalam mode symbol-editing, nama symbol muncul di kiri atas Stage, dan titik hitam menandakan registration point symbol tersebut. 3. Membuat Symbol Button  Frame pertama adalah Up state, mewakili penampilan button setiap kali pointer mouse tidak menyentuh button.  Frame kedua adalah Over state, mewakili penampilan button setiap kali pointer mouse menyentuh button.  Frame ketiga adalah Down state, mewakili penampilan button setiap kali button diklik.
  • 37. 37  Frame keempat adalah Hit state, mendefinisikan area fisik yang merespon klik mouse. Daerah ini terlihat setiap kali file SWF bermain di Flash Player. Mengedit Symbol Button Lakukan cara berikut :  Double klik pada button tersebut atau masuk edit kemudian pilih edit symbol  Untuk membuat isi symbol, gunakan timeline, menulis text , menggambar dengan drawing tools, mengimpor media, atau membuat turunan dari symbol lainnya. E. Sound dan Video Tentang Jenis File yang Dapat di-Import  Graphic Format File Type Extension File Type Extension Adobe Illustrator .ai Adobe Photoshop .psd AutoCAD DXF .dxf Bitmap .bmp Enhanced Windows .emf Future Splash Player .spl
  • 38. 38 Metafile GIF dan Animated GIF .gif JPEG .jpg PNG .png Flas Player 6/7 .swf Windows Metafile .wmf Adobe XML Graphic File .fxg  Sound Format File Type Extension File Type Extension Adobe Soundboth .asnd Wave .wav MP3 .mp3  Video Format File Type Extension File Type Extension Video Adobe Flash .flv, .f4v Quick Time Movie .mov, .qt Video for Windows .avi MPEG .mpg, .mlv, .m2p, .m2t, .m2ts, .mts, .tod, .mpe, .mpeg MPEG-4 .mp4, .m4v, .avc Digital Video .dv, .dvi 3GPP/3GPP2 for mobile devices .3gp, .3gpp, .3gp2, .3gpp2, .3p2  Import Sound
  • 39. 39  Pilih File -> Import -> Import to Library.  Pada kotak dialog Import, pilih file yang akan dimasukkan ke dalam Flash. Import Sound ke Timeline  Import suara ke dalam Librarylebih dahulu.
  • 40. 40  Pilih Insert -> Timeline -> Layer.  PadaLayer yang baru, drag Sounddari Libraryke dalam Stage. Dianjurkan,tiapsounddiletakkanpada Layer yang berbeda.  Pada Timeline, pilih frame pertama yang berisi file sound  Pilih Window -> Properties -> klik tanda panah di sudut kanan bawah untuk memperluas Property Inspector.  Pada Propertyinspector, pilih file sound dari pop-up menu. Efek Pop-up Menu  Pilih salah satu efek dari pop-up menu :
  • 41. 41  None, untuk menghapus efek yang sebelumnya diterapkan.  Left Channel/Right Channel, untuk memainkan suara dari channel kanan/kiri saja.  Fade In, secara bertahap meningkatkan volume suara.  Fade Out, secara bertahap mengurangi volume suara.  Custom, memungkinkan untuk membuat custom in dan out point menggunakan Edit Envelope.  Pilih pilihan sinkronisasi dari pop-up menu. Catatan : Jikamemasukkanlebihdari satusounddalamsatu layer,gunakanpilihan Stop.
  • 42. 42  Masukkan value untuk menentukan berapa kali suara mau diulangi (loop), pilih loop untuk mengulangi suara terus menerus.  Untuk mengetessuara,tarikplayheadke frame yangberisi suara ataugunakantombol yang ada pada Controller menu.
  • 43. 43 F. Action Script 1. Menjelaskan Bahasa syntax action script 2.0 Pengunaan Action Script pada movie clip selalu diikuti dengan event. Jadi Action Script tersebutakandijalankanpadasaatevent berlangsung. Bila ingin membuat Action Script pada movie clip, clik movie clip hingga muncul tulisan Action – Movie Clip di atas docker Action Script. Lalu ketik listing program pada tempat yang disediakan. Ada beberapa event yang lain misalnya :  Load : Saat movie clip loading  EnterFrame : Setiap movie clip menjalankan frame  Unload : Saat movie clip di unload  Mouse down : Setiap klik mouse di tekan  Mouse up : Setiap klik mouse di lepas setelah di klik  Mouse move : Setiap mouse digerakkan  Key down : Setiap tombol keyboard ditekan  Key up : Setiap tombol keyboard dilepas setelah ditekan G. Mengaplikasikan action : play(),stop(),gotoAndStop(),gotoAndPlay Goto adalah perintah yang banyak terdapat pada berbagai bahasa pemrograman. Tak terkecuali padaActionScriptFlash.BahkanpadaActionScriptFlash goto ada berbagai macam. Pada pokoknya ada 2 macam goto yang dibedakan karena proses melompatnya yaitu :  gotoAndPlay perintah ini digunakan untuk melompat ke suatu tempat dan langsung berjalan ke frame berikutnya atau animasi tetap berjalan tanpa berhenti.  gotoAndStop perintahini digunakan untuk melompat ke suatu tempat dan berhenti, jadi setelah melompat ke tempat tertentu animasi akan berhenti. Selain ke 2 perbedaan di atas, goto juga dibedakan tujuannya/typenya.  Frame Number pada type ini perintah goto diikuti dengan angka numerik yang menunjukkan ke frame berapa animasi harus melompat.
  • 44. 44  Frame Label pada type ini perintah goto diikuti dengan nama/label frame yang berarti animasi akan melompat ke nama/label frame yang sesuai.  nextFrame () pada type ini perintah goto yang berarti melompat dan berhenti ke frame berikutnya.  preFrame () pada type ini perintah goto yang berarti melompat dan berhenti ke frame sebelumnya. Contoh Penerapan Untuk lebih jelasnya mari kita membuat contoh aplikasinya. Pada gambar di atas memperlihatkan tampilan materi yang berisi 3 tombol navigasi dimana masing masing tombol memiliki masa tampil yang berbeda-beda. Untuk tombol home berisi Acrionscript on (release) { gotoAndStop(1); } Untuk tombol backberisi Acrionscript on (release) { prevFrame(); }
  • 45. 45 Untuk tombol next berisi Acrionscript on (release) { nextFrame(); } H. Load Movie Biasanya cara yang kita gunakan dalam memasukkan movie clip adalah dengan memasukkan movie cliptersebutkedalamlibrary,setelahituklik&dragfile tersebutkitamasukkankedalam frame yang kitainginkan.Apabilakitamemasukkanmovieclipsecaralangsungdidalamproject falsh kita seperti itu, biasanya proses eksekusi/loading akan terasa lama, apalagi bila movie yang dipanggil banyak,filenyabesardankomputeryang kita gunakan speknya minim pastilah loadingnyaakan lama. Berikut 2 cara untuk memanggil movie clip secara eksternal yang akan meringankan loading movie clip kita. Load movie dengan Level  File swf dan diisi dengan animasi dengan nama movie1  Buat file baru dengan nama movie2  Masukkan sebuah gambar pada stage  Buat sebuah tombol dan masukkan script berikut pada Action Panel on (release) { loadMovieNum (“movie1.swf”,1); }
  • 46. 46  Test Movie Load movie dengan Target  File swf dan diisi dengan animasi dengan nama movie1  Buat file baru dengan nama movie2  Masukkan sebuah gambar pada stage  Buat sebuah rectanggel tool dengan alpha 100%  Confert rectanggel tool tersebut menjadi movie clip dengan instant name “target”  Buat sebuah tombol dan masukkan script berikut pada Action Panel on (release) { loadMovie (“movie1.swf”,”targt”); }  Test Movie I. Membuat Kuis dengan Bantuan Action Script  Buka program Adobe Flash CS5.  Adobe flash akan melakukan initializing. Tunggu hingga selesai.  Lalu akan muncul jendela Adobe Flash Profesional CS5.
  • 47. 47  Pilih Action Script 2.0 pada kategori Create New.  Lalu akan muncul stage/lembar kerja Adobe Flash.  Lalu siapkan 3 buah layer. Masing masing beri nama script, content, dan background.  Pada layer content frame 1 isikan dengan judul pembukaan dari soal yang akan dibuat. Bisa diiisi dengan kalimat pembuka sebelum menuju pada lembar soal.
  • 48. 48  Setelah dirasa cukup, maka pilih layer background untuk membuat tampilan background agar terlihat lebih menarik.  Tetap pada layer yang sama, buatlah sebuah tombol untuk menghubungkan tampilan pembuka menuju tampilan berikutnya. Tombol ini bisa dibuat secara manual maupun menggunakan tombol yang sudah disediakan Adobe Flash Profesional CS5.  Membuat tombol secara manual : o Buatlah objek bebas dengan menggunakan rectangular, oval, pencil tool, maupun pen tool. Buat tombol sesuai dengan keinginan. Bisa juga disisipkan teks pada tombol tersebut.
  • 49. 49 o Setelahobjek selsai dibuat, seleksi objek tersebut dan ubah menjadi button dengan cara seleksi objek →klik kanan→pilih convert to symbol→pada “Type”, ubah menjadi Button→beri nama tombol dengan mengetikkan nama pada kolom “Name”→pilih OK. o Maka Tombolpun telah selesai dibuat.  Membuat tombol dengan fasilitas Common Libraries o Pilihlah menu Window pada Menu Bar o Lalu pilih Common Libraries o Pilih Button. Maka akan muncul jendela Library Button o Pilih jenis Button sesuai keinginan
  • 50. 50 o Drag kearah stage maka Tombol siap diiisi dengan Script o Teks “Enter”yang telah tersedia dapat diganti dengan teks yang diinginkan. Caranya :  Double klik pada tombol Enter tersebut  Maka akan muncul timeline button  Buka kunci dengan mengklik ikon lock ( ) pada layer text  Hapus bjek pada frame up lalu ganti dengan teks yang diinginkan.  Jangan lupa untuk mengganti pula teks yang terdapat pada frame down karena akan berpengaruh pada tombol ketika tombol dijalankan.  Setelah pengerjaan content selesai, maka langkah selanjutnya adalah mengisikan script pada tombol. Script berfungsi untuk memberikan perintah pada program yang dibuat.
  • 51. 51 Hubungkan frame pembuka dengan frame selanjutnya untuk memulai kuis. Caranya klik kananpada Button (tombol )yangtelahdibuat→ pilihactions→ lalu isikan script berikut :  Setelah button terisi dengan script, maka selanjutnya adalah bekerja pada layer script. Pada frame 1 isikan script berikut :  Setelah layer script frame 1 terisi oleh script, maka akan terdapat lambang alpha sebagai tanda bahwa frame tersebut telah terisi oleh script seperti berikut :  Jikahalamandepantelahselesai dibuat, selanjutnya membuat pertanyaan atau soal-soal yang inginditampilkan.Soal yangakandibuattersebutletakkan di frame selanjutnya yaitu frame 2. Caranya, blok frame 2 pada setiap layer→ pilih insert→pilih timeline→blank keyframe pada setiap layer. Maka akan menjadi seperti berikut :
  • 52. 52  Pada layer content, masukkan soal yang akan ditampilkan.  Lakukan langkah yang sama untuk membuat pertanyaan – pertanyaan pada frame berikutnya.
  • 53. 53  Jika pertanyaan dan jawaban selesai dibuat, maka langkah selanjutnya adalah membuat tombol pada setiap opsi jawaban. Tombol dapat dibuat dengan cara manual maupun dengan menggunakan fasilitas common libraries seperti langkah membuat tombol yang telah dibuat sebelumnya.  Lakukan hal yang sama pada frame berikutnya.  Setelah tombol terpasang pada tempatnya, isi tombol tersebut dengan script. Hal ini dimaksudkanagarketikatombol ditekan,makaakanmenujupadapertanyaan-pertanyaan pada frame berikutnya dan mendapatkan nilai. Isikan dengan script berikut :  Untuk tombol yang memuat nilai untuk jawaban benar, maka perlu tambahan script seperti berikut :  Lakukan pula hal yang sama untuk tombol – tombol yang terdapat pada frame lain.  Jika seluruh soala dan tombol selasi dibuat, maka isikan script ( ) pada layer script pada masing masing frame hinggga terlihat tampilan seperti berikut :
  • 54. 54  Jikascriptsudah dimasukkan,makalanagkah selanjutnya adalah membuat tampilan skor. Caranya tambahkan frame baru pda masing-masing layer.  Pada layer content isi dengan :  Untuk menampilkan skor dari soal yang telah dikerjakan, dapat dibuat dengan menggunakan Dynamic text. Caranya pilih text tool ( ), lalu pada jendela properties, ubah Static Text menjadi Dynamic Text.  Buat Dynamic Text tersebut kedalam layer content.
  • 55. 55  Pada setiap Dynamic Text tersebut isikan :  Dynamic Text disebelah kanan jawaban benar :  Instance name = skor  Variable = skor  Dynamic Text disebelah kanan Jawaban salah :  Instance name = salah  Variable = salah  Dynamic Text disebelah kanan nilai :  Instance name = nilai  Variable = nilai  Atur jenis tampilan yang akan masuk ke dalam Dynamic Text agar tampil menjadi angka atau bilangan dengan cara melekaukan embed pada Dynamic Text.
  • 56. 56  Lalu akan muncul jendela Font Embedding  Pada kolom Character ranges tandai pada “All (1332/93514 glyphs)”  Pilih OK  Sekarang kembali pada layer script. Pada layer script frame 1 silahkan tambahkan script berikut :  Lalu pada frame lembar nilai pada layer script isikan dengan script berikut :
  • 57. 57  Maka kuis telah siap ditampilkan. Untuk mencoba silahkan tekan Ctrl + Enter. J. Latihan 1. Buatlahsebuahprodukpembelajaraninteraktif ! (Ketentuanpersyaratan pembelajarandari pembimbing)