Laporan Proyek Akhir ANIMASI DONGENG INTERAKTIF DAN MEDIA PEMBELAJARAN MENGENAL BINATANG BERBASIS FLASH UNTUK BA AISYIYAH.

(1)

Laporan Proyek Akhir

ANIMASI DONGENG INTERAKTIF DAN MEDIA PEMBELAJARAN MENGENAL BINATANG BERBASIS FLASH UNTUK BA AISYIYAH

Disusun oleh:

Nama : Tri Joko Santoso

NIM : 16.3.00041

Program Studi : Teknik Informatika

Jenjang Pendidikan : Diploma III

SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER SINAR NUSANTARA SURAKARTA

(2)

LAPORAN PROYEK AKHIR

Laporan ini disusun guna memenuhi salah satu syarat untuk menyelesaikan jenjang pendidikan Diploma III

Pada

STMIK Sinar Nusantara Surakarta

Disusun oleh:

Nama : Tri Joko Santoso

NIM : 16.3.00041

Program Studi : Teknik Informatika Jenjang Pendidikan : Diploma III

SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER SINAR NUSANTARA SURAKARTA

(3)

(4)

(5)

(6)

RINGKASAN

Laporan Proyek Akhir dengan judul “Animasi Dongeng Interaktif Dan Media Pembelajaran Mengenal Binatang Berbasis Flash Untuk BA Aisyiyah” ini berisi dongeng “Singa dan Tikus” yang interaktif, serta berisi materi pengenalan jenis-jenis binatang yaitu binatang buas, binatang peliharaan, binatang serangga, dan binatang qurban. Tujuan Proyek Akhir ini adalah menciptakan aplikasi dongeng yang interaktif dan media pembelajaran mengenal binatang untuk BA Aisyiyah Kranggan.

Dongeng “Singa dan Tikus” dibuat interaktif yang mana alur cerita tergantung apa yang dipilih oleh pengguna ketika ada pertanyaan dengan jawaban yang optional di dalam dongeng. Pengenalan binatang merupakan salah satu tema di BA Aisyiyah yang mempelajari berbagai jenis binatang dan memiliki sub materi deskripsi binatang, makanan binatang, tempat hidup binatang, dan cara bergerak binatang.

Metode pengumpulan data yang digunakan meliputi metode wawancara dan studi pustaka. Dengan metode wawancara, data yang diperoleh adalah hasil tanya jawab dan bertatap muka langsung kepada pihak yang bersangkutan, yaitu guru dan kepala sekolah BA Aisyiyah Kranggan Polanharjo. Dengan metode studi pustaka, pengumpulan data dengan cara mengambil data dari buku-buku atau literature sebagai referensi yang berkaitan dengan masalah yang dibahas.

Hasil dari proyek akhir ini berupa Aplikasi Animasi Dongeng Interaktif Dan Media Pembelajaran Mengenal Binatang Berbasis Flash Untuk BA Aisyiyah yang disertai latihan soal, menjodohkan gambar, dan video bernyanyi yang dapat digunakan sebagai alat bantu pengajar dalam pembelajaran ataupun digunakan secara mandiri oleh pengguna.

(7)

SUMMARY

Final Project Report entitled “Animasi Dongeng Interaktif dan Media Pembelajaran Mengenal Binatang Berbasis Flash untuk BA Aisyiyah” contains a fairy tale “Singa dan Tikus” interactive, as well as containing material the introduction of animals type, that is wild beasts, pets, animals insects, and animals sacrifices. The purpose of this Final Project is to create an interactive fairy tale and learning app introduction of animals for BA Aisyiyah Kranggan.

The fairy tale “Singa dan Tikus” made interactive where the storyline depending on what is selected by the user when there is a question with answer choices in a fairy tale. The introduction of animals is one of the themes in the BA Aisyiyah learn about the different types of animals and has sub-material description of animals, food of animals, habitat of animals, and how to move animals.

Data collection methods used include interviews and literature study method. With the interview method, the data obtained are the results of the debriefing and face to face directly to the parties concerned, namely the teachers and head of school at BA Aisyiyah Kranggan Polanharjo. With the method of literature study, collection of data by taking data from books or literature as a reference related to the issues discussed.

The result of this final project is an aplication namely “Animasi Dongeng Interaktif dan Media Pembelajaran Mengenal Binatang Berbasis Flash untuk BA Aisyiyah” accompanied by exercises, match pictures, and videos of singing that can be used as a tool to help teachers in learning or used independently by the user.

(8)

MOTTO

 Sapa nandur bakal ngunduh

 Setiap manusia akan selalu diuji ketika masih hidup

 Allah tidak menjanjikan kemudahan dalam hidup, tapi Allah menjanjikan disetiap kesulitan pasti ada kemudahan

 Ketika kita menaruh semua harapan hanya pada Allah, insyaAllah semua jadi terasa ringan dan tak akan mengecewakan

 Jangan berikan cinta mu sebelum halal  Lakukan semua aktivitas karena Allah  Patah hati boleh, tapi jangan patah semangat

(9)

PERSEMBAHAN

Laporan Proyek Akhir ini dipersembahkan untuk:  Allah SWT yang senantiasa memberi rahmat pada hamba-Nya  Orang tua yang selalu memberi semangat dan doa

 Jodoh yang belum dipersatukan

 Saudara yang selalu menolong setiap ada kesulitan

 Bapak Paulus Harsadi S.Kom., M.Kom. selaku pembimbing yang membantu dalam pembuatan proyek akhir

 Para dosen dan pembimbing yang telah mengajarkan ilmu dan pengetahuannya kepada semua mahasiswa

 Para guru BA Aisyiyah Kranggan yang telah memberikan bimbingan  Terima kasih kepada sahabat karib: Choirul Hafidz, Ahmad Volly, Budi

