Belajar Flash Dasar OKEEE

Modul Tutorial Dasar‐Dasar
MACROMEDIA FLASH
Page 1
Tutorial Dasar‐Dasar
MACROMEDIA FLASH
Macromedia Flash adalah software yang dipakai luas oleh para professional web karena
kemampuannya yang mengagumkan dalam menampilkan multimedia, gabungan antara grafis,
animasi, suara serta interaktifitas bagi pengguna internet. Sostware ini berbasis animasi vector
yang dapat digunakan untuk menghasilkan animasi web, presentasi, game bahkan Film.
Klik Flash document untuk membuat document baru flash
Tampilan Dokuman baru Flash ;
Page 2
Mengenal animasi Frame by Frame
Animasi Roda Berputar
1. Gambarlah roda seperti gambar dibawah ini pada Frame 1 di timeline:
2. Pada Frame 2, klik kanan Mouse Æ klik Insert Keyframe
3. Seleksi seluruh gambar Roda pada Frame 2,dengan menggunakan selection tool , kemudian Putarlah
Gambar Roda Beberapa derajat kekenan dengan menggunakan Icon Rotate
4. Ulangi langkah 2 dan 3, dan lakukan insert keyframe pada frame 3, 4, 5, dan 6, dengan tiap frame mempunyai
sudut putaran roda yang berbeda-beda
Tampilan Frame 1 sampai 6
Gambar pada tiap-tiap Frame
Frame1 Frame 2 Frame 3 Frame 4 Frame 5 Frame 6
5. Cobalah animasi Frame-By Frame dengan menekan Keyboard CTRL + ENTER
6. Simpan dengan Nama ; animasi-roda-frame-by-frame
Page 3
Mengenal animasi dengan Tweening Motion
1. Gambarlah roda seperti gambar dibawah ini pada Frame 1 di timeline:
2. Pada Frame 2, klik kanan Mouse Æ klik Insert Keyframe
3. Klik Frame-1ÆKlik kanan Pada Frame-1 Æ pilih Create Motion Tween
4. Klik Frame-2 Æ Klik kanan pada Frame-2 Æ pilih Create Motion Tween
5. Geserlah Frame 2 sampai Frame 30, sehingga pada timeline akan muncul tanda panah sbb :
6. Klik Frame-30, kemudian putarlah 30 derajat ke kanan gambar roda
Gambar Frame-1 Gambar Frame-30
7. Cobalah animasi dengan Tweening diatas dengan menekan tombol CTRL + ENTER
8. Simpan dengan nama: animasi-roda-tween
Latihan: Buatlah animasi Bola Mantul-Mantul dibawah ini, dengan menggunakan Motion
Tween
2
3 4
1
5
Page 4
Mengenal Animasi dengan action Script
1. Gambarlah roda seperti gambar dibawah ini pada
2. Seleksi seluruh gambar Roda pada Frame 2,dengan menggunakan selection tool
3. Klik Modify Æ Convert to symbol
4. Pada Neme isi dengan ; Roda, Pada Behavior : centang Movie Clip Æ
kemudian pada registration point klik yang tengah Æklik OK
5. Klik gambar roda Æ klik Actions Movie Clip (pada bagian bawah layar)
6. Tuliskan action script berikut ini pada jendela action :
onClipEvent (enterFrame) {
this._rotation = this._rotation+5;
}
7. Cobalah animasi dengan Action Script diatas dengan menekan tombol CTRL + ENTER
8. Simpan dengan nama: animasi-action-script
Latihan ; Tambahkan dengan action script :

this._x=this._x+5;
Page 5
Membuat Button atau tombol di Flash
1. Buatlah design Tombol seperti dibawah ini, dengan menggunakan rectangle tool
2. Blok gambar diatas Æ klik Modify Æ Convert to symbol
3. isilah Name : tombol, Bahavior : Button, Registration Point : Pilih yang tengah Æ klik OK
4. Klik dobel gambar , sehingga masuk ke mode Tombol, perhatikan gambar berikut :
5. Klik Kanan pada Frame Over (Frame-2)Æ pilih insert KeyFrame

6. Klik Kanan pada Frame Down (Frame-1)Æ pilih insert keyframe
7. Klik Frame-2(Over = digunakan ketika mouse ada diatas tombol) Æ Ganti warna tombol menjadi kuning
8. Klik Frame-3 (Down = digunakan ketika mouse ditekan) Æ ganti warna tombol menjadi biru
9. Kembali ke Scene, dengan cara klik Scene-1

