digunakan untuk desain interface adalah dengan metode grid, yaitu membagi area menjadi beberapa bagian. Secara umum navigasi dapat diletakkan di bagian atas atau
samping kiri, dan konten diletakkan di tengah area.
Gambar 140. Layout interface dengan sistem grid Sebagai contoh akan digunakan layout dengan navigasi di atas. Selanjutnya konten yang
dibuat harus disesuaikan dengan target audiense pengguna. Sebagai contoh, karena media yang akan dibuat adalah pembelajaran tentang tata surya untuk anak usia dasar,
maka tampilan yang dibuat bersifat anak-anak dan mengandung elemen yang terkait dengan tata surya, yang dalam hal ini adalah astronot.
Gambar 141. Contoh layout halaman depan dengan navigasi di atas.
111
Membuat tombol
Tombol merupakan salah satu elemen penting dalam multimedia interaktif, untuk itu
Flash secara khusus memiliki symbol bertipe button. Berbeda dengan symbol bertipe
movieclip yang memiliki timeline seperti timeline pada stage, tombol hanya memiliki 4 buah frame yaitu frame Up, Over, Down dan Hit.
Gambar 142. Timeline symbol bertipe button. Up adalah kondisi ketika tombol normal, tidak mengalami aktifitas apapun. Over adalah
kondisi ketika mouse melintas di atas area tombol. Down adalah kondisi ketika mouse menekan tombol, dan Hit adalah area yang menjadi deteksi atau sensor dari tombol.
Untuk lebih jelasnya perhatikan langkah-langkah berikut :
1. Buatlah sebuah file baru. Selanjutnya dengan menggunakan Rectangle tool
buatlah sebuah kotak dengan sudut lengkung Rounded rectangle. Untuk
melakukannya atur properties Rectangle option.
Gambar 143. Rounded rectangle 2. Selanjutnya klik teks tool, pada panel properties pastikan text engine adalah
Classic Text dan text type adalah Static Text. Kemudian klik di atas kotak dan ketikkan kata “tombol”.
Gambar 144. Menambahkan teks pada tombol
3. Seleksi kotak dan teks tombol tersebut, kemudian Convert to Symbol menjadi button
dengan nama “tombol”. 4.
Dobel klik button “tombol” untuk memasuki mode edit. Kemudian klik kanan frame Over
dan pilih Insert Keyframe. Selanjutnya ubah warna kotak dan
warna teks bedakan dengan warna pada frame Up.
5. Klik kanan frame Down dan pilih Insert Keyframe. Selanjutnya ubah kembali
warna kotak dan warna teks.
6. Klik kanan frame Hit dan pilih Insert Keyframe. Untuk frame Hit tidak perlu
dilakukan perubahan apapun, karena hanya digunakan sebagai sensor. Bahkan pada contoh ini tanpa frame Hit pun area akan dihitung berdasarkan frame
sebelumnya.
Gambar 145 . Pengaturan keyframe button “tombol”
7. Jalankan aplikasi dengan menekan Ctrl+Enter. Coba gerakkan mouse ke atas
tombol dan klik tombol tersebut, maka akan terjadi perubahan warna sesuai dengan pengaturan frame yang telah dilakukan.
113
Mengatur Halaman
Proses berikutnya yang sangat penting dan cukup rumit dalam proses pengembangan multimedia pembelajaran interaktif adalah mengatur halaman. Halaman di atur di dalam
timeline sedemikian rupa sehingga dapat diakses dengan mudah oleh kode dan memiliki struktur yang memudahkan kita nantinya untuk menambah atau mengubah materi. Ada
beberapa teknik yang dapat digunakan, mulai dari teknik menyusun konten secara manual di timele sampai dengan teknik pemrograman seutuhnya menyusun semua
layout dan halaman dengan kode. Pada buku ini akan dijelaskan teknik yang paling mudah yaitu menyusun konten atau materi secara manual. Untuk lebih jelasnya
perhatikan contoh berikut :
1. Buatlah sebuah file baru. Selanjutnya atur file dengan membuka properties, sehingga file memiliki ukuran standard untuk aplikasi mobile yaitu 800 x 480
pixel dan 30 FPS.
Gambar 146. Properties dokumen 2. Buatlah sebuah tampilan untuk halaman pertama dari multimedia dengan
menggunakan drawing tool, atau dengan cara File Import Import to Stage.
Gambar 147. Contoh halaman awal multimedia
3. Seleksi gambar tersebut, kemudian buka panel properties, pastikan posisi gambar berada di kordinat x = 0; y = 0; dan ukuran gambar tepat 800x480 pixel.
Jika belum tepat, nilai tersebut dapat diedit secara langsung melalui panel properties.
