BAB 3
PERANCANGAN SISTEM
Untuk memulai membuat sebuah animasi flash baru, bukalah aplikasi flash baru. Kemudian pada halaman awal, pilih create new flash document. Maka akan terbuka
sebuah layar antarmuka untuk membuat sebuah animasi flash.
3.1 Intro
Dalam intro terdapat objek movie clip, yaitu:
1. Roda Berputar
Buatlah Sebuah movie clip roda dengan alpha 33 pada lembar kerja. Pembuatan Roda ini dapat dipermudah dengan memunculkan Grid pada lembar kerja. Untuk
memunculkan Grid plih menu view, Grid lalu pilih show Grid. Setelah Grid muncul, gambarlah sebuah lingkaran dan kemudian buat juga beberapa garis didalam lingkaran
tersebut sehingga membentuk sebuah roda. Beri warna pada setiap bagian roda sehingga terlihat lebih menarik.
Buat movie clip teks
selamat datang
dengan mengetikkannya, dan memberi warna yang berbeda unttuk setiap hurufnya. Kemudian memberi efek drop shadow
pada tulisan tersebut dengan latar warna hitam, angle 74 dan distance -50 sehingga akan membentuk seperti sebuah sebuah bayangan. Dan kemudian tambahkan movie
clip teks
metamorfosis hewan
pada frame 1 dengan alpha 2 dan pada frame 60 buat keyframe dan ubah alpha pada movie teks menjadi 100 lalu gerakkan dengan
menggunakan
motion tween.
2. Background
Buat sebuah desain gambar menarik dan masukkan pada frame 1 dan sesuaikan ukuran gambar dengan ukuran lembar background dan kemudian buat blankkeyframe
pada frame 30 dan masukkan gambar lain sebagai background lembar kerja. Buatlah menu button
menu yuk
untuk melanjutkan animasi berikutnya.
3.2 Membuat desain halaman depan
Untuk langkah awal dalam membuat sebuah animasi adalah desain. Dalam tugas akhir ini terdapat halaman depan yang didesain untuk menampilkan menu-menu yang
dapat dipilih. Menu-menu tersebut dihubungkan ke materi-materi, contoh soal dan
lainnya.
Hal pertama yang perlu dipikirkan dalam membuat halaman depan ini adalah bentuk desain yang akan dibuat. Maka saya memutuskan untuk membuat beberapa
animasi, yaitu animasi kupu-kupu terbang dan berputar dan animasi nama penulis dan judul pembelajaran ini.
1. Nama
Langkah awal yang saya buat adalah membuat nama saya dan memberikan warna biru pada teks nama tersebut dan kemudian memisahkan setiap hurufnya dengan menekan
ctrl b pada keyboard computer.
Kemudian buat layer yang berbeda untuk setiap huruf agar lebih mudah untuk membuat animasi yang diinginkan. Susun layer sesuai dengan huruf mana yang akan
dimunculkan terlebih dahulu. Pada layer A frame 1 dan buat keyframe pada frame 200 buat sebuah movie clip kotak bewarna putih sebesar huruf diluar background namun
tetap sejajar dengan teks nama. Kemudian pada layer 10, buat keyframe dan pindahka movie clip menimpa huruf A dan ubah colour menjadi brightness -52. Dan buat
keyframe pada frame 20, dan pada posisi yang sama ubah colour kotak menjadi brightness 100.Kemudian buat hal yang sama untuk memunculkan masing-masing
huruf, dan atur waktu untuk memunculkan masing-masing huruf dengan mengatur frame dari setiap layer. Untuk setiap layer, buatlah pada frame selanjutnya dari frame
pada layer sebelumnya, seperti yang terlihat pada gambar 3.1. Dan setelah sebuah huruf muncul, kembali ke frame 1, dan hapus secara manual masing-masing huruf
selain huruf yang diharapkan muncul.
Gambar 3.1 Timeline nama hanna
Untuk nama selanjutnya saya membuat animasi marga saya
sihombing
dengan memunculkan nya satu persatu sampai pada akhirnya muncul secara lengkap. Langkah
pertama yang saya lakukan adalah membuat huruf s pada frame 50, tepat setelah nama depan saya telah muncul sepenuhnya. Kemudian pada frame 54 buat blankkeyframe
dan membuat huruf i pada posisi yang sama, dan lakukan hal yang sama untuk setiap huruf sampai pada huruf g. Dan kemudian pada frame 86, tepat setelah setiap huruf
sudah muncul, buat teks
sihombing
pada posisi yang sama dan buat keyframe pada frame 200. Seperti yang terlihat pada gambar 3.2.
Gambar 3.2 Timeline nama marga
Gambar 3.3 Desain nama
2. Judul
Untuk membuat animasi judul, pertama saya memisahkan animasi
metamorphosis
dengan animasi
hewan.
Untuk membuat animasi
metamorfosis
,buat masing-masing layer untuk masing-masing huruf untuk mempermudah pembuatan animasi. Langkah
pembuatannya, pertama-tama pada frame 86 buat movie clip huruf m dengan posisi 90 derajat putar kekanan dan buat dengan ukuran yang cukup besar. Kemudian pada
frame 90 buat keyframe dan putar huruf kedalam posisi normal dan ukurannya juga diperkecil dan selanjutnya buat keyframe pada frame 200. Dan lakukan hal yang sama
pada setiap huruf dari masing-masing berikutnya pada frame – frame selanjutnya
sehingga akan muncul setiap huruf dengan animasi yang diinginkan sampai muncul kata
metamorphosis
. Seperti yang terlihat pada gambar 3.3.
Gambar 3.4 Timeline judul metamorphosis
Dan untuk judul berikutnya yaitu
hewan,
saya membuat animasi sederhana dengan memunculkan kata ini secara perlahan-lahan. Pertama-tama pada layer yang
berbeda dan pada frame 140, frame dimana animasi
metamorfosis
berakhir, buatlah sebuah movie clip teks
hewan
dengan alpha 0, kemudian pada frame 150 buat keyframe dengan alpha 21 gerakkan dengan motion tween, dan kemudian pada
frame 170 buat keyframe dengan alpha 35, gerakkan dengan motion tween dan terakhir pada frame 200 buat keyframe dengan alpha 100 dan gerakkan dengan
motion tween. Seperti yang terlihat pada gambar 3.4.
Gambar 3.5 Timeline judul hewan
Gambar 3.6 Desain judul
3. Objek kupu-kupu
Untuk membuat objek kupu-kupu, pertama yang saya lakukan adalah memasukkan gambar kupu-kupu yang ingin saya animasikan dengan pilih menu file - import -
import to stage dan pilih gambar kupu-kupu yang diinginkan dan ubah kupu-kupu menjadi movie clip dengan cara klik kanan - convert to symbol - movie clip,
kemudian ubah alpha menjadi 34. Pada frame 1, letakkan kupu-kupu pada posisi awal terbang, kemudian pada fram 41 buat keyframe dan geser kupu-kupu pada posisi
akhir terbang, selanjutnya pada frame 47 buat keyframe dan putar kupu-kupu kearah posisi awal terbang, dan terakhir, pada frame 200 buat keyframe dan geser kembali
kupu-kupu ke posisi awal terbang.Seperti terlihat pada gambar 3.7.
Gambar 3.7 timeline kupu-kupu terbang
Untuk membuat kupu-kupu berputar, langkah yang dilakukan adalah, pada frame 1 masukkan kembali gambar objek kupu-kupu yang ingin dianimasikan dan
klik kanan pada gambar kemudian convert ke movie clip, dan masukkan action script untuk memutar objek kupu-kupu tersebut.
Gambar 3.8 ActionScript perputaran kupu-kupu
4. Membuat tombol menu
Menu-menu yang dibuat dihubungkan dengan animasi-animasi selanjutnya yang tersedia. Cara link menu ialah dengan membuat tombol nama masing-masing menu
dan menghubungkannya dengan mengetikkan action script pada tombol. Contoh:
Gambar 3.9 Link menu materi
3.3 Materi
