Prak 15 – Animasi menggunakan Programming

1. Tujuan

Mengenal bentuk lain pembuatan animasi. Yaitu pembuatan animasi menggunakan programming.

2. Alat

Adobe Flash Professional CS6

3. Bahan

Flint Particle Engine
Download file tersebut kemudian extract. Ambil file “Flint2d_4.0.1.swc”

4. Dasar Teori

Membuat animasi bisa dilakukan dengan berbagai cara. Salah satunya dengan menggunakan programming. Salah satu bentuk programming untuk membuat animasi adalah Particle System.

5. Tugas Praktikum

1. Lakukan petunjuk praktikum yang diberikan
2. Ubah posisi dari animasi tersebut
3. Ubah warna dari animasi tersebut
4. Ubah radius dari animasi tersebut
5. Ubah posisi animasi tersebut setiap kali muncul

6. Petunjuk Praktikum

1. Buat project ActionScript 3

2. Buka action window dengan menekan tombol “actions” pada panel di sebelah kanan


3. Salin kode berikut pada “actions” window

import org.flintparticles.common.actions.*;
import org.flintparticles.common.counters.*;
import org.flintparticles.common.displayObjects.Dot;
import org.flintparticles.common.easing.Quadratic;
import org.flintparticles.common.events.EmitterEvent;
import org.flintparticles.common.initializers.*;
import org.flintparticles.twoD.actions.*;
import org.flintparticles.twoD.emitters.Emitter2D;
import org.flintparticles.twoD.initializers.*;
import org.flintparticles.twoD.renderers.*;
import org.flintparticles.twoD.zones.*;

var emitter:Emitter2D = new Emitter2D();

emitter.counter = new Blast( 700 );

emitter.addInitializer( new SharedImage( new Dot( 2 ) ) );
emitter.addInitializer( new ColorInit( 0xFFFFFF00, 0xFFFF6600 ) );
emitter.addInitializer( new Velocity( new DiscZone( new Point( 0, 0 ), 200, 120 ) ) );
emitter.addInitializer( new Lifetime( 5 ) );

emitter.addAction( new Age( Quadratic.easeIn ) );
emitter.addAction( new Move() );
emitter.addAction( new Fade() );
emitter.addAction( new Accelerate( 0, 50 ) );
emitter.addAction( new LinearDrag( 0.5 ) );

emitter.addEventListener( EmitterEvent.EMITTER_EMPTY, restart, false, 0, true );

var renderer:BitmapRenderer = new BitmapRenderer( new Rectangle( 0, 0, 500, 400 ) );
renderer.addFilter( new BlurFilter( 2, 2, 1 ) );
renderer.addFilter( new ColorMatrixFilter( [ 1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,0.95,0 ] ) );
renderer.addEmitter( emitter );
addChild( renderer );

emitter.x = 250;
emitter.y = 150;
emitter.start();

function restart( ev:EmitterEvent ):void
{
  Emitter2D( ev.target ).start();
}




1. Sehingga “actions” window berisi kode seperti berikut





2. Buka “ActionScript Setting”



3. Pilih tab “Library Path” klik icon “Browse to SWC”



4. Pilih file swc “Flint2d_4.0.1.swc”



5. Pastikan file swc tersebut muncul pada daftar



6. Tekan “OK” kemudian jalankan movie-nya (Test Movie, Ctrl + Enter)

7. Hasil Praktikum

1. Lakukan petunjuk praktikum yang diberikan

src="http://ximg.us/upload/1452327318.swf"

2. Ubah posisi dari animasi tersebut
3. Ubah warna dari animasi tersebut
4. Ubah radius dari animasi tersebut
5. Ubah posisi animasi tersebut setiap kali muncul

8. Kesimpulan

9. Referensi

1. Create Fireworks animation using Flint Particle Engine

Prak 14 – Shape Tween

1. Tujuan

Menguasai tool shape tween

2. Alat

Adobe Flash Profesional CS6

3. Bahan

Logomotion

4. Dasar Teori

Shape tween adalah tool yang memungkinkan penganimasian perubahan bentuk antar dua keyframe secara otomatis

5. Tugas Praktikum

Buatlah tiruan dari animasi berikut

6. Petunjuk Praktikum

Silahkan tirukan animasi tersebut sebaik mungkin

7. Hasil Praktikum

Add caption

8. Kesimpulan

Pada praktikum ini peneliti bisa memperbaiki arah perubahan bentuk agar identik dengan yang dicontohkan.

9. Referensi

Moh Hasbi Assidiqi
Dasar teori flash
Youtube

Prak 13 - Shape Tween

1. Tujuan

Mengusai penggunaan tools bernama shape tween

2. Alat

Adobe Flash Professional CS6

3. Bahan

Logomotion

4. Dasar Teori

Shape Tween adalah perubahan bentuk dari suatu objek ke objek lain. untuk Shape Tween objek yang dianimasikan harus berjenis Shape, untuk ukuran file yang dihasilkan Shape Tween lebih besar dibandingkan motion Tween.

5. Tugas Praktikum

Buatlah tiruan animasi berikut
1. 

2.

6. Petunjuk Praktikum

Silahkan tirukan animasi tersebut sebaik mungkin

7. Hasil Praktikum

8. Kesimpulan

Pada praktikum ini peneliti bisa memperbaiki arah perubahan bentuk agar identik dengan yang dicontohkan.

9. Referensi

Moh Hasbi Assidiqi
Dasar teori flash
Youtube