meliputi gambar, teks, suara maupun efek gerak dan pembuatan interaktif animasi yang menggunakan ActionScript
. Animasi ini juga harus memenuhi kriteria animasi
yang baik. Adapun beberapa kriteria animasi yang baik adalah : 1. Interface tampilan yang menarik dan tidak berlebihan
2. Suara dan video pendukung yang menarik 3. Bermanfaat
4. Interaktif 5. Informatif
3.3 Rancangan Animasi
Pembuatan animasi ini menggunakan gambar kartun yang sudah dikenal dikalangan siswa sehingga mudah dipahami, dan juga animasi ini menggunakan teknik yang
sederhana dalam proses pembuatannya sehingga tidak terjadi pemakaian ruang publikasi secara berlebihan. ActionScript akan dilampirkan pada bagian lampiran listing program.
3.3.1 Desain Halaman Awal
Halaman awal adalah halaman pembuka ketika aplikasi pertama kali dijalankan dimana pada halaman ini terdapat judul dari aplikasi yaitu “Animasi Gaya Fisika”
yang dianimasikan menggunakan tokoh kartun yang sudah sangat familiar dikalangan siswa sehingga terlihat menarik juga disertai link untuk menuju
kehalaman menu. Sebelum menjelaskan lebih lanjut, keseluruhan aplikasi animasi
Universitas Sumatera Utara
ini berada dalam satu lembar kerja tetapi terletak dalam layer – layer dan frame
yang berbeda. Berikut adalah langkah – langkah untuk membuat desain halaman awal :
1. Input enam buah layer dengan cara klik kanan pada bagian paling kiri timeline kemudian pilih insert layer. Berikan nama pada masing – masing layer yaitu
judul, background, doraemon, giant, suneo, shizuka dan nobita. Setiap layer akan berakhir pada frame enam puluh.
2.
Pada layer background, masukkan rectangle tool berbentuk persegi sesuai dengan ukuran stage. Kemudian pilih pengaturan warnanya melalui panel
color pilih jenisnya radial seperti gambar dibawah ini :
Gambar 3.1 Pengaturan Warna Layer Background
3.
Pada layer judul masukkan teks melalui teks tool yang ada pada tools dengan pilihan font jokerman , 41. Kemudian teks tersebut dijadikan movie
clip dengan menekan tombol F8 kemudian pilih movie clip dan beri nama judul. Teks tersebut akan dibuat menjadi berubah – ubah warnanya.
Setelah berbentuk movie clip, double click pada teks tersebut. Pada frame 1 sudah di double click pilih properties untuk mengganti warnanya pilih
Universitas Sumatera Utara
color kemudian pilih jenis warna biru dengan kode warna 0000FF kemudian tekan F6 pada frame 5 untuk selanjutnya mengganti warna teks
menjadi merah dengan kode warna FF0000. Tekan kembali F6 pada frame 10 dan ganti warna teks menjadi hijau dengan kode warna 00FF00.
Dan untuk warna terakhir pada frame 15 pilih warna ungu dengan kode warna 660066. Kemudian tekan CTRL + E untuk keluar dari pengeditan
tersebut.
4.
Pada layer giant masukkanlah gambar giant yang telah dipersiapkan sebelumnya dengan menekan tombol CTRL + R. Lalu objek tersebut
jadikan movie clip dengan cara yang sama dengan sebelumnya. Double click objek tersebut untuk mengatur gerakannya dalam setiap frame. Jika
sudah selesai tekan CTRL + E. Selanjutnya untuk frame suneo, shizuka dan nobita caranya sama dengan pembuatan pada layer giant. Kita hanya
mengganti objeknya saja.
5.
Buat sebuah link berbentuk panah dari rectangle tool. Kemudian jadikan kedalam bentuk button dengan menekan tombol F8 pilih button lalu
berikan nama tombol.
3.3.2 Desain Halaman Menu
Halaman ini berisi menu aplikasi apa yang kita inginkan. Dihalaman ini terdapat menu untuk masuk ke aplikasi teori, latihan, simulasi, tentang penulis dan juga
keluar. Setiap pilihan menu berupa animasi yang berubah bentuk jika akan diklik
Universitas Sumatera Utara
dan juga dalam bentuk link. Berikut adalah langkah – langkah untuk membuat halaman menu :
1. Frame awal dimulai dari frame 61 dikarenakan frame sebelumnya digunakan untuk halaman awal.
2. Halaman ini hanya terdiri dari 1 layer dimana semua desain dan juga animasi ada didalam layer ini. Beri nama layer dengan nama menu.
3. Pertama kali masukkan objek yang akan menjadi background dari halaman ini dengan menekan tombol CTRL + R dan sesuaikan ukurannya
dengan ukuran stage. Kemudian klik kanan pilih arrange lalu pilih lagi send to back untuk membuatnya menjadi latar dengan berada dibawah
objek – objek selanjutnya. 4. Masukkan objek – objek yang sebelumnya sudah dipersiapkan. Kemudian
setiap objek dijadikan bentuk button dengan nama yang berbeda – beda yaitu : teori, latihan, simulasi, tentang dan keluar. Double click pada salah
satu objek yang sudah menjadi bentuk tombol, kemudian tekan F6 pada menu over. Perbesar ukuran tombol tersebut dengan memilih free
transform tool pada menu tools atau dengan menekan tombol Q dan sebelumnya pastikan bahwa objek dalam keadaan aktif. Lakukan cara
yang sama untuk setiap button.
Universitas Sumatera Utara
3.3.3 Desain Halaman Teori
Setiap teori yang ada pada halaman ini yaitu meliputi teori mengenai gaya gesek, gaya berat, gaya normal, gaya sentripetal dan hukum newton berada dalam satu
layer yaitu layer teori. Hanya saja akan ada beberapa layer yang dibuat terpisah dikarenakan adanya animasi yang harus dipisahkan dari layer teori tersebut.
Halaman teori ini berisi penjelasan singkat mengenai gaya secara garis besar yang disertai dengan animasi sederhana yang cukup jelas untuk
menggambarkan maksud dari teori tersebut juga disertai link yang akan menuju kehalaman sebelum dan selanjutnya. Berikut adalah langkah – langkah untuk
membuat halaman teori :
1. Halaman ini dimulai dari frame 62 dan masih didalam 1 layer saja. 2. Pada frame 62, masukkan objek yang akan dijadikan background atau
latar dari halaman ini dengan menekan tombol CTRL + R dan sesuaikan ukurannya dengan ukuran stage. Kemudian klik kanan pilih arrange lalu
pilih lagi send to back untuk membuatnya menjadi latar dengan berada dibawah objek – objek selanjutnya. Selanjutnya klik teks tool pada pilihan
tool yang tersedia untuk memasukkan teks dengan jenis font hobo std dan ukuran 13 dengan warna hitam.
3. Masih didalam frame yang sama, masukkan objek balon udara yang telah dipersiapkan sebelumnya kemudian jadikan kedalam bentuk movie clip
Universitas Sumatera Utara
dan berikan namanya. Letakkan objek tersebut paling bawah dari halaman stage sebagai letak awal dari balon udara tersebut. Double click pada objek
tersebut lalu tekan F6 pada frame 55 dan tentukan letak akhir dari balon udara yaitu pada bagian paling atas dari stage. Selanjutnya klik kanan pada
sembarang frame diantara frame satu sampai lima puluh lima tersebut lalu pilih create motion tween. Setelah selesai tekan CTRL + E untuk keluar
dari pengeditan tersebut. 4. Masukkan button back dan next yang bisa diambil langsung dari library
panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri dan kanan stage.
5. Pada frame 63 klik teks tool pada pilihan tool yang tersedia untuk memasukkan teks dengan jenis font hobo std dan ukuran 13 dengan warna
hitam. Masih didalam frame yang sama, masukkan objek pegas yang telah dipersiapkan sebelumnya kemudian jadikan kedalam bentuk movie clip
dan berikan namanya. Double click pada objek tersebut kemudian atur letak pegas dari frame ke frame untuk membuatnya seolah – olah ditarik.
Setelah selesai tekan CTRL + E untuk keluar dari pengeditan tersebut. Masukkan button back dan next yang bisa diambil langsung dari library
panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri dan kanan stage.
Universitas Sumatera Utara
3.3.4 Desain Halaman Pilihan Teori
Halaman ini berisi tentang pilihan dari beberapa teori mengenai gaya dalam fisika tersebut. Penulis memilih teori mengenai jenis – jenis gaya secara garis besar dan
juga teori mengenai hukum newton. Setiap pilihan dibuat menggunakan objek kepala dari satu karakter kartun dan dijadikan bentuk tombol. Berikut adalah
langkah – langkah untuk membuat halaman pilihan teori :
1. Pertama kali masukkan objek yang akan menjadi background dari halaman ini dengan menekan tombol CTRL + R dan sesuaikan ukurannya
dengan ukuran stage. Kemudian klik kanan pilih arrange lalu pilih lagi send to back untuk membuatnya menjadi latar dengan berada dibawah
objek – objek selanjutnya. 2. Masukkan objek – objek yang sebelumnya sudah dipersiapkan. Kemudian
setiap objek dijadikan bentuk button dengan nama yang berbeda – beda yaitu : gaya gesek, gaya berat, gaya normal, gaya sentripetal dan hukum
newton. Double click pada salah satu objek yang sudah menjadi bentuk tombol, kemudian tekan F6 pada menu over. Perbesar ukuran tombol
tersebut dengan memilih free transform tool pada menu tools atau dengan menekan tombol Q dan sebelumnya pastikan bahwa objek dalam keadaan
aktif. Lakukan cara yang sama untuk setiap button.
Universitas Sumatera Utara
3.3.4.1 Desain Halaman Gaya Gesek
Halaman ini terdiri dari tiga frame dimulai dari frame enam puluh lima yang isinya mengenai pengertian gaya gesek dan jenis – jenisnya. Halaman ini disertai
animasi yang menarik untuk menjelaskan maksud dari setiap teorinya. Berikut adalah langkah – langkah untuk membuat halaman gaya gesek :
1. Pada frame 65, pertama kali masukkan objek yang akan menjadi background dari halaman ini dengan menekan tombol CTRL + R dan
sesuaikan ukurannya dengan ukuran stage. Kemudian klik kanan pilih arrange lalu pilih lagi send to back untuk membuatnya menjadi latar
dengan berada dibawah objek – objek selanjutnya. Selanjutnya klik teks tool pada pilihan tool yang tersedia untuk memasukkan teks dengan jenis
font Giddyup Std dan ukuran 23 dengan warna hitam. Masukkan button back dan next yang bisa diambil langsung dari library panel dan
selanjutnya letakkan pada bagian paling bawah di sudut kiri dan kanan stage.
2. Pada frame 66, klik teks tool pada pilihan tool yang tersedia untuk memasukkan teks dengan jenis font hobo std dan ukuran 14 dengan warna
hitam. Selanjutnya masukkan objek shizuka yang telah dipersiapkan sebelumnya lalu jadikan kedalam bentuk movie clip dan beri nama sesuai
dengan objeknya. Double click pada objek tersebut. Didalam objek tersebut terdapat pembagian lagi menjadi enam buah layer yang terdiri
atas : tangan, tangan kiri, kaki kanan, kaki kiri, kotak dan badan. Pada
Universitas Sumatera Utara
setiap layer akan berakhir pada frame lima belas. Atur posisi dan letak dari setiap objek pada setiap layer agar membentuk gerakan mendorong.
Setelah selesai tekan tombol CTRL + E untuk keluar dari pengeditan. 3. Masukkan button back dan next yang bisa diambil langsung dari library
panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri dan kanan stage.
4. Pada frame 67, klik teks tool pada pilihan tool yang tersedia untuk memasukkan teks dengan jenis font hobo std dan ukuran 14 dengan warna
hitam. Selanjutnya masukkan objek giant dan shizuka yang telah dipersiapkan sebelumnya lalu jadikan kedalam bentuk movie clip dan beri
nama sesuai dengan objeknya. Double click pada objek tersebut. Lalu arahkan mouse pada objek giant kemudian double click lagi. Masih pada
objek giant, lakukan double click sekali lagi. Didalam objek giant ini terdapat 6 buah layer yang terdiri dari: tangan, tangan kiri, kaki kanan,
kaki kiri, badan dan belakang. Setiap layer akan berakhir pada frame 15. Atur posisi dan letak dari setiap objek pada setiap layer agar membentuk
gerakan mendorong. Setelah selesai, double click diluar dari objek tersebut kemudian beralih ke objek shizuka lalu double click lagi. Didalam objek
tersebut terdapat pembagian lagi menjadi 6 buah layer yang terdiri atas : tangan, tangan kiri, kaki kanan, kaki kiri, kotak dan badan. Setiap layer
akan berakhir pada frame 15. Atur posisi dan letak dari setiap objek pada setiap layer agar membentuk gerakan mendorong. Setelah selesai tekan
tombol CTRL + E untuk keluar dari pengeditan.
Universitas Sumatera Utara
5. Masukkan button back yang bisa diambil langsung dari library panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri stage.
3.3.4.2 Desain Halaman Gaya Berat
Halaman ini terdiri dari satu frame dimulai dari frame 68 yang isinya mengenai pengertian gaya berat dan contohnya dalam kehidupan sehari - hari. Halaman ini
disertai animasi bola yang jatuh kelantai. Berikut adalah langkah – langkah untuk membuat halaman ini :
1. Pertama kali masukkan objek yang akan menjadi background dari halaman ini dengan menekan tombol CTRL + R dan sesuaikan ukurannya
dengan ukuran stage. Kemudian klik kanan pilih arrange lalu pilih lagi send to back untuk membuatnya menjadi latar dengan berada dibawah
objek – objek selanjutnya. Selanjutnya klik teks tool pada pilihan tool yang tersedia untuk memasukkan teks dengan jenis font Hobo Std dan ukuran
20 dengan warna hitam. 2. Gambarlah sebuah persegi panjang melalui rectangle tool sebagai
permukaan lantai dimana bola akan memantul yang diletakkan dibagian bawah stage. Lalu gambarkan juga bola yang juga menggunakan rectangle
tool. Selanjutnya objek bola dijadikan kedalam bentuk movie clip.
Universitas Sumatera Utara
3. Setelah objek berbentuk movie clip, lalu double click objek tersebut. Pada frame 10 tekan F6. Klik kanan diantara frame 1 sampai 10 kemudian pilih
create motion tween. 4. Kembali klik pada frame 10. Gambar sebuah bentuk panah kebawah
menggunakan rectangle tool dan juga pen tool. Setelah selesai letakkan objek panah tepat dibawah objek lantai sebelumnya. Kemudian masukkan
teks menggunakan text tool yang kemudian diletakkan di bawah objek panah tersebut sebagai penjelasannya. Lalu tekan F6 di frame 17. Setelah
selesai tekan CTRL + E untuk keluar dari pengeditan. 5. Masukkan button back yang bisa diambil langsung dari library panel dan
selanjutnya letakkan pada bagian paling bawah di sudut kiri stage.
3.3.4.3 Desain Halaman Gaya Normal
Halaman ini terdiri dari beberapa layer namun masih dalam frame yang sama. Halaman ini juga terdiri dari teori singkat mengenai gaya normal dan juga animasi
yang akan bergerak hanya jika tombol ditekan. Berikut adalah tahap – tahap pengerjaan halaman ini layer demi layer dan juga frame ke frame :
1. Buatlah 4 layer terpisah dari layer keseluruhan dan berada diatasnya. Beri nama masing – masing layer : alas, balok dan panah, panah atas dan
tombol. 2. Pada layer alas yang dimulai dari frame
69, gambarkan sebuah objek jajaran genjang menggunakan pen tool lalu beri warna biru dengan kode warna
Universitas Sumatera Utara
0000CC. Lalu letakkan dibagian bawah stage kemudian tekan F6 pada frame 75.
3. Pada layer balok dan panah yang dimulai dari frame 69, gambarkan sebuah balok dan juga panah ke arah bawah menggunakan rectangle tool
dimana kedua objek ini dijadikan satu. Cara untuk menyatukan beberapa objek yang berbeda yaitu dengan memblok kesemua objek menggunakan
selection tool kemudian pilih menu modify, combine object, union. Kemudian beri warna hijau dengan kode warna 00CC33. Atur letak objek
di setiap frame mulai dari frame 69 sampai frame 75 yang semakin kebawah menutupi setengah objek alas.
4. Pada layer panah atas hanya terdapat di frame 75. Gambarlah sebuah bentuk panah yang menunjuk ke arah atas menggunakan pen tool
kemudian beri warna hijau dengan kode warna 00CC33. 5. Pada layer tombol yang dimulai dari layer 69 sampai 75 gambarlah sebuah
objek berbentuk lingkaran dan kecil menggunakan rectangle tool dan jadikan objek ini kedalam bentuk button dengan menekan tombol F8.
Kemudian letakkan tepat di bawah objek alas. 6. Masukkan button back yang bisa diambil langsung dari library panel dan
selanjutnya letakkan pada bagian paling bawah di sudut kiri stage.
3.3.4.4 Desain Halaman Gaya Sentripetal
Halaman ini berisi teori singkat mengenai gaya sentripetal yang disertai animasi seorang anak yang memutar – mutarkan tali diatas kepalanya dimana diujung tali
tersebut terdapat bandul bulat. Berikut adalah langkah – langkahnya :
Universitas Sumatera Utara
1. Halaman ini terdapat pada layer teori dan frame ke 76. Pertama kali masukkan objek yang akan menjadi latar atau background dari halaman ini
dengan menekan tombol CTRL + R dan sesuaikan ukurannya dengan ukuran stage. Kemudian klik kanan pilih arrange lalu pilih lagi send to
back untuk membuatnya menjadi latar dengan berada dibawah objek – objek selanjutnya. Selanjutnya klik teks tool pada pilihan tool yang
tersedia untuk memasukkan teks dengan jenis font Hobo Std dan ukuran 15 dengan warna hitam.
2. Masukkan objek anak yang telah dipersiapkan sebelumnya dan letakkan dibawah dari teks tersebut.
3. Gambarkan sebuah tali dan juga bandul bulat menggunakan pen tool dan rectangle tool. Kemudian gabungkan kedua objek tersebut menjadi satu.
Cara untuk menyatukan beberapa objek yang berbeda yaitu dengan memblok kesemua objek menggunakan selection tool kemudian pilih
menu modify, combine object, union. Letakkan objek tersebut diatas bentuk kepala objek anak. Lalu objek yang sudah digabungkan tersebut
dijadikan kedalam bentuk movie clip. Double click pada objek tersebut. Kemudian ubah posisi objek dari frame satu sampai frame seratus dengan
mengikuti pergerakan arah jarum jam menggunakan free transform tool. Tekan CTRL + E untuk keluar dari pengeditan.
4. Masukkan button back yang bisa diambil langsung dari library panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri stage.
Universitas Sumatera Utara
3.3.4.5 Desain Halaman Hukum Newton I
Halaman ini merupakan pembagian dari beberapa hukum newton mengenai gaya di dalam fisika. Halaman ini menjelaskan bunyi hukum newton I yang disertai
dengan rumusnya dan juga dengan animasi truk yang bergerak kemudian berhenti tiba – tiba.
Animasi truk tersebut berada pada layer yang berbeda namun masih pada frame yang sama. Hal ini dilakukan untuk mempermudah proses pembuatannya.
Adapun langkah – langkah untuk membuat animasi truk tersebut adalah :
1. Buatlah 7 buah layer dengan nama masing – masing yaitu : truk, truk2, kotak1, kotak2, band, banb dan tombol. Semua layer dimulai dari frame
79. 2. Pada layer truk gambarkanlah sebuah truk dengan bagian tempat duduk
supir dan juga supirnya kemudian bagian belakang truk sebagai tempat peletakan barang. Bagian lain akan digambarkan di layer yang lainnya.
3. Pada layer kotak1 gambarkanlah sebuah persegi panjang dengan bentuk horizontal menggunakan rectangle tool. Dimana ukuran kotak tersebut
lebih panjang dibandingkan bagian depan truk. Lalu kemudian beri warna oranye pda kotak tersebut dengan kode warna FF3300.
4. Pada layer kotak2 gambarkanlah juga sebuah persegi panjang seperti pada kotak1 tetapi dengan ukuran yang lebih pendek daripada ukuran kotak1.
Lalu kemudian beri warna hijau muda pada kotak2 tersebut dengan kode warna 000000.
Universitas Sumatera Utara
5. Pada layer band dan juga banb gambarkan masing – masing objek berbentuk lingkaran dan menyerupai bentuk roda truk dengan
menggunakan rectangle tool oval lalu berikan warna hitam. 6. Pada layer truk2 tidak perlu menggambarkan dari awal lagi. Copy setiap
objek dari setiap layer yang lain lalu paste dalam layer ini. Atur letak setiap objek agar menjadi 1 bentuk mobil truk yang lengkap. Lalu blok
semua objek tersebut menggunakan selection tool atau tekan V pada keyboard. Kemudian pilih modify, combine object lalu pilih union.
7. Pada layer tombol gambarkan sebuah objek kecil berbentuk lingkaran dan kemudian jadikan objek tersebut kedalam bentuk button dengan menekan
tombol F8 kemudian berikan nama sesuai objek. 8. Mulailah mengatur gerakan dari setiap objek. Sebelumnya, letakkan objek
truk2 disebelah kanan dan truk1 beserta bagian – bagiannya yang tetap terpisah disebelah kiri sehingga seolah – olah berada di belakang truk2
tersebut. Truk2 hanya akan diam dan tidak bergerak sama sekali. Kedua kotak diletakkan diatas bagian truk1. Kotak yang berukuran lebih kecil
diletakkan di sebelah kanan dan disebelah kirinya kotak yang besar. Truk1 bergerak dari frame 79 dan berhenti di frame 92 menggunakan motion
tween dan akan tetap tidak bergerak sampai pada frame 98. Gerakan truk tersebut diikuti dengan pergerakan kedua ban yang telah dibuat. Sama
seperti truk1, kedua ban bergerak dimulai dari frame 79 dan berhenti di frame 92. Selanjutnya untuk gerakan kedua kotak tetap mengikuti gerak
Universitas Sumatera Utara
truk. Namun ketika truk berhenti, kedua kotak bergerak semakin maju mendekati bagian kepala truk. Dan ketika kotak yang berukuran kecil telah
menyentuh bagian kepala truk yaitu di frame 95 maka kotak yang besar akan bergerak seperti melayang di atas kotak kecil tersebut dan akan
berhenti tegak lurus tepat di atas kepala truk pada frame 98. 9. Masukkan button back yang bisa diambil langsung dari library panel dan
selanjutnya letakkan pada bagian paling bawah di sudut kiri stage.
3.3.4.6 Desain Halaman Hukum Newton II
Halaman ini dimulai dari frame 99 dan juga berakhir di frame yang sama. Halaman ini berisi tentang bunyi hukum newton II dan juga rumusnya yang
disertai dengan animasi balok yang terikat pada katrol. Semakin besar balok yang terikat maka akan semakin cepat katrol bergerak. Berikut adalah langkah –
langkah untuk membuat halaman ini :
1. Masukkan objek yang akan dijadikan background lalu sesuaikan dengan ukuran stage. Kemudian klik kanan pada objek pilih arrange , send to
back. 2. Masukkan kedua objek katrol yang sudah dipersiapkan sebelumnya dan
masing – masing dijadikan kedalam bentuk movie clip dan berikan namanya yaitu : katrol1 dan katrol2.
Universitas Sumatera Utara
3. Pada movie clip katrol1 yaitu dimana objek baloknya adalah balok yang kecil, double click. Kemudian atur gerak balok yang terikat pada ujung tali
tersebut semakin kebawah. Balok akan mencapai bagian lantai pada frame 20 dan pada frame 25 keadaan balok masih sama dengan frame 20. Setelah
selesai tekan CTRL + E untuk keluar dari pengeditan. 4. Pada movie clip katrol2 yaitu dimana objek baloknya adalah balok yang
lebih besar, double click. Kemudian atur gerak balok yang terikat pada ujung tali tersebut semakin kebawah. Balok akan mencapai bagian lantai
pada frame 15 dan pada frame 20 sampai dengan frame 25 keadaan balok masih sama dengan frame 15. Setelah selesai tekan CTRL + E untuk
keluar dari pengeditan. 5. Pada bagian sudut kiri bawah masukkan button back dengan mengimport
langsung dari library panels.
3.3.4.7 Desain Halaman Hukum Newton III
Halaman ini menjelaskan bunyi dari hukum newton III dan juga rumus yang disertai dengan animasi seorang anak bermain sepatu roda dan memberikan gaya
terhadap dinding dan sebaliknya dinding juga memberikan gaya terhadap si anak. Dibawah ini adalah langkah – langkah untuk membuat desain halaman hukum
newton III :
Universitas Sumatera Utara
1. Masukkan objek yang akan dijadikan background lalu sesuaikan dengan ukuran stage. Kemudian klik kanan pada objek pilih arrange , send to
back agar bisa ditimpa oleh objek lainnya nanti. 2. Pilih text tool untuk memasukkan teks sebagai penjelasan singkat
mengenai hukum newton III. Pilih jenis font Hobo Std dengan ukuran 14 dan warna hitam.
3. Masukkan objek awal anak yang sedang menggunakan sepatu roda dan memegang tembok dengan kedua tangannya yang sudah dipersiapkan.
Jadikan objek anak tersebut kedalam bentuk movie clip dengan menekan F8. Kemudian double click pada objek tersebut. Tekan tombol F6 di frame
3 kemudian gambarkan objek garis berwarna merah di bagian depan tangan anak tersebut. Tambahkan panjangnya mulai dari frame 3 sampai
ke frame 7. Pada frame 7 masukkan teks Faksi menggunakan text tool. 4. Tekan F6 di frame 15 kemudian gambarkanlah sebuah garis lurus pendek
berwarna hitam yang berlawanan arah dengan garis merah sebelumnya. Lalu tekan F6 di frame 17. Hapus objek anak tersebut dan kemudian
masukkan objek anak yang lainnya dimana bentuknya adalah tangan anak tersebut semakin memanjang karena mendorong tembok tersebut.
Panjangkanlah juga garis hitam sebelumnya. 5. Ulangi langkah nomor 4 tersebut sampai pada frame 25, masukkan tulisan
Freaksi di ujung garis hitam tersebut. Kemudian tekan F6 di frame 33. Tekan CTRL + E untuk keluar dari pengeditan.
6. Pada bagian sudut kiri bawah masukkan button back dengan mengimport langsung dari library panels.
Universitas Sumatera Utara
3.3.5 Desain Halaman Latihan
Halaman latihan ini terdiri 4 link yang akan menuju ke halaman tertentu yang didalamnya terdapat soal – soal. Jenis soal berbeda untuk setiap jenis latihan.
Berikut adalah langkah – langkah untuk mendesain halaman latihan tersebut :
1. Masukkan objek yang akan dijadikan background lalu sesuaikan dengan ukuran stage. Kemudian klik kanan pada objek pilih arrange , send to
back. 2. Masukkan 4 objek yang sudah dipersiapkan sebelumnya dan masing –
masing dijadikan kedalam bentuk button dengan menekan tombol F8 dan beri nama masing – masing sesuai dengan objek.
3. Double click disalah satu objek dan tekan F6 pada frame down. Ubah ukuran objek menjadi lebih besar dengan menggunakan rectangle tool.
Lalu tekan CTRL + E dan ulangi langkah ini terhadap 3 objek lainnya. 4. Pada bagian sudut kiri bawah masukkan button back dengan mengimport
langsung dari library panels.
3.3.5.1 Desain Halaman Latihan I
Halaman ini merupakan latihan mengenai teori – teori maupun pengertian dasar dari pelajaran fisika mengenai gaya. Pilihan jawaban dari setiap soal hanya ada 2
yaitu ya dan tidak. Jika pilihan jawaban benar, maka akan muncul tulisan benar diantara pilihan jawaban. Tetapi jika salah disamping akan muncul tulisan salah,
Universitas Sumatera Utara
juga akan muncul pembahasan yang benar dari soal tersebut. Berikut adalah langkah – langkah untuk membuat desain halaman latihan I :
1. Pilih warna background lalu klik kanan pilih arrange , send to back agar berada tepat dibawah semua objek selanjutnya.
2. Masukkan soal menggunakan text tool dengan jenis font Comic Sans ukuran 12 dan jenis teks adalah static text.
3. Masukkan radio button melalui panel component. Lalu atur parameter radio button tersebut melalui panel parameters. Pengaturan parameternya
dapat dilihat pada gambar dibawah ini :
Gambar 3.2 Pengaturan Parameter RadioButton Latihan I
4. Ulangi langkah nomor 3 tersebut sekali lagi tetapi pada pengaturan parameter radio button tersebut gantilah label dan component ya menjadi
tidak. 5. Buatlah dynamic text melalui text tool diantara kedua radio button tersebut
dengan jenis font Comic Sans ukuran 12 , dan berwarna merah. Lalu isikan variabelnya dengan jawab1.
Universitas Sumatera Utara
6. Masukkan sebuah teks sebagai keterangan atau penjelasan jawaban dari soal tersebut dengan jenis teks yaitu dynamic text dan jenis font Comic
Sans ukuran 12 berwarna biru. Lalu isikan nama variabelnya dengan ket1.
7.
Ulangi langkah 1 sampai 6 untuk membuat soal – soal selanjutnya. Yang perlu diganti adalah nama dari setiap group name dari radio button di tiap
soal karena nama group name tersebut bergantung pada nomor soal. Kemudian penamaan variabel untuk setiap dynamic text
juga bergantung pada nomor soal.
8. Masukkan button back dan next yang bisa diambil langsung dari library panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri
stage.
3.3.5.2 Desain Halaman Latihan II
Halaman ini berisi dengan 10 soal perhitungan sederhana berdasarkan rumus – rumus yang sudah dibahas pada teori sebelumnya. Ada 4 pilihan jawaban pada
setiap soal dan apabila jawaban yang dipilih salah, akan muncul pembahasan dari jawaban yang sebenarnya di sebelah kanan. Berikut adalah langkah – langkah
untuk membuat desain halaman ini :
1. Pilih warna background lalu klik kanan pilih arrange , send to back agar berada tepat dibawah semua objek selanjutnya.
2. Masukkan soal menggunakan text tool dengan jenis font Comic Sans ukuran 12 dan jenis teks adalah static text.
Universitas Sumatera Utara
3. Masukkan radio button melalui panel component. Lalu atur parameter radio button tersebut melalui panel parameters. Pengaturan parameternya
dapat dilihat pada gambar dibawah ini :
Gambar 3.3 Pengaturan Parameter RadioButton Latihan II
4. Ulangi langkah nomor 3 sebanyak 3 kali lagi, tetapi pada pengaturan parameter radio button tersebut gantilah label menjadi jawaban yang
diinginkan dan component diganti menjadi pilihan jawabannya.
5. Buatlah dynamic text melalui text tool diantara kedua radio button tersebut dengan jenis font Comic Sans ukuran 12 , dan berwarna merah.
Lalu isikan variabelnya dengan jb1.
6. Masukkan objek kunci jawaban yang sudah dipersiapkan sebelumnya dan dijadikan kedalam bentuk movie clip. Selanjutnya isi instance name
melalui properties dengan kunci1.
7. Ulangi langkah 1 sampai 6 untuk membuat soal – soal selanjutnya. Yang perlu diganti adalah nama dari setiap group name dari radio button di tiap
soal karena nama group name tersebut bergantung pada nomor soal. Kemudian penamaan instance name untuk setiap kunci jawaban juga
bergantung pada nomor soal.
Universitas Sumatera Utara
8. Masukkan button back dan next yang bisa diambil langsung dari library panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri
stage.
3.3.5.3 Desain Halaman Latihan III
Halaman ini merupakan halaman kuis. Dimana soal – soal yang diberikan terdiri dari jenis soal pada latihan I dan II. Soal ini juga memiliki batas waktu yaitu 60
menit berjalan dan tidak diketahui jawaban sebenarnya seperti pada latihan I dan II karena perhitungan skor akan terjadi diakhir. Setiap jawaban yang benar
bernilai +4 dan jawaban yang salah bernilai 0. Berikut adalah langkah – langkah untuk membuat desain halaman latihan III tersebut :
1. Buatlah 4 layer dengan nama masing – masing yaitu : mulai, waktu,
tampung dan kuis. Setiap layer dimulai dari frame 108. 2. Pada layer kuis di frame 108, buatlah desain layar dan juga teks petunjuk
penggunaan aplikasi kuis tersebut. Setelah selesai, masukkan 3 dynamic text dengan pengaturan yang berbeda – beda seperti gambar dibawah ini :
Gambar 3.4a Properties Dynamic Text Jam
Universitas Sumatera Utara
Gambar 3.4b Properties Dynamic Text Menit
Gambar 3.4c Properties Dynamic Text Detik
3. Masukkan objek yang akan dijadikan sebagai link untuk mulai menjalankan aplikasi kuis. Jadikan kedalam bentuk button dengan
menekan tombol F8 dan berikan nama sesuai objek. 4. Tekan F6 di frame 109. Hapus semua desain kecuali desain penghitung
waktu yang berada di atas. Masukkan soal menggunakan text tool dengan jenis teks yaitu static text, jenis font Comic Sans ukuran 12 dan berwarna
hitam. 5. Masukkan radio button melalui panel component. Lalu atur properties dari
radio button tersebut seperti gambar dibawah ini :
Universitas Sumatera Utara
Gambar 3.5 Pengaturan Properties Radio Button Kuis
6. Ulangi langkah nomor 5 sebanyak 3 kali. Yang perlu diperhatikan adalah nama instance name pada setiap radio button. Jika pada gambar diatas
yang terlihat adalah a1, maka untuk radio button yang berada pada soal yang sama instance name selanjutnya adalah b1, c1 dan d1.
7. Masukkan soal selanjutnya lalu ulangi langkah – langkah pada nomor 5 dan 6 tersebut dengan memperhatikan instance name
bergantung pada nomor soal.
8. Masukkan button back dan next yang bisa diambil langsung dari library panel dan selanjutnya letakkan pada bagian paling bawah di sudut kiri
stage. 9. Jika sudah selesai dengan 25 soal yang dibuat , pada frame soal terakhir,
gambarlah lingkaran berwarna hitam sebagai link menuju halaman hitung skor.
10. Pada frame 117 akan didesain halaman penghitungan skor. Masukkanlah objek yang akan dijadikan latar atau background. Pastikan latar tersebut
berada dibawah agar tidak menutupi objek lainnya. Kemudian masukkanlah objek kalkulator yang lalu jadikan kedalam bentuk button
dengan menekan F8 dan berikan nama sesuai objek. Masukkan dynamic
Universitas Sumatera Utara
text dengan jenis font Comic Sans ukuran 30 berwarna hitam pada bagian layar kalkulator untuk menampilkan skor nantinya. Dan berikan nama
variabel teks tersebut dengan nama skor. Selanjutnya masukkan objek rumah yang akan digunakan sebagai link untuk kembali kehalaman awal
dan jadikan kedalam bentuk button. Beri nama sesuai dengan objek. 11. Pada frame 118 akan didesain halaman habis waktu yang akan muncul
secara otomatis apabila waktu yang berjalan 60 menit sudah habis. Masukkan teks yang menunjukkan waktu sudah habis. Lalu masukkan
objek yang berguna sebagai link untuk menuju halaman penghitungan skor. Jadikan objek tersebut kedalam bentuk button dan beri nama yang
sesuai objek.
3.3.5.4 Desain Halaman Latihan IV
Halaman ini berisi dengan teka – teki silang sederhana mengenai gaya fisika. Berikut adalah langkah – langkah untuk membuat halaman tersebut :
1. Buatlah terlebih dahulu soal – soal dan jawaban di tempat lain seperti kertas kemudian susunlah didalam program menjadi sedemikian rupa
terdiri dari 5 soal menurun dan 5 soal mendatar. 2. Kotak – kotak TTS tersebut dibuat menggunakan input text dengan
menggunakan kotak dan maximum character adalah 1 dan jenis font Comic sans ukuran 10.
Universitas Sumatera Utara
3. Setiap variabel tergantung pada nomor soal dan sesuai dengan abjad. Jadi, variabel untuk soal nomor 1 adalah a1, a2,a3,…dst. Kemudian untuk
variabel soal nomor 2 adalah b1,b2,b2,…,dst. Apabila terdapat kotak yang berada pada letak yang sama, gunakan nama variabel yang lebih dulu
digunakan. 4. Masukkan button back yang bisa diambil langsung dari library panel dan
selanjutnya letakkan pada bagian paling bawah di sudut kanan stage.
3.3.6 Desain Halaman Simulasi
Halaman ini berisi dengan sebuah animasi seorang anak yang menggunakan sepatu roda sedang memegang tali yang terhubung ke sebuah kotak yang juga
memiliki roda. Animasi tersebut akan bergerak apabila nilai – nilai perhitungannya dimasukkan. Gerakan animasi tersebut cepat atau lambatnya
bergantung pada nilai – nilai tersebut. Berikut adalah langkah – langkah untuk membuat halaman simulasi tersebut :
1. Pilih warna background lalu klik kanan pilih arrange , send to back agar berada tepat dibawah semua objek selanjutnya.
2. Terdapat 5 objek utama pada halaman ini yaitu objek anak, tali, kotak, roda depan kotak dan roda belakang kotak. Masukkan kelima objek
tersebut lalu jadikan kedalam bentuk movie clip dan berikan instance name masing – masing objek secara berurutan yaitu : nobita, tali2, kotak, ban3
dan ban2. Atur letak objek – objek tersebut dibawah stage
Universitas Sumatera Utara
3. Masukkan 8 static text dengan jenis Font Comic Sans ukuran 12, yaitu : massa, gaya, percepatan, kg, n, ms
2
, hitung dan reset. 4. Masukkan 3 input text berkotak dengan jenis font Courier New
ukuran 15 dan berikan nama variabel masing – masing secara berurutan yaitu : m,f
dan a. 5. Masukkan sebuah static text dengan jenis font Comic Sans ukuran 12
dengan warna merah. Lalu jadikan teks tersebut menjadi bentuk movie clip dengan instance name pesan.
6. Masukkan button back yang bisa diambil langsung dari library panel dan selanjutnya letakkan pada bagian paling bawah di sudut kanan stage.
3.3.7 Desain Halaman Tentang Penulis
Halaman ini berisi informasi mengenai penulis yang membuat aplikasi pembelajaran ini. Adapun halaman ini perlu dibuat agar memudahkan pembaca
ataupun user yang ingin menggunakan aplikasi ini atau ingin mengetahui secara lanjut mengenai cara pembuatannya untuk menghubungi atau berinteraksi
langsung dengan penulis. Langkah – langkah untuk membuat halaman ini adalah sebagai berikut :
1. Pilih warna background lalu klik kanan pilih arrange , send to back agar berada tepat dibawah semua objek selanjutnya.
2. Masukkan objek foto diri penulis dan sesuaikan ukurannya di sebelah kiri stage.
Universitas Sumatera Utara
3. Masukkan beberapa teks menggunakan text tool dan juga logo – logo dari akun social media penulis sebagai informasi yang berguna untuk
mengetahui tentang diri penulis. 4. Masukkan logo Universitas Sumatera Utara yang sudah disiapkan dengan
menekan tombol CTRL + R 5. Masukkan button back yang bisa diambil langsung dari library panel dan
selanjutnya letakkan pada bagian paling bawah di sudut kanan stage. Button ini akan menuju ke halaman menu awal.
Universitas Sumatera Utara
BAB 4
IMPLEMENTASI SISTEM
4.1 Hasil