Raharjo, serta teman-teman TI D3 2016 yang luar biasa. Terima kasih atas

(10)

ix

KATA PENGANTAR

Segala puji hanya milik Allah SWT, yang telah memberikan rahmat,

karunia, dan hidayah-Nya sehingga pelaksana proyek akhir dapat menyelesaikan

Laporan Proyek Akhir ini dengan judul “Animasi Dongeng Interaktif Dan Media Pembelajaran Mengenal Binatang Berbasis Flash Untuk BA Aisyiyah”.

Laporan Proyek Akhir ini merupakan salah satu syarat memperoleh gelar

Ahli Madya Komputer pada jurusan Teknik Informatika di STMIK Sinar

Nusantara Surakarta. Penyusun mengucapkan terima kasih kepada:

1. Allah SWT atas segala rahmat dan hidayah-Nya

2. Orang tua yang telah memberikan semangat dan doa disetiap waktu

3. Ibu Kumaratih Sandradewi, S.P., M.Kom. selaku Ketua STMIK Sinar

Nusantara Surakarta

4. Bapak Sri Tomo, S.T., M.Kom. selaku Pembimbing Akademis

5. Bapak Paulus Harsadi, S.Kom, M.Kom. selaku Pembimbing Proyek Akhir

6. Ibu Dwi Remawati, M.Kom. selaku Ketua Program Studi Teknik Informatika

Penyusun menyadari bahwa Laporan Proyek Akhir ini masih jauh dari kata

sempurna, oleh karena itu kritik dan saran yang membangun akan selalu penyusun

terima dengan senang hati. Penyusun berharap semoga Laporan Proyek Akhir ini

bermanfaat bagi pembaca.

Surakarta, 15 Agustus 2019

(11)

x DAFTAR ISI

SURAT PERNYATAAN ... iii

PERSETUJUAN LAPORAN PROYEK AKHIR ... iv

RINGKASAN ... v SUMMARY ... vi MOTTO ... vii PERSEMBAHAN ... viii KATA PENGANTAR ... ix DAFTAR ISI ... x DAFTAR TABEL ... xv

DAFTAR GAMBAR ... xvi

BAB I ... 1

PENDAHULUAN ... 1

1.1. Latar Belakang Masalah ... 1

1.2. Perumusan Masalah ... 2

1.3. Pembatasan Masalah ... 2

1.4. Tujuan Proyek Akhir ... 3

1.5. Manfaat Proyek Akhir ... 3

1.6. Metode Pengerjaan ... 4

(12)

xi BAB II ... 9 LANDASAN TEORI ... 9 2.1. Animasi ... 9 2.2. Media Pembelajaran ... 9 2.3. Multimedia ... 12 2.4. Adobe Flash CS3 ... 13 2.5. Adobe Photoshop ... 17 2.6. Audacity ... 17

2.7. Sony Vegas Pro 2013 ... 18

2.8. Adobe Illustrator ... 18

2.9. Kurikulum 2013 TK/PAUD ... 20

2.10. Jenis – jenis Binatang ... 21

BAB III ... 24

TINJAUAN UMUM ... 24

3.1. Instansi TK/BA Aisyiyah Kranggan ... 24

3.1.1. Sejarah Instansi TK/BA Aisyiyah Kranggan ... 24

3.1.2. Visi dan Misi TK/BA Aisyiyah Kranggan ... 25

3.1.3. Tujuan ... 26

3.1.4. Struktur Organisasi BA Aisyiyah Kranggan ... 27

3.2. Silabus Pembelajaran Pengenalan Binatang ... 27

(13)

xii

3.4. Wawasan Umum Tentang Binatang ... 33

BAB IV ... 37

HASIL DAN ANALISIS DATA ... 37

4.1. Perancangan Konsep ... 37

4.2. Persiapan Pembuatan ... 37

4.2.1. Tahap Pra Produksi ... 38

4.2.2. Pembuatan Strory Board ... 38

4.2.3. Navigasi ... 42

4.2.4. Pembuatan Flowchart ... 43

4.3. Perancangan Desain... 51

4.3.1. Desain Menu Pembuka ... 52

4.3.2. Desain Menu Utama ... 52

4.3.3. Desain Menu Credit ... 53

4.3.4. Desain Menu Bantuan ... 53

4.3.5. Desain Menu About ... 54

4.3.6. Desain Menu Kompetensi ... 55

4.3.7. Desain Menu Materi ... 55

4.3.8. Desain Menu Materi Macam – Macam Binatang ... 56

4.3.9. Desain Menu Materi Deskripsi Binatang ... 57

4.3.10. Desain Menu Materi Makanan Binatang ... 57

(14)

xiii

4.3.12. Desain Menu Materi Gerakan Binatang ... 59

4.3.13. Desain Menu Video ... 59

4.3.14. Desain Menu Dongeng ... 60

4.3.15. Desain Menu Mari Bernyayi ... 61

4.3.16. Desain Menu Kuis ... 61

4.3.17. Desain Menu Menyusun Gambar... 62

4.3.18. Desain Menu Pilihan Ganda ... 63

4.4. Tahap Proses Pembuatan ... 65

4.4.1. Pembuatan Animasi ... 65

4.4.2. Pembuatan Button ... 73

4.4.3. Menghilangkan Background Gambar ... 74

