tutorial present as i meng gun a kan flash

pL4nkt0n | [email protected]

1 Presentasi menggunakan Macromedia Flash 8

MEMBUAT PRESENTASI DENGAN MENGGUNAKAN

MACROMEDIA FLASH 8

Area kerja Flash 8

Area kerja Macromedia Flash (mx, mx 2004, dan flash 8) pada dasarnya

terdiri atas beberapa komponen yaitu Menu, Toolbox, Timeline, Stage dan Panel.

- MENU : berisi kontrol untuk berbagai fungsi seperti membuat, membuka, menyimpan

file, dan sebagainya sesuai dengan menu yang ditampilkan.

- STAGE : area persegi empat yang merupakan tempat dimana kita membuat

obyek animasi atau aplikasi yang akan di jalankan.

- TOOLBOX : berisi menu untuk membuat atau menggambar bentuk . Toolbox terbagi

menjadi empat bagian yaitu drawing tool, view, color, dan option

- TIMELINE : tempat kita dapat membuat dan mengontrol obyek dan animasi.

- PANEL : berisi kontrol fungsi yang dipakai dalam Flash yaitu untuk mengganti dan

memodifikasi berbagai properti obyek animasi dengan cepat



Kita akan coba membuat presentasi sederhana yang menarik dengan menggunakan

Macromedia Flash 8. Namun akan lebih baik jika sebelumnya kita telah mengetahui symbol /

objek apa saja yang ada di Macromedia Flash 8. Simbol-simbol tersebut adalah:

a Movie Clip Movie clip adalah simbol yang merupakan serangkaian gambar didalamnya. Secara

default movie ini akan dimainkan secara berulang-ulang. Movie clip berbeda dengan

movie, jika movie adalah keseluruhan dari serangkaian symbol, sedangkan movie clip

adalah bagian dari movie yang berisi serangkaian objek yang telah dibuat dan dapat

berjalan. Bisa dikatakan movie clip adalah bagian movie di dalam movie. Contoh

membuat movie clip:

- Buat layer dan beri nama, misal movie clip. Untuk membuat layer bisa dengan cara

klik kanan pada layer insert layer, atau klik icon di bagian bawah panel

layer.

- Klik frame 1 di layer movie clip

- Buatlah gambar lingkaran di dalam stage sebelah kiri pojok menggunakan oval tool

- Pilih selection tool , klik dua kali pada lingkaran agar garis tepi dan bagian

dalam lingkaran terseleksi

- Klik kanan pada gambar lingkaran kemudian pilih convert to symbol, maka akan

muncul kotak dialog, beri nama movie clip (misal jalan),lalu pilih Movie Clip pada

radio button dan pilih titik tengah pada registration,kemudian klik OK



- Setelah itu lingkaran yang kita buat telah menjadi movie clip akan tetapi belum ada

animasinya, untuk itu pilih selection tool (v) dan klik dua kali titik yang ada di tengah

lingkaran

- Selanjutnya kita telah masuk ke dalam movie clip jalan

- Pada frame 15 layer movie clip, klik kanan dan pilih insert keyframe (F6), maka

dalam frame 1-15 akan terdapat gambar lingkaran yang sama

- Klik frame 15

- Pilih selection tool kemudian drag gambar lingkaran ke pojok kanan stage

- Klik kanan pada frame tengah antara 1-15 kemudian pilih Create Motion Tween

- Setelah itu tekan ctrl+enter, maka gambar lingkaran tadi akan bergerak dari pojok

kiri ke pojok kanan stage.

a Graphic Graphic adalah simbol yang berupa gambar diam. Dan dalam presentasi biasanya

digunakan sebagai background. Karena merupakan gambar diam, maka apabila kita

membuat animasi di dalam timelinenya maka gambar tersebut tidak akan berjalan. Cara

membuatnya sama dengan membuat movie clip hanya saja pada pilihan convert to

symbol kita memilih graphic. Dan untuk masuk ke timeline graphic tersebut juga sama

