cara membuat kartun sederhana

Kamis, 22 Mei 2014

cara membuat kartun sederhana




MEMBUAT ANIMASI OBYEK DAN TEKS DENGAN MENGGUNAKAN MACROMEDIA FLASH 8*




I.   Pendahuluan

A.  Macromedia Flash 8

Macromedia  Flash  adalah  software  yang  banyak  dipakai  oleh  desainer web karena mempunyai kemampuan yang lebih unggul dalam menampilkan multimedia, gabungan antara grafis, animasi, suara, serta interaktifitas user. Macromedia  Flash merupakan  sebuah program aplikasi standart authoring tool profesional yang digunakan untuk membuat animasi objek atau text yang sangat menakjubkan  untuk  membuat  suatu  situs  web  yang  interaktif,  menarik  dan dinamis. Software ini berbasis animasi vektor yang dapat digunakan untuk menghasilkan  animasi web, presentasi, game, film, maupun CD   pembelajaran interaktif.
Interaksi user dalam movie flash menggunakan  Actionscript.  Actionscript adalah suatu bahasa pemrograman yang berorientasi objek yang dipakai dalam Macromedia  Flash 8,. Macromedia  Flash 8 menyediakan  fasilitas-fasilitas  yang lebih  banyak  dan menarik  yang akan membantu,  mempermudah    user  dalam mempelajari  atau menggunakan  software  ini dibandingkan  dengan  Flash versi sebelumnya.  Animasi-animasi  dapat dibuat dengan lebih sederhana,  cepat dan lebih  menarik  menggunakan  Flash  MX karena  adanya  kelebihan  yang  dimiliki oleh Flash MX.


B. Area Kerja Macromedia Flash 8

Macromedia  Flash  MX  mempunyai  area  kerja  yang  terdiri  dari  enam bagian pokok yaitu :
Menu

Berisi  kumpulan  instruksi  atau  perintah-perintah  yang  digunakan  dalam Flash  MX.  Terdiri  dari  menu  File,  Edit,  View,  Insert,  Modify,  Text,  Control, Window, Help.

Stage



Stage   adalah   layer   (document   dalam   word)   yang   akan   digunakan


meletakkan objek-objek dalam Flash.





Title Bar Time Line        Menu Bar



Tool s Box

Color Mixer Panel










Stage










Properties Panel             Action Panels


Gambar 1.1 Area Kerja Macromedia Flash MX


Timeline

Timeline berisi frame-frame yang berfungsi untuk mengontrol objek yang dibuat dalam stage atau layer yang akan dibuat animasinya.
Toolbox

Toolbox berisi tool-tool atau alat yang digunakan untuk membuat, menggambar, memilih, menulis, memanipulasi objek atau isi yang terdapat dalam stage (layer) dan timeline. Alat-alat yang terdapat dalam toolbox adalah :
Arrow tool              : memilih dan memindahkan object

Subselect tool        : memilih titik-titik pada suatu objek atau garis

Line tool                  : membuat garis

Lasso tool               : memilih sebagian dari object atau bagian tertentu dari object
Pen tool                  : menggambar garis-garis lurus maupun garis kurva
Text tool                  : menulis teks
Oval tool                 : membuat lingkaran
Rectange tool         : membuat persegi maupun persegi panjang
Pencil tool              : menggambar  garis-garis  bebas,  seperti  menggunakan pensil biasa
Brush tool               : berfungsi seperti kuas untuk mengecat mewarnai suatu object
Fill Transform tool : mengatur ukuran, tengah, arah dari warna gradasi atau bidang suatu objek
Free Transform tool : mengubah  dan memodifikasi  bentuk dari objek yang dibuat bisa berupa memperbesar,  memperkecil  ukuran objek.
Ink Bottle tool        : menambah, memberi dan mengubah warna pada garis di pinggir suatu objek (Stroke)
Paint bucket tool   : menambah,  memberi,   mengubah  warna  pada  bidang objek yang dibuat
Eyedropper tool     : mengidentifikasikan warna atau garis dala sauatu objek
Eraser tool              : menghapus area yang tidak diinginkan dari suatu objek



Arrow Line Pen Oval
Pencil
Free
Ink Bottle
Eye

Sub
Lasso
Text Rectange Brush
Fill
Paint
Erase

Zoom

Stroke
Fill Color

Modifier

II.  Objek-objek Dalam Macromedia Flash 8


A.  Dasar Objek
Ketika menggambar objek dalam Flash seperti objek lingkaran, kotak, oval dll, secara otomatis Flash akan menyediakan dua unsur objek, yaitu Fill (bidang objek) dan Stroke (bingkai/pinggir objek).






