Macromedia Flash MX - … flash yang divisualisasikan di stage dapat dibagi menjadi ... Macromedia...

Click here to load reader

  • date post

    20-May-2018
  • Category

    Documents

  • view

    219
  • download

    2

Embed Size (px)

Transcript of Macromedia Flash MX - … flash yang divisualisasikan di stage dapat dibagi menjadi ... Macromedia...

  • Macromedia Flash MX Page 1 of 41

    Macromedia Flash MX

    Belajar membuat animasi dengan menggunakan Macromedia Flash MX Menggunakan berbagai macam efek animasi Memahami penggunaan Actionscript Membuat presentasi multimedia

  • Macromedia Flash MX Page 2 of 41

    Bagian 1 Perkenalan lingkungan kerja dan tools-tools

    Macromedia Flash adalah sebuah tool yang dapat digunakan untuk membuat berbagai macam animasi, presentasi, game bahkan perangkat ajar. Selain itu Flash MX ini dapat digunakan sebagai tool untuk mendesain web, dan berbagai aplikasi multimedia lainnya.

    Start Page

    Ada beberapa menu di halaman awal macromedia Flash MX professional 2004, yaitu:

    Open a Recent Item Merupakan kategori yang menampilkan semua file / dokumen flash yang sudah dibuat dalam ekstension .fla Open Merupakan perintah untuk membuka dokumen yang sudah pernah dibuat namun tidak tercakup di Open Recent Item karena keterbatasan tempat.

  • Macromedia Flash MX Page 3 of 41

    Create New Merupakan perintah untuk membuat dokumen/ file flash baru.

    Create from Template Merupakan template yang disediakan oleh Macromedia dalam bentuk user Interface

    Extend Perintah ini akan memanggil situs web macromedia untuk sesion Exchange.

    Learn

    Merupakan perintah untuk menuju ke halaman bantuan Flash (Help).

    Pertama-tama kita harus mengenal terlebih dahulu lingkungan kerja Macromedia

    Flash. Pada bagian kiri terdapat Tools, di bagian atas tengah Timeline, yang

    digunakan untuk mengatur timeline animasinya, dan pada bagian tengah-tengah

    terdapat Stage yaitu bagian yang visible secara visual saat di-publish atau di preview

    di browser.

    Stage

    TimeLine

    ToolsBox

    W o r k A r e a

  • Macromedia Flash MX Page 4 of 41

    Status Bar Gambar di samping adalah menu status bar yang digunakan untuk

    merubah zooming/ukuran stage secara keseluruhan, Option Fit in

    Window akan menampilkan stage saja, Option Show Frame akan

    Menampilkan Stage beserta Work Area, dan bila Show All akan ber

    -fokus pada objek yang ada.

    Hal-hal penting untuk diketahui :

    Untuk merubah warna background dan ukuran stage dapat dilakukan dengan :

    Klik kanan pada stage, lalu pilih Document Properties sehingga akan

    mengeluarkan dialog box seperti gambar di bawah.

    Atau dengan cara memilih menu Modify>Document (Ctrl+J).

    Ukuran stage dapat diubah pada option Dimensions dimana width untuk lebar stage dan height untuk tinggi stage, lebar dan tinggi minimum adalah 1 px, lebar dan tinggi maximum adalah 2880 px. Pada option Match :

    Printer Untuk merubah stage ke ukuran maximum available print area (ukuran stage akan mengikuti besarnya kertas yang dipakai).

    Contents

    Untuk menyesuaikan lebar dan tinggi Stage dengan objek yang ada, bila objek ditempatkan tepat di kiri atas Stage maka lebar stage akan sama besar dengan objek, bila tidak maka jarak dari kiri dan atas stage ke objek akan sama dengan jarak kanan bawah stage.

    Default

    Untuk merubah stage ke ukuran standard yaitu 550 x 400 pixel.

  • Macromedia Flash MX Page 5 of 41

    Tools Box

    Tools digunakan untuk menggambar dan memanipulasi gambar /objek.

    Tools terbagi menjadi 4 bagian besar yaitu :

    Tools pada bagian ini digunakan untuk mengedit dan memanipulasi objek.

    View pada bagian ini digunakan untuk memperbesar maupun memperkecil layar monitor.

    Colors pada bagian ini terdapat pallet untuk mengganti warna outline dan fill. Option bagian ini merupakan modifiers dari setiap tool yang dipilih, Setiap tool mempunyai modifiers yang berbeda-beda.

    Menggambar dengan Macromedia Flash Selection tools Tools ini biasanya digunakan untuk menseleksi object secara spesifik, dimana objek dalam flash yang divisualisasikan di stage dapat dibagi menjadi beberapa bagian yaitu shape dan symbol. Perbedaan mendasar pada shape dan symbol adalah bila kita membuat shape maka shape tersebut tidak akan tersimpan dalam library, objek ini akan tersimpan dalam keyframe dan frame dalam timeline bersangkutan.

    Selection tool(V) Tools ini digunakan untuk menyeleksi gambar secara langsung.

    Cara penggunaan : 1. Pilih select area (dengan mengklik kanan mouse lalu ditahan sambil di drag

    mousenya). 2. Select area terpilih. 3. Lakukan perubahan pada daerah yg terpilih (misal delete, memindahkan

    tempat,dll).

  • Macromedia Flash MX Page 6 of 41

    Modifier yang ada pada tool ini adalah :

    Straighten, option ini digunakan untuk meluruskan garis-garis outline yang telah dibuat, cara pakai sama seperti smooth.

    Subselection Tool (A)

    Tool ini digunakan untuk menyeleksi dan mengedit vertex-vertex yang terdapat dalam suatu objek.

    1. Memilih objek. 2. Objek terpilih dengan vertex-vertexnya. 3. Kita bisa mengadakan manipulasi terhadap vertex(contoh ditarik melebar). 4. Objek telah termanipulasi dangan bantuan Subselection Tool.

    Tidak terdapat modifier untuk tool ini.

    Lasso tool Tool ini digunakan untuk memilih objek sesuai dengan pergerakan mouse, lain halnya dengan selection tool diatas yang memilih objek dengan bentuk persegi panjang.

    1. Pilih objek yang akan dimanipulasi dengan menggerakan mouse melewati objek membentuk pola yang diinginkan.

    2. Batasan objek telah terpilih sesuai pola yang diinginkan(daerah yang terasir). 3. Lalu kita gunakan selection tool untuk mendrag daerah terasir tersebut ke arah

    yang diinginkan.

    Snap to object

    Smooth

    Straighten

    Snap to object, bila option ini aktif maka pada saat membuat atau memindahkan objek maka akan di-snaping antara satu objek ke objek lainnya. Smooth, option ini digunakan untuk menghaluskan outline yang telah dibuat, caranya seleksi outline yang akan di modify lalu click option ini.

    1 2 3

  • Macromedia Flash MX Page 7 of 41

    Modifier yang terdapat pada Lasso tool

    Magic Wand, Jika pilihan Magic Wand diaktifkan maka daerah yang di select akan sesuai dengan aturan pada magic wand propertiesnya. Magic Wand Properties, Mengatur setingan dari magic Wand seperti apakah edge yang di select akan smooth, Normal, dan sebagainya. Poligon Mode, Jika pilihan Poligon ini diaktifkan maka Daerah diselect dengan menggunakan batas-batas edge Yang lurus.

    Drawing tools Dengan tools yang ada pada drawing tools kita dapat membuat ilustrasi sendiri, semua object yang kita buat berupa shape.

    Line Tool(N)

    Tool ini digunakan untuk membuat garis.

    gunakan tombol shift bila ingin mendapatkan garis lurus.

    Oval Tool(O)

    Tool ini digunakan untuk membuat bentuk oval.

    gunakan tombol shift untuk membuat lingkaran penuh.

    Rectangle Tool(R)

    Tool ini digunakan untuk membuat persegi panjang

    gunakan tombol shift untuk membuat bujur sangkar.

    pilih custom pada menu properties untuk membuat rectangle lebih unik.

    PolyStar Tool

    Tool ini digunakan untuk membuat poligon misal segi-4, segi-5,dsb.

    Untuk memilih segi poligon tersebut dpt dilihat di menu plg properties yg ada paling

    bawah lalu pilih options. Lalu diisi saja Number of Sides yg dikehendaki.

    Magic Wand

    Magic Wand Properties

    Poligon Mode

  • Macromedia Flash MX Page 8 of 41

    Pen Tool(P) Tool ini berfungsi untuk menggambar path yang presisi dengan garis lurus atau

    lengkung.

    Untuk menggambar garis lurus, caranya klik pada titik pertama dan klik pada titik

    kedua sehingga terbentuk satu segmen garis.

    Gunakan shift untuk mendapatkan garis dengan arah kelipatan 45 derajat.

    Untuk menggambar garis lengkung, caranya klik pada titik pertama lalu drag pada titik

    kedua.

  • Macromedia Flash MX Page 9 of 41

    Pencil Tool(Y) Tool ini digunakan untuk menggambar garis, kurva dan bentuk lain seperti halnya kita

    menggambar dengan pensil.

    Modifier untuk tool ini adalah

    Brush Tool(B)

    Tool ini digunakan untuk melukis, dimana warna yang diwakili adalah warna fill. Sehingga tipe dari object yang anda buat dengan Brush Tool adalah fill bukan outline.

    Modifier untuk tool ini adalah

    Straighten, semua garis yang digambar akan bersifat kaku.

    Smooth, semua garis yang digambar akan bersifat lengkung. Ink, semua garis yang digambar akan sesuai dengan pergerakan mouse.

    Brush size

    Brush shape

    Brush type

    Lock Fill Lock Fill, dengan aktifnya option ini kita dapat mengikuti pola warna dari object yang di fill sebelumnya. Ini akan sangat efektif pada saat kita memakai gradiasi. Brush Type, pada option ini kita dapat memilih beberapa mode dengan fungsi tertentu.(liat gambar). Brush size, menentukan ukuran dari brush yang dipakai. Brush shape, menentukan bentuk dari brush yang dipakai.

    Brush Type

  • Macromedia Flash MX Page 10 of 41

    Eyedropper Tool Tool ini untuk mengambil sample warna dari fill dan stroke dimana toolnya akan

    berubah sesuai dengan sumber dari warna yang diambil,bila yang diambil dari stroke

    maka akan berubah menjadi Ink dan bila fill akan berubah menjadi Paint bucket.

    Eraser tool Tool ini digunakan untuk menghapus shape baik fill maupun stroke.

    Modifier untuk tool ini adalah:

    Ink bucket tool & Paint bucket tool

    Ink bucket tool, mengganti warna outline/stroke(garis) dari suatu objek. Paint bucket tool, mengganti warna fill dari suatu objek. Fill Color dan Stroke Untuk mengubah warna baik fill maupun stroke dapat dilakukan di color box tetapi selain dari sini kita juga dapat merubah kedua warna tersebut dengan menggunakan panel yaitu color swatch dan color mixer. Untuk mengaksesnya,pilih menu Window > Design Panel >Color Mixer/Color Swatches.

    Eraser shape

    Faucet

    Eraser mode

    Faucet, menghapus semua fill yang berwarna sama. Eraser mode, sama seperti brush mode. Eraser shape, bentuk dari penghapus.

    paint ink

  • Macromedia Flash MX Page 11 of 41

    Dari window color mixer ini, kita dapat mengisi warna dengan solid atau gradiasi atau bitmap, gradiasi akan sangat mempengaruhi besarnya file. Sedangkan dari window swatches adalah tempat kita menyimpan warna atau gradiasi baru yang ingin dipakai lagi.

  • Macromedia Flash MX Page 12 of 41

    Manipulasi gambar ( Transform ) Size and Rotate Kita dapat mengaktifkan menu transform dengan memilih Window > Design Panel > Transform.

    Selain dengan mengisi size and rotate pada window transform, kita juga dpt merubah size dengan menclik kanan objek kemudian pilih free transform , lalu mendrag edge pada objek (lihat gambar di bawah).

    Sedangkan untuk rotate, kita dapat merubahnya dengan men-klik pada objek kemudian pilih free transform, lalu mendekatkan mouse ke salah satu ujung edge sampai lambang rotate muncul, kemudian kita drag sesuai kebutuhan kita(lihat gambar dibawah).

    Constrain, Mempertahankan rasio awal antara lebar dan panjangnya

  • Macromedia Flash MX Page 13 of 41

    Layer Layer digunakan untuk memisahkan objek yg satu dengan objek lainnya.

    Untuk menambah layer klik pada gambar di kiri bawah(Insert Layer) pada window TimeLine. Dalam layer mengandung prinsip tumpukan kertas transparan, artinya objek pada layer di atas akan menimpa / menutupi objek yang dibuat pada layer sebelum-sebelumnya.

    Tulisan boboho ada pada layer 1

    Objek elips pada layer 2

    ???Layer 1 ada di atas layer 2??? ???maka objek pada layer 2 akan ditutupi oleh objek layer 1???

  • Macromedia Flash MX Page 14 of 41

    Bagian 2 Animasi Dasar

    Pada bagian ini kita akan mempelajari animasi-animasi dasar yang dikenal dengan sebut tweening. Ada dua macam Motion dan Shape.

    Motion Kita akan mencoba untuk membuat animasi gerakan sederhana. Sebelumnya kita akan mencoba menggerakkan suatu objek sederhana. Buatlah sebuah objek pada stage. Kemudian setelah membuat objeknya, pada bagian frame klik kanan pilih Create Motion Tween.

    Kemudian pada frame 35 misalkan klik kanan pilih Insert Keyframe. Setelah itu ubah posisi objek pada frame 35, misalkan di sebelah kanan. Maka dengan menggunakan dua keyframe tersebut objek akan bergerak dari posisi awal perlahan-lahan ke posisi akhirnya di frame 35. Lihat gambar berikut.

  • Macromedia Flash MX Page 15 of 41

    Jalankan dengan menggunakan Ctrl + Enter, untuk melihat hasilnya. Pada keyframe pertama letak objek adalah disebelah kiri, sedangkan pada keyframe kedua di 35 objek diletakkan pada posisi yang berbeda, maka objek tersebut akan dianimasikan bergerak dari keyframe pertama ke keyframe kedua. Objek akan bergerak dengan kecepatan yang ditentukan fps ( frame per second ). Secara default nilai dari fps adalah 12 yang berarti setiap 12 frame lamanya adalah satu detik. Kita dapat mengubah nilai default ini. Caranya masuk ke menu Modify > Document.

    Ubahlah nilai pada frame ratenya. Dimension digunakan untuk mengatur ukuran stage yang diinginkan. Background Color untuk menentukan warna background dari stage. Dalam membuat animasi dengan menggunakan frame pada Timeline memiliki Properties sendiri untuk memberikan efek tertentu pada animasinya. Kliklah pada frame pertama animasi. Kemudian cek di bagian bawah terdapat Properties.

  • Macromedia Flash MX Page 16 of 41

    Coba ubah nilai dari Ease, click tombol disebelahnya dan drag ke bawah. Maka animasinya akan mendapat efek berangsur-angsur semakin cepat, nilai percepatannya ditentukan dari nilai Easenya ( negatif untuk semakin cepat ). Ubah juga nilainya menjadi Out untuk mendapatkan efek semakin lambat. Kemudian coba juga ubah bagian Rotate, pilih CW ( Clockwise ) untuk searah jarum jam atau CCW ( Counter Clockwise ) untuk berlawanan dengan jarum jam. Maka objek akan berputar secara otomatis sejumlah yang ditentukan n times. Mengimpor gambar Kita dapat mengimpor gambar-gambar untuk dimasukkan ke dalam animasi flash kita. Pada bagian file pilih Import > Import to Library. Kemudian pilihlah file gambar yang ingin diimpor ke dalam Flash.

  • Macromedia Flash MX Page 17 of 41

    Pilihlah gambar yang ingin dimasukkan ke library. Kemudian klik Open. Untuk membuka library, pilih menu Windows > Library.

    Untuk memasukkan gambar tersebut ke stage, click and drag gambar pada library ke stage. Setelah itu gambarnya pun dapat dibuat efek motion, misalkan dibuat bergerak seperti contoh sebelumnya.

  • Macromedia Flash MX Page 18 of 41

    Shape Selain motion kita dapat membuat efek shape. Coba buat sebuah objek dengan drawing tool, misalkan membuat suatu lingkaran pada frame pertama dan sebuah kotak pada frame ke-35.

    Pada frame pertama, ubahlah properties tween menjadi Shape. Kemudian perhatikan warna pada bagian frame akan berubah menjadi warna hijau. Kemudian jalankan untuk melihat efeknya. Bentuk bola akan secara perlahan-lahan berubah menjadi bentuk kotak. Perubahan bentuk inilah yang disebut Shape.

    Contoh lain kita coba buat pada frame ke-50, sebuah objek teks. Ingatlah bahwa bentuk Shape bisa dilakukan hanya untuk vektor, sehingga objek teks yang kita buat harus kita pecah hingga menjadi vektor . Klik kanan pada objek teks untuk pilih Break Apart, atau tekan Ctrl + B.

    Sebelum Break Apart Setelah Break Apart 2 kali.

    Setelah ubahlah properties dari frame ke-35 tersebut, untuk bagian Tweennya menjadi Shape. Lihatlah efeknya, bentuk bulat akan secara bertahap berubah menjadi kotak, kemudian dilanjutkan secara bertahap menjadi bentuk objek teks.

  • Macromedia Flash MX Page 19 of 41

    Bagian 3 Animasi Dasar 2

    TimeLine Effect

    Timeline Effect merupakan suatu animasi yang siap pakai (telah disediakan oleh Flash

    MX 2004).

    Cara pemakaian, select object yg akan diberikan animasi lalu klik pada menu Insert >

    Timeline Effects

    1.Assistants a. Copy to Grid

    Jika ingin membuat duplikasi dari objek baik dengan pencerminan pada kolom

    Maupun barisnya (lihat gambar di bawah).

  • Macromedia Flash MX Page 20 of 41

    b. Distributed Duplicate

    Jika ingin membuat duplikasi dari objek dengan tambahan scaling maupun merubah

    warnanya dan memberinya motion(lihat gambar dibawah).

    2. Effect

    a. Blur : Menampilkan animasi seolah-olah objek bertambah buram(blur).

    b. Drop Shadow : Memberikan bayangan pada objek yang dibuat.

    c. Expand : Memberikan animasi pada text, seperti memberikan effect

    squeeze(menyempit).

  • Macromedia Flash MX Page 21 of 41

    d. Explode

    Memberikan animasi seolah-olah objek menjadi terpecah menjadi beberapa bagian.

    3. Transform/Transition a. Transform

    Memberikan animasi kepada objek baik berpindah tempat, scalling, perubahan

    warna, perputaran,dsb.

    b. Transition

    Memberikan effect transisi(pemunculan) pada objek.

  • Macromedia Flash MX Page 22 of 41

    Motion Guide Kita dapat menggunakan motion guide untuk membuat animasi bergerak sesuai

    dengan path yang kita buat. Pertama-tama kita buat dulu motion pathnya.

    Dengan menggunakan Motion Guide kita dapat membuat objek animasi bergerak

    sesuai dengan path.

    Cara penggunaan :

    1. Pada layer pertama buatlah objek yang akan diberi animasi dengan guide layer.

    2. Kemudian kita buat layer kedua,dan taruh diatas layer pertama,layer ini nantinya

    akan berfungsi sebagai path(arah animasi) dari layer dibawahnya.

    3. Lalu buatlah animasi motion biasa untuk objek pada layer pertama tadi. Tapi

    letakan fokus objek tepat pada garis/path yang telah dibuat pada layer 2.

    kemudian pada keyframe akhir dari animasi , letakkan juga fokus objek berpacu

    pada path pada layer 2.

    4. Terakhir, clik kanan pada layer atas(path),lalu pilih guide.

  • Macromedia Flash MX Page 23 of 41

    Export File Dalam Flash MX ini, animasi yang kita buat dapat ditampilkan(dipublish) dalam format

    yang berbeda-beda, baik dalam bentuk exe(executable file),html(untuk dipublish di

    web), mov(movie), jpg,gif(gambar), gif(animated image), dll.

    Untuk mempublishnya menjadi exe,html,mov,jpg,gif(non-animated image), dapat

    dilakukan dengan memilih menu File > Publish Settings.

    Sedangkan untuk mempublishnya menjadi avi(movie clip), gif(animated image), dapat

    dilakukan dengan memilih menu File > Export > Export Movie > lalu kita pilih tipe

    yang kita mau(pada extension type).

    Lihat gambar dibawah.

  • Macromedia Flash MX Page 24 of 41

    Bagian 4 Masking dan Penerapannya

    Masking dan Penerapannya

    Dalam bab ini akan mempelajari cara penggunaan masking. Dengan menggunakan teknik masking kita dapat mengatur bagian mana dari suatu layer yang akan ditampilkan dan yang tidak ingin ditampilkan. Buatlah suatu teks dengan warna biru pada suatu layer, dan objek teks yg sama dengan warna putih pada layer yang berbeda.

    Tambahkan layer baru untuk maskingnya, kemudian klik kanan pada layer tersebut

    dan pilihlah Mask.

  • Macromedia Flash MX Page 25 of 41

    Pada layer mask kita buat sebuah batang hitam kurang lebih setinggi teks yang kita

    buat, kemudian kita animasikan bergerak dari kiri ke kanan.

    Untuk melihat efeknya pastikan layer mask, dan layer putih sudah terkunci.

    Kemudian tariklah penunjuk timeline untuk melihat animasi masking yang terjadi dari

    waktu ke waktu. Bagian teks putih yang berada di layer putih tidak semuanya

    ditampilkan tetapi hanya sebagian. Sedangkan layer biru akan ditampilkan semuanya.

    Hal ini menimbulkan efek seperti gambar di atas, karena dengan adanya mask yang dianimasikan maka bagian dari teks putih yang ditampilkan pun bergerak dari kiri ke

    kanan.

    Contoh lain misalkan kita membuat efek spotlight. Buatlah warna background stage

    menjadi hitam. Kemudian import sebuah gambar dan dimasukkan ke dalam Library.

  • Macromedia Flash MX Page 26 of 41

    Buatlah 2 buah layer, yang pertama letakkan gambar objek yang ingin

    ditampilkan, yang kedua ubahlah menjadi mask. Sekarang buatlah animasi pada layer

    mask, misalkan sebuah lingkaran yang bergerak, maka gambar akan dimunculkan

    pada bagian-bagian yang kita masking. Selain itu efek-efek seperti kaca pembesar

    juga menggunakan teknik masking yang sama.

  • Macromedia Flash MX Page 27 of 41

    Bagian 5 Penggunaan Button dan Scene

    Button Buatlah sebuah objek, kemudian klik kanan, dan konversi menjadi button. Button ini memiliki beberapa behavior.

    Beberapa behaviornya adalah :

    1. Up Adalah keadaan di mana mouse tidak berada di dalam area buttonnya.

    2. Over Adalah keadaan di mana mouse sedang berada di dalam area buttonnya.

    3. Down Adalah keadaan pada saat di mana mouse ditekan pada area buttonnya.

    4. Hit Adalah keadaan pada saat di mana mouse ditekan dan dilepas pada area buttonnya.

    Kita dapat membuat gambar yang berbeda sehingga kita dapat memberikan efek yang berbeda, misalkan pada saat Over gambarnya berubah. ActionScript

    1. Pada frame satu tambahkan sintaks berikut.

    2. Pada actionscript Button tambahkan sintaks berikut.

    3. Pada frame 5 tambahkan sebuah teks yang berbeda dan actionscript sebagai berikut.

    stop();

    on(release){ gotoAndPlay(5); }

    stop();

  • Macromedia Flash MX Page 28 of 41

    Fungsi stop() digunakan untuk menghentikan proses timeline. Kemudian on(release) adalah proses pada saat button diklik dan dilepaskan, gotoAndPlay(5) akan membuat timeline bergerak ke frame 5. Selain itu juga dapat menggunakan penamaan pada frame. Kita dapat memberi penamaan pada frame, pada bagian property dari frame.

    Sehingga pada saat penggunaan actionscript kita dapat menggunakan nama framenya. Untuk actionscript lainnya dapat dilihat di Reference.

    on(release){ gotoAndPlay(startFrame); }

  • Macromedia Flash MX Page 29 of 41

    Bagian 6

    Menu Interactivity

    Buatlah rancangan struktur menu sebagai berikut. Kita akan membuat strukturmenu di mana pada saat mouse berada di area menu 1 maka akan pop up sebuah menu di bawahnya.

    Untuk isi content dari menu 1 kita gunakan movie clip. Buatlah sebuah move clip pada layer baru dan letakkan pada bagian bawah menu 1.

    Kemudian klik pada objek movie clip tersebut dan berilah nama instancenya, misalkan menu1_content.

  • Macromedia Flash MX Page 30 of 41

    Di dalam movie clip tersebut kita dapat membuat beberapa frame animasi. Kliklah dua kali untuk masuk ke dalam movie clip tersebut.

    Pada bagian dalam movie clip buat frame dengan animasi di mana kotak akan secara bertahap muncul, settinglah nilai alphanya. Beri dua buah nama frame, yang pertama hide di mana tidak terdapat objek apapun dan show yang menjalankan animasi munculnya kotak secara perlahan-lahan. Kemudian untuk masing menu, dari 1-3 konversikanlah ke bentuk movieclip sehingga kita bisa memberikan actionscript. Tambahkan actionscript berikut pada instance menu1.

    Maka pada saat mouse berada pada area menu1, maka akan memanggil objek menu1_content untuk menjalankan timelinenya pada frame show, demikian pula pada saat mouse tidak berada pada area menu1, maka akan menjalankan timeline pada objek menu1_content ke hide, sehingga kotak tidak ditampilkan.

  • Macromedia Flash MX Page 31 of 41

    Selanjutnya kita tinggal memasukkan button-button di dalam movie clip tersebut, di mana akan melakukan suatu action pada saat button tersebut diklik. Untuk masing-masing menu kita buat satu per satu objek contentnya.

    Pada saat mouse menunjuk pada menu 1, maka kotak akan perlahan-lahan muncul.

    Ini dikarenakan actionscript yang kita tambahkan pada event rollOver dan rollOut. Efek seperti ini yang disebut dengan popup menu.

    Kita juga dapat menggunakan efek scrolling menu. Di mana kita dapat membuat menu yang bergerak. Menu-menu dapat dibuat dengan menggunakan Button kemudian dimasukkan ke dalam movie clip dan kemudian dianimasikan.

    Kasus Membuat Menu Scrolling Mintalah instruktur anda untuk membantu membuat menu scrolling ini.

    Membaca teks dari file Buatlah sebuah objek teks dan sebuah button.

    Pada bagian objek teks, gunakan outline.

  • Macromedia Flash MX Page 32 of 41

    Kemudian siapkan file teksnya. Simpanlah file teks di tempat satu folder dengan di mana kamu menyimpan file flash ini. Isi file teksnya adalah sebagai berikut.

    varText ini sesuai dengan yang kita masukkan pada bagian Var pada properties dari teks objek ini. Kemudian tambahkan actionscript pada button getdata.

    Maka flash akan membaca file dari testing.txt kemudian nilainya akan dimasukkan pada objek yang memiliki variabel varText.

    Scrolling Text Buatlah sebuah objek teks pada stage dan dua buah movieclip untuk scrollingnya.

    Kemudian settinglah propertynya menjadi.

  • Macromedia Flash MX Page 33 of 41

    Kemudian pada bagian movieclip kita buat actionscriptnya. Untuk tombol atas tambahkan script sebagai berikut.

    Untuk tombol bawah tambahkan script berikut.

    Tool Tips Di sini kita bisa gunakan efek dari Button.

    Pada bagian button terdapat empat macam kondisi. Up pada saat mouse sedang tidak berada pada area button tersebut. Over pada saat mouse sedang berada pada area button tersebut. Down pada saat mouse sedang dalam posisi ditekan pada area button tersebut. Hit pada saat mouse telah diklik pada area button tersebut.

    Untuk membuat efek tooltip kita bisa tambahkan pada saat kondisi Over dengan menggunakan layer baru. Sehingga pada saat mouse berada di area dari Button tersebut, maka akan muncul keterangan tooltipnya.

  • Macromedia Flash MX Page 34 of 41

    Bagian 7 Pembuatan interaksi dalam Flash

    Membuat link/URL

    Berikut ini akan dipraktekkan pemberian action Get URL di dalam movie Flash :

    1. Buatlah dokumen baru dengan menklik menu File > New, dan gunakan default

    properties movie yang diberikan program Macromedia Flash MX.

    2. Ketikkan teks www.evopage.com dalam stage. (liat gambar dibawah).

    3. Pada contoh kali ini akan dipraktekkan pembuatan hit button untuk dijadikan

    tombol tersembunyi diatas tombol text. Hit button adalah objek tombol yang hanya

    menggunakan state hit, sehingga objek ini pada saat disipkan ke dalam Stage

    tidak akan terlihat. Untuk membuatnya, klik menu Insert > New Symbol

    sehingga muncul kotak dialog create new symbol.

    4. Pada kotak dialog tersebut, ketikkan nama hit kemudian pilihlah button untuk opsi

    behaviour.

    5. Pada jendela pengeditan symbol Hit, klik kanan layer Hit kemudian pilihlah

    perintah insert Keyframe (atau F6).

    6. Pada layer Hit, buatlah objek persegiempat sesuai keinginan, misalnya seperti

    contoh yang terlihat pada gambar dibawah ini.

    www.evopage.com

  • Macromedia Flash MX Page 35 of 41

    7. Kembalilah ke menu utama, dengan menklik ikon Scene 1 yang terdapat di bagian

    kiri atau jendela pengeditan symbol Hit.

    8. Tampilkan panel Library kemudian seret(drag) symbol Hit ke dalam Stage,

    posisikan instance Hit sehingga berada di atas objek teks. Jika ukuran instance Hit

    lebih kecil dari ukuran teks, perbesarlah ukuran instance Hit. Sehingga menutupi

    keseluruhan teks (liat gambar dibawah).

    9. Gunakan tools Arrow kemudian klik instance Hit untuk memilihnya.

    10. Pada panel Actions, bukalah daftar Actions > Browsers/Network kemudian klik

    ganda pada action Get URL. Setelah itu ketikkan alamat URL, misalnya

    www.evopage.com pada kotak URL.

    on(release) { getURL(www.evopage.com); }

  • Macromedia Flash MX Page 36 of 41

    fscommand

    Salah satu perintah yang banyak digunakan dalam membuat interaksi dalam movie

    flash adalah fscommand.

    Dibawah ini adalah daftar perintah di dalam action fscommand beserta argumennya.

    Perintah Argumen Fungsi

    Full Screen TRUE Membuat tampilan stand alone player menjadi fullscreen. FALSE Membuat tampilan stand alone player menjadi normal.

    Allow Scale TRUE Membuat tampilan stand alone player dimungkinkan untuk

    diperbesardan diperkecil

    FALSE Membuat tampilan stand alone player ditampilkan menurut

    ukuran aslinya.

    Show Menu TRUE Menampilkan menu di dalam stand alone player FALSE Menyembunyikan menu di dalam stand alone player.

    Quit - Keluar dari stand alone player.

    Exec Path- Membuka aplikasi lain di dalam jendela stand alone player.

    aplikasi

    Untuk perintah Fullscreen, Allowscale, dan Showmenu , biasanya diletakkan pada layer

    pertama atau pada awal dari suatu movie flash yang kita buat.

    Sedangkan perintah Quit dan Exec , biasanya di attach dalam button.

    contoh penggunaan perintah Fscommand di dalam movie Flash

    pada frame 1 kita ketik :

    pada button exit, dapat kita isi action berupa

    Load Movie

    Action Load Movie dapat digunakan untuk membuka movie flash. Tapi terlebih dahulu

    kita harus mempublish movie flash yang akan dibuka menjadi flash player(swf). Jika

    movie flash(swf) yang akan dibuka berada dalam folder yang sama, maka kita cukup

    mengetikan nama file beserta extensinya. Namun jika movie swf yang akan dibuka

    berada di folder yang berbeda, kita harus mengetikan rootnya, sebagai contoh

    d:\flash\evo.swf .

    fscommand("fullscreen","true");fscommand("showmenu","false");

    fscommand("quit","true");

  • Macromedia Flash MX Page 37 of 41

    Contoh penggunaan : (misal kita taruh action pada suatu button)

    Unload Movie

    Action Unload Movie adalah kebalikkan dari action Load Movie. Action Unload Movie

    Digunakan untuk menutup movie flash yang sebelumnya dibuka. Untuk menggunakan

    action Unload Movie, pilihlah objek tombol(button) atau frame kemudian bukalah

    daptar Action > Browser/Network dan pilihlah unloadMovie.

    Contoh penggunaan

    on(release) { loadMovieNum(evo.swf,1); }

    on(release) { unloadloadMovieNum(this); }

  • Macromedia Flash MX Page 38 of 41

    Bagian 8 Membuat presentasi Multimedia

    Di sini kita akan mempelajari beberapa script untuk pengaturan Movie Control.

    Nah pada layer 1 kita buat beberapa tombol dalam bentuk movieclip. Kemudian pada layer 2 buat beberapa keyframe dengan nama satu, dua, dan tiga. Kemudian di frame-frame tersebut buat beberapa gambar yang berbeda. Untuk masing-masing button pada actionscriptnya kita bisa buat pada saat diklik movie control pindah ke frame tertentu.

    Maka pada saat buttonnya diklik movie control akan pindah langsung ke frame dengan nama tiga.

  • Macromedia Flash MX Page 39 of 41

    gotoAndStop

    movie dipindahkan pada frame tertentu, dan movie control akan stop pada frame

    tersebut.

    Contoh penggunaan:

    gotoAndStop(30); // untuk pergi ke frame 30

    gotoAndStop(Scene 2,1); // untuk pergi ke Scene 2, frame 1

    gotoAndPlay

    movie dipindahkan pada frame tertentu, dan movie control akan play, lanjut terus

    mulai dari frame tersebut. Penggunaannya sama dengan method gotoAndStop

    nextScene

    pindah ke Scene berikutnya.

    Contoh penggunaan :

    nextScene();

    prevScene

    pindah ke Scene sebelumnya.

    Contoh penggunaan :

    prevScene();

  • Macromedia Flash MX Page 40 of 41

    Bagian 9 Review

    Coba dibuat suatu menu dari cd interaktif yang biasa terbundle pada majalah-majalah

    komputer sekarang, kira-kira bentuknya sebagai berikut:

    1. Intro.

    Berisi pendahuluan / perkenalan dan penjelasan tentang isi secara keseluruhan.

    2. Menu awal

    Gunakan menu scrolling untuk menu-menunya.

    3. Bagi bagian-bagiannya menjadi sub bab dan link masing-masing menu ke file swf

    lain (misalnya

    menggunakan file swf yang sudah pernah dibuat sebelumnya).

    Gunakan kreativitas anda untuk membuat cd interaktif.

    Selamat mengerjakan.

  • Macromedia Flash MX Page 41 of 41

    Bagian 10 Buat web Interaktif

    Buatlah web interaktif, gunakan fitur-fitur berikut ini :

    1. Tween ( Motion & Shape )

    2. Guide Layer

    3. Masking

    4. ActionScript

    Pilihlah salah satu materi berikut ini :

    1. Buatlah home page pribadi, di mana harus memuat informasi-informasi berikut

    ini :

    - informasi profil diri, nama, tanggal lahir, zodiac, alamat, email, dan

    sebagainya.

    - Gallery, berisi beberapa foto-foto

    2. Buatlah undangan dalam bentuk multimedia interaktif. Misalkan undangan

    acara ulang tahun, acara seminar, undangan konser dan sebagainya.

    - jenis acara

    - kapan dan tempat berlangsungnya acara

    - acara-acara yang akan diadakan

    - contact person

  • Filename: Macromedia Flash MX.doc Directory: D:\Evo\RnD\diktat\special\Macromedia Flash Template: C:\Documents and Settings\EVO\Application

    Data\Microsoft\Templates\Normal.dot Title: Pengenalan Flash MX Professional 2004 Subject: Author: Yohanes Budiman Wijaya Keywords: Comments: Creation Date: 9/5/2005 9:24:00 PM Change Number: 154 Last Saved On: 2/22/2006 4:50:00 PM Last Saved By: EVO Total Editing Time: 732 Minutes Last Printed On: 4/27/2006 4:00:00 PM As of Last Complete Printing Number of Pages: 41 Number of Words: 4,202 (approx.) Number of Characters: 23,953 (approx.)