yaitu dengan cara klik dua kali pada objek/simbol graphic yang telah kita buat.

a Button Button adalah simbol yang berfungsi sebagai tombol yang dapat diklik. Terdapat 4 state

atau keadaan pada button yang bisa digunakan agar button lebih menarik, yang dalam

Ket: frame 1 adalah titik awal objek, karena kita membuat hanya sampai frame 15 maka pada

frame 15 itulah titik akhir objek dalam timeline. Pada frame 1 objek berada di sebelah kiri dan

pada frame terakhir objek berada di sebelah kanan, ketika dibuat motion tween (klik kanan-

create motion tween) maka objek akan bergerak dari sebelah kiri ke kanan.



masing-masing state itu juga bisa kita masukkan movie clip. Sama seperti simbol lain,

kita juga bisa meletakkan lebih dari satu item dalam button, yaitu dengan menggunakan

layer. Ke 4 state button tersebut yaitu Up State, Over State, Down State, dan Hit State.

k Up State Keadaan button pada saat normal, atau belum mengalami perubahan apa-apa.

k Over State Keadaan button pada saat berada di bawah pointer/mouse. Dapat berupa

perubahan warna, efek suara, ataupun animasi. Misalnya ada sebuah button

berwarna merah, dan ketika mouse berada di atasnya button tersebut berubah

menjadi kuning.

k Down State Yaitu keadaan ketika button ditekan menggunakan mouse. Tidak perlu selalu ada

animasi dalam state ini, namun bisa juga ditambahkan untuk mempercantik

tampilan.

k Hit State Bisa dibilang area panas dari tombol, misalkan anda ingin hanya bagian tertentu

pada button yang menimbulkan efek.

Contoh membuat button:

- Buat layer baru, beri nama misal button

- Dengan menggunakan alat-alat pada toolbox, buat sebuah objek pada layer

tersebut, misalkan bentuk segi empat dengan warna biru

- Convert gambar/objek yang telah kita buat menjadi button dan beri nama misal

start dengan cara seperti yang sudah kita lakukan. (klik kanan Convert to

Symbol button OK)



- Klik dua kali pada objek yang telah kita buat menjadi button

- Setelah kita masuk ke dalam timeline button kita akan melihat 4 button state dan

layer yang ada di panel layer

- Saat ini kita mempunyai button dengan bentuk segi empat namun hanya terletak

pada Up state, untuk itu kita gandakan segi empat tadi ke Over state dan Down state

dengan cara klik pada frame kemudian klik kanan dan insert keyframe

- Pada Over state kita rubah warna biru segi empat menjadi hijau (selection tool

klik segi empat pilih warna hijau pada panel color)

- Masih di dalam button, kita buat layer baru dan beri nama teks

- Pada Up state layer teks kita buat teks untuk diletakkan di tengah segi empat

dengan cara klik ikon pada toolbox kemudian kita klik tengah segi empat dan

kita ketikkan Klik disini

- Pada Over state layer teks kita masukkan keyframe (klik kanan insert blank

keyframe) kemudian buatlah teks Start di tengah segi empat

menjadi



Macromedia flash 8 juga menyediakan button standar yang bisa kita dapatkan di panel

Common Libraries , cara menampilkan panel Common Libraries Button yaitu dengan cara klik

Window Common Libraries Button. Kita juga bisa mengedit button-button

tersebut seperti menambahkan animasi ataupun lainnya setelah kita masukkan button

tersebut ke Library Kita

- Tekan ctrl+enter, maka anda akan melihat sebuah button berwarna biru dengan

tulisan klik disini pada bagian tengahnya, namun ketika anda dekatkan mouse

maka warna biru tersebut akan berubah menjadi hijau dan teksnya juga berubah

menjadi start seperti yang tadi telah kita buat.

Action Script

Dalam Macromedia Flash (mx, mx 2004, dan flash 8) juga terdapat bahasa

pemrograman yang digunakan untuk memberikan perintahperintah serta menjalankan fungsi

