SUMBER BELAJAR PENUNJANG PLPG 2016

MATA PELAJARAN/PAKET KEAHLIAN

MULTIMEDIA

BAB XV
MENYAJIKAN ANIMASI DUA DIMENSI

Wahyu Sakti G. I.

KEMENTERIAN PENDIDIKAN DAN KEBUDAYAAN

DIREKTORAT JENDERAL GURU DAN TENAGA KEPENDIDIKAN
2016
 MATERI 15
MENYAJIKAN ANIMASI DUA DIMENSI

Kompetensi Dasar:
 Menyajikan Animasi 2D
Materi Pokok:
 Teknik Animasi Frame
 Animasi Tweening

A. Pengenalan Adobe Flash

Sebelum membahas mengenai pembuatan Animasi, terlebih dahulu akan
dibahas mengenai software Adobe Flash. Adobe Flash merupakan software yang
dirancang oleh Adobe yang dapat digunakan untuk membuat Animasi web, film
kartun, simulasi, dan media pembelajaran interaktif. Software ini dulunya berna-
ma Macromedia Flash yang dikeluarkan oleh perusahaan Macromedia. Berikut
ini adalah tampilan lembar kerja Adobe Flash CS6.

Gambar 15.1 Tampilan Lembar Kerja Adobe Flash CS6

1. Menu Bar, berisi kumpulan menu perintah, antara lain: File, Edit, View, Insert,
Modify, Text, Commands, Control, Debug, Window, dan Help.

1
2. Stage: halaman kerja yang digunakan untuk menempatkan objek yang ingin
ditampilkan pada saat publishing.
3. Timeline: panel yang berguna untuk mengatur objek pada tingkat layer mau-
pun frame, serta sebagai pengatur jalannya Animasi dan durasi waktu kece-
patan frame-nya.
4. Panel: terdapat dua panel. Panel dengan susunan ikon-ikon menurun, terdiri
dari: Color Mixer Panel, Info, Transform, Component, dan Motion Presets
Panel. Panel dengan susunan tab-tab mendatar, terdiri dari: Tab Properties
yang berfungsi untuk mengatur properties document, Object, Tool, dan lain-
lain. Sedangkan Tab Library berfungsi sebagai tempat penyimpanan objek-
objek yang digunakan (symbol, gambar, suara, video, dan lain-lain).
5. Tool Box: panel yang berisi kumpulan tool yang dapat digunakan untuk mem-
buat dan mengedit objek.

Berikut ini adalah fungsi dari masing-masing tool pada Toolbox

Tabel 15.1 Fungsi Masing-masing Toolbox

Tool Fungsi

Selection Tool (V) Untuk memilih atau menyeleksi suatu objek.

Untuk menyeleksi objek shape lebih detail dari
Sub Selection Tool (A)
Selection Tool.
Untuk mentransformasikan objek yang terse-
Free Transform Tool (Q)
leksi.
Gradient Transform Tool Untuk mentransformasikan gradient fill objek
(F) yang terseleksi.
Line Tool (N) Untuk membuat objek berupa garis.
Untuk menyeleksi objek dengan menggambar
Lasso Tool (L) sebuah garis seleksi.
Untuk menggambar garis dengan bantuan titik
Pen Tool (P)
bantu seperti dalam pembuatan garis, kurva.
atau gambar.
Text Tool (T) Untuk membuat objek teks.
Untuk membuat objek berbentuk bulat atau
Oval Tool (O)
oval.
Untuk membuat objek berbentuk persegi pan-
Rectangle Tool (R)
jang.

2
 Pencil Tool (Y) Untuk membuat garis.
Untuk membuat bentuk garis-garis dan bentuk
Brush Tool (B)
bebas.
Untuk membuat objek effect yang sudah dise-
Deco Tool (U)
diakan.
Untuk mengubah warna garis, lebar garis, dan
Ink Bottle Tool (S) style garis atau garis luar sebuah bentuk.
Untuk memberi atau mengubah warna area
sebuah objek yang telah diwarnai. Paint dapat
Paint Bucket Tool (K)
digunakan untuk mewarnai warna solid, peng-
isian warna gradasi dan pengisian bitmap.
Untuk mengambil sample satu warna dari gam-
Eyedropper Tool (I)
bar atau objek.
Eraser Tool (E) Untuk menghapus objek.
Untuk menggeser tampilan stage tanpa meng-
Hand Tool (H) ubah pembesaran.
Untuk memperbesar atau memperkecil tam-
Zoom Tool (M,Z) pilan stage.
Digunakan untuk memilih atau memberi warna
Stroke Color pada suatu garis
Untuk memilih atau memberi warna pada sua-
Fill Color tu objek
Black and White hanya digunakan untuk war-
Black and White, Swap na hitam putih, Swap Color digunakan untuk
Color menukar warna fill atau stroke yang aktif.

B. Istilah-Istilah Dasar dalam Pembuatan Animasi

1. Frame, Keyframe, dan Blank Keyframe

Gambar 15.2 Contoh Frame

3
 Frame merupakan tempat objek yang dibuat berada. Isi frame akan selalu
sama dengan key frame sebelumnya. Untuk menambahkan frame dapat dilaku-
kan dengan klik kanan dan pilih Insert Frame atau tekan F5. Key frame merupa-
kan frame, dimana kita bisa meletakkan objek. Key frame digunakan untuk me-
nempatkan perubahan gambar atau objek dari Animasi. Untuk menambahkan
key frame dapat dilakukan dengan klik kanan dan pilih Insert Keyframe atau te-
kan F6.
Blank key frame atau frame kosong dilambangkan dengan bulatan putih.
Apabila blank key-frame ini berisi objek, maka frame ini akan berubah menjadi
key frame. Untuk menambahkan blank key-frame dapat dilakukan dengan klik
kanan dan pilih Insert Blank Keyframe atau tekan F7.

2. Layer

Gambar 15.3 Contoh Layer

Layer pada Flash dianalogikan sebagai sebuah media gambar yang trans-
paran. Kita dapat menghasilkan komposisi gambar dengan menumpuk beberapa
gambar yang dibuat pada media transparan. Gambar pada lapisan bawah akan
tertutup oleh gambar pada lapisan atasnya, akan tetapi gambar pada lapisan ba-
wah dapat terlihat di bagian yang kosong dari lapisan atasnya.

3. Symbol
Symbol adalah objek yang yang berupa symbol. Ada 3 (tiga) jenis symbol
pada Flash, yaitu: (1) Movie Clip, merupakan symbol yang berupa kumpulan fra-
me, dan dapat berulang; (2) Button, merupakan symbol yang berupa tombol; dan
(3) Graphic merupakan symbol yang berupa gambar. Untuk membuat symbol da-
pat dengan berbagai cara, antara lain:

4
1. Membuat symbol baru, Insert -> New Symbol (Ctrl + F8), kemudian pilih type
symbol.
2. Merubah objek yang sudah ada dan menjadi symbol, Select Objek -> klik ka-
nan -> Conver to Symbol (atau tekan tombol F8) -> Pilih type symbol.

Gambar 15.4 Merubah Obyek yang Sudah Ada

C. Teknik Animasi

1. Animasi Frame by Frame

Teknik ini adalah teknik paling dasar dari Animasi. Teknik Animasi frame
by frame adalah Teknik Animasi yang dilakukan dengan mengubah obyek (baik
bentuk ataupun posisinya) pada halaman kerja di setiap frame-nya. Lama tidak-
nya sebuah Animasi sangat bergantung dari jumlah frame. Pembuatan Animasi
frame by frame membutuhkan waktu yang lama, karena harus mengubah obyek
pada setiap frame untuk membuat Efek Animasi.
Berikut ini merupakan contoh pembuatan Animasi frame by frame, sebagai
contoh adalah menggerakkan obyek persegi panjang ke arah kanan.
1) Buat obyek persegi panjang menggunakan Rectangle Tool pada Tool Box.

Gambar 15.5 Contoh Pembuatan Animasi Frame by Frame

5
2) Pada frame kedua, tambahkan key frame baru dengan cara: klik kanan pada
frame kedua, dan kemudian pilih Insert Keyframe.

Gambar 15.6 Tambah Key Frame Baru

3) Pada frame kedua, geser posisi obyek persegi panjang ke sebelah kanan.

Gambar 15.7 Menggeser Posisi Objek Persegi Panjang

4) Tambahkan lagi key frame pada frame ketiga, dengan cara seperti pada lang-
kah kedua. Kemudian geser lagi obyek ke sebelah kanan seperti pada lang-
kah ketiga.
5) Ulangi langkah kedua sampai keempat sampai dengan jumlah frame yang
diinginkan. Semakin banyak frame, semakin lama durasi Animasi yang ter-
bentuk.

6
6) Agar transisi perpindahan obyek terlihat halus, maka sebaiknya jangan terla-
lu jauh menggeser obyek pada tiap frame-nya.
7) Jalankan Animasi, dengan memilih menu Control -> Test Movie -> Test atau
tekan Ctrl + Enter.

2. Animasi Tweening
Untuk membuat Animasi (objek bergerak) pada Flash ada beberapa cara,
antara lain: Motion Tween, Shape Tween, Motion Guide, dan Masking.
a. Motion Tween
Merupakan Animasi pergerakan/perubahan koordinat suatu symbol. Jadi,
objek yang dapat digunakan pada Motion Tween hanya objek jenis Symbol.
Langkah-langkah membuatnya:
1) Buatlah sebuah objek persegi pada layer 1 frame 1.
2) Kemudian klik kanan pada layer 1 frame 15 -> pilih Insert Keyframe.
Geser kedudukan objek persegi layer 1 frame 15 ke arah kanan.

Gambar 15.8 Menggeser Kedudukan Obyek Persegi

3) Klik kanan pada frame (antara key frame 1 dan 15), pilih Create Classic
Tween.
4) Jalankan Animasi dengan memilih menu: Control -> Test Movie (Ctrl+Enter).

b. Shape Tween
Merupakan Animasi perubahan bentuk/koordinat suatu objek jenis Shape.
Cara ini mirip dengan Motion Tween, hanya saja objek yang digunakan tidak per-
lu di-convert menjadi symbol terlebih dahulu. Langkah-langkah membuatnya:
1) Buatlah sebuah objek segi empat pada layer 1 frame 1.

7
2) Kemudian klik kanan pada layer 1 frame 15, pilih Insert Blank Keyframe.
3) Buat objek lingkaran pada layer 1 keyf rame 15 tersebut.

Gambar 15.9 Contoh Pembuatan Shape Tween

4) Klik kanan pada frame antara key frame 1 dan 15, lalu klik kanan pilih Create
Shape Tween.
5) Jalankan Animasi dengan Memilih menu Control > Test Movie (Ctrl+Enter).

c. Motion Guide
Merupakan Animasi pergerakan suatu objek yang mengikuti guide (garis)
yang dibuat. Cara ini juga menggunakan cara Motion Tween, sehingga objek
yang digunakan harus objek jenis symbol. Langkah-langkah membuatnya:
1) Buat 2 buah layer masing-masing beri nama: layer=bola dan layer=garis.
2) Buatlah sebuah objek lingkaran pada frame 1 layer “bola” dan objek garis
pada layer “garis” (bisa menggunakan pen/pencil tool).
3) Lalu pada frame 15 layer “garis”, klik kanan -> pilih Insert Frame dan pada
frame 15 layer “bola” pilih Insert Keyframe.
4) Kemudian pada frame 15 layer “bola”, pindahkan objek bola ke bagian ba-
gian/ujung akhir garis.

8
 Gambar 15.10 Memindahkan Objek Bola ke Akhir Garis
5) Klik kanan pada layer “garis”, pilih Guide/ Add Classic Motion Guide.
6) Klik kanan pada frame antara key frame 1 dan 15 pada layer “bola”, pilih
Create Classic Tween.
7) Jalankan Animasi dengan memilih menu Control -> Test Movie (Ctrl+Enter).

d. Masking
Fasilitas ini digunakan untuk menutupi layer yang berada di bawah layer
mask, sehingga objek yang tampak hanya yang berada di area objek masking.
Contoh Animasi yang digunakan dengan cara ini adalah Animasi Teks Kilap berja-
lan. Langkah-langkah membuat Animasi Teks Kilap:
1) Buat 3 layer, masing-masing beri nama layer: “teks”, “kilap”, dan “mask”.

Gambar 15.11 Membuat 3 Layer

2) Pada layer “teks”, buat objek text bertuliskan “MULTIMEDIA”.
Kemudian copy teks tersebut dan paste in place (Ctrl + Shift + V) ke layer
“mask” pada frame 1. Setelah itu buat objek segi empat pada layer “kilap”
frame 1.
3) Selesai membuat objek, tambahkan 40 frame pada layer “teks” dan layer
“mask”, serta Insert Keyframe pada frame 40 layer “kilap”. Ubah kedudukan
objek “kilap” pada akhir teks “MULTIMEDIA”.

9
 Klik kanan pada frame layer “kilap”, pilih Create Shape tween.
4) Kemudian klik kanan pada layer “mask”, pilih Mask untuk memberi efek
mask. Hasilnya seperti gambar di bawah.

5) Jalankan Animasi dengan memilih menu Control > Test Movie (Ctrl+Enter).

Sajian Sumber Belajar ini disusun untuk kepentingan belajar, yang

dirujuk/disalin/disarikan/diadaptasi dari:
Oprekzone. 2016. 12 Prinsip Dasar Animasi, (Online), (http://oprekzone.com/
12-prinsip-animasi/, diakses 13 Juli 2016).
Purnomo, Wahyu. 2013. Animasi 2D untuk SMK/MAK Kelas XII Semester 1.
Jakarta: Kemendikbud.
Williams, R. 2012. The Animator's Survival Kit: A Manual of Methods, Principles
and Formulas for Classical, Computer, Games, Stop Motion and Internet
Animators. New York: Farrar, Straus, and Giroux.

10