BAB 3 PERANCANGAN ANIMASI

Transkripsi

1 BAB 3 PERANCANGAN ANIMASI 3.1Perancangan Animasi Perancangan Animasi merupakan bagan yang menggambarkan alur kerja dari aplikasi animasi kandungan vitamin pada buah, Perancangan merupakan tahap yang sangat penting dalam pembuatan animasi pembelajaran yang dimulai dari perancangan yang matang akan memberikan hasil akhir yang baik juga. Dalam pembuatan animasi terlebih dahulu harus ditentukan tujuan dari animasi yang akan dibuat karena bentuk desain dan isi dari animasi tersebut sangat tergantung pada tujuan animasi itu sendiri. Flowchart Flowchart adalah gambaran dalam bentuk diagram alir dan algoritma dalam suatu program yang menyatakan alur program dalam menyelesaikan suatu masalah. Flowchart dapat memerikan gambaran yang efektif, jelas, dan ringkas tentang prosedur logic. Teknik penyajian yang bersifat grafis jelas akan lebih baik dari pada uraian-uraian yang bersifat teks, khususnya dalam menyajikan logika-logika yang bersifat kompleks. Flowchart atau yang sering disebut bagan alur

2 merupakan metode untuk menggambarkan tahap-tahap penyelesaaian masalah (prosedur), beserta aliran data dengan simbol-simbol standar yang mudah dipahami. Tujuan utama penggunaan Flowchart adalah untuk menyederhanakan rangkaian proses atau prosedur untuk memudahkan pemahaman pengguna terhadap informasi tersebut. Oleh karena itu design sebuah Flowchart harus ringkas, jelas dan bersifat logis, Berikut simbol-simbol yang terdapat pada Flowchart. Table 3.1 Simbol-simbol Flowchart

3 Dalam animasi pembelajaran kandungan vitamin pada buah ini penulis juga sudah membuat Flowchart seperti berikut. Start Tampilan Menu Menu Pengisian data user TampilanBu ah Database SoalLat ihan Login User Tampilan Penjelasan Latihan selesai CetakHasilLat ihan Gambar 3.1 Flowchart Animasi 3.3 Mendesain Tampilan Awal Animasi Pembelajaran

4 Desain tampilan awal animasi adalah sebagai berikut : Nama Selamat datang di pembelajaran kandungan vitamin pada 13 Buah Click Here Gambar 3.2 Rancangan Tampilan awal animasi Cara pembuatannya adalah sebagai berikut : 1. Buka lembar kerja Macromedia Flash 8, Kemudian pilih Flash document. 2. Buat tiga layer pada timeline, yaitu layer background, layer action, dan layer sound. 3. Untuk layer awal pembuatan backgroound klik file pilih import lalu pilihimportto libary kemudian pilih gambar yang ingin di jadikan background pilih open setelah itu akan secara otomatis masuk kedalam library kerja kita dan untuk menggunakan gambar yang telah kita import tinggal tarik gambar tersebut kedalam stage kerja kita. 4. Untuk membuat tampilan nama masukkan teks dari menu Tools lalu pilih Text tool atau dengan shortcut dengan menekan T. 5. Untuk membuat tampilan selamat datang juga dengan masukkan teks dari menu Tools lalu ketikkan huruf S dan pilih selection tool atau menekan V kemudian klik kanan pada huruf S tersebut pilih convert to simbol lalu pilih movie Clip setelah itudouble clik pada S klik kanan pada frame lalu tekan T

5 dan ketikkan huruf selanjutnya. Begitu selanjutnya sampai selesai menjadi kalimat Selamat Datang di Animasi Pembelajaran Kandungan Vitamin Pada 13 Buah dan pada frame terakhir letakkan action stop ();. 6. Untuk melanjutkan ke halaman berikutnya kita dapat membuat atau mengambil dari library kita symbol Click here setelah itu jadikan menjadi button dan pada action scrip nya berikan program seperti berikut gotoandstop(2); 3.4 Mendesain Halaman Start Desain tampilan halaman Start adalah sebagai berikut : Lets Start Menu Profil Latihan Gambar 3.3 Rancangan Tampilan Halaman Start Cara Pembuatannya adalah Sebagai berikut : 1. Masukkan background yang telah ada pada liberary.

6 2. Untuk membuat lets start pilih Text tool (T) masukan teks. 3. Untuk membuat Menu juga dengan mengguanakn Text tool kemudian tekan V untuk menormalkan kemudian Convert to simbol kemudian pilih button, setelah menjadi button berikan scrip berikut : gotoandstop(3); 4. Untuk membuat Profil Juga dengan mengguanakn Text tool kemudian tekan V untuk menormalkan kemudian Convert to simbol kemudian pilih button, setelah menjadi button berikan action scrip berikut : gotoandstop(17); 5. Untuk membuat Latihan juga dengan menggunakan Text tool kemudian tekan V untuk menormalkan kemudian Convert to simbol kemmudian pilih button, setelah menjadi button berikan action scrip berikut : gotoandstop(18); 3.5 Mendesain Isi Menu Lets Start to Learn