yang dapat kita atur, yaitu Action Script. Action script dapat ditempatkan pada Frame, Button,

dan Movie clip. Penggunaan action script dalam flash sangat penting, terlebih dalam

pembuatan game-game maupun program lain yang menggunakan flash. Dalam membuat file

presentasi sendiri, action script juga sangat diperlukan meskipun tidak sebanyak dan serumit

dalam pembuatan game. Karena action script yang digunakan dalam membuat presentasi

cukup sederhana, maka contoh perintah serta penggunaannya akan saya jelaskan nanti pada

saat pembuatan presentasi.



MEMBUAT PRESENTASI

Presentasi yang akan kita buat terdiri dari beberapa layer dengan masing-masing

kegunaannya.

Langkah 1 :

" Buka Macromedia Flash8 Create New Flash Document " Buatlah Layer sebanyak 5 layer dan beri nama pada masing-masing layer

- action script = layer yang nanti digunakan untuk meletakkan action script

- animasi = untuk menambahkan animasi (jika diperlukan)

- materi = layer untuk menempatkan isi presentasi

- button = layer tempat button

- background = untuk menempatkan gambar sebagai background

" Aktifkan layer background dengan cara klik pada pada layer baground " Pada frame 1 layer background kita letakkan gambar yang akan kita gunakan sebagai

background dengan cara : klik menu File Import Import to library, setelah

kita memilih objek klik OK. Maka dalam panel library kita akan ada gambar yang kita

import

" Drag gambar dari panel library ke dalam stage kemudian sesuaikan ukurannya dengan

menggunakan Free Transformation Tool (ikon / tekan Q). Untuk memudahkan, kita

buat gambar tersebut tidak tampak dengan klik icon kotak yang ada pada layer,

maka yang tampak hanyalah Outline dari gambar tersebut.

Setelah kita sesuaikan ukurannya kita klik lagi icon yang sama

" Klik frame 15 layer background tekan F6 pada frame antara 1-15 klik kanan a Create motion tween

" Klik frame 1 layer background klik gambar dalam stage buka panel properties (Window Properties Properties / dengan menekan ctrl+F3)



" Pada panel properties isi color dengan Brightness -100%

" Lakukan hal yang sama pada frame 15, yaitu klik frame 15 klik gambar dalam stage a properties color: Brightness 0%

" Ketikkan action script stop(); (tanpa tanda petik) pada frame 16 layer action script.

Ingat, untuk menulis action script pastikan bahwa terdapat keyframe pada frame yang

akan kita gunakan untuk meletakannya.

Penjelasan : pemberian action script stop(); disini berguna untuk menghentikan

pemutaran movie yang secara default akan diputar berulang terus menerus, sehingga

ketika sampai pada frame 16 movie akan berhenti akan tetapi tidak menghentikan

movie clip yang mungkin terdapat dalam frame 16. Misalnya, dalam frame 16 terdapat

movie clip roda berputar, ketika frame 16 diberi action script stop maka movie clip roda

tadi tetap akan berputar, kecuali bila action stop juga dituliskan dalam timeline movie

clip roda.



Untuk memudahkan penulisan action script, kita dapat memanfaatkan script assist yang

terdapat pada panel Actions. Ketika dalam mode Script Assist, kita tidak dapat langsung

menuliskan script akan tetapi kita diberi pilihan action yang akan digunakan. Misalnya ketika

kita akan menuliskan stop(); dalam mode Script assist, kita hanya perlu klik 2 kali pada pilihan

yang terdapat di sebelah kiri stage penulisan script. (Global Function Timeline Control stop)

" Selanjutnya aktifkan layer materi, buat keyframe pada frame ke 16. Kemudian tulis judul

presentasi menggunakan Text tool ( T ) di dalam stage (ex. VIRUS Karakteristik dan

Pentebarannya) kemudian kita letakkan di bagian atas . Di sini saya menggunakan

judul dan materi mengenai virus sebagai contoh

