Jumat, 18 Januari 2013

[Enter Post Title Here]


MEMBUAT PRESENTASI DENGAN MENGGUNAKAN MACROMEDIA FLASH MX 2004


GRAPHIC, BUTTON DAN MOVIE CLIP

Sebelum  kita  memulai  membuat  tampilan  presentasi,  alangkah  lebih  baik  apabila  kita kenal  terlebih  dahulu  objek/  simbol  apa  saja  yang  ada  pada  macromedia  flash  dan bagaimana cara membuat objek tersebut :
             Graphic

Graphic adalah simbol berupa gambar diam. Simbol ini di dalam tampilan sebuah file   presentasi   biasanya   dijadikan   sebagai   background   presentasi.   Karena merupakan  sebuah  gambar  diam,  maka  apabila  kita  membuat  animasi  di  dalam timelinenya,  maka  animasi  tersebut  tidak  akan  berjalan.  Anda  tidak  percaya  ? Coba buktikan !
Cara membuat objek/ symbol berupa graphic adalah sebagai berikut :

-              buat layer baru, beri nama graphic



-              buat  sebuah  objek  yang  anda  rencanakan  sebagai  background  sebuah tampilan presentasi



-              klik kanan objek tersebut, pilih Convert to Symbol, pilih Graphic





-              klik OK

-              untuk  masuk  ke  timeline  graphic,  klik  dua  kali  gambar  yang  telah  anda ubah menjadi symbol graphic tadi.





















Tanda yang menunjukkan bahwa
graphic berupa BACKGROUND
berada di dalam Scene 1



             Button

Button   adalah   simbol   yang   berfungsi   sebagai   tombol   yang   dapat   diklik. Merupakan asset yang menunjukkan betapa interaktifnya Flash. Semula memang kelihatan  sedikit  rumit,  tapi  percaya  deh,  buttons  ini  kalau  kita  telah  latihan sedikit akan sangat mengasikkan.
Terdapat  4  State  atau  keadaan  pada  button  yang  bisa  kita  gunakan  agar  button lebih  menarik.  Kondisinya  sama  yakni  dengan  layer  kita  bisa  meletakkan  lebih dari satu item pada button. State itu antara lain Up State, Over State, Down State, dan Hit State.



   UP State,
adalah kondisi button sepanjang movie, normal dan tidak mengalami perubahan apa-apa.





   OVER State,

adalah kondisi button bila mouse berada di atasnya, dapat berupa perubahan warna, suara dan lain-lain.
   DOWN State,

Bila user menekan dan melepas mouse pada button, tidak perlu selalu ada namun akan sangat manis ditambahkan untuk lebih menunjukkan interaktivitas.
   HIT State,

Merupakan area panas dari tombol, katakanlah anda menginginkan hanya

bagian tertentu dari button yang menimbulkan efek button, bila pada HIT state anda selipkan keyframe maka pastikan bahwa area tersebut tidak kosong
karena akan menyebabkan tombol anda tidak akan berfungsi.



Cara membuat button :

                Buat layer baru, kemudian beri nama BUTTON



                Buatlah sebuah objek pada Layer BUTTON tersebut.

                Klik  kanan  di  objek  tersebut  kemudian  pilih  Convert  to  Symbol,  pilih

Button. Beri nama button tersebut, misal NEXT.





                Klik 2X di objek yang telah anda ubah menjadi button tersebut.

                Klik kanan pada Over State

                Pilih Insert Keyframe


Tanda yang
menunjukkan bahwa
Button NEXT berada di dalam Scene 1











                Saat  playhead  berada  pada  posisi  over  state,  ubah  warna  objek  menjadi

warna yang berbeda.



                Jalankan movie dengan menekan Tombol Ctrl + Enter


