TUTORIAL MACROMEDIA FLASH

1. Membuat Jam Dinding

Publish: 3 Agustus 2011 | Author & Copyright: Johan | Status: FREE tutorial

Tik tok tik tok, sambil menunggu waktu berbuka puasa lebih baik kita belajar animasi dan Action Script dengan Flash. Pada Tutorial Flash kali ini kita akan mencoba membuat Jam dinding sederhana. Penasaran cara membuatnya? mari kita belajar bersama di IlmuGrafis

Langkah - langkahnya sbb:
1. Buka Program Flash
Start >> All Program >> Flash , pilih flash dokumen 
disini penulis menggunakan Flash MX 2004 namun tutorial ini bisa diterapkan di Adobe Flash versi berapapun termasuk Flash CS5 


2. Buat lingkaran Gunakan oval tool (shortcut tombol: O), tips: tekan dan tahan tombol shift pada keyboard agar lingkaran bulat sempurna 



3. Ubah warna fill jadi hitam, Gunakan text tool (Short cut tombol : T) dan tulis 1 per 1 nomor jam mulai dari 1 - 12 untuk penomoran angka
gunakan Selection tool untuk meletakkan nomor - nomor tersebut pada bagian jam 



4. Dengan Line Tool (N) buatlah 3 buah garis untuk penunjuk arah jam
garis jam (pendek) , garis menit (agak panjang) , garis detik (panjang)

5. Seleksi garis yang paling pendek dengan selection tool (V) dan tekan F8 
muncul jendela dan masukkan jam_mc dan pilih movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok. 

Seleksi movie clip jam_mc di Lembar kerja kemudian tekan Ctrl+F3 untuk memunculkan panel properties. Pada panel properties yang muncul masukkan jam_mc sebagai instance name. 


6. Sama seperti di atas
Seleksi garis kedua (agak panjang), kemudian tekan F8. Pada panel yang muncul masukkan menit_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok. 
Seleksi movie clip menit_mc. Pada panel properties yang muncul masukkan menit_mc sebagai instance name. 

7. Sama seperti di atas
Seleksi garis ketiga (paling panjang), kemudian tekan F8. Pada panel yang muncul masukkan detik_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok. 
Seleksi movie clip detik_mc. Pada panel properties yang muncul masukkan detik_mc sebagai instance name. 

8. Satukan dan letakkan garis dengan urutan jam lalu menit kemudian detik dan letakkan di dalam tempat jam 


9. Setelah semuanya terpasang, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut : 


Masukkan code script berikut ini: 
 

10. Tekan Ctrl+Enter untuk melihat hasilnya.
kira - kira seperti ini: 

Animasinya bisa diexport dalam bentuk flash movie dengan cara klik File >> Export movie, beri nama dan pilih format swf
seperti ini:
 
Tutorial Jam Dinding dengan Action Script
Tutorial ini saya buat sederhana namun bertujuan agar mudah dipraktikkan oleh pemula yang barubelajar flash. Anda dapat mengembangkannya dengan memperbaiki bagian grafisnya sehingga nantinya jam akan terlihat lebih bagus lagi.

2. MEMBUAT LAMPU SOROT (MASKING)

Tutorial kali ini akan membahas animasi efek masking dengan menggunakan motion tween. Masking ini merupakan animasi seperti lampu sorot sehingga gambar yang terlihat hanya pada bagian yang terkena objek masking.

Untuk lebih memahaminya, ikuti langkah-langkah di bawah ini:

1.  Buat dokumen baru flash.

2.  Import gambar ke dalam stage dengan memilih File > Import > Import to Stage.

3.  Sehingga gambar akan terisi pada stage di “layer1”.

4. Buat layer baru dengan meng-klik ikon New layer.

5.  Pada layer baru, buat objek lingkaran yang nantinya akan digunakan sebagai masking.

6.  Ubah lingkaran tersebut menjadi movieclip dengan cara Klik kanan pada objek lingkaran, pilih Insert New Symbol. Kemudian beri nama “mask”.

7.  Pada frame1, letakan objek mask ini di sebelah kiri stage.
8.  Klik kanan pada frame 20, pilih Insert Keyframe. Pindahkan objek mask ke sebelah kanan stage.
9.  Klik kanan pada frame 35, pilih Insert Keyframe, Pindahkan objek mask ke sebelah atas stage.
10.  Klik kanan pada frame 50, pilih Insert Keyframe, Pindahkan objek mask ke sebelah bawah stage.

11.  Klik kanan pada frame kemudian pilih Create Motion Tween (CS3) Create Classic Tween (CS4,5,6).

12.  Pada layer mask, klik kanan kemudian pilih mask.

13.  Jika berhasil, maka objek gambar hanya akan terlihat pada objek mask yang telah dibuat. Jalankan movie dengn menekan Ctrl+Enter.

3. MEMBUAT EFEK MATRIKS

Pernahkah anda menonton film The Matrix Trilogy? Jika iya anda pasti pernah melihat sebuah efek tulisan atau karakter berwarna hijau yang berjatuhan. Sebenarnya efek tersebut dapat kita buat dengan flash dan action script.

Caranya mudah, disini anda tidak perlu menggunakan Tool apapun untuk membuat nya. Anda cukup membuka panel action, bermain logika dan beberapa baris listing program actionscript.

Ikuti langkah-langkah di bawah ini:

1. Buat dokumen baru.

2. Buka panel properties, ubah warna background stage menjadi hitam.

3. Buka panel action, 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

var matrix:Array=new Array(); addEventListener(Event.ENTER_FRAME, onframe);   for (var j:int=51; j>=1; j--)    {    //membuat objek teks dan menentukan jenis huruf    var t:TextField=new TextField();    var format:TextFormat = new TextFormat("Bookshelf Symbol 7",14,"0x00FF33");    t.defaultTextFormat = format;    //mengacak posisi huruf    t.y = Math.random()*300;    t.x=Math.random()*550;    addChild(t);    matrix.push(t); } function onframe(event:Event) {    for (var i:int=1; i400)    {      matrix[i].y=0;    } } }

4. Selesai, jalankan program

Jika ingin mengganti jenis huruf, cukup ganti “Bookshelf Symbol 7″ dengan jenis huruf yang anda inginkan.

Jika karakter yang jatuh berupa angka biner (1 dan 0) ganti baris program di bawah ini:

1	var char:String = String.fromCharCode(Math.floor(Math.random() * 26) + 64);

menjadi :

1	var char:int=Math.round(Math.random()*1);