" Ubah teks judul yang kita buat menjadi movie clip (klik kanan convert to symbol). Beri nama materi, kemudian masuklah ke dalam timeline movie clip materi yang baru

kita buat

" Di dalam movie clip materi juga kita buat beberapa layer, yaitu: o Action script = tempat action script

o Button = untuk meletakkan tombol

o Judul = (layer dimana teks judul yang kita buat berada)

o Materi = layer untuk materi-isi presentasi

o Background = sebagai background ke 2 yang nanti akan kita buat sedikit

transparan

" Pada layer judul (tempat teks judul yang tadi kita buat), antara frame 1-15 buatlah motion tween, setelah itu pada frame 1 klik sekali pada gambar(teks judul) kemudian

kita ubah propertiesnya dengan color: Tint ; 100% dg warna biru terang



Pada frame 15 kita tarik posisi teks judul yang tadi di atas ke tengah stage, kemudian

ubah propertiesnya menjadi color: Tint ; 0%

" Masukkan perintah stop pada frame 15 layer action script agar saat melewati frame 15 movie clip akan berhenti, dan untuk melanjutkannya akan kita gunakan button. Untuk

itu kita ambil button yang sudah ada di common libraries (Window Common

Libraries button). Kemudian letakkan di bagian pojok kanan bawah

" Agar dapat berfungsi, masukkan script berikut ke dalam button : on (release) {

gotoAndPlay(16);

}

Penjelasan: baris pertama menunjukkan bahwa fungsi tombol akan dijalankan ketika

tombol sudah ditekan kemudian dilepas, sedangkan baris kedua menunjukkan bahwa

setelah tombol dieksekusi maka movie clip akan melompat ke frame 16 kemudian

dijalankan



" Buatlah background ke 2 dalam frame 16 layer background (movie clip judul). Aktifkan

rectangle tool (R) , atur warna Fill Color dengan warna gradient

kemudian isikan nilai 15 pada Set Corner Radius dengan cara klik

Buatlah segi empat dengan ukuran yang hampir memenuhi stage, sisakan ruang di

sebelah atas stage untuk tempat button menu. Setelah segi empat terbentuk kemudian

klik Gradien Transform Tool (F) lalu klik segi empat maka akan muncul garis dan

panah kecil yang dapat digunakan untuk mengatur gradasi warna

" Convert segi empat menjadi Graphic dan atur Propertiesnya menjadi color : Alpha 50%

Membuat menu

" Aktifkan layer Button, pada frame ke 16 buatlah segi empat dengan menggunakan rectangle tool sebanyak empat buah (menurut kebutuhan) atur warna dan sesuaikan

ukurannya, ini akan kita gunakan sebagai tombol yang berfungsi untuk memilih menu

dari materi.



" Masing-masing dari keempat persegi tadi convert menjadi button (klik kanan pada objek Convert to Symbol), beri nama masing-masing button

" Masuklah ke dalam timeline button dan tambahkan layer baru, beri nama layer teks. Pada frame UP layer teks tulislah teks PENGERTIAN yang kita letakkan di tengah

button dan berfungsi sebagai menu, sebelumnya pastikan terdapat keyframe di dalam

frame tersebut. Berilah warna biru pada teks PENGERTIAN ini (masih dalam frame

UP). Setelah itu klik frame OVER insert keyframe (F6) ubah warna teks

PENGERTIAN pada frame OVER menjadi berwarna ungu

" Lakukan hal yang sama pada masing-masing button, hanya saja berbeda dalam pemberian teks untuk nama menu, misalkan PENGERTIAN SEJARAH JENIS dll

" Susunlah button-button tersebut berjejer sejajar di bagian atas stage.

Pada frame 16, sedikit turunkan button menu yang pertama sehingga menjadi terlihat

menonjol ke bawah, misalnya button PENGERTIAN seperti terlihat pada gambar, ini

hanya kita lakukan jika button menu PENGERTIAN masih dalam frame yang membahas

tentang pengertian. Jadi saat nanti kita berada dalam frame yang membahas tentang

