Membuat Animasi Gelembung

Rabu, 12 Desember 2012

Membuat Animasi Gelembung - Animasi yang akan kita buat berikut ini berupa gelembung udara yang bergerak keatas. Apabila kita menyentuh gelembung udara tersebut dengan kursor mouse maka gelembung udara itu akan otomatis menghilang.
Berikut ini adalah langkah-langkahnya :
1. Buatlah flash document baru berwarna biru.
2. Buatlah sebuah lingkaran berwarna biru dengan putih sebagai warna garisnya dan buatlah juga seperempat garis lingkararan berwarna putih yang ditempatkan ditengah lingkaran tersebut seperti gambar berikut : 
gelembung

3. Seleksi lingkaran dan garis serempat garis lingkaran tadi kemudian tekan F8. Pada panel yang muncul masukkan gelembung sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah.
4. Hapus movie clip dari stage kemudian tekan Ctrl+L. Pada panel Library yang muncul klik kanan movie clip gelembung dan pilih linkage.
5. Pada panel yang muncul berikan centang pada Export for ActionScript dan masukkan gelembung sebagai idetifier lalu tekan Ok.
6. Klik frame 1 dan tekan F9. Pada panel yang muncul masukkan scrip berikut : 

//perintah yang dijalankan ketika frame ini dimainkan
onEnterFrame = function () {
	//jika nilai acak 10 bernilai 5
	if (random(10) == 5) {
		//masukkan movie clip berlinkage gelembung ke dalam stage dengan posisi x sesuai nilai acak panjang stage dan posisi y sesuai lebar stage ditambah 20
		gelembung = attachMovie("gelembung", "gelembung"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:random(Stage.width), _y:Stage.height+20});
		//membuat variable waktu di dalam movie clip gelembung dengan nilai acak 40
		gelembung.waktu = random(40);
		//perintah yang dijalankan ketika frame di dalam movie clip gelembung dimainkan
		gelembung.onEnterFrame = function() {
			//koordinat y movie clip ini dikurangi 5
			//movie clip gelembung bergerak ke atas
			this._y -= 5;
			//variable waktu movie clip ini ditambah 1
			this.waktu++;
			//jika nilai variable waktu kurang dari 20
			if (this.waktu<20) {
				//koordinat x movie clip ini ditambah 1
				//movie clip gelembung bergerak ke kanan
				this._x++;
			}
			//jika nilai variable waktu lebih dari 20 dan jika nilai variable waktu kurang dari 40
			if (this.waktu>20 && this.waktu<40) {
				//koordinat x movie clip ini dikurangi 1
				//movie clip gelembung bergerak ke kiri
				this._x--;
			}
			//jika nilai variable waktu lebih dari 40
			if (this.waktu>40) {
				//ubah nilai variable waktu menjadi 0
				this.waktu = 0;
			}
			//jika koordinat y movie clip ini kurang dari -20
			if (this._y<-20) {
				//hapus move clip ini
				removeMovieClip(this);
			}
		};
		//ketika mouse berada di atas movie clip gelembung
		gelembung.onRollOver = function() {
			//hapus movie clip ini
			removeMovieClip(this);
		};
	}
};

7. Tekan Ctrl+Enter untuk melihat hasilnya.
8. Selesai.

Jika kaliah masih belum paham dengan tutorial diatas. Kalian bisa download DISINI untuk tutorial yang lebih lengkap.

Nah,,, sampai disini dulu totorial cara membuat gelembung. Sampai ketemu lagi ditutorial-tutorial lainnya.............

 
Idham Desain © 2030| Designed by IDAM BASHORI, Contact Person via Facebook , Twitter and Google+