pelatihan macromedia flash ukmf matriks 2010

1

Pelatihan Macromedia Flash 8

UKMF MATRIKS

2010

PELATIHAN MACROMEDIA FLASH 8

R. Teater FT UNY, 25 April 2010 Tentor: - Barry Nur Setyanto - Ahmad Thoriq I. Pendahuluan

Presentasi adalah kumpulan tulisan dalam bentuk ringkasan penting yang menggambarkan suatu produk, program, atau makalah yang akan diterangkan kepada khalayak ramai. Biasanya presentasi dipakai dalam seminar, kuliah, workshop dan lain-lain. Seperti yang kita ketahui, saat ini pembuatan presentasi banyak menggunakan komputer yang diatur/dibagi dalam bentuk slide; biasanya pembuatannya menggunakan program bantu seperti power point, Macromedia Flash dan program tutor lainnya.

Mengapa menggunakan Macromedia Flash dalam membuat presentasi?, Macromedia Flash mempunyai kelebihan tersendiri seperti mampu menampilkan video, navigasi yang teratur, dan lain-lain. Akan tetapi Macromedia Flash juga mempunyai kelemahan yaitu membutuhkan waktu yang lama untuk membuat presentasi. Kelemahan tersebut dapat diatas oleh programmer Flash dengan menambahkan template. Template berguna untuk menyederhanakan proses pembuatan suatu aplikasi seperti presentasi, kuis, slide foto dan lain-lain. Dan dalam pembuatannya kita tidak harus memahami Action Script, jadi kita hanya menulis teks atau mengimpor gambar/video yang diinginkan saja. Tentu saja akan mempermudah dan mempercepat pembuatan aplikasi tersebut.

II. Pengenalan Komponen-komponen Macromedia Flash

Sebelum membuat sebuah presentasi ada kalanya Anda harus mengenal dahulu komponen-komponen apa saja yang dibutuhkan dalam pembuatan sebuah animasi. Anda harus mengenal semua komponen yang terdapat di aplikasi Macromedia Flash agar pekerjaan dalam pembuatan animasi ini dapat berjalan dengan lancar. Di bawah ini merupakan jendela dari Macromedia Flash yang digunakan dalam pekerjaan pembuatan animasi, baik itu berupa graphic atau animasi bergerak (cartoon).

2


UKMF MATRIKS

2010

Di bawah ini merupakan keterangan dari kegunaan masing-masing komponen

Macromedia Flash secara detail: A. Timeline, digunakan untuk mengatur dan mengontrol isi keseluruhan movie Anda.

B. Stage, merupakan tempat dimana Anda bekerja dalam membuat sebuah animasi.

3


UKMF MATRIKS

2010

C. Tools Box, berisi alat-alat yang digunakan untuk menggambar objek pada stage.

Description of Tools Box:

Selection Tool (V) Digunakan untuk memilih suatu objek atau untuk memindahkannya, dan manipulasi bentuk object.

Subselection Tool (A) Digunakan untuk merubah suatu objek dengan edit points dengan kata lain hampir sama dengan Selection Tool tapi lebih detail.

Line Tool (N)

4


UKMF MATRIKS

2010

Digunakan untuk membuat suatu garis di stage.

Lasso Tool (L) Digunakan untuk memilih daerah di objek yang akan diedit.

Pen Tool (P) Digunakan untuk menggambar dan merubah bentuk suatu objek dengan menggunakan edit points (lebih teliti & akurat)

Text Tool (T) Digunakan untuk menuliskan kalimat atau kata-kata.

Oval Tool (O) Digunakan untuk menggambar sebuah lingkaran.

Rectangle Tool (R) Digunakan untuk menggambar sebuah segi empat.

Pencil Tool (Y) Digunakan untuk menggambar sebuah objek sesuai dengan yang Anda sukai. Tetapi setiap bentuk yang Anda buat akan diformat oleh Macromedia Flash menjadi bentuk sempurna.

Brush Tool (B) Tool ini sering digunakan untuk memberi warna pada objek bebas.

Free Transform Tool (Q) Digunakan untuk memutar (rotate) objek yang Anda buat atau mengubah bentuk objek menjadi bentuk lain.

Fill Transform Tool (F) Digunakan untuk memutar suatu objek yang diimport dari luar lingkungan Macromedia Flash, serta untuk mengatur efek warna.

Ink Bottle Tool (S) Digunakan untuk mengisi warna pada objek yang bordernya telah hilang (tidak ada).

Paint Bucket Tool (K) Digunakan untuk mengisi warna pada objek yang dipilih.

