33
Pernyataan: Background Cover ini menunjukkan Keaslian Ebook ini yang sesuai / sama dengan Cover CD depan aslinya. Dan bila background / Cover setiap Ebook yang ada dalam CD tidak sama dengan cover CD depan, maka Ebook tersebut tidak asli.

Tutorial Flash

Embed Size (px)

DESCRIPTION

Memberi kemudahan agar bisa mempelajari software Flash, Selain itu bisa membuat animasi

Citation preview

Page 1: Tutorial Flash

Pernyataan: Background Cover ini menunjukkan Keaslian Ebook ini yang sesuai / sama dengan Cover CD depan aslinya. Dan bila background / Cover setiap Ebook yang ada dalam CD tidak sama dengan cover CD depan, maka Ebook tersebut tidak asli.

Page 2: Tutorial Flash

Demo Membuat Animasi Teori dan Praktek Abstrak: Perkembangan teknologi komputer demikian pesatnya, yang memiliki fungsi awal sebagai alat Bantu dalam menyelesaikan persoalan dan masalah dalam segala bidang kemudian memasuki fungsi sebagai penghibur. Hal ini ditandai dengan banyak produk-produk yang berbasis komputer dalam dunia hiburan. Salah satu dunia hiburan yang banyak diminati adalah kartun. Penggunaan komputer untuk menghasilkan kartun yang professional sudah dilakukan diawali dengan kartun-kartun yang dibuat Hollywood Amerika Serikat yang menggunakan komputer. Di Indonesia sendiri bermunculan forum-forum yang membahas tentang animasi kartun ini dan beberapa perusahaanperusahaan yang memfokuskan diri di bidang animasi kartun. Pembuatan animasi kartun ini jika ditekuni akan dapat menciptakan peluang-peluang kerja baru di Indonesia. Dalam skripsi ini akan digambarkan cara membuat animasi kartun dengan menggunakan Macromedia Flash MX.

Page 3: Tutorial Flash

1. PendahuluanPada bab ini akan diuraikan cara mendesain kartun dengan menjabarkan proses produksi, pembangunancerita, merencanakan animasi, mendesain karakter, membuat model, membuat layout, membuatanimasi, dan memasukkan suara

a. Mendesain Kebutuhan Animasi KartunAnimasi kartun yang akan didesain ini akan ditampilkan dalam bentuk web atau komputer. Pemilihanmedia tampilnya kartun akan mempengaruhi dari bentuk desain kartun yang akan dibuat. Terdapat duamedia yang saat ini berpengaruh besar yakni media televisi dan komputer.

Pada media televisi, kendala yang dihadapi adalah setiap negara memiliki sistem televisi yang berbeda,dan tidak ada standar umum yang ditetapkan bersama. Kondisi ini menyebabkan media video yangdihasilkan oleh setiap negara susah untuk ditransfer. Contohnya video tape yang dibuat Amerika tidakdapat diputar di Korea ataupun Inggris. Ketidaknyamanan ini disebabkan kondisi politik yang ada dalamnegara tersebut, yang bertujuan untuk menghindari pertukaran informasi dengan cepat yang akanmempengaruhi pandangan, ide maupun gagasan baru dari setiap negara. Tetapi kondisi ini mulaiberubah pada saat internet sudah dapat menjangkau negara di seluruh dunia.

Digital video tidak memiliki batasan, yang didesain dengan kualitas dan ukuran yang mampumenghantarkan informasi ke hadapan penggunanya. Format digital video ini dapat saja disimpan dalambentuk CD-ROM, DVD, ataupun dalam bentuk file yang dapat di download dari internet.

Beberapa sistem televisi yang digunakan umum di seluruh negara adalah:

a. NTSC System

NTSC (National Television System Committee) merupakan sistem milik Amerika Serikatdengan lebar layar 525 baris, 30 fps, digunakan di negara Kanada, Greenland, Mexico, Kuba,Jepang, Philipina, Puerto Rico dan beberapa negara di Amerika Selatan.

b. PAL dan SECAM System

Banyak negara yang menggunakan kedua sistem ini yakni PAL (Phase Alternating Line) atauSECAM (Sequential Color and Memory). Kedua sistem ini memiliki lebar layar 625 baris,dengan penggunaan 25 fps.

c. HDTV

HDTV (High Definition Television) adalah standar internasional baru untuk dunia televisi.HDTV dapat digunakan dalam 1.125 baris.

b. SinopsisAnimasi kartun yang dibuat ini berjudul “Wanita Jagoan Cun Lee” menceritakan aksi dari seorangpendekar wanita yang menunjukkan kehebatan ilmu beladirinya. Pada aksi pertama Cun Lee (namatokoh kartunnya) melakukan tendangan maut, dan kemudian secara beruntun dia mengeluarkan ilmutenaga dalamnya menggunakan tangan kirinya disertai dengan efek suara ilmu yang telahdikeluarkannya.

c. Membuat StoryboardStoryboard adalah rancangan dasar dalam menciptakan suatu animasi kartun. Bentuknya menyerupaihalaman komik. Halaman yang dibangun dalam storyboard ini akan memandu kartunis dan animatordalam membuat gambar dan animasinya. Pada animasi kartun yang dibuat ini gambar yang dihasilkanmerupakan hasil scanning dari buku komik. Storyboard kartun ini:

Page 4: Tutorial Flash

Gambar 1. Storyboard

d. Membuat Latar Belakang

Penggunaan latar belakang dalam animasi kartun merupakan bagian penting dalam keberhasilan animasikartun itu sendiri yang memperkuat kesan yang ingin ditonjolkan. Pemilihan latar belakang harus tepatpada tujuannya dan sesuai dengan waktunya (suasana yang ingin diciptakan). Latar belakang ini jugajangan bersifat kaku yang selalu menampilkan latar belakang seperti kota, gunung, hutan dan lainnya,tetapi juga perlu ditambahkan efek-efek khusus yang memperkuat tokoh utama.

Pada animasi kartun yang akan dibuat ini, latar belakang yang ditampilkan nanti adalah wajah tokohyakni Cun Lee, yang ditampilkan dengan ukuran besar. Tujuannya adalah untuk memperkuat tokohutama karena animasi kartun ini berdurasi singkat.

Page 5: Tutorial Flash

Pose

Inbetween

Pose

2. Prinsip Dasar Animasi Karakter (sumber: animatorforum.org)(sumber: animatorforum.org)

Animasi karakter adalah teknik yang dibuat untuk menghidupkan peran-peran, menjadi suatu karakterhidup dan manusiawi. Untuk menjadi karakter animator yang baik diperlukan perpaduan berbagaikeahlian. Untuk menjadi seorang animator, diperlukan penguasaan keahlian di bidang acting,sinematography, dan pemahaman mengenai proses pembuatan film. Seorang animator juga harusmengerti mengenai proses penceritaan yang baik, akan menarik perhatian penonton sehinggamemancing reaksi penonton yang menyaksikan, baik tertawa, sedih maupun gembira. Dengan kata lain,seorang animator harus bisa mengekpresikan emosi tertentu kepada penonton, bukan mempertontonkanserangkaian gerak yang tidak berarti.

Untuk mampu menghasilkan karya yang baik diperlukan penguasaan terhadap 12 prinsip dasar animasi.Prinsip yang berlaku pada animasi 2D maupun 3D (termasuk paper dan clay animation) adalahrangkuman sifat-sifat gerak di alam, terutama gerak manusia. 10 Prinsip pertama dikenalkan pertamakali oleh Frank Thomas & Ollie Johnston dalam bukunya, Illusion of Life, tahun 1981. Lebih jauh lagiJohn Lasseter, yang dikenal sebagai sutradara film Toys Story, menambahkan menjadi 12 dalammakalahnya di SIGGRAPH 1987, yang berjudul "Principles of Traditional Animation Applied To 3DComputer Animation". Pemahaman kedua belas prinsip tersebut adalah :