10. Cobalah dengan menekan tombol : CTRL + ENTER
11. Arahkan Kursor mouse pada Tombol anda. Apa yang terjadi??
Memberikan action script pada tombol/Button
1. Klik Tombol anda Æ klik Actions Movie Clip (pada bagian bawah layar)
2. Masukan script berikut ini :
on (release) {
stop();
}
Page 6
3. Bukalah File anda yang bernama ; animasi-roda-tween
4. Buatlah layer baru dengan klik gambar :

5. Gantilah nama layer baru itu dengan nama TOMBOL
6. Copylah gambar tombol anda tadi, kemudian klik Layer Tombol Frame 1, kemudian paste dengan
Klik EDIT ÆPASTE IN PLACE,
Kemudian aturlah ukuran tombol anda, sesuai keinginan,
7. Hasilnya sebagai berikut :
8. Cobalah Animasi ini dengan tekan : CTRL+ENTER
9. Copylah gambar tombol, sehingga ada dua tombol sebagai berikut:
Page 7
10. Pada tombol yang kedua, gantilah action Scriptnya sebagai berikut:
on (release) {
play();
}
11. Jalankan animasi anda dengan menekan tombol CTRL+ENTER
12. Buat layer baru, berilah nama TITLE

13. Pada Layer Title, Buatlah tulisan STOP, PLAY dan Judul : LATIHAN FLASH
dengan posisi seperti gambar berikut :
14. Cobalah anda tekan CTRL + ENTER

