HAND OUT

Mata Pelajaran : Animasi 2 Dan 3 Dimensi

Materi Pokok : Animasi Tweening
Waktu : 30 menit
Guru Mata Pelajaran : Empud Mahpudin

A. Kompetensi Dasar dan Indikator

KD 3.3. Menerapkan teknik animasi tweening 2D
Indikator Pencapaian Kompetensi ( IPK )
3.3.1. Menjelaskan Konsep dan cara kerja Animasi Tweening
3.3.2. Mengidentifikasi jenis – jenis dan langkah – langkah Teknik animasi
Tweening

KD. 4.3. Membuat animasi 2D menggunakan teknik tweening

Indikator Pencapaian Kompetensi ( IPK )
4.3.1. Menunjukan Animasi 2D menggunakan Teknik tweening

B. TUJUAN PEMBELAJARAN :
Di akhir kegiatan belajar, Setelah berdiskusi dan menggali informasi, peserta didik
dapat menjelaskan konsep dan Cara Kerja Animasi Tweening, mengidentfikasi
jenis dan langkah – langkah teknik animasi tweening dengan dengan rasa ingin
tahu, tanggung jawab, disiplin selama proses pembelajaran serta mampu
berkomunikasi dan bekerjasama dengan baik.

C. Alat dan Bahan :

1. Teks tertulis yang berkaitan dengan materi pembelajaran.
2. Video animasi teknik tweening.
3. Komputer
4. Projector

-1-
D. PENDAHULUAN
Pada pertemuan yang lalu kita telah membahas tentang animasi tradisional dan
pembuatan objek sederhana dengan aplikasi flash. Seperti yang sudah dijadwalkan
pada silabus, pertemuan kali ini akan membahas mengenai Menerapkan teknik
animasi tweening 2D.
Selama 30 menit kedepan akan disampaikan konsep dasar Animasi Tweening,
jenis – jenis dan langkah pembuatan Animasi Tweening.

E. AKTIVITAS PEMBELAJARAN :
I. Pemberian Rangsangan ( Stimulasi )

Tugas 1 : Amatilah Tayangan Video Animasi yang ditampilkan oleh Guru kemudian
buatlah beberapa point pertanyaan mengenai tayangan video yang ditampilkan
kemudian diskusikan bersama – sama.

List Pertanyaan :.………….……………………………………………………………

……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………

II. Identifikasi Masalah

Carilah Informasi Mengenai Konsep Dasar Tweening Animasi, Jenis – jenis Animasi
Tweening dan Langkah Pembuatan Animasi Tweening yang nantinya di diskusikan
untuk menghasilkan kemampuan menerapkan teknik Animasi Tweening 2 D.

Tugas 2 : 1. Apa Pengertian Animasi Tweening ?

2. Tuliskan Cara Kerja Animasi Tweening ?

Jawaban …………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………

-2-
III. Data Collection ( Pengumpulan data):

A. Pengertian Tweening
Tweening adalah proses
membuat sebuah animasi
pergerakan dengan cara
memberikan perubahan pada
bentuk atau posisi objek
dengan menentukan keyframe
awal dan akhir sehingga dapat
terbentuk frame-frame baru. Fungsi utama tweening adalah untuk menggerakkan
objek dari satu titik ke titik lainnya. 

B. Cara Kerja Tweening

Cara Kerja adalah dengan cara menentukan dua poin keadaan pada objek awal dan
akhir sedangkan macromediaflash membuat rangkaian juga diantaranya gerakan
animasi yang dihasilkan menggunakan metode ini adalah gerakan yang
halus,perubahan letak,rotasi,bentuk maupun warna

C. Jenis – jenis Animasi Tweening

Flash (Adobe Flash atau Macromedia Flash) memiliki kemampuan/fitur yang dapat
kita gunakan untuk membuat sebuah animasi sederhana. Dalam Flash kita bisa
membedakan jenis animasi tweening yaitu :
1. Animasi Motion Tween 
2. Animasi Motion Guide
3. Animasi Shape Tweening 

-3-
Gambar Animasi Motion Tween

Gambar Animasi Shape Tween