Fill (bidang)

Stroke





Gambar 2. 1 Unsur Objek



B. Memilih atau Menyeleksi Objek

Objek dalam Flash terbagi dalam dua unsur yaitu Fill objek dan stroke objek.


Gambar 2.2                       Gambar 2.3                     Gambar 2.4                Gambar

2.5


Keterangan :
Gambar 2.2 Objek Belum Diseleksi
Gambar 2.4 Stroke Objek Terseleksi

Gambar 2.3 Fill Objek Terseleksi
Gambar     2.5    Fill    dan    Stroke     Objek

Terseleksi

Untuk  melakukan  penyeleksian  objek,  dilakukan  dengan  menggunakan Arrow  Tool  yang  terdapat  dalam  Tools  Box,  kemudian  tinggal  di klik  fill  atau stroke dari objekyang  akan diseleksi.  Untuk menyeleksi  seluruh  objek (fill dan stroke) double klik pada fill objek tersebut.Objek Terseleksi

C. Membuat Gradasi Warna

Untuk membuat contoh suatu gradasi warna ikuti langkah berikut :

1.  Buatlah sebuah objek lingkaran pada stage.

2.  Buatlah lingkaran tersebut tanpa stroke.

3.  Seleksi objek lingkaran tersebut.

4.  Klik tanda segitiga   pada Panel Color Mixer. Jika Panel Color Mixer belum ada klik menu Window > Color Mixer kemudian tempatkan di bagian panel (bagian kanan stage).
5.  Klik Fill Color, pilih warna hitam.

6.  Klik Fill Style pilih Radial.  Lingkaran  akan berubah  menjadi gradasi  putih- hitam
7.  Ubahlah   gradasi   putih-hitam   menjadi   gradasi   hitam-putih.   Klik   Pointer

Gradasi  bagian  kiri  di  Bar  Gradasi  kemudian  klik  Fill  Color  dan  ganti warnanya menjadi hitam.
8.  Klik Pointer Gradasi bagian kanan lalu klik Fill Color ganti warnanya menjadi putih.















Gambar 2.10 Panel Color Mixer dengan Gradasi Radial Putih-Hitam

Gambar 2.11 Hasil Gradasi Warna


D. Transformasi Objek

Untuk mengubah skala objek, langkahnya dalah sebagai berikut :

1.  Buat objek segiempat di stage.

2.  Seleksi seluruh objek.

3.  Klik Free Transform tool pada toolbox

4.  Drag salah satu titik sudutnya.










Gambar 2.12 Panel Transform

G. Menata Posisi Objek

1.  Seleksi atau pilih objek yang akan dirapikan.

2.  Klik Align Panel (Jika belum ada Klik  Window > Align).

3.  Klik icon To Stage di Align Panel untuK  merapikan  objek relatif  terhadap ukuran stage.
4.  Klik icon-icon yang ada di Align Panel pada perintah Align, Distribute, atau Amtch  Size     untuk  merapikan  objek  yang  sudah  dipilih  sesuai  dengan kebutuhan.

Gambar 2.14 Align Panel



III.  Mengolah Teks dan Symbol

A.  Mengolah Teks

Teks  digunakan  untuk  menerangkan  atau  menjelaskan  sesuatu  dalam bentuk  tulisan,  pembuatan  judul,  komponen  animasi,  keterangan-keterangan untuk movie interaktif. Teks merupakan bagian yang mempunyai perananl cukup besar  dalam  pembuatan  animasi.  Teks  dapat  dimanipulasi  atau  dimodifikasi seperti halnya objek dalam Flash 8 sesuai dengan kebutuhan sehingga teks yang dihasilkan mempunyai banyak variasi.

Teks dalam Flash ditulis dengan memggunakan bantuan Text Tool pada Toolbox.  Teks  yang  dihasilkan  dapat  di  setting  dengan  menggunakan  Propeties Panel. Propeties Panels untuk teks berisi menu atau atribut-atribut untuk membuat
dan mengedit suatu teks.





Instance Name



Text (fill) color
Char Spacing                Font Size

Bold Style
Italic Style
Change Direction of Text
Rotation

Text Type

Font

Auto Kern

Aligment














Weight-Height
X-Y Location

Line type

Selectable

Border   Variable

Edit Format
Option


URL Link

Render Text as HTML

Edit Char
Option


Gambar 3.1 Properties Panels

Target