MEMBUAT TOMBOL BERANIMASI


   Kita  harus  telah  memahami  movie  clip,  untuk  membuat  sebuah  tombol beranimasi,  atau  animated  buttons.  Namun  prinsipnya  tidak  berbeda  dengan tombol regular.
   Misalnya  kita  hendak  memunculkan  sebuah  animasi  berupa  asteriks  yang berputar di latar belakang tombol pada Over State.
   Kembali pada simbol button  anda, aktif pada layer dimana ada obyek yang akan  kita  putar,  sehingga  obyek  tersebut  terpilih.  Kemudian  klik  f8  untuk

mengkonversi  syimbol  tersebut  menjadi  movie  clip.  Pilih  movie  clip  secara otomatis obyek tersebut menjadi movie clip.
   Double  klik  movie  tersebut,  maka  kita  akan  dibawa  pada  mode  edit  movie

clip. Buat keyframe seperti dibawah ini





   Masing-masing  keyframe  ini  mempunyai  paramater  90  derajad  agar  obyek

tersebut  berputar.  Drag  symbol  button  ini  ke  dalam  scene,  maka  tiap  kali kursor  berada  diatas  tombol  tersebut,  maka  akan  ada  animasi  yang  berputar dibelakang tombol tersebut.

tip:  Untuk  memasukkan  efek  suara  pada  tombol  anda,  yang  perlu  kita  lakukan hanya mengimpor sebuah sound, memilih state saat suara tersebut akan muncul, kemudian  klik  window>panel>sound,  dan  akan  muncul  dialog  menu,  kemudian pilih tab sound, kemudian pilih pula nama file suara yang tadi kita impor. Beres
!!!

tip: pada saat kita mulai mebuat sebuah simbol, terdapat cross hair (tanda silang tipis) yang merupakan titik tengah dari simbol tersebut. Sehingga saat kita men- drag  simbol  ke  work  area,  cross  hair  ini  akan  menjadi  referensi  posisi  simbol. Oleh karena itu merupakan kebiasaan yang baik sekali bila saat membuat sebuah simbol kita meletakkanya dengan referensi dari cross hair tersebut.

             Movie Clip

Movie  clip  adalah  simbol  yang  merupakan  serangkaian  gambar  didalamnya. Secara default movie ini akan dimainkan secara berulang-ulang. Adalah salah satu jenis  simbol,  namun  sering  terjadi  kekeliruan  dengan  movie.  Movie  adalah keseluruhan file shockwave anda, sementara movie clips merupakan bagian yang lebih  kecil  lagi,  yakni  sejenis  simbol  yang  boleh  dikatakan  merupakan  sejenis movie  di  dalam  movie,. Misalnya  anda  menyusun  sebuah  animasi,  nah  terdapat sebuah  struktur  yang  terus  menerus  berputar  sepanjang  movie,nah  itulah  movie clips, simbol. Salah satu bentuk simbol yang lain adalah graphics, juga memiliki time line seperti movie clips bedanya bila movie clips akan terus bermain meski frame  telah  berakhir  atau  anda  menggunakan  actions  stop,  sementara  graphics akan  berhenti.  Namun  demikian  walaupun  secara  default        movie  clip  ini  terus bermain, kita bisa mengontrol movie clip ini dengan memberikan action stop, go
to, atupun memberi action pada tombol untuk mengontrol movie clip.



Cara membuat movie clip :

                Buat layer baru, beri nama MOVIE CLIP.



                Buat objek seperti gambar berikut ini.











                Seleksi objek tersebut.

                Klik kanan pada objek.

                Pilih Convert to Symbol, pilih Movie Clip, beri nama PUTAR.











                Klik OK

                Masuk ke timeline movie clip PUTAR dengan klik 2X pada objek  yang telah kita ubah menjadi Movie Clip PUTAR tadi.
                Klik kanan pada frame 1, kemudian pilih create motion tween.



                Kemudian klik kanan pada frame 30, pilih Insert Keyframe.



                Klik pada frame 1, kemudian buka panel properties

                Pilih Rotatenya : CW atau CCW.





                Jalankan movie dengan tekan tombol Ctrl + Enter



ACTION SCRIPT