1. Pose dan gerakan antara (Pose-To-Pose Action and Inbetween)

Pada animasi yang didesain di atas akan sulit jika langsung meng-copy semua gerakan pada tiapframe. Agar mudah, animator membagi sekuens gerakan dalam 2 bagian, yaitu pose dan gerakanantara (Pose-to-pose and Inbetween). Pose adalah gerakan paling ekstrim dari tiap gerakan yang adadan inbetween adalah gerakan antara suatu pose ke pose lainnya. Pada animasi 2D key animatorakan menggambar key pose. Lalu inbetweener melanjutkan dengan membuat gerakan antara satupose ke pose yang lainnya. Animator 3D biasanya melakukan setup karakter dan mengatur pose.Inbetween dilakukan oleh komputer secara otomatis.

Gambar 2. Pose dan Inbetween

Hasil dari animasi di atas:

Page 6: Tutorial Flash

Pose yang ada adalah :

1. Kaki kiri berdiri bersiap melakukan tendangan

2. Kaki kiri melakukan tendangan keatas

Inbetween-nya adalah : Gerakan kaki kiri pada saat melakukan gerakan tendangan sampai melakukantendangan ke atas.

2. Pengaturan waktu (Timing)

Pengaturan waktu merupakan "jiwa" dari suatu animasi. Dengan mengatur durasi gerakan, suatukarakter bisa terlihat berbeda dari karakter yang lain. Meskipun posenya sama, tetapi dengan durasigerak berbeda, karakter bisa terlihat berjalan santai (jarak antara key pose cukup jauh), berjalanbiasa, atau terlihat tergesa-gesa berlari (jarak antara key pose lebih dekat).

Pada animasi kaki tendangan di atas di desain untuk tendangan kaki kiri, pada saat kaki kirimenendang ke atas dibuat pengaturan waktu sebanyak 120 frame, dan kaki kiri turun kembalisebanyak 120 frame lagi.

3. Gerakan sekunder (Secondary Action)

Gerakan sekunder adalah gerakan yang terjadi akibat gerakan yang lain. Gerakan itu merupakangerakan masih suatu kesatuan sistem yang tidak terpisahkan dari gerakan utama. Pada desainanimasi di atas, dirancang pada saat melakukan tendangan, tangan tangan kiri juga melakukanpenyeimbangan dengan melakukan gerakan, pinggang tokoh juga akan ikut berputar dan badan akanikut condong ke belakang mengeikuti gerakan tendangan. Gerakan ini terjadi akibat gerakan utama,yaitu tendangan kaki, yang terjadi akibat reaksi alamiah tubuh untuk tetap seimbang. Contoh lainnyajika anjing yang sedang berlari dan tiba-tiba berhenti. Pada saat berhenti, telinganya yang panjangtidak langsung berhenti, melainkan bergerak ke depan dan baru kemudian berhenti. Gerakan telingaanjing tadi terjadi karena gerakan berhenti. Contoh lain bisa dilihat pada ekor binatang pada saatberjalan, ekor tersebut tidak tinggal diam , melainkan juga bergerak seirama dengan gerakan badanbinatang tersebut.Untuk menciptakan gerakan sekunder menambah kesan gerak alami, gerakan initidak boleh melebihi gerakan utama.

4. Akselerasi gerak (Ease In and Out)

Prinsip ini diilhami dari hukum Newton yaitu setiap benda diam cenderung tetap diam, dan setiapbenda bergerak akan tetap bergerak, kecuali mengalami percepatan atau akselerasi. Dari suatu poseyang diam ke sebuah gerakan akan terjadi percepatan, dan dari gerakan ke sebuah pose akan terjadiperlambatan. Gerakan semua benda mirip dengan laju mobil. Saat bergerak mobil akan berakselerasiterlebih dahulu, lalu mobil itu bergerak dengan kecepatan tetap. Sebelum berhenti ia akanmengalami perlambatan atau akselerasi negatif dan akhirnya berhenti di satu titik. Contoh lainnyaadalah bola yang ditembakkan dengan kanon. Pada saat ditembakkan, ia melaju dengan kecepatantertinggi, lalu gaya gravitasi akan memperlambatnya dan ia akan berhenti pada ketinggian tertentu.Gaya gravitasi akan menariknya kembali dan ia akan bergerak dengan akselerasi tertentu ke arahbumi. Akhirnya bola itu akan mencapai titik terendah pada kecepatan tertinggi. Prinsip yang samaberlaku pada animasi karakter. Pada gerakan menggelengkan kepala, animator akan menambahkan"percepatan" pada awal gerak dan "perlambatan" pada akhir gerak.

5. Antisipasi (anticipation)

Pada dasarnya semua gerakan akan terjadi dalam 3 bagian, bagian awal yang disebut antisipasi,gerakan itu sendiri, dan gerakan akhir yang disebut gerakan penutup (follow through). Pada saatmeloncat biasanya makhluk hidup akan menekuk ke dua kaki, membungkukkan badan dan menarikke dua tangan ke bawah, barulah meloncat. Gerakan pendahuluan inilah yang disebut antisipasi.Demikian juga waktu duduk dan bangkit dari tempat duduk. Sebelumnya membungkukkan badan,

Page 7: Tutorial Flash

menekan beban seluruh tubuh pada telapak kaki, dan melenting ke atas untuk bangkit. Gerakanantisipasi ini juga berlaku untuk semua gerakan. Pada film animasi 2D atau film karton, misalnyaRoad runner, tokoh kartun tersebut hilang dari layar dengan meninggalkan segumpal asap tebal.Biasanya sebelum lari mereka memasang pose persiapan. Kaki di tarik menjauh dari arah lari, dantangan merentang bersiap-siap lari hilang. Antisipasi mengantarkan pikiran untuk menyambutgerakan berikutnya. Biasanya semakin cepat suatu gerakan, semakin lama waktu antisipasinya.

6. Gerakan penutup dan perbedaan waktu gerak (Follow Through and Overlapping Action)

Prinsip ini didasari hukum kelembaman Newton yaitu setiap benda yang bergerak cenderung tetapbergerak, bahkan setelah mendapat gaya yang menghentikannya. Jika sebuah mobil y ngebut dantiba-tiba berhenti, sebelum berhenti ia akan melaju melebihi titik hentinya dahulu, baru setelah itukembali ke titik semula. Sama juga jika berlari dan tiba-tiba berhenti. Badan akan sedikit"terlempar" ke depan, sebelum akhirnya kembali ke titik seimbang. Demikian pula pada saat tanganmemukul sesuatu. Tiba-tiba berhenti, dan tangan akan bergetar sedikit pada titik yang paling ektrim.Ini yang disebut gerakan penutup (follow through). Tidak semua gerakan terjadi atau berhenti padasaat yang bersamaan. Selalu ada perbedaan waktu antara langkah kaki dan ayunan tangan. Seringgerakan-gerakan tersebut terasa bertindihan. Prinsip ini yang dikenal sebagai overlapping action.Pada saat melompat turun ke bawah, pada saat kedua kaki menginjak tanah dan tidak mungkinkedua kaki turun bersamaan. Kedua tanganpun tidak akan langsung berhenti berayun pada saatbersamaan, melainkan cenderung terus berayun ke depan untuk mengimbangi tubuh agar kembalistabil. Kedua lengan pun tetap tidak akan berhenti secara bersamaan. Setiap gerakan yang ada akanterjadi pada waktu yang berbeda-beda. Biasanya gerakan sekunder akan mengalami perbedaanwaktu gerak (Overlapping action). Jika seekor binatang bergerak, ekornya akan ikut bergerak, tetapigerakan ekor tidak berhenti bersamaan dengan gerakan binatang, melainkan berhenti beberapa saatlebih panjang. Inilah penerapan prinsip overlapping action.

