Tutorial membuat objek berputar dengan Macromedia Flash

Membuat objek berputar ada 2 cara yaitu dengan motion rotate dan actionscript _rotation.

A. Motion Rotate

1. Buatlah sebuah flash document.

2. Buat sebuah bintang segi 6. Seleksi bintang tersebut dan tekan F8. Pada panel yang muncul pilih Movie Clip sebagai type lalu tekan OK.

3.  Klik kanan frame 20 dan pilih Insert keyframe.

4. Klik frame 1 dan tekan Ctrl+F3. Pada panel properties yang muncul ubah Tween dari None menjadi Motion. Lalu ubah Rotate menjadi CW (Clock Wise/searah jarum jam) atau CCW (Counter Clock Wise/berlawanan arah jarum jam).

5. Terakhir test movie dengan menekan CTRL+ENTER. 

B. Actionscript

1. Buatlah sebuah flash document.

2. Buat sebuah bintang segi 6. Seleksi bintang tersebut dan tekan F8. Pada panel yang muncul pilih Movie Clip sebagai type lalu tekan OK.

3. Seleksi movie clip yang ada kemudian tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4

onClipEvent (enterFrame) { //semakin besar nilainya, semakin cepat putaran rotasinya _rotation += 15; }

4. Terakhir test movie dengan menekan CTRL+ENTER.

 

 sumber:  

 http://warungflash.com/2008/12/animasi-berputar

http://e-flashus.blogspot.com/2013/03/tutorial-membuat-objek-berputar-dengan.html

Tutorial Membuat Game Tembak Balon

Pada tutorial kali ini kita kan mencoba membuat game tembak balon dari macromedia flash. langkah-langkahnya sebagai berikut:
1.  Buat dokumen baru flash.
2. Buat sebuah objek “sasaran” kemudian ubah menjadi Movieclip dengan cara klik kanan pada objek, pilih Convert to Symbol.

3. Buka panel properties, kemudian pada bagian instance name, beri nama shot_mc.

4. Buat sebuah objek “balon” kemudian ubah menjadi movieclip.

5. Hapus movieclip balon yang ada di stage, kemudian buka panel library. Maka, movieclip balon yang sudah anda buat akan tampak di panel library. lalu, klik kanan pada movieclip balon kemudian pilih Lingkage.

6. Centang pada pilihan Export for ActionScript. Pada kolom identifier, masukan kata “baloon”.

7. Selanjutnya, buat sebuah tulisan “Score :” pada ujung atas stage dengan text tool (T).
8. Buat lagi sebuah teks area kosong dengan type dynamic text. lalu buka panel properties, pada kolom variable, masukan kata “_root.score”.

9. Terakhir, buka panel action kemudian ketikan script di bawah ini:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

Mouse.hide(); score=0; shot_mc.onEnterFrame=function() {   this._x=_root._xmouse;   this._y=_root._ymouse; } shot_mc.swapDepths(20); for(i=0;i<10;i++) {   attachMovie("baloon","balon"+i,i,{_x:(Math.random()*500)+10,_y:(Math.random()*400)+500});   _root["balon"+i].onEnterFrame=function()   {     this._y -=30;     if(this._y<-50)     {     this._y=(Math.random()*400)+500;     this._x=(Math.random()*500)+10;     } } _root["balon"+i].onMouseDown=function() {   if(this.hitTest(shot_mc))   {     score +=10;     removeMovieClip(this);   } } }

terakhir jalankan Movie dengan menekan Ctrl+Enter.

silahkan nikmati hasil nya...... (selamat mencoba)

Tutorial Membuat Film Animasi Kartun 2 Dimensi Dengan Menggunakan Macromedia Flash MX

Pada dasarnya membuat kartun atau animasi adalah gerakan-gerakan yang di gabungkan dari setiap step. step per step dari setiap gerakan hanya berubah sedikit sedikit. Semakin kita memperkecil step stiap gerakan maka gerakan kartun pun akan semakin halus. oke penjelasan sederhananya saya paparkan sebagai berikut:
Jadi kita membuat gambar satu demi satu untuk dirangkai dan dijalankan agar terlihat bergerak.
Untuk gerakan yang sempurna sedikitnya dalam 1 detik harus ada 25 frame (gambar) yang berbeda, atau yang sering disebut 25 frame per second / 25 fps. Bila ingin lebih sempurna lagi ya buat saja 30 frame per second. Wah.. pasti film kartunnya terlihat gerakannya sempurna banget tuh...
Berarti bisa dibayangkan kalau kita mau membuat film kartun berdurasi 1 jam harus ada berapa gambar ya ? mulai dari kualitas paling sederhana deh...
1 detik = 5 frame, berarti 1 menit = 300 frame, dan berarti 1 jam = 18.000 frame
1 detik = 10 frame, berarti 1 menit = 600 frame, dan berarti 1 jam = 36.000 frame
1 detik = 15 frame, berarti 1 menit = 900 frame, dan berarti 1 jam = 54.000 frame
1 detik = 20 frame, berarti 1 menit = 1.200 frame, dan berarti 1 jam = 72.000 frame
1 detik = 25 frame, berarti 1 menit = 1.500 frame, dan berarti 1 jam = 90.000 frame
1 detik = 30 frame, berarti 1 menit = 1.800 frame, dan berarti 1 jam = 108.000 frame
Waw.. bila dalam durasi 1 jam saja dibutuhkan gambar segitu buanyaaknya, makanya untuk membuat film kartun tentu saja dibutuhkan tenaga animator yang tidak sedikit lah.. agar dalam satu waktu bisa membuat film dalam jumlah yang banyak.
Namun ada caranya koq agar kita bisa membuat film kartun tidak terlalu capek dalam membuat sekian banyak gambar.
Jadi nanti gambar akan dibagi menjadi 2, yakni gambar background dan gambar tokoh kartunnya.
Untuk satu adegan di sebuah tempat misalnya kita tinggal membuat 1 gambar background lalu kemudian membuat gambar 2 tokoh kartun misalnya yang tinggal kita gerak-gerakkan per frame-nya.
Nah, saat ini kita akan belajar bersama mulai dari dasar.. tenang... tarik nafas dari hidung dulu.... keluarkan dari mulut.... fhiufff... relax... okey...
Bagi yang Muslim, mari kita berdo'a dulu.. Ucapkan BismiLLahirRohmaanirRohiim.... semoga kita bisa membuat film kartun dengan jalan cerita yang baik dan bermoral serta yang bermanfaat bagi banyak orang,, Amiin....
Belajar membuat gambar bergerak menggunakan Macromedia Flash MX :
1. Buka software Macromedia Flash MX
2. Klik Onion Skin Outlines
3. Klik Brush Tool, atau tekan B pada keyboard
4. Pilih Brush yang kecil saja, yang nomor 4 dari atas
5. Silahkan gambar manusia sederhana seperti pada contoh
6. Tekan F7 pada keyboard, lalu Gambar lagi untuk frame ke-2 dengan gerakan yang sedikit berbeda dan letakkan gambar orang sedikit lebih ke kanan.
7. Tekan F7 lagi, sekarang gambar untuk frame ke-3
8. Tekan F7 lagi, sekarang gambar untuk frame ke-4
9. Tekan F7 lagi, sekarang gambar untuk frame ke-5, dan seterusnya.. lakukan hingga Anda rasa cukup.
Untuk melihat hasil animasi yang kita buat, tinggal klik pada frame pertama, lalu tekan Enter pada keyboard, maka animasi akan berjalan seperti yang kita rencanakan.
Bila ingin melihat hasil jadi, kita bisa simpan dulu dengan cara klik File, Save As, lalu beri nama, dan tetapkan pada format .fla
Setelah di save kita bisa melihat hasil animasi dalam format flash dengan klik File, arahkan ke Publish Preview, klik Flash.
Untuk menyimpan dalam format animasi, klik File, pilih Export Movie atau Export Image (tergantung format yang dibutuhkan).

Kalau inginnya file berbentuk animasi flash ya pilih format SWF pada Export Movie.
Kalau ingin dijadikan format video pilih format AVI pada Export Movie.
Kalau ingin dijadikan wallpaper HP bergerak bisa pilih format GIF pada Export Image.
Okey.. selamat belajar... Dalam waktu mendatang saya akan segera tulis untuk belajar pada tahap selanjutnya... Yuk mari belajar membuat film kartun bersama Rey Arifin.. hehehe... semoga bermanfaat..... ^^

Tutorial membuat Animasi Mobil Berjalan Pada Macromedia Flash MX Professional 2004

Alangkah senang sekali kalau seandainya kita bisa menggerakan gambar yang kita buat. Dulu banget hal itu sangat mustahil di lakukan, namun pada saat ini dengan perkembangan teknologi Komputer yang semakin canggih dan di tunjang dengan perkembangan aplikasi-aplikasi yang semakin memudahkan kita maka membuat gambar buatan kita bergerak bukan sesuatu yang mustahil lagi. hal itu dapat di kita lakukan dengan menggunakan aplikasi Macromedia Flash. Postingan kali ini saya akan menelaskan bagaimana cara kita membuat animasi mobil berjalan. adapun langkah-langkahnya sebagai berikut:
1. Sebelum membuat desain mobil keseluruhan, terlebih dahulu kita harus membuat desain gambar ban untuk mobil       tersebut.
Kenapa ban nya terlebih dahulu harus kita desain???
Itu karena pada mobil yang paling nampak bergerak untuk dijadikan animasi adalah bagian ban
2. Setelah di desain ban nya, blok gambar ban nya,
Tekan F8 lalu ketikkan ” ban ” Lalu Klik OK
Setelah itu double klik gambar ban tersebut sampai tertera tulisan Scene 1    ban pada bagian atas dibawah menu bar seperti gambar di bawah ini :
3.   Pilih di frame mana akan kita letakkan frame kedua lalu Klik kanan pada frame tersebut pilih Insert Keyframe
4. Klik kanan pada frame kedua tadi lalu pilih Create Motion Tween pada frame kedua
5. Klik kanan pada frame pertama tadi lalu pilih Create Motion Tween pada frame pertama juga
6. Pada Properties, Pilih Kotak Rotate, Lalu pilih CW atau CCW
7. Setelah itu Klik Scene 1
8. Blok & Copy objek ban Lalu desain lah bodi mobil nya. Lalu Klik kanan pada frame ke-2, Insert Keyframe
9. Lalu klik kanan pada Frame Ke-2, pilih & klik Create Motion Tween
10. Begitu juga pada Frame pertama, pilih & klik Create Motion Tween, sehingga akan muncul tanda panah pada frame seperti gambar dibawah ini :
11. Klik kanan pada Layer, pilih Add Motion Guide
12. Pada Layer Guide, Gambarkan garis jalur menggunakan pencil
13. Klik Frame pertama, Lalu letakkan object pada ujung posisi awal
14. Klik Frame kedua, Lalu letakkan object pada ujung posisi akhir
15. Lalu Jalankan Menggunakan CTRL + ENTER
Program animasi tersebut menggunakan Software Macromedia Flash MX Professional 2004…
Jika kamu ingin mendapatkan software ini silahkan Klik Link berikut & Download
Selamat mencoba…

Tutorial Membuat Teks Animasi Dengan Macromedia Flash 8

Posting kali ini saya akan memjabarkan tutorial  untuk membuat teks animasi pada Macromedia Flash.

Adapun langkah-langkah untuk membuat teks animasi pada Macromedia Flash adalah sebagai berikut :

1.     Buka applikasi Macromedia Flash pada netbook/computer anda, kemudian klik Create New Flash Document.

Gambar.1

2.     Setelah muncul halaman baru, selanjutnya tekan Ctrl+F3 pada keyboard netbook/computer anda, sehingga muncul halaman seperti gambar dibawah.

Gambar.2

Buat teman-teman bloggers yang baru pertama kali menggunakan applikasi ini, saya sarankan untuk tidak sembarang menekan/mengklik menu, karena akan semakin membuat anda bingung.

Pada halaman Document Property seperti gambar no.2 diatas, silahkan isi form yang terdapat disana, dan ganti ukuran default media dengan ukuran banner yang akan anda buat, selanjutnya klik OK.

Tekan Ctrl+F3 lagi untuk kembali kehalaman semula.

3.     Apabila anda mengganti ukuran default document terlalu kecil, maka kemungkinan besar media yang anda buat menjadi tersembunyi. Geser scroll yang ada pada bagian bawah halaman dan disebelah kanan halaman, untuk menampilkan media tersebut.

Gambar.3

Selanjutnya klik Menu Text Tool yang terdapat disebelah kiri halaman Layer, atau tekan tombol T pada keyboard anda.

4.     Buatlah area teks pada media, dan tulis teks yang anda inginkan.

Gambar.4

5.     Setelah anda selesai menulis teks, tekan tombol Ctrl+F3 pada keyboard anda hingga muncul halaman seperti gambar dibawah.

Gambar.5

Pada halaman Teks Properties diatas, pilihlah jenis dan ukuran fonts yang akan anda tampilkan pada banner teks anda. Setelah selesai, tekan tombol Ctrl+F3 untuk kembali kehalaman semula.

Selanjutnya delete/hapus teks yang telah anda buat dengan menekan tombol Back space pada keyboard anda, tanpa merubah area teks yang ada.

6.     Setelah semua teks terhapus pada area teks, kemudian tekan F5 dan F6 secara berurutan.

Selanjutnya klik pada area teks yang kosong pada media, kemudian tulis 1 huruf awal yang telah anda hapus tadi, selanjutnya tekan F5 dan F6 secara urut.

Klik lagi pada area teks, kemudian tulis huruf kedua selanjutnya tekan F5 dan F6 secara berurut.

Gambar.6

7.     Untuk huruf ke-3 dan selanjutnya, lakukan langkah-langkah seperti langkah no.6 diatas.

Gambar.7

8.     Setelah semua huruf anda tulis seperti pada gambar diatas, kemudian lihatlah banner teks anda dengan menekan Ctrl+ENTER pada keyboard.

iyessss….!!! Anda telah berhasil selamat yaa…

9.      Untuk menyimpan file banner teks yang telah anda buat tersebut, klik menu File –> Export –> Export Movie

Gambar.8

10.     Tentukan Tempat dan Nama penyimpanan file tersebut pada netbook/computer anda, pilih type Animated GIF(*.gif). Selanjutnya klik Save.

Gambar.9

11.     Pada halaman yang muncul berikutnya, anda bisa mengatur ukuran file banner anda, selanjutnya klik OK.

Gambar.10

Apabila anda ingin membuat banner teks dengan background berwarna, sebelum melakukan langkah no.9 diatas, tekan tombol V kemudian Ctrl+F3 pada keyboard untuk mengganti warna pada Background Properties.

Selanjutnya pada gambar no.10 diatas, hilangkan tanda centang pada kolom Transparent. Kemudian klik  OK.

• Keterangan :

·    V, Ctrl+F3 = Document/Media Properties

·    T, Ctrl+F3 = Teks Properties

·    F5 = Insert Frame

·    F6 = Insert Keyframe

Selesai

Cara Membuat Jam Analog Animasi Dengan Macromedia Flash

Sebelumnya Untuk bisa membuat jam animasi flash, modal utama kita tentunya kita harus menginstall sebuah software berbasis flash pada netbook/computer kita. Dan disini saya menyarankan anda untuk menggunakan Macromedia Flash Propessional 8. Ukuran software ini, tidak lebih besar dari software Coreldraw  hanya sekitar 107MB.

Adapun langkah-langkah dalam membuat jam animasi flash adalah sebagai berikut :

1.     Buka applikasi Macromedia anda, kemudian klik Flash Document pada bagian Create New.

Gambar.1

2.     Setelah muncul halaman baru, selanjutnya tekan Ctrl+F3 pada keyboard netbook/computer anda, sehingga muncul halaman seperti gambar dibawah.

Gambar.2

Pada halaman Document Properties seperti gambar no.2 diatas, silahkan isi form yang terdapat disana, dan ganti ukuran default media dengan ukuran jam yang ingin anda buat (contoh : 200 x 200 px), selanjutnya klik OK.

Tekan Ctrl+F3 lagi untuk kembali kehalaman semula.

Pada bagian ini, anda juga bisa menggunakan ukuran gambar/foto yang terdapat pada netbook/computer anda. Jadi, sebelum membuka Macromedia Flash, silahkan edit  terlebih dahulu file gambar/foto yang tersimpan pada netbook/computer anda, contohnya seperti file gambar logo WP yang saya buat dibawah. Anda juga bisa menggunakan foto anda sendiri sebagai background jam animasi flash.

3.     Setelah gambar/foto anda sudah siap, langkah berikutnya adalah, klik menu File–>Import–>Import to Stage

Gambar.3

4.     Setelah gambar/foto yang anda import ke stage sudah muncul, selanjutnya klik menu Text Tool atau tombol T pada keyboard anda.

Gambar.4

Selanjutnya buatlah teks area pada gambar/foto dan tulis angka 1 sampai 12 secara terpisah. (Perhatikan gambar no.4 diatas)

5.     Langkah selanjutnya, klik Ctrl+F3 pada keyboard untuk mengatur ukuran dan warna angka pada Text Properties.

Gambar.5

Setelah selesai, klik Ctrl+F3 untuk menyembunyikan halaman text properties.

Selanjutnya, geser angka 1 sampai 12 tersebut seperti pada posisi angka jam pada umumnya, sehingga tampak seperti pada gambar no.6 dibawah.(Klik Selection Tool untuk menggeser)

6.     Langkah berikutnya, klik Line Tool pada menu, atau tombol N pada keyboard anda, kemudian buatlah 3 buah garis untuk penunjuk arah jam (jam, menit, detik) seperti pada gambar dibawah.

Gambar.6

Langkah berikutnya, klik Selection Tool atau tekan tombol V pada keyboard anda. Selanjutnya, klik garis pendek (jam) yang telah anda buat, kemudian tekan F8 pada keyboard anda.

Gambar.7

Pada halaman yang muncul seperti gambar diatas, pada kolom Name, ganti teks yang ada dengan jam_mc, pilih Movie klip untuk Type, dan pastikan titik Registration berada pada baris tengah bawah. Selanjutnya klik OK.

7.     Langkah berikutnya, tekan Ctrl+F3 untuk menampilkan halaman property.

Gambar.8

Pada gambar diatas, klik kolom <Instace Name> dan ganti dengan jam_mc.

8.     Selanjutnya klik garis ke-2 (menit) kemudian tekan F8, ganti Name  dengan menit_mc. Selanjutnya tekan Ctrl+F3 pada keyboard, ganti <Instance Name> dengan menit_mc.

9.     Langkah berikutnya, klik garis ke-3 (detik) kemudian tekan F8, ganti Name dengan detik_mc. Selanjutnya tekan Ctrl+F3, ganti <Instance Name> dengan detik_mc.

10.     Langkah selanjutnya, geser ke-3 garis tersebut satu persatu, dan letakkan pada gambar/media (ditumpuk) dengan posisi garis pendek (jam) terletak paling bawah, kemudian garis menit, dan yang terakhir garis panjang (detik).

Gambar.9

11.     Selanjutnya klik dibawah angka 1 pada halaman frame, kemudian tekan F9.

Pada halaman Action yang muncul, copy kode dibawah kemudian paste pada halaman tersebut.

//perintah yang dijalankan ketika frame dimainkan

onEnterFrame = function () {

                //membuat variable waktu sebagai date object

                waktu = new Date();

                //membuat variable jam dengan nilai sama dengan jam pada komputer

                jam = waktu.getHours();

                //membuat variable menit dengan nilai sama dengan menit pada komputer

                menit = waktu.getMinutes();

                //membuat variable detik dengan nilai sama dengan detik pada komputer

                detik = waktu.getSeconds();

                //digunakan jika komputer menggunakan sistem 12 jam

                //jika nilai variable jam lebih dari 12 maka akan dikurangi 12

                if (jam>12) {

                                jam -= 12;

                }

                //movie clip jam_mc akan berotasi sesuai nilai variable jam dikali 30 yang ditambah nilai variable menit di bagi 2

                jam_mc._rotation = jam*30+(menit/2);

                //movie clip jam_mc akan berotasi sesuai nilai variable menit dikali 6

                menit_mc._rotation = menit*6;

                //movie clip detik_mc akan berotasi sesuai nilai variable detik dikali 6

                detik_mc._rotation = detik*6;

};

Gambar.10

Selanjutnya tekan Ctrl+ENTER untuk melihat hasilnya.

12.     Simpan jam animasi anda dengan mengklik File–>Export–>Export Movie.

Pada halaman berikutnya, pilih type Flash Movie(*.swf) kemudian klik Save, dan pada halaman terakhir klik OK.

SELESAI