4. Teknik Masking
Masking adalah animasi yang menyembunyikan atau menutupi suatu
objek dengan objek lain, sehinga objek yang menutupi terlihat transparan
dan menyatu dengan objek yang ditutupi. Mask artinya adalah penutup
mempunyai fungsi sesuai dengan namanya yaitu untuk menutupi suatu layer.
Mask dapat diterapkan kepada suatu layer dan layer yang sudah dikenai
mask bisa berfungsi untuk menutupi layer dibawahnya.
Prinsip kerja dari Animasi Mask adalah menampilkan bidang yang
tertutup dan menyembunyikan bidang yang terbuka. Layer adalah tempat
untuk meletakkan gambar/image yang telah kita buat untuk kemudian diolah
susunan waktu (timing)nya. Sedangkan masking layer adalah tempat untuk
meletakkan gambar yang akan di olah menggunakan masking, disini layer
masking terdapat di dalam layer lembar kerja yang biasa kita gunakan untuk
membuat animasi. 

-4-
IV. Proccesing (Pengolahan data)

Lembar Kerja 1 :
Tugas Kelompok
Carilah Prinsip dasar dari Jenis – jenis Animasi Tweening berikut :
a. Motion Tween / Classic Tween
b. Shape Tween
c. Motion Guide
d. Masking

……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………

-5-
V. PEMBUKTIAN
Prinsip Kerja dari Animasi ini adalah :
1. Objek harus di convert menjadi symbol jika tidak flash secara otomatis
akan mengkonvert objek dengan nama otomatis, yang akan mempersulit kita
ketika sudah memiliki banyak objek untuk dianimasikan.
2. Satu keyframe khusus untuk satu symbol dalam animasi tween, 1
keyframe hanya boleh ditempati 1 buah symbol. Apabila terdapat 2 objek
atau lebih maka garis putus-putus pada timeline akan muncul dan animasi
tween tidak akan terbentuk sempurna. Gunakan beberapa layer untuk
menganimasikan beberapa objek sekaligus
3. Minimal harus memiliki 2 keyframe animasi motion-tween selalu
membutuhkan keyframe awal dan keyframe akhir.

Langkah Membuat Animasi Tweening

Animasi Motion Tween :

Sebelum membuat animasi motion tween dengan Flash, pastikan terlebih dahulu
anda mengenal tentang software Adobe Flash, Fitur-fitur yang dimiliki, dan
istilah-istilah terkait seperti keyframe, blank keyframe, frame, timeline, symbol,
library, properties, frame rate, drawing tool dsb. Pada tutorial ini akan
dijelaskan cara membuat animasi bola yang bergerak dari kiri ke kanan, sebagai
berikut:

1. Buatlah sebuah project baru dengan memilih menu File > New Pilih

opsi Action Script 2 