Bahasa  pemrograman  yang  dipakai  dalam  macromedia  flash  MX  ini  bernama  Action Script, dimanakah dan bagaimanakah cara memberikan action script ini akan kita bahas dengan penjelasan berikut ini :
Action script dapat ditempatkan pada :

             Frame

             Button

             Movie clip

Cara memberikan action script :

1.   Action di Frame

Action  Script  yang  diletakkan  di  frame  disebut  framescript.  Cara  meletakkan script di frame adalah sebagai berikut :
-              Tentukan pada frame berapakah yang akan diberi script, misal frame 20.

-              Meletakkan  script  harus  pada  keyframe,  kalau  di  frame  20  belum  ada keyframe, maka buatlah keyframe pada frame 20 terlebih dahulu dengan klik kanan pada frame 20 kemudian pilih insert keyframe.










-              Setelah itu bukalah panel action, pilih action yang ingin anda masukkan, misal anda akan memasukkan action stop, maka langkahnya yaitu dengan
klik pada Global Function>Timeline control>stop











Sebagai  catatan,  lihatlah  terlebih  dahulu  informasi  di  Panel  Action  apakah

script  yang  akan  kita  masukkan  atu  tuliskan  tersebut  benar-benar  berada  di

Frame  dengan  melihat  pada  status  panel  action  yang  seharusnya  bertuliskan

Action – Frame.



(Frame 20 telah terisi script stop, dengan ditandai berupa tanda (a) kecil pada keyframe 20)
2.   Action di Button

Action Script yang diletakkan di frame disebut buttonscript. Cara meletakkan script di button adalah sebagai berikut :
-              Klik pada objek button yang akan kita beri action script




-              Buka panel action, pastikan informasi panel action menunjukkan Action –

Button.



-              Ketikkan on (     maka akan muncul event-event di button, pilih release.



-              Kemudian beri tanda ) <kurung tutup>

-              Beri tanda {

-              Pilih action yang ada di button, misal kita pilih NextFrame sebagai action untuk menuju ke frame selanjutnya.
-              Akhiri dengan memberi tanda }

-              Script tertulis secara lengkap sebagai berikut :



Berikut ini penjelasan tentang event-event yang ada di button termasuk event

release yang telah kita gunakan di atas :
-              press     : kejadian saat tombol mouse ditekan
-              release : kejadian saat tombol mouse ditekan dan kemudian

dilepas

-              releaseOutside : kejadian saat tombol mouse ditekan dan kemudian dilepas di luar area objek tombol.
-              rollOver                : kejadian saat kursor mouse masuk dalam area

objek  tombol.  Pada  saat  ini  tombol  mouse  belum ditekan.
-              rollOut  : kejadian saat kursor mouse masuk dan kemudian keluar dari area objek tombol. Pada saat ini tombol mouse belum ditekan.
-              dragOver             : kejadian saat tombol mouse ditekan dan kemudian keluar  dari  area  tombol.  Pada  saat  ini  tombol mouse masih ditekan, belum dilepas.
-              dragOut               : kejadian saat tombol mouse ditekan kemudian

keluar dari area tombol, lalu masuk lagi ke dalam area  tombol.  Pada  saat  ini  tombol  mouse  masih
ditekan, belum dilepas.

3.   Action di Movie Clip

-              klik objek movie clip dimana kita akan memberikan action script

-              buka panel action, pastikan informasi panel action menunjukkan Action – Movie Clip.



-              Ketikkan onClipEvent (  maka akan muncul event-event di button, pilih

load.

-              Kemudian beri tanda ) <kurung tutup>

-              Beri tanda {

-              Tuliskan perintah untuk movie clipnya, misal i = 0

-              Akhiri dengan memeberi tanda }

-              Script tertulis secara lengkap sebagai berikut :



Arti dari event load dan enterFrame adalah sebagai berikut :

load       : kejadian saat movie clip pertama kali muncul di stage

enterFrame        : kejadian saat movie clip masih berada di dalam stage

