BAB 3
PERANCANGAN SISTEM
3.1 Kerangka Aplikasi
3.1.1 Tampilan Utama Home
Gambar 3.1 Tampilan Utama Home
Ket: 1. Running Teks
2. Tombol menuju Menu Home.fla Tampilan Ini di dominasi ole warna pelangi. Ketukaka di tampilkan, maka akan
terdengar musik dan suara pengantar.
1
2
Universitas Sumatera Utara
3.1.2 Tampilan Menu
Gambar 3.2 Tampilan menu
Ket: 1. Kalimat Yang di jadikan Tombol menuju Alfabet_Indonesia.fla
2. Kalimat Yang di jadikan Tombol menuju Alfabet_Indonesia.fla 3. Tombol Menuju Tampilan Awal Start.fla
4. Tombol Exit
3.1.3 Tampilan Stage Alfabet_Indonesia.fla
Gambar 3.3 Tampilan Alfabet_Indonesia.fla
Ket: 1. Running teks dan animasi ular berjalan
2. Pengetikan Huruf Alfabet
3 4
1 2
3 4
1
2
Universitas Sumatera Utara
3. Tombol Menu Home.fla 4. Tombol Exit
3.1.4 Tampilan Stage Alfabet_Inggris.fla
Gambar 3.4 Tampilan Alfabet_Inggris.fla
Ket: 1. Running teks dan animasi ular berjalan
2. Pengetikan Huruf Alfabet 3. Tombol Menu Home.fla
Tombol Exit
3.1.5 Tampilan Output Setelah Menekan Tombol Huruf
Gambar 3.5 Tampilan Output Setelah Menekan Tombol Huruf Ket : 1.Video pengucapan huruf Alfabet
2.Cara Penulisan Huruf
3 4
1
2
1 2
3
Universitas Sumatera Utara
3.2 Desain Cover Halaman Awal
Untuk mulai merancang suatu animasi ini maka harus jalankan software atau aplikasi Adobe Flash CS3 lalu kemudian pilih new flash document, lalu akan muncul lembar
kerja dari Adobe Flash CS3. Dalam bagian ini terdapat 8 buah layer seperti layer background, sound pengantar,
burung,plakat TK, judul 1,judul2, sound, tombol home dalam hal ini, gambar rumah dijadikan tombol. Berikut tahapannya:
a. Beri judul Start.fla pada halaman baru tersebut. Buat 8 layer secara berturut yaitu layer background, sound pengantar, burung,plakat TK, judul 1, judul 2
sound dan next. Disini penulis membuat ukuran file, dengan ukuran stage sebesar 800 x 500 pixel dengan layer putih.
b. Untuk background penulis mengambil suatu wallpaper yang sudah tersedia dengan cara klik fileimportimport to stage dan pilih wallpaper yang telah
tersedia. Setelah gambar masuk ke library, pilih gambar tersebut dan tarik gambar tersebut sampai ke layer background maka otomatis akan muncul di
latar belakang. Atur ukuran gambar sesuai dengan ukuran stage hingga menutupi background. Tekan Ctrl + Alt 9 dan Ctrl + Alt 7 untuk mengatur
posisi gambar tepat berada pada stage baik secara vertical,horizontal maupun center.
c. Untuk layer burung penulis mengambil gambar dari internet yang formatnya telah di rubah dari format.gif menjadi format .png. Disini penulis hanya meng-
edit motion tween agar tampilan lebuh menarik dan pergerakannya lebih
Universitas Sumatera Utara
sempurna dengan cara tekan F8 atau convert to symbol dan pilih movie clip dan aturlah pergerakannya dari kiri sampai kekanan atau secara horizontal.
d. Untuk layer sound pengantar penulis mengambil suatu file sound berupa format .wav yang sudah penulis rekam sebelumnya dengan cara klik
fileimportimport to stage dan pilih sound yang telah tersedia. Setelah sound masuk ke library, pada menu properties pilih sound yang diinginkan maka
otomatis akan muncul suara pengantar untuk judul. e. Pada layer judul, tuliskan teks dengan judul “Selamat Datang di Animasi
Pembelajaran Pengenalan Alphabet”.Penulis membagi 2 layer untuk judul, yaitu judul 1 dengan kalimat “Selamat Datang Di Animasi” dan judul 2 dengan
kalimat “Pembelajaran Pengenalan Alfabet” dengan menggunakan text tool, klik kanan pada frame 1 dan frame 70 kemudian pilih insert key frame dan pilih
motion tween di antara frame 1 dengan frame 70. f. Pada layer plakat TK penulis menggunakan line tool untuk membuat garis
sebagai gagang pada plakat, rectangle tool untuk membuat plakatnya sendiri, dan text tool untuk menuliskan kata “TK” pada plakat.
g. Untuk layer sound penulis mengambil suatu file sound berupa format .wav yang sudah telah tersedia dengan cara klik fileimportimport to stage dan pilih
sound yang telah tersedia. Setelah sound masuk ke library, pada menu properties pilih sound yang diinginkan maka otomatis akan muncul suara untuk
backsound. h. Untuk tombol home, buatlah sebuah tombol dengan mengunakan gambar yang
ada pada library lalu ubah objek tersebut menjadi tombol dengan mengklik
Universitas Sumatera Utara
kanan pada objek lalu pilih convert to symbol lalu pilih button, kemudian koneksikan dengan action script agar bisa lanjut ke halaman berikutnya dengan
cara pilih windows actions atau langsung shortcut dengan cara tekan F9 dikeyboard dan ketikkan script:
on release { loadMovieNum
Home .swf, 0;
} Disini penulis membuat nama file berikutnya adalah “Home.swf” dan perintah
diatas memiliki arti jika ditekan maka akan menuju kehalaman menu pembelajaran.
3.3 Menu Pelajaran