15. Klik lah tombol PLAY dan STOP bergantian, apa yang terjadi dengan roda???
Page 8
Membuat Game Programming
Kontrol Movie Clip dengan Keyboard
1. Gambarlah Hewan seperti dibawah ini, pada Frame-1.
2. Blok/seleksi gambar anda, kemudian Convert menjadi movie Clip dengan klik MODIFY Æ Convert to Symbol
Beri name : Walang, Behavior : Movie Clip ,Registration: pilih yang tengahÆ Klik OK
3. Klik gambar walangÆ berikan action script pada walang sebagai berikut ;
if (Key.isDown(Key.RIGHT)) {
this._x = _x+15;
} else if (Key.isDown(Key.LEFT)) {
this._x = _x-15;
} else if (Key.isDown(Key.DOWN)) {
this._y = _y+15;
} else if (Key.isDown(Key.UP)) {
this._y = _y-15;
5. Hasil animasi mungkin masih belum sempurna, coba anda tambahkan dengan action Script : this._rotation
6. Selamat Mencoba
Page 9
Membuat Jam Digital
1. Buatlah Gambar Jam Digital seperti gambar dibawah ini, pada Layer Bg dan Frame-1
2. Convert menjadi movie Clips Gambar Bg diatas
3. Klik double Gambar Bg, sehingga masuk ke mode Bg seperti gambar berikut ;
4. Buatlah Dynamic text, kemudian pada Variabel (Var) beri nama dengan : display
Page 10
5. Kembali ke Scene-1 dengan cara klik Scene-1
6. Klik gambar Bg Æ berikan action script berikut pada gambar Bg :
myTime=new Date();
jam=myTime.getHours();
menit=myTime.getMinutes();
detik=myTime.getSeconds();
display=jam+":"+menit+":"+detik;
7. Cobalah anda jalankan dengan menekan CTRL + ENTER
Page 11
Membuat Jam Analog
1. Gambarlah Background Jam pada Layer Bg, perhatikan gambar dibawah ini ;
2. Convertlah gambar Bg menjadi movie clips
3. Klik double gambar Bg, sehingga masuk ke mode Bg
4. pada mode Bg, Buatlah 4 buah layer, masing-masing beri nama ; Bg, detik, menit dan jam
Page 12
5. Gambarlah jarum detik, pada layer detik, convert menjadi movie Clip,
6. Berilah nama Movie clip dengan nama ; detik
7. Gambarlah Jarum Menit, pada Layer menit Æ convert menjadi movie clips
8. Berilah nama movie clip dengan nama : menit
9. Gambarlah Jarum jam, pada Layer Jam Æ convert menjadi movie clip
Page 13
10. Berilah nama movieClip dengan nama jam
11. . Kembali ke Scene-1 dengan cara klik Scene-1
12. Klik gambar Bg Æ masukkan action script berikut ini ;
myTime=new Date();
hour=myTime.getHours();
minute=myTime.getMinutes();
second=myTime.getSeconds();
if(hour>11){
hour=hour-12;
} rotasijam=hour*30;
rotasimenit=minute*6;
rotasidetik=second*6;
this.jam._rotation=rotasijam;
this.menit._rotation=rotasimenit;
this.detik._rotation=rotasidetik;
13. Jalankan dengan menekan CTRL+ENTER
Page 14
Latihan Membuat Profile diri sendiri
1. Buatlah Dokumen Flash baru dengan size 1024 x 768
2. Pada layer ‐1, ganti namanya menjadi : Bg

3. Buatlah Design Background sesuai keinginan anda, contoh sebagai berikut ;
4. Buatlah layer baru dengan nama TOMBOL, Posisi layer TOMBOL ada diatas Layer Bg
5. Buatlah button pada layer tombol,seperti yang telah dipelajari pada bab sebelumnya, contoh design tombol sbb ;
Page 15
6. Blok gambar tombol diatas Æ klik Modify Æ Convert to symbol
7. isilah Name : tombol, Bahavior : Button, Registration Point : Pilih yang tengah Æ klik OK
8. Klik dobel tombol , sehingga masuk ke mode Tombol, perhatikan gambar berikut :
9. Klik Kanan pada Frame Over (Frame-2)Æ pilih insert KeyFrame

10. Klik Kanan pada Frame Down (Frame-1)Æ pilih insert keyframe
11. Klik Frame-2(Over = digunakan ketika mouse ada diatas tombol) Æ Ganti warna tombol menjadi kuning
12. Klik Frame-3 (Down = digunakan ketika mouse ditekan) Æ ganti warna tombol menjadi biru
13. Kembali ke Scene, dengan cara klik Scene-1
14. Copylah gambar tombol menjadi 5 tombol, aturlah menjadi seperti ini ;
15. Pada tombol pertama, yang paling kiri, berilah action script sbb :
on (release) {
gotoAndStop(2);
Page 16
18. Kemudian berikan action script pada:
tombol kedua :
on (release) {
gotoAndStop(3);
tombol ketiga
on (release) {
gotoAndStop(4);
tombol keempat
on (release) {
gotoAndStop(5);
tombol kelima
on (release) {
gotoAndStop(6);
19. Klik Frame 1, berilah action script :
stop();
20. Buatlah layer baru dengan nama CONTENT, dengan posisi layer sbb ;
Page 17
21. Tuliskan nama-nama tombol pada layer content sbb :
22. Buatlah layer baru dengan nama MATERI, dengan posisi sbb ;
23. Klik pada layer Bg, klik frame-6, Æklik kanan pada frame 6, Æklik insert Frame
24. Klik pada layer Tombol, klik frame-6, Æ klik kanan pada frame 6, Æklik insert Frame
25. Klik pada layer Content, klik frame-6, Æ klik kanan pada frame 6, Æ klik insert Frame
26. Klik pada layer materi, klik frame 1,
Tulislah Tulisan seperti gambar dibawah ini :
Page 18
27. Klik pada layer Materi, klik Frame 2 Æ klik kanan pilih Insert Blank Keyframe
Tulislah tulisan seperti gambar ini :
Page 19
Importlah foto anda dan masukkan ke library ; klik File Æ Klik Import Æ to Library Æ pilih foto Æ OK
32. Klik Windows Ælibrary Æ buka library Æ tarik ke stage gambar yang diinginkan
Page 20
33. aturlah foto anda seperti contoh ;
Page 21
PUBLISHING MACROMEDIA FLASH
1. Klik File Æ Klik Publish setting Æ beri tanda centang pada Flash.swf dan Windows Projector
2. Klik Publish Æ OK
Selamat Belajar
## LAKUKANLAH YANG TERBAIK, JALAN MENUJU PUNCAK AKAN TERBENTANG ##
By : rokhmad_sragen@yahoo.com
Page 22
Animasi Sederhana dengan Motion Tweening
Halo semua !! Apa kabar bertemu lagi dengan saya miko ^ ^. Nah pada kesempatan kali ini di tutorial flash ini kita
akan membahas membuat animasi sederhana menggunakan motion tweening. Langsung saja ya.. Kita buka
program Flash dulu
Langkah pertama, yaitu buat 3 layer. Karna kita di sini hanya menggunakan sedikit layer untuk membuat animasi.
Agar proses lebih mudah membuat layer lihat gambar di bawah, di sana ada menu di lingkari dengan warna merah
.. Nah klik sebanyak 2 kali maka dengan mengeklik 1 kali kita membuat 1 layer klo 2 otomatis 2 layer
Nah selanjutnya, beri nama masing-masing layer seperti yang sudah dicontohkan gambar dibawah ini. Agar
memudahkan proses pembuatannya
Kemudian ubah warna backgoundnya menjadi hitam, biasanya di awal-awal kita membuka flash bacgroundnya
berwarne putih klo belum di rubah setingannya
Setelah itu klik layer teks dan buat tulisan seperti yang saya contohkan atau sesuka hati kalian ..
Setelah itu klik layer bola , dan buat bentuk bola denga warna putih
Pembuatan objeknya sudah selesai kini kita menginjak ke animasinya, buatlah frame sepanjang 90 -> kemudian
klik kanan lalu pilih insert frame
Page 23
Jika sudah semua hasilnya kurang lebih seperti ini
Setelah itu kita buat animasi motion tweening , sebagai objeknya layer bola
Buatlah keyframe , seperti yang saya contohkan >> kemudian klik kanan>>pilih insert keyframe
Setelah langkah di atas selesai, drag layer bola / drag objek bolanya dengan menekan tombol “ v “ di keyboard
>>kemudian klik gambar bolanya
Setelah geser bolanya ( jangan menggeser

menggunakan mouse pakai saja tanda
panah kanan di keyboard agar posisinya
tidak berubah )
Page 24
Klo sudah selesai hasilnya seperti gambar yang di atas
Lanjut ke langkah berikutnya, kita menuju ke layer bola>>klik kanan di dalam frame / seperti gambar di bawah
ini>>kemudian pilih create motion tween
Setelah selesai klik juga frame ke 90 caranya>>klik kanan frame yg sudah kita buat>>pilih create motion tween
Semua juga sama buat semua layer di rubah menjadi motion tweening
Page 25
Animasi teks
Animasi teks sering digunakan di flash, misalnya pada banner. Bagi anda yang tidak mau repot membuatnya,
anda bisa menggunakan software Swish Max. Tapi jika anda tidak mempunyai software tersebut, anda juga bisa
menggunakan flash. Berikut ini beberapa contoh animasi teks hasil berkreasi di flash. Sebelumnya anda baca
terlebih dahulu tutorial Motion Tween dan Animasi Berputar karena pada tutorial di bawah ini kita akan
menggunakannya
Animasi 1
1. Buatlah sebuah Static Text bertuliskan Animasi Teks. Tempatkan di tengah-tengah stage.
2. Seleksi text tersebut dan tekan F8. Pada kotak dialog yang muncul masukan teks sebagai Name dan pilih Movie
Clip sebagai Type dan tekan OK.
3. Klik kanan frame 30 pilih Insert Keyframe.
4. Klik frame 1, seleksi movie clip teks dan tekan Ctrl+F3 untuk memunculkan kotak Properties. Ubah color menjadi
alpha 0% pada kotak properties tersebut.
5. Klik kanan frame 1 dan pilih Create Motion Tween.
6. Klik frame 30 dan tekan F9. Pada kotak dialog Actions yang muncul masukan script berikut untuk menghentikan
animasi :
stop();
7. Tekan Ctrl+Enter untuk melihat hasilnya.
Animasi 2
3. Klik kanan frame 15 pilih Insert Keyframe. Ubah ukuran movie clip teks di frame 15 menjadi lebih besar.
animasi :
stop();
Animasi 3
3. Klik kanan frame 15 pilih Insert Keyframe. Ubah ukuran movie clip teks di frame 15 menjadi lebih kecil.
animasi :
stop();
Animasi 4
3. Klik kanan frame 25 pilih Insert Keyframe. Ubah ukuran movie clip teks di frame 25 menjadi lebih kecil.
5. Klik frame 1 dan tekan Ctrl+F3 untuk memunculkan kotak Properties. Pada kotak properties yang muncul ubah
Rotate menjadi CW.
animasi :
stop();
Animasi 5
1. Buatlah sebuah Static Text bertuliskan Animasi Teks. Tempatkan di luar stage bagian atas.
3. Klik kanan frame 30 pilih Insert Keyframe. Ubah letak movie clip teks di frame 30 menjadi berada di tengah-tengah
stage.
4. Klik frame 1, seleksi movie clip teks dan tekan Ctrl+F3 untuk memunculkan kotak Properties. Ubah color menjadi
alpha 0% pada kotak properties tersebut.
5. Klik frame 1 dan tekan Ctrl+F3 untuk memunculkan kotak Properties. Pada kotak properties yang muncul ubah
Rotate menjadi CW.
Page 26
animasi :
stop();
Animasi 6
1. Buatlah sebuah Static Text bertuliskan Animasi Teks. Tempatkan di tengah-tengah stage
2. Seleksi text tersebut dan tekan F8. Pada kotak dialog yang muncul masukan teks sebagai Name dan pilih Movie Clip
sebagai Type dan tekan OK.
3. Klik kanan frame 2 pilih Insert Keyframe. Klik kanan frame 15 dan pilih Insert Keyframe. Klik kanan frame 35 dan pilih
Insert Keyframe. Klik kanan frame 44 dan pilih Insert Keyframe. Klik kanan frame 45 dan pilih Insert Blank Keyframe.
4. Hapus movie clip teks di frame 1.
5. Aktifkan panel filters melalui menu bar Window>Properties>Filters.
6. Seleksi movie clip teks di frame 2 dan pada panel filtrs tekan tombol + (add filters) kemudian pilih blur. Ubah Blur X
menjadi 100, Blur Y menjadi 0 dan Quality High.
8. Klik kanan frame 2 dan pilih Create Motion Tween. Klik frame 35 dan pilih Create Motion Tween.
9. Seleksi frame 45 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :
1 stop();
Animasi 7
3. Klik kanan frame 5 pilih Insert Keyframe.
4. Ubah letak movie clip teks di frame 1 ke luar stage sebelah kiri.
5. Aktifkan panel filters melalui menu bar Window>Properties>Filters.
1 stop();
Animasi 8
3. Klik kanan frame 5 dan pilih Insert Keyframe. Klik kanan frame 8 dan pilih Insert Keyframe. Klik kanan frame 15 dan
pilih Insert Keyframe.
4. Hapus movie clip teks di frame 1.
5. Seleksi movie clip teks di frame 5 dan tekan Ctrl+F3. Pada panel properties yang muncul ubah color menjadi alpha 0%.
6. Ubah ukuran movie clip teks di frame 5 menjadi lebih kecil dengan menggunakan Free Transform Tool.
Page 27
7. Ubah ukuran movie clip teks di frame 8 menjadi lebih besar dengan menggunakan Free Transform Tool.
8. Klik kanan frame 5 dan pilih Create Motion Tween. Klik kanan frame 8 dan pilih Create Motion Tween.
9. Seleksi frame 15 dan tekan F9. Pada panel actions yang muncul masukkan script berikut:
1 stop();
Animasi 9
3. Klik kanan frame 5 dan pilih Insert Keyframe.Klik kanan frame 25 dan pilih Insert Keyframe. Klik kanan frame 30 dan
4. Ubah letak movie clip teks di frame 1 menjadi diluar stage sebelah kiri.
5. Ubah letak movie clip teks di frame 5 yang berada di tengah-tengah stage menjadi agak ke kanan.
6. Ubah letak movie clip teks di frame 30 menjadi diluar stage sebelah kiri.
7. Klik kanan frame 1 dan pilih Create Motion TWeen. Klik kanan frame 5 dan pilih Create Motion Tween. Klik kanan frame
25 dan pilih Create Motion TWeen.
8. Seleksi frame 30 dan tekan F9. Pada panel actions yang muncul masukkan script berikut:
1 stop();
Animasi 10
3. Klik kanan frame 10 dan pilih Insert Keyframe. Klik kanan Frame 12 dan pilih Insert Keyframe. Klik kanan frame 15 dan
4. Ubah ukuran movie clip teks di frame 1 menjadi lebih besar dengan menggunakan Free Transform Tool.
5. Seleksi movie clip teks di frame 1 dan tekan Ctrl+F3. Pada panel properties yang muncul ubah color menjadi alpha 0%.
6. Ubah movie clip teks di frame 12 menjadi sedikit lebih besar.
7. Klik kanan frame 1 dan pilih Create Motion Tween. Klik kanan frame 10 dan pilih Cretae Motion Tween. Klik kanan
frame 12 dan pilih Create Motion Tween.
8. Klik kanan frame 5 dan pilih Insert Keyframe.
9. Seleksi movie clip teks di frame 5 dan ubah color pada panel properties (tekan Ctrl+F3 apabila belum muncul) menjadi
none.
1 stop();
Page 28
TUTORIAL
Membuat Kuis Pilihan Ganda dengan Flash
Langkah-Langkah:
1. Aktifkan program Macromedia Flash anda. Pada Creat New, pilih Flash Document.
2. Opsional: Pada Frame 1 Layer 1, buat background dengan rectangle tool. Klik kanan frame 7, pilh Insert
Keyframe. Kunci Layer 1.
3. Klik Insert Layer (sudut kiri bawah timeline) untuk membuat Layer baru (layer 2).
4. Klik Frame 1 Layer 2, buat judul kuis dengan Static Text. Di bawah judul, buatlah kotak nama dengan Input Text
(aktifkan ‘Show border around text’). Pada Var, ketik ‘nama’. Tambahkan petunjuk pengisian kotak nama di atas
Input Text. Sejauh ini hasilnya seperti gambar di bawah.
5. Klik kanan Frame 2 Layer 2, pilih Insert Blank Keyframe. Buat soal beserta pilihan jawabannya dengan tipe teks
Static.
6. Klik Frame 2 Layer 2, kemudian tekan F6 pada Keyboard untuk meng-copy frame sampai dengan Frame 6. Klik
Frame 3, ganti soal beserta jawabannya. Demikian seterusnya sampai dengan soal nomor lima yang ada di Frame
6.
7. Klik kanan Frame 7 Layer 2, pilih Insert Blank Keyframe. Sampai di sini, kunci Layer 2 dan simpan dulu dengan
nama file LATIHAN1.
8. Buat Layer baru (Layer 3). Klik Frame 1, Buat teks ‘MULAI’ dengan Static Text, letakkan di bawah kotak nama.
Klik Selection Tool (tanda panah kanan atas pada Tools), Klik kanan pada teks ‘MULAI’ tersebut, Pilih Convert to
Symbol, Type-nya pilih Button, lalu klik OK. Pastikan Panel Properties aktif, pada kotak Instance Name ketik
‘startbutton’.
9. Klik kanan Frame 2 layer 3, pilih Insert Blank Keyframe. Buat object kotak dengan Rectangle Tool tepat di atas
pilihan jawaban A. Tekan F8 (Klik kanan Convert to Symbol), pada Type pilih ‘Button’, klik OK. Klik ganda Kotak
yang telah dikonversi menjadi button tersebut. Klik kanan pada Frame Up, pilih Cut Frames, klik kanan pada
Frame Hit, pilih Paste Frames. Kemudian klik Scene 1 pada Timeline.
10. Pastikan button kotak terseleksi, Ketik ‘button_a’ pada kotak Instance Name pada Panel properties.
11. Kopi button kotak tadi (klik kanan, Copy Paste 3 kali) dan masing-masing letakkan tepat di atas pilihan B, C, dan
D. Seleksi button di atas pilihan jawaban B, Ubah Instance Name-nya menjadi ‘button_b’, di atas pilihan jawaban
C menjadi ‘button_c’, dan di atas pilihan jawaban D menjadi ‘button_d’. Sampai di sini, simpan dulu (tekan Ctrl+S).
Page 29
12. Klik Frame 2 Layer 3, tekan F6 4 kali untuk men-copy frame. Klik kanan Frame 7 Layer 3, pilih Insert Blank
Keyframe. Kunci Layer 3.
13. Buat Layer baru (Layer 4). Klik Frame 1 . Tekan F7 6 kali. Masih di Layer 7, kembali klik Frame 1, lalu tekan F9
untuk menampilkan panel Action dan masukkan ActionScript berikut (bisa dengan Copy-Paste):
stop();
score = 0;
startbutton.onPress = function() {
nextFrame();
};
14. Klik Frame 2 Layer 7, masukkan ActionScript berikut:
stop();
onEnterFrame = function () { skor = +score;};
button_a.onPress = function() {
nextFrame();
};
button_b.onPress = function() {
score += 20;
nextFrame();
};
button_c.onPress = function() {
nextFrame();
};
button_d.onPress = function() {
nextFrame();
};
Keterangan: Soal no. 1 kunci jawabannya B. Jika button_b (pilihan jawaban B) diklik skor bertambah 20 dan
menuju frame berikutnya yang berisi soal berikutnya.
15. Klik Frame 3 (masih di Layer 4), masukkan ActionScript berikut:
stop();
score += 20;
nextFrame();
};
nextFrame();
};
nextFrame();
};
nextFrame();
};
Keterangan: Soal no. 2 kunci jawabannya A. Jika button_a (pilihan jawaban A) diklik skor bertambah 20 dan
stop();
score += 20;
nextFrame();
};
nextFrame();
};
nextFrame();
};
nextFrame();
};
Page 30
Keterangan: Soal no. 3 kunci jawabannya A. Jika button_a (pilihan jawaban A) diklik skor bertambah 20 dan
stop();
nextFrame();
};
nextFrame();
};
score += 20;
nextFrame();
};
nextFrame();
};
Keterangan: Soal no. 4 kunci jawabannya C. Jika button_c (pilihan jawaban C) diklik skor bertambah 20 dan
stop();
nextFrame();
};
score += 20;
nextFrame();
};
nextFrame();
};
nextFrame();
};
Keterangan: Soal no. 5 kunci jawabannya B. Jika button_b (pilihan jawaban B) diklik skor bertambah 20 dan
menuju frame berikutnya.
Sampai di sini, simpan dulu (tekan Ctrl+S).
19. Selanjutnya, buka kunci Layer 2 dengan cara klik tanda gambar gembok di Layer tersebut. Klik kanan kotak Input
Text yang telah dibuat di Frame 1 Layer 2, Copy dan Paste-kan di Frame 7 (masih di Layer 2). Klik ganda kotak
Input Text dan ketik ‘tanpa nama’.
Di bawah kotak Input Text, ketik ‘Nilai anda:’ dengan ukuran Font 15 (Type Text-nya Static Text). Di bawah teks
‘Nilai anda:’, buat Dynamic Text kosong dengan cara klik Text Tool (A) pada panel Tools, pastikan panel
Properties aktif, kemudian pilih Dynamic Text dengan ukuran font 50, klik di bawah teks ‘Nilai anda:’ dan drag ke
kanan. Pada kotak ‘Var’, ketik ‘skor’.
Di bawah ‘Dynamic Text’ dengan nama Variable ‘skor’, ketik dengan tipe teks Static Text ‘Kriteria ketuntasan
Minimal (KKM): 80’
Di bawah teks ‘Kriteria ketuntasan Minimal (KKM): 80’, buat lagi Dynamic Text kosong dengan nama variable
‘keterangan’. Kembali kunci Layer 2.
Tampilan Stage pada Frame 7 Layer 2 seperti Gambar di bawah.
Page 31
20. Selanjutnya, buka kunci Layer 3. Klik Frame 7 Layer 3. Ketik ‘ULANGI’ dengan tipe teks Static. Klik kanan teks
tersebut, pilih Convert to Symbol, tipenya Button. Pastikan panel Properties aktif dan pada kotak Instance Name
ketik ‘restart_button’. Kembali kunci Layer 3.
21. Klik Frame 7 Layer 4 (pastikan Layer 4 tidak terkunci) kemudian tekan F9 untuk mengaktifkan panel Action dan
masukkan ActionScript berikut:
if (score>=80) {
keterangan = "Bagus! Pertahankan Prestasi!";
}
if (score<=60) {
keterangan = "Anda belum tuntas. Belajar lagi, ya!";
}
restart_button.onPress = function() {
gotoAndStop(1);
};
22. Selesai dan tekan Ctrl+S untuk menyimpan. Di bawah adalah tampilan akhir jendela Flash Ducument frame
terakhir (7).
Page 32
23. Untuk melihat hasilnya, tekan Ctrl+Enter.
08157712604
Page 33