Pada animasi kartun yang dibuat setelah Cun Lee berhasil melakukan tendangan tangan kanannyaotomatis juga akan bergerak, begitu juga pada saat Cun Lee sudah mengeluarkan ilmu tenagadalamnya. Pada saat gerakan terakhir penutup celana Cun Lee ikut bergerak setelah Cun Leemelakukan semua kegiatannya. Gerakan ini yang disebut dengan gerakan lanjutan (followthrough)

. Tidak semua gerakan terjadi secara bersamaan. Gerak alami terjadi secara susul menyusul (overlap).Pada desain animasi Cun Lee gerakan tendangan akan diikuti dengan gerakan tangan yangmelakukan pukulan tenaga dalam yang menujukkan gerakan yang terjadi susul menyusul antaragerakan satu dengan lainnya.

Page 8: Tutorial Flash

7. Gerak melengkung (Arcs)

Pada film Stefen Seagel selalu dapat dilihat keindahan gerak aksi perkelahian. Keindahan iniberasala dari bela diri Aikido. Aikido menyatakan bahwa semua gerakan di alam bersifat melingkaratau melengkung. Perputaran planet yang berbentuk elips. Keindahan gerakan tari, atau pun gerakanmanusia dan hewan. Prinsip inilah yang diterapkan pada animasi. Contoh orang yang sedangmenggelengkan kepala . Pada saat kepala menggeleng dari kiri kanan, ia akan membuat gerakansedikit melengkung ke arah atas atau bawah yang membentuk lingkaran. Dengan menerapkanprinsip gerakan melengkung sebuah animasi tidak akan terlihat kaku seperti robot.

Gambar 3. Gerakan melengkung

7. Dramatisasi gerakan (Exaggeration)

Dramatisasi gerakan adalah tindakan mempertegas apa yang sedang dilakukan. Para pemain aktorteater akan mendramatisasi atau melebih-lebihkan aksi mereka agar terlihat jelas oleh parapenonton, apalagi penonton selalu melihat pertunjukan dari jarak jauh (long shot). Saat marah , sangaktor berkacak pinggang, menggerakkan seluruh badannya, dan menuding-nuding lawannya.Demikian pula saat tertawa, ia berkacak pinggang, menarik bagian atas tubuhnya ke belakang,mengangkat kepalanya ke atas, membuka mulut selebar-lebarnya dan akhirnya mengeluarkan suaratawa demikian kerasnya.

8. Elastisitas (Squash and Stretch)

Prinsip elastisitas dapat dilihat dalam kartun Coyote dalam animasi "Road Runner" yang senangdengan aksi kejar-kejaran. Tetapi Coyote selalu gagal dan terjatuh ke jurang. Sebelum jatuh iamemandang kamera, sementara kaki, badan dan lehernya memanjang (strecthing) ke bawah.

GerakanMelengkung

Page 9: Tutorial Flash

Akhirnya kepalanya hilang dari layar dengan meninggalkan segumpal asap. Contoh lainnya adalahbola karet yang dilempar ke atas, akan "penyek" (squash) dulu sebelum memantul kembali ke atas.

Kelenturan menunjukkan tingkah rigiditas suatu objek. Bola karet akan mempunyai derajatkelenturan yang berbeda dengan bola bowling. Pada objek realistis, prinsip ini terlihat padakontraksi otot. Tekuk kedua lengan dan kencangkan otot, otot akan mengalami pembesaran. Halpenting yang harus dilakukan adalah setiap benda yang mengalami pelenturan tetap akanmempertahankan volumenya. Jika sebuah karakter berubah volumenya, realitas yang ada akanhilang. Pada animasi prinsip ini tidak diberlakukan, melainkan pada bagian tertentu dari suatubenda. Otot biceps misalnya mengalami pelenturan yang lebih besar pada bagian tengahnyadibandingkan bagian tendon atau tepinya. Meskipun benda rigid atau benda realistis (sepertimanusia) tampak tidak mengalami pelenturan, prinsip ini tetap saja digunakan. Pada saat melompatke bawah badan akan tertekuk sedikit, gerakan ini yang merupakan gerakan sekunder mirip denganperistiwa "penyek" yang terjadi pada bola karet yang dilempar ke lantai.

9. Penempatan di bidang gambar (Staging)

Selain animasi cara menempatkan karakter dihadapan kamera mutlak diperlukan. Denganmenempatkan kamera atau karakter secara tepat, konsep yang diinginkan dapat terbaca denganmudah oleh penonton. Prinsip yang paling penting adalah prinsip sinematography dan prinsipsilluet. Dengan penempatan kamera yang rendah, sebuah karakter akan terlihat besar danmenakutkan. Demikian juga dengan penempatan kamera yang tinggi, karakter akan terlihat kecilatau terlihat bingung. Penempatan kamera dengan arah miring (rolling) akan membuat gerakanterlihat dinamis. Penempatan secara simetris akan membuat karakter terlihat formal dan berwibawa,penempatan arah gerak secara diagonal juga akan membuat adegan terlihat dinamis. Melihat Siluetkarakter (hanya pada bagian foreground vs background) juga memberikan ketegasan pose sebuahkarakter. Jika siluet karakter terlihat ambigu alias tidak jelas. maka akan sulit bagi penonton untukmencerna aksi yang dilakukan karakter. Dengan kata lain, seorang animator juga membutuhkankemahiran dari berbagai bidang. Sinematography, penyutradaraan, akting, editing dan jugacompositing sangat penting untuk membantu seorang animator menyelesaikan karyanya.

10. Daya tarik karakter (appeal)

Setiap karakter dalam animasi haruslah mempunyai daya tarik yang unik, yang membedakannyadengan karakter yang lain. Bisa saja suatu karakter terlihat unik dari design, atau dari caranyamenunjukkan ekpresi pribadinya, seperti yang dimiliki oleh Donal Bebek dan Tazmanian Devil. JimCarey misalnya, mempunyai daya tarik yang berbeda dengan Harrison Ford. Daya tarik Jim Carreyadalah tingkah lakunya yang demikian hiperbolik. Sean Connery mempunyai daya tarik dalamkedewasaan kepribadiannya. Daya tarik karakter bukan saja terlihat pada penampilannya (rupakarakter, desain pakaiannya, atau penampilan aksesorinya) melainkan terefleksikan pada seluruhgerak-gerik, tingkah laku dan sikapnya. Daya tarik memungkinkan penonton untuk menaruhperhatian khusus kepada karakter yang ditampilkan.

11. Penjiwaan peran (personality)

Kemampuan akting adalah satu hal yang harus dimiliki setiap karakter animator. Aktingmemungkinkan animator menterjemahkan tingkah laku dan daya tarik karakter secara tepat,sehingga penonton merasakan apa yang dimaui oleh sang animator, bahkan tanpa dialog sekalipun.Cara paling mudah menghayati suatu peran adalah dengan membayangkan karakter sebagai seorangaktor. Animator yang baik adalah animator yang mampu menggerakkan seluruh anggota tubuhnyadan menterjemahkannya ke dalam suatu karya animasi.

Page 10: Tutorial Flash

