Perencanaan dan pembangunan aplikasi E-COMMERCE berbasis web pada toko baju miw miw store medan

Tombol Halaman Awal

on (release) {gotoAndPlay("frame 2"); }

Tombol Halaman Pilihan Menu Utama

1. Menu on(release){gotoAndStop(3); } 2. Profil on(release){gotoAndStop(17); } 3. Latihan on(release){gotoAndStop(18); }

Halaman Buah Pada Tombol Menu

1. Buah Jeruk

on(release){gotoAndPlay(4); }

2. Buah Tomat

on(release){gotoAndPlay(5); } 3. Pisang on(release){gotoAndPlay(6); } 4. Pir on(release){gotoAndPlay(7); }

5. Jambu Merah

on(release){gotoAndPlay(8); } 6. Strawberry on(release){gotoAndPlay(9); } 7. Belimbing on(release){gotoAndPlay(10); }

8. Pepaya on(release){gotoAndPlay(11); } 9. Mangga on(release){gotoAndPlay(12); } 10.Apel on(release){gotoAndPlay(13); } 11.Melon on(release){gotoAndPlay(14); } 12.Semangka on(release){gotoAndPlay(15); } 13.Wortel on(release){gotoAndPlay(16); }

Kembali Ke Menu Utama

on(release){gotoAndPlay(2); }

Tombol Start Pada latihan on(release){gotoAndPlay(19); } Menuju Score on (release){ gotoAndPlay(29); }

DAFTAR PUSTAKA

Panduan Tatacara Penulisan Skripsi & Tugas Akhir. 2015. Dokumen Nomor: Akad/05/2005. Medan: Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.

Veronica. 2012. Aneka Buah dan Manfaatnya Bagi Kesehatan. Jawa tengah: V-media.

Yudhiantaro, Dhani. Membuat Animasi Web dengan Macromedia Flash Professional 8.

