BBDesainBintro openingB B - B GambarB3.6BRancanganBExerciseB

B GambarB3.6BRancanganBExerciseB

3.4.1. BBDesainBintro openingB B

B B B B B B B B GambarB3.6BRancanganBExerciseB B B 3.4.BBDesainBAplikasiB B 3.4.1.BBDesainBintro openingB B

1. Halaman intro opening adalah tampilan awal yang muncul untuk aplikasi ini. Halaman ini berisi judul “Animasi Pengenalan Bagiankbagian Anatgmi Tubuh Manusia Menggunakan Adgbe Flash CS3”, dengan menggunakan motion tween, serta gerakan animasi frame by frame, dan diberi effect bsur yang dipergleh dari insert-timesine-effect-bsur. Serta desain tampilan background

yang menarik yang dipergleh dari perintah import, lalu import to sibrary.

2. Tgmbgl enter yang dipergleh dari perintah windows-common sibraries-button-circse bubse bsue yang diberi perintah pada ActionScript agar tgmbgl enter

yang di import dapat berfungsi. Berikut script yang digunakan. Tgmbgl PLAY

gn(release){

lgadMgvieNum(“intrg.swf”, 0);}

3. Penggunaan musik pada intro opening akan berjalan ketika aplikasi dijalankan dan tgmbgl off yang difungsikan untuk menghentikan musik yang diberi

ActionScript sebagai berikut.B

gn(release){

stgpAllSgunds();}

4. Pada setiap halaman aplikasi terdapat tgmbgl intro dan tgmbgl exit yang diubah menjadi button dan diberi ActionScript sebagai berikut”

Intro: gn(release){ lgadMgvieNum("intrg.swf", 0); } Exit: gn(release){ fscgmmand("quit","true"); } B

5. Simpan dan beri judul intrg.fla dan export ke movie simapn dengan nama yang sama intrg.swf.B

B B B B

3.4.2.BBDesainBhalamanBmenuB B

1. Buka halaman baru dan beri judul menu.fla. Buat background yang dipergleh dari fise- import- import to stage. Atur sesuai dengan ukuran stage, desain tampilan menggunakan Line toos.B

2. Buat sayer judul, buat teks judul “Pengenalan Bagiankbagian Anatgmi Tubuh Manusia” dengan menggunakan Text toos gunakan font Osd Engsish Text MT

dan pilih cosor merah #990000 pada fisters pilh Gradient gsow pilih warna hijau #66FF00 ubah teks menjadi movie, klik kanan frame 1 dan frame 50 kemudian pilih insert Keyframe. Pada frame 1 perkecil teks menggunakan free transform toos .B

3. Buat sayer teks1, pada layer ini buat tiga teks yakni anatgmi, bagiankbagian anatgmi, dan exercise gunakan font Osd Engsish Text MT warna biru #000066 masingkmasing teks ubah menjadi button (Ctrl+F8) .Pada Up gambarkan

rectangse toos dengan warna radias merah #000000, Pada Over beri insert Keyframe ubah warna teks menjadi biru #00FFFF, pada Down perkecil teks menggunakan Free Transform Toos, dan Hit beri insert Keyframe.B

4. buat sayer sine, gambarkan menggunakan Line Toos tepat dibawah masingk masing tgmbgl yang telah diubah menjadi button, pilih Sesection Toos lalu ubah symbgl menjadi Movie csip. Pada insert Keyframe pada frame 1 dan

frame 50 beri motion tween dan import warna Bitmap, pada frame 1 perkecil teks menggunakan Free Transform Toos.

5. Pada setiap halaman aplikasi terdapat tgmbgl intro dan exit yang masingk masing diubah menjadi button dan diberi ActionScript sebagai berikut:

Tgmbgl intro: gn(release){ lgadMgvieNum(“intrg.swf”, 0);} Tgmbgl exit: gn(release){ fscgmmand("quit","true");} B B 3.4.3.BBDesainBhalamanBanatomiB B