Tanpa penjiwaan sebuah karakter akan terlihat datar, kaku dan tidak manusiawi. Penjiwaan peranini adalah "roh" dari setiap karakter. Dengan penjiwaan setiap karakter akan terlihat berbeda darilainnya, tampak lebih hidup dan lebih "berjiwa". Dibutuhkan pengetahuan mengenai latar belakangdari setiap karakter, tingkah laku, caranya berkomunikasi dan bereaksi terhadap lingkungannya.Cara paling mudah menghayati karakter adalah dengan menghayalkan aktor tertentu danmenterjemahkan sifat aktor tersebut ke dalam karakter animasi yang dibuat.

3. Mempersiapkan Animasi Kartuna. Kebutuhan Software

Dalam mendesain animasi kartun ini diperlukan beberapa software yang harus tersedia di komputer,yaitu:

1. Sistem Operasi yang digunakan dapat salah satu yaitu Windows 98, Windows NT, Windows 2000ataupun Windows XP.

2. Software menscanner gambar biasanya disertakan pada saat pembelian scanner seperti AdobePhotoshop, Photostudio dan lainnya.

3. Software mengolah animasi kartun yaitu dengan Macromedia Flash MX.

4. Untuk merekam suara dapat digunakan software yang telah disediakan Windows yakni “SoundRecorder”.

b. Proses Memperoleh Objek Gambar

Berdasarkan storyboard yang telah dibuat, selanjutnya membuat gambar kartun untuk dibuat animasiyang diinginkan. Dalam tulisan ini sumber gambar diambil dari buku,”How to Draw & Create Manga”karya Tatsu Maki, pada halaman 106. Gambar yang sudah ada di scanner dan didapat hasil sebagaiberikut:

Page 11: Tutorial Flash

Gambar 4. Hasil Scanner Gambar Cun Lee dari buku “How to Draw & Create Manga”

c. Penggunaan Macromedia Flash MX

Macromedia Flash MX adalah program grafis animasi standar professional untuk menghasilkan halamanweb yang menarik. Movie Flash terdiri atas grafik, teks, animasi dan aplikasi, yang mengutamakangrafik berbasis vektor. Flash memiliki akses lebih cepat dan akan terlihat halus pada skala resolusi layarbesar atau kecil, selain itu juga mempunyai kemampuan untuk mengimpor video, gambar dan suara danaplikasi.

Macromedia Flash MX juga bisa memasukkan unsur interaktif dalam movienya menggunakanActionscript (suatu bahasa pemrograman berorientasi objek), yang pengguna bisa berinteraksi denganmovie, menggunakan keyboard atau mouse untuk berpindah ke bagian-bagian yang berbeda dari sebuahmovie, mengontrol movie, memindahkan objek-objek, memasukkan informasi melalui form dan operasi-operasi lainnya.

Area Kerja Flash MX

Area gambar di Flash MX terdiri atas enam bagian, yaitu Menu, Stage, Timeline, Toolbox, Panels, danProperties.

• Menu, berisi kumpulan instruksi atau perintah-perintah yang digunakan dalam Flash. Misalnya,klik menu File, Save berfungsi untuk menyimpan dokumen.

• Stage adalah dokumen atau layar yang akan digunakan untuk meletakkan objek-objek dalam Flash.

• Timeline berisi frame-frame yang berfungsi untuk mengkontrol objek yang akan dianimasikan.

• Toolbox, berisi tool-tool yang berfungsi untuk membuat, menggambar, memilih dan memanipulasiobjek atau isi yang terdapat di layar (stage) dan timeline.

Toolbox dibagi menjadi empat bagian, yaitu Tools, View, Colors dan Options.

Beberapa tool mempunyai option-option. Misalnya, klik Arrow tool, akan muncul pada bagian

Gambar 5. Area Kerja Flash MX

Page 12: Tutorial Flash

Options: Snap to Object, smooth dan straighten.

• Panels, berisi kontrol fungsi yang dipakai dalam Flash, yang berfungsi untuk mengganti danmemodifikasi berbagai atribut dan objek atau animasi secara cepat dan mudah.

• Properties, fungsinya sama dengan Panels, hanya saja Properties merupakan penggabungan ataupenyederhanaan dari panel. Jadi, dapat lebih mempercepat dalam mengganti dan memodifikasiberbagai atribut dan objek, animasi, frame dan komponen secara langsung.

4. Proses Pembuatan Animasi Kartun a. Membuat Gambar Utama

Gambar Cun Lee yang sudah dibuat akan dimasukkan ke dalam Flash MX, kemudian dilakukanpemisahan terhadap bagian-bagian tubuh yang akan melakukan pergerakan-pergerakan yaitu padabagian kepala, badan, tangan, kaki dan bagian lainnya. Untuk membuat pemisahan di atas, dilakukandengan memilih menu menu symbol.

1. Buat symbol di Flash MX, Insert >New Symbol

Gambar 6. Menu Insert Symbol

2. Copykan hasil scanner ke dalam scene, lalu lakukan Break Apart 2 kali (Modify > break a part).Lakukan pemisahan bagian-bagian tubuh.

Gambar 7. Pemisahan gambar untuk animasi

Kepala

Paha kiri

Lutut kiri

Tangan

Badan

Paha kanan

Lutut kanan

Penutup kain

Page 13: Tutorial Flash

Kemudian dilakukan juga pemisahan kepala, untuk membuat efek berbicara dipisahkan juga bibir atasdan bibir bawah dari gambar wajah Cun Lee.

Gambar 8. Pemisahan bagian kepala

Setelah selesai memisahkan bagian-bagian tubuh lakukan penyatuan kembali pada setiap layer denganmemilih Modify > Group (Ctrl+G).

b. Membuat Animasi pada Key Frame

Untuk membuat animasi pada bagian-bagian tubuh yang sudah dipisahkan menggunakan perintah“Create Motion Tween” pada keyframe 30.

- Key Frame 1 - 30

Semua bagian tubuh diatur sehingga menyerupai gambar di bawah ini:

Gambar 9. Animasi Cun Lee pada keyframe1 Gambar 10. Animasi pada keyframe 30

Bibir atasBibir bawah

Page 14: Tutorial Flash

- Keyframe 60

Cun Lee bersiap melakukan tendangan dengan mengambil ancang-ancang dengan memiringkan badandan menaikkan kaki kirinya.

Gambar 11. Keyframe 60 Cun Lee bersiap melakukan tendangan

- Key Frame 61

Cun Lee mengeluarkan suara sambil melakukan tendangan.

- Key Frame 62-64

Lutut dan telapak kaki bergerak bersama melakukan tendangan. Pada keyframe 62 lutut naik keatas dankeyframe 64 lutut kembali lagi kebawah. Dan dibarengi dengan suara (gerakan mulut).

- Key Frame 69 - 142

Mengerakkan mulut hingga kelihatan dia berbicara “ Halo nama saya Cun Lee Saya adalah pendekarkebenaran dan keadilan senang berjumpa dengan kamu “.

- Key Frame 59-71

Pada key frame ini gerakan tangan maju.

- Key Frame 71-75

Gerakan tangan miring ke bawah.

- Key frame 75 –80

Gerakan tangan miring ke atas.

- Key frame 80-100

Gerakan tangan mundur.

- Key Frame 100-105

Gerakan tangan maju.

Menggerakan tangan seperti gambar dibawah ini:

Page 15: Tutorial Flash

Gambar 12. Gerakan tangan

- Key frame 120

Pada key frame ini semua layer diberikan key.

- Keyframe 163

Semua bagian tubuh diatur membentuk animasi sehingga menyerupai gambar di bawah ini:

Gambar 13. Gerakan dari 120-163.

Page 16: Tutorial Flash

- Key Frame 190

Pada key frame ini Cun Lee menurunkan kaki, seperti gambar dibawah ini.

Gambar 14. Key Frame 163 Gambar 15. Key Frame 190

- Key Frame 190 – 230