4.4.4. Membuat Suara Narasi ... 75

4.4.5. Input Suara ... 76

4.4.6. Mengedit Video ... 77

4.4.7. Input Video ... 79

4.5. Implementasi Media Pembelajaran ... 80

4.5.1. Tampilan Menu Pembuka ... 80

4.5.2. Tampilan Menu Utama ... 81

4.5.3. Tampilan Menu Bantuan ... 82

4.5.4. Tampilan Menu About ... 83

(15)

xiv

4.5.6. Tampilan Menu Credit ... 86

4.5.7. Tampilan Menu Materi ... 87

4.5.8. Tampilan Menu Materi Macam – Macam Binatang ... 88

4.5.9. Tampilan Menu Materi Deskripsi Binatang ... 89

4.5.10. Tampilan Menu Materi Makanan Binatang ... 90

4.5.11. Tampilan Menu Materi Tempat Hidup Binatang ... 91

4.5.12. Tampilan Menu Materi Gerakan Binatang ... 92

4.5.13. Tampilan Menu Video ... 93

4.5.14. Tampilan Menu Dongeng ... 94

4.5.15. Tampilan Menu Mari Bernyanyi ... 94

4.5.16. Tampilan Menu Kuis ... 95

4.5.17. Tampilan Menu Menyusun Gambar ... 96

4.5.18. Tampilan Menu Pilihan Ganda ... 98

4.6. Pengujian Sistem ... 101

4.6.1. Pengujian Black Box ... 102

4.6.2. Pengujian Kuesioner ... 105 BAB V ... 111 PENUTUP ... 111 5.1. KESIMPULAN ... 112 5.2. SARAN ... 113 DAFTAR PUSTAKA ... 114

(16)

xv

DAFTAR TABEL

Tabel 3.1 Silabus Pembelajaran Binatang ... 28

Tabel 3.2 RPPH ... 32

Tabel 4.1 Story Board Aplikasi ... 38

Tabel 4.2 Pengujian Black Box ... 101

Tabel 4.3 Skor Jawaban Kuesioner ... 105

Tabel 4.4 Daftar Pertanyaan Kuesioner ... 106

(17)

xvi

DAFTAR GAMBAR

Gambar 2.1 Area kerja Adobe Flash CS3 ... 14

Gambar 3.1 Peta Lokasi BA Aisyiyah ... 25

Gambar 3.2 Struktur Organisasi ... 27

Gambar 4.1 Peta Navigasi ... 42

Gambar 4.2 Diagram Flowchart Menu Utama ... 43

Gambar 4.3 Diagram Flowchart Menu Materi ... 44

Gambar 4.4 Diagram Flowchart Menu Materi Binatang Qurban ... 45

Gambar 4.5 Diagram Flowchart Menu Materi Binatang Kambing ... 46

Gambar 4.6 Diagram Flowchart Menu Video ... 47

Gambar 4.7 Diagram Flowchart Menu Kuis ... 48

Gambar 4.8 Diagram Flowchart Menu About ... 49

Gambar 4.9 Diagram Flowchart Menu Kompetensi ... 50

Gambar 4.10 Diagram Flowchart Menu Credit ... 50

Gambar 4.11 Diagram Flowchart Menu Bantuan... 51

Gambar 4.12 Layout Menu Pembuka... 52

Gambar 4.13 Layout Menu Utama ... 53

Gambar 4.14 Layout Menu Credit ... 53

Gambar 4.15 Layout Menu Bantuan ... 54

(18)

xvii

Gambar 4.17 Layout Menu Kompetensi ... 55

Gambar 4.18 Layout Menu Materi ... 56

Gambar 4.19 Layout Menu Materi Macam-Macam Binatang ... 56

Gambar 4.20 Layout Materi Deskripsi Binatang ... 57

Gambar 4.21 Layout Materi Makanan Binatang ... 58

Gambar 4.22 Layout Materi Tempat Hidup Binatang ... 58

Gambar 4.23 Layout Materi Gerakan Binatang ... 59

Gambar 4.24 Layout Menu Video ... 60

Gambar 4.25 Layout Menu Dongeng ... 60

Gambar 4.26 Layout Menu Mari Bernyanyi ... 61

Gambar 4.27 Layout Menu Kuis ... 62

Gambar 4.28 Layout Menu Menyusun Gambar ... 62

Gambar 4.29 Layout Tampilan Awal Menyusun Gambar ... 63

Gambar 4.30 Layout Hasil Menyusun Gambar... 63

Gambar 4.31 Layout Tampilan Awal Pilihan Ganda ... 64

Gambar 4.32 Layout Tampilan Isi Pilihan Ganda ... 64

Gambar 4.33 Layout Tampilan Hasil Pilihan Ganda ... 64

Gambar 4.34 Lembar Kerja Baru ActionScript 2.0 ... 66

Gambar 4.35 Membuat Tombol Jenis Binatang ... 66

Gambar 4.36 ActionScript 2.0 ... 67

(19)

xviii

Gambar 4.38 Insert Keyframe ... 68

Gambar 4.39 Membuat 5 Keyframe ... 69

Gambar 4.40 Membuat Teks di Luar Stage ... 69

Gambar 4.41 Menggeser Teks ... 70

Gambar 4.42 Membuat MotionTween... 70

Gambar 4.43 Membuat Layer ... 71

Gambar 4.44 Membuat Teks ... 71

Gambar 4.45 Membuat Objek Kotak ... 71

Gambar 4.46 Membuat Movie clip... 72