Eraser Tool (E) Digunakan untuk menghapus objek yang Anda bentuk.

Eyedropper Tool (I) Digunakan untuk mengidentifikasi atau mengambil warna dari suatu oyek atau gambar. Description of Colors Box:

5


UKMF MATRIKS

2010

Description of View Box:

D. Color Window, merupakan jendela yang digunakan untuk mengatur warna pada objek yang Anda buat. Color Window terdiri dari: 1. Color Mixer, digunakan untuk mengatur warna pada objek sesuai dengan keinginan

Anda. Ada 5 pilihan tipe warna, yaitu: None, Solid, Linear, Radial, Bitmap.

6


UKMF MATRIKS

2010

2. Color Swatches, digunakan untuk memberi warna pada objek yang Anda buat sesuai dengan yang warna pada window.

E. Actions-Frame, merupakan window yang digunakan untuk menuliskan Action Script untuk Macromedia Flash. Biasanya Action Script digunakan untuk mengendalikan objek yang Anda buat sesuai dengan keinginan.

F. Properties, merupakan window yang digunakan untuk mengatur properti dari objek yang Anda buat.

7


UKMF MATRIKS

2010

G. Components, digunakan untuk menambahkan objek untuk web application yang

nantinya di publish ke internet.

H. Window Utility Pada Macromedia Flash 1. Library Window Digunakan untuk menampilkan objek-objek yang kita import dari luar lingkungan Macromedia Flash, maupun objek-objek bawaan dari Macromedia Flash itu sendiri.

2. Document Properties Window Digunakan untuk merubah setting (baik itu ukuran, warna, maupun kecepatan movie) pada dokumen yang berada pada stage.

8


UKMF MATRIKS

2010

3. Window Layer Properties Merupakan window dimana Anda dapat mengatur setting dari layer yang Anda buat sesuai dengan keinginan. Melalui window ini Anda dapat mengatur bagaimana sebuah animasi berjalan.

4. Window Scene Merupakan window dimana Anda dapat mengatur scene yang ada. Melalui window ini Anda dapat menambahkan scene, menghapus scene, atau menduplikasikan sebuah scene.

9


UKMF MATRIKS

2010

I. Menjalankan Macromedia Flash Movie

Untuk menjalankan movie yang telah Anda buat, Anda dapat mengaktifkannya melalui menu Control lalu pilih Play (tombol Enter pada keyboard).

J. Konversi File melalui Macromedia Flash Anda dapat melakukan konversi file melalui Macromedia Flash. File yang

dikonversi biasanya berbentuk file *.swf ke dalam bentuk lainnya, seperti *.html, *.exe, *.avi, dan lain sebagainya. Untuk mengkonversi file flash yang telah Anda buat, terlebih dahulu Anda harus mengaktifkan konverternya terlebih dahulu. Cara mengaktifkannya yaitu dengan memberi checkmark pada type file yang Anda inginkan.

Keterangan: - Flash (.swf) : Menghasilkan file *.swf (untuk menjalankannya dibutuhkan flash

player). - Html (.html) : Menghasilkan file *.html (diperlukan internet explorer untuk

menjalankannya). Konversi ini biasanya digunakan untuk membuat web. - Gif, Jpeg, Png : Menghasilkan file gambar. - Windows Projector : Menghasilkan file *.exe yang dapat langsung dijalankan. - Macintosh Projector : Menghasilkan file *.hqx untuk macintosh. - Quick Time : Menghasilkan file *.mov untuk Quick time player.

III. Sembilan Jurus Ampuh dan Mudah Metode Animasi untuk Presentasi A. Jurus 1 Menggunakan Motion Tween

Metode animasi tween adalah metode yang paling sering digunakan dalam membuat animasi di Macromedia Flash karena metode ini adalah metode paling mudah dan cepat

10


UKMF MATRIKS

2010

dalam membuat animasi di Macromedia Flash. Kita hanya perlu membuat atau menentukan objek di frame awal dan objek di frame akhir, kemudian secara otomatis Macromedia Flash akan membuat frame di antara (between in/ tween) frame awal dan frame akhir tersebut sehingga terciptalah gerakan atau animasi. Motion tween digunakan untuk membuat animasi objek bergerak, berputar, miring, objek yang membesar/mengecil, serta perubahan warna pada objek. Pada latihan jurus pertama, kita akan membuat animasi traktor yang bergerak dari kiri ke kanan. Langkah-langkahnya sebagai berikut: 1. Imporlah sebuah gambar, klik menu File > Import > Import to Stage, lalu cari file