Pada key frame ini Cun Lee mengeluarkan suara dan seolah-olah berkata “ Hai kalian semua jangancoba-coba mengganggu aku ya”

c. Efek Tendangan

Pada saat Cun Lee melakukan tendangan, ada efek tendangan berupa gambar pergerakan udara akibattenaga yang dikeluarkan oleh tendangan. Untuk membuat efek ini dibuat sebuah symbol baru yaituMovie klip berupa garis setengah lingkaran.

Gambar 16. Efek Tendangan

Pada symbol yang baru di frame 25 diberikan efek “Create Motion Tween” pada masing-masing keyframe klik key frame 25 perbesar gambar efek, kemudian warna efek tendangan diubah warnanya (menuProperties menjadi Alpha 0 %).

Untuk membuat efek bekerja pada gambar utama, masuk ke simbol kartun dan membuat layer baru danmeletakannya paling atas, dan beri nama “efek tendangan”, pada frame 61 dibuatkan keyframe. Bukapanel library kemudian seret simbol efek tendangan, letakan efek tendangan tersebut tepat pada ujungtelapak kaki.

Page 17: Tutorial Flash

Gambar 17. Efek tendangan

e. Efek Ilmu

Efek ilmu akan ditampilkan ketika Cun Lee selesai melakukan tendangan, dan Cun Lee mengeluarkanilmunya. Caranya dengan membuat Simbol baru (New Simbol Movie klip ) dan gambar dari efek ilmuseperti di bawah ini.

Gambar 18. Efek ilmu

Untuk membuat efek ilmu ini bekerja pada key frame pada frame 10 dan 20 buat “Create MotionTween”. Pada key frame 10 perbesar gambar efek ilmu untuk membuat kesan efek ilmu terus membesar.

Untuk memasukkan ke dalam gambar utama, dibuat sebuah layer baru di atas layer efek tendangan danmemberi nama “efek ilmu”. Pada layer efek ilmu buat keyframe pada frame 80 dan seret simbol “efekilmu” melalui panel Library. Kemudian pada frame 80 buat “Create Motion Tween”, lalu dibuat

Page 18: Tutorial Flash

keyframe pada frame 95, 105, dan 142. Pada frame 105 perbesaar “efek ilmu” Modify > Transform >Scale and Rotate (Ctrl + Alt + S) ubah menjadi 200 %. Klik key frame 142 perbesar efek ilmu menjadi400 %, dan seret hingga keluar dari Scene.

f. Memasukkan Suara

Dalam sebuah animasi kartun unsur penting lainnya adalah suara. Suara memberi pengaruh yang sangatbesar terhadap desain kartun yang dibuat, yang mewakili karakter dan suasana. Cara memperoleh suaradapat dilakukan dengan cara merekam suara atau mencari suara-suara latar belakang.

Untuk menyimpan, mengedit suara diperlukan beberapa komponen hardware tambahan yakni:

1. Mikropon : untuk memasukkan suara.

2. Mic Pre-amplifier : Untuk memperhalus suara yang akan disimpan.

3. Speaker : untuk menghasilkan/mengeluarkan suara dari komputer.

4. Kartu Suara : untuk mengubah signal analog ke signal digital.

Gambar 19. Kebutuhan perangkat tambahan untuk merekam suara

Untuk animasi kartun Cun Lee, dalam symbol utama (kartun) dibuat sebuah layer baru di atas layer“efek ilmu” dan diberi nama “suara”. Pada frame 60, 80 dibuat key frame, masuk ke menu Window >Common Libraries > Sound dan dimasukkan suara yang cocok dengan efek tendangan dan masukkanke dalam stage. Pada key frame 80 lakukan impor suara dengan melakukan file > Import > dan dipilihsuara yang cocok dengan efek ilmu tersebut.

Gambar 4.17 Efek suara pada frame

Komputer

Page 19: Tutorial Flash

5. Mempublish Animasi KartunFlash memiliki program publishing yang diberi nama “Flash Player” yang dapat langsung diaktifkandengan menekan “Ctrl+Enter”. File flash disimpan dalam bentuk file berekstensi FLA dan hasil daripublishingnya file akan berekstensi SWF.

Proses publishing di dalam Flash akan menghasilkan berbagai bentuk file yang dapat dimainkan ataudijalankan oleh beberapa program aplikasi. Beberapa jenis file yang dapat dihasilkan dengan publishadalah:

1. Flash Movie.

2. Format image seperti GIF, JPG dan PNG.

3. Quick time.

4. HTML.

5. File EXE.

Untuk mempublishnya digunakan langkah sebagai berikut:

1. Mengatur setting publish dengan klik File > Publish Setting.

2. Setelah dilakukan pengaturan pilihan klik File > Publish.

Page 20: Tutorial Flash

Animasi dengan Flash Animasi adalah proses penciptaan efek gerak atau efek perubahan bentuk yang terjadi selama beberapa waktu. Animasi bisa berupa gerak sebuah objek dari tempat yang satu ke tempat yang lain, perubahaan warna, atau perubahan bentuk (yang dinamakan “morphing”) Animasi Flash dapat dilakukan dengan dua cara yaitu : 1. Frame by frame 2. Tweening Frame by frame Animation (Animasi Frame Per Frame) Bentuk dasar dari animasi adalah animasi frame per frame. Animasi frame per frame menuntut banyak gambar yang harus dibuat. Efek animasi diciptakan dengan mengganti gambar yang satu dengan gambar yang lain selama beberapa waktu. Contoh animasi frame per frame dapat dilihat pada Help | Samples | Flower. Semua gambar yang bergerak dihasilkan dari gambar yang berbeda-beda tiap framenya. Karena animasi frame per frame harus memiliki gambar yang unik tiap framenya maka animasi frame per frame sangat ideal untuk membuat animasi yang kompleks yang terdiri dari banyak perubahaan seperti ekspresi wajah. Kelemahan dari animasi frame per frame adalah membutuhkan banyak waktu untuk membuat setiap gambar dan menghasilkan file yang besar ukurannya. Di dalam Flash, sebuah frame yang memiliki gambar yang unik dinamakan keyframe. Animasi frame per frame membutuhkan gambar yang unik setiap framenya, hal ini menyebabkan setiap framenya adalah keyframe. Menambahkan keyframe Untuk menambah keyframe pada timeline, sorot frame dan kemudian lakukan satu dari beberapa cara berikut ini :

Klik kanan dan pilih Insert Keyframe. Pilih Insert | Keyframe dari menu. Tekan F6 pada keyboard.

Membuat animasi frame per frame Di bawah ini akan ditunjukkan proses pembuatan animasi frame per frame : 1. Sorot frame dimana Anda akan memulai animasi frame per frame. 2. Jikalau belum berupa sebuah keyframe, buatlah menjadi keyframe dengan cara memilih menu Insert | Keyframe (F6). 3. Gambarlah atau impor gambar pertama Anda dari urutan gambar pada keyframe ini. 4. Kemudian klik frame selanjutnya dan buatlah menjadi keyframe yang lain. Rubahlah isi dari keyframe ini dengan gambar berikutnya. 5. Lakukan penambahan keyframe dan perubahan isinya sampai Anda memperoleh animasi yang utuh. Pada akhirnya teslah animasi Anda dengan kembali ke frame pertama dan kemudian pilih menu Control | Play .

Page 21: Tutorial Flash