7 Jeruk Tomat Pisang Pir Jambu Merah Strawberry Belimbing Pepaya Mangga Apel Melon Semangka Wortel MENU Gambar 3.4 Rancangan Tampilan Isi Menu Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada keyframe dan kemudian insert blank keyframe 2. Masukkan background yang telah diimport ke library 3. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan jeruk setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah jeruk. gotoandstop(4);

8 berikut. Apabila dipilih tombol buah jeruk maka akan muncul tampilan sebagai Gambar Buah Jeruk Kandungan Vitamin pada Buah Jeruk Home Penjelasan manfaat buah pada tubuh Gambar 3.5 Rancangan Tampilan animasi Buah Jeruk Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok atas sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

9 gotoandstop(3); 4. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan tomat setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Tomat. gotoandstop(5); berikut : Apabila dipilih tombol buah Tomat maka akan muncul tampilan sebagai Gambar Buah Tomat Kandungan Vitamin pada buah Tomat Home Penjelasaan Manfaat Buah pada Tubuh Gambar 3.6 Rancangan Tampilan Animasi Buah Tomat

10 Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol hometarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok atas sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 5. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Pisang setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Pisang.

11 gotoandstop(6); berikut ini. Apabila dipilih tombol buah Pisang maka akan muncul tampilan sebagai Kandungan Vitamin Pada Buah Pisang Gambar Buah Pisang H O M E Penjelasaan manfaat buah pada Tubuh Gambar 3.7 Rancangan Animasi Buah Pisang Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol hometarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok sebelah kanan,

12 kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 6. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Pir setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Pir. gotoandstop(7); berikut : Apabila dipilih Tombol Buah Pir Maka akan muncul tampilan sebagai Gambar Buah Pir Kandungan Vitamin pada buah Pir H O M E Penjelasan maanfaat buah pada Tubuh

13 Gambar 3.8 Rancangan Tampilan Animasi Buah Pir Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol hometarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok atas sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 7. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Jambu Merah setelah itu ubah teks menjadi button dan double klik untuk

14 memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Jambu Merah. gotoandstop(8); Apabila dipilih tombol buah Jambbu Merah maka akan Muncul tampilan Sebagai berikut : Kandungan Vitamin pada buah Jambu Merah Penjelasaan manfaat buah pada tubuh Gambar buah Jambu Merah HOME Gambar 3.9 Rancangan Tampilan Animasi Buah Jambu Merah Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library.

15 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok bawah sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 8. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Strawberry setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Strawberry. gotoandstop(9);

16 Apabila dipilih tombol buah Strawberry Maka akan muncul tampilan sebagai berikut : Kandungan Vitamin Pada Buah Srtawberry Gambar Buah Strawberry Penjelasan Manfaat pada buah Tubuh ggggg Gambar 3.10 Rancangan Tampilan Animasi Buah Strawberry Home Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok bawah sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3);

17 9. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Belimbing setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Belimbing. gotoandstop(10); Apabila dipilih tombol buah Belimbing maka akan Muncul tampilan sebagai berikut : Gambar buah Belimbing Kandungan Vitamin pada Buah Belimbing Penjelasan maanfaat buah pada Tubuh Gambar 3.11 Rancangan Tampilan Animasi Buah Belimbing Cara pembuatannya adalah sebagai berikut : Home

18 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok bawah sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 10. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan pepaya setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Pepaya. gotoandstop(11);

19 berikut : Apabila dipilih tombol buah pepaya maka akan muncul tampilan sebagai Kandungan vitamin pada buah Pepaya Penjelasaan maanfaat buah pada Tubuh Home Gambar Buah Pepaya Gambar 3.12 Rancangan Tampilan Animasi Buah Pepaya Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok bawah sebelah kiri, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

20 gotoandstop(3); 11. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Mangga setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Mangga. gotoandstop(12); Apabila dipilih tombol Buah Mangga maka akan Muncul tampilan sebagai Berikut : Penjelasan manfaat buah pada Tubuh H O M E Kandungan Vitamin pada buah Mangga Gambar Buah Mangga

21 Gambar 3.13 Rancangan tampilan Animasi Buah Mangga Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol hometarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok atas sebelah kiri, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 12. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convertto symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Apel setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian

22 beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Apel. gotoandstop(13); Apabila dipilih Buah Apel maka Akan muncul Tampilan sebagai berikut ini : Gambar Buah Apel Kandungan Vitamin Pada Buah Apel Penjelasaan Manfaat Buah Pada Tubuh Home Gambar 3.14 Rancangan Tampilan Animasi Buah Apel Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya.

23 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok bawah sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 13. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Melon setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Melon. gotoandstop(14); Apabila dipilih tombol Buah Melon akan Muncul Tampilan sebagai Berikut : Gambar Buah Melon Kandungan Vitamin Pada Buah Melon

24 Penjelasaan Manfaat Buah Pada Tubuh Home Gambar 3.15 Rancangan Tampilan Animasi Buah Melon Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok bawah sebelah kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3);

25 14. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Semangka setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Semangka. gotoandstop(15); Apabila dipilih tombol Semangka Maka akan Muncul Tampilan sebagai Berikut : Gambar Buah Semangka Kandungan Vitamin pada Buah Semangka Penjelasaan manfaat Buah pada Tubuh Home Gambar 3.16 Rancangan Tampilan Animasi Buah Semangka Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library.

26 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah di import kedalam library kemudian letakkan posisinya di pojok bawah sebelah kiri, kemudian convert to symbol menjadi button dan berikan actionscrip berikut : gotoandstop(3); 15. Pilih Rectangel tool (R) setelah itu diluar stage kemudian tekan V dan Klik pada kotak yang telah dibuat dan ganti warna dengan kode warna, setelah itu ubah convert to symbol menjadi grafik dan tarik kedalam stage dan susun bentuknya kemudian untuk memasukkan teks pilih text tool (T) dan ketikkan Wortel setelah itu ubah teks menjadi button dan double klik untuk memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Wortel. gotoandstop(16);

27 Berikut : Apabila dipilih tombol Buah Wortel maka akan muncul tampilan sebagai Gambar Buah Wortel Kandungan Vitamin pada Buah Wortel Penjelasaan Manfaat buah Pada Tubuh Home Gambar 3.17 Rancangan Tampilan Animasi Buah Wortel Cara pembuatannya adalah sebagai berikut : 1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. 2. Pilih background yang telah diimport ke library. 3. Pilih gambar buah yang telah diimport kedalam library kemudian susun bentuknya. 4. Pilih text tool untuk membuat kandungan vitamin pada buah serta penjelasan yang akan manfaat buah tersebut. 5. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam library kemudian letakkan posisinya di pojok tengah bawah, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

28 gotoandstop(3); 16. Untuk membuat tombol kembali kehalaman sebelumnya maka dibuat tombol Menu, untuk membuat tombol menu tersebut maka kita gunakan Text tool (T) pada Toolbox kemudian ketikkan Menu, setelah itu ubah Menu menjadi button dengan convert tosymbol kemudian double klik untuk membuat suara pada button menu tersebut, kemudian berikan action scrip berikut : gotoandstop(17); 3.6 Mendesain Isi Profil Foto Isi Profil Penulis Home Gambar 3.18 Rancangan Tampilan isi Profil

29 Cara pembuatannya adalah sebagai berikut : 1. Klik kanan kembali pada frame dan insert blank keyframe. 2. Pilih background yang telah diimport ke library dan tarik ke stage. 3. Untuk membuat Foto pilih Foto yang telah diimport ke library kemudian tarik kedalam stage dan sesuaikan letak dan bentuknya. 4. Untuk membuat Fropil penulis pilih Text tool (T) pada Toolbox dan ketikkan isi data yang dimuat dalam profil penulis. 5. Untuk membuat tombol home tarik gambar home yang telah diimportkedalamliberarykemudian letakkan posisinya di tengah bawah, kemudian convert to symbol menjadi button dan berikan actionscrip berikut: gotoandstop(2); 3.7 Mendesain Isi Latihan Setelah belajar mari kita kerjakan soal latihan berikut ini Nama Kotak penginputan nama

30 Home Home Gambar 3.19 Rancangan Tampilan Isi Memulai Soal Latihan Cara Pembuatannya adalah sebagai berikut : 1. Klik kanan kembali pada frame dan insert blank keyframe. 2. Pilih background yang telah diimport ke library dan tarik ke stage. 3. Pilih Text tool (T) pada Toolbox untuk membuat teks untuk mengerjakan soal latihan. 4. Pilih text tool (T) pada Toolbox untuk membuat teks nama. 5. Pilih Textool (T) pada Toolbox untuk membuat kontak penginputan nama kemudian biarkan tetap kosong dan pada bagian properties ubah bentuk teks menjadi input teks dan berikan keterangan juga pada bagian variabel. 6. Pilih rectangle pada toolbox untu membuat kotak dan bentuk kotak diluar stage dan ubah warna menjadi seperti yang diinginkan kemudian convert tosymbol daan ubah bentuk menjadi grapich seret kedalam stage, kemudian pilih Tex tool (T) untuk membuat start dan ubah bentuk menjadi button dengan convert to symbol dan pada bagian properties berikan keterangan mulai, 7. Untuk membuat tombol home tarik gambar home yang telah diimport kedalam liberary kemudian letakkan posisinya di pojok bawah sebelah kiri, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