gambar (Misal file gambar traktor.png pada folder pelatihan macromedia flash) 2. Objek traktor akan tampil dilayar, kemudian letakkan objek traktor pada bagian kiri layar

seperti pada gambar A.1.

Gambar A.1. Objek traktor pada kiri layar

3. Pilih objek traktor, lalu klik menu modify > convert to symbol. Akan tampil kotak dialog, lalu pilih graphic pada bagian Behavior dan pilih titik hitam ditengah pada Registration. Lihat gambar A.2.

Gambar A.2 Kotak dialog convert to symbol

4. Pada Timeline Panel, klik frame 20, lalu klik menu Insert > Timeline > keyframe. Lihat gambar A.3

Gambar A.3 memasukkan keyframe di frame 20

5. Akibatnya pada frame 20 juga terdapat objek traktor seperti pada frame 20. Pindahkan traktor tersebut ke bagian kanan layar seperti gambar A.4.

11


UKMF MATRIKS

2010

Gambar A.4. Objek traktor pada bagian kanan layar

6. Pada Timeline Panel, klik frame 1, lalu pada Properties, pilih motion pada bagian Tween. Lihat gambar A.5

Gambar A.5 Properties Tween: Motion

7. Frame akan berwarna ungu dengan tanda panah dari frame 1 ke frame 15 yang menunjukkan bahwa motion tween sudah berhasil dibuat. Lihat gambar A.6.

8. Jalankan animasi dengan cara klik menu Control > Test Movie (Ctrl+Enter)

B. Jurus Menggunakan Shape Tween

Shape tween digunakan untuk membuat animasi perubahan bentuk pada suatu objek, misalnya objek kotak berubah menjadi objek lingkaran, atau bisa juga objek lingkaran menjadi objek teks. Shape tween juga sering disebut dengan efek morph. Pada Latihan ini kita akan menganimasikan/ mengubah bentuk objek bintang menjadi objek kotak yang bergerak dari atas ke bawah secara diagonal. Berikut langkahnya: 1. Klik Line Tool, lalu gambarlah objek bintang pada bagian kiri atas layar. Lihat gambar

B.1.

12


UKMF MATRIKS

2010

Gambar B.1 Obyek bintang pada bagian kiri-atas layar

2. Pada Timeline Panel, klik frame 25 , lalu klik menu Insert > Timeline > Blank Keyframe. Lihat gambar B.2

Gambar B.2. memasukkan blank keyframe di frame 25

3. Pada frame 25, klik Rectangle Tool, lalu gambarlah objek kotak pada bagian kanan-bawah layar. Lihat gambar B.3

Gambar B.3 Objek kotak pada bagian kanan – bawah layar

4. Pada Timeline Panel, klik frame 1, lalu pada Properties, pilih Shape pada bagian Tween. Lihat gambar B.4

13


UKMF MATRIKS

2010

Gambar B.4. Properties Tween : Shape

5. Frame akan berwarna hijau dengan tanda panah dari frame 1 ke frame 25. ini menunjukkan bahwa shape tween sudah berhasil dibuat.Lihat gambar B.5

Gambar B.5. Frame shape tween

6. Jalankan animasi dengan cara klik menu Control > Test Movie C. Jurus Menggunakan frame-by-frame

Metode animasi frame-by-frame merupakan metode pembuatan animasi dengan cara manual, yaitu kita diharuskan membuat setiap objek atau isi yang berbeda pada setiap frame untuk menghasilkan gerakan atau animasi. Meskipun animasi yang dihasilkan metode ini terlihat lebih bagus dan halus daripada animasi yang dibuat dengan metode tween, metode ini jarang digunakan karena pembuatan animasi menggunakan metode ini memerlukan ketelitian dan memakan waktu yang lama serta ukuran file pun lebih besar.

Pada latihan ini kita akan membuat animasi kartun dengan pergantian 7 buah gambar. Apabila pergantian gambar kartun tersebut dianimasikan akan dihasilkan gerakan seperti layaknya gerakan kartun di film. OK Lets GO trial !!! 1. Importlah sebuah gambar, lalu klik menu File > Import > Import to Stage. Cari file

gambar dengan nama Cartoon1.png dan letakan gambar tersebut ditengah layar dengan cara klik menu Modify > Align > Horizontal center (atau Ctrl+Alt+2) dan klik menu Modify > Align > Vertical center (atau Ctrl+Alt+5). Lihat gambar C.1.

14


UKMF MATRIKS

2010

Gambar C.1. Gambar Cartoon1 ditengah layar.

2. Pada Timeline panel, klik frame 2, lalu klik menu Insert >Timeline > Blank Keyframe. 3. Impor lagi gambar dengan nama Cartoon2.png dan letakkan gambar tersebut di tengah