Tweening Tween animation sangat mengurangi waktu karena Anda tidak perlu membuat animasi secara frame per frame. Sebaliknya Anda hanya membuat frame awal dan frame akhir saja. Dua alasan utama mengapa tween animation sangat baik yaitu karena mengurangi pekerjaan mengambar dan meminimalkan ukuran file karena isi dari setiap frame tidak perlu disimpan. Ada 2 jenis tween animation yaitu Shape tween dan Motion tween, dimana masingmasing memiliki karakter yang unik. Shape Tweening (Animasi Perubahan Bentuk) Shape tweening berguna untuk mengubah bentuk. Flash hanya dapat mengubah bentuk, jadi jangan mencoba untuk melakukan Shape tween untuk group, symbol, atau teks. Hal ini tidak akan berhasil. Anda dapat melakukan Shape Tween pada beberapa bentuk di dalam sebuah layer, tetapi lebih baik untuk menempatkannya pada layer yang berbeda. Hal ini akan memudahkan jika kita ingin melakukan perubahan. Shape tweening juga memperbolehkan Anda untuk mengubah warna. Membuat Sebuah Shape Tween Langkah-langkah membuat shape tween adalah : 1. Sorot frame di mana Anda ingin membuat animasi. Jika belum berupa sebuah keyframe maka rubahlah menjadi keyframe. 2. Buatlah gambar pada stage. Ingatlah shape tween hanya bekerja pada bentuk – bukan pada group, simbol atau teks yang dapat diedit. Untuk 3 elemen tersebut maka Anda perlu mengubahnya menjadi bentuk dasar dengan melakukan perintah Modify | Break Apart. 3. Buatlah sebuah keyframe kedua, dan buatlah gambar akhir pada stage. 4. Bukalah kotak dialog Frame Properties dengan mengklik ganda pada frame mana pun yang berada di antara dua keyframe. Anda dapat juga menyorot sebuah frame di antaranya dan kemudian memilih menu Modify | Frame. 5. Pilih tab Tweening dan pilih Shape pada field Tweening. Anda akan melihat beberapa pilihan untuk merubah shape tween 6. Sorot salah satu Blend Type. Pilihan Distributive akan menciptakan animasi transasi bentuk yang halus, sedangkan pilihan Angular akan menciptakan transisi bentuk dengan sudut dan garis-garis lurus. Jika gambar akhir Anda berisi bentuk yang mempunyai sudut dan garis, pilih Angular, selain itu pilih Distributive. 7. Jika perlu rubahlah Easing slider. Easing menentukan bagaimana animasi Anda dari awal sampai akhir. Ini berguna jika Anda ingin menciptakan efek mempercepat atau memperlambat. Jika Anda ingin animasi Anda mulai dengan lambat dan kemudian cepat, geser slider ke arah in. Untuk animasi yang permulaannya cepat, dan kemudian melambat, geser slider ke arah out. Jika Anda ingin kecepatan animasi konstan maka biarkan slider berada di tengah. Anda dapat juga mengetik besar dari Easing yaitu dari –100 sampai 100.

Page 22: Tutorial Flash

8. Tekan tombol OK. Teslah animasi dengan memilih menu Control | Play (Enter). Shape hints Shape hints memberikan kontrol untuk shape tween yang kompleks. Anda bisa mengatur setiap titik awal dari animasi perubahan bentuk lalu titik akhir dari animasi perubahan bentuk tersebut. Dengan memberi beberapa shape hints maka kita bisa mengontrol animasi perubahan bentuk sesuai dengan yang kita inginkan karena dalam animasi perubahan bentuk yang kompleks seringkali apa yang kita inginkan tidak bisa dilakukan oleh program Flash secara otomatis kecuali melalui shape hints. Menggunakan Shape Hints Pada Sebuah Shape Tween Anda dapat dengan mudah menggunakan shape hints pada shape tween dengan cara sebagai berikut : 1. Buatlah shape tween dengan menggunakan langkah-langkah Membuat Shape Tween di atas. 2. Sorot frame awal dari shape tween. Pilih Modify | Transform | Add Shape Hint, atau tekan Ctrl + H untuk menambah sebuah shape hint. Shape hint muncul dengan lingkaran merah dengan sebuah huruf di dalamnya (huruf itu mulai dari a sampai z). 3. Pindahkan shape hint ke tempat yang Anda inginkan. 4. Sekarang sorot frame terakhir. Anda akan melihat lingkaran hijau kecil dengan huruf yang sama seperti pada shape hint awal. Pindahkan shape hint ke tempat di mana Anda ingin shape hint pertama bergerak menujunya. Animasi dengan Flash – Halaman 4 By : Ali Salim, SE. 5. Jalankan movie Anda (Control | Play) untuk melihat bagaimana shape hint mempengaruhi tweening. 6. Tambahkan shape hint hingga Anda puas dengan hasilnya. Ingatlah untuk mencocokkan shape hint yang ada pada frame awal dan frame akhir – a harus ke a, b ke b dan seterusnya. Jika setelah Anda menambahkan shape hint kemudian Anda tidak menginginkan shape hint tersebut, Anda dapat membuang semua shape hint dengan memilih menu Modify | Transform | Remove All Hints. Anda dapat juga mengklik kanan pada salah satu shape hint untuk membuka menu pop-up shape hint. Menu ini memungkinkan Anda untuk menambahkan sebuah hint (Add Hint), membuang sebuah hint (Remove Hint), atau Remove All Hint. Motion Tweening (Animasi gerak) Motion tween tidak hanya berguna untuk menggerakkan groups, simbol, atau teks yang dapat diedit dari satu tempat ke tempat lain. Motion tween menolong Anda untuk merubah ukuran, memutar, merubah warna dan transparansi simbol. Motion tween hanya bisa digunakan pada satu objek pada satu layer. Jadi jika ingin mengerakkan banyak objek maka membutuhkan banyak layer.

Page 23: Tutorial Flash

Membuat Motion Tween Langkah-langkah membuat sebuah motion tween adalah : 1. Sorot frame di mana Anda ingin membuat animasi. Jika belum berupa sebuah keyframe maka rubahlah menjadi keyframe. 2. Gambar atau imporlah gambar yang Anda ingin lakukan animasi. Anda hanya dapat melakukan animasi pada group, simbol, dan teks yang dapat diedit.

Jika Anda menggunakan sebuah gambar, grouplah gambar tersebut atau ubah menjadi sebuah simbol.

Jika Anda mempunyai gambar berupa simbol di library, Anda cukup mendrag gambar dari library ke stage.

Jika Anda menggunakan teks yang dapat diedit, Anda tidak perlu melakukan apa pun karena sudah berupa objek. 3. Sorot frame dimana animasi akan berakhir. Rubah frame ini menjadi sebuah keyframe dengan memilih menu Insert | Keyframe. 4. Pindahkanlah gambar dalam stage ke tempat yang ingin dituju. Ingatlah Anda tidak hanya dapat menggerakkan gambar, Anda juga bisa melakukan putaran, merubah ukuran, dan merubah efek warna. 5. Klik kanan pada sebuah frame di antara kedua keyframe dan pilih Create Motion Tween. Teslah animasi Anda. 6. Jika Anda ingin mengubah properties motion tween, klik ganda pada salah satu frame yang berada di antara kedua keyframe untuk membuka kotak dialog Frame Properties. Pilih tab Tweening. Anda dapat melakukan perubahan properties, seperti pada gambar di bawah ini :

Tween scaling – Jika Anda ingin mengubah ukuran. Rotate – Jika Anda ingin memutar objek. Pilih jenis putaran pada menu

dropdown dan kemudian angka rotasi pada kotak times. Jika Anda mengetik 0 pada kotak times, atau memilih None pada menu drop-down, tidak ada putaran yang dilakukan.

Orient to path direction – Ketika objek mengikuti sebuah alur, pilihan ini menyebabkan objek berada di tengah alur.