Gambar 4.47 TimelineMovie Clip Kepala Sapi... 73

Gambar 4.48 MotionTween dalam Movie clip ... 73

Gambar 4.49 Membuat Button ... 74

Gambar 4.50 Membuka Software Adobe Photoshop ... 74

Gambar 4.51 Magic WandTool ... 75

Gambar 4.52 Membuka Audacity ... 75

Gambar 4.53 Export as WAV ... 76

Gambar 4.54 Importto Library ... 77

Gambar 4.55 Membuka Sony Vegas Pro ... 77

Gambar 4.56 Mengganti Backsound ... 78

Gambar 4.57 RenderVideo ... 78

(20)

xix

Gambar 4.59 Stream from Flash Video Streaming Service ... 79

Gambar 4.60 Pilih Skin ... 80

Gambar 4.61 Tampilan Menu Pembuka ... 80

Gambar 4.62 Tampilan Menu Utama... 81

Gambar 4.63 Tampilan Menu Bantuan ... 82

Gambar 4.64 Tampilan Menu About ... 83

Gambar 4.65 Tampilan About Navigasi ... 84

Gambar 4.66 Tampilan About RPP ... 84

Gambar 4.67 Tampilan About Biodata ... 85

Gambar 4.68 Tampilan About Tentang Aplikasi ... 85

Gambar 4.69 Tampilan Kompetensi Dasar ... 86

Gambar 4.70 Tampilan Menu Credit ... 87

Gambar 4.71 Tampilan Menu Materi... 87

Gambar 4.72 Tampilan Menu Materi Macam-Macam Binatang ... 88

Gambar 4.73 Tampilan Materi Deskripsi Binatang ... 89

Gambar 4.74 Tampilan Materi Makanan Binatang... 90

Gambar 4.75 Tampilan Materi Tempat Hidup Binatang ... 91

Gambar 4.76 Tampilan Materi Gerakan Binatang ... 92

Gambar 4.77 Tampilan Menu Video ... 93

Gambar 4.78 Tampilan Menu Dongeng... 94

(21)

xx

Gambar 4.80 Tampilan Menu Kuis ... 96

Gambar 4.81 Tampilan Menu Menyusun Gambar ... 97

Gambar 4.82 Tampilan Awal Menyusun Gambar ... 97

Gambar 4.83 Tampilan Hasil Menyusun Gambar ... 98

Gambar 4.84 Tampilan Awal Pilihan Ganda ... 99

Gambar 4.85 Tampilan Isi Pilihan Ganda ... 99

Gambar 4.86 Jawaban Benar... 100

Gambar 4.87 Jawaban Salah ... 100

(22)

80

Gambar 4.60 Pilih Skin

5. Jalankan videonya dengan tombol Shortcut Ctrl+Enter.

4.5. Implementasi Media Pembelajaran 4.5.1. Tampilan Menu Pembuka

Menu pembuka ini dimaksudkan bahwa tampilan pertama

kali ketika masuk ke dalam aplikasi. Ada animasi pembuka yang

diikuti teks dan tombol masuk untuk mulai menjalankan aplikasi.

Berikut tampilan menu pembuka:

Gambar 4.61 Tampilan Menu Pembuka

Keterangan:

(23)

81

4.5.2. Tampilan Menu Utama

Pada tampilan menu utama berisi tombol menu materi, video,

kuis, profil, kompetensi, bantuan, suara (backsound), dan keluar.

Ada animasi burung bergerak dari kiri ke kanan, dan tombol yang

bergerak. Berikut tampilan menu utama:

Gambar 4.62 Tampilan Menu Utama

Keterangan:

 Tombol Materi : Masuk ke Menu Materi  Tombol Video : Masuk ke Menu Video  Tombol Kuis : Masuk ke Menu Kuis  Tombol About : Masuk ke Menu About  Tombol Credit : Masuk ke Halaman Credit  Tombol Kompetensi : Masuk ke Menu Kompetensi  Tombol Bantuan : Masuk ke Menu Bantuan

 Tombol Suara : Untuk mengaktifkan atau menonaktifkan suara latar belakang (backsound)

(24)

82

4.5.3. Tampilan Menu Bantuan

Pada menu bantuan berisi petunjuk cara menggunakan

aplikasi yang menjelaskan kegunaan dari berbagai tombol yang ada

pada aplikasi dan di dalamnya terdapat tombol menu utama serta

tombol suara (backsound). Berikut tampilan menu bantuan:

Gambar 4.63 Tampilan Menu Bantuan

Keterangan:

 Tombol Menu : Menuju ke Menu Utama

 Tombol Bantuan 1 : Menampilkan penjelasan tombol bantuan 1  Tombol Bantuan 2 : Menampilkan penjelasan tombol bantuan 2  Tombol Bantuan 3 : Menampilkan penjelasan tombol bantuan 3  Tombol Bantuan 4 : Menampilkan penjelasan tombol bantuan 4  Tombol Bantuan 5 : Menampilkan penjelasan tombol bantuan 5  Tombol Bantuan 6 : Menampilkan penjelasan tombol bantuan 6

(25)

83

4.5.4. Tampilan Menu About

Pada menu about terdapat navigasi, RPP, biodata pembuat

aplikasi dan penjelasan tentang aplikasi. Pada menu ini terdapat

tombol menu utama, suara (backsound), navigasi, RPP, biodata, dan

tentang. Berikut tampilan menu about:

Gambar 4.64 Tampilan Menu About

Keterangan:

Halaman awal menu about menampilkan logo STMIK Sinar