1. Buka lembar kerja baru, pilih fsash fise (ActionScript 2.0) simpan dengan nama anatgmi.fla lalu eksport movie simpan dengan nama yang sama.B

2. Pada sayer background, import gambar melalui perintah fise-import-import to stage lalu pilih gambar yang akan dijadikan background. Atur stage dengan ukuran 650 x 550 dari Modify-Document lalu atur width dan height.B

3. Tambahkan sayer dan beri nama judul, pada layer ini ketikan judul “Anatgmi” dengan font Osd Engsish Text MT dengan effect fister beves warna shadow

merah #FF0000 . Tekan Ctrl+F8 lalu ubah teks menjadi Movie csip, klik kanan

frame 1 dan frame 50 kemudian pilih insert Keyframe dan pilih motion tween

diantara frame 1 dan frame 100. Pada frame 1 gerakkan tulisan ke kanan sehingga teks judul akan bergerak ke tengah stage.

4. Pada layer tegri, ketik teks dengan font Osd Engsish Text MT dengan warna #99CC00 tekan Ctrl+F8 pilih Movie csip.BKetikkan teks “videg anatgmi tubuh” tekan Ctrl+F8 pilih button. Pada Up, beri warna teks #09182C dan gambarkan

rectangse dengan Fiss Cosor #99FF00, pada Over ganti warna teks menjadi pink #FF0099, pada Down, gunakan Free Transform Toos untuk memperkecil ukuran teks, dan pilih insert Keyframe pada Hit. Berikan ActionScript pada tgmbgl tekan Ctrl+F9 atau windows-Action dengan script:

gn(release){

nextFrame();}

5. Pada layer background klik kanan pada frame 2 pilih insert keyframe, import video.FLV melalui fise-import-import video, Sesect Video dan browse lalu next

dan pilih progressive downsoad from web server pada pilihan skinning pilih

ArcticOverAss.swf. Terdapat juga tgmbgl csose yang diubah penulis menjadi

button untuk kembali ke halaman sebelumnya. Pada Over gambar csose, diatas gambar ketik teks font Osd Engsish Text MT dengan warna kuning #CCFF00.

B B B B B B B

3.4.4.BBDesainBhalamanBbagian-bagianBanatomiBtubuhB B

1. Buka halaman baru simpan dengan nama gbr_anatgmi.fla lalu export movie

simpan dengan nama gbr_anatgmi.B B

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage. Pada sayer yang sama import to sibrary gambar anatgmi tubuh manusia. Tekan Ctrl+F8 pilih movie csip, insert Keyframe pada frame 1, frame 50, dan frame

100, klik kanan antara frame 1 hingga frame 100 berikan efek motion tween.

Pada frame 50 gerakkan gambar ke kiri, pada frame 100 gerakkan gambar ke bawah agar gambar dapat bergerak berlahanklahan.

3. Buat sayer baru, buat teks yang berkaitan dengan bagiankbagian anatgmi tubuh yang akan dibahas dengan font Osd Engsish Text MT warna hijau #00FF00 , lalu tekan Ctrl+F8 pilih button untuk masingkmasing teks. Pada Up, gambar

rectangse toos dan beri warna Fiss cosor-bitmap-import. Pada Over, ganti warna rectangse dan teks warna abukabu #CCCCCC. Pada down, ganti warna teks menjadi kuning #CCFF00 dengan Fiss Cosor yang sama. Pada Hit pilih

insert Keyframe.

4. Buat sayer menu, buat teks “menu” dengan font Osd Engsish Text MT warna #33CC99 . Tekan Ctrl+F8 pilih button kemudian pada Up, gambar rectangse toos dengan Fiss cosor abukabu #333333. Pada Over, ganti warna teks menjadi

orange #CC3300. Pada Down, pilih Free Transform toos untuk memperkecil teks, dan pilih insertKeyframe pada Hit.

5. Pembahasan pada setiap halaman pengenalan bagian sistem anatgmi, penulis menambahkan beberapa tgmbgl yang dibuat menjadi simbgl dengan pilihan