Easing. Easin – menentukan bagaimana animasi Anda dari awal sampai akhir. Ini berguna jika Anda ingin menciptakan efek mempercepat atau memperlambat. Jika Anda ingin anmiasi Anda mulai dengan lambat dan kemudian cepat, geser slider ke arah in. Untuk animasi yang permulaannya cepat, dan kemudian melambat, geser slider ke arah out. Jika Anda ingin kecepatan animasi konstan maka biarkan slider berada di tengah. Anda dapat juga mengetik besar dari Easing yaitu dari –100 sampai 100.

Page 24: Tutorial Flash

1

Penggunaan Pen Tool Pada Macromedia Flash 1. Pendahuluan Macromedia Flash menyediakan tools yang digunakan untuk menggambar. Tools tersebut tersedia pada panel Tools yang terletak di sebelah kiri stage. Salah satu tool yang digunakan untuk membentuk suatu objek adalah Pen Tool. Bagi para pemula, penggunaan Pen Tool terasa sulit. Mereka lebih memilih menggambar menggunakan tools lainnya seperti Pencil Tool atau Line Tool. Penggunaan Pen Tool memang memerlukan banyak latihan dan kecermatan. Selain itu diperlukan pengetahuan dasar mengenai cara penggunaan Pen Tool. Dalam artikel ini penulis akan menyajikan caracara dasar penggunaan Pen Tool pada Macromedia Flash. 2. Cara Kerja Pen Tool Pen Tool digunakan untuk menggambar garis lurus atau garis lengkung kemudian mengatur sudut, panjang, dan kemiringannya. Pendek kata, Pen Tool digunakan untuk membentuk suatu bentuk dasar (outline) dengan ketepatan yang diharapkan. Jika stroke (outline) suatu objek diseleksi menggunakan Pen Tool maka outline objek tersebut akan berubah menjadi suatu ruas garis lurus atau lengkung yang dihubungkan oleh beberapa titik. Titik-titik penghubung ini dinamakan anchor points . Contoh 1 : 1. Klik Oval Tool . 2. Pilih stroke color dan fill color. Gambarkan sebuah lingkaran pada stage. 3. Klik Pen Tool . 4. Klik stroke (outline / garis luar) pada objek lingkaran yang tadi telah dibuat. Perhatikan bahwa stroke objek lingkaran berubah menjadi garis -garis lengkung yang terhubung oleh titik-titik (anchor points). Hal demikian juga akan terjadi ketika stroke suatu objek diseleksi menggunakan Subselection Tool.

Page 25: Tutorial Flash

2

Gambar 2.1

5. Cobalah pada bentuk-bentuk selain lingkaran, misalnya pada garis lurus atau pada persegi empat.

Cara kerja Pen Tool dalam menggambar garis lurus berbeda dengan cara kerjanya dalam menggambar garis lengkung. Cara membuat suatu garis lurus dengan Pen Tool :

1. Klik Pen Tool. 2. Klik satu kali pada stage untuk membuat titik acuan awal (anchor point).

Gambar 2.2

1. Selanjutnya buatlah anchor point yang kedua. Caranya, klik mouse satu kali pada stage sambil

menekan tombol Shift pada keyboard secara bersamaan. Tujuan menekan tombol Shift agar ruas garis yang terbentuk diantara dua anchor point dapat berupa garis lurus atau garis dengan kemiringan 45 derajat dan kelipatannya.

Gambar 2.3

3. Terbentuk garis lurus. Setiap kali selesai menggambar suatu objek menggunakan Pen Tool, klik

tools selain Pen Tool untuk dapat melihat bentuk objek yang terjadi.

Gambar 2.4

Sedangkan untuk membuat garis lengkung :

1. Klik Pen Tool. 2. Klik satu kali pada stage, tahan dan seret mouse ke arah kelengkungan kurva yang diinginkan.

Pada saat mouse diseret pada stage, muncul garis singgung (tangent handles) sebagai arah acuan kelengkungan.

Gambar 2.5

3. Lepaskan mouse. 4. Posis ikan mouse di tempat yang Anda inginkan untuk anchor point kedua. Klik mouse satu kali

sambil ditahan dan digeser ke arah yang dapat menghasilkan bentuk kurva yang diinginkan.

Gambar 2.6

5. Lepaskan mouse. Klik tools selain Pen Tool untuk melihat objek yang terjadi. Garis lengkung yang

dihasilkan seperti tampak pada Gambar 2.7.

Gambar 2.7

Page 26: Tutorial Flash

3

Perhatikan :

Pada saat mouse Anda letakkan di stage, pada bagian bawah Pen Tool terdapat simbol X (Gambar 2.8). Artinya anchor point yang akan Anda buat adalah anchor point pertama dan dapat diletakkan di sembarang bagian stage.

Gambar 2.8

3. Preferences Pada Pen Tool

Flash menyediakan preferences untuk Pen Tool. Preferences ini bertujuan memberi kemudahan dalam penggunaan Pen Tool. Klik menu Edit > Preferences, ke mudian klik pada Editing tab . Pada bagian Pen Tool terdapat tiga buah option yaitu, show pen preview, show solid points, dan show precise cursors.

Gambar 3.1

Fungsi dari masing -masing option adalah : Show pen preview: untuk memperlihatkan preview dari garis yang akan terbentuk ketika mouse diarahkan

dari suatu anchor point menuju ke tempat dimana anchor point berikutnya akan dibuat.

Show solid points: klik Subselection Tool . Klik pada stroke suatu objek untuk menyeleksinya. Stroke pada objek berubah menjadi ruas-ruas garis beserta anchor points. Klik satu kali pada salah satu anchor point untuk menyeleksinya. Jika option show solid points diaktifkan, anchor point yang diseleksi akan tampak sebagai lubang kecil. Sedangkan anchor point yang tidak terseleksi ditampilkan sebagai titik penuh (solid). Sebaliknya jika option ini tidak diaktifkan, maka anchor point yang diseleksi akan tampak seperti titik penuh sedangkan anchor point yang tidak terseleksi ditampilkan sebagai lubang kecil.

Show precise cursors: jika option ini diaktifkan, pointer Pen Tool pada stage akan ditampilkan sebagai

simbol X (tanda silang).

Page 27: Tutorial Flash

4

4. Menggambar Objek Dengan Outline Garis Lurus

Sebelum mulai menggambar, aktifkan terlebih dahulu option show pen preview pada preferences untuk memudahkan penggunaan Pen tool. Caranya, pilih menu Edit > Preferences kemudian klik Editing tab. Selanjutnya klik satu kali pada simbol kotak kecil disebelah kiri option show pen preview .

Gambar 4.1

Contoh 2 : Menggambar bentuk polygon Mempersiapkan stage

1. Buka flash document baru (pilih menu File > New). 2. Untuk memudahkan menentukan letak-letak anchor points diperlukan bantuan grid. Aktifkan grid

dengan cara pilih menu View > Grid > Show Grid. Kini stage dipenuhi oleh garis -garis melintang dan membujur yang membentuk kotak-kotak kecil. Garis -garis inilah yang disebut grid. Panjang dan lebar kotak-kotak grid dapat diatur melalui menu View > Grid > Edit Grid.

3. Selanjutnya aktifkan option snap to grid. Caranya, klik menu View > Snapping > Snap to Grid. Jika disamping option snap to grid sudah terdapat tanda cek ( ) artinya option snap to grid telah aktif.

Menggambar polygon

1. Klik Pen Tool. Arahkan mouse pada sudut salah satu kotak grid di stage. Selanjutnya klik mouse satu kali untuk membuat anchor point pertama. Polygon merupakan gabungan ruas-ruas garis lurus maka untuk membuat anchor point pertama cukup klik satu kali pada stage.

Gambar 4.2