Nusantara. Adapun beberapa tombol, yaitu:

 Tombol Menu : Menuju ke menu utama  Tombol Navigasi : Menampilkan navigasi  Tombol RPP : Menampilkan RPP

 Tombol Lanjut : Menuju ke halaman selanjutnya  Tombol Sebelumnya : Menuju ke halaman sebelumnya  Tombol Biodata : Menampilkan biodata pembuat

 Tombol Tentang : Menampilkan penjelasan tentang aplikasi  Tombol Suara : Untuk mengaktifkan atau menonaktifkan

(26)

84

Gambar 4.65 Tampilan About Navigasi

Keterangan:

Ketika tombol navigasi dipilih, maka akan menampilkan peta

navigasi dari aplikasi yang dibuat.

Gambar 4.66 Tampilan About RPP

Keterangan:

Ketika tombol RPP dipilih, maka akan menampilkan RPP dari BA

(27)

85

Gambar 4.67 Tampilan About Biodata

Keterangan:

Ketika tombol biodata dipilih, maka akan menampilkan biodata dari

pembuat aplikasi yang menjelaskan nama pembuat, NIM, Progdi,

dan lain-lain.

Gambar 4.68 Tampilan About Tentang Aplikasi

Keterangan:

Ketika tombol tentang dipilih, maka akan menampilkan deskripsi

singkat dari aplikasi yang dibuat.

4.5.5. Tampilan Menu Kompetensi

Pada menu ini terdapat penjelasan tentang kompetensi dasar

(28)

86

Tombol-tombol yang ada pada menu kompetensi adalah

tombol menu utama, suara (backsound), dan selanjutnya. Berikut

tampilan menu kompetensi:

Gambar 4.69 Tampilan Kompetensi Dasar

Keterangan:

 Tombol Menu : Menuju ke menu utama  Tombol Lanjut : Menuju ke halaman indikator

4.5.6. Tampilan Menu Credit

Pada menu ini berisi sumber bahan yang dipakai dalam

pembuatan aplikasi dan di dalamnya terdapat tombol menu utama

(29)

87

Gambar 4.70 Tampilan Menu Credit

Keterangan:

 Tombol Menu : Menuju ke menu utama

4.5.7. Tampilan Menu Materi

Pada menu ini berisi tentang empat tombol jenis binatang

yaitu binatang buas, serangga, peliharaan dan qurban. Adapun

tombol yang lainnya yaitu tombol menu utama, dan suara

(backsound). Berikut ini adalah tampilan menu materi:

(30)

88

Keterangan:

 Tombol Binatang Buas : Menuju ke materi binatang buas  Tombol Binatang Serangga : Menuju ke materi binatang serangga  Tombol Binatang Peliharaan : Menuju ke materi binatang

peliharaan

 Tombol Binatang Qurban : Menuju ke materi binatang qurban  Tombol Suara : Untuk mengaktifkan atau

menonaktifkan suara latar belakang (backsound)

4.5.8. Tampilan Menu Materi Macam – Macam Binatang

Pada menu ini terdapat 3 tombol binatang dari tiap jenis

binatang serta tombol menu utama dan suara (backsound). Berikut

ini adalah tampilan menu materi macam-macam binatang:

Gambar 4.72 Tampilan Menu Materi Macam-Macam Binatang

Keterangan:

 Tombol Kembali : Menuju ke menu sebelumnya  Tombol Binatang 1 : Menuju ke menu binatang 1  Tombol Binatang 2 : Menuju ke menu binatang 2

(31)

89

 Tombol Binatang 3 : Menuju ke menu binatang 3

4.5.9. Tampilan Menu Materi Deskripsi Binatang

Pada menu ini berisi tentang penjelasan binatang, ada suara

yang menjelaskan materi. Tombol yang terdapat pada menu materi

deskripsi binatang adalah tombol kembali, suara (backsound),

deskripsi, makanan, tempat hidup, dan gerakan. Berikut ini adalah

tampilan menu materi deskripsi binatang:

Gambar 4.73 Tampilan Materi Deskripsi Binatang

Keterangan:

 Tombol Kembali : Menuju ke menu sebelumnya  Tombol Deskripsi : Menampilkan penjelasan binatang  Tombol Makanan : Menampilkan penjelasan dan gambar

makanan binatang

 Tombol Tempat Hidup : Menampilkan penjelasan dan gambar tempat hidup binatang

(32)

90

 Tombol Lanjut : Menuju ke halaman berikutnya

4.5.10. Tampilan Menu Materi Makanan Binatang

Pada menu ini berisi tentang penjelasan makanan binatang,

ada gambar dan suara yang menjelaskan materi.

Tombol yang terdapat pada menu materi makanan binatang

adalah tombol kembali, suara (backsound), deskripsi, makanan,

tempat hidup, dan gerakan. Berikut ini adalah tampilan menu materi

makanan binatang:

Gambar 4.74 Tampilan Materi Makanan Binatang

Keterangan:

makanan binatang

(33)

91

 Tombol Gerakan : Menampilkan video gerakan binatang  Tombol Lanjut : Menuju ke halaman berikutnya

4.5.11. Tampilan Menu Materi Tempat Hidup Binatang

Pada menu ini berisi tentang penjelasan tempat hidup

binatang, ada gambar dan suara yang menjelaskan materi.

Tombol yang terdapat pada menu materi tempat hidup

binatang adalah tombol kembali, suara (backsound), deskripsi,

makanan, tempat hidup, dan gerakan. Berikut ini adalah tampilan

menu materi tempat hidup binatang:

Gambar 4.75 Tampilan Materi Tempat Hidup Binatang

Keterangan:

(34)

92

4.5.12. Tampilan Menu Materi Gerakan Binatang

Pada menu ini berisi video gerakan binatang. Tombol yang

terdapat pada menu materi tempat hidup binatang adalah tombol

kembali, suara (backsound), deskripsi, makanan, tempat hidup, dan

gerakan. Berikut ini adalah tampilan menu materi gerakan binatang:

Gambar 4.76 Tampilan Materi Gerakan Binatang

Keterangan:

(35)

93

4.5.13. Tampilan Menu Video

Pada menu video berisi tentang dongeng dan video

bernyanyi. Tombol-tombol pada menu ini adalah tombol menu

utama, suara (backsound), dongeng, dan mari bernyanyi. Berikut ini

adalah tampilan menu video:

Gambar 4.77 Tampilan Menu Video

Keterangan:

 Tombol Menu : Menuju ke menu utama  Tombol Dongeng Fabel : Masuk ke dongeng fabel  Tombol Mari Bernyanyi : Menuju ke video bernyanyi

(36)

94

4.5.14. Tampilan Menu Dongeng

Pada menu dongeng berisi sebuah dongeng fabel interaktif

yang berjudul Singa dan Tikus. Tombol-tombol pada menu dongeng

adalah tombol menu kembali, dan suara (backsound). Berikut ini

adalah tampilan menu dongeng:

Gambar 4.78 Tampilan Menu Dongeng

Keterangan:

 Tombol Kembali : Menuju ke menu sebelumnya

4.5.15. Tampilan Menu Mari Bernyanyi

Pada menu mari bernyanyi terdapat empat video nyanyian

anak, yaitu video balonku, burung kakak tua, kalau kau suka hati,

dan ABC.

Tombol-tombol yang ada pada menu mari bernyanyi adalah

tombol menu utama, suara (backsound), video 1, video 2, video 3,

(37)

95

Gambar 4.79 Tampilan Menu Mari Bernyanyi

Keterangan:

 Tombol Kembali : Menuju ke menu sebelumnya  Tombol Video 1 : Menampilkan video 1

 Tombol Video 2 : Menampilkan video 2  Tombol Video 3 : Menampilkan video 3  Tombol Video 4 : Menampilkan video 4

4.5.16. Tampilan Menu Kuis

Pada menu kuis berisi tentang kuis menyusun gambar dan

pilihan ganda. Tombol-tombol yang ada pada menu ini adalah

tombol menu utama, suara (backsound), menyusun gambar, dan

(38)

96

Gambar 4.80 Tampilan Menu Kuis

Keterangan:

 Tombol Menyusun Gambar : Menuju ke menu menyusun gambar  Tombol Pilihan Ganda : Masuk ke menu pilihan ganda  Tombol Suara : Untuk mengaktifkan atau

menonaktifkan suara latar belakang (backsound)

4.5.17. Tampilan Menu Menyusun Gambar

Pada menu menyusun gambar berisi tentang kuis untuk

menyusun gambar dari potongan-potongan gambar sehingga

menjadi gambar utuh berdasarkan tingkat kesulitan.

Tombol-tombol yang ada pada menu menyusun gambar adalah

tombol kembali, suara (backsound), mudah, sedang, dan sulit.

(39)

97

Gambar 4.81 Tampilan Menu Menyusun Gambar

Keterangan:

Pada menu menyusun gambar, ada tiga tombol yang menunjukan

tingkat kesulitan dari menyusun gambar yaitu mudah, sedang, dan

sulit.

Gambar 4.82 Tampilan Awal Menyusun Gambar

Keterangan:

Tampilan menu untuk menyusun gambar yang menunjukkan

potongan gambar yang diacak berada di sebelah kiri, dan tempat

(40)

98

Gambar 4.83 Tampilan Hasil Menyusun Gambar

Keterangan:

 Tombol Kembali : Menuju ke menu sebelumnya  Tombol Mudah : Masuk ke tingkat mudah  Tombol Sedang : Masuk ke tingkat sedang  Tombol Sulit : Masuk ke tingkat sulit

4.5.18. Tampilan Menu Pilihan Ganda

Pada menu ini terdapat soal dengan pilihan gambar. Ada

animasi tulisan dan suara yang membacakan pertanyaannya.

Tombol yang ada pada menu pilihan ganda adalah tombol

kembali, suara (backsound), mulai, jawaban bergambar, dan ulangi.

(41)

99

Gambar 4.84 Tampilan Awal Pilihan Ganda

Keterangan:

Tampilan awal dari menu pilihan ganda berisi tombol mulai untuk

memulai kuis pilihan ganda.

Gambar 4.85 Tampilan Isi Pilihan Ganda

Keterangan:

Ketika kuis pilihan ganda dimulai, maka akan ada narasi dari soal

(42)

100

Gambar 4.86 Jawaban Benar

Keterangan:

Ketika menjawab dengan benar maka akan muncul tampilan gambar

checklist dengan teks benar yang diikuti suara narasi “hebat”.

Gambar 4.87 Jawaban Salah

Keterangan:

Ketika menjawab jawaban yang salah maka akan muncul tampilan

(43)

101

Gambar 4.88 Tampilan Hasil Pilihan Ganda

Keterangan:

 Tombol Kembali : Menuju ke menu utama

 Tombol Mulai : Untuk memulai kuis pilihan ganda  Tombol Jawaban A : Pilih jawaban A

 Tombol Jawaban B : Pilih jawaban B  Tombol Jawaban C : Pilih jawaban C

 Tombol Ulangi : Untuk mengulangi kuis pilihan ganda  Tombol Suara : Untuk mengaktifkan atau menonaktifkan