button, dengan menggunakan ActionScript untuk menjalankan prggram psay

pada tiap materi pengenalan anatgmi tubuh ini. Berikut ActionScript yang digunakan. Tgmbgl next: gn(release){ nextFrame();}. Tgmbgl back: gn(release){ ggtgAndStgp(2);}

keterangan: Angka 2 yang digunakan akan selalu berubah sesuai dengan kebutuhan. Tgmbgl menu: gn(release){ lgadMgvieNum(“intrg.swf”, 0);} Tgmbgl exit: gn(release){ fscgmmand("quit","true");} B B B

3.4.4.1.BDesainBhalamanBsistemBkerangkaBmanusiaB B

1. Buka halaman baru simpan dengan nama kerangka1.fla lalu export movie

simpan dengan nama kerangka1.swf.

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage.

3. Pada sayer judul klik kanan pada frame 1 pilih insert Keyframe. Buat judul dengan “Sistem Kerangka Manusia” dengan font Osd Engsish Text MT warna

Fister gsow dengan warna hijau #669900. Tekan Ctrl+F8 pilih Movie csip, pilih

insert keyframe pada frame 1, frame 5, frame 10, frame 15, frame 30, frame

35, frame 40 dan frame 65 berikan masingkmasing efek bsur yang dipergleh dari insert-Timesine effect-bsur.

4. Pada sayer tegri , buatlah teks dengan mengunakan font Monotype Corsiva plih

insert-new symbos pilih movie csip, pada frame 1 dan frame 50 pilih insert Keyframe. Pada frame 1 pindahkan teks ke bagian atas diluar stage dan perkecil ukuran teks menggunkan Free Transform toos pada frame 50 berikan

ActionScript: Stop(); agar animasi berhenti pada frame 50. Pada frame ini terdapat juga berupa teks atau petunjuk untuk mengarahkan kursgr pada setiap gambar. Teks diubah menjadi movie csip, pada frame 1 dan frame 50 klik kanan, pilih insert keyframe lalu klik kanan pilih motion tween dan frame 1 arahkan gambar ke kiri.

5. Pilih insert keyframe pada frame 2 layer yang sama buat judul “Gelang Bahu” menggunakan font Osd Engsish Text MT warna merah #FF0000. Buat tegri dengan font Monotype Corsiva warna kuning #FFFF00 dan biru #99FFFF tekan Ctrl+F8 pilih movie csip. Pada frame 1 dan frame 50 pilih insert keyframe dan berikan efek motion tween. Frame 1 perkecil teks menggunakan

Free Transform toos. Kemudian import gambar gelang bahu ke sibrary lalu

drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over

dan perbesar gambar menggunakan Free Transform toos berfungsi agar ketika

user mengarahkan kursgr pada gambar maka gambar tampak lebih jelas.

6. Pada layer yang sama pada frame 3 pilih insert keyframe buat judul “Sendi Lutut” menggunakan font Osd Engsish Text MT dengan warna merah #FF0000 lalu ubah menjadi movie csip. Buat tegri dengan font Monotype Corsiva dengan warna biru #00CCFF tekan Ctrl+F8 pilih movie csip. Pada

frame 1 dan frame 50 pilih insert keyframe dan berikan efek motion tween.

Frame 1 perkecil teks menggunakan Free Transform toos. Kemudian import

gambar sendi lutut ke sibrary lalu drag ke dalam stage dan ubah menjadi

button, pilih insert keyframe pada Over dan perbesar gambar menggunakan

Free Transform toos .

B B B B B B

3.4.4.2.BBDesainBhalamanBsistemBototB

1. Buka halaman baru simpan dengan nama sistem gtgt.fla lalu export movie

simpan dengan nama sistem gtgt.swf.

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage.