(http://melianii9b26p2.blogspot.co.id/2012/08/kelebihan-macromedia-flash-1.html)

Di akses pada tanggal 18 April 2016 pukul 20.15.

www.rickyeka.com Di akses pada tanggal 18 April 2016 pukul 19.46

BAB 3

PERANCANGAN ANIMASI 3.5 Perancanan 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 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

Dalam animasi pembelajaran kandungan vitamin pada buah ini penulis juga sudah membuat Flowchart seperti berikut.

No Yes yay No Yes

Gambar 3.1 Flowchart Animasi

3.3 M

endesain Tampilan Awal Animasi Pembelajaran Desain tampilan awal animasi adalah sebagai berikut :

Gambar 3.2 Rancangan Tampilan awal animasi Cara pembuatannya adalah sebagai berikut :

Start Tampilan Menu Baca Menu Menu Profil Latihan selesai Tampilan Profil Tampilan Buah Tampilan Penjelasan Buah Soal Latihan Tampilan Soal latihan Nama

Selamat datang di pembelajaran kandungan vitamin pada 13 Buah

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 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

Click here setelah itu jadikan menjadi button dan pada action scrip nya berikan program seperti berikut

On(release){ gotoAndStop(2); }

3.4 Mendesain Halaman Start

Desain tampilan halaman Start adalah sebagai berikut :

Gambar 3.3 Rancangan Tampilan Halaman Start

Cara Pembuatannya adalah Sebagai berikut :

1. Masukkan background yang telah ada pada liberary. 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 :

On(release){

gotoAndStop(3); Lets Start

Menu

Profil

}

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 :

On(release){

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 :

On(release){

gotoAndStop(18); }

3.5 Mendesain Isi Menu

Lets Start to Learn

Jeruk Tomat Pisang Pir

Jambu Merah Strawberry Belimbing

Pepaya Mangga Apel Melon

Semangka Wortel

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.

On(release){

gotoAndStop(4); }

Apabila dipilih tombol buah jeruk maka akan muncul tampilan sebagai berikut.

Gambar 3.5 Rancangan Tampilan animasi Buah Jeruk Cara pembuatannya adalah sebagai berikut :

Gambar Buah

Jeruk _{Kandungan Vitamin pada Buah Jeruk}

Penjelasan manfaat buah pada tubuh

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 :

On(release){

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); }

Apabila dipilih tombol buah Tomat maka akan muncul tampilan sebagai berikut :

Gambar 3.6 Rancangan Tampilan Animasi Buah Tomat 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

Gambar Buah Tomat

Kandungan Vitamin pada buah Tomat Penjelasaan Manfaat Buah pada Tubuh

kanan, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

On(release){

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.

On(release){

gotoAndStop(6); }

Apabila dipilih tombol buah Pisang maka akan muncul tampilan sebagai berikut ini.

Kandungan Vitamin Pada Buah Pisang

Gambar Buah Pisang H _O

M E

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, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

On(release){

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. On(release){

gotoAndStop(7); }

Apabila dipilih Tombol Buah Pir Maka akan muncul tampilan sebagai berikut :

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 :

On(release){

gotoAndStop(3);

Gambar Buah Pir

Kandungan Vitamin pada buah Pir

Penjelasan maanfaat buah pada Tubuh

H O M

}

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 memasukkan suara button dan mengubah ukuran ketika di klik, kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Jambu Merah.

On(release){

gotoAndStop(8); }

Apabila dipilih tombol buah Jambbu Merah maka akan Muncul tampilan Sebagai berikut :

Gambar 3.9 Rancangan Tampilan Animasi Buah Jambu Merah Cara pembuatannya adalah sebagai berikut :

1. Klik kanan pada frame sebelumnnya kemudian insert blank keyframe. Gambar buah Jambu

Merah

Kandungan Vitamin pada buah Jambu Merah

Penjelasaan manfaat buah pada tubuh

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 :

On(release){

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.

On(release){

gotoAndStop(9); }

Apabila dipilih tombol buah Strawberry Maka akan muncul tampilan sebagai berikut :

ggggg

Gambar 3.10 Rancangan Tampilan Animasi Buah Strawberry 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 :

On(release){

gotoAndStop(3); }

Gambar Buah Strawberry Kandungan Vitamin Pada Buah Srtawberry

Penjelasan Manfaat pada buah Tubuh

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.

On(release){

gotoAndStop(10); }

Apabila dipilih tombol buah Belimbing maka akan Muncul tampilan sebagai berikut :

Gambar 3.11 Rancangan Tampilan Animasi Buah Belimbing 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.

Gambar buah Belimbing

Kandungan Vitamin pada Buah Belimbing

Penjelasan maanfaat buah pada Tubuh

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 :

On(release){

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.

On(release){

gotoAndStop(11); }

Apabila dipilih tombol buah pepaya maka akan muncul tampilan sebagai berikut :

Kandungan vitamin pada buah Pepaya Penjelasaan maanfaat buah pada Tubuh

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 :

On(release){

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,

Gambar Buah Pepaya Home

kemudian beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Mangga.

On(release){

gotoAndStop(12); }

Apabila dipilih tombol Buah Mangga maka akan Muncul tampilan sebagai Berikut :

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 Gambar Buah Mangga Kandungan Vitamin pada buah Mangga

Penjelasan manfaat buah pada Tubuh H

O M

kiri, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

On(release){

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 beri action scrip berikut untuk menjalankan kedalam penjelasan dari buah Apel.

On(release){

gotoAndStop(13); }

Apabila dipilih Buah Apel maka Akan muncul Tampilan sebagai berikut ini :

Gambar Buah Apel

Penjelasaan Manfaat Buah Pada Tubuh

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.

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 :

On(release){

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.

On(release){

gotoAndStop(14); }

Apabila dipilih tombol Buah Melon akan Muncul Tampilan sebagai Berikut :

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 :

Gambar Buah Melon

Kandungan Vitamin Pada Buah Melon

Penjelasaan Manfaat Buah Pada Tubuh

On(release){

gotoAndStop(3); }

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.

On(release){

gotoAndStop(15); }

Apabila dipilih tombol Semangka Maka akan Muncul Tampilan sebagai Berikut :

Gambar Buah

Gambar 3.15 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.

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 :

On(release){

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.

On(release){

gotoAndStop(16); }

Apabila dipilih tombol Buah Wortel maka akan muncul tampilan sebagai Berikut :

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, Gambar Buah

Wortel

Kandungan Vitamin pada Buah Wortel

Penjelasaan Manfaat buah Pada Tubuh Home

kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

On(release){

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 :

On(release){

gotoAndStop(17); }

3.6 Mendesain Isi Profil

Gambar 3.18 Rancangan Tampilan isi Profil Cara pembuatannya adalah sebagai berikut :

Foto Isi Profil Penulis

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:

On(release){

gotoAndStop(2); }

3.7 Mendesain Isi Latihan

Setelah belajar mari kita kerjakan soal latihan berikut ini

Nama Kotak penginputan nama

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

liberary kemudian letakkan posisinya di pojok bawah sebelah kiri, kemudian convert to symbol menjadi button dan berikan actionscrip berikut :

On(release){

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.

IMPLEMENTASI 4.1 Hasil

4.1.1 Tampilan Halaman Pembuka

Gambar 4.1 Tampilan Pembuka

Pilih CLICK HERE untuk melanjutkan animasi kehalaman selanjutnya.

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.

Klik tombol LATIHAN untuk masuk ke halaman Latihan kemudian klik button home untuk kembali ke halaman start atau jika ulangi Latihan.

Gambar 4.3 Tampilan Isi Menu

Klik nama buah yang dipilih untuk masuk ke penjelasan kandungan vitamin pada buah.

Gambar 4.4 Tampilan Penjelasan Buah

Klik button home untuk kembali kehalaman isi menu melihat penjelasan buah lainnya.

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

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.

Gambar 4.7 Tampilan Soal Latihan

Pilih jawaban yang paling benar dengan memilih Option jawaban dan akan masuk ke soal berikutnya.

Gambar 4.8 Tampilan Hitung Mundur

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

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 fiitur-fitur yang cukup lengkap.

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

BAB 2

LANDASAN TEORI

2.1 Animasi

Animasi adalah sususan gambar diam (static graphics) yang dibuat efek sehingga seolah-olah tampak bergerak. (Dhani Yudhiantoro,2006)

Animation is a process of recording and playing back a sequence of stills to achieve the illusion of continues motion, yang artinya adalah sebuah proses merekam dan memakai kembali serangkaian gambar statis untuk mendapatkan sebuah ilusi pergerakan. Berdasarkan arti harfiah, animasi adalah menghidupkan suatu usaha untuk menggerakkan sesuatu yang tidak bias bergerak sendiri. Secara garis besar, animasi komputer dibagi menjadi dua kategori, yaitu :

a. Computer Assisted Animation, animasi pada kategori ini biasanya menunjuk pada sistem animasi dua dimensi, yaitu mengkomputerisasi proses animasi tradisional yang menggunakan gambaran tangan. Komputer diguanakan untuk pewarnaan, penerapan virtual kamera dan penataan data yang digunakan dalam sebuah animasi.

b. Computer Generated Animation, pada katergori ini biasanya digunakan untuk animasi tiga dimensi dengan 3D seperti 3D Studio Max, Autocad dan lain sebagainya.

(Ibiz Fernandez McGraw-Hill,2011)

Terdapat dua metode untuk membuat sebuah renteten animasi dalam Flash, yaiutu Animasi Frame by Frame dan Animasi Tweened (Tweebed Animation). Animasi frame frame by frame adalah cara klasik menyusun animasi. Di sini Anda harus membuat secara berbeda gambar-gambar dalam tiap frame, sedangkan dalam Animasi Tweened, Anda cukup membuat frame awal dan frame akhir kemudian membiarkan flash membuat frame-frame diantara keduanya. Flash akan membuat variasi besar kecilnya ukuran, rotasi, warna, atau atribut-atribut objek lainnya secara merata di antara frame awal dan frame akhir untuk membuat penampilan gerakan.(Dhani Yudhiantoro,2006)

Animasi Sebagai Media Pembelajaran

Media Animasi dalam Pembelajaran bertujuan untuk memaksimalkan efek visual dan memberikan interaksi berkelanjutan sehingga pemahaman bahan ajar meningkat. Media Animasi alam Pembelajaran memiliki kemampuan untuk dapat memaparkan sesuatu yang rumit atau komplek untuk dijelaskan dengan hanya gambar dan kata-kata saja. Dengan kemampuan ini maka Media animasi dapat ddigunakan untuk menjelaskan suatu materi yang secara nyata tidak dapat terlihat oleh mata, dengan cara melakukan visualisasi maka materi yang dijelaskan dapat tergambarkan.

Media Animasi dalam Pembelajaran yang digunakan baik pada penjelasan konsep maupun contoh-contoh, selain berupa animasi statis auto-run atau diaktifkan melalui tombol, juga bisa berupa animasi interaktif dimana pengguna (siswa) diberi kemungkinan berperan aktif dengan merubah nilai atau posisi bagian tertentu dari animasi tersebut. Urutan kegiatan belajarnya dapat meliputi : Melihat contoh, mengerjakan soal latihan, menerima informasi, meminta penjelasan, dan mengerjakan soal/evaluasi.

Berikut merupakan beberapa kepentingan atau kelebihan Media Animasi dalam Pembelajaran:

1. Media Animasi dalam Pembelajara mampu menyampaikan ssuatu

konsep yang kompleks secara visual dan dinamik.

2. Media Animasi digital mampu menarik perhatian pelajar dengan mudah. Animasi mampu menyampaikan suatu pesan dengan lebih baik dibanding penggunaan media yang lain.

3. Animasi digital juga dapat digunakan untuk membantu menyediakan pembelajaran secara maya.

4. Media Animasi dalam Pembelajaran mampu menawarkan satu media yang lebih menyenangkan. Animasi mampu menarik perhatian, meningkatkan motivasi serta merangsang pemikiran pelajar yang lebih berkesan.

5. Persembahan secara Visual dan dinamik yang disediakan oleh

teknologi animasi mampu memudahkan dalam proses penerapan konsep ataupun demonstrasi.

2.3 Flash

2.3.1 Sekilas tentang Flash

Macromedia Flash adalah sebuah program yang ditunjukan kepada para desainer maupun programer yang bermaksud merancang animasi untuk pembuatan halaman web, presentasi untuk tujuan bisnis maupun proses pembelajaran hingga pembuatan game interaktif serta tujuan-tujuan lain yang lebih spesifik.

Untuk itu, Flash dilengkapi dengan tool-tool (alat-alat) untuk membuat gambar yang kemudian akan dibuat animasinya. Selanjutmya, animasi disusun dengan menggabungkan adegan-adegan animasi hingga menjadi movie. Langkah terakhir adalah menerbitkan karya tersebut ke media yang dikehendakinya.

Flash adalah program animasi berbasis vektor yang bisa menghasilkan file kecil (ringan) sehinggga mudah diakses pada halaman web tanpa membutuhkan waktu loading yang lama. Flash menghasilkan file dengan ekstensi .FLA Setelah file tersebut siap untuk dimuat ke halaman web, selanjutnya file akan disimpan dalam format .SWF agar dapat dibuka tanpa menginstal perangkat lunak Flash, tetapi cukup menggunakan Flash Player yang dipasang pada browser berbasis Windows.

Pada tahun 1997 Macromedia membeli sebuah program gambar untuk web yang diberi nama FutureSplash dari perusahaan bernama FutureWave. Keistimewaanya FutureSplash adalah kemampuannya untuk menggerakan secara serentak vector grafis menjadi sebuah animasi yang dikirim kehalaman

web. Perogram inilah yang merupakan ciikal bakal Macromedia Flash yang kita kenal sekarang. Macromedia melkukan inovasi besar-besaran sehingga waktu tegangan munculnya Flash versi 1 hingga hingga versi 4 berlangsung hanya dalam kurun waktu 2 tahun.

Tahun 2005 Macromedia mengeluarkan Flash basic 8 dan Flash professional 8. Masing-masing ditunjukan untuk desainer pembuat animasi serta pengguna yang memerlukan fasilitas lanjutan baik untuk para pengembang (pembuat program baik dari sisi artistik maupun database) dan pembuat aplikasi interaktif yang memerlukan fasilitas lebih dari sekedar fasilitas dasar. Mungkin ini merupakan strategi pasar agar mereka yang ingin mengenal Flash bisa memperoleh paket dengan harga murah dengan membeli Flash Basic 8, sementara versi lengkapnya dijual dengan harga lebih mahal. (Yudhiantoro 2006)

2.3.2 Macromedia Flash 8

Macromedia flash merupakan program grafis animasi web yang diperoduksi oleh Macromedia corporation. Macromedia Flash pertama kali diperoduksi pada tahun 1996. Pada awal produksi, Macromedia Flash merupakan Software untuk membuat animasi sederhana berbasis .gif. seiring dengan perkembangannya, Macromedia Flash mulai digunakan dalam pembuatan desain situs web. Macromedia Flash telah diperuduksi dengan beberapa versi terbaru yang sekarang beredar dipasaran adalah Macromedia Flash versi 8 dirilis tahun 2005.

Seiring dengan perkembangannya, Macromedia Flash telah diperoduksi dengan beberapa versi. Versi yang kini banyak digunakan adalah Macromedia Flash MX dan Macromedia Flash 8.meskipun versi terbarunya sudah beredar di

pasaran yakni Adobe Flash CS3 yang hak ciptanya telah dimiliki oleh Adobe bukan Macroedia Corp lagi.

Keunggulan Macromedia Flash dibanding program lain yang sejenis, antara lain :

1. Dapat membuat tombol intteraktif dengan sebuah movie atau objek lain.

2. Dapat membuat perubahan transparansi warna dalam movie.

3. Dapat membuat perubahan animasi 1 bentuk ke bentuk lain.

4. Dapat membuat gerakan animasi dengan mengikuti alur yang telah ditetapkan.

5. Dapat dikonveresni dan dipublikasikan ke dalam beberapa tipe, diantaranya adalah .swf, .html, .gif, .jpg, .png, .exe, .mov.

Untuk membuka program Macromedia Flash 8 Anda dapat melakukan cara berikut:

Pilih Start > Program > Macromedia > Flash 8 Atau

Pilih Ikon Flash 8 Pada dekstop ( Layar monitor ).

Gambar 2.1 Tampilan Awal Progarm Flash Pilih Create new > Flash Document untuk memulai membuat file baru. Pilih Open a Recent New > Open untuk membuka file flash.

Berikut merupakan tampilan standar jendela kerja Flash 8, saat Anda memulai memuat file baru.

Gambar 2.2 Jendela Kerja Flash

a. Menu bar yang berisi kumpulan menu atau perintah-perintah yang digunakan dalam flash 8.

b. Toolbar yang merupakan panel berbagai macam tool. Tool-tool tersebut dikelompokkan menjadi empat kelompok: Tools; berisi tombol-tombol untuk membuat dan mengedit gambar, View; untuk mengatur tampilan lembar kerja, Colors; menentukan warna yang dipakai saat mengedit; Option; alat bantu lain untuk mengedit gambar.

Table 2.1 Simol-simbol Toolbar

c. Timeline atau garis waktu merupakan komponen yang digunakan untuk mengatur atau mengontrol jalannya animasi.

d. Stage disebut juga layar atau panggung, dimana stage digunakan untuk memainkan objek yang akan diberi animasi.

e. Panel yang meruakan komponen penting dalam Flash 8 seperti Properties, Filters & Parameters, Action, Liberary, Color dan Align & Info & Transform.

f. Panel Properties yang akan berubah tampilan dan fungsinya mengikuti bagian mana yang sedang aktif.

g. Liberary mempunyai fungsi sebagai perpustakaan symbol/media yang digunakan dalam animasi yang sedang dibuat. (Bambang Adriyanto,2010)

2.4 Kandungan Vitamin Pada Buah

Vitamin adalah suatu zat senyawa yang kompleks yang sangat dibutuhkan oleh tubuh kita yang berfungsi untuk membantu pengaturn atau proses kegiatan tubuh. Tanpa vitamin manusia, hewan, dan mahluk hidup lainnya tidak dapat melakukan aktifitas hidup, dan kekurungan vitamin dapat menyebabkan mempebesar peluang terkena penyakit pada tubuh kita.

Vitamin (bahasa inggris: vital anime, vitamin) adalah sekelompok senyawa organic berbobot molekul kecil yang memiliki fungsi vital dalam metabolisme setiap organisme yang tidak dapat dihasilkan oleh tubuh. Buah adalah salah satu jenis makan yang memiliki kandungan gizi, vitamin dan mineral yang pada umumnya sangat baik untuk dikonsumsi setiap hari. Dibawah ini

adalah beberapa buah yang memiliki kandungan Vitamin yang dibutuhkan oleh tubuh.

1. Buah Tomat

Tomat mengandung vitamin A,B1, dan C dan Tomat dapat membantu membersihkan darah.

2. Buah Apel

Apel mengandung vitamin A, B, dan C, dan Apel dapat membantu menurunkan kadar kolestrol dalm darah.

3. Buah Belimbing

Belimbing mengandung vitmin C dan provitamin A dan Belimbing dapat membantu memperlancar pencernaan makanan.

4. Buah Jambu Merah

Jambu merah mengandung vitamin c dan provitamin A dan Belimbing dapat membantu memperlancar pencernaan makanan.

5. Buah jeruk

Jeruk mengandung Vitamin A, B1, B2, dan C dan jeruk mengandung anti kanker bagi tubuh.

6. Buah Mangga

Mangga mengandung vitamin A, E dan C dan mangga dapat bertindak sebagai disifektan dan dapat membersihkan darah.

7. Buah Melon

zat anti kanker dan antioksidan.

8. Buah Pepaya

Pepaya mengandung vitamin c dan provitamin A dan Pepaya dapat membantu memecah serat makanan dalam sistem pencernaan melancarkan saluran pencernaan makanan.

9. Buah Pir

Pir mengandung vitamin C dan provitamin A dan Pir mengandung antioksidan yang baik menjaga kesehatan.

10. Buah Pisang

Pisang mengandung Vitamin A,B1,B2, dan C dan Pisang dapat membantu mengurangi asam lambung dan menjaga keseimbangan air dalam tubuh. 11. Buah Semangka

Semangka mengandung vitamin c dan proviitamin A dan Semangka dapat menjadi anti alergi.

12. Buah Strawberry

Strawverry mengandung provitamin A, vitamin B1, B dan C dan Strawberry mengandung antioksidan untuk melawan zat radikal bebas. 13. Buah Wortel

Wortel kaya akan vitamin A dan Wortel baik untuk menjaga kesehatan mata. (www.rickyeka.com)

BAB 1 PENDAHULUAN

1.1 Latar Belakang

Buah-buahan adalah pemberian alam yang sangat berharga untuk kehidupan.Berbagai macam buah, dengan beragram nutrisi dan manfaatnya, memberikan banyak konstribusi bagi kesehatan tubuh. Aneka vitamin dan mineral yang terkandung dalam buah-buahan membuat kita tetap sehat, dengan cara alami, dan rasa yang nikmat.

Buah-buahan mengandung serat makanan yang melimpah, sehingga dapat memperlancar sistem pencernaan, menangkal kolestrol dan lemak dalam tubuh, sekaligus menyediakan energi. Buah-buahan sangat rendah kalori dan lemak. Buah-buahan menyediakan vitamin dan mineral esensial bagi tubuh, yang dapat meningkatkat kesehatan secara keseluruhan. Buah-buahan menyediakan antioksidan alami bagi tubuh, khususnya yang mengandung vitamin C, vitamin E, polifenol, selenium, zinc dan senyawa antioksidan lainnya. Buah-buahan bisa membantu mengatasi banyak masalah kesehatan, antara lain untuk menurunkan kolestrol, mencegah konstipasi (susah Buang Air Besar), mengontrol gula darah, menurunkan berat badan, hingga mencegah penuaan diri.

Berbagai penelitian dan para ahli gizi menyarankan untuk selalu memasukkan buah-buahan kedalam diet sehari-hari, untuk menyediakan nutrisi yang seimbang bagi tubuh. (Veronica 2012)

Berdasarkan permasalahan diatas maka penulis tertarik untuk membuat animasi di bidang pendidikan. Animasi yang penulis akan buat adalah yang berhubungan dengan buah-buahan. Dimana dalam kehidupan sehari-hari buah juga memegang peranan penting dalam kehidupan, yaitu untuk melengkapi kebutuhan vitamin yang dibutukan oleh tubuh. Vitamin yang terkandung pada buah memiliki nutrisi penting yang dibutuhan tubuh untuk tumbuh dan menjalankan fungsinya dengan baik.

Oleh karena itu, penulis mengajukan sebuah proposal yang berjudul

“ANIMASI KANDUNGAN VITAMIN PADA 13 BUAH

MENGGUNAKAN MACROMEDIA FLASH 8 ”.

1.2 Identifikasi Masalah

Masalah yang diangkat disini adalah bagaimana membuat animasi buah-buahan khususnya kandungan yang terdapat pada setiap buah yang akan muncul. Dimana animasi tersebut akan memudahkan siswa untuk menghataui kandungan vitamin pada buah dan dapat menghataui kebutuhan vitamin dalam tubuh serta mengetahui kandungan vitamin yang mereka konsumsi dengan cara yang lebih menarik.

1.3 Tujuan dan Manfaat

Tujuan perancangan animasi ini adalah :

Merancang Animasi kandungan vitamin pada buah menggunakan Macromedia Flash 8.

Manfaat yang diperoleh dalam pembuatan animasi ini adalah:

1. Mempermudah siswa untuk mengetahui kandungan vitamin pada buah

yang dikonsumsi.

2. Animasi ini juga dapat digunakan sebagai permainan yang mendidik dan menambah pengetahuan siswa.

3. Memberikan kesempatan bagi penulis untuk mengembangkan

kreativitas dalam dunia animasi di tengah perkembangan teknologi komputer saat ini.

1.4 Batasan Masalah

Agar pembahasan tidak menyimpang maka perlu dibuat suatu batasan masalah yaitu sebagai berikut:

1. Menampilkan animasi kandungan vitamin pada 13 buah dan manfaat pada

buah tersebut.

2. Pembuatan animasi ini menggunakan Macromedia Flash 8 .

1.5 Metodologi Penelitian

Penelitian ini akan dilaksanakan dengan mengikuti beberapa langkah yang akan dilakukan penulis, yaitu :

1. Melakukan tinjauan pustaka untuk mendapatkan informasi berupa data, tulisan, keterangan melalui buku atau sumber informasi lainnya yang mendukung landasan teori dalam tugas akhir ini.

2. Mencari informasi terkini melalui internet sehingga data yang di dapat tidak ketinggalan dan mengikuti perkembangan.

3. Melakukan observasi kepada narasumber yang mengerti tentang animasi dan kandungan vitamin pada buah.

4. Merancang animasi pembelajaran kandungan vitamin pada buah untuk sekolah dasar.

a. Merancang Animasi menggunakan Macromedia Flash 8

b. Merancang Cerita Animasi yang akan dituangkan

c. Pembuatan Ilustrasi

d. Pembuatan Model Animasi

e. Model yang dianimasikan

1.6 Sistematika Penulisan

Sistematika penulisan Tugas Akhir ini disajikan kedalam bentuk terstruktur dan sistematik sehingga mempermudah pembaca untuk memahami isi Tugas Akhir.

Adapun sistematika Tugas Akhir ini sebagai berikut :

BAB 1 : PENDAHULUAN

Pada bab ini diuraikan secara ringkas pembahasan tentang Latar Belakang, Indentifikasi Masalah, Tujuan dan Manfaat, Batasan Masalah, Metode Penelitian dan Sistematika penulisan.

Bab ini menjelaskan landasan teori singkat tentang hal-hal yang berhubungan dengan judul yaiutu teori yang berhubungan dengan Macro media flash 8 dan kandungan vitamin pada buah.

BAB 3 : PERANCANGAN SISTEM

Bab ini menguraikan analisis sistem dan

perancangan dari animasi kandungan vitamin pada buah yang akan dibangun.

BAB 4 : IMPLEMENTASI

Bab menguraikan hasil tampilan dari animasi yang

dirancang dan pembahasan hasilnya beserta

kekurangan dan kelebihan sistem yang dibuat.

BAB 5 : KESIMPULAN DAN SARAN

Bab ini merupakan bab terakhir yang mencakup kesimpulan dan saran dari hasil penelitian yang penulis peroleh.

ANIMASI KANDUNGAN VITAMIN PADA 13 BUAH MENGGUNAKAN MACROMEDIA FLASH 8

ABSTRAK

Pentingnya mempelajari dan memahami tentang fungsi dan manfaat kandungan vitamin yang terdapat di dalam buah-buahan membuat siswa sekolah dasar (SD) harus mengerti dan mengetahui pelajaran tersebut namun banyak siswa enggan mempelajari nya, mereka lebih senang bermain atau menggangu temannya belajar daripada mengikuti pelajaran tersebut. Untuk mengatasi masalah ini, digunakanlah suatu aplikasi pembelajaran komputer yang menarik dan interaktif. Aplikasi pembelajaran komputer tersebut dikembangkan dengan menggunakan perangkat lunak Macromedia Flash 8. Dengan animasi yang dihasilkan dari metode Motion Tween, Frame by Frame dan ActionScript akan membuat tampilan aplikasi ini menjadi lebih menarik. Dengan demikian, diharapkan agar para siswa sekolah dasar tidak akan merasa enggan ataupun malas lagi dalam mempelajari kandungan vitamin dalam buah.

ANIMASI KANDUGAN VITAMIN PADA 13 BUAH MENGGUNAKAN MACROMEDIA FLASH 8

TUGAS AKHIR

ANDREAS GINTING 132406193

PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUAMTERA UTARA

MEDAN 2016

TUGAS AKHIR

ANIMASI KANDUNGAN VITAMIN PADA 13 BUAH MENGGUNAKAN MACROMEDIA FLASH 8

Diajukan sebagai salah satu syarat dalam menyelesaikan Pendidikan Program Studi Diploma III Teknik Informatika

ANDREAS GINTING 132406193

PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 2016

PERNYATAAN

ANIMASI KANDUNGAN VITAMIN PADA 13 BUAH

MENGGUNAKAN MACROMEDIA FLASH 8

TUGAS AKHIR

Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing – masing disebut sumbernya.

Medan, Juni 2016

Andreas Ginting 132406193

PENGHARGAAN

Puji dan syukur penulis panjatkan kepada Tuhan Yang Maha Esa yang telah memberikan rahmat dan karunia-Nya sehingga penulis dapat menyelesaikan penyusunan tugas akhir ini dengan baik dalam waktu yang telah ditetapkan.

Tugas akhir ini dibuat sebagai salah satu syarat yang harus dipenuhi untuk menyelesaikan pendidikan D3 pada Program Studi Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.

Dalam menyelesaikan tugas akhir ini, penulis banyak mengalami kesulitan namun berkat bimbingan, dorongan, dan bantuan dari rekan-rekan mahasiswa-mahasiswi Program Studi Teknik Informatika FMIPA USU, dosen, dan semua pihak yang terkait dalam penyelesaian kajian tugas akhir ini, hal tersebut dapat penulis atasi dengan baik.

Selama pengerjaan kajian tugas akhir ini hingga selesai penulis banyak mendapatkan bantuan, dorongan, dan motivasi baik secara langsung maupun tidak langsung. Maka pada kesempatan ini, penulis banyak mengucapkn terima kasih kepada :

1. Ibu Dr. Mardiningsih, M.Si, selaku Dosen Pembimbing yang telah banyak memberikan bimbingan kepada penulis selama penulisan tugas akhir ini.

2. Orang Tua yang selalu mendoakan dan memberikan dukungan, baik dari segi

materi maupun non materi.

3. Bapak Dr. Sutarman, M.Sc, selaku Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.

4. Ibu Dr. Elly Rosmaini, M.Si selaku Ketua Program Studi D3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.

5. Dewi Indah Cahaya, Angela Bulan A Siagian, Linawati Br Sitorus , dan Rinanda Manurung, selaku rekan Tugas Akhir sekaligus sahabat yang selalu memberikan kerja sama dan dukungannya.

6. Abdul Mahmud, Reza Alkafi dan Teman-teman kos lainnya yang sangat membantu dalam penyusunan tugas akhir ini.

7. Teman-teman D3 TI 2013, KOM D 2013 serta rekan-rekan lainnya yang telah memberikan bantuan, doa dan dukungan selama proses penyelesaian tugas akhir ini.

Penulis menyadari bahwa dalam penyusunan tugas akhir ini masih banyak terdapat kekurangan dan kesalahan, maka dari itu penulis mengharapkan kritik dan saran yang dapat membangun. Akhir kata, saya berharap semoga tugas akhir ini dapat memberi manfaat dan wawasan maupun pengetahuan kita.

Medan, Juni 2016 Penulis,

Andreas Ginting NIM : 132406193

ANIMASI KANDUNGAN VITAMIN PADA 13 BUAH MENGGUNAKAN MACROMEDIA FLASH 8

ABSTRAK

Pentingnya mempelajari dan memahami tentang fungsi dan manfaat kandungan vitamin yang terdapat di dalam buah-buahan membuat siswa sekolah dasar (SD) harus mengerti dan mengetahui pelajaran tersebut namun banyak siswa enggan mempelajari nya, mereka lebih senang bermain atau menggangu temannya belajar daripada mengikuti pelajaran tersebut. Untuk mengatasi masalah ini, digunakanlah suatu aplikasi pembelajaran komputer yang menarik dan interaktif. Aplikasi pembelajaran komputer tersebut dikembangkan dengan menggunakan perangkat lunak Macromedia Flash 8. Dengan animasi yang dihasilkan dari metode Motion Tween, Frame by Frame dan ActionScript akan membuat tampilan aplikasi ini menjadi lebih menarik. Dengan demikian, diharapkan agar para siswa sekolah dasar tidak akan merasa enggan ataupun malas lagi dalam mempelajari kandungan vitamin dalam buah.

DAFTAR ISI

Halaman

Persetujuan i

Pernyataan ii

Penghargaan iii

Abstrak v

Daftar Isi vi

Daftar Tabel viii

Daftar Gambar ix

Bab 1.Pendahuluan

1.1 Latar Belakang 1

1.2 Rumusan Masalah 2

1.3 Batasan Masalah 2

1.4 Tujuan dan Manfaat 3

1.5 Metodologi penelitian 3

1.6 Sistematika Penulisan 4

Bab 2. Landasan Teori

2.1 Animasi 6

2.2 Animasi Sebagai Media Pembelajaran 7

2.3 Flash 8

2.3.1 Sekilas Tentang Flash 8

2.3.2 Macromedia Flash 8 10

2.4 Kandungan Vitamin Pada Buah 14

Bab 3. Perancangan Animasi

3.1 Perancangan Animasi 17

3.2 Flowchart 17

3.3 Mendesain Tampilan Awal Animasi Pembelajaran 20

3.4 Mendesain Halaman Start 21

3.5 Mendesain Isi Menu 23

3.6 Mendesain Isi Profil 44

3.7 Mendesain Isi Latihan 45

Bab 4. Implementasi Sistem

4.1 Hasil 47

4.1.1 Tampilan Halaman Pembuka 47

4.1.2 Tampilan Halaman Start 48

4.1.3 Tampilan Isi Menu 49

4.1.4 Tampilan Penjelasan Buah 50

4.1.5 Tampilan Isi Profil 51

4.1.7 Tampilan Isi Latihan 53

4.1.8 Tampilan Hitung Mundur 54

4.1.9 Tampilan Nilai 55

Bab 5. Kesimpulan dan Saran

5.1 Kesimpulan 56

5.2 Saran 57

Daftar Pustaka Lampiran

DAFTAR TABEL

Nomor Judul Halaman

Tabel

2.1 Simbol-Simbol Toolbar 13

DAFTAR GAMBAR

Nomor Judul Halaman

Gambar

2.1 Tampilan Awal Program Flash 11

2.2 Jendela Kerja Flash 12

3.1 Flowchart Animasi 19

3.2 Rancangan Tampilan Awal Animasi 20

3.3. Rancangan Tampilan Awal Start 21

3.4 Rancangan Tampilan Isi Menu 23

3.5 Rancangan Tampilan Animasi Buah Jeruk 24

3.6 Rancangan Tampilan Animasi Buah Tomat 26

3.7 Rancangan Tampilan Animasi Buah Pisang 27

3.8 Rancangan Tampilan Animasi Buah Pir 29

3.9 Rancangan Tampilan Animasi Buah Jambu Merah 30

3.10 Rancangan Tampilan Animasi Buah Starwberry 32

3.11 Rancangan Tampilan Animasi Buah Belimbing 33

3.12 Rancangan Tampilan Animasi Buah Pepaya 35

3.13 Rancangan Tampilan Animasi Buah Mangga 36

3.14 Rancangan Tampilan Animasi Buah Apel 38

3.15 Rancangan Tampilan Animasi Buah Melon 39

3.16 Rancangan Tampilan Animasi Buah Semangka 41

3.18 Rancangan Tampilan Isi Profil 44

3.19 Rancangan Tampilan Isi Memulai Soal Latihan 45

4.1 Tampilan Pembuka 47

4.2 Tampilan Start 48

4.3 Tampilan Isi Menu 49

4.4 Tampilan Penjelasan Buah 50

4.5 Tampilan Isi Profil 51

4.6 Tampilan Isi Latihan 52

4.7 Tampilan Soal Latihan 53

4.8 Tampilan Hitung Mundur 54

ANIMASI KANDUNGAN VITAMIN PADA 13 BUAH MENGGUNAKAN MACROMEDIA FLASH 8

ABSTRAK

Pentingnya mempelajari dan memahami tentang fungsi dan manfaat kandungan

vitamin yang terdapat di dalam buah-buahan membuat siswa sekolah dasar (SD)

harus mengerti dan mengetahui pelajaran tersebut namun banyak siswa enggan

mempelajari nya, mereka lebih senang bermain atau menggangu temannya belajar

daripada mengikuti pelajaran tersebut. Untuk mengatasi masalah ini,

digunakanlah suatu aplikasi pembelajaran komputer yang menarik dan interaktif.

Aplikasi pembelajaran komputer tersebut dikembangkan dengan menggunakan

perangkat lunak Macromedia Flash 8. Dengan animasi yang dihasilkan dari

metode Motion Tween, Frame by Frame dan ActionScript akan membuat tampilan

aplikasi ini menjadi lebih menarik. Dengan demikian, diharapkan agar para siswa

sekolah dasar tidak akan merasa enggan ataupun malas lagi dalam mempelajari

DAFTAR ISI

Halaman

Persetujuan i

Pernyataan ii

Penghargaan iii

Abstrak v

Daftar Isi vi

Daftar Tabel viii

Daftar Gambar ix

Bab 1.Pendahuluan

1.1 Latar Belakang 1

1.2 Rumusan Masalah 2

1.3 Batasan Masalah 2

1.4 Tujuan dan Manfaat 3

1.5 Metodologi penelitian 3

1.6 Sistematika Penulisan 4

Bab 2. Landasan Teori

2.1 Animasi 6

2.2 Animasi Sebagai Media Pembelajaran 7

2.3 Flash 8

2.3.1 Sekilas Tentang Flash 8

2.3.2 Macromedia Flash 8 10

2.4 Kandungan Vitamin Pada Buah 14

Bab 3. Perancangan Animasi

3.1 Perancangan Animasi 17

3.2 Flowchart 17

3.3 Mendesain Tampilan Awal Animasi Pembelajaran 20

3.4 Mendesain Halaman Start 21

3.5 Mendesain Isi Menu 23

3.6 Mendesain Isi Profil 44

3.7 Mendesain Isi Latihan 45

Bab 4. Implementasi Sistem

4.1 Hasil 47

4.1.1 Tampilan Halaman Pembuka 47

4.1.2 Tampilan Halaman Start 48

4.1.3 Tampilan Isi Menu 49

4.1.4 Tampilan Penjelasan Buah 50

4.1.7 Tampilan Isi Latihan 53

4.1.8 Tampilan Hitung Mundur 54

4.1.9 Tampilan Nilai 55

Bab 5. Kesimpulan dan Saran

5.1 Kesimpulan 56

5.2 Saran 57

Daftar Pustaka Lampiran

DAFTAR TABEL

Nomor Judul Halaman

Tabel

2.1 Simbol-Simbol Toolbar 13

DAFTAR GAMBAR

Nomor Judul Halaman

Gambar

2.1 Tampilan Awal Program Flash 11

2.2 Jendela Kerja Flash 12

3.1 Flowchart Animasi 19

3.2 Rancangan Tampilan Awal Animasi 20

3.3. Rancangan Tampilan Awal Start 21

3.4 Rancangan Tampilan Isi Menu 23

3.5 Rancangan Tampilan Animasi Buah Jeruk 24

3.6 Rancangan Tampilan Animasi Buah Tomat 26

3.7 Rancangan Tampilan Animasi Buah Pisang 27

3.8 Rancangan Tampilan Animasi Buah Pir 29

3.9 Rancangan Tampilan Animasi Buah Jambu Merah 30

3.10 Rancangan Tampilan Animasi Buah Starwberry 32

3.11 Rancangan Tampilan Animasi Buah Belimbing 33

3.12 Rancangan Tampilan Animasi Buah Pepaya 35

3.13 Rancangan Tampilan Animasi Buah Mangga 36

3.14 Rancangan Tampilan Animasi Buah Apel 38

3.15 Rancangan Tampilan Animasi Buah Melon 39

3.16 Rancangan Tampilan Animasi Buah Semangka 41

3.18 Rancangan Tampilan Isi Profil 44

3.19 Rancangan Tampilan Isi Memulai Soal Latihan 45

4.1 Tampilan Pembuka 47

4.2 Tampilan Start 48

4.3 Tampilan Isi Menu 49

4.4 Tampilan Penjelasan Buah 50

4.5 Tampilan Isi Profil 51

4.6 Tampilan Isi Latihan 52

4.7 Tampilan Soal Latihan 53

4.8 Tampilan Hitung Mundur 54