Intro Membuat desain halaman depan

BAB 3 PERANCANGAN SISTEM

Untuk memulai membuat sebuah animasi flash baru, bukalah aplikasi flash. 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 beberapa objek movie clip, yaitu: 1. Balon teks Buatlah angka 3, 2, 1 masing-masing pada frame 1, 20, 40. Lalu buatlah sebuah movie clip lingkaran dengan alpha 80. Kemudian pada movie clip lingkaran potong sedikit- sedikit lingkaran masing-masing pada frame 5,10,15,20. Letakkan movie lingkaran diatas masing-masing frame angka 3,2,1. Buat movie clip teks welcome dengan mengetikkannya per-huruf. Buat huruf w pada frame 1 layer pertama. Buat keyframe pada frame 3 dan 5 lalu blankkeyframe pada frame 2 dan 4. Lakukan hal yang sama pada huruf lainnya dengan waktu mucul yang bertahap. Seperti e yang dimunculkan pada frame 6, l pada frame 11 dan seterusnya pada layer yang berbeda-beda. Kemudian buat kalimat to simple math learning system pada frame 55. Pilih keyframe pada frame 60. Lalu ubah ukuran tulisan pada frame 55 menjadi lebih kecil lalu gerakkan dengan motion tween. Letakkan movie teks welcome ini pada frame terakhir movie balon teks. 2. Balon angka Buat movie teks angka 0-9 dan operator +, -, x, :, . Lalu buat sebuah movie gelembung lingkaran dengan dua buah lingkaran kecil dibawahnya. Ubah alpha movie gelembung menjadi 80 . Kemudian letakkan movie gelembung diatas setiap angka dan operator. Letkkan masing-masing movie angka dan operator yang telah diberi gelembung pada layer yang berbeda-beda di bawah stage. Pilih create motion pada frame pertama Universitas Sumatera Utara semua layer dan tambahkan add motion guide. Dan gerakkan masing-masing movie kedalam stage pada frame terakhir. Hilangkan movie gelembung pada angka ganjil dan operator pada frame terakhir lalu putar movie angka dengan motion tween.

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, game, dan lainnya. Hal pertama yang perlu dipikirkan dalam membuat halaman depan ini adalah bentuk desain yang akan dibuat. Maka saya memutuskan untuk membuat sebuah taman pelangi sederhana. Komponen-komponen dari desain ini dibuat dalam flash sepenuhnya dengan menggunakan movie clip yang digabungkan dan memanfaatkan tools yang ada. Objek-objek yang saya buat disini diantara nya adalah objek pelangi, bunga, matahari, dan awan. 1. Objek pelangi Langkah awal yang saya lakukan adalah membuat sebuah objek melengkung dari atas kebawah untuk pelangi pertama dengan menggabungkan dua buah line tool dan memberikan warna ungu. Kemudian pelangi ungu tersebut saya jadikan movie clip dengan cara memblok bagian pelangi ungu - klik kanan- convert to symbol- movie clip. Setelah pelangi ungu menjadi movie clip, klik ganda pada objek tersebut hingga masuk pada timeline movie pelangi. Buatlah lima buah layer dengan nama masing-masing warna pelangi agar mudah, Gambar masing-masing pelangi merah, oranye, kuning, dan hijau pada masing-masing layer. kemudian tentukan waktu muncul pelangi dengan mengatur frame dengan cara klik kanan pada frame yang akan dijadikan waktu muncul dan pilih insert keyframe. Seperti yang terlihat pada gambar 3.1. Letakkan objek pelangi pada layer tersendiri di tengah area stage. Universitas Sumatera Utara Gambar 3.1 timeline pelangi Gambar 3.2 movie pelangi 2. Objek awan Untuk membuat objek awan, pertama yang harus dibuat ialah membuat bentuk awan. Bisa dengan menggunakan line tool atau oval tool. Klik kanan pada objek awan dan convert gambar menjadi movie clip. Lalu gandakan gambar awan menjadi 4 buah dan letakkan dipinggir luar kanan layar area kerja. Berikan instance name pada masing- masing awan dengan awan1, awan2,awan3, dan awan4. Atur awan pada layer terpisah sehingga awan- awan tersebut ada yang berada diatas dan dibawah dari objek matahari. Buka layar action pada leyer awan mana saja dan masukkan ActionScript untuk menggerakkan awan tersebut. Universitas Sumatera Utara Gambar 3.3 script gerak awan 3. Objek bunga Buatlah sebuah objek bunga dengan menggabungkan beberapa line tool dan oval tool untuk membuat batang, daun, dan kelopak bunga. Jadikan objek tersebut menjadi movie clip dan buatlah gerakan pada timeline movie objek bunga tersebut. Gambar 3.4 objek bunga 4. Objek matahari Membuat objek matahari sangat mudah karena hanya membuat sebuah lingkaran menggunakan oval tool saja. Convert objek lingkaran menjadi movie clip. Buka properties panel dan pilih filter. Klik pada tanda + plus dan pilih glow. Buat glow sebanyak 2 kali dan atur blur x, y, dan quality pada masing-masing glow. Universitas Sumatera Utara Gambar 3.5 pengaturan filters matahari 5. Membuat tombol menu Menu yang dibuat dihubungkan dengan animasi-animasi selanjutnya yang tersedia. Cara membuat link menu ialah dengan membuat tombol nama masing-masing menu dan menghubungkannya dengan mengetikkan action script pada tombol. Contoh: Gambar 3.6 link menu materi 3.3 Materi 3.3.1. Penambahan, pengurangan, perkalian, dan pembagian