MEMBUAT FILE PRESENTASI

1.   Buat struktur layer sesuai dengan objek  yang kita butuhkan, misalkan kita akan membuat  presentasi  dengan  objek  berupa  :  background,  button,  movie  clip  dan
text isi. Maka kita buat struktur layer yang dibutuhkan sebagai berikut :
-              Background        : untuk menempatkan objek background
-              Button  : untuk menempatkan objek berupa tombol/ button
-              Movie clip           : untuk menempatkan objek movie clip
-              Isi            : untuk menempatkan objek berupa teks isi presentasi
-              Action   : sebagai layer dimana kita menempatkan action script

Untuk lebih jelasnya lihat gambar berikut ini :



2.   Buatlah objek pada masing-masing layer yang telah disiapkan

-              Membuat Background
Pastikan anda aktif di layer BACKGROUND. Background yang akan kita buat adalah background dengan bentuk seperti gambar berikut ini :















Cara membuat background seperti gambar diatas :

             Buat kotak dengan ukuran Round Rectangle Radius>Corner Radius sebesar 30 points. Stroke color dibuat none (tanpa garis tepi).












             Buat objek berupa bentuk kapsul sebagai berikut, berikan warna yang berbeda dengan objek kotak, kemudian letakkan di dalam kotak background yang telah kita buat, objek ini berada pada satu layer yaitu layer BACKGROUND. Objek kapsul ini digunakan untuk memotong objek kotak background yang telah kita buat sebelumnya.
             Buat juga objek berupa lingkaran, tempatkan seperti pada gambar.

             Delete objek kapsul dan lingkaran sehingga objek kotak berubah

menjadi seperti tampilan sebagai berikut :















             Buat warna gradasi radial seperti gambar berikut ini





-              Memanfaatkan Tombol Pada Common Library

Sebagaimana   kita   ketahui   bahwa   Flash   memiliki   property   berupa kumpulan  button  yang ditempatkan  pada  panel  Common  Libraries.  Cara untuk  menampilkan  Panel  Common  Libraries  adalah  dengan  klik  menu Windows> Other Panels> Common Libraries> Buttons


Buka Folder Playback, klik pada gel Left (lihat gambar atas). Tarik tampilan tombol ke stage pada layer BUTTON.


















Lakukan hal yang sama untuk tombol gel Right dan tombol Stop. Sehingga objek tersusun seperti gambar berikut :

               
-              Memasukkan Isi

                Susun layer-layer yang ada seperti gambar berikut:




                Perpanjang tampilan sampai 5 frame, kita umpamakan bahwa setiap

frame   yang  ada  pada  tampilan  adalah  setiap  halaman  tampilan presentasi.
                Klik  kanan  pada  frame  5  kemudian  pilih  Insert  Frame pada  layer

BACKGROUND, BUTTON dan ACTION.



                Klik  kanan  kemudian  Insert  Blank  Keyframe untuk  setiap  frame pada layer ISI dan MOVIE CLIP.


                Isikan pada setiap frame di layer ISI dengan teks isi yang telah anda persiapkan.  Isikan  teks  untuk  halaman  1  di  frame  1,  halaman  2  di frame 2, dan seterusnya.

Berikut ini 3 halaman presentasi sebagai contohnya :



Halaman 1





Halaman 2





Halaman 3

-              Membuat Animasi Movie Clips

   Buat  movie  clip  pada  setiap  frame  di  Layer  Movie  Clip  seperti  trik membuat movie clip diatas.
   Baiklah  kita  mulai  dari  frame  1  di  layer  MOVIE  CLIP  (halaman  1), kita   akan   membuat   movie   clip   berupa   kotak   yang   muncul   dan bertambah dari kiri ke kanan.


   Buatlah  kotak  dengan  warna  putih,  tanpa  garis  tepi  seperti  gambar berikut ini :


   Kemudian   klik   kanan   di   objek   kotak   tersebut,   pilih   Convert   to