Belajar Flash Dasar OKEEE

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Belajar Flash Dasar OKEEE

Diunggah oleh

Hak Cipta:

Format Tersedia

Modul Tutorial Dasar‐Dasar

Klik Flash document untuk membuat document baru flash

Tampilan Dokuman baru Flash ;

1. Gambarlah roda seperti gambar dibawah ini pada Frame 1 di timeline:

2. Pada Frame 2, klik kanan Mouse Æ klik Insert Keyframe

Gambar Roda Beberapa derajat kekenan dengan menggunakan Icon Rotate

Tampilan Frame 1 sampai 6

Gambar pada tiap-tiap Frame

Frame1 Frame 2 Frame 3 Frame 4 Frame 5 Frame 6

5. Cobalah animasi Frame-By Frame dengan menekan Keyboard CTRL + ENTER

6. Simpan dengan Nama ; animasi-roda-frame-by-frame

1. Gambarlah roda seperti gambar dibawah ini pada Frame 1 di timeline:

2. Pada Frame 2, klik kanan Mouse Æ klik Insert Keyframe

3. Klik Frame-1ÆKlik kanan Pada Frame-1 Æ pilih Create Motion Tween

6. Klik Frame-30, kemudian putarlah 30 derajat ke kanan gambar roda

Gambar Frame-1 Gambar Frame-30