2. Geser mouse ke kanan lalu klik mouse satu kali untuk membuat anchor point kedua. Perhatikan

bahwa walaupun arah mouse Anda tidak tepat berada pada salah satu sudut grid, tetapi anchor point kedua tetap terjadi di salah satu sudut grid. Inilah fungsi dari option snap to grid, yaitu menjadikan sudut-sudut grid sebagai magnet bagi arah mouse Anda.

Gambar 4.3

3. Tarik mouse ke arah bawah kanan sebesar 45 derajat lalu klik satu kali untuk membuat anchor

point ketiga.

Page 28: Tutorial Flash

5

Gambar 4.4

4. Lanjutkan membuat anchor point keempat, kelima dan seterusnya hingga membentuk segi

delapan.

Gambar 4.5

5. Pada saat anchor point terakh ir selesai dibuat yaitu tepat pada posisi anchor point yang pertama,

secara otomatis objek segi delapan akan terisi oleh warna. Klik tools selain Pen Tool untuk melihat objek yang terjadi.

Gambar 4.6 5. Menggambar Objek Dengan Outline Garis Lengkung

Persiapan stage sama dengan persiapan pada saat menggambar bentuk polygon pada Contoh 2. Contoh 3 : Menggambar bentuk elips

1. Persiapkan stage seperti pada Contoh 2. Jangan lupa untuk mengaktifkan grid dan Snap to Grid. 2. Klik Pen Tool, arahkan mouse pada stage.

Gambar 5.1

3. Klik mouse satu kali sambil ditahan dan digeser ke arah kanan sebesar satu kotak grid, sehingga

muncul tangent handles seperti tampak pada Gambar 5.2.

Gambar 5.2

Page 29: Tutorial Flash

6

4. Lepaskan mouse. 5. Arahkan mouse ke kanan sebesar lima kotak grid dan kebawah sebesar satu kotak grid seperti pada

Gambar 5.3.

Gambar 5.3

6. Klik mouse satu kali sambil ditahan dan digeser kebawah sebesar satu kotak grid . Lepaskan

mouse.

Gambar 5.4

7. Arahkan mouse kebawah sebesar satu kotak grid dan ke kiri sebesar lima kotak grid seperti pada

Gambar 5.5.

Gambar 5.5

8. Klik mouse satu kali sambil ditahan dan digeser kekiri sebesar satu kotak grid. Lepaskan mouse.

Gambar 5.6

9. Arahkan mouse kekiri sebesar lima kotak grid dan ke atas sebesar satu kotak grid seperti pada

Gambar 5.7.

Gambar 5.7

10. Klik mouse satu kali sambil ditahan dan digeser keatas sebesar satu kotak grid. Lepaskan mouse.

Gambar 5.8

11. Terakhir, arahkan mouse pada anchor point pertama sehingga muncul tanda bulatan kecil dibawah

simbol Pen Tool. Kemudian klik mouse satu kali. Tanda bulatan kecil pada Pen Tool mengisyaratkan bahwa posisi mouse sudah tepat untuk membuat anchor point terakhir untuk menutup kurva. Setelah kurva tertutup, secara otomatis objek elips terisi oleh fill warna.

Gambar 5.9

Page 30: Tutorial Flash

7

12. Klik pada tools selain Pen Tool untuk melihat hasilnya.

Gambar 5.10

6. Menggunakan Pen Tool Bersama Subselection Tool

Subselection Tool merupakan salah satu tool pada Flash yang digunakan untuk reshape (mengedit) suatu shape atau ruas garis. Subselection Tool juga menggunakan anchor points dalam melakukan reshape.

Dikenal dua jenis anchor points yaitu curve point dan corner point. Ketika Anda menggambar sebuah garis lengkung, artinya anchor point yang Anda buat merupakan curve point. Sedangkan corner point merupakan anchor point pada ruas garis lurus. Curve point ketika diseleksi nampak sebagai lingkaran kecil sedangkan corner point nampak sebagai kotak kecil.

Jika Anda mengubah suatu garis lurus menjadi garis lengkung artinya anda mengubah corner point menjadi curve point , demikian pula sebaliknya.

Gambar 6.1

Gambar 6.2

Contoh 4 : Menggambar bentuk hati

1. Persiapkan stage sama dengan persiapan stage pada Contoh 2 dan Contoh 3.

2. Klik Line Tool . 3. Arahkan mouse pada stage dan gambarkan bentuk objek seperti pada Gambar 6.3 dengan

menggunakan Line Tool.

Gambar 6.3

4. Bentuk dasar pada Gambar 6.3 akan diedit menggunakan Subselection Tool sehingga menjadi

gambar hati. 5. Klik Subselection Tool. Kemudian klik mouse pada objek. 6. Objek berubah menjadi ruas -ruas garis lurus yang dihubungkan oleh anchor points.

Corner point

Curve point

Page 31: Tutorial Flash

8

Gambar 6.4

7. Anchor points pada objek merupakan corner points karena objek berupa ruas -ruas garis lurus.

Untuk dapat mengubah objek tersebut menjadi berbentuk hati, ada dua corner point yang akan diubah menjadi curve point .

Merubah corner point pertama menjadi curve point :

8. Arahkan mouse pada corner point paling kiri.

Gambar 6.5

9. Klik mouse satu kali pada corner point tersebut untuk menyeleksinya. Sehingga berubah menjadi

kotak kecil tertutup.

Gambar 6.6

10. Selanjutnya tekan tombol Alt pada keyboard sambil gunakan mouse untuk menggeser corner point

tersebut ke kiri sebesar dua kotak grid , tahan mouse dan sambil tetap menekan tombol Alt lanjutkan dengan memutar mouse searah jarum jam.

Gambar 6.7

11. Lepaskan mouse dan tombol Alt pada keyboard.

Page 32: Tutorial Flash

9

Merubah corner point kedua menjadi curve point :

12. Klik corner point paling kanan untuk menyeleksinya.

Gambar 6.8

13. Tekan tombol Alt pada keyboard sambil gunakan mouse menggeser corner point tersebut ke kanan

sebesar dua kotak grid, tahan mouse dan sambil tetap menekan tombol Alt lanjutkan dengan memutar mouse berlawanan arah jarum jam.

Gambar 6.9

14. Sekarang bentuk objek menjadi seperti pada Gambar 6.10.

Gambar 6.10

15. Klik Paint Bucket Tool . 16. Selanjutnya pilih color fill untuk mewarnai objek hati.

Gambar 6.11

Ada kalanya dalam melakukan reshape suatu objek Anda harus menambahkan, menggeser dan

menghapus suatu anchor point. Untuk menambahkan anchor point, klik ruas garis menggunakan Pen Tool. Kemudian arahkan mouse pada ruas garis tersebut sampai terlihat simbol + dibawah pointer Pen Tool, lalu klik satu kali pada tempat tersebut. Jika tanda + tidak muncul artinya anda tidak dapat menambahkan anchor point pada ruas garis tersebut.

Page 33: Tutorial Flash

10

Gambar 6.12 Sebelum menghapus suatu anchor point, perhatikan apakah point tersebut berupa corner point atau

curve point. Untuk menghapus corner point cukup klik sekali pada point dengan menggunakan Pen Tool. Sedangkan untuk menghapus curve point, klik dua kali pada point dengan menggunakan Pen Tool.

Untuk memindahkan anchor point gunakan Subselection Tool. Klik anchor point yang dimaksud kemudian geser dengan mouse. Atau dapat juga dengan cara klik anchor point dengan Subselection Tool kemudian gunakan tombol anak panah pada keyboard (arrow keys) untuk mengatur perpindahannya. 7. Referensi

Macromedia Flash MX 2004 manual help.

http://www.developingwebs.net/flash/pentool.php