layar. Lihat gambar C.2.

Gambar C.2. Gambar Cartoon2 ditengah layar.

4. Lakukan hal yang sama seperti langkah (2) dan (3) pada frame 3 (Cartoon3.png), frame 4 (Cartoon4.png), frame 5 (Cartoon5.png), frame 6 (Cartoon6.png), frame 7 (Cartoon7.png). sehingga animasi frame-frame di Timeline Panel. Lihat gambar C.3.

15


UKMF MATRIKS

2010

Gambar C.3 Frame animasi frame-by-frame

5. Jalankan animasi dengan cara klik menu Control > Test Movie.

Tips & Trik Jalannya animasi yang dibuat dengan jurus frame-by-frame mungkin terlalu cepat

karena secara standard perpindahan antar frame adalah 12 frame perdetik (dalam 1 detik menjalankan 12 frame). Agar animasi yang ditampilkan dapat dilihat dengan jelas, kurangi saja kecepatan framenya dengan mengklik menu Modify > Document, lalu mengisi nilai 2 pada bagian Frame Rate. Lihat gambar C.4.

Gambar C.4. kotak dalog dokumen properties

Semakin kecil nilai frame rate, semakin lambat jalannya animasi. Sekarang coba jalankan lagi animasinya untuk melihat hasilnya.

D. Jurus Menggunakan Guide Tween

Guide tween atau sering juga disebut motion guide tween merupakan salah satu pengembangan dari motion tween di mana animasi (pergerakan) objek akan mengikuti arah garis (alur) yang telah kita buat/tentukan. Pada latihan jurus ini kita akan membuat animasi mobil yang berjalan menaiki bukit dan menuruni lembah. 1. Pada Timeline Panel, klik tombol Motion Guide. Akan tampil layer baru di atas layer 1

dengan nama Guide: layer1. Lihat gambar D.1.

16


UKMF MATRIKS

2010

Gambar D.1. Membuat layer guide : layer 1 dengan menekan tombol Motion Guide