Flash  8 mempunyai  tiga  tipe  teks  yang  masing-masing  mempunyai  fungsi yang berbeda. Tipe teks tersebut adalah sebagai berikut :
1.  Static  Text  adalah  jenis  teks  yang  mempunyai  karakter-karakter  seperti  teks biasa pada umumnya.
2.  Dynamic Text adalah jenis teks yang dapat menampilkan sifat teks yang dinamis dan  bisa  dikontrol,  contohnya  skor  pertandingan  olah  raga  yang    yang  dapat berganti sesuai dengan perolehan nilai dari pertandingan,  nilai kurs mata uang dalam bursa efek, dll.
3.  Input Text adalah jenis teks yang dapat diisi oleh pengguna  atau user dalam sebuah form isian atau Input Text digunakan untuk menerima berbagai input dari
user.
Teks yang ditulis atau dibuat dalam Flash orientasi  dapat diubah sesuai dengan kebutuhan. Orientasi teks dalam flash ada tiga macam, yaitu horizontal , Vertical Left-to-Right dan Vertical Right-to-Left



Vertical Left-to-Right               Horizontal         Vertical Right-to-Left


Gambar 3.2 Orientasi Teks

B. Symbol Instance

1. Membuat Simbol

Pastikan tidak ada objek yang terseleksi pada stage. Klik menu Insert > New Symbol.
Akan tampil kotak dialog Create New Symbol.
Simbol   yang  baru  dibuat   akan  diletakkan   dalam   Library   Panel, kemudian tampilan Stage akan berubah ke Mode Edit Simbol.












Nama





Gambar 4.3 Library Panel


Pada mode Edit simbol buatlah sebuah objek dengan bantuan tool-tool untuk menggambar yang ada pada Toolbox.
Setelah simbol dibuat, klik tombol Back untuk kembali ke Scene 1 atau kembali ke stage utama.

2.  Mengubah atau Mengonversi Objek Menjadi Simbol

Simbol dapat dibuat dengan mengonversi atau mengubah objek tersebut menjadi  simbol.  Langkah-langkah   untuk  mengonversi   objek  menjadi  simbol adalah sebagai berikut :
Pilih salah satu objek yang ada di stage untuk dikonversi menjadi simbol. Klik menu Insert > Convert to Symbol. Dapat juga dengan menekan F8 pada keyboard.










Gambar 4.4 Konversi objek ke simbol

Ketikkan  nama  untuk  simbol  tersebut  pada  kotak  isian  Name  pada

Convert to Symbol.

Tentukan  jenis  simbol  tersebut  dengan  memilih  opsi  yang  ada  pada pilihan Behavior.
Pilih opsi Registration,  tentukan titik registrasi dari simbol yang dibuat dengan meng-klik pada salah satu kotak kecil dari sembilan kotak yang ada.
Klik tombol OK.

Objek   telah   menjadi   simbol   ditandai   dengan   tanda   kotak   yang mengelilingi  objek  pada  stage  dan  simbol  akan  masuk  pada  Library Panel.












Gambar 4.5 Hasil Convert to Symbol


3.  Membuat Instance

Instance  dapat  dibuat  dari simbol-simbol  yang  ada  pada  Library  Panel. Langkah-langkahnya adalah sebagai berikut :
Buka Library Panel. Jika belum ada klik menu Window > Library.

Pilih salah satu simbol simbol yang ada pada Library Panel.

Klik dan drag nama simbol atau simbolnya ke stage.




Klik and drag





Klik and drag



Gambar 4.6 Membuat Instance dari Library Panel



IV. Animasi Dalam Flash 8

A.   Membuat Animasi Motion Tween

Animasi  Motion  Tween  adalah  animasi  yang  paling  banyak  digunakan dalam  membuat  suatu  animasi  Tween.  Langkah-langkahnya   adalah  sebagai berikut.
1.  Buka sebuah movie flash baru.

2.  Klik  Oval  tool  pada  toolbox  untuk  mengambar  sebuah  lingkaran  tanpa stroke, beri warna lingkaran tersebut dengan warna gradasi.
3.  Seleksi seluruh lingkaran.

4.  Klik menu Insert > Convert to Symbol untuk mengubah objek menjadi simbol atau tekan F8 pada keyboard.
5.  Beri nama simbol tersebut pada kotak dialog Convert to Symbol dengan mengetikkan nama pada kotak Name.
6.  Pilih  Behavior     Graphic  dengan  mengklik  lingkaran  di  katak  dialog, kemudian klik OK.
7.  Ganti  nama  Layer  1  menjadi  Lingkaran  dengan  double  klik  layer  1

kemudian ketikkan nama layer.




Gambar 5.1 Mengganti Nama Layer

8.  Klik frame 35 di  kotak Timeline.

