bab iii perancangan dan pembahasan...berikut ini adalah gambaran dari storyboard animasi pengenalan...
TRANSCRIPT
16
BAB III
PERANCANGAN DAN PEMBAHASAN
3.1. Analisa Kebutuhan Software
Dalam membangun sebuah sistem hendaklah merancang serta menganalisa
secara teliti terlebih dahulu tentang data dan informasi apa saja yang dibutuhkan
pengguna (user). Dalam menganalisa sebuah sistem perlu melibatkan komponen-
komponen yang tergabung dalam ruang lingkup software. Untuk menjadi sebuah
software hendaklah kita harus menganalisa secara menyeluruh dan utuh untuk
memberikan hasil yang baik. Penulis juga membutuhkan alat bantu berupa
perangkat lunak berupa aplikasi seperti WavePad Sound Editor, Adobe Photoshop
CS6 Dan Adobe Flash Professional CS6. Penulis juga membutuhkan ruang
lingkup sebagai dasar materi untuk software yang akan dibuat yaitu :
1. Materi pengenalan cara berkembang biak hewan
2. Soal-soal latihan
3. Games interaktif
3.2. Desain
Desain adalah langkah pertama dalam fase pengembangan bagi setiap
produk atau sistem yang direkayasa. Konsep desain yaitu membangun sebuah
fondasi untuk pembuatan model desain yang mencakup storyboard user interface
dan lain-lain.
17
3.2.1. Karakteristik Software
Dalam pembuatan animasi interaktif harus berpedoman pada karakteristik
dan unsur yang terdapat pada aplikasi multimedia, yaitu :
1. Format
Animasi interaktif yang akan dibuat terdiri dari 3 elemen utama yaitu materi
pengenalan cara berkembang biak hewan, latihan, permainan. Pada menu
materi pengenalan cara berkembang biak hewan pengguna dikenalkan dengan
penjelasan macam-macam cara berkembang biak hewan dan jenis hewan
bedasarkan cara berkembang biaknya. Pada menu latihan pengguna akan
diminta untuk menjawab 15 soal pertanyaan tentang pengenalan cara
berkembang biak hewan. Pada menu permainan pengguna akan bermain
puzzle, puzzle yang disajikan secara sliding gambar di mana pengguna
bermain sliding puzzle yaitu menggeser gambar ke kotak yang kosong untuk
mendapatkan sebuah foto yang utuh. Untuk aplikasi multimedia ini ada
beberapa tipe yang dapat dibuat, yaitu : swf, html, jpg, exe, mov, dalam skripsi
ini penulis menggunakan format exe dengan maksud agar lebih efektif dapat
digunakan dengan mudah.
2. Rules
Pada aplikasi ini, pengguna harus lebih dulu mempelajari pengenalan cara
berkembang biak hewan. Setelah itu pengguna dapat memilih menu latihan
untuk menjawab pertanyaan yang berhubungan cara berkembang biak hewan.
Dalam menu permainan pengguna dapat bermain puzzle.
18
3. Policy
Ketika pengguna dapat menjawab soal dengan benar maka pengguna akan
mendapatkan poin 10 setiap soalnya namun apabila jawaban pengguna salah
maka pengguna mendapatkan poin 0. Setelah menyelesaikan 15 soal latihan
pengguna akan mendapatkan nilai. Jika nilai yang didapat kurang dari 80
maka pengguna dapat mencoba kembali soal latihan namun apabila pengguna
mendapat nilai lebih dari 80 soal latihan selesai.
4. Scenario
Pertama kali pengguna akan diperkenalkan dengan Penjelasan cara
berkembang biak hewan yaitu sedikit artikel tentang cara berkembang biak
hewan dan Pengenalan jenis hewan bedasarkan cara berkembang biaknya.
Pengguna dapat memilih latihan untuk melatih kemampuan pengguna dalam
pengenalan cara berkembang biak hewan. Selain itu pengguna dapat melatih
kreatifitas dengan bermain game puzzle.
5. Events/Challenge
Pada aplikasi ini tantangan yang diberikan adalah pengguna harus menjawab
soal tentang pengenalan cara berkembang biak hewan dan pengguna dapat
memilih jawaban sesuai dengan soal yang diberikan. Ini berfungsi untuk
melatih pengguna dalam memahami materi yang telah diberikan dan melatih
daya ingat pengguna.
6. Roles
Pengguna harus bisa menjawab soal mengenai cara berkembang biak hewan
dengan benar untuk mendapatkan nilai yang tinggi.
19
7. Decisions
Keputusan yang dapat dibuat pengguna di sini adalah dalam menjawab
pertanyaan latihan dengan tepat agar dapat menyelesaikan soal dengan lebih
cepat. Sedangkan dalam permainan puzzle, pengguna dapat membuat
keputusan untuk meletakkan gambar yang sesuai pada posisi yang tepat.
8. Levels
Dalam aplikasi ini dibuat dengan soal dengan level yang sama. Pengguna
harus menjawab pertanyaan dengan benar dalam latihan pengenalan cara
berkembak biak hewan sesuai dengan materi yang sudah disampaikan di awal
dengan tingkatan kesulitan latihan dimana pengguna harus bisa memahami
dan menghafal materi yang sudah disampaikan.
9. Score Model
Dalam hal ini, latihan hanya menentukan berapa banyak soal yang dijawab
dan tiap soal memiliki nilai masing-masing sebesar 10 poin. Jika soal yang
dijawab benar kurang dari 6 soal maka pada nilai akhir akan muncul total nilai
dan pilihan “Coba Lagi” untuk mencoba kembali soal latihan. Jika soal yang
dijawab lebih dari dengan 6 maka komentar yang muncul adalah “Selamat
Nilai Kamu Adalah ….”
10. Indikator
Indikator yang digunakan adalah berupa gambar yang berfungsi untuk
menampilkan jenis-jenis hewan berdasarkan cara berkembang biaknya.
11. Symbols
Sebagai penunjuk untuk ke menu-menu lain terdapat tombol-tombol yang
berupa gambar untuk menuju ke menu yang telah disediakan.
20
3.2.2. Perancangan Story Board
Berikut ini adalah gambaran dari storyboard animasi pengenalan cara
berkembang biak hewan.
Tabel III.1
Perancangan Story Board
VISUAL SKETSA AUDIO
Tampilan Loading:
Tampilan ini muncul
saat aplikasi pertama
kali dijalankan
Sound.Mp3
Tampilan judul:
Tampilan ini
pertama kali yang
muncul ketika
aplikasi dijalankan .
Di dalam terdapat
tombol masuk yaitu
tombol untuk masuk
ke menu utama.
Sound.Mp3
Tampilan Menu
Utama:
Tampilan ini terdapat
5 tombol yaitu
Materi, Latihan,
Permainan, Profil,
Keluar.
Click.Mp3
21
Tampilan Sub Menu
Materi :
Pada Materi terdapat
5 tombol yaitu
Ovipar, Vivipar,
Ovovivipar, dan
Membelah diri,
Menu utama.
Click.Mp3
Tampilan Ovipar,
Vivipar, Ovovivipar,
dan Membelah diri:
halaman ini
merupakan sekilas
penjelasan cara
berkembang biak.
Pada tampilan ini
memiliki dua tombol
Tombol Hewan yang
berfungsi untuk
melihat jenis hewan
dan Tombol Home
Materi kembali ke
Sub Menu Materi
Click.Mp3
Sound
Cringnews. Mp3
Tampilan Hewan :
Pada Tampilan ini
akan disajikan
Penjelasan tentang
hewan-hewan
bedasarkan cara
berkembang biaknya.
Pada tampilan ini
hanya terdapat 1
tombol yaitu tombol
Home Materi untuk
kembali ke Sub Menu
Materi.
Click.Mp3
Sound
Cringnews. Mp3
22
Tampilan Sub Menu
Latihan:
Tampilan awal dari
Latihan adalah
menginput nama
yang akan latihan
soal sebelum masuk
kedalam latihan soal.
Pada halaman ini ada
2 tombol yaitu mulai
dan kembali
Click.Mp3
Tampilan soal latihan
:
halaman ini
merupakan halaman
soal dimana hanya
terdapat tombol
A,B,C,D untuk
pilihan jawaban dan
apabila sudah dipilih
soal secara otomatis
berubah dr soal no 1
sd 15
Click.Mp3
Tampilan score
latihan < 80 :
Pada tampilan ini
setelah 15 soal sudah
dijawab dan nilai
score < 80, maka
akan muncul 2
pilihan coba lagi
untuk mengulang 15
soal sebelumnya
sampai mendapatkan
nilai > 80 atau
kembali ke Menu
Utama .
Click.mp3
Tampilan score
latihan > 80 :
Pada tampilan ini
setelah 10 soal sudah
dijawab dan nilai
score > 80, maka
akan Tombol Selesai
untuk menuju ke
Menu Utama
Click.mp3
Sound
Menang.Mp3
23
Tampilan Sub Menu
Permainan : Pada
halaman ini puzzle
tipe sliding yaitu
menggeser gambar ke
kotak yang kosong
dan menyusun
gambar sampai
gambar tersusun
rapih dan benar
dengan waktu 30
detik.
Click.mp3
Tampilan hasil
permainan kalah :
jika tidak bisa
menyelesaikan puzzle
dalam waktu 30 detik
maka aka n ada pesan
“GAGAL” dengan 2
tombol coba lagi
untuk mengulang
permainan dan
kembali untuk
kembali ke Menu
Utama.
Click.mp3
Sound
Kalah.Mp3
Tampilan hasil
permainan menang :
jika bisa
menyelesaikan puzzle
dalam waktu 30 detik
maka akan ada pesan
“BERHASIL”
dengan tombol
kembali untuk
kembali ke Menu
Utama.
Click.mp3
Sound
Menang.Mp3
24
Tampilan Menu
Profil : Pada halaman
ini menampilkan
profile dari penulis
terdiri dari foto
penulis, nama
lengkap, nim, dan
jurusan, memiliki
satu tombol keluar
untuk kembali ke
Menu Utama.
Click.mp3
Tampilan Menu
Keluar : Tampilan ini
adalah menu untuk
keluar dari aplikasi,
dimana pengguna
dapat memilih untuk
tetap didalam aplikasi
atau keluar dari
aplikasi dengan
pilihan YA atau
TIDAK
Click.mp3
3.2.3. User Interface
Pada halaman ini akan dijelaskan perancangan user interface animasi yang
akan ditampilkan. Dalam tampilan animasi ini akan dibuat bermacam-macam
gambar, sehingga tampilannya menjadi lebih menarik dan lebih hidup. Berikut ini
adalah tampilan yang pada aplikasi yang penulis buat :
A. Halaman Loading
Berikut ini adalah gambaran dari tampilan halaman loading seperti yang ada
pada gambar dibawah ini :
25
Gambar III.1
Tampilan Loading
B. Halaman Judul
Berikut ini adalah gambaran dari tampilan halaman judul seperti yang ada
qpada gambar dibawah ini :
Gambar III.2
Tampilan Awal
C. Halaman Menu Utama
Berikut ini adalah gambaran dari tampilan halaman menu utama seperti
yang ada pada gambar dibawah ini :
26
Gambar III.3
Tampilan Menu Utama
D. Halaman Sub Menu Materi
Berikut ini adalah gambaran dari tampilan halaman sub menu materi seperti
yang ada pada gambar dibawah ini :
Gambar III.4
Tampilan Sub Menu Materi
E. Halaman Pengertian Ovipar
Berikut ini adalah gambaran dari tampilan halaman pengertian Ovipar
seperti yang ada pada gambar dibawah ini :
27
Gambar III.5
Tampilan Pengertian Ovipar
F. Halaman Contoh Hewan Ovipar
Berikut ini adalah gambaran dari tampilan halaman contoh - contoh hewan
yang berkembang biak dengan cara ovipar seperti yang ada pada gambar dibawah
ini :
Gambar III.6
Tampilan Contoh Hewan Ovipar
G. Halaman Pengertian Vivipar
Berikut ini adalah gambaran dari tampilan halaman pengertian Vivipar
seperti yang ada pada gambar dibawah ini :
28
Gambar III.7
Tampilan Pengertian Vivipar
H. Halaman Contoh Hewan Vivipar
Berikut ini adalah gambaran dari tampilan halaman contoh - contoh hewan
yang berkembang biak dengan cara vivipar seperti yang ada pada gambar dibawah
ini :
Gambar III.8
Tampilan Contoh Hewan Vivipar
29
I. Halaman Pengertian Ovovivipar
Berikut ini adalah gambaran dari tampilan halaman pengertian Ovovivipar
seperti yang ada pada gambar dibawah ini :
Gambar III.9
Tampilan Pengertian Ovovivipar
J. Halaman Contoh Hewan Ovovivipar
Berikut ini adalah gambaran dari tampilan halaman contoh - contoh hewan
yang berkembang biak dengan cara Ovovivipar seperti yang ada pada gambar
dibawah ini :
Gambar III.10
Tampilan Contoh Hewan Ovovivipar
30
K. Halaman Pengertian Membelah Diri
Berikut ini adalah gambaran dari tampilan halaman pengertian membelah
diri seperti yang ada pada gambar dibawah ini :
Gambar III. 11
Tampilan Contoh Hewan Membelah Diri
L. Halaman Contoh Hewan Membelah Diri
Berikut ini adalah gambaran dari tampilan halaman contoh - contoh hewan
yang berkembang biak dengan cara Membelah Diri seperti yang ada pada gambar
dibawah ini :
Gambar III.12
Tampilan Contoh Hewan Membelah Diri
31
M. Halaman Sub Menu Latihan
Berikut ini adalah gambaran dari tampilan halaman sub menu latihan seperti
yang ada pada gambar dibawah ini :
Gambar III.13
Tampilan Sub Menu Latihan
N. Halaman Sola Latihan
Berikut ini adalah gambaran dari tampilan halaman soal latihan seperti yang
ada pada gambar dibawah ini :
Gambar III.14
Tampilan Soal Latihan
32
O. Halaman Nilai Menang
Berikut ini adalah gambaran dari tampilan halaman nilai menang seperti
yang ada pada gambar dibawah ini :
Gambar III.15
Tampilan Nilai Menang
P. Halaman Nilai Kalah
Berikut ini adalah gambaran dari tampilan halaman nilai kalah seperti yang
ada pada gambar dibawah ini :
Gambar III.16
Tampilan Nilai Kalah
33
Q. Halaman Permainan Sliding Puzzel
Berikut ini adalah gambaran dari tampilan halaman menu permainan
slidding puzzle yang terdapat 2 pilihan puzzle seperti yang ada pada gambar
dibawah ini :
Gambar III. 17
Tampilan Permainan Sliding Puzzel
R. Halaman Sliding Puzzel Menang
Berikut ini adalah gambaran dari tampilan halaman sliding puzzle menang
seperti yang ada pada gambar dibawah ini :
Gambar III. 18
Tampilan Sliding Puzzel Menang
34
S. Halaman Sliding Puzzel Kalah
Berikut ini adalah gambaran dari tampilan halaman sliding puzzle kalah
ketika meyelesaikan permainan seperti yang ada pada gambar dibawah ini :
Gambar III. 19
Tampilan Sliding Puzzel Kalah
T. Halaman Sub Menu Profil
Berikut ini adalah gambaran dari tampilan halaman sub menu profil berisi
tentang biodata penulis seperti yang ada pada gambar dibawah ini :
Gambar III. 20
Tampilan Sub Menu Profil
35
Menu UtamaLoading Judul
U. Halaman Sub Menu Keluar
Berikut ini adalah gambaran dari tampilan halaman sub menu keluar yang
ada pada gambar dibawah ini :
Gambar III. 21
Tampilan Sub Menu Keluar
3.2.4. State Transition Diagram
State Transition Diagram adalah suatu pemodelan peralatan (modeling
tool) yang menggambarkan sifat ketergantungan terhadap suatu sistem waktu
nyata (real time system), dan tampilan tatap muka (interface) pada sistem aktif
(online system). Pemodelan ini juga penulis gunakan dalam menjelaskan alur-alur
dari aplikasi yang penulis rancang.
1. Scene Menu Loading
Gambar III.22
State Transition Diagram Awal
36
Menggambarkan aplikasi dimana pertama kali pengguna akan menemui
loading diikuti oleh judul dengan tombol masuk, lalu akan masuk ke menu
utama.
2. Scene Menu Utama
Berikut ini adalah gambaran dari Scene Menu Utama :
Gambar III.23
State Transition Diagram Menu Utama
Menggambarkan menu awal aplikasi dimana pertama kali pengguna akan
menemui loading kemudian ke judul lalu akan masuk ke menu utama yang
terdapat tombol Materi, Latihan, Permainan, Profil dan Keluar.
3. Scene Menu Materi
Berikut ini adalah gambaran dari Scene Menu Materi:
37
Gambar III.24
State Transition Diagram Sub Menu Materi
Gambar III.25
State Transition Diagram Sub Menu Latihan
Gambar III.26
State Transition Diagram Sub Menu Permainan
Gambar III.27
State Transition Diagram Sub Menu Profil
38
3.3. Code generation
3.3.1 Testing
Aplikasi yang telah dibuat, selanjutnya diuji melalui teknik pengujian
perangkat lunak yang meliputi pengujian white box dan black box
A. White Box
Pengujian white Box merupakan metode perancangan test case yang
menggunakan struktur control dari perancangan procedural untuk mendapatkan
test case. Dengan menggunakan metode white box analisis sistem akan dapat
memperoleh test case yang:
1. Memberikan jaminan bahwa semua jalur independen pada suatu modul telah
digunakan paling tidak satu kali.
2. Menggunakan semua keputusan logis pada sisi true dan false.
3. Mengeksekusi semua loop ( perulangan ) pada batasan mereka dan pada batas.
4. Operasional pengunaan aplikasi.
Dalam hal ini, pengujian tidak dilakukan terhadap keseluruhan program secara
utuh, namun dilakukan sampel pengujian soal latihan tertentu yang dijalankan.
Sebagai contoh akan dibahas pengujian terhadap soal latihan ke-1 , yang prinsip
kerjanya sama dengan soal latihan ke-2 sampai dengan ke-15. Secara garis besar,
algoritma dari soal latihan adalah sebagai berikut:
1. Jika pengguna mengklik soal latihan di menu utama, maka pengguna dapat
melatih pengetahuannya tentang hal yang pengguna dapat tentang aplikasi
tersebut.
39
2. Tiap soal latihan yang dikerjakan dengan benar, maka akan medapatkan
score atau nilai 15 dan nilai tersebut akan diakumulasikan jika dapat
mengerjakan soal berikutnya dengan benar.
3. Jika jawaban benar pengguna pada 15 soal pertama dan mendapatkan nilai
kurang dari < 80 maka pengguna disarankan untuk mencoba kembali.
40
Gambar III.28
Bagan Alir Latihan
41
Gambar III.29
Grafik Alir Latihan
42
import flash.events.MouseEvent;
stop();
latihan.addEventListener(MouseEvent.CLICK, goToLatihan);
function goToLatihan(e:MouseEvent) {
MovieClip(parent).gotoAndStop(5);
}
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.events.Event;
var nama:String;
mulai.addEventListener(MouseEvent.CLICK, mulaiQuiz);
function mulaiQuiz(e:MouseEvent):void {
//nama = testinput.text;
trace(nama);
gotoAndStop(2);
}
testinput.addEventListener(Event.CHANGE, checkInput);
function checkInput(e:Event):void {
3
2
1
4
43
//receive input value and validate it
var textfield:TextField = e.target as TextField;
nama = textfield.text;
//...
}
menuUtama.addEventListener(MouseEvent.CLICK, goToMenuMateri);
function goToMenuMateri(e:MouseEvent) {
MovieClip(parent).gotoAndStop(2);
}
import flash.events.MouseEvent;
var score:int = 0;
var urutan:int = 0;
var pertanyaanValue:Array = new Array();
pertanyaanValue[0] = "1. dibawah ini manakah yang termasuk hewan vivipar?";
pertanyaanValue[1] = "2. disebut apakah hewan yang berkembang biak dengan
cara bertelur?";
pertanyaanValue[2] = "3. Apakah ciri ciri hewan yang membelah diri?";
pertanyaanValue[3] = "4. disebut apakah hewan yang berkembang biak dengan
cara beranak atau melahirkan?";
pertanyaanValue[4] = "5. dibawah ini manakah yang termasuk hewan
ovovivipar?";
pertanyaanValue[5] = "6. Apakah ciri ciri hewan Ovipar?";
pertanyaanValue[6] = "7. disebut apakah hewan yang berkembang biak dengan
cara bertelur-beranak?";
pertanyaanValue[7] = "8. dibawah ini manakah yang termasuk hewan ovipar?";
5
44
pertanyaanValue[8] = "9. Apakah ciri ciri hewan vivipar?";
pertanyaanValue[9] = "10. dibawah ini manakah yang termasuk hewan membelah
diri?";
pertanyaanValue[10] = "11. Gajah adalah hewan yang berkembang biak dengan
cara?";
pertanyaanValue[11] = "12. Berikut ini adalah hewan yang berkembang biak
dengan cara bertelur yaitu?";
pertanyaanValue[12] = "13. Hanya dapat dilihat dengan mikroskop adalah ciri
hewan yang berkembang biak dengan cara?";
pertanyaanValue[13] = "14. Cara berkembang biak ovovivipar, Embrio mendapat
nutrisi makanan dari?";
pertanyaanValue[14] = "15. Merpati merupakan hewan yang berkembang biak
dengan cara?";pertanyaanValue[9] = "dibawah ini manakah yang termasuk hewan
membelah diri?";
var jawabanAValue:Array = new Array();
jawabanAValue[0] = "Gajah";
jawabanAValue[1] = "Ovipar";
jawabanAValue[2] = "Setelah telur-telur tersebut menetas, barulah sang induk
akan melahirkan anaknya";
jawabanAValue[3] = "Membelah Diri";
jawabanAValue[4] = "Hiu";
jawabanAValue[5] = "tidak dapat di lihat tampa microskop ";
jawabanAValue[6] = "Ovipar";
jawabanAValue[7] = "Burung";
jawabanAValue[8] = "Tidak menyusui anaknya";
jawabanAValue[9] = "Bebek";
jawabanAValue[10] = "Vivipar";
jawabanAValue[11] = "Itik, Angsa dan Bebek";
jawabanAValue[12] = "Ovipar";
45
jawabanAValue[13] = "Induk";
jawabanAValue[14] = "Melahirkan";
var jawabanBValue:Array = new Array();
jawabanBValue[0] = "Ayam";
jawabanBValue[1] = "Vivipar";
jawabanBValue[2] = "memiliki sel satu ";
jawabanBValue[3] = "Ovovivipar";
jawabanBValue[4] = "Gajah";
jawabanBValue[5] = "berukuran sangat kecil";
jawabanBValue[6] = "Ovovivipar";
jawabanBValue[7] = "Hiu";
jawabanBValue[8] = "Tidak memiliki daun telinga";
jawabanBValue[9] = "Ayam";
jawabanBValue[10] = "Ovovivipar";
jawabanBValue[11] = "Hiu, Ayam dan Cicak";
jawabanBValue[12] = "Ovovivipar";
jawabanBValue[13] = "Telur";
jawabanBValue[14] = "Bertelur";
var jawabanCValue:Array = new Array();
jawabanCValue[0] = "Hiu";
jawabanCValue[1] = "Ovovivipar";
jawabanCValue[2] = "Memiliki puting susu dan kelenjar susu serta menyusui
anaknya";
jawabanCValue[3] = "Vivipar";
jawabanCValue[4] = "Ayam";
jawabanCValue[5] = "Memiliki penutup tubuh berupa rambut";
46
jawabanCValue[6] = "Membelah Diri";
jawabanCValue[7] = "Gajah";
jawabanCValue[8] = "Tidak memiliki puting dan kelenjar susu";
jawabanCValue[9] = "Amoeba";
jawabanCValue[10] = "Ovipar";
jawabanCValue[11] = "Kera, Bebek dan Ayam";
jawabanCValue[12] = "Vivipar";
jawabanCValue[13] = "Darah";
jawabanCValue[14] = "Membelah diri";
var jawabanDValue:Array = new Array();
jawabanDValue[0] = "Amoeba";
jawabanDValue[1] = "Membelah Diri";
jawabanDValue[2] = "Tidak memiliki daun telinga";
jawabanDValue[3] = "Ovipar";
jawabanDValue[4] = "Amoeba";
jawabanDValue[5] = "Tidak memiliki puting dan kelenjar susu";
jawabanDValue[6] = "Vivipar";
jawabanDValue[7] = "Plankton";
jawabanDValue[8] = "Memiliki daun telinga";
jawabanDValue[9] = "Gajah";
jawabanDValue[10] = "Membelah diri";
jawabanDValue[11] = "Angsa, Bebek dan kelinci";
jawabanDValue[12] = "Membelah diri";
jawabanDValue[13] = "Sisa makanan induknya";
jawabanDValue[14] = "Bertelur dan melahirkan";
var jawabanBenar:Array = new Array();
47
jawabanBenar[0] = "A";
jawabanBenar[1] = "A";
jawabanBenar[2] = "B";
jawabanBenar[3] = "C";
jawabanBenar[4] = "A";
jawabanBenar[5] = "D";
jawabanBenar[6] = "B";
jawabanBenar[7] = "A";
jawabanBenar[8] = "D";
jawabanBenar[9] = "C";
jawabanBenar[10] = "A";
jawabanBenar[11] = "A";
jawabanBenar[12] = "D";
jawabanBenar[13] = "B";
jawabanBenar[14] = "B";
pertanyaan.text = pertanyaanValue[urutan];
jawabanA.text = jawabanAValue[urutan];
jawabanB.text = jawabanBValue[urutan];
jawabanC.text = jawabanCValue[urutan];
jawabanD.text = jawabanDValue[urutan];
btnA.addEventListener(MouseEvent.CLICK, dijawabA);
btnB.addEventListener(MouseEvent.CLICK, dijawabB);
btnC.addEventListener(MouseEvent.CLICK, dijawabC);
btnD.addEventListener(MouseEvent.CLICK, dijawabD);
function dijawabA(e:MouseEvent) {
6
po
int
;
na
m
as
co
re.
te
xt
=n
a
m
a;
po
int
=
N
u
m
be
r(
po
int
7
po
int
;
na
m
48
dijawab("A");
}
function dijawabB(e:MouseEvent) {
dijawab("B");
}
function dijawabC(e:MouseEvent) {
dijawab("C");
}
function dijawabD(e:MouseEvent) {
dijawab("D");
}
function dijawab(jawaban:String) {
if(jawabanBenar[urutan] == jawaban) {
trace("BENAR");
score += 10;
} else {
trace("SALAH");
}
urutan++;
if(urutan == 15) {
gotoAndStop(3);
} else {
pertanyaan.text = pertanyaanValue[urutan];
jawabanA.text = jawabanAValue[urutan];
jawabanB.text = jawabanBValue[urutan];
jawabanC.text = jawabanCValue[urutan];
49
jawabanD.text = jawabanDValue[urutan];
}
import flash.events.MouseEvent;
namapengerja.text = nama;
scorenilai.text = score+"";
if(score <= 60) {
cobaLagi.visible = true;
kembali.visible = true;
selesai.visible = false;
} else {
var myMusic2 = new tepuk();
var volumesuara2 = new SoundTransform(0.3,0);
var channel2 = myMusic2.play(0, 1, volumesuara2);
var myMusic3 = new hore();
var volumesuara3 = new SoundTransform(0.3,0);
var channel3 = myMusic3.play(0, 1, volumesuara3);
cobaLagi.visible = false;
kembali.visible = false;
selesai.visible = true;
}
cobaLagi.addEventListener(MouseEvent.CLICK, cobaLagifunc);
kembali.addEventListener(MouseEvent.CLICK, kembalifunc);
selesai.addEventListener(MouseEvent.CLICK, selesaifunc);
function cobaLagifunc(e:MouseEvent) {
8
po
int
;
na
m
as
co
re.
te
xt
=n
a
m
a;
po
int
=
N
u
m
be
9
po
int
;
na
m
as
co
re.
te
xt
=n
a
m
a;
po
int
=
N
u
10
po
int
;
na
m
as
co
re.
te
xt
=n
a
m
a;
po
int
11
po
int
;
na
m
as
co
re.
50
gotoAndStop(1);
}
function kembalifunc(e:MouseEvent) {
MovieClip(parent).gotoAndStop(2);
}
function selesaifunc(e:MouseEvent) {
MovieClip(parent).gotoAndStop(2);
}
Kompleksitas Siklomatis (pengukuran kuantitatif terhadap
kompleksitalogis suatu program) dari grafik alir dapat diperoleh dengan
perhitungan :
Dimana:
E = Jumlah edge grafik alir yang ditandakan dengan gambar panah
N = Jumlah simpul grafik alir yang ditandakan dengan gambar lingkaran
Sehingga kompleksitas siklomatisnya
V(G)= 12-11+2=3
Basis set yang dihasilkan dari jalur independent secara linear adalah jalur
sebagai berikut :
1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 10 – 5
1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 11 – 2
1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 11
V(G)=E-N+2
51
Ketika aplikasi dijalankan ,maka terlihat bahwa salah satu basis set yang
dihasilkan adalah 1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 11 dan terlihat bahwa simpul
telah di eksekusi satu kali.
B. Black Box
Pengujian selanjutnya dilakukan untuk memastikan bahwa suatu masukan
akan menjalankan proses tepat. Untuk contoh pengujian terhadap beberapa tombol
dari aplikasi multimedia memberikan hasil sebagai berikut :
Tabel III.2
Tabel Pengujian
Input /event Proses Output/next
Stage
Hasil
penguji
Tombol
button Masuk
import flash.events.MouseEvent;
masuk.addEventListener(MouseEvent.CLI
CK, doMasuk);
function doMasuk(e:MouseEvent) {
MovieClip(parent).gotoAndStop(2);
}
Ke halaman
Menu Utama
Sesuai
Tombol
button Materi
import flash.events.MouseEvent;
materi.addEventListener(MouseEvent.CLI
CK, goToMateri);
function goToMateri(e:MouseEvent) {
MovieClip(parent).gotoAndStop(3);
}
Ke halaman
Materi
Sesuai
Tombol
button
Latihan
import flash.events.MouseEvent;
stop();
latihan.addEventListener(MouseEvent.CLI
CK, goToLatihan);
function goToLatihan(e:MouseEvent) {
Ke halaman
Latihan
Sesuai
52
MovieClip(parent).gotoAndStop(5);
}
Tombol
button
Permainan
import flash.events.MouseEvent;
stop();
permainan.addEventListener(MouseEvent.
CLICK, goToPermainan);
function goToPermainan(e:MouseEvent) {
MovieClip(parent).gotoAndStop(8);
}
Ke halaman
Permainan
Sesuai
Tombol
button Profil
import flash.events.MouseEvent;
stop();
profile.addEventListener(MouseEvent.CLI
CK, goToProfile);
function goToProfile(e:MouseEvent) {
MovieClip(parent).gotoAndStop(7);
}
Ke halaman
Profil
Sesuai
Tombol
button Keluar
import flash.events.MouseEvent;
stop();
keluar.addEventListener(MouseEvent.CLIC
K, exit);
function exit(e:MouseEvent) {
MovieClip(parent).setChildIndex(thi
s, MovieClip(parent).numChildren - 1);
gotoAndStop(2);
}
Ke halaman
Keluar
Sesuai
3.3.2 Support
Spesifikasi hardware dan software minimum yang digunakan pada
aplikasi ini adalah :
53
Tabel III.3
Kebutuhan Hardware dan Software Perancangan Animasi Interaktif
Kebutuhan Keterangan
Sistem Operasi Windows 10
Processor Intel Core 2 Duo atau lebih tinggi
Memori 1 GB (direkomendasikan 2 GB)
Hardisk 160 GB
Software
Adobe Profesional Flash CS6, Adobe Photoshop
CS6,
3.4. Hasil Pengolahan Data Kuesioner Animasi Interaktif
Setelah melakukan pembuatan program penulis melakukan pengujian
program animasi kepada anak kelas 4 SD di lingkungan Madrasah Ibtidaiyah
Hidayatul Anam Jakarta dengan menggunakan kuesioner yang berupa angket dan
kemudian diberikan kepada 10 anak, kemudian penulis simpulkan kedalam hasil
kuesioner dalam bentuk grafik sebagai berikut :
Petunjuk pengisian :
1. Mohon kuesioner ini diisi secara lengkap dari seluruh pernyataan yang telah
disediakan, sesuai dengan pendapat anak-anak dan sesuai dengan kondisi
yang sebenarnya.
2. Berilah tanda (√) pada kolom jawaban yang tersedia.
54
3. Terdapat 2 (Dua) alternatif pengisian jawaban, yaitu :
a. Ya
b. Tidak
Berikut ini adalah rincian dari item-item kuesioner untuk anak-anak:
Tabel III.4
Kuesioner Animasi Interaktif Pengenalan Jenis Hewan Berdasarkan Cara
Berkembang Biak
Petunjuk Pengisian :
Tuliskan jawaban adik – adik dengan beri tanda (√) pada jawaban yang
dipilih. Jika adik – adik setuju pilih (ya) jika tidak setuju pilih (tidak).
No Pertanyaan Untuk Peserta Didik Ya Tidak
1. Apakah desain animasi menarik?
2. Apakah animasi mudah digunakan?
3. Apakah suara dalam materi jelas?
4. Apakah materi mudah di mengerti?
5. Apakah tampilan latihan menarik?
6. Apakah ada kesulitan dalam mengerjakan
latihan?
7. Apakah animasi ini menyenangkan?
8. Apakah animasi ini membosankan?
9. Apakah animasi ini bermanfaat?
10. Apakah animasi ini membuat semangat belajar
meningkat?
55
Beri tanda (√) pada jawaban yang dipilih
Berikut ini adalah bagan dari kuesioner dari animasi interaktif pengenalan
jenis hewan berdasarkan cara berkembang biak
Sumber : Hasil Penelitian (2017)
Gambar III.30
Tampian Grafik Kuesioner pada anak-anak
Penjelasan :
Soal 1 : 10 dari 10 responden = 10/10 x 100 % = 100 %
Soal 2 : 9 dari 10 responden = 9/10 x 100 % = 90 %
Soal 3 : 7 dari 10 responden = 7/10 x 100 % = 70 %
Soal 4 : 8 dari 10 responden = 8/10 x 100 % = 80 %
Soal 5 : 10 dari 10 responden = 10/10 x 100 % = 100 %
Soal 6 : 8 dari 10 responden = 8/10 x 100 % = 85 %
Soal 7 : 10 dari 10 responden = 20/10 x 100 % = 100 %
Soal 8 : 0 dari 10 responden = 0/10 x 100 % = 0 %
Soal 9 : 9 dari 10 responden = 9/10 x 100 % = 90 %
Soal 10 : 10 dari 10 responden = 10/10 x 100 % = 100 %
56
Dari kesimpulan kuesioner diatas diambil kesimpulan bahwa anak-anak
lebih senang menggunakan aplikasi ini dan aplikasi ini mempermudah anak-anak
dalam belajar pengenalan jenis hewan berdasarkan cara berkembang biak. Para
anak-anak pun setuju untuk aplikasi ini sebagai media pembelajaran yang lebih
menarik.