31 gotoandstop(2): 8. Setelah dipilih start maka akan muncul soal-soal latihan sebanyak 10 soal dan akan ada hitungan mundur sebelum nilai keluar, setelah nilai keluar maka akan ada juga keterangan nilai yang diperoleh sudah tuntas atau belum, kemudian ada pilihan ulangi latihan dan akan kembali ke halaman mulai latihan.

32 BAB 4 IMPLEMENTASI 4.1 Hasil Tampilan Halaman Pembuka Gambar 4.1 Tampilan Pembuka

33 Pilih CLICK HERE untuk melanjutkan animasi kehalaman selanjutnya Tampilan Halaman Start. Gambar 4.2 Tampilan Start Klik tombol MENU untuk masuk ke halaman menu kemudian klik menu kembali untuk kembali ke halaman start. Klik tombol PROFIL untuk masuk ke halaman isi Profil kemudian klik button home untuk kembali ke halaman start.

34 Klik tombol LATIHAN untuk masuk ke halaman Latihan kemudian klik button home untuk kembali ke halaman start atau jika ulangi Latihan Tampilan Isi Menu Gambar 4.3 Tampilan Isi Menu Klik nama buah yang dipilih untuk masuk ke penjelasan kandungan vitamin pada buah.

35 4.1.4 Tampilan Penjelasan Buah Gambar 4.4 Tampilan Penjelasan Buah Klik button home untuk kembali kehalaman isi menu melihat penjelasan buah lainnya.

36 4.1.5 Tampilan Halaman Isi Profil Gambar 4.5 Tampilan Isi Profil Pilih button untuk kembali kehalaman start.

37 4.1.6 Tampilan Halaman Latihan Gambar 4.6 Tampilan Isi Latihan Masukkan nama dan klik start untuk memulai menjawab soal latihan, seperti gambar tampilan dibawah ini atau klik button home untuk kembali kehalaman start.

38 4.1.7 Tampilan Isi Latihan Gambar 4.7 Tampilan Soal Latihan Pilih jawaban yang paling benar dengan memilih Option jawaban dan akan masuk ke soal berikutnya.

39 4.1.7 Tampilan Hitung Mundur Gambar 4.8 Tampilan Hitung Mundur

40 4.1.8 Tampilan Nilai Gambar 4.9 tampilan Nilai Pilih Kembali Ke Latihan untuk kembali ke Menu Latihan. Pilih Kembali Ke Menu untuk kembali Ke halaman Menu.

41 BAB 5 KESIMPULAN DAN SARAN 5.1 Kesimpulan Dalam Penulisan Tugas akhir ini telah dijelaskan proses perancangan animasi hingga pembuatan animasi pembelajaran kandungan vitamin pada buah, dan berdasarkan pembahasan dan evaluasi dari setiap bab maka diperoleh beberapa kesimpulan sebagai berikut : 1. Pengguna dan pemanfaat animasi pembelajaran ini dapat memberikan kemudahan kepada siswa untuk mengetahui kandungan vitamin dari buah yang sering mereka konsumsi serta mengetahui manfaatnya bagi tubuh. 2. Animasi ini juga dibuat untuk menguji pemahaman mengenai materi dengan menjawab beberapa soal latihan yang disediakan sehingga pembelajaran lebih efesien. 3. Dalam pembuatan animasi diperlukan imajinasi agar dapat membuat tampilan animasi yang menarik dan tidak membosankan. 4. Berdasarkan pengalaman penulis, Macromedia flash 8 adalah Perangkat lunak yang dapat digunakan membuat animasi, karena tampilannya yang sederhana dan mudah digunakan terutama bagi pemula, juga memiliki fiiturfitur yang cukup lengkap.

42 5.2 Saran Dari kesimpulan yang telah diambil, maka dapat dikemukakan saran-saran untuk animasi pembelajaran adalah : 1. Sebaiknya animasi dijadikan pilihan untuk menggantikan alat peraga dan pemberian materi yang menonton dalam proses belajar mengajar. 2. Dalam mempublikasikan Flash sebaiknya jadikan file tersebut menjadi file HTML agar komputer yang tidak mempunyai Flash Player tetap dapat melihat hasil animasi. 3. Jika telah selesai dalam pembuatan animasi pembelajaran sebaiknya uji lagi untuk memastikan animasi telah berjalan sesuai dengan yang diharapkan, serta informasi yang ditampilkan telah terjamin kebenarannya.