9.  Klik menu Insert > Keyframe atau klik kanan tombol mouse kemudian pilih

Insert Keyframe.










Gambar 5.2 Insert Keyframe

10. Masih di frame 35, klik Arrow tool pada Toolbox kemudian pilih lingkaran dan pindahkan ke bagian kanan layar ( tempat animasi berakhir).
11. Klik  frame  1  di  Timeline,  kemudian  klik  Properties  panel  pada  bagian

bawah  layar.  Pilihlah  bagian  Tween  dan  klik  Motion  atau  klik  frame  1 kemudian klik kanan tombol mouse dan pilih Create Motion Tween.

Gambar 5.3 Create Motion Tween

12. Klik Frame 35, Lingkaran akan berpindah ke bagian kanan layar.

13. Lakukan Test Movie dengan menekan Ctrl+Enter pada keyboard.



B. Membuat Animasi Motion Tween dengan Objek Mengikuti Alur (Path)

1.   Buat sebuah movie flash baru.

2.   Ganti nama layer menjadi objek.

3.   Buatlah sebuah objek lingkaran atau kotak dengan menggunakan  Oval

Tool atau Rectange Tool pada Toollbox.

4.   Ubahlah objek tersebut menjadi simbol dengan behavior Graphic.

5.   Klik frame 35 pada Timeline dan berilah sebuah Keyframe.

6.   Buat  sebuah  layer  baru,  beri  nama  layer  ini  dengan  nama  Lintasan, letakkan di bawah layer objek.
7.   Buatlah sebuah lintasan pada layer ini dengan menggunakan Pencil Tool

pada Toolbox.

8.   Klik frame 1 Layer objek, dan pindahkan objek pada awal lintasan.


Gambar 5.4 Posisi Awal dan Akhir Objek

9.  Klik frame 35 Layer Objek dan pindahkan objek pada akhir lintasan yang telah dibuat.
10. Kembali ke frame 1,  klik menu Insert > Create Motion Tween atau klik

kanan mouse dan pilih Create Motion Tween.

11. Klik kanan Layer Lintasan  dan klik Guide, terdapat  gambar  palu pada

Layer lintasan.

12. Klik Layer Objek, tahan dan drag/geser layer objek sehingga berada di bawah Layer lintasan, gambar palu berubah pada Layer lintasan.

Gambar 5.5 Layer Guide

13. Lakukan test movie.



C. Membuat Animasi Motion Shape

Animasi motion shape untuk membuat animasi perubahan bentuk satu ke bentuk lainnya, misalnya bentu kotak ke bentuk lingkaran, teks menjadi lingkaran, manusia menjadi binatang , dll.
1. Buatlah sebuah movie flash baru.

2. Buatlah objek kotak di stage dengan Rectange tool.

3. Klik Frame 35, lalu klik menu Insert > Blank Keyframe.

4. Klik Text Tool, dan ketikkan kalimat MULTIMEDIA dengan font Arial ukuran

60 Bold.


Gambar 5.6 Insert Blank Kyframe

5.  Klik Modify > Break A Part sebanyak dua kali.

6.  Klik frame 1, klik Properties dan pilih Shape pada bagian Tween .

7.  Lakukan test movie.



D.   Animasi Masking

Animasi  masking  animasi  yang berfungsi  seperti  topeng  yang  menutupi wajah.  Animasi  masking  berguna  untuk  menutupi  objek  satu  dengan  objek lainnya,  sehingga  objek  yang menutupi  terlihat  transparan.  Misalkan  kita ingin membuat objek tulisan yang akan terlihat jika tertutup oleh objek lain.
1.   Buat sebuah movie flash baru.

2.   Buat tulisan MULTIMEDIA dengan menggunkan Text Tool.

3.   Klik frame 50 lalu klik menu Insert > Keyframe.

4.   Klik menu Insert > Layer untuk membuat layer baru sehingga terdapat dua layer dalam timeline.
5.   Klik Layer 2 untuk berpindah dari Layer 1.

6.  Buat persegi panjang dengan Rectange Tool, persegi panjang dibuat di atas tulisan MULTIMEDIA.
Gambar 5.7 Persegi panjang di atas teks

7. Seleksi  persegi  panjang  tersebut  dan  ubah  menjadi  simbol  dengan behavior Graphic.
8. Klik frame 25 Layer 2, kemudian klik Insert > Keyframe dan pindahkan persegi panjang di bawah tulisan.

Gambar 5.8 Persegi panjang di bawah teks

9. Klik Frame 50 dan pindahkan persegi panjang kembali di atas tulisan.