SEJARAH misalnya, maka button menu yang kita tonjolkan ke bawah adalah button

menu SEJARAH, sedangkan untuk button menu PENGERTIAN dan menu-menu lain

tetap sejajar

Mengisikan materi

" Aktifkan layer materi, pada frame 16 isikan materi tentang pengertian. Apabila tidak cukup ruang, lanjutkan pada frame 17 dst

" Pada frame 16 layer button, tambahkan button dan letakkan di pojok bagian bawah stage, ini berguna sebagai tombol next maupun back jika isi/materi yang kita tuliskan

dalam stage tidak cukup sehingga harus dilanjutkan pada frame lain. Button ini dapat

kita ambil dari common library maupun kita buat sendiri

" Kemudian masukkan action script berikut ke dalam button untuk next (klik kanan pada button Action atau tekan F9)

on (release) {

nextFrame();

}



Sedangkan untuk button back

on (release) {

prevFrame();

}

Setelah frame PENGERTIAN (frame 16 atau 16-17) selesai kita buat lengkap dengan

isinya, kemudian kita beralih ke frame selanjutnya yang akan kita isi materi dari button

menu yang kedua, misalnya SEJARAH VIRUS

" Tuliskan isi/materi yang selanjutnya ke dalam stage, lakukan hal yang sama seperti tadi " Ulangi langkah-langkah di atas hingga semua materi selesai

Pemberian action script

" Klik button menu PENGERTIAN, kemudian masukkan script berikut on (release) {

gotoAndStop(16);

}

Pada button menu SEJARAH

on (release) {

gotoAndStop(17);

}

Lakukan hingga kesemua button terisi action script dengan benar, untuk nomor frame

pada action script tersebut, sesuaikan dengan nomor dimana frame yang akan kita tuju

berada. Misalnya materi ASAL MULA berada dalam frame 17 maka gotoAndStop(17);

atau materi kriteria ada pada frame 25 maka gotoAndStop(25); begitu seterusnya.

Ujilah apakah presentasi yang kita buat telah berjalan lancar atau belum dengan

menekan Ctrl+Enter, jika semua telah lancar dalam artian button-button berfungsi serta

peletakkan frame telah benar, maka project ini siap untuk di Publish.

Sejauh ini kita telah membuat presentasi yang sudah dapat ditampilkan meskipun tidak

menutup kemungkinan masih bisa kita tambah atau kita hias dengan animasi-animasi

maupun hal-hal lain yang dapat kita tambahkan. Namun masih ada satu hal kecil namun

cukup penting dalam presentasi menggunakan Macromedia Flash 8 ini, yaitu ukuran

tampilannya yang kecil, padahal untuk sebuah presentasi tampilan fullscreen adalah

ukuran yang pas. Pada saat presentasi dijalankan kita dapat membuatnya tampil



memenuhi layar dengan menekan Ctrl+F, namun hal ini akan cukup merepotkan. Untuk

itu kita akan membuatnya menjadi fullscreen secara otomatis saat dijalankan, caranya:

Pada frame 1 layer action sript yang terluar (scene) masukkan script berikut

fscommand("fullscreen", "true");

Untuk exit bisa kita lakukan dengan menekan Esc, namun tidak ada salahnya jika kita

juga membuat tombol exit dalam presentasi kita, caranya:

Aktifkan layer button pada scene 1, pada frame 1 buatlah button kecil dan letakkan di

pojok kanan atas, kemudian tekan F5 di frame 16

Ketikkan action script berikut pada button exit

on (release) {

fscommand("quit");

}



" Setelah itu, Publish lah project presentasi kita. Sebelumnya atur dahulu Publish Settingnya, yaitu File Publish setting (Ctrl+Shift+F12) lalu centang pada Flash

(.swf) dan Windows Projector (.exe), atau yang lainnya OK, atau juga dapat

langsung kita tekan tombol Publish. SELESAI

tutorial present as i meng gun a kan flash

Documents