8. Simpan dengan nama: animasi-roda-tween

1. Gambarlah roda seperti gambar dibawah ini pada

6. Tuliskan action script berikut ini pada jendela action :

Latihan ; Tambahkan dengan action script :

2. Blok gambar diatas Æ klik Modify Æ Convert to symbol

5. Klik Kanan pada Frame Over (Frame-2)Æ pilih insert KeyFrame

9. Kembali ke Scene, dengan cara klik Scene-1

Memberikan action script pada tombol/Button

4. Buatlah layer baru dengan klik gambar :

8. Cobalah Animasi ini dengan tekan : CTRL+ENTER

9. Copylah gambar tombol, sehingga ada dua tombol sebagai berikut:

11. Jalankan animasi anda dengan menekan tombol CTRL+ENTER

12. Buat layer baru, berilah nama TITLE

14. Cobalah anda tekan CTRL + ENTER

1. Gambarlah Hewan seperti dibawah ini, pada Frame-1.

4. Cobalah anda tekan CTRL + ENTER

2. Convert menjadi movie Clips Gambar Bg diatas

6. Klik gambar Bg Æ berikan action script berikut pada gambar Bg :

7. Cobalah anda jalankan dengan menekan CTRL + ENTER

2. Convertlah gambar Bg menjadi movie clips