10. Klik frame 1, kemudian  klik Insert > Create  Motion  Tween  atau klik kanan mouse dan pilih Create Motion Tween atau klik Properties dan pada calon

Gambar 5.9 Animasi Mask  Layer 2

13.   Test movie dengan menekan Ctrl + Enter.



E.  Animasi Tombol

Tambol atau button dalam Falsh MX dapat diberi animasi sehingga tombol akan terlihat lebih menarik dan interaktif pada waktu tombol ditekan atau disentuh dengan mouse pointer.
1.  Buka movie flash baru.

2.  Buatlah persegi panjang dengan Rectange tool. Klik Rectange Tool dan atur sudut  dari persegi  panjang  tersebut  dengan  klik Round  Rectange  Radius pada bagian bawah Toolbox  (properties).


Gambar 5.11 Round Rectange Tool

3.   Atur sudut-sudut  persegi  panjang  dengan  mengganti  nilai pada  Round

Rectange Radius sebesar 30 point.



Gambar 5.12 Rectange Setting

4.   Beri warna persegi panjang dengan warna gradasi,

5.   Klik  Teks  Tool  dan  ketikkan  MENU.  Letakkan  teks  di  atas  persegi panjang.
6.   Aturlah letak persegi panjang dan teks dengan Allign Panel.





Gambar 5.13 Tombol dan Teks

7.     Seleksi seluruh objek (persegi panjang dan teks) dengan drag mouse sampai seluruh objek berada dalam radius mouse drag atau klik Edit > Select All.
8.     Klik  menu  Insert  >  Convert  to  Symbol  atau  tekan  F8,  beri  nama simbol dan pilih Behavior : Button.
9.     Klik Edit > Edit   Symbol  untuk masuk ke menu Edit Symbol  atau

Double Klik simbol tersebut.

10.   Terdapat empat buah frame pada mode Edit Symbol, yaitu Up, Over, Down, Hit. Frame-frame ini mempunyai sifat yang berbeda, yaitu :
Up    : Keadaan tombol standar.

Ove    : Keadaan ketika mouse berada di atas tombol atau melewati tombol

Down: Keadaan tombol ketika ditekan

Hit  : Penentuan area tombol yang bisa diklik dengan mouse.

11.   Klik frame Up kemudian  beri Keyframe  dengan  Insert > Keyframe atau klik kanan mouse dan pilih Insert Keyframe.  Pilih teksnya saja dan ganti warnanya.
12.   Klik frame Over dan beri keyframe. Klik persegi panjang dan ubahlah warna persegi panjang dan teksnya.
13.   Klik Frame Down dan berilah Keyframe. Ubah warna persegi panjang.

Kemudian  pilih  Teksnya  dan  ganti  tulisan  sekaligus  warnanya menjadi DAFTAR.
14. Klik frame Hit dan Insert Keyframe.

15. Klik menu Insert > Layer untuk menambah layer baru. Klik Frame Hit dan beri Keyframe.
16. Masih di Layer 2, klik Rectange tool dan buat kotak di stage dengan ukuran

lebih besar dari tombol. Atur letaknya dengan Align Panel.


over

down

hit


Gambar5.14 Keadaan Tombol Pada Masing-Masing Frame

17. Pindahkan posisi Layer 2 di bawah layer 1 dengan klik  layer 2 dan drag ke bawah sampai layer 1.












Gambar 5.15 Posisi Layer 2 dan Keadaan Frame-Frame Layer 2

18. Klik Scene 1 untuk kembali ke stage utama.

19. Lakukan Test Movie.

DAFTAR PUSTAKA



Andreas Andi S (2003). Menguasai Pembuatan Animasi dengan Flash MX. Jakarta, PT Elex Media Komputindo.

Baba (2003), Animasi Kartun dengan Flash MX, Jakarta, PT elex Media Komputindo

Didik Wijaya (2003). Tips dan Trik Macromedia Flash 5 dengan ActionScript. Jakarta, PT Elex Media Komputindo.

Lukman Hakim dan Siti Mutmainah (2003). Teknik Jitu Menguasai Flash MX.
Jakarta, PT Elex Media Komputindo.

Mdcom ( 2004). Membuat Animasi Kartun dengan Macromedia Flash MX 2004.
Yogyakarta, Penerbit Andi.

Nur Hadi W (2004). Tutorial Komputer Multimedia. Jurusan Pendidikan Matematika
FMIPA Universitas Negeri Yogyakarta.

Home Page Macromedia (www.macromedia.com) Home Page Baba (www.babaflash.com)
Home Page Situs Flash (www.flashkit.com).

0 komentar :

Posting Komentar