Desain Halaman Awal Media Pembelajaran Pengelompokan Hewan Dengan Adobe Flash CS6

BAB 3 PERANCANGAN SISTEM Untuk memulai merancang suatu animasi maka terlebih dahulu harus menjalankan software atau aplikasi Adobe Flash CS6, kemudian pilih File New kemudian pada tab general pilih ActionScript 2.0 dan aturlah lebar width dan tinggi height lalu klik tombol ok. Maka akan muncul lembar kerja Adobe Flash CS6.

3.1 Desain Halaman Awal

Dalam bagian ini terdapat 4 layer seperti layer nama, awal, loading, dan home. Berikut tahapannya : 1. Simpan terlebih dahulu dengan nama TA AZHARI.fla. Buat 4 layer secara berurutan yaitu layer background, nama, awal, loading, dan home. Disini penulis membuat ukuran file sebesar 1024x750 pixel dengan warna dasar stage berwarna hitam. Universitas Sumatera Utara 2. Untuk layer nama, awal, dan loading penulis menggunakan Text Tool dari ToolBox untuk menuliskan “Azhari Hidayat Mempersembahkan Hasil Tugas Akhir D3 Tekhnik Informatika”. Penulis juga memberikan warna,suara serta efek bergerak pada tulisan agar terlihat lebih menarik. 3. Untuk layer home penulis mengambil dari wallpaper yang sudah tersedia dengan cara mengimport gambar tersebut. Dengan cara klik File Import Import to Library dan pilih wallpaper yang di minati. Setelah wallpaper masuk ke library, pilih dan tarik wallpaper tersebut ke dalam stage pada layer background. Atur background hingga pas menutupi stage secara penuh. Penulis juga menggunakan Text Tool dari ToolBox sama seperti di layer nama,awal d an loading untuk menuliskan judul “Media Pembelajaran Pengelompokan Hewan”. Serta menambahkan gambar hewan pada background yang gambarnya diambil dari internet lalu diberi efek 4. Di layer home terdapat 2 button yaitu button menu dan button keluar. Dimana button menu yang dapat mengakses ke Frame selanjutnya. Cara membuat button seperti ini sama halnya dengan membuat button lainnya, Penulis menambahkan kotak untuk tombol button yang didapatkan dari Intenet agar terlihat lebih menarik, kemudian copy dan paste hingga menjadi 2 button. Lalu tambahkan text untuk memberi keterangan pada button, kemudian convert to button. Untuk bisa lanjut ke frame selanjutnya ketika di klik, maka perlu menambahkan ActionScript. Dengan cara cara pilih windows actions. Universitas Sumatera Utara Gambar 3.1. Layer Button Menu ActionScript Lakukan pada ke button satunya, namun ActionScript yang berbeda-beda. 5. Masih pada layer home tombol menu, untuk membuat kesan menarik pada button ketika di hover, penulis akan menambahkan efek suara dan perubahan bentuk tombol button tersebut dengan cara, Klik ganda pada salah satu button menu maka akan muncul frame over, down, dan hit . lalu pilih insert key frame pada Over, begitu juga pada down . Kemudian pada frame over dan down, ubah bentuk ukuran gambar tombol button dan berikan efek suara. Hingga hasilnya seperti pada gambar dibawah, lakukan hal ini dengan button satunya. Gambar 3.2. Efek Hover Sound pada Button 6. Kembali pada layer home, kemudian buatlah sebuah button keluar, dimana button ini berfungsi untuk menutup mengakhiri jalannya animasi.Tambahkan kotak untuk tombol button yang sama seperti Universitas Sumatera Utara membuat tombol button menu tadi Tuliskan text “Keluar” didalam kotak tombol button tersebut, untuk membuat menarik berikan efek suara seperti contoh pada gambar 3.2. dan tidak lupa untuk menambahkan ActionScript pada tombol tersebut, seperti pada gambar dibawah. Gambar 3.3. Tombol Keluar

3.2 Menu Pengelompokan Hewan Berdasarkan Kelasnya