suara latar belakang (backsound)

4.6. Pengujian Sistem

Pengujian merupakan hal terpenting yang bertujuan untuk

menemukan kesalahan – kesalahan atau kekurangan pada perangkat lunak

yang diuji. Pengujian bermaksud untuk mengetahui perangkat lunak yang

dibuat sudah memenuhi kriteria yang sesuai dengan tujuan perancangan

perangkat lunak tersebut.

Metode pengujian yang digunakan pada aplikasi ini yaitu pengujian

(44)

102

fungsi – fungsi khusus pada perangkat lunak yang dirancang. Pengujian

Kuesioner bertujuan untuk mengetahui tanggapan pengguna atau user pada

aplikasi Animasi Dongeng Interaktif dan Media Pembelajaran Mengenal

Binatang untuk BA Aisyiyah dengan membagikan Kuisioner kepada guru

dan wali murid yang ada di BA Aisyiyah Kranggan sebanyak lima

kuesioner.

4.6.1. Pengujian Black Box

Pengujian Black Box menguji fungsi – fungsi khusus pada

aplikasi dapat berfungsi sesuai yang diharapkan.

Tabel 4.2 Pengujian Black Box

Komponen yang Diuji

Skenario Uji Hasil yang Diharapkan

Hasil Pengujian Menu

Pembukaan

Pilih Tombol Masuk Menampilkan Menu Utama

Sesuai

Menu Utama

Pilih Tombol Materi Menampilkan Menu Materi

Sesuai

Pilih Tombol Video Menampilkan Menu Video Sesuai Pilih Tombol Kuis Menampilkan Menu Kuis Sesuai Pilih Tombol Profil Menampilkan Menu Profil Sesuai Pilih Tombol

Kompetensi

Menampilkan Kompetensi Sesuai

Pilih Tombol Bantuan Menampilkan Bantuan Penggunaan Aplikasi

Sesuai

Pilih Tombol Suara Mengaktifkan atau

Menonaktifkan Backsound

Sesuai

Pilih Tombol Keluar Menampilkan Menu Keluar

Sesuai

Menu Materi

Pilih Tombol Menu Utama

Menuju ke Menu Utama Sesuai

Pilih Tombol Materi Jenis Binatang Menampilkan Menu Materi Jenis-jenis Binatang Sesuai Materi Jenis Binatang

Pilih Tombol Binatang Masuk Materi Binatang Sesuai Pilih Tombol Kembali Menuju ke Menu

Sebelumnya

(45)

103

Hasil Pengujian Materi

Binatang

Pilih Tombol Deskripsi Menampilkan Materi Deskripsi Binatang

Sesuai

Pilih Tombol Makanan Menampilkan Materi Makanan Binatang

Sesuai

Pilih Tombol Tempat Hidup

Menampilkan Materi Tempat Hidup Binatang

Sesuai

Pilih Tombol Gerakan Menampilkan Video Gerakan Binatang Sesuai Pilih Tombol Sebelumnya Menuju ke Materi Binatang Sebelumnya Sesuai Pilih Tombol Selanjutnya Menuju ke Materi Binatang Selanjutnya Sesuai

Pilih Tombol Kembali Menuju ke Menu Sebelumnya

Sesuai

Menu Video

Pilih Tombol Dongeng Menampilkan Dongeng Interaktif

Sesuai

Pilih Tombol Mari Bernyanyi

Menampilkan Menu Mari Bernyanyi

Sesuai

Menu Dongeng

Pilih Tombol Kembali Menuju ke Menu Sebelumnya Sesuai Dongeng Interaktif Pilih Tombol Ya (Lepaskan Tikus)

Scene Singa Melepaskan Tikus

Sesuai

Pilih Tombol Tidak (Makan Tikus)

Scene Singa Memakan Tikus Sesuai Pilih Tombol Ya (Selamatkan Singa) Scene Tikus Menyelamatkan Singa Sesuai

Pilih Tombol Tidak (Biarkan Singa)

Scene Tikus Tidak Menyelamatkan Singa

Sesuai

Pilih Tombol Gigit Scene Tikus Menggigit Jaring

Sesuai

Pilih Tombol Pisau Scene Pisau Memotong Jaring

Sesuai

Menu Mari Bernyanyi

Pilih Tombol Video 1 Menampilkan Video 1 Sesuai Pilih Tombol Video 2 Menampilkan Video 2 Sesuai Pilih Tombol Video 3 Menampilkan Video 3 Sesuai Pilih Tombol Video 4 Menampilkan Video 4 Sesuai Pilih Tombol Kembali Menuju ke Menu

Sebelumnya

(46)

104

Hasil Pengujian Menu Kuis Pilih Tombol

Menyusun Gambar

Menampilkan Menu Menyusun Gambar

Sesuai

Pilih Tombol Pilihan Ganda

Menampilkan Menu Pilihan Ganda

Sesuai

Menu Menyusun Gambar

Pilih Tombol Mudah Masuk ke Menyusun Gambar Tingkat Mudah

Sesuai

Pilih Tombol Sedang Masuk ke Menyusun Gambar Tingkat Sedang

Sesuai

Pilih Tombol Sulit Masuk ke Menyusun Gambar Tingkat Sulit

Sesuai

Kuis Menyusun Gambar

Drag & Drop Potongan Gambar

Memindahkan Potongan Gambar

Sesuai

Hasil Menyusun Gambar