3. Pada sayer judul klik kanan pada frame 1 pilih insert Keyframe. Buat judul dengan “Sistem Otgt” dengan font Osd Engsish Text MT warna hijau #99FF00 ditambah efek gradient gsow. Tekan Ctrl+F8 pilih Movie csip, pilih insert keyframe pada frame 1, frame 25, frame 50. Pada frame 50 ubah cosor properties dengan cosor tint #FF00CC, diantara frame 1 dan 50 create motion tween.B

4. Pada sayer tegri , buatlah teks dengan mengunakan font Monotype Corsiva pilih

insert-new symbos pilih movie csip, pada frame 1 dan frame 50 pilih insert Keyframe. pada frame 1 dan frame 50 klik kanan, pilih insert keyframe lalu klik kanan pilih motion tween. Pada frame 1 pindahkan teks ke bagian atas diluar stage dan pilih cosor tint biru #00FFFF pada frame 50 dengan cosor tint

biru #00CCCC berikan ActionScript: Stop(); agar animasi berhenti pada frame

50. Teks diubah menjadi movie csip. Kemudian import gambar gtgt punggung sejati ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih

insert keyframe pada Over dan perbesar gambar menggunakan Free Transform toos .

3.4.4.3.BBDesainBhalamanBsistemBperedaranBdarahB B

1. Buka halaman baru simpan dengan nama sistem peredaran darah.fla lalu

export movie simpan dengan nama sistem peredaran darah.swf.B B

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage.

3. Pada sayer judul klik kanan pada frame 1 pilih insert Keyframe. Buat judul dengan “Sistem Peredaran Darah” dengan font Osd Engsish Text MT warna merah #FF0000. Tekan Ctrl+F8 pilih Graphic, pilih insert keyframe pada

frame 1, frame 10, frame 20, frame 25, frame 40. Pada frame 40 ubah cosor properties dengan cosor tint #FF6600 diantara frame 1 dan 40 create motion tween.B

4. Buat layer tegri, Buat teks dengan font Monotype Corsiva warna biru #00FFFF dan tekan Ctrl+F8 pilih movie csip. Pada frame 1 dan frame 50 pilih insert keyframe dan berikan efek motion tween. Frame 1 perkecil teks menggunakan

Free Transform toos. Kemudian import gambar jantung ke sibrary lalu drag

ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar menggunakan Free Transform toos berfungsi agar ketika user

mengarahkan kursgr pada gambar maka gambar tampak lebih jelas.

5. Pada frame 2 pilih insert Keyframe, import gambar jantung dengan bagiank bagiannya ke sibrary dari perintah fise-import-import to sibrary pilih gambar lalu Ok, tekan Ctrl+F8 ubah gambar menjadi symbos button. Pada Up pilih

insert keyframe dan pada Over perbesar gambar menggunakan Free Transform toos sehingga user dapat melihat gambar dengan jelas.

3.4.4.4.BBDesainBhalamanBsistemBpernapasanB B

1. Buka halaman baru simpan dengan nama sistem pernapasan.fla lalu export movie simpan dengan nama sistem pernapasan.swf.

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage.

3. Pada sayer judul. Buat judul dengan “Sistem Pernapasan” dengan font Osd Engsish Text MT warna biru #3300CC. Tekan Ctrl+F8 pilih Movie csip, pilih

insertkeyframe pada frame 1, frame 15, frame 30,. Pada frame 1 ubah cosor properties dengan dan tambahkan efek glgw berwarna merah #FF0000 dan diantara frame 1 dan 30 create motiontween.B

4. Buat layer tegri, Buat teks dengan font Osd Engsish Text MT warna putih #FFFFFF dan tambahkan efek glgw dengan cglgr #9900CC dan tekan Ctrl+F8 pilih movie csip. Pada frame 1 dan frame 50 pilih insertkeyframe dan berikan efek motion tween. Frame 1 pindahkan teks ke bagian bawah. Demikian dengan teks2 tekan Ctrl+F8 beri warna teks kuning #CCFF00. Kemudian

import gambar parukparu ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar

menggunakan Free Transform toos berfungsi agar ketika user mengarahkan kursgr pada gambar maka gambar tampak lebih jelas.

5. Tambahkan tgmbgl back dan next yang di import dari windows-common sibraries-button-csassic buttons-key buttons lalu drag ke stage dan berikan

ActionScript pada masingkmasing tgmbgl.

3.4.4.5.BBDesainBhalamanBsistemBinderaB B

1. Buka halaman baru simpan dengan nama sistem indera.fla lalu export movie

simpan dengan nama sistem indera.swf.

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage.

3. Pada sayer judul. Buat judul dengan “Sistem Indera” dengan font Osd Engsish Text MT warna #9900CC dan tambahkan fister gradient gsow. Tekan Ctrl+F8 pilih Movie csip, pilih insert keyframe pada frame 1, frame 10, frame 25, dan

frame 40,. Pada frame 1 perkecil teks menggunakan Free Transform Toos dan tambahkan cosortint biru #339999 pada properties . B

4. Buat layer baru ganti dengan teks1, Buat teks dengan judul “Alat Penglihatan” dengan font Osd Engsish Text MT dengan warna merah #FF3333 tambahkan efek gsow pada fisters warna #CCFF00 dengan bsur X dan Y =5. Tambahkan tegri menggunakan font yang sama ganti warna menjadi #330066 ubah teks menjadi movie csip, pilih insert keyframe pada frame 1 dan frame 50, klik

kanan pada timesine lalu create motion tween diantara frame 1 dan frame 50. Pada frame 1 pindahkan teks ke kanan bawah stage dan frame 50 ganti warna teks menjadi #00FF00 menggunakan efek cosor tint dengan tint amount 82%.

5. Demikian halnya dengan teks 2 bagian tegri, gambar dipindahkan ke arah yang berlawanan dengan perubahan warna saat animasi dijalankan agar tampak lebih menarik. Kemudian import gambar mata ke sibrary lalu drag ke dalam

stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar menggunakan Free Transform toos berfungsi agar ketika user

mengarahkan kursgr pada gambar maka gambar tampak lebih jelas.

6. Untuk desain halaman alat pendengaran atau telinga , klik kanan pada frame 2 layer background pilih insert keyframe, lalu buat teks judul “Alat Pendengaran” dengan font Osd Engsish Text MT dengan warna merah #FF3333 tambahkan efek gradient gsow dengan bsur X dan Y 5. Tambahkan tegri menggunakan font yang sama ganti warna menjadi merah #CC0066 dengan efek gradient gsow. Ubah teks menjadi movie csip, pilih insert keyframe pada

frame 1 dan frame 50, klik kanan pada timesine lalu create motion tween

diantara frame 1 dan frame 50. Pada frame 1 pindahkan teks ke kanan bawah

stage. Tambahkan teks 2 bagian tegri ubah menjadi movie csip ganti warna teks #FFFF00 dan efek gradient gsow. Pilih insert keyframe pada frame 1 dan

frame 50 diantara frame 1 dan frame 50 create motion tween Pada frame 1 pindahkan teks ke atas di luar stage lalu perkecil teks menggunakan Free Transform toos. Kemudian import gambar telinga ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan

perbesar gambar menggunakan Free Transform toos berfungsi agar ketika user

mengarahkan kursgr pada gambar maka gambar tampak lebih jelas. Tekan

Ctrs+Enter untuk menjalankan animasi.

7. Untuk halaman indera peraba, pada layer background klik kanan pilih insert keyframe pada frame 3. Buat judul ”Indera Peraba” gunakan font Osd Engsish Text MT dengan warna merah #FF0000 tambahkan efek fisters gsow lalu tambahkan warna hijau #99FF00. Ubah teks ke symbos menjadi movie csip. Pilih insert keyframe pada frame 1 dan frame 50. Pada frame 1 ganti cosor aspha 0% pada properties dan frame 50 berikan ActionScript agar animasi teks berhenti. Blgk frame 1 hingga frame 50, lalu pilih motion tween pada properties.

Kemudian import gambar kulit ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar menggunakan Free Transform toos berfungsi agar ketika user mengarahkan kursgr pada gambar maka gambar tampak lebih jelas. Setelah diubah ke button

gambar kembali diubah menjadi symbos movie csip untuk memberikan efek animasi. Pada frame 1 ganti cosor aspha 0% pada properties dan frame 50 berikan ActionScript agar animasi teks berhenti. Blgk frame 1 hingga frame

50, lalu pilih motion tween pada properties.

8. Desain halaman indera pembau, klik kanan pilih insert Keyframe pada frame 4 layer yang sama. Buat judul “Indera pembau / hidung ” dengan font Osd Engsish Text MT dengan warna merah #FF0033 kemudian ubah ke symbos

Osd Engsish Text MT warna hijau #99FF33 tekan Ctrl+F9 pilih movie csip. Diantara frame 1 hingga frame 50 klik kanan tekan F6 berikan efek motion tween. Pada frame 1 perkecil teks menggunakan Free Transform Toos.

Kemudian import gambar hidung ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar menggunakan Free Transform toos berfungsi agar ketika user mengarahkan kursgr pada gambar maka gambar tampak lebih jelas. Setelah diubah ke button

50, lalu pilih motion tween pada properties.

9. Desain halaman indera pengecap atau lidah. Pilih Insert Keyframe pada frame 4 buat judul “Indera Pengecap / lidah” dengan font Osd Engsish Text MT warna hijau #99FF33 tambahkan efek gsow warna merah #CC0000 tekan Ctrl+F9 pilih movie csip. Tambahkan tegri mengenai indera pengecap dengan font Osd Engsish Text MT warna #FFCC00 tekan Ctrl+F9 pilih movie csip. Diantara

frame 1 hingga frame 50 klik kanan tekan F6 berikan efek motion tween. Pada

frame 1 perkecil teks menggunakan Free Transform Toos kemudian pindahkan teks ke atas diluar stage.

Kemudian import gambar lidah ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar menggunakan Free Transform toos berfungsi agar ketika user mengarahkan kursgr pada gambar maka gambar tampak lebih jelas. Setelah diubah ke button

animasi. Pada frame 1 dan frame 45 pilih insert Keyframe, pada frame 1 perkecil gambar menggunakan Free Transform Toos, lalu klik kanan diantara

frame 1 dan frame 45 create motion tween.

3.4.4.6.BBDesainBhalamanBsistemBpencernaanB B

1. Buka halaman baru simpan dengan nama sistem pencernaan.fla lalu export movie simpan dengan nama sistem pencernaan.swf.

2. Pada sayer background, import gambar pada stage yang dipergleh dari perintah fise-import-import to stage ukuran gambar diatur sesuai dengan stage.

3. Tambahkan layer, buat judul “Sistem Pencernaan” dengan font Osd Engsish Text MT warna merah #FF0000 tambahkan efek gsow #00CCFF. Tekan Ctrl+F8 pilih Movie csip dengan animasi effect bsur dengan perubahan warna pada tint cosor.

4. Buat layer teks, buat judul “Rgngga Mulut” yang merupakan bagian dari sistem pencernaan dengan font Osd Engsish Text MT warna merah #FF0000. Tambahkan teks 2 yang merupakan pembahasan dari rgngga mulut dengan

font Osd Engsish Text MT warna hijau # FF0099. Tekan Ctrl+F8 pilih Movie csip.Insert Keyframe pada frame 1 dan frame 50 create motion tween diantara

frame tersebut. Pada frame 50 gunakan ActionSript Stgp(); Kemudian import

gambar mulut ke sibrary lalu drag ke dalam stage dan ubah menjadi button, pilih insert keyframe pada Over dan perbesar gambar menggunakan Free

Transform toos berfungsi agar ketika user mengarahkan kursgr pada gambar akan lebih besar.

Dalam dokumen Animasi Pengenalan Anatomi Tubuh Manusia Menggunakan Adobe Flash CS3 (Halaman 21-46)