Symbol> Movie Clip.



   Masuklah  ke  timeline  dari  Movie  Clip  KOTAK  yang  baru  kita  buat dengan Klik 2X pada objek kotak tersebut. Sehingga timeline berubah menjadi sebagai berikut :




   Terlihat   pada   gambar   diatas   bahwa   terdapat   Objek   Movie   Clip

bernama KOTAK pada Scene 1.

   Kemudian klik kanan di frame 5>  Insert Keyframe. Pada frame ke-5

tersebut buat kotak yang kedua sejarar dengan kotak pertama.



   Klik kanan di Farme 10> Insert Keyframe. Pada frame ke-10 buatlah kotak yeng ke-3 sejajar dengan kotak no-1 dan 2


   Teruskan   sampai   berapa   kotak         yang   ingin   anda   buat   dengan penambahan frame untuk setiap kotak dilakukan sebanyak 5 frame.
   Apabila  sudah  keluarlah  dari  timeline  KOTAK  dengan  Klik  Scane  1

pada Timeline.


   Ulangi  langkah  membuat movie clip di  atas untuk frame 2  sampai 5

pada Layer MOVIE CLIP diatas.



-              Memberi Action Pada Frame

Frame yang akan kita beri action adalah Frame 1 di Layer ACTION, Klik

Frame 1 di Layer Action



Kemudian buka Panel Action. Berikan Action Stop.



Lihatlah ke Frame 1 Layer ACTION, terdapat tanda a (kecil) pada frame tersebut, artinya bahwa frame tersebut telah diberi action script.


-              Memberi Action Di Tombol

Buka Layer BUTTON, kemudian klik tombol gel Right di Stage. Buka Panel Action
Berikan Action berikut :



seperti langkah diatas, lakukan pemberian

3.   Mem-Publish File

Mem-publish  File  dalam  hal  ini  adalah  membuat  file  eksekusi.  Secara  default, ekstensi  file  animasi  yang  telah  dibuat  menggunakan  flash  berupa  file  dengan type  *.fla  dan  *.swf.  File  ini  tidak  dapat  dijalankan  pada  computer  yang  belum terinstal program Macromedia Flash, sehingga apabila kita akan menjalankan file tersebut, kita harus menginstal Macromedia Flash terlebih dahulu.
Oleh karena itu Macromedia Flash memiliki fasilitas Publish yang dapat membuat file eksekusi yang dapat dijalankan di semua computer tanpa harus terinstal Flash. File ini bertipe *.exe.
Untuk membuat file bertipe *.exe ini, caranya adalah sebagai berikut :

   Setelah   anda   selesai   dalam   membuat   file   presentasi   pada   Program

Macromedia Flash, kemudian klik tombol Menu pada Menu Bar.

   Pilih Publish Setting



   Akan  terlihat  beberapa  File  yang  dapat  dihasilkan  dari  Publish  yang dilakukan pada Macromedia Flash.
   Beri tanda Check (√) pada pilihan Windows Projektor (.exe)



   Kemudian klik tombol Publish

   Lihatlah pada directory penyimpanan file flash anda, terlihat satu file baru bertipe (*.exe).


Demikianlah  uraian  secara  singkat  tentang  Dasar-Dasar  Macromedia  Flash  dan bagaimana  membuat  file  presentasi  dengan  program  tersebut.  Akhir  kata  semoga  apa yang telah disusun dapat memberikan manfaat bagi yang mempelajarinya.


Daftar Pustaka :

Lukmanul Hakim. 2003. 111 Rahasia dan  Trik Kreatif Macromedia Flash  MX. Elex Media Komputindo. Jakarta
Zeembry.  2005.  123  Tip  &  Trik  Action  Script  Flash  MX  2004.  Elex  Media

Komputindo. Jakarta

www.ilmukomputer.com

Pixel Media….. Tutorial Macromedia Flash. Pixel Media. Yogyakarta



Tidak ada komentar:

Posting Komentar