3. Klik double gambar Bg, sehingga masuk ke mode Bg

6. Berilah nama Movie clip dengan nama ; detik

8. Berilah nama movie clip dengan nama : menit

11. . Kembali ke Scene-1 dengan cara klik Scene-1

12. Klik gambar Bg Æ masukkan action script berikut ini ;

13. Jalankan dengan menekan CTRL+ENTER

1. Buatlah Dokumen Flash baru dengan size 1024 x 768

2. Pada layer ‐1, ganti namanya menjadi : Bg

9. Klik Kanan pada Frame Over (Frame-2)Æ pilih insert KeyFrame

13. Kembali ke Scene, dengan cara klik Scene-1

19. Klik Frame 1, berilah action script :

26. Klik pada layer materi, klik frame 1,

Tulislah Tulisan seperti gambar dibawah ini :

Tulislah tulisan seperti gambar ini :

Tulislah tulisan seperti gambar ini :

Tulislah tulisan seperti gambar ini :

Tulislah tulisan seperti gambar ini :

34. Cobalah anda tekan CTRL + ENTER

Setelah geser bolanya ( jangan menggeser

4. Hapus movie clip teks di frame 1.

5. Aktifkan panel filters melalui menu bar Window>Properties>Filters.

3. Klik kanan frame 5 pilih Insert Keyframe.

5. Aktifkan panel filters melalui menu bar Window>Properties>Filters.

7. Klik kanan frame 1 dan pilih Create Motion Tween.

4. Hapus movie clip teks di frame 1.

6. Ubah movie clip teks di frame 12 menjadi sedikit lebih besar.

8. Klik kanan frame 5 dan pilih Insert Keyframe.

Anda mungkin juga menyukai