Sesuai

Menu Pilihan Ganda

Pilih Tombol Mulai Masuk ke Pertanyaan Sesuai Pilih Tombol Kembali Menuju ke Menu

Sebelumnya

Sesuai

Isi Pilihan Ganda

Pilih Tombol Jawaban Mengunci Jawaban dan Menuju Pertanyaan Selanjutnya

Sesuai

Pilih Tombol Kembali Menuju ke Menu Sebelumya

Sesuai

Hasil Pilihan Ganda

Pilih Tombol Ulangi Mengulangi Masuk ke Pertanyaan yang Diacak

Sesuai

Menu Profil Pilih Tombol Biodata Menampilkan Biodata Pembuat

Sesuai

Pilih Tombol Tentang Menampilkan Penjelasan Tentang Aplikasi

Sesuai

Menu Kompetensi Pilih Tombol Selanjutnya Menuju ke Tampilan Indikator Sesuai Pilih Tombol Sebelumnya Menuju ke Tampilan Kompetensi Dasar Sesuai

(47)

105

Hasil Pengujian Menu

Bantuan

Pilih Tombol Bantuan 1 Menampilkan Fungsi Tombol Bantuan 1

Sesuai

Keluar Pilih Tombol Ya Keluar Aplikasi Sesuai

Pilih Tombol Tidak Menampilkan Menu Utama

Sesuai

4.6.1.1. Kesimpulan Pengujian Black Box

Berdasarkan hasil pengujian Black Box dengan kasus

uji diatas maka dapat ditarik kesimpulan bahwa dalam

aplikasi Animasi Dongeng Interaktif dan Media

Pembelajaran Mengenal Binatang untuk BA Aisyiyah ini

tidak terdapat kesalahan proses, secara fungsional sudah

berjalan sesuai dengan yang diharapkan.

4.6.2. Pengujian Kuesioner

Kuesioner pengujian pada aplikasi Animasi Dongeng Interaktif

dan Media Pembelajaran Mengenal Binatang digunakan untuk

memberikan penilaian terhadap aplikasi yang dibuat. Dari hasil

kuesioner tersebut akan dilakukan perhitungan agar dapat diambil

(48)

106

likert. Skala likert dikembangkan pertamakali menggunakan 5 titik

respon yaitu sangat setuju, setuju, tidak memutuskan, tidak setuju,

dan sangat tidak setuju (Likert, 1932).

Kuesioner ini terdiri dari 12 pernyataan dengan menggunakan

skala likert dari 1 sampai 5. Berikut ini adalah skor penilaian yang

diberikan dengan menggunakan skala likert pada setiap pernyataan

yang ditunjukkan oleh tabel 4.3.

Tabel 4.3 Skor Jawaban Kuesioner

Skala Jawaban Keterangan Skor

SB Sangat Baik 5 B Baik 4 C Cukup 3 KB Kurang Baik 2 TB Tidak Baik 1 4.6.4.1. Data Kuesioner

Adapun data dari kuesioner dari aplikasi Animasi

Dongeng Interaktif dan Media Pembelajaran Mengenal

Binatang untuk BA Aisyiyah adalah sebagai berikut:

1. Jumlah responden terdiri dari 3 orang guru dan 7 orang

wali murid BA Aisyiyah Kranggan.

2. Daftar pertanyaan yang akan diujikan dapat dilihat pada

(49)

107

Tabel 4.4 Daftar Pertanyaan Kuesioner

Petunjuk : Berilah tanda centang pada kolom SB, B, C, KB, atau TB sesuai baris pertanyaan

Keterangan : SB = Sangat Baik, B = Baik, C = Cukup, KB = Kurang Baik, dan TB = Tidak Baik

SB B C KB TB

Aspek Desain

a. Tampilan warna dan background b. Desain gambar

c. Tampilan aplikasi keseluruhan Aspek Fungsional

a. Cara penyampaian isi materi b. Navigasi c. Gerakan animasi d. Audio e. Video f. Dongeng Aspek Tujuan a. Ke-interaktifan aplikasi

b. Kesesuaian materi dengan kurikulum c. Kegunaan aplikasi dalam membantu

kegiatan belajar

4.6.4.2. Hasil Kuesioner

Hasil dari pengujian yang dilakukan dengan

menggunakan kuesioner terhadap guru dan wali murid BA

(50)

108

Tabel 4.5 Hasil Kuesioner

Petunjuk : Berilah tanda centang pada kolom SB, B, C, KB, atau TB sesuai baris pertanyaan

Keterangan : SB = Sangat Baik, B = Baik, C = Cukup, KB = Kurang Baik, dan TB = Tidak Baik

SB B C KB TB

Aspek Desain

d. Tampilan warna dan background 5 5

e. Desain gambar 7 3

f. Tampilan aplikasi keseluruhan 5 5 Aspek Fungsional

g. Cara penyampaian isi materi 6 4

h. Navigasi 5 5 i. Gerakan animasi 7 3 j. Audio 4 6 k. Video 5 5 l. Dongeng 4 6 Aspek Tujuan d. Ke-interaktifan aplikasi 6 4 e. Kesesuaian materi dengan kurikulum 7 3 f. Kegunaan aplikasi dalam membantu

kegiatan belajar

8 2

Berdasarkan kuesioner diatas, dicari hasil persentase

dengan perhitungan skala Likert seperti berikut:

Responden = 10

Jumlah Pertanyaan = 12

N = 10 * 12

N = 120

(51)

109

Menghitung skor dengan rumus:

T = Total jumlah responden yang memilih