-6-
2. Selanjutnya buka panel properties (biasanya terdapat di bawah (CS3)
dan di samping kanan (CS 4+), Kemudian pastikan kolong Frame
rate terisi dengan 30. 30 adalah standart frame rate untuk animasi 2D
dan 45 - 60 untuk animasi 3D. 

3. Dengan menggunakan Oval Tool buatlah sebuah lingkaran, dengan

cara drag and release pada Stage. Perlu diketahui bahwa Flash adalah
program berbasis vector. Setiap objek gambar memiliki 2 penyusun
yaitu outline/stroke (garis tepi) dan fill (isian). Anda dapat merubah
warna, ukuran dan posisi objek gambar dengan menggunakan panel
properties. 

   
4. Selanjutnya seleksi linkaran yang anda buat (stroke dan fill nya),
kemudian pilih menu Modify > Convert to Symbol atau menekan
tombol F8. Kemudian anda ketikan bola pada kolom Name dan
pilih Movieclip pada opsi Type. Lihat gambar! 

 
5. Selanjutnya seleksi lingkaran yang anda buat (stroke dan fill nya),
kemudian pilih menu Modify > Convert to Symbol atau menekan
tombol F8. Kemudian anda ketikan bola pada kolom Name dan
pilih Movieclip pada opsi Type. Lihat gambar! 

-7-
6. Klik kanan Frame 60 pada timeline kemudian pilih Insert
Keyframe. Keyframe adalah sebuah frame khusus yang digunakan
sebagai titik penentu gerakan animasi. Pemilihan frame ke 60
dimaksudkan untuk membuat animasi sepanjang 2 detik (30 fps = 1 detik
menggunakan timeline sepanjang 30 frame). 

 
7. Selanjutnya geser posisi bola yang berada di Frame 60 seperti di
gambar. Jadi di frame 1 bola berada di posisi sebelah kiri stage dan di
frame 2 berada di kanan. 

 
8. Klik kanan Frame 25 pada timeline kemudian pilih Create Motion
Tween untuk CS3 ke bawah atau Create Classic Tween untuk CS4 ke
atas. Maka timeline akan berubah menjadiberwarna biru dan bergaris.
Frame 25 adalah frame diantara 2 keyframe (frame 1 dan frame 60).
Anda bebas memilih frame berapapun selama itu berada diantara 2
keyframe yang akan diberikan animasi tween. 

-8-
9. Simpan project, kemudian jalankan animasi dengan menekan
tombol Ctrl+Enter Maka akan terbentuk sebuah file animasi bertipe
SWF dimana bola bergerak dari kiri ke kanan selama 2 detik dan looping
secara terus menerus. 

Animasi Motion Guide :

Di bawah ini akan ditunjukkan langkah - langkah pembuatan animasi motion

guide dengan menggunakan Add Classic Motion Guide: 
a) Buka file baru atau Ctrl+N, Pilih Action Script 2.0 kemudian klik “OK” 
b) Kemudian kita pilih Oval tool (O) pada toolbox dan kita mulai membuat
objek lingkaran pada stage dengan mengklik dan drag, jangan lupa warna fiil
objek balok harus berbeda dari warna background stage.
c) Klik kanan di frame ke-1, selanjutnya pilih Create Classic Tween
d) Pada frame ke-50 klik kanan dan pilih Keyframe
e) Kemudian klik kanan layer 1 kemudian pilih Add Classic Motion Guide
maka akan muncul layer baru. Posisi layer baru adalah sebagai layer guide.
f) Kemudian dengan layer guide masih terseleksi, pilih Pencil Tool untuk
membuat jalur yang akan menjadi lintasan animasi dari lingkaran. Pencil
tool berfungsi untuk membuat garis objek secara bebas, dengan shortcut [Y].
g) Agar objek lingkaran dapat bergerak sesuai jalur, maka tengah objek
haruslah berada di tengah jalur.
h) Oleh karena itu, klik frame 1 layer 1, Kemudian pilih Free Transform
Tool agar bulatan tengah objek terlihat. Kemudian pindahkan objek sampai
lingkaran tengah objek berada di ujung awal jalur.
i) Kemudian klik frame 50 layer 1, Kemudian pilih Free Transform Tool
agar bulatan tengah objek terlihat. Kemudian pindahkan objek sampai
lingkaran tengah objek berada di ujung akhir jalur. 
j) Kemudian tekan Enter untuk melihat hasilnya 
Catatan : dalam Motion Guide, tengah objek harus berada di tengah (jalur). 

-9-
 VI. KESIMPULAN

Tugas 3 : Tuliskan Kesimpulan yang didapat dari Hasil Diskusi

……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………
……………………………………………………………………………………………

SUMBER PUSTAKA :
1. Buku Paket Animasi 2 Dimensi Kelas XI Mediatama versi revisi 2017 K13
2. Buku Paket BSE Teknik Animasi 2D Kemdikbud, Jakarta 2013
3. https://www.youtube.com/watch?v=5ArRjM2CWfE

EVALUASI / TEST FORMATIF

1. Jelaskan tentang pengertian Tweening Animasi?

2. Sebutkan dan jelaskan jenis – jenis animasi tweening ?
3. Bagaimana Prinsip Animasi Motion Tween ?
4. Bagaimana Prinsip Animasi Motion Shape ?
5. Bagaimana Prinsip Animasi Masking?

- 10 -