2. Pada Guide :layer 1, gunakan Pencil tool atau Pen Tool atau Line Tool (pilih salah satu untuk membuat garis melengkung. Seperti pada gambar D.2.

Gambar D.2. Garis sebagai alur animasi.

3. Pada Guide: Layer 1, klik frame 30, lalu klik menu insert > Timeline > Frame. Hal ini dimaksudkan untuk membuat frame dengan memberikan frame kosong di frame 30 agar garis yang dibuat akan terlihat sampai frame 30. Lihat gambar D.3.

Gambar D.3 Memasukkan frame di frame 30

4. Pindah ke layer 1, lalu klik frame 1 dan imporlah sebuah gambar dengan nama mobil.png 5. Pilih mobil, lalu ubah menjadi simbol graphic (lihat lagi gambar A.2.), kemudian

letakkan mobil diawal garis, perhatikan bahwa bulatan di tengah mobil harus tepat berada diawal garis seperti pada gambar D.4

17


UKMF MATRIKS

2010

Gambar D.4. Objek sepeda berada diawal garis 6. Masih di layer 1, klik frame 30 lalu klik menu insert > keyframe sehingga pada frame

15 juga terdapat objek mobil. Pindahkan mobil ke akhir garis. Perhatikan bahwa bulatan di tengah mobil harus tepat diakhir garis seperti pada gambar D.5.

Gambar D.5. Objek mobil berada di akhir garis

7. Masih di layer 1, klik frame 1, lalu properties, pilih Motion pada bagian Tween (lihat lagi gambar D.5). Sekarang frame yang terbentuk di Timeline Panel terlihat pada gambar D.6

Gambar D.6. Frame motion guide tween

8. Jalankan animasi dengan cara klik menu Control > Test Movie

Tips &Trik Apabila kita perhatikan, pada hasil animasi motion guide tween yang kita buat di atas

akan terlihat bahwa gerakan objek mobil akan mengikuti alur dari yang kita buat, namun saat jalannya mendaki, objek mobil tetap lurus dan tidak ikut mendaki. Hal ini tentunya kurang alamiah. Oleh karena itu, perlu kita tambahkan sedikit trik untuk memperbaikinya. Pada layer 1, klik frame 1, lalu pada Properties, berikan tanda cek (√) pada bagian Orient to path. Lihat gambar D.7.

18


UKMF MATRIKS

2010

Gambar D.7. Menandai bagian orient to path

Orient to path membuat objek mobil menghadap garis sambil menelusuri garis meskipun garis tersebut melengkung (mendaki). OK LETS TO TRY!!!! (Ctrl+Enter)

E. Jurus Menggunakan Rotasi

Rotate atau rotasi adalah nama lain dari pemutaran objek, jadi kita bisa membuat animasi berputar pada objek secara otomatis. Pada latihan menggunakan jurus rotasi kita akan membuat pesawat luar angkasa kehilangan kendali. 1. Importlah sebuah gambar, klik menu File > Import > Import to Stage, lalu cari file

gambar dengan nama roket.png dan letakan gambar dibagian kiri-bawah layar lihat gambar E.1.

E.1. Objek pada bagian kiri – bawah layar

2. Pilih roket, lalu ubah menjadi simbol Graphic (lihat lagi gambar A.2). 3. Klik frame 40, lalu klikmenu Insert > Timeline> keyframe untuk memasukan keyframe.

Pada frame 40, pindahkan roket ke bagian kanan atas layar. Lihat gambar E.2.

19


UKMF MATRIKS

2010

E.2. Objek pada bagian kanan–atas layar

4. Klik frame 1 untuk kembali ke frame 1, lalu pada properties, pilih motion pada bagian Tween dan CW untuk Rotate dengan nilai 5 times. Lihat gambar E.3

E.3. Properties Frame Tween: Motion dan Rotate CW 5 Times


F. Jurus Menggunakan Ease Ease adalah fasilitas dari motion tween untuk membuat pergerakan dari animasi

terlihat lebih hidup, contohnya baling-baling pesawat yang awalnya berputar perlahan-lahan menjadi cepat. Pada latihan jurus ini kita akan membuat animasi bola memantul. Ketika jatuh ke bawah gerakannya cepat, dan ketika memantul keatas gerakannya melambat. 1. Gambarlah objek berbentuk bola pada bagian atas layar. Gunakan Oval tool dan beri

warna gradasi Radial pada bola. Lihat gambar E.1

20


UKMF MATRIKS

2010

Gambar E.1 Objek bola terletak dibagian atas layar

2. Pilih bola, lalu ubah menjadi simbol Graphic (lihat lagi Gambar A.2.) 3. Masukkan keyframe di frame 15 dan frame 30. 4. Pada frame 15, pindahkan bola ke bawah layar menggunakan Select Tool. Lihat gambar

E.2.

Gambar E.2 Objek bola terletak dibagian bawah layar

5. Masukkan keyframe diframe 16, selanjutnya klik frame 15 (untuk kembali ke frame 15). Gunakan Free Transform untuk mengecilkan ukuran bola seperti pada gambar E.3.

21


UKMF MATRIKS

2010

Gambar E.3 Objek bola diperkecil ukurannya

6. Klik frame 1 untuk kembali ke frame 1. Di properties, pilih Tween pada bagian Motion dan -100 untuk Ease. Lihat gambar E.4

Gambar E.4 Properties frame Tween

7. Klik frame 16. Di properties, pilih tween pada bagian motion dan 100 untuk Ease. Sekarang layer dan frame yang terbentuk pada Timeline Panel akan terlihat pada gambar E.5

Gambar E.5. Frame animasi bola memantul


Catatan Ease dibagi menjadi dua, yaitu Ease In dan Ease Out. Ease In (nilainya -100)

menandakan bahwa animasi akan dimulai dengan lambat dan diakhiri dengan cepat. Ease Out (nilainya 100) menandakan bahwa animasi akan dimulai dengan cepat dan diakhiri dengan lambat. Jalankan lagi animasi bola memantul dan perhatikan dengan seksama. Anda akan melihat efek Ease yang menjadikan suatu animasi menjadi lebih riil.

22


UKMF MATRIKS

2010

G. Jurus Menggunakan Tint Tween

Tint Tween merupakan teknik animasi yang dapat mengubah warna dari suatu objek, misalnya objek yang semula berwarna biru, perlahan-lahan akan berubah menjadi objek merah. Pada latihan jurus ini, kita akan mengubah warna objek daun yang semula berwarna hijau menjadi merah, lalu berubah lagi menjadi berwarna kuning 1. Gambarlah objek daun dengan pencil tool, lalu letakkan objek tersebut di bagian atas-kiri

layar.

Gambar G.1. Objek daun hijau pada bagian atas-kiri layar

2. Pilih daun lalu ubah menjadi simbol Graphic ( lihat lagi gambar A.2 ). 3. Klik frame 15, lalu klik menu Insert > Timeline > keyframe untuk memasukkan

keyframe. Kemudian klik frame 30 dan masukkan keyframe. 4. Klik frame 15 untuk kembali ke frame 15, lalu pilih/klik pada objek. Pada properties,

pilih tint untuk Color dan warna Merah dengan nilai 100% atau sesuai selera/ kebutuhan. Lihat gambar G.2.

Gambar G.2. Properties Graphic denganatribut color tint merah dan nilai 53%

5. Objek daun yang semula berwarna hijau akan berubah warnanya menjadi merah. Pilih daun merah, lalu letakkan ditengah-kanan layar. Klik menu Modify > Transform > Rotate 900 CW untuk memutar objek daun sebesar 90 derajat. Lihat bambar G.3.

23


UKMF MATRIKS

2010

Gambar G.3. Objek daun merah pada bagian tengah-kanan layar

6. Lakukan hal yang sama seperti langkah 4 pada frame 30, tapi gunakan Color Tint dan warna kuning dengan nilai 100% (atau sesuai kebutuhan). Kemudian pilih daun kuning dan letakan di bawah-tengah layar lalu klik menu Modify > Transform > Flip Vertical untuk membalik objek daun secara vertikal.

Gambar G.3. Objek daun kuning pada bagian bawah-tengah layar

7. Klik frame 1. untuk kembali ke frame 1, lalu pada Properties, pilih Tween untuk Motion. Lakukan hal yang sama pada frame 15. Timeline seperti gambar G.4.

Gambar G.4. Timeline latihan jurus ini.

8. Jalankan animasi dengan cara klik menu Control > Test Movie.

24


UKMF MATRIKS

2010

H. Jurus Menggunakan Alpha Tween Alpha tween merupakan teknik animasi yang dapat memudarkan (fade) suatu objek.

Objek yang semula terlihat jelas secara perlahan-lahan memudar lalu menghilang atau sebaliknya, objek yang semula tidak terlihat secara pelan-pelan tampil dengan jelas. Biasanya teknik animasi ini digunakan untuk transisi (perpindahan) antar animasi sehingga perpindahan satu animasi ke animasi lainnya terlihat halus. Pada latihan jurus ini kita akan membuat animasi transisi yang akan mengganti sebuah gambar dengan gambar lainnya dan pergantian gambar dilakukan secara halus. 1. Importlah sebuah gambar, klik menu File > Import > Import to Stage, dan cari file

gambar dengan nama bonbin1.jpg sehingga gambar gambar bonbin1 akan tampil dilayar. Lihat gambar H.1

Gambar H.1

2. Pilih gambar bonbin1, lalu ubah menjadi simbol Graphic (lihat lagi Gambar A.2). 3. Klik frame 10, lalu klik menu Insert > Timeline > Keyframe untuk memasukan

keyframe. Klik frame 20 dan masukan keyframe juga. 4. klik frame1untuk kembali keframe 1, lalu pilih Motion pada bagian Tween di Properties.

Lakukan hal yang sama pada frame 10. 5. Klik lagi frame 1 untuk kembali ke frame1, lalu pilih/klik pada gambar bonbin1. pada

Properties, pilih bagian Color dan gunakan Alpha serta isikan nilainya sebesar 0%. Lihat gambar H.2

Gambar H.2

6. Lakukan hal yang sama pada frame 20, yaitu berikan Color Alpha dengan nilai 0%.

25


UKMF MATRIKS

2010

7. Klik menu Insert > Timeline> Layer untuk membuat layer baru. Sekarang terdapat dua layer di timeline panel, yaitu layer 1 dan layer 2, lalu klik frame 21, dan kemudian klik menu Insert > Timeline > Blank Keyframe. Lihat gambar H.3.

Gambar H.3

8. Import lagi sebuah gambar dengan nama bonbin2.jpg. lihat gambar H.4

Gambar H.4

9. Lakukan lagi seperti langkah 2 sampai 6 untuk membuat animasi transisi di layer 2 pada frame 21 sampai frame 40 sehingga layer dan frame yang terbentuk pada Timeline Panel akan terlihat seperti pada gambar H.5

Gambar H.5


26


UKMF MATRIKS

2010

I. Jurus Menggunakan Efek Masking

Masking merupakan teknik untuk menyembunyikan atau menutupi suatu obyek dengan obyek lain. Obyek yang menutupi terlihat transparan dan menyatu dengan objek yang ditutupi yang dapat dilihat. Pada latihan ini, kita akan membuat animasi gambar gelombang tegangan AC yang seperti terlihat dalam CRO (cathode ray oscilocope). 1. Gambar fungsi XY seperti pada gambar I.1

Gambar I.1 fungsi XY

2. Pilih gambar fungsi XY, lalu ubah menjadi simbol Graphic movie Clip. Lihat gambar I.2.

Gambar I.2 Mengubah ke simbol Movieclip

3. Klik 2x pada gambar Symbol 1. 4. Klik menu Insert > Timeline> Layer untuk membuat layer baru. Sekarang terdapat dua

layer di timeline panel, yaitu layer 1 dan layer 2.

27


UKMF MATRIKS

2010

Gambar I.3 Layer baru.

5. Pada layer 2 frame 1, gambar gelombang AC dengan warna merah . Lihat gambar I.4.

Gambar I.4 gambar gelombang AC pada layer 2 frame 1

6. Klik menu Insert > Timeline> Layer untuk membuat layer baru. Sekarang terdapat tiga layer di timeline panel, yaitu layer 1 (gambar fungsi XY) layer 2 (gambar gelombang AC), dan layer 3. Select frame ke 70 pada semua layer lalu tekan F5.

7. Pada Timeline, klik kanan pada layer 3 sehingga akan tampil menu pilihan. Pilihlah mask pada menu tersebut. Lihat gambar I.5

Gambar I.5 perintah mask pada layer 3

8. Pada Timeline, klik frame 1 pada layer 3, lalu gambar Rectangle pada Stage disisi kiri gambar gelombang AC. Lihat gambar I.6.

28


UKMF MATRIKS

2010

Gambar I.6 gambar Rectangle disisi kiri gambar gelombang AC pada layer 3 frame 1

9. Masih dilayer 3, klik frame 70 lalu klik menu Insert > Timeline > Keyframe. Ubah ukuran kotak tersebut sampai menutupi gambar gelombang AC.lihat gambar I.7.

Gambar I.6 gambar Rectangle menutup gambar gelombang AC pada layer 3 frame 70

10. Jalankan animasi dengan cara klik menu Control > Test Movie. IV. Membuat Presentasi Menggunakan Template Flash

Pada pelatihan ini kita akan menggunakan template untuk membuat presentasi multimedia interaktif dengan mudah dan cepat.

A. Menggunakan Template Presentasi Hal pertama yang kita lakukan adalah membuat dokumen baru dari template, dalam

hal ini adalah teplate presentasi, caranya : 1. Buka program Macromedia Flash, dan klik File> New, kemudian akan tampil jendela

seperti pada gambar. Lihat gambar IV.A.1. 2. Bagian kiri merupakan bagian Templates, disana terdapat beberapa kategori template.

Pilih/klik bagian presentations.

29


UKMF MATRIKS

2010

Gambar IV.A.1. Kotak dialog new form template

3. Akan tampil kotak dialognya dan pada bagian Category. Di bagian templates, kita bisa memilih model antar muka presentasi yang dinginkan. Sebagai contoh, pilihlah model Tech Presentation, lalu klik tombol OK. Lihat gambar IV.A.1.

B. Memahami Layer Template Presentasi

Setelah kita melakukan langkah pertama terbentuklah sebuah dokumen baru dari template presentasi. Sebelum memulai mengisi materi di halaman/ slide presentasi, ada baiknya kita memahami terlebih dahulu layer-layer dalam template presentasi karena kita harus tahu di layer mana kita bisa menempatkan materi/poin dengan benar. Pada template presentasi terdapat delapan layer.

Gambar IV.B.1. Layer-layer pada template presentasi

30


UKMF MATRIKS

2010

Akan tetapi kalau kita lihat pada interface template presentasi maka yang perlu diperhatikan hanya empat bagian saja, yaitu header, content, bg, dan buttons. Lihat gambar IV.B.2.

Gambar IV.B.2. Bagian-bagian pada interface template presentasi

Keteranngan gambar IV.B.2. Headers merupakan judul materi atau nama perusahaan yang sedang dipresentasikan. Content merupakan isi utama atau poin – poin materi yang dipresentasikan. Bg merupakan backgound atau latar belakang. Buttons merupakan tombol untuk melakukan navigasi antara halaman/slide, jadi kita bisa menampilkan slide berikutnya/ sebelumnya melalui dua tombol tersebut.

C. Mengisikan Header Dan Materi Presentasi Setelah memahami layer template presentasi, sekarang kita bisa mengetahui di layer

mana kita bisa mengisikan header dan materi/poin-poin yang akan dipresentasikan. Pada latihan ini, kita akan mengganti/ mengisikan header dan materi pada slide pertama dan kedua, sedangkan slide berikutnya dapat anda teruskan sebagai latihan. 1. Pastikan tool yang aktif adalah select tool, lalu klik ganda pada teks “My Company”

sehingga teks tersebut dalam keadaan mode edit atau siap diganti. Lihat gambar IV.C.1

31


UKMF MATRIKS

2010

Gambar IV.C.1 Teks My Company dalam keadaan edit

2. Gantilah teks “My Company” dengan teks “Pelatihan Macromedia Flash 8”. Lihat gambar IV.C.2

Gambar IV.C.2 Hasil pergantian teks header

3. Klik Select tool lagi, lalu klik ganda teks di bawahnya, dan gantilah teks tersebut seperti pada gambar. Lihat gambar IV.C.3

Gambar IV.C.2 Hasil pergantian teks pada content

4. Selesai sudah slide pertama, sekarang kita akan pindah ke slide kedua. Klik frame 2 di layer headers, kemudian klik Select Tool, lalu klik ganda teks “My Company”

5. Klik frame 2 di layer Content sehingga semua materi/poin pada slide kedua akan terpilih. Lihat gambar IV.C.4.

32


UKMF MATRIKS

2010

Gambar IV.C.4 semua content pada slide kedua dalam keadaan terpilih

6. Tekan tombol delete di keyboard untuk menghapusnya, lalu gantilah dengan materi yang kita miliki, mislnya impor sebuah gambar logo UKMF Matriks beserta keterangan teks di bawahnya. Lihat gambar IV.C.5.

Gambar IV.C.5. hasil pergantian semua content pada slide kedua

7. Untuk mengganti materi/poin pada slide-slide berikutnya, caranya sama dengan langkah (5) dan (6)

D. Menambahkan Suara Pada Slide Opening

33


UKMF MATRIKS

2010

Rasanya seperti presentasi pake OHP saja kalau kita tidak menmbahkan efek suara pada slide presentasi kita. Pada pelatihan ini kita akan memasukkan efek suara pada slide opening. 1. Pada Timeline Klik layer content frame 1 lalu Klik menu File > Import > Import to

Stage pilih file suara 01 intro.mp3 2. Pada Properties, pilih sound : 01 intro.mp3, Sync : Start (agar play saat slide opening).

Lihat gambar IV.D.1

Gambar IV.D.1 Properties pada layer content frame 1

3. Pada Timeline Klik layer actions frame 2, lalu tekan F9 untuk memanggil action, lalu tambahkan Action Script stopAllSounds();. Lihat gambar Lihat gambar IV.D.2

Gambar IV.D.2 Actions pada layer actions frame 2

E. Cara Menambahkan Slide Presentasi

Secara standard, template presentasi Macromedia Flash hanya menyediakan lima slide, hal ini bisa dilihat pada layer content yang mempunyai lima keyframe dan jumlah framenya yang berjumlah lima. Bagaimana seandainya kita mempunyai materi yang memerlukan lebih dari lima?, Bisakah?, Ya harus bisa dong. Pada latihan ini, kita akan menambahkan sebuah slide lagi, yaitu slide enam. 1. Klik frame 6 pada layer buttons, lalu sambil menekan tombol Shift dikeyboard, klik pada

layer bg purple sehingga frame 6 pada semua layer akan terpilih. Lihat gambar IV.E.1.

34


UKMF MATRIKS

2010

Gambar IV.E.1. Frame 6 pada semua layer dalam keadaan terpilih kecuali action

2. Klik menu Insert > Timeline > Frame untuk memasukan frame kosong pada semua layer yang terpilih.

3. Masukkan keyframe pada frame 6 di layer content. Lihat gambar IV.E.2

Gambar IV.E.2. Memasukan keyframe pada Frame 6 di layer content

4. Gantilah materi pada slide 6 (frame 6) dengan materi yang kita milliki.

F. Menganti Background Presentasi. Secara standard, template presentasi dengan model Tech Presentation menggunakan

background garis-garis (layer bg Overlay lines) dan warna background biru (layar biru). Pada latihan ini, kita akan mengganti warna latar belakangnya yang semula berwarna biru menjadi oranye. 1. Klik frame 1 pada layer bg blue, lalu tekan tombol Delete di keyboard sehingga frame 1

pada layer bg blue akan kosong. Lihat gambar selanjutnya.

35


UKMF MATRIKS

2010

2. Hal ini berarti bahwa tidak ada objek pada layer bg blue dan secara otomatis yang aktif

adalah layer di bawahnya, yaitu layer bg red orange sehingga saat ini latar belakangnya berwarna orange.

Sumber: Pelatihan Macromedia Flash Jurusan Pendidikan Teknik Elektro FT UNY

pelatihan macromedia flash ukmf matriks 2010

Documents