pengenalan dan pengoperasian scanner untuk … · web viewgambar 1.1 tampilan interface macromedia...

60
Macromedia Flash Kompetensi Animation 2 Dimention Latihan Satu (1) Sub Kompetensi Pengenalan dan Pengoperasian software Macromedia flash Mx Tujuan dan Sasaran Siswa dapat mengenal dan mengoprasikan software Macromedia Flash Pendahuluan Macromedia flash Mx merupakan standart profesional pembuatan animasi atau web yang sudah teruji kehandalannya. Pembahasan Pengenalan interface macromedia flash Mx Gambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface dalam macromedia 8. Interface- interface tersebut nantinya akan banyak membantu anda mengatur atau mengedit objek animasi yang digunakan. SMK Islamic Village Faridi,S.kom 1 Toolbox Stage Timeline Panel

Upload: trinhnhan

Post on 26-Apr-2019

249 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Satu (1)Sub Kompetensi

Pengenalan dan Pengoperasian software Macromedia flash Mx

Tujuan dan Sasaran

Siswa dapat mengenal dan mengoprasikan software Macromedia Flash

PendahuluanMacromedia flash Mx merupakan standart profesional pembuatan

animasi atau web yang sudah teruji kehandalannya. Pembahasan

Pengenalan interface macromedia flash Mx

Gambar 1.1 Tampilan interface macromedia flash Mx

Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface dalam macromedia 8. Interface-interface tersebut nantinya akan banyak membantu anda mengatur atau mengedit objek animasi yang digunakan.

Salah satu bagian terpenting dalam interface macromedia flash Mx salah satunya adalah drawing tools berguna untuk membuat dan memanipulasi gambar atau objek. Drawing tools dibagi menjadi 4 bagian yaitu : tools, view, colors dan options.

SMK Islamic Village Faridi,S.kom

1

Toolbox Stage Timeline Panel

Page 2: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Tools

Tool berfungsi untuk mengatur atau mengedit objek atau animasi yang sedang kita buat. Tool ini juga adalah salah satu bagian terpenting dalam macromedia flash Mx yang berguna mengedit atau memanipulasi gambar objek.

Gambar 1.2 Toolbox

Keterangan Tool Box

Arrow ToolDigunakan untuk memilih objek. Dengan sebuah klik berarti kita memilih objek tersebut, dengan klik ganda kita berarti kita memilih objek dan seluruh komponen yang dimilikinya. Dengan menDrag Arrow Tool kita dapat membuat sebuah area persegi yang akan mengaktifkan memlilih atas semua yang ada didalamnya.Subselect ToolDigunakan untuk memodifikasi suatu garis yang dibuat dengan pen

tool.Free Transform ToolDigunakan untuk memodifikasi bentuk dari suatu objek.

SMK Islamic Village Faridi,S.kom

2

Arrow Tool Free Transform Tool

Line Tool Pen Tool

Oval ToolPencil Tool

Ink Bottle ToolEyedropper Tool

Hand Tool

Stroke FillFill Color

Default ColorOption Panel

Subselect ToolGradient Transform ToolLasso ToolText ToolRectangle ToolBrush ToolPaint Bucket ToolErase Tool

Zoom Tool

No Color

Swap Tools

Page 3: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Fill Transform ToolDigunakan untuk memodifikasi bentuk dan posisi dari gradient fills.Line Tool Merupakan alat untuk membuat garis. Bila kita membuat garis sambil menekan tombol Shift, maka akan terbentuk garis yang tepat horizontal, vertical, atau miring 450.Lasso Tool Digunakan untuk memilih suatu area secara tidak teratur. Semua yang termasuk areanya akan terpilih.Pen Tool Merupakan tool untuk membuat kurva-kurva atau bentuk bebas.Text Tool Digunakan untuk membuat text box yang daapt kita isi dengan berbagai tulisan.Oval Tool Adalah tool untuk membuat objek elips (oval). Untuk menggambar lingkaran, pengunakan tool ini sambil menekan tombol Shift.Rectangle ToolDigunakan untuk membuat bentuk persegi. Bila kita ingin membuat bentuk bujur sangkar secara sempurna, gunakan tool ini sambil menekan ShiftPencil Tool Merupakan alat untuk membuat garis. Bila kita membuat garis sambil menekan tombol shift, maka akan terbentuk garis yang tepat horizontal, vertical, miring, atau miring 450.Brus Tool Digunakan untuk menggambar dengan kuas secara bebas, tool ini mempunyai beberapa pilihan untuk mengontrol berbagai efek dari sapuan kuas kita. Ink Bottle Tool Digunakan untuk mewarnai suatu garisPaint Bucket Tool Digunakan untuk memodifikasi warna dan gradasi warna didalam suatu objek.

SMK Islamic Village Faridi,S.kom

3

Page 4: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Eyedropper Tool Digunakan untuk mengambil warna yang berasal dari suatu objek distage sehingga kita bisa menyamakan warna ketika menggambar. Eraser Tool Digunakan untuk menghapus suatu gambar.

View

bagian view menyiapkan 2 tool pilihan, yaitu tool hand, tool zoom. Tool hand bisa digunakan untuk menggulung stage disegala arah seolah oleh anda menggunakan scroller 360 derajet, sedangkan tool zoom digunakan untuk memperbesar atau memperkecil tampilan objek.

Gambar 1.3 View

Colors

Bagian colors menyediakan tool untuk memodifikasi warna pada garis (stroke color), isi objek (fill objek), dan text.

Gambar 1.4 Colors

0ption

Bagian option menyediakan tool setting yang menyertai tool yang sedang aktif, misalnya jika mengklik tool rectangle, pada bagian option SMK Islamic Village Faridi,S.kom

4

Tool Hand

Tool Zoom

Stroke colorFill objek

Page 5: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

akan memperlihatkan tool round rectangle radius yang merupakan tool setting yang berguna untuk mengatur sudut-sudut kotak yang dibuat dengan tool rectangle.

Gambar 1.5 Option

Stage

Stage adalah area tempat kita bekerja dan membuat objek atau animasi. Ibarat kita seorang pelukis, stage adalah kertas gambarnya.

Gambar 1.6 Stage

Timeline

Untuk mengilustrasikan berjalannya animasi dari waktu ke waktu, macromedia flash Mx menggunakan timeline (waktu). Beberapa hal yang perlu diketahui berkaitan dengan penggunaan timeline adalah frame, keyframe, dan layer.

Gambar 1.7 TimelinePanel

Panel merupakan kotak dialog yang berguna untuk melihat, mengatur dan mengubah elemen-elemen atau objek-objek didalam SMK Islamic Village Faridi,S.kom

5

Stage

Page 6: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

macromedia flash Mx. Dalam panel terdapat pilihan-pilihan control, fungsi, symbol, warna, teks, frame,dan elemen-elemen lain sesuai dengan panel yang

gunakan. Dengan panel, pembuatan animasi akan menjadi lebih jelas dan cepat dibandingkan

dengan penggunaan menu yang bertumpuk.

Kompetensi Animation 2 Dimention Latihan Kedua(2)Sub Kompetensi

Dasar Animasi ( Pengenalan fungsi Tweening (motion & shape), frame by frame animation )

Tujuan dan Sasaran

Siswa dapat membuat animasi dengan mengunakan tween :shape dan motion

Pendahuluan

Animasi adalah perpindahan objek dari satu tempat, ketempat lain dan bayaknya gerak dan berulang-ulang disebut movie clip. Bagaimana cara kerja animasi dalam software macromedia flash Mx?

Kini sudah saatnya kita memasuki inti dari macromedia flash Mx, yaitu animasi. Pronsipnya anda dapat membuat sebuah animasi dengan mengubah isi dari setiap frame yang berurutan. Bayangkanlah kumpulan frame-frame yang berurutan itu sebagai sebuah gulungan rol film. Anda pasti sudah mengerti bahwa sebuah gulungan film terdiri dari berbagai gambar yang terputus-putus dan saling berhubungan. Anggap saja setiap frame dalam macromedia flash Mx berisi gambar-gambar yang saling berhungan itu sehingga bila anda menekan tombol play, maka akan terbentuklah sebuah gambar yang bergerak dan itulah yang akan kita sebut dengan animasi. Dengan macromedia flash Mx, anda didukung untuk menciptakan animasi berikut seperti : membuat animasi kartun, iklan, baner dan lain-lain.

Pembahasan

Mengenal Interface Timeline

SMK Islamic Village Faridi,S.kom

6

1 2 3 4 5 6 7 8 9

1011

12

1314

Page 7: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 2.1 Interface TimelineKet :

1. Insert Layer2. Insert Layer Folder 3. Add Motion Guide4. Delete layer5. Center frame6. Onion Skin Outlines7. Curren Frame8. Frame Rate9. Elapsed Time10. Tweened Animation11. Frame-by-frame animation12. Frame View pop up menu13. Timeline Header14. Playhead

Memahami Konsep Timeline Dan Frame

Timeline adalah waktu seperti penggaris biasa, dimana setiap penggaris dibagi dalam satuan panjang yang sama, misalnya tiap satu cm, dalam timeline, ruas yang terbagi iitu disebut frame. bisa dikatakan timeline merupakan kumpulan dari frame-frame. KeyFrame adalah sebuah frame dimana anda mendefinisikan suatu perubahan didalam animasi, misalkan kita harus letakkan keyFrame pada suatu frame yang anda kehendaki untuk menandakan awal gerak suatu objek. Prinsipnya, flash akan menyimpan bentuk dari suatu objek pada setiap keyframe hingga anda harus menciptakan keyframe hanya pada tempat- tempat dimana kita melakukan suatu perubahan pada objek.

SMK Islamic Village Faridi,S.kom

7

Page 8: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

keyFrame diindikasikan dalam timeline sebagai lingkaran hitam kecil berwarna hitam bial mengandung isi dan sebagai sebuah lingkaran berlubang bila kita mengandung isi.

Mengatur Frame Rate Frame rate adalah kecepatan suatu animasi dimainkan satuan

frame perdetik(fps). Standart kecepatan dalam flash adalah 24 fps. Sedangkan pada aplikasi web seperti Time dan AVI Movies pada umumnya mempunyai kecepatan 12 fps. Biasanya kecepatan 12 ini akan memberikan hasil terbaik diweb. Frame rate yang terlalu pelan akan menyebabkan akan animasi akan terpatah-patah dan bila frame rate terlalu cepat mengaburkan details animasi. Langkah untuk mengubah frame rate dengan memilih modify Document atau dengan mengklik tombol size yang ada pada properties. Ubahlah nilai fps pada tag frame rate. Perintah ini juga dapat anda gunakan sebagai pengaturan stage.

Gambar 2.2 Mengubah frame rate lewat dokumen properties

Ada 2 tween pada macromedia flash Mx yaitu :1. Motion tween diindikasikan sebagai sebagai lingkaran hitam pada

awal, dilanjutkan dengan anak panah menuju keyframe akhir dengan latar belakang biru terang.Perintah yang digunakan adalah klik kanan > create motion tween diantara frame yang akan digerakan.

SMK Islamic Village Faridi,S.kom

8

Page 9: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 2.3 motion tween

Gambar 2.4 motion tween yang tidak lengkapGaris putus-putus menandakan objek belum terGroupKet :

“motion tween hanya dapat digunakan untuk objek yang tergroup”

2. Shape tween diindikasikan sama seperti motion tween. Tetapi latar belakang hijau terang.

Gambar 2.5 Shape tween

Gambar 2.6 Shape tween yang tidak lengkap

Garis putus-putus menandakan salah satu objek terGroupKet : “shape tween hanya dapat digunakan pada objek yang tidak tergroup”Fasilitas lain yang ditawarkan oleh motion tween untuk mengendalikan animasi.

Merotasi dan merubah ukuran objek Dengan motion tween anda dapat memutar sebuah objek pada

porosnya. Bukalah sebuah property inspector, pilih menu Windows

Properties. Kliklah frame yang mengandung motion tween/shape. Maka pada property inspector akan tampil sebagai berikut :

Gambar 2.7 Properties

Pilihlah rotate dengan meng-klik pull down menu ( segi hitam terbalik ) dan klik diantara pilihan yang diberikan :

SMK Islamic Village Faridi,S.kom

9

Page 10: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

None, berarti anda tidak menerapkan efek rotasi motion tween anda.

Auto, merupakan pilihan untuk memutar objek sesuai arah gerak animasi selama satu kali putaran.

CW, singkatan dari clockwise, rotasi searah jarum jam. Jangan lupa untuk menentukan beberapa kali putaran yang dilakukan objek dengan mengisi tag times.

CCW, counter clockwise, berlawanan dengan arah jarum jam, merupakan efek kebalikan dari CW.

Mengatur akselerasi dari gerakan animasi dengan mengubah nilai dari tag Ease pada property inspector, nilai 0 berarti gerakan animasi anda tidak terakselerasi, ubahlah sesuai dengan keinginan anda dengan ketentuan sebagai berikut :

Nilai 1 – 100 menyebabkan gerakan animasi dimulai dengan cepat kemudian berangsur-angsur melambat.

Nilai -1 – (-100) membuat animasi anda dimulai dari lambat kemudian semakin cepat.

Efek lain yang ditawarkan Motion tween adalah mengubah ukuran akhir dari suatu objek bergerak. Mungkin anda ingin memperbesar/memperkecilnya objek diawal/diakhir frame dengan mengunakan Free Transform Tool kemudian pilih Scale pada option pane dan drag kotak hitam disekitar objek untuk mengubah ukurannya.

Motion TweenMembuat bola pantulLangkah-langkah

1. Bukalah software Mac. Flash 8.Klik menu start > program > macomedia > Macromedia flash Mx

2. Siapkanlah stage ukuran default/standar yaitu 550 x 400 dengan backgaround putih.

3. Pada layer 1, Frame 1, Buatlah sebuah bola dengan mengunakan tool oval

SMK Islamic Village Faridi,S.kom

10

Page 11: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Caranya : klik tahan geser pada posisi atas stage, dengan dimenekan tombol shift agar bulatan menjadi seimbang. Berilah warna gradient yang sesuai. Lalu Grouplah objek dengan cara: pilihlah/seleksi objek klik menu modify > Group atau dengan menekan Ctrl + G.

Gambar 2.8 Bola3. Pada frame 5, klik kanan > Insert Keyframe > lalu pindahkanlah

posisi objek bola kebawah stage.4. Diantara frame 1 dan 5 klik kanan > Create Motion Tween 5. Pada frame 10, klik kanan > insert keyframe > Lalu pindahkan

kembali objek bola keatas.6. Diantara frame 5 dan 10 klik kanan > Create Motion Tween 7. Simpan file dengan menekan tombol Ctrl + S atau dengan

mengklik menu file save dan beri nama : latihan tween8. Untuk tes movie. Klik menu Control > Test Movie atau dengan

menekan tombol kombinasi CTRL+Enter

Shape tweenMembuat perubahan bentuk objek Langkah-langkah

1. Bukalah software Mac. Flash 8.Klik menu start > program > macomedia > Macromedia flash Mx

2. Siapkanlah stage dengan ukuran default/standar 550 x 400 dengan warna background putih

3. Pada layer 1, Frame 1, Buatlah sebuah bola dengan mengunakan tool oval Caranya : klik tahan geser pada posisi atas stage, dengan dimenekan tombol shift agar bulatan menjadi seimbang. Berilah warna gradient yang sesuai.

SMK Islamic Village Faridi,S.kom

11

Page 12: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 2.9 Bola3. Pada frame 5, klik kanan > Insert Blank Keyframe > buatlah

objek persegi dengan mengunakan Ractangle tool

Gambar 2.10 Bola4. klik Diantara frame 1 dan 5, bukalah properties > pada pilihan

tween > pilihlah shape5. Untuk tes movie. Klik menu Control > Test Movie atau dengan

menekan tombol kombinasi CTRL+Enter

Kompetensi Animation 2 Dimention Latihan Ketiga(3)Sub Kompetensi

Lebih jauh tentang Animasi ( Pengenalan Motion Guide )

Tujuan dan Sasaran

Siswa dapat membuat animasi yang lebih menarik dengan menggunakan motion guide sebagai jalur animasi

PendahuluanApakah motion guide itu?

Anda mungkin bertanya, “Apakah hanya gerakan yang lurus saja yang dapat dilakukan dalam motion tween? Bagaimana bila ingin membut sebuah mobil yang bergerak bolak-balik? Jawabannya, ya tentu saja, tidak.

Dalam menggapai pertanyaan seperti tadi, flash menjawabnya dengan Motion Tween atau bisa dikatakan sebagai pemandu atau sebagai jalur gerak. Anggap saja motion guide ini seperti rel kereta api yang memaksa kereta untuk bergerak sesuai dengan alur rel itu. Jalur gerak ini dibuat didalam sebuah layer yang berad diatas layer yang berisi animasi Motion Tween yang akan dipandu.Pembahasan Membuat Guide layer ada beberapa cara untuk membuat motion guide layer, yaitu :

SMK Islamic Village Faridi,S.kom

12

Page 13: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

1. klik sebuah layer yang mengandung animasi kemudian pilih insert Motion Guide.

2. Klik kanan sebuah layer yang mengandung animasi kemudian pilih add Motion Guide.

3. klik icon add a Motion Guide pada layer area.

Gambar 3.1 Add a motion guideLatihan.! membuat animasi dengan Motion Guide

1. Siapkanlah stage ukuran standar/default 550 x 400 dengan warna background putih.

2. Buatlah sebuah objek mobil

Gambar 3.2 Mobil3. Grouplah objek yang telah anda buat 4. Rubahlah nama layer 1 dengan “ mobil ” , berilah animasi pada

objek mobil dari kiri ke kanan.5. Pada frame 10 layer mobil, klik kanan insert Keyframe, lalu

pindahkan mobil kekanan.6. Pada frame 1 – 10 klik kanan Create Motion Tween.7. Buatlah layer yang berisikan guide untuk mobil, Pilih menu Insert

Motion Guide atau dengan memilih icon .Layer guide akan muncul diatas layer mobil.

8. Dengan Menggunakan Pencil Tool buat motion path dilayer Guide : mobil, yaitu kurva yang nantinya menjadi arah mobil

SMK Islamic Village Faridi,S.kom

13

Page 14: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 3.3 Posisi path pada layer guide9. Pada layer Mobil, Frame 1. Pindahkanlah objek ke posisi ujung

awal path. Aktifkanlah snap dan orient to path ( View Snap to objek atau dengan memberi ceklis pada kotak snap dan orient to path diproperties ) untuk memudahakan memindahkan objek mobil ke ujung awal path dan objek akan mengikuti path.

SMK Islamic Village Faridi,S.kom

14

Icon Guide Layer Guide

Path untuk mobil

Posisi mobil diujung awal path

Page 15: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 3.4 Posisi mobil pada awal path

10. Pada layer mobil, frame 10 pindahkan objek mobil ke ujung path

Gambar 3.5 Posisi mobil pada ujung path

11. Simpan file dengan mekan Ctrl + S atau klik menu File Save dan beri nama : latian guide motion

12. Lakukan test movie dengan mengklik menu Control Test Movie atau Ctrl + Enter.

SMK Islamic Village Faridi,S.kom

15

Terdapat lingkaran kecil hitam. Geser objek mobil sehingga lingkaran kecil tepat ada diujung path

Posisi objek mobil diujung path

Page 16: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Animasi motion guide adalah animasi yang mempunyai gerakan sesuai denganjalur yang kita buat. Animasi ini merupakan lanjutan dari animasi motion tween.Animasi ini sangat cocok digunakan untuk jenis animasi yang membutuhkanketelitian dalam pergerakan yang dikehendaki atau sesuai keinginan pembuatanimasi.

Membuat animasi motion guide

Di bawah ini akan ditunjukkanproses pembuatan animasi motion guide :

1. Buka file baru atau Ctrl+N

2. Kemudian kita pilih Oval tool (O) pada toolbox dan kita mulai membuatobjek lingkaran pada stage dengan mengklik dan drag, jangan lupa warnafiil objek balok harus berbeda dari warna background stage.

SMK Islamic Village Faridi,S.kom

16

Page 17: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

3. Kemudian klik kanan di frame ke-1, pilih Create motion tween

4. Pada frame ke-10 klik kanan kita pilih Keyframe,, kemudian kitageser lingkaran ke kanan sehingga tampak seperti pada

gambar5. Kemudian klik kanan layer 1 kemudian pilih Add Motion

Guidemaka akan muncul layer baru seperti tampak pada gambar.

6. Kemudian dengan layer guide masih terseleksi kita pilih Pencil Tool untukmembuat jalur yang akan menjadi lintasan animasi dari

lingkaran.

7. Agar objek lingkaran dapat bergerak sesuai jalur, maka tengah objekharuslah berada di tengah jalur.

SMK Islamic Village Faridi,S.kom

17

Page 18: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

8. Oleh karena itu, klik frame 1 layer 1, Kemudian pilih Free TransformTool agar bulatan tengah objek terlihat. Kemudian pindahkan objeksampai lingkaran tengah objek berada di ujung awal jalur.

9. Kemudian klik frame 40 layer 1, Kemudian pilih Free Transform Toolagar bulatan tengah objek terlihat. Kemudian pindahkan objek sampailingkaran tengah objek berada di ujung akhir jalur.

10. Kemudian tekan Enter untuk melihat hasilnya

Catatan : dalam Motion Guide, tengah objek harus berada di tengah (jalur).

SMK Islamic Village Faridi,S.kom

18

Page 19: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Keempat(4)

Sub Kompetensi

Lebih jauh tentang Animasi ( Pengenalan Mask Layer)

Tujuan dan Sasaran

Mengenal Lebih Penggunaan Mask untuk beberapa contoh animasi.

Pendahuluan Mask yang artinya adalah menutup mempunyai fungsi sesuai

namanya, yaitu untuk menetupi suatu layer. Mask dapat diterapkan kepada suau layer dan layer yang sudah dikenai mask berfungsi untuk menutupi layer dibawahnya.

Gambar 4.1 Contoh layer maskPembahasaan Latihan membuat Spotlight SMK IBG

1. Siapkanlah stage ukuran default/standar yaitu 550 x 400 dengan warna background putih.

2. Pada layer 1, frame 1, katikan sebuah text ALCoB dengan mengunakan Text tool berilah warna hitam, letakan posisi text di tengah-tengah stage. Pilih text ALCoB lalu klik kanan

Copy.

Gambar 4.2 Text ALCoB

3. Buatlah layer baru yaitu layer 2. Pada layer 2 klik kanan Paste in Place (akan menempatkan objek pada posisi semula) rubahlah warna text ALCoB menjadi hijau.

SMK Islamic Village Faridi,S.kom

19

layer mask

Page 20: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 4.3 Text ALCoB

4. Buatlah layer baru yaitu layer 3. Buatlah sebuah kotak kecil disamping text ALCoB, Grouplah objek kotak. Kotak tersebut digunankan sebagai mask layer dibawahnya.

Gambar 4.4 Kotak sebagai mask5. Pada layer 1, frame 10, klik kanan Insert keyFrame6. Pada layer 2, frame 10, klik kanan Insert keyFrame7. Pada layer 3, frame 10, klik kanan Insert keyFrame8. Berilah create motion tween diantara frame 1 – 10 layer 3. Lalu

pindahkan objek kotak kekanan.

Gambar 4.4 Sketsa frame 9. Pada layer 3, klik kanan mask.

10. Simpan file dengan nama masking.fla dengan cara klik tombol Ctrl + S atau dengan mengklik menu file save.

SMK Islamic Village Faridi,S.kom

20

Gambar 4.4 Layer masking

Layer masking akan menutupi layer dibawahnya

Page 21: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Kelima(5)Sub Kompetensi

Sounds

Tujuan dan Sasaran

Siswa dapat membuat animasi interaktif dengan menggabungkan sound/suara.

Pendahuluan Jika kita sering menonton TV, Kita sering kali melihat dan

dihadapkan dengan berbagai siaran Televisi, salah satunya yaitu film kartoon yang bayak digemari oleh kalangan anak-anak atau pun kalangan dewasa. Selain tokoh kartoon yang menarik dan alur cerita yang seru. Satu hal yang terpenting dalam pembuatan itu semua adalah musik/suara. Suara/musik akan membuat seuatu cerita kebih hidup dan menarik. Macromedia flash Mx menawarkan beberapa cara penggunaan suara, misalnya, menambahkan suara yang mengiringi atau menjadi latar belakang animasi tersebut. Anda juga dapat menambahkan suara untuk adegan tertentu dengan mengatur letak dan panjang suara pada timeline, serta menambah suara pada tombol sehingga berkesan lebih nyata.Ada 2 tipe suara pada macromedia flash Mx yaitu :

1. Streaming SoundStreaming sound adalah tipe suara yang akan tetap dimainkan selama layer yang ditempati suara ada pada timeline. Dengan kata lain, suara akan dimulai pada awal frame dan berhenti ketika frame pada layer yang ditempati sudah habis. Streaming sound lebih cocok digunakan untuk musik latar/background.

2. Event SoundBerbeda dengan streaming sound yang harus ditentukan kapan awal dan akhir dari suara, maka event sound akan selalu dimainkan setelah suara dimulai, tidak peduli apa pun yang terjadi didalam animasi. Event sound sangat cocok diterapkan pada suara – suara durasi

Sounds dari common libraries

SMK Islamic Village Faridi,S.kom

21

Page 22: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Pilih menu Windows Common Libraries Sounds Catatan : “Pada Mac. flash 8 tidak tesedia library sounds”

SMK Islamic Village Faridi,S.kom

22

Page 23: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Mengimport suara Untuk menambahkan suara yang anda inginkan, terlebih dahulu

anda harus memasukan atau mengimportnya kedalam library, pada mac. Flash anda hanya dapat memasukan suara dalam format sebagai berikut :

WAP MP3

Jika pada komputer anda sudah terinstal quick time, anda juga dapat memasukkan suara dalam format sebagai berikut :

AIFF Sound Only Time Movies Sun AU

Cara mengimport suara :1. klik menu File Import Import to Library jika sudah

memilih suaranya klik Open.2. Tekan F11 untuk membuka Panel Library, untuk melihat suara

yang diimport.

PembahasanMenambahkan suara ke dalam animasi

Untuk menambahkan suara ke dalam animasi, anda diharapkan menempatkan suara kedalam leyer tersendiri untuk mempermudah pemodifikasiannya, selain juga untuk menetukan tipe dari suara tersebut. Untuk menambah suara ke dalam animasi dapat dilakukan dengan cara berikut :

1. Import terlebih dahulu suara kedalam library2. Pilih insert layer untuk membuat sebuah layer dimana suara

ditempatkan3. Buka library dengan memilih menu Windows Library atau

dengan menekan F11, kemudian cari suara yang telah diimport.4. Pastikan layer untuk menempatkan suara terpilih dengan

mengkliknya kemudian drag nama suara dari library ke stage.5. Pada timeline, pilih frame pertama dan leyer yang berisi suara

tersebut.

SMK Islamic Village Faridi,S.kom

23

Page 24: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

6. Jika property inspector belum terbuka maka pilih window properties kemudian pilih stream dan tag sync untuk memilih tipe suara streaming sound.

Gambar 5.1 property inspector untuk mengatur Sync

7. Klik menu Control Test Movie atau Ctrl + Enter.

Menambahkan suara pada button Anda dapat menambahkan suara pada button sesuai dengan states

yang berbeda –beda, misalnya anda ingin menambahkan suara ketika tombol diklik, maka dapat dilakukan dengan cara seperti berikut :

1. Pilih tombol yang akan diisi dengan suara 2. Pilih menu Edit Edit in Place atau klik 2x button sehingga

tampak timeline untuk button.3. Pada timeline button, pada layer 1, frame Down, klik kanan

insert Keyframe.4. buatlah layer baru untuk suara dengan memilih Insert

Timeline Layer 5. Pada layer suara, frame Down klik kanan Insert Blank

Keyframe. Buka panel library kemudian drag suara ke dalam stage. Secara otomaties akan mengisi Keyframe yang telah dibuat.

Gambar 5.2 Menambah suara pada saat button diklik

6. Kembali ke scane 1, kemudian lakukan tes movie dengan menekan tomboll Ctrl + Enter

SMK Islamic Village Faridi,S.kom

24

Page 25: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Keenam(6)Sub Kompetensi

Symbol, Instances dan Library

Tujuan dan Sasaran

Siswa dapat mengenal, membuat symbol-symbol pada flash

Pendahuluan Symbol dan library adalah termasuk salah satu bagian yang paling

penting dalam membuat animasi dengan flash. Jika kita tidak memahami symbol dan library maka kita akan kesulitasn untuk bisa melangkah ke bagian selanjutnya.Symbol adalah istilah yang menunjuk suatu objek yang dapat dipakai

berkali-kali dalam flash. Symbol dapat berupa gambit graphic (graphic Symbol), tombol (Button Symbol), atau sebuah potongan animasi (Movie Clip).

Instance adalah duplikasi symbol yang berada distage, dimana ketika kita ingin menggunakan sebuah symbol pada animasi, maka kita dapat mengambil symbol tersebut dan menempatkannya pada stage

Library adalah tempat penyimpanan symbol. Jika kita membuat symbol Secara otomatis akan ditempatkan dilibrary.

Ada 3 macam jenis symbol yaitu :1. Graphic Symbol digunakan untuk membuat gambar statis (diam)

yang dapat dipakai berulang kali. Langkah-langkah untuk membuat graphic 1. Siapkanlah stage dengan ukuran default/standar 550 x 400 dengan

background putih.2. Pada layer 1, frame 1. Buatlah sebuah objek bebas sebagai contoh

disini objek yang dibuat adalah mobil

SMK Islamic Village Faridi,S.kom

25

Page 26: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 6.1 Objek Mobil

3. Jika sudah jadikan objek mobil tersebut menjadi sebuah symbol graphic. Dengan memilih objek mobil, lalu mengklik menu Modify Convert to Symbol atau dengan klik kanan Convert to Symbol atau dengan menekan tombol F8. Pada kotak dialog Convert to Symbol, isi Name : mobil dan pilih Type : Graphic. Klik Ok .

Gambar 6.2 kotak dialog Convert to Symbol

2. Button Symbol digunakan untuk menciptakan tombol interaktif didalam animasi yang merespon aksi dari mouse yang dapat dipakai berulang kali.Langkah-langkah membuat symbol button1. Siapkanlah stage dengan ukuran default/standar 550 x 400 dengan

background putih.2. Buatlah sebuah persegi, gunakanlah Rectangle Tool , lalu beri

nilai set corner Radius : 10 dengan mengklik button set corner Radius yang berada pada Tool Box Option. Isi Corner radius : 10 agar semua sudut tumpul. Klik OK

Gambar 6.3 Rectangle Setting3. Aturlah fill color, berilah warna yang sesuai.

Gambar 6.4 objek kotak dengan nilai radius 10

SMK Islamic Village Faridi,S.kom

26

Page 27: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

4. Pilihlah objek kotak, kemudian jadikan sebuah symbol button. Tekan tombol F8. Pada kotak dialog Convert to Symbol isi name : tombol, type : button. Klik OK.

Gambar 6.5 kotak dialog Convert to Symbol5. Agar lebih menarik kita bisa mengatur timelinenya.6. klik 2x tombol. Maka akan masuk kedalam edit button. Pada

frame Over, klik kanan Insert Keyframe lalu ubahlah warna button menjadi kuning. Frame Down, klik kanan Insert Keyframe berilah warna warna biru.

Gambar 6.6 Timeline button

7. Klik Scane 1, Lakukan test movie dengan menekan tombol Ctrl + Enter

3. Movie Clip Symbol digunakan untuk menciptakan animasi dalam bentuk movie yang dapat dipakai berulang kali.Langkah-langkah membuat sebuah movie clip1. Siapkanlah stage dengan ukuran default/standar 550 x 400 dengan

background putih.SMK Islamic Village Faridi,S.kom

27

Page 28: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

2. Pada layer 1, frame 1. Buatlah sebuah objek bebas sebagai contoh disini objek yang dibuat adalah mobil atau gunakan objek mobil yang sudah dibuat pada bagian awal.

Gambar 6.7 Objek Mobil

3. Pilihlah objek mobil, kemudian jadikan objek tersebut menjadi sebuh symbol movie clip dengan mengklik tombol F8. Pada kotak dialog Convert to Symbol, isi name : mobil, type : movie clip. Klik OK.

Gambar 6.8 kotak dialog Convert to Symbol

4. klik 2x Movie clip mobil. Berilah animasi pada mobil tersebut.5. Pada layer 1, frame 10, klik kanan Insert Keyframe. Lalu

diantara frame 1 – 10, klik kanan Create Motion Tween.6. kembali ke scane 1. lakukanlah test movie dengan menekan tombol

Ctrl + Entrer

SMK Islamic Village Faridi,S.kom

28

Page 29: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Ketujuh(7)Sub Kompetensi

Pengenalaan Action Script dasar (timeline control)

Tujuan dan Sasaran

Siswa dapat memahami dan mengerti dalam pengunaan action script

Penduluan Macromedia flash adalah program canggih untuk membuat aplikasi

dan animasi web propesional. Utnuk membuat animasi dan aplikasi yang dapat berinteraksi dengan pengguna, Movie flash memerlukan sejumlah kode perintah yang disebut Action Script. Action Script adalah bahasa pemprograman flash yang digunakan untuk mengontrol objek, membuat navigasi dan elemen interaktif lainnya.

Pembahasaan Mengenal Action Panel

SMK Islamic Village Faridi,S.kom

29

Action Catagory

Action Toolbox Script Pane

Script Assist

Page 30: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 7.1 Action Panel

Action Category menunjukan action yang diberikan pada frame atau objek (tombol dan movie clip).

Script Assist digunakan sebagai pemandu script. Action Toolbox berisikan kumpulan action yang disediakan

oleh flash, untuk menggunakannya pilih kelompok action, lalu klik dua kali pada action yang diinginkn.

Script Pane adalah tempat dimana kode action akan ditulis

System Target dan aturan dasar action scriptSystem target, adalah suatu sytem atau cara untuk dapat

melakukan interaksi antar objek. Hal ini sangat penting karena code atau script flash merupakan code OOS (Objek Oriented Scripting) sehingga pada flash dikenal istilah “root” dan “child”. Sytem target pada flash antara lain.

_root digunakan untuk mengakses langsung kebagian scene atau induk utama.

_parent digunakan untuk mengakses satu tingkat ke atas dari child atau anak.

this digunakan untuk mengacu pada objek itu sendiri._level digunakan untuk mengakses antar file yang di load.

Jika dilihat berdasarkan letak script maka editor action script pada flash bisa dibagi menjadi tiga bagian dengan aturan dasar yang berbeda pula, yaitu Action Script pada Frame – Action Frame

Script yang diletakan pada Frame tidak memiliki aturan khusus

SMK Islamic Village Faridi,S.kom

30

Frame mengandung Script, yang ditandai dengan huruf a

Page 31: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 7.2 Action pada framePerintah yang digunakan :

- klik frame yang akan diberi action script, lalu buka panel action script pada script pane ketikan script.

Action Script pada button – Action ButtonScript yang diletakan pada button, dengan aturan : On (event)

{ codo – code script diletakan dalam tanda kurung kurawal }

[

Gambar 7.3 Action pada buttonPerintah yang digunakan :- klik button buka Panel Action Script Ketikan script

Action Script pada Movie Clip - Action Movie ClipScript yang diletakan pada movie clip, dengan aturan :onClipEvent (event) {

codo – code script diletakan dalam tanda kurung kurawal }

Perintah pemasukan script hampir sama dengan buttonAction untuk mengontrol movie flash Stop digunakan untuk menghentikan movie

Play digunakan untuk menjalankan movie flash

gotoAndPlay Digunakan untuk menuju ke frame yang diinginkan lalu menjalankan animasi yang dimulai dari frame tersebut.

SMK Islamic Village Faridi,S.kom

31

on(press){stop();

}

on(press){play();

}

on(press){gotoAndPlay(tujuan frame);

}

Buttonon(press){ play();}

Page 32: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

gotoAndStop Digunakan untuk menuju ke frame yang diinginkan lalu menghentikan animasi.

nextFrame digunakan untuk pindah ke frame berikutnya.

prevFrame digunakan untuk pindah ke frame sebelumnya.

nextScane digunakan untuk pindah ke scene berikutnya

prevScane digunakan untuk kembali ke scane sebelumnya.

stopAllSound digunakan untuk menghentikan seluruh efek suara atau musik yang ada pada movie flash.

SMK Islamic Village Faridi,S.kom

32

on(press){gotoAndStop(tujuan frame);

}

on(press){nextFrame();

}

on(press){prevFrame();

}

on(press){prevScene();

}

on(press){stopAllSound();

}

on(press){nextScene ();

}

Page 33: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Kedelapan(8)

Sub Kompetensi

Pengenalan Action Script dasar ( Movie Clip Control)

Tujuan dan Sasaran

Siswa dapat memahami dan mengerti dalam pengunaan action script

Pendahuluan Dalam macromedia flash yang menjadi factor utama dalam

pembuatan code script pada flash adalah instance name hal ini dikarenakan pengenalan suatu objek secara code pada flash berdasarkan “id” dari objek tersebut dimana “id” tersebut adalah instant cename dari symbol

Untuk bisa menampilkan suatu data atau text yang bersifat dynamic maka pada type text harus diubah kedalam bentuk Dynamic text sedanglan untuk bisa melakukan proses input data type harus dalam bentuk input text, selain itu yang perlu diperhatikan adalah pada bagian var yang merupakan variable penyimpanan data.Pembahasan

SetPropertyAction setProperty digunakan untuk mengubah property movie

clip seperti ukuran, transparansi, posisi, rotasi, dan lain-lain._alpha digunakan untuk mengubah movie clip menjadi transparan

dengan batas nilai 1-100. _rotation digunakan untuk merotasi atau memutar movie clip._height : digunakan untuk mengubah tinggi movie clip._width : digunakan untuk mengubah lebar movie clip._x : digunakan untuk mengubah posisi movie clip pada koordinat

X._y : digunakan untuk mengubah posisi movie clip pada koordinat

Y.

SMK Islamic Village Faridi,S.kom

33

Page 34: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

_xscale : digunakan untuk mengubah skala movie clip secara horizontal.

_yscale : digunakan untuk mengubah skala movie clip secara vertical._visible : digunakan untuk menentukan apakah movie clip ingin

ditampilkan atau tidak

SMK Islamic Village Faridi,S.kom

34

Page 35: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

onAction on digunakan untuk menentukan mouse event pada tombol.

Mouse event yang ada pada action on seperti : press, release, releaseOutside, rollover, rollout, dragOver dan dragOut. duplicateMovieClip

Digunakan untuk membuat duplikat movie clip. Dengan kombinasi property _x dan _y pada action setProperty anda dapat membuat duplikat movie clip dengan jarak tertentu.

removeMovieClipDigunakan untuk menghapus movie clip.

startDrag dan stopDragDigunakan membawa movie clip dengan cara drag mouse sedangkan stopDrag digunakan untuk melepaskan kembali movie clip yang dibawa.

onClipEventDigunakan untuk menetukan clip event yang ingin diterapkan pada movie clip. Clip event adalah salah satu dari event headler. Digunakan

untuk mendeteksi gerakan mouse, mendeteksi apakah tombol kiri mouse diklik atau tombol keybord ditekan dan lain-lain.

load digunakan ketika movie clip muncul pertama kali pada timeline (diload). event load digunakan untuk mendefinisikan variable saat movie clip muncul pertama kali, karena biasanya variable hanya peril didefinisikan satu kali.

mouseDown digunakan untuk menjalankan action pada movie clip ketika tombol kiri mouse diklik. Event mouseDown tidak menggunakan tombol dan tidak memerlukan area hit. Jadi dititik mana pun pada area stage masih dapat terdeteksi.

mouseUp digunakan untuk menjalankan action pada movie clip ketika tombol kiri mouse diklik lalu dilepaskan.

mouseMove digunakan untuk menjalankan action pada movie clip ketika mouse digerakan.

keyDown digunakan untuk menjalankan action pada movie clip ketika salah satu tombol pada keyboard ditekan kecuali Enter.

SMK Islamic Village Faridi,S.kom

35

Page 36: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

keyUp digunakan untuk menjalankan action pada movie clip ketika salah satu tombol pada keyboard ditekan lalu diangkat.

Kompetensi Animation 2 Dimention Latihan Kesembilan(9)

Sub Kompetensi

Pengenalaan Action Script dasar ( Action Browser/Network)

Tujuan dan Sasaran

Siswa dapat memahami dan mengerti action script dalam mengatur tampilan jendele proyektor SWF.

Pendahuluan Anda tentunya sering melihat tampilan program yang didinamis dan

memiliki banyak icon-icon yang pastinya memiliki fungsi tersendiri pada program itu, seperti contoh tombol close, minimize, maximize, fuulscreen dan lain-lain. Pada macromedia flash anda bisa membuat button untuk pengaturan jendela proyektor SWF dengan menggunakan action fscommand.

Pembahasan Action fscommand digunakan untukmengatur tampilan jendela

proyektor SWF seperti menutup jendela, menampilkan atau menghilangkan menu, dan mengubah tampilan jendela meniadi fullscreen. quit digunakan untuk menutup jendela proyektor SWF. fullscreen digunakan untuk mengubah SWF agar tampil secara

penuh pada layer monitor. allowscale digunakan untuk memperbesar tampilan proyektor SWF

menjadi 100%. showmenu digunakan untuk menghilangkan baris menu pada

jendela.

Ket : script fscommand hanya bisa jalan pada file .SWF dan .exe

Latihan.!Membuat tombol close, restore down, fullscreen.

SMK Islamic Village Faridi,S.kom

36

Page 37: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Langkah-langkah.!1. Bukalah software Mac. Flash 8. Klik menu start > program >

macomedia > Macromedia flash Mx2. Pada layer 1, ubahlah nama layer 1 dengan nama “design”

dengan mengklik 2 kali pada leyer 1. Lalu buatlah sebuah kotak dengan menggunakan Ractangle Tool seperti gambar dibawah ini :

Gambar 9.1 Kotak 3. Buatlah layer baru yaitu layer 2 dan ubah namanya menjadi

“button”. Lalu buat sebuah button close, restore down, fullscreen seperti gambar button dibawah ini :

Gambar 9.2 Membuat button close, restore, fullscreen

4. Masukanlah action script pada masing-masing button. Button close

Gambar 9.3 Memberi action quite

Button Restore Down

Gambar 9.4 Memberi action allowscale Button Fullscreen

SMK Islamic Village Faridi,S.kom

37

Menggunakan warna gradient linier, lalu atur warna dengan menggunakan tool Gradient Transform Tool

Close Restore Down Fullscreen

on( release){ fscommand(“quit”, “true”);}

on( release){ fscommand(“allowscale”, “false”);}on( press){ fscommand(“allowscale”, “true”);}

Page 38: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Gambar 9.5 Memberi action fullscreen“script action fullscreen dapat juga digunakan pada frame agar

tampil secara penuh pada layer monitor, hanya tidak menggunakan on (event)”

5. Susunlah posisi ke tiga buah button tersebut diatas pojok kanan pada kotak. Seperti gambar dibawah ini :

Gambar 9.6 Menyusun button pada kotak atas6. Simpanlah pada folder yang telah disiapkan. Klik menu Control

Test Movie atau Ctrl + Enter agar file menjadi file .SWF.7. untuk mengetahui hasilnya bukalah windows explorer lalu klik file

.swf yang ada pada windows explorer tepatnya pada folder penyimpanan.

SMK Islamic Village Faridi,S.kom

38

on( release){ fscommand(“fullscreen”, “true”);}on( press){ fscommand(“fullscreen”, “false”);}

Page 39: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Animation 2 Dimention Latihan Kesepuluh(10)

Sub Kompetensi

Pengenalaan Action Script dasar ( Action Browser/Network)

Tujuan dan Sasaran

Siswa dapat memahami dan mengerti action script dalam mengatur tampilan jendele proyektor SWF.

Pendahuluan

Kita mungkin sering lihat didunia maya atau internet WEB. World Wide Web (www) atau Web ialah informasi yang disajikan dalam bentuk halaman-halaman (page) yang berisikan text, gambar, atau grafik yang disebut hypertext dan setiap halamn memilki kaitan atau link yang dapat membuka bermacam-macam file yang ber-extention seperti “.php”, “.HTML”, “.swf” dan lain-lain dengan menggunakan script yang telah ditentukan. Pertanyaan kita sekarang.!apakah action script pada Mac. Flash dapat memanggil file dengan extention .php, .html, .swf dan lainnya ? jawabannya. Iya. Tentu bisa.

Pembahasan Action getURL

Digunakan untuk membuka alamat URL pada jaringan internet dan file animasi dalam format SWF.

Action loadMovie Digunakan untuk membuka file SWF eksternal yang berada diluar movie utama namun masih dalam folder yang sama. Action loadMovie file SWF dibuka dengan cara menetapkan target dimana file SWF akan tampil.

Action loadMovieNum

SMK Islamic Village Faridi,S.kom

39

Page 40: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Digunakan untuk membuka file SWF eksternal yang berada diluar movie utama namun masih dalam folder yang sama. Action loadMovieNum file SWF dibuka dengan mengatur level. File flash yang orisinal berada dilavel 0, sedangkan file SWF yang akan diload dengan loadMovieNum akan ditempatkan dilevel yang lebih tinggi misalnya 1, 2 atau 3. Apabila file SWF yang diload menggunakan level o, hasilnya akan menggantikan file orisinal.

Action unloadMovie Digunakan untuk menutup file SWF yang dibuka loadMovie.

Action unloadMoiveNum Digunakan untuk menutup file swf yang dibuka dengan action loadMovieNum.

Action loadVaribles Digunakan untuk variabel eksternal “dapat berupa file text(.txt)atau file script(.php)” kedalam movie flash.

Latihan.!Action getURL Membuka alamat http://www.alcobindonesia.org

Langkah- langkah1. Buatlah sebuah button search

2. Masukanlah action script dibawah ini :

3. Penjelasan action script diatas. Pada saat diklik button search, maka script getURL akan memanggil dan membuka alamat http://www.alcobindonesia.org yang berada pada internet dengan tampilan windows baru(_blank).

Membuka File .php

SMK Islamic Village Faridi,S.kom

40

on(press){getURL("http://www.alcobindonesia.org,_blank");

}

Page 41: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

1. Buatlah sebuah button. Sebagai contoh button profile. Anggaplah kita sedah mempunyai file “profile.php”

2. Masukanlah action script dibawah ini :

3. Penjelasan action script diatas. Pada saat diklik button profile, maka script getURL akan memanggil file profile.php.

Membuka File .html1. Buatlah sebuah button. Sebagai contoh button profile. Anggaplah

kita sedah mempunyai file “profile.html”

2. Masukanlah action script dibawah ini :

3. Penjelasan action script diatas. Pada saat diklik button profile, maka script getURL akan memanggil file profile.html.

Action loadMovie dan unloadMovieMembuat file .SWF dengan loadMovieLangkah-langkah

1. Buat dokumnet baru dengan ukuran default2. Buatlah sebuah button dengan nama “loadMovie”

3. Buatlah sebuah kotak disamping button “loadMovie”, lalu jadikan sebuah symbol movie clip. Pada kotak dialog “convert to symbol” berilah name : target dan type : movieClip. Kotak ini akan dijadikan target atau untuk penempatan file .SWF

SMK Islamic Village Faridi,S.kom

41

on(press){getURL("profile.php");

}

on(press){getURL("profile.html");

}

Page 42: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

4. Pindahkanlah registration point disudut kiri atas objek kotak movieclip. Dengan cara pilihlah Free Transform Tool . kliklah objek kotak. Ditengah akan ada bulatan kecil atau registration point. Lalu Pindahkanlah registration point disudut kiri atas objek kotak movieclip.

5. Berilah instance name kotak dengan nama “target” yang ada pada properties.

6. Simpanlah animasi dengan nama loadMovie. Klik menu file

save atau dengan menekan Ctrl + S.7. Buatlah dokument baru dengan ukuran stage 170 X 170 pixel.8. Pada layer 1, frame 1. buatlah sebuah bulatan dengan

menggunakan oval tool. Grouplah objek dengan menyeleksi objek lalu tekan tombol Ctrl + G atau menu modify Group.

9. Pada frame 10, klik kanan Insert Keyframe. Pindahkan objek kekanan.

10. Diantara frame 1 – 10. klik kanan create motion tween.11. Simpanlah animasi dengan nama anima.lalu test movie agar

menjadi anima.swf12. kembalilah ke file loadmovie.fla13. kliklah button loadmovie. Lalu masukan scrip dibawah ini

SMK Islamic Village Faridi,S.kom

42

Ketikan target pada instance name.“instance name sebagai id movie clip”

on(press){loadMovie(" anima.swf ",“

target “);}

Page 43: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

14. kliklah tombol Ctrl + S untuk menyimpan perubahan animasi.15. Test Movie dengan mengklik tombol Ctrl + Enter16. Masih pada file loadmovie.fla.17. Buatlah sebuah button unloadMovie untuk menutup file .swf

yang dibuka loadmovie.

18. Masukan action script pada button unloadmovie.

19. Test Movie dengan mengklik tombol Ctrl + Enter

Action loadMovieNum dan unloadMovieNumLangkah-langkah

1. Buat dokument baru dengan ukuran default2. Buatlah sebuah button dengan nama “loadMovieNum”

3. Simpanlah animasi dengan nama loadMovieNum. Klik menu file

save atau dengan menekan Ctrl + S.4. Buatlah dokument baru dengan ukuran default.5. Pada layer 1, frame 1. buatlah sebuah bulatan dengan

menggunakan oval tool. Grouplah objek dengan menyeleksi objek lalu tekan tombol Ctrl + G atau menu modify Group.

6. Pada frame 10, klik kanan Insert Keyframe. Pindahkan objek kekanan.

7. Diantara frame 1 – 10. klik kanan create motion tween.8. Simpanlah animasi dengan nama anima.lalu test movie agar

menjadi anima.swfSMK Islamic Village Faridi,S.kom

43

on(press){unloadMovie(“ target

“);}

Page 44: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

9. kembalilah ke file loadmovieNum.fla10. kliklah button loadmovie. Lalu masukan scrip dibawah ini

11. kliklah tombol Ctrl + S untuk menyimpan perubahan animasi.12. Test Movie dengan mengklik tombol Ctrl + Enter13. Masih pada file loadmovieNum.fla.14. Buatlah sebuah button unloadMovie untuk menutup file .swf

yang dibuka loadmovie.

15. Masukan action script pada button unloadmovie.

16. Test Movie dengan mengklik tombol Ctrl + Enter

SMK Islamic Village Faridi,S.kom

44

on(press){loadMovieNum(" anima.swf ",

1);}

on(press){unloadMovieNum(1);

}

Page 45: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Kompetensi Macromedia flash Mx Latihan Ketujuh(7)Sub Kompetensi

Objek, Library dan Sound

Tujuan dan Sasaran

Siswa dapat memahami dan mengerti action script dalam mengatur tampilan jendele proyektor SWF.

Pendahuluan Mac. Flash 8 menawarkan beberapa cara penggunaan suara,

misalnya menambah suara yang mengiringi animasi atau menjadi latar belakang dengan ditempatkan pada frame. Ada pun cara lain dengan menggunakan action script.

Pada Mac. Flash untuk mengontrol volume sound, harus melalui proses attachSound(). Terlebih dahulu. Code script yang digunakan antara lain setVolume() dan getVolume(). Penggunaan code diatas baru bisa dilakukan setelah sound pada library diberikan sebuah indetifier melalui linkage (klik kanan objek pada library, pilihan menu linkage)

Pembahasan Membuat Volume ControlLangkah-langkah

1. Siapkan dokumen baru dengan stage ukuran standart yaitu 550 x 400 pixel background color : putih.

2. Mengimport music .mp3 ke dalam library dengan cara klik menu File Import Import To Library. Pada kotak dialog cara music .mp3, jika sudah klik OK. Klik menu windows Library atau Tekan F11 untuk membuka panel library.

SMK Islamic Village Faridi,S.kom

45

Page 46: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

3. Pada musik yang ada pada panel movie clip, klik kanan klik linkage. Pada kotak properties linkage. Beri tanda caklis pada linkage : Expert for ActionScript, lalu ketik identifier : lagu. Klik ok untuk mengakhiri.

4. Pada layer 1, klik frame 1, buka panel action dengan menekan tombol F9, lalu masukan script untuk memainkan sound.

5. Simpan file dengan nama soundcontrol.fla dengan menekan tombol Ctrl + S

6. Test movie dengan menekan tombol Ctrl + Enter untuk mengetahui hasilnya.

7. Kembali pada file soundcontrol.fla8. Pada layer 1, buatlah dua buah button play, stop, dan dua buah

button pengontrol sound.

SMK Islamic Village Faridi,S.kom

46

musik = new Sound();//mendifinisikan objek baru dengan nama musik.

musik.attachSound(“lagu”);//”lagu” merupakan id dari linkege

musik.stop();//menghentikan musik

musik.start(0,999);//memainkan musik dari 0 dan akan looping

Page 47: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

9. Pilihlah button play lalu ketikan action script dibawah ini :

10. Pilihlah button stop lalu ketikan action script dibawah ini :

11. Pilihlah button Control Sound (+) lalu ketikan action script dibawah ini :

SMK Islamic Village Faridi,S.kom

47

on(release){

Sound = new Sound();

Sound.attachSound(“musik”);

Sound.stop();

Sound.start(0,999);

}

on(release){

stopAllSound();

}

on(release){

if (musik.getVolume() < 100)

{Volume = musik.getVolume() + 10

Musik.setVolume(volume)

}

on(release){

if (musik.getVolume() > 0)

{Volume = musik.getVolume() - 10

Musik.setVolume(volume)

}

Page 48: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

12. Tekan Ctrl + S untuk menyimpan perubahan.13. Test Movie dengana menekan Ctrl + Enter

Membuat kipas angin3. Buat Object 2 buah segitiga + 1 Buah object lingkaran di Lembar kerja flash

Caranya:

Untuk membuat Segitiga gunakan PolyStar Tool pada toolbar , Untuk Pengaturan gunakan

Style: Polygon, Number Of Side: 3

Untuk membuat Lingkaran gunakan Oval Tool dan tekan dan tahan tombol shift agar

lingkaran bulat sempurna

Petunjuk Gambar IG

4. Atur gambar sehingga membentuk Sebuah baling baling kipas dan seleksi semuanya lalu

tekan CTRL + G (Group) untuk menggabungkan 3 object tersebut menjadi 1 kesatuan

SMK Islamic Village Faridi,S.kom

48

Page 49: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

Petunjuk Gambar IG

5. Sekarang waktunya membuat Frame pada Layer 1 klik Frame 50 dan pilih insert Frame

Petunjuk Gambar IG

SMK Islamic Village Faridi,S.kom

49

Page 50: Pengenalan dan Pengoperasian scanner untuk … · Web viewGambar 1.1 Tampilan interface macromedia flash Mx Sebelum memulai membuat objek (animasi), anda perlu mengenal bebarapa interface

Macromedia Flash

6. Masih di Frame 50, klik kanan lagi dan sekarang pilih Create Classic Tween

7. Pada Properties, atur Tweening , pilih Rotate: CW (Searah jarum jam)

Petunjuk Gambar IG

Setelah selesai, tekan F6 di frame 50 untuk memunculkan keyframe

Selesai

SMK Islamic Village Faridi,S.kom

50