Tutorial Adobe Flash

Oleh Muhamad Henrick Cahyanto, ST

Daftar isi

1. Mengenal Adobe Flash

2. Tampilan Tool Dan Stage
a) Menjalankan Adobe Flash
b) Stage
c) Menubar
d) Toolbox
e) Properties
3. Mengenal Timeline
a) Layer
b) Frame
c) Keyframe
d) Playhead
4. Mengenal Symbols
a) Movie Clip
b) Button
c) Graphic
5. Import
a) Memasukkan gambar
b) Memasukkan suara (sound)

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

1. MENGENAL ADOBE FLASH

Adobe Flash adalah sebuah aplikasi / software yang digunakan untuk membuat sebuah gambar
vektor atau animasi (gambar bergerak). Flash memiliki beberapa versi , Mulai dari Macromedia
flash 8, sampai Flash seri dari Adobe. Silahkan gunakan Flash versi berapa saja, intinya
penggunaan tools dan lingkungan kerjanya tidak jauh berbeda. File yang dihasilkan Flash dapat
berupa sebuah file yang berekstensi .swf , dapat dimainkan di sebuah browser yang telah
dipasangi Adobe Flash Player. Ekstensi file project (file kerja flash yang sewaktu waktu dapat
diedit/dimodifikasi/dikerjakan kembali) adalah file yang berekstensi .fla

Flash juga memiliki bahasa pemrograman / aspek coding yang disebut ActionSctipt, digunakan
untuk memberikan fungsi fungsi atau perintah dalam pembuatan animasi atau project tertentu
dalam Flash. Struktur dan karakteristik pada ActionScript agak identik dengan JavaScript.

Pada setiap versi, Adobe Flash mempunyai tampilan yang berbeda - beda. Perbedaan itu
disebabkan karena ada beberapa fitur baru dalam setiap versinya. Tampilan yang akan dibahas
pada tutorial kali ini adalah tampilan pada Adobe Flash CS 5.5. Tampilan pada versi ini tidak jauh
berbeda dengan versi - versi sebelumnya. Jadi anda tidak perlu khawatir jika tampilannya akan
jauh berbeda dengan versi - versi sebelumnya.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

2. TAMPILAN TOOL DAN STAGE

Pertama bukalah software Adobe Flash CS 5.5. Jika anda hanya mempunyai versi dibawahnya itu
tidak akan bermasalah, karena tidak jauh berbeda. Setelah adobe flash dibuka, maka anda akan
disuguhkan dengan kotak dialog.

a) Menjalankan Adobe Flash

Perhatikan pada kotak dialog :

Open a Recent Item : membuka file berekstensi .fla yang terakhir anda buka di flash.
Create New : membuat file flash baru. Terdapat 11 pilihan.
Create from template : membuat file flash baru dengan template yang sudah disediakan.
Learn : membantu anda untuk belajar software ini.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

b) Stage
Stage disebut juga layar atau panggung. Stage digunakan untuk memainkan objek-objek yang
akan diberi animasi. Dalam stage kita dapat membuat gambar, teks, memberi warnadan lain-
lain.

Selanjutnya klik pada ActionScript 2.0 atau ActionScript 3.0.

Maka akan muncul tampilan seperti dibawah ini :

Keterangan :

1. Menu Bar : Berisi kumpulan perintah-perintah operasi pada flash.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

 2. Toolbox : kumpulan tool yang memiliki fungsi-fungsi yang berbeda pada setiap
toolnya.
3. Timeline : digunakan untuk mengatur frame, layer dan durasi animasi.
4. Other Panel : Berisi panel - panel seperti library,color mixer, transform, komponen,
dsb.
5. Panel Properties : panel yang digunakan untuk menampilkan informasi.
6. Stage : halaman kerja pada flash.

c) Menubar

Menu bar berisi kumpulan menu yang memiliki beragam fungsi. Letaknya berada di bar
judul. Lihat gambar di atas.Untuk lebih jelas lihat penjelasannya :

 File : berisi kumpulan menu yang berhubungan pada dokumen flash anda. Misalnya
menu save untuk menyimpan dokumen flash anda.

 Edit : berisi kumpulan menu yang berhubungan dengan objek di stage. Misalnya menu
select all yang digunakan menyeleksi seluruh objek di stage.

 View : berisi kumpulan menu yang berhubungan dengan tampilan di stage. Misalnya
menu zoom in yang digunakan untuk memperbesar tampilan stage.

 Insert : berisi kumpulan menu yang berhubungan dengan timeline, symbol serta scene.
Misalnya menu scene digunakan untuk menambahkan scene pada dokumen flash anda.

 Modify : berisi kumpulan menu yang digunakan untuk mengedit objek di stage. Misalnya
menu convert to symbol yang digunakan untuk membuat objek menjadi symbol

 Text : berisi kumpulan menu yang berhubungan dengan huruf. Misalnya menu font yang
digunakan untuk memilih jenis huruf.

 Commands : berisi kumpulan menu yang berhubungan dengan flash javascript. Misalnya
menu run command yang digunakan untuk menjalankan flash javascript.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

 Control : berisi kumpulan menu yang digunakan untuk melihat hasil animasi/objek yang
anda buat. Misalnya menu play yang digunakan untuk menjalankan animasi di timeline.

 Debug : berisi menu yang digunakan untuk mencari bug (kesalahan) pada penulisan
ActionScript.

 Window : berisi kumpulan menu yang berhubungan dengan panel-panel di flash.

Misalnya menu actions yang digunakan untuk menampilkan panel actions.

 Help : berisi kumpulan menu yang berhubungan dengan tutorial dan cara menggunakan
flash. Misalnya menu flash help yang digunakan untuk menampilkan panel berisi tutorial
dan cara menggunakan flash.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

d) Toolbox

Isinya adalah kumpulan tools / peralatan untuk melakukan fungsi pengeditan, pemberian
warna, penghapusan vector, dan lain lainIsinya adalah kumpulan tools / peralatan untuk
melakukan fungsi pengeditan, pemberian warna, penghapusan vector, dan lain lain

Selection Tool : Untuk memilih dan memindahkan object.

Subselection Tool :Mengubah bentuk object dengan mengedit point object
Free Transform Tool : Untuk mengubah ukuran suatu objek secara bebas
Lasso Tool : Untuk menyeleksi objek yang akan diedit
Pen Tool : Untuk membentuk objek dengan menggunakan sudut / kurva.
Text Tool : Untuk membuat atau menyisipkan teks kata, huruf, kalimat.
Line Tool : untuk membuat garis lurus
Rectangle Tool : Untuk membuat objek segiempat
Pencil Tool : Untuk menggambar sebuah objek layaknya menggunakan pensil
Brush Tool : Untuk menggambar objek bebas layaknya menggunakan sebuah kuas
Ink Bottle Tool : Memberikan warna pada tepi (outline) suatu objek
Paint Bucket Tool : Memberikan warna pada sebuah objek.
Eyedropper Tool : Mengambil sample / contoh warna.
Eraser Tool : Untuk menghapus objek
Hand Tool : Untuk menggeser stage.
Zoom Tool : Untuk memperbesar / memperkecil tampilan pada stage.

Stroke Color : Memilih warna untuk Garis Tepi Objek

Fill Color : Memilih warna untuk sebuah objek

Swap & Black and white : Mengganti warna antara Stroke dan Fill

Snap to Object ; Fungsi untuk mengatur penempatan ideal pada suatu objek

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

 e) Properties
Panel yang memuat informasi dan karakteristik dari suatu objek ataupun stage. Properties
akan berubah ubah tergantung apa yang sedang aktif /terpilih. Misalkan, saya memilih objek
bujur sangkar berwarna merah, maka di properties akan muncul informasi yang berkaitan
dengan objek yang terpilih tadi. Properties juga biasanya digunakan untuk mengatur kembali
ukuran da karakteristik dari suatu stage.

3. MENGENAL TIMELINE

Timeline merupakan Komponen untuk mengatur waktu dan jalannya animasi. Terdiri atas frame
dan keyframe. Terletak di sebelah kanan layer. Biasanya, semakin banyak frame, semakin lama
animasi berjalan dan begitu juga sebaliknya.

a) Layer
Layer dapat anda bayangkan sebagai kumpulan lapisan plastic transparan yang tersusun
vertikal. Anda dapat membuat dan mengedit obyek pada sebuah layer tanpa mengganggu
dan mempengaruhi obyek pada layer yang lainnya.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

b) Frame
Frame merupakan kotak-kotak pada Timeline yang berguna untuk membagi dan mengatur
waktu berjalannya animasi yang Anda buat. Semakin banyak frame ditempatkan maka
semakin lama animasi Anda akan berjalan.

c) Keyframe
Keyframe merupakan frame yang mendefinisikan perubahan yang terjadi pada animasi atau
frame yang digunakan untuk meletakkan frame action.

Lingkaran kecil berwarna hitam menandakan bahwa frame tersebut memiliki obyek.
Sedangkan bila hanya terdapat lingkaran putih berarti frame tersebut tidak memiliki obyek di
dalamnya atau disebut Blank Keyframe.

d) Playhead
Playhead berbentuk kotak merah, digunakan untuk menjalankan animasi berdasarkan
urutannya pada Timeline. Pada saat animasi dijalankan, playhead akan bergerak ke kanan
mengikuti alur animasi yang anda buat. Playhead juga dapat Anda gunakan untuk

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

 mengetahui tampilan animasi pada Stage. Klik dan Drag playhead pada timeline header
menggunakan mouse kearah kanan.

4. MENGENAL SYMBOLS

Symbol adalah objek gambar yang pertama kali kita buat. Bisa berupa vektor atau bitmap. Untuk
membuat simbol dalam objek yang kita buat, caranya yaitu klik insert dan pilih create New
Symbol dan pilih type Movie Clip untuk membuat Symbol baru. Kemudian tampil Stage baru
untuk membuat objek baru atau bisa juga merubah objek gambar yang telah ada menjadi
Symbol baru, dengan cara klik kanan pada objek gambar pilih Convert to Symbol dan pilih Movie
Clip.

Symbol yang telah di buat akan secara otomatis tersimpan di dalam library dan kita juga bisa
membuat objek didalam objek.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

Dengan cara doble klik pada objek yang telah di Convert to Symbol.
Objek objek yang terdapat didalam symbol disebut instance atau anak dari symbol.

kelebihannya dari symbol adalah anda tidak perlu membuat banyak objek kalau objek itu
sama,anda tinggal memsukan objek symbol dengan cara mendrag Symbol dari panel Lybrary
kedalam stage, walaupun objek yang didalam stage anda hapus tetapi objek symbol tetap ada di
dalam panel Lybrary, dan anda bisa menggunakannya lagi.

ada 3 buah jenis Symbol didalam flash yaitu:

1. Movie Clip adalah symbol yang biasa digunakan untuk objek animasi
2. Button adalah symbol untuk membuat tombol yang bersipat diam
3. Graphic adalah objek yang digunakan untuk objek yang tidak beranimasi misalnya untuk
background.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

5. IMPORT

a) Memasukkan gambar
Cara Menambahkan / Import Gambar di Adobe Flash. Ketika kita membuat sebuah animasi
dengan flash mungkin sedikit agak kesulitan untuk membuat desain objek secara manual di
adobe flash tersebut. Kerena memang fasilitas editing objek di adobe flash tidak selengkap
dengan saudaranya photoshop. Tentu saja hal yang wajar karena adobe flash lebih
dikhususkan untuk membuat animasi. Nah untuk mempermudah hal ini, tentunya jalan yang
bisa kita ambil adalah dengan menambahkan objek gambar yang telah jadi ke frame flash
yang akan kita buat.

Berikut cara menambahkan / Import gambar ke Adobe Flash.

1. Pilih Menu File > Import

2. Klik Import to Library

3. Cari File Gambar yang akan di import

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

 4. Klik Tab Library

5. Klik dan Drag gambar ke dalam stage

b) Memasukkan suara (sound)

Sound merupakan salah satu bagian penting dalam suatu aplikasi flash. Berikut adalah cara
memasukkan sound ke dalam file flash.
 Buatlah sebuah dokumen flash baru.
 Klik menu File > Import > Import to Stage, maka akan muncul dialog.
 Pilih file yang ingin dimasukkan, kemudian klik open. Jika sound yang kita import sangat
besar, maka akan tampil progres bar.
 Terkadang file tidak bisa kita import, hal ini dikarenakan file yang dimasukkan kurang
sempurna, karena flash mengharapkan file yang sempurna.
 Jika sudah berhasil, sound tersebut masuk ke library, untuk menampilkan library, tekan
F11 pada keyboard.

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud

 Agar suara dapat dijalankan pada flash, suara kita perlu untuk dimasukkan ke timeline.
Yaitu, klik pada frame 1, kemudian tekan Ctrl + F3 untuk membuka panel properties,
kemudian ganti sound menjadi suara yang tadi kita importkan.

Daftar Sumber :
Adobe.com
Youtube – Channel SamGreenMedia2
Sobatgrafis.blogspot.com
pomplay.blogspot.com
multimediasmk1ampekangkek.blogspot.com
chugygogog.blogspot.com
tisia-tiur.blogspot.com
ieuwelah.com

Pelatihan Animasi 2D dengan Adobe Flash– PSMP Kemdikbud