Tutorial - TIK Flash Animasi Soal

8/10/2019 Tutorial - TIK Flash Animasi Soal

1/37

PEMANFAATAN MACROMEDIA FLASH 8

UNTUK PEMBUATAN SOAL MULTIPLE CHOICE

A. PEMBUATAN HALAMAN DEPAN1. Buka File > pilih New > pilih Flash Document akan muncul

tampilan gambar 2.B

2. Pada panel Properties, lik !i"e #lihat gambar 2.$% sehingga akan

muncul tampilan &

RPP TIK SMA 1 Kudus Berkarakter , 2012 [email protected]


2/37

a. Pada 'uler units gantilah dengan (entimeters #gambar 2.(%

b. Pada Dimensions, isilah angka 2) untuk width dan angka 1* untukheight #gambar 2.D%

c. Pada Frame rate, isilah angka 2) #gambar 2.+%

d. Pada Background color, pilihlah warna ungu #gambar 2.F%

e. lik

-. Pembuatan backround untuk tampilan ash agar lebih menarik,

caran/a &

a. 0anti nama la/er 1 menadi background #gambar -.$% dengan cara

klik dobel padatulisan la/er 1



3/37

b. lik 'ectangle ool #'%, #gambar -.B% kemudian lakukan pengaturanberikut &

#1%. Pada !troke color, pilih warna kuning #gambar -.(%

#2%. Pada Fill color, pilih warna biru #gambar -.D%

#-%. Pada !et corner radius , ketikan angka -3 #gambar -.+ dan -.F%

c. Buat kotak di dalam stage #gambar -.0%

#1%. 4akukan pengaturan ukuran agar tepat 2) 5 1* cm #lihat gambar -.6%

#2%. 7bahlah angka ketebalan garis agar menadi ) #lihat gambar -.4%



4/37

#-%. Pada panel $lign 8 9n: 8 rans;orm, klik tanda align


5/37


6/37

). lik la/er pertan/aan agar akti; klik pada ;rame keA1 ubahlah

kursor menadi

bertanda e5t ool #% dan lakukan pengaturan pada panel properties seperti

berikut &

a. Pilih enis huru;, misalkan & ahoma #gambar ).$%

b. Pilih e5t /pe pada pilihan & D/namic e5t #gambar ).B%

c. Pilih 7kuran huru;, misalkan & -3 #gambar ).(%

d. Pilih warna huru;, misalkan & kuning #gambar ).D%e. Pilih line t/pe pada pilihan & @ultiline #gambar ).+%

;. 7ntuk baris pertama, ketikan di stage tulisan ! 4 74 N0 N & 'C N #gambar ).F%

g. lik pada pilihan Filters #gambar ).0% lik tanda #lihat gambar

).6%

pilih pada pilihan Drop !hadow dan atur warna colorn/a merah #gambar ).9%

h. 7ntuk baris kedua ketikan tulisan @ata Pelaaran #ukuran ;ont 23 %

i. 7ntuk baris ketiga ketikan tulisan elas dan !emester

. 7ntuk baris keempat, ketikan tulisan !atuan Pendidikan

k. 7ntuk baris kelima, ketikan ompetensi Dasar

l. 7ntuk baris keenam ketikan 0uru Pengaar


7/37


8/37

. @emunculkan hari dan tanggal di la/ar, caran/a &

a. Buat la/er baru diatas la/er pertan/aan, kemudian gantilah nama la/er

tersebut dengan

nama baru Date8ime #lihat gambar .+%

b. 7bahlah kursor menadi e5t ool #% > atur terlebih dahulu pada panel

properties

#1%. Pilih enis huru;, misalkan & ahoma#2%. Pilih e5t /pe pada pilihan & D/namic e5t #gambar .$%

#-%. Pada kotak Ear, ketikan & theDate #gambar .B%

#-%. Pilih 7kuran huru;, misalkan & -3

#=%. Pilih warna huru;, misalkan & kuning #gambar .(%

c. Buat kotak dengan menggunakan e5t ool #% seperti pada gambar .D

d. @asih dalam kondisi kotak pada langkah .c akti;, kemudian tekan tombol

ke/board F,

dan tampilan /ang muncul conEert to s/mbol, pada bagian Name ketikan Date


9/37

#lihat

gambar .F% dan bagian /pe klik pilihan @oEie clip klik


10/37

e. lik pada panel $ctions, sehingga tampilan panel berubah menadi ctionsA

@oEie (lip

ketikan script berikut ini &

onClipEvent loa!"#

$ee%!a&' ( )*Aha!*+*Senin*+*Sela'a*+

*Ra,-*+*Kai'*+*/-0at*+*Sa,t-*12

onth' ( )*/an-a3i*+*Pe,3-a3i*+*Ma3et*+*Ap3il*+*Mei*+*/-ni*+*/-li*+

*A4-'t-'*+ *Septe,e3*+ *O%to,e3*+*Nope,e3*+*De'e,e3*12

5

onClipEvent ente3F3ae"#

&Date ( ne$ Date"2

tDa& ( $ee%!a&')&Date.4etDa&"12

tMonth ( onth')&Date.4etMonth"12

tDate ( &Date.4etDate"2

t6ea3 ( &Date.4etF-ll6ea3"2

theDate ( tDa&7*+ *7 tDate7* *7tMonth7* *7t6ea32

G

;. 4akukan pengetesan hasil selama ini dengan cara tekan tombol Ct3l 7 Ente3

H. @emunculkan tombol M-lai9pada halaman background, caran/a &

a. lik la/er background klik ;rame keA1

a. lik Iindow pada menubar

b. pilih pada pilihan Common Libraries

c. klikButtons#lihat gambar 23.$%, sehingga muncul tampilan 4ibrar/ J

Buttons

d. lik dobel pada ;older classic buttons#gambar 23.B%

e. klik dobel pada ;olderPlayback

;. pilih pada pilihangel Right#gambar 23.(%


11/37

b. lik dan tahan tombol gel 'ight kemudian geser ke stage dibawah

sehingga terlihat

seperti gambar 23.D.

c. 0anti kursor menadi Text Tool (T),kemudian ketikan tulisan M-lai #gambar 23.+%

d. lik gambar tombol biar akti;, kemudian tekan tombol ke/board F*, dan

ketikan

script &

on 3elea'e"#

4otoAn!Pla&:"2

5

!etelah selesai angan lupa la/er background dikunci kembali


12/37


13/37

B. PEMBUATAN BLAN;KO UNTUK SOAL DAN /A?:milikn/a la&e3 ,a@%43o-n!

#lihat

gambar H.$%

!etelah itu tekan tombol ke/board F untuk memasukanInsert Keyframes. ?ika benar

akan

terlihat seperti gambar H.Bberikut

*. lik pada la/er pertan/aan agar la/er ini /ang akti;> klik pada ;rame keA2

> tekan

tombol Shi=t, kemudian klik pada ;rame keA-2 agar ;rame 2 s.d. -2 terblokhitam #lihat

gambar .$% lik kanan mouse > pilih pada pilihan Remoe

!rames #lihat

gambar .B%. ?ika benar akan terlihat seperti gambar .(


14/37


15/37

13. lik la/er pertan/aan klik pada ;rame keA2 klik kanan mouse

pilih pada

pilihan 9nsert Blank e/;rames #gambar *.$%.

11. lik la/er pertan/aan klik pada ;rame keA2 ubahlah kursor menadi

e5t ool #%,

kemudian lakukan pengaturan pada panel properties sbb &

a. Pilih e5t /pe pada pilihan & D/namic e5t #gambar 13.$%

b. Pilih enis huru;, misalkan & ahoma #gambar 13.B%

c. Pilih 7kuran huru;, misalkan & 1 #gambar 13.(%

d. Pilih warna huru;, misalkan & biru muda #gambar 13.D%

e. Pilih line t/pe pada pilihan & @ultiline #gambar 13.+%

;. Buat kotak di stage untuk tempat menuliskan soal #gambar 13.F% dengan

ukuran 22,) 5

- cm #gambar 13.0% dan buat uga otak sekaligus ditulis tulisan !oal No

12. @asih dila/er pertan/aan pada ;rame keA2 ubahlah kursor menadi e5tool #%,

kemudian lakukan pengaturan pada panel properties sbb &

a. Iarna huru;, misalkan menadi kuning, lainn/a sama seperti langkah 11.aAbAcA

e

b. Buat kotak di stage untuk tempat menuliskan awaban soal pilihan


16/37

berganda #lihat

gambar 11.$% dengan ukuran 23 5 1,) cm.

c. Buat kotak di stage /ang berukuran 1 5 1 cm #lihat gambar 11.B% untuk

tempat

menuliskan teks huru; B ( D dan +


17/37

1-. @asih di la/er pertan/aan pada ;rame keA2 ubah dulu kursor menadi

!election ool

#%, kemudian &

a. lik teks 9 agar akti; tekan

tombol ke/board F8 sehingga muncul tampilan

Conert to "ymbol. 9sikan pada bagian Name & tulisan 1$, dan pada /pe &

pilihlah

B-tton. !etelah selesai klik

b. ekan tombol ke/board F* untuk masuk keApanel actions, sehingga

tampilan panel

menadi $ctionsAButton, kemudian ketikan script &

on 3elea'e"#

4otoAn!Pla&?"2

5

c. 4akukan hal /ang sama seperti langkah 12.a dan 12.b tetapi untuk teks B K

teks ( K

teks D K dan teks + . ?angan lupa mengganti pada Name & 1B K Name & 1( K

Name &


18/37

1DK dan Name & 1+. ?ika langkah 12 ini benar semua, maka di panel

librar/ akan

muncul #gambar 12.(%


19/37

1=. @asih di la/er pertan/aan pada ;rame keA2 AAAA> 7bah dulu kursor menadi

"election Tool

#%, lalu lik dobel pada

tulisan

12.D%

Perhatikan gambar 12.D

sehingga tampilan berubah menadi seperti

#gambar

a. lik pada bagian Ove39Alik kanan mouse pilih Insert Keyframes

#gambar

12.+% ubahlah warnan/a, misalkan menadi merah dg cara klik pada

panel (olor

#gambar 12.F%

b. lik pada bagian Do$n9lik kanan mouse pilihInsert Keyframes#gambar

12.0% ubahlah warnan/a, misalkan menadi biru muda dg cara klik

pada panel

(olor #gambar 12.6%

c. lik pada bagian Hit9 lik kanan mouse pilih Insert Keyframes#gambar

12.9% ganti kursor menadi 'ectangle ool #'% buat kotak

buur sangkar

berwarna hiau /ang menutupi tulisan #gambar 12.?%

d. !etelah selesai klik tulisan !cene 1 untuk kembali ke la/ar utama


20/37


21/37

1). 7langi langkah 1= untuk opsi awaban pilihan ganda Bsampai E

1. @enggandakan blangko soal dan awaban /ang telah kita buat pada langkah

13 sampai

langkah 1) untuk digandakan di la/er pertan/aan pada ;rame keA- sampai

;rame keA-1.

(aran/a &

a. lik la/er pertan/aan klik ;rame keA2 lik kanan mouse

pilih pada

pilihan cop/ ;rames #lihat gambar 1-.$%


22/37


23/37

b. lik pada ;rame keA-lik kanan mouse pilih pada pilihan Paste

;rames

#lihat gambar 1-.B%

c. 7langi langkah 1.b, tetapi untuk ;rame keA= s.d. ;rame keA-1d. ?ika benar akan dihasilkan -3 soal, tetapi soaln/a semuan/a sama

1H. @engubah !cript pada opsi pilihan awaban $ABA(ADA+ untuk soal nomor 2sampai nomor

-3 agar pada saat diAklik pada awaban tersebut, maka akan menuu keAsoal

berikutn/a.

(aran/a sebagai berikut &

a. lik pada la/er pertan/aan pilih ;rame keA- untuk masuk keAsoal nomor

2b. lik pada opsi awaban $ sehingga akti; #lihat gambar 1H.$% tekan

tombol

ke/board F* untuk masuk ke panel action ubahlah script /ang ada

/aitu dari

goto#n$Play(%)diubah menadigoto#n$Play(&) /ang diubah angkan/a dari angka

-

menadi angka = #lihat gambar 1H.B%. tekan F* lagi untuk menutupn/a


24/37


25/37

c. 7langi langkah 1H.a dan langkah 1H.b, untuk opsi awaban B K ( K D K dan +

#lihat tabel

berikut untuk mempermudah dalam pengeditan script%

Nomor ;rame!oal

NomorPada la/er

pertan/aan

psi awaban !cript!ebelum

!cript!esudah

1

2

-

=

)

H

2

-

=

)

H

$ J B J ( J D A + goto$ndPla/

#-%

$ J B J ( J D A + goto$ndPla/#-%


#-%


#-%


#-%$ J B J ( J D A + goto$ndPla/#-%


#-%

goto$ndPla/ #-%

goto$ndPla/ #=%

goto$ndPla/ #)%

goto$ndPla/ #%

goto$ndPla/ #H%

goto$ndPla/ #%

goto$ndPla/ #*%

*

13

11

12

1-1=

1)

1

1H

1

1*

23

21

22

2-2=

2)

2

2H

2

2*

-3

*

13

11

12

1-

1=1)

1

1H

1

1*

23

21

22

2-

2=2)

2

2H

2

2*

-3

-1

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #13%



$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #1-%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #1=%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #1)%$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #1%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #1H%


$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #1*%




$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #2-%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #2=%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #2)%$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #2%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #2H%


$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #2*%

$ J B J ( J D A + goto$ndPla/ #-% goto$ndPla/ #-3%



?ika pengeditan script benar, maka pada saat kita klik opsi awaban akanmenuu ke

soal berikutn/a.


26/37


27/37


28/37


29/37

c. ekan tombol F* untuk masuk ke panel action

d. ambahkan script '%o3772 #yang hurufnya saya tebalkan% #lihat gambar

23.F%

on 3elea'e"#

!+@74$on

#release%M

!+!7D$6

5

4otoAn!Pla&?"2

G

goto$ndPla/#-%K'%o3772

e. ekan tombol F* lagi untuk menutup panel action

21. 7langi langkah nomor 23 untuk men/elesaikan soal nomor 2 sampai soal nomor

-3.

D. PEMBUATAN HALAMAN UNTUK MENAMPILKAN HASIL TES

22. lik la/er action pilih ;rames keA-2 tekan tombol !&CF

kemudian klik ;rame

keA-= pada la/er background klik kanan mouse dan pilih Insert Keyframes.

4angkah

ini bertuuan untuk menambahkan ;rame mulai ;rame keA-2 sampai ;rame keA-=

2-. lik la/er pertan/aan > klik ;rame keA-2 agar pada ;rame ini /ang akti;

a. ?ika di;rame ini ada tulisan soal no.-3, hapuslah semua soal ini dengan cara

klik dan

delete memakai ke/board.

b. 7bahlah kursor menadi bertanda Text Tool (T) dan atur te5t t/peAn/a

dipanel

properties agar !tatic e5t ukuran huru; 23 warna huru; kuning

c. Buatlah tulisan 'esult o; (hemistr/ est at this (hapter dan dibawahn/a lagi

tulisan

hasil tes kimia untuk bab ini #gambar 21.$%

d. Buatlah tulisan 6umlah soal dan dibawahn/a Number o; Luestions #gambar

21.B%

e. Buatlah tulisan 6awaban Benar dan dibawahn/a (orrect nswer #gambar 21.(%;. Buatlah tulisan Prosentase Benar dan dibawahn/a (orrect Percent #gambar

21.D%

g. Buatlah tulisan -3 butir #gambar 21.+%


30/37

h. 7ntuk membuat gambar 21.F, ubahlah dulu Text Tyenyapada panel properties

agarmenadi D/namic e5t #lihat gambar 21.F.1%, kemudian buatlah kotak dan ketik

angka

133 dan pada kotak isian ar ketikan skor #lihat gambar 21.F.2%.


31/37

i. 7ntuk membuat gambar 21.0, ubahlah dulu e5t /peAn/a pada panel

properties agar

menadi D/namic e5t #lihat gambar 21.0.1%, kemudian buatlah kotak dan

ketik angka

1333, dan pada kotak isian ar ketikan prosentase #lihat gambar 21.0.2%.

2=. lik la/er action pilih ;rame keA2 tekan tombol F* kemudian ketikan

script berikut & #setelah selesai tekan F* lagi untuk menutupn/a%

stop ();

skor=0;

2). lik la/er action pilih ;rame keA- tekan tombol F*

kemudian ketikan

script berikut & stop(); tekan F*. @asih diposisi la/er dan ;rame ini,

kemudian klik

kanan mouse pilih cop/ ;rame

2. lik la/er action pilih ;rame keA= klik kanan mouse pilih

paste ;rame

2H. 7langi langkah 2) ini untuk ;rame keA) sampai ;rame keA-1

2. lik la/er action pilih ;rame keA-2 tekan tombol F* ketikan

script

sebagai berikut &stop ();

prosentase=Math.round((skor/30)*100)+ %;

ekan tombol F* untuk menutupn/a.

E. PEMBUATAN HALAMAN PETUN/UK MEN;ER/AKAN TES

2*. lik la/er pertan/aan klik ;rame keA-- agar ;rame ini /ang akti;

a. ?ika di;rame ini ada tulisan soal no.-3 dst, hapuslah terlebih dahulu


dipanelproperties agar !tatic e5t ukuran huru; -) warna huru; hiau muda

c. Buatlah tulisan Petunuk @engerakan !oal ini #gambar 2*.$%

d. Buatlah tulisan seperti terlihat #gambar 2*.B%

e. Buatlah tulisan Berikutn/a #gambar 2*.(%


32/37


33/37

-3. @asih di la/er pertan/aan pada ;rame keA--, carilah di panelLibrary untuk

tombol gel

Right #gambar 2*.D.1%. klik gambar tersebut dan geser ke stage

sehingga seperti

#gambar 2*.D.2%

-1. lik tombol biar akti;, kemudian tekan tombol ke/board F*, dan masukan script

berikut

on3elea'e"#

4otoAn!Pla&?"2

5

!etelah selesai tekan F* lagi untuk menutupn/a

F. PEMBUATAN HALAMAN IDENTITAS PESERTA TES-2. lik la/er pertan/aan klik ;rame keA-=

a. ?ika di;rame ini ada tulisan soal no.-3 dst, hapuslah terlebih dahulu


dipanel

properties agar !tatic e5t ukuran huru; -) warna huru; putih

c. Buatlah tulisan Data Peserta es #gambar -2.$%

d. Buatlah tulisan seperti terlihat #gambar -2.B%


34/37

e. 7ntuk membuat seperti gambar -2.(, terlebih dahulu lakukan pengaturan

dipanel

properties seperti berikut &


35/37

#1%. e5t t/pe dipilih menadiInut Text#gambar -2.(.1%

#2%. 7kuran huru; 2) dan warna huru; merah #gambar -2.(.-%

#-%. Pada isian ar & ketikan tulisan namasiswa #gambar -2.(.=%

#=%. Pada @a5imum characters & isikan angka -3 #gambar -2.(.)%

#)%. $kti;kan pada !how border around te5t #gambar -2.(.%

#%. Buatlah kotak memakai e5t ool dengan ukuran 1) 5 1,=1 #gambar

-2.(.2%

;. Buatlah seperti gambar -2.D dengan pengaturan hampir mirip langkah-2.e. etapi

/ang berbeda han/a pada ar & ketikan tulisan %ela' dan pada @a5imum

characters

isikan angka =

--. @enambahkan tombol untuk memulai tes, caran/a & @asih di la/er

pertan/aan pada

;rame keA-=, carilah di panelLibraryuntuk tombolgel Right#gambar --.$ %

klik

gambar tersebut dan geser ke stage sehingga seperti #gambar --.B%

-=. Buat tulisan @ulaikemudian klik biar akti; tekan tombol F*

masukan

script berikut &

on3elea'e"#

4otoAn!Pla&:"2

5



36/37

-). @enambahkan tombol petunuk penggunaan dihalaman sampul

seperti

#gambar -=.$%


37/37

a. lik la/er background #astikan $ulu layer ini ti$ak terkunci% klik

;rame keA1

b. 7bahlah kursor menadi bertandaRectangle Tool *, kemudian buat

kotak

berukuran ,) 5 1,) cm dan berikan warna hiau muda

c. Buatlah tulisan Petunuk @engerakan menggunakan e5t ool

dengan warna tulisan merah dan ukuran huru; 1

d. @asukan tombol, caran/a seperti langkah --

e. klik biar akti; tekan tombol F* masukan script

berikut

on3elea'e"#

4otoAn!Pla&??"2 5


Tutorial - TIK Flash Animasi Soal

Documents

Transcript of Tutorial - TIK Flash Animasi Soal