bab iii pembahasan - repository.bsi.ac.id filepercobaan kimia yaitu salah satunya ph larutan yaitu...

26

BAB III

PEMBAHASAN

3.1. Analisis Kebutuhan

Analisis kebutuhan merupakan uraian kebutuhan atau sarana yang akan

dipergunakan untuk membantu menyelesaikan proses pembuatan projek yang

akan dibuat. Analisis kebutuahan terbagi menjadi dua yaitu kebutuhan fungsional

dan kebutuhan non-fungsional.

1. Materi animasi interaktif unsur dan percobaan kimia adalah tentang

pengenalan tabel periodik unsur-unsur dimana tampilan unsur-unsur kimia

dalam bentuk tabel. Unsur-unsur diatur berdasarkan elektronnya sehingga

sifat kimia unsur-unsur tersebut berubah-ubah secara teratur sepanjang

tabel. Setiap tabel didaftarkan berdasarkan nomor atom dan lambang

unsurnya, tebel periodik memberikan informasi dasar mengenai suatu unsur.

2. Pada animasi interaktif unsur dan percobaan kimia memiliki daftar unsur

dimana setiap unsur-unsur kimia dikelompokan berdasarkan golongan untuk

mempermudah pengguna mencari unsur-unsur kimia yang diinginkan.

3. Animasi interaktif unsur dan percobaan kimia menyediakan animasi

percobaan kimia yaitu salah satunya PH larutan yaitu menguji suatu larutan

menggunakan kertas lakmus untuk mengetahui suatu larutan bersifat asam

dan basa.

4. Di dalam animasi interaktif unsur dan percobaan kimia terdapat permaianan

quiz dan tebak gambar. Konsep permainan yang dibuat adalah tentang

unsur-unsur kimia pada tabel periodik unsur kimia.

27

3.1.1. Kebutuhan Fungsional

Kebutuhan fungsional merupakan jenis kebutuhan yang berupa proses-

proses yang dapat dilakukan oleh sistem dan juga membahas informasi apa saja

yang dihasilkan oleh sistem. Berikut ini adalah kebutuhan fungsional dari animasi

dan game yang akan dibuat :

1. Animasi dan game dapat menampilkan splash screen.

2. Pada tampilan dashboard atau menu utama terdapat tombol fungsi (Tabel

Periodik, Daftar Unsur, Percobaan Kimia, Play, Informasi, Keluar).

a. Tombol tabel periodik, berfungsi menampilkan layout menu berbentuk

tabel periodik.

b. Tombol daftar unsur, berfungsi menampilkan layout menu unsur

berdasarkan golongan dari tabel periodik.

c. Tombol Percobaan kimia, berfungsi menampilakan layout menu pilihan

animasi.

d. Tombol play, berfungsi menampilkan layout menu pilihan permaianan

diantaranya quiz dan tebak gambar

e. Tombol informasi, berfungsi menampilakan layout menu penjelasan

berupa animasi, game dan pengembangnya.

f. Tombol keluar, berfungsi menampilkan layout menu pilihan konfirmasi

keluar.

3. Pada permainan quiz terdapat layout menu motivasi sebelum permainan

quiz dimulai.

4. Permainan dapat menampilkan layout menu skor pada saat permainan quiz

selesai.

28

5. Pada permainan tebak gambar terdapat layout menu level untuk memulai

permainan tebak gambar.

6. Pada animasi interaktif unsur dan percobaan kimia ini terdapat beberapa

pilihan animasi yang berhubungan dengan kimia.

3.1.2. Kebutuhan Non-Fungsional

Kebutuhan non-fungsional merupakan perilaku sistem yang berhubungan

dengan oprasional atau kebutuhan perangkat keras dan kebutuhan perangkat

lunak. Kebutuhan yang diperlukan dalam perancangan sistem ini antara

lainsebagai berikut :

1. Perangkat Lunak (Software)

Perangkat lunak (software) yang diperlukan dalam pembuatan animasi

interaktif unsur dan percobaan kimia untuk android phone ini adalah sebagai

berikut:

a. Microsoft Windows 10 (32-bit).

b. Construct 2.

c. Android Software Development Kit (Android SDK).

d. IntelXDK.

e. Progam-progam lainnya yang mendukung penyelesaian projek ini.

2. Perangkat Keras (Hardware)

a. Komputer

Spesifikasi perangkat keras yang digunakan untuk membuat animasi

interaktif unsur dan percobaan kimia ini adalah :

1. Menggunakan laptop acer.

29

2. Processor Intel(R) Core(TM) i3 CPU M370 @2.240GHz 2.20GHz.

3. RAM (Random Acces Memory) 2GB DDR3.

4. Harddisk 500 GB.

5. VGA (Video Graphic Adapter) Intel(R) HD Graphics.

b. Perangkat Smartphone Android

Spesifikasi minimal smartphone android yang digunakan untuk

menjalankan animasi interaktif unsur dan percobaan kimia ini adalah :

1. Ponsel berbasis android.

2. OS 4.0 Android (Jelly Bean), Ice Cream Sandwich (Crosswalk),

Kitkat, dan Lollipop.

3. Processor 528 MHz, Qualcomm MSM 7225 chipset.

4. Memory512 MB ROM, 256 MB RAM.

c. Perangkat Windows

Spesifikasi perangkat windows yang digunakan untuk menjalankan

animasi interaktif unsur dan percobaan kimia ini adalah :

1. Laptop OSwindows.

2. OS Windows 32/64 bit (XP, VISTA, 7, 8, dan Windows 10).

3. Aplikasi BrowserGoogle Chorome, Mozilla Firefox, dan UC

Browser.

3. Kebutuhan Pengguna

Pengguna yang dapat menggunakan animasi interaktif unsur dan percobaan

kimia ini adalah para pelajar SMA khususnya jurusan IPA mata pelajaran

kimia.

30

3.2. Perancangan Perangkat Lunak

3.2.1. Rancangan Storyboard

Berikut ini rancangan storyboard tampilan animasi interaktif unsur dan

percobaan kimia.

Tabel III.1.

Storyboard Splash Screen Animasi Interaktif Unsur dan Percobaan Kimia

VISUAL SKETSA AUDIO

Dalam frame ini

terdapat tampilan

pembuka sebelum

masuk ke layout menu

utama.

Musik:

Tidak ada

Gambar Splash Screen

31

Tabel III.2.

Storyboard Menu Utama Animasi Interaktif Unsur dan Percobaan Kimia

VISUAL SKETSA AUDIO

Dalam frame ini

terdapat 6 tombol menu

yang bisa dipilih antara

lain: tombol keluar (X)

berfungsi untuk keluar

dari menu utama,

tombol Play berfungsi

menampilakan layout

menu pilihan

permainan, tombol

Tabel Periodik

berfungsi menampilkan

layout menuberbentuk

tabel periodik, tombol

Daftar Unsur, berfungsi

menampilkan layout

menu unsur

berdasarkan golongan

dari tabel periodik,

tombol Percobaan

Kimia berfungsi

menampilkan layout

menu pilihan animasi,

tombol informasi (I)

menampilkan layout

menu informasi

pengembangnya.

Musik:

Tombol.ogg

X Logo

BSI

PLAY

Judul game

Judul game

Daftar Unsur

Percobaan Kimia

Tabel Periodik

Logo

Gambar

Logo

Gambar

Logo

Gambar

Logo

Gambar

i

32

Tabel III.3.

Storyboard Layout Menampilkan Menu Tabel Periodik

VISUAL SKETSA AUDIO

Dalam frame ini berisi

tentang tabel periodik

dimana setiap kotak

berisi gambar unsur

masing-masing, bentuk

posisi tabel periodik

adalah landscape. Jika

kotak tersebut dipilih

maka akan menuju ke

layout berikutnya yang

berisi penjelasan unsur

dari tabel periodik

tersebut. Tombol

kembali berfungi untuk

kembali ke layout menu

utama.

Musik:

Tombol.ogg

33

Tabel III.4.

Storyboard Layout Menampilkan Penjelasan Tabel Periodik

VISUAL SKETSA AUDIO


tentang gambar unsur

yang dipilih dari tabel

periodik. Kemudian

terdapat penjelesan tiap-

tiap unsur yang dipilih

dari tabel periodik.

Penjelasan unsur

berbentuk dragdrob

yang bisa ditarik

kebawah dan keatas.

Tombol kembali

berfungi untuk kembali

ke layout menu tabel

periodik.

Musik:

Tombol.ogg

Gambar Unsur

<<

Penjelasan Unsur

34

Tabel III.5.

Storyboard Layout Menampilkan Menu Daftar Unsur

VISUAL SKETSA AUDIO


tentang daftar unsur


unsur periodik dimana

setiap kotak berisi

gambar unsur


masing-masing. Jika

kotak tersebut dipilih

maka akan menuju ke

layout berikutnya yang

berisi penjelasan unsur.

Tombol lanjut (>>)

berfungsi menuju ke

menu layout golongan

unsur lainnya. Tombol

kembali berfungi untuk


utama.

Musik:

Tombol.ogg

i

Golongan Unsur

>>

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

35

Tabel III.6.

Storyboard Layout Menampilkan Menu Percobaan Kimia

VISUAL SKETSA AUDIO

Dalam frame ini

terdapat 3 tombol

pilihan animasi yang

bisa dipilih dimana

setiap animasi memiliki

animasi yang berbeda.

Setiap animasi memiliki

karakteristik animasi itu

sendiri. Tombol kembali

(<<) berfungi untuk


utama.

Musik:

Tombol.ogg

Pilihan Animasi

<<

Pilihan Animasi

Pilihan Animasi

Logo

Gambar

Logo

Gambar

Logo

Gambar

36

Tabel III.7.

Storyboard Layout Menampilkan Animasi PH Larutan

VISUAL SKETSA AUDIO


tentang animasi PH

larutan, cara kerjanya

dragdrob kertas lakmus

merah maupun biru

kedalam larutan yang

disediakan untuk

mengetahui perubahan

warna pada kertas

lakmus merah maupun

biru. Setelah kertas

lakmus dimasukan

kedalam larutan akan

muncul menu pop up

penjelasan kertas

lakmus tersebut.

Tombol kembali (<<)


ke layout menu pilihan

animasi.

Musik:

Tombol.ogg

<<

larutan larutan larutan larutan

Lakmus biru Lakmus mer

ah

37

Tabel III.8.

Storyboard Layout Menampilkan Menu Play

VISUAL SKETSA AUDIO

Dalam frame ini


yang bisa dipilih antara

lain: tombol Quiz

berfungsi menampilkan

layout menu motivasi

untuk memulai

permainan quiz, tombol

Tebak gambar berfungsi

menampilkan layout

menu level untuk

memulai permainan

tebak gambar, tombol

(X) berfungsi kembali

ke layout menu utama.

Musik:

Tombol.ogg

X

Quiz

Tebak Gambar

38

Tabel III.9.

Storyboard Layout Menampilkan Menu Motivasi

VISUAL SKETSA AUDIO

Dalam frame ini

menampilkan text

bertuliskan motivasi

sebelum memulai

permaianan quiz.

Kemudian terdapat 1

tombol menu yang bisa

dipilih yaitu tombol

lanjut (>>) berfungsi

menampilkan layout

menu permainan quiz.

Musik:

Tombol.ogg

Logo

Gambar

loading

>>

Text motivasi

Logo

Gambar

Text Nama

39

Tabel III.10.

Storyboard Layout Menampilkan Permaianan Quiz

VISUAL SKETSA AUDIO


tentang pertanyaan soal

quiz dalam menjawab

soal diberikan waktu 60

detik untuk menjawab

soal, jika jawaban benar

maka pilihan jawaban

akan berwarna hijau dan

mendapatkan skor 10

poin, dan jika jawaban

salah maka pilihan

jawaban berwarna

merah juga mengurangi

3 kali kesempatan

bermaian dan tidak

mendapatkan poin.

tombol next (>>)

berfungsi melanjutkan

kesoal berikutnya,

tombol kembali

berfungsi untuk

mengakhiri permaianan

quiz dan kembali

kelayout menu utama.

Musik:

Tombol.ogg

Benar.ogg

Salah.ogg

Waktu

Skor

Pertanyaan

Next >>

A. Pilihan Jawaban

B. Pilihan Jawaban

C. Pilihan Jawaban

D. Pilihan Jawaban

i

40

Tabel III.11.

Storyboard Layout Menampilakan Nilai Skor Permainan Quiz

VISUAL SKETSA AUDIO

Dalam frame ini

menampilakan skor dari

permaianan quiz, yaitu

skor pertama dan skor

tertinggi. Kemudian


yang bisa dipilih yaitu

tombol mulai berfungsi

memulai lagi permainan

quiz, tombol kembali

berfungsi untuk kembali

kelayout menu utama.

Musik:

Tombol.ogg

Text Nama

Skor Pertama

Nilai Skor Pertama

Skor Tertinggi

Nilai Skor Tertinggi

i

41

Tabel III.12.

Storyboard Layout Menampilkan Menu Pilihan Level Tebak Gambar

VISUAL SKETSA AUDIO

Dalam frame ini

menampilkan pilihan

level sebelum memulai

permainan. Jika level

awal terselesaikan maka

akan otomatis level yang

terkunci akan terbuka

untuk lanjut kelevel

berikutnya Kemudian


yang bisa dipilih yaitu

tombol riset berfungsi

meriset kembali

tampilan level

ketampilan awal, tombol

kembali berfungsi untuk

kembali kelayout menu

utama.

Musik:

Tombol.ogg

<<

Level 1

Level 2

Level 3

Level 4

Level 5

42

Tabel III.13.

Storyboard Layout Menampilkan Permainan Tebak Gambar

VISUAL SKETSA AUDIO


tentang permainan tebak

gambar. Text clue

berfungsi untuk

memberikan gambaran

yang akan dijawab.

Untuk menjawab soal

gambar disediakan text

jawaban untuk

menjawab soal gambar.

Tombol kirim berfungsi

mengirim text jawaban

yang di isi, jika jawaban

benar maka objek

gambar benar akan

muncul. Kemudian jika

jawaban salah maka

objek gambar salah akan

muncul dan juga

mengurangi 3 kali

kesempatan bermaian.

tombol kembali

berfungsi untuk

mengakhiri permaianan

tebak gambar dan

kembali kelayout menu

level.

Musik:

Tombol.ogg

Benar.ogg

Salah.ogg

Text Clue

Gambar

Kirim

i

Text Jawaban

Gambar

Benar

Gambar

Salah

43

Tabel III.14.

Storyboard Layout Menampilkan Menu Informasi

VISUAL SKETSA AUDIO


tentang text informasi

animasi interaktif unsur

dan percobaan kimia,

serta tujuan

dikembangkannya

animasi dan game untuk

pera pelajar SMA.

Tombol kembali (<<)


ke layout menu pilihan

animasi.

Musik:

Tombol.ogg

<<

Text Informasi

Logo

BSI

44

3.2.2. Rancangan Antar Muka

Rancangan antar muka (interface) menjelaskan yang terdapat pada animasi

interaktif unsur dan percobaan kimia.

1. Rancangan TampilanSplash Screen

Tampilan ini berisi gambar splash screen beberapa detik untuk masuk

kehalaman layout menu utama.

Gambar III.1. Rancangan Antarmuka Splash Screen

Gambar Splash Screen

45

2. Rancangan Tampilan Menu Utama

Layout menu utama ini berisi judul, tombol play untuk menampilkan pilihan

menu layout permainan seperti quiz dan tebak gambar yang akan

dimainkan, tombol tabel periodik untuk menampilkan layout menu tabel

periodik, tombol daftar unsur untuk menampilkan layout unsur berdasarkan

golongan dari tabel periodik. Tombol keluar untuk menampilkan layout

menu pilihan konfirmasi keluar.

Gambar III.2. Rancangan Antarmuka Tampilan Menu Utama

X Logo

BSI

PLAY

Judul game

Judul game

Tabel Periodik

Daftar Unsur

Percobaan Kimia

Logo

Gambar

Logo

Gambar

Logo

Gambar

Logo

Gambar

i

46

3. Rancangan Tampilan Menu Tabel Periodik

Pada layout menu tabel periodik ini berisi tentang tabel periodik dimana

setiap kotak berisi gambar unsur masing-masing, bentuk posisi tabel

periodik adalah landscape. Jika kotak tersebut dipilih maka akan menuju ke

layout berikutnya yang berisi penjelasan unsur dari tabel periodik tersebut.

Tombol kembali berfungi untuk kembali ke layout menu utama.

Gambar III.3. Rancangan Antarmuka Tampilan Menu Tabel Periodik

47

4. Rancangan Tampilan Penjelasan Tabel Periodik

Pada layout penjelasan tabel periodik ini berisi tentang gambar unsur yang

dipilih dari tabel periodik. Kemudian terdapat penjelesan tiap-tiap unsur

yang dipilih dari tabel periodik. Penjelasan unsur berbentuk dragdrob yang

bisa ditarik kebawah dan keatas. Tombol kembali berfungi untuk kembali ke

layout menu tabel periodik.

Gambar III.4. Rancangan Antarmuka Tampilan Penjelasan Tabel Periodik

Gambar Unsur

<<

Penjelasan Unsur

48

5. Rancangan Tampilan Menu Daftar Unsur

Pada layoutmenu daftar unsur ini berisi tentang daftar unsur berdasarkan

golongan unsur periodik dimana setiap kotak berisi gambar unsur

berdasarkan golongan masing-masing. Jika kotak tersebut dipilih maka akan

menuju ke layout berikutnya yang berisi penjelasan unsur. Tombol lanjut

(>>) berfungsi menuju ke menu layout golongan unsur lainnya.Tombol

kembali berfungi untuk kembali ke layout menu utama.

Gambar III.5. Rancangan Antarmuka Tampilan Menu Daftar Unsur

i

Golongan Unsur

>>

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

Gambar

unsur

49

6. Rancangan Tampilan Menu Percobaan Kimia

Pada layout menu percobaan kimia ini terdapat 3 tombol pilihan animasi

yang bisa dipilih dimana setiap animasi memiliki animasi yang

berbeda.Setiap animasi memiliki karakteristik animasi itu sendiri.Tombol

kembali (<<) berfungi untuk kembali ke layout menu utama.

Gambar III.6. Rancangan Antarmuka Tampilan Menu Percobaan Kimia

Pilihan Animasi

<<

Pilihan Animasi

Pilihan Animasi

Logo

Gambar

Logo

Gambar

Logo

Gambar

50

7. Rancangan Tampilan Animasi PH Larutan

Pada layout menu animasi PH larutan ini berisi tentang animasi PH larutan,

cara kerjanya dragdrob kertas lakmus merah maupun biru kedalam larutan

yang disediakan untuk mengetahui perubahan warna pada kertas lakmus

merah maupun biru. Setelah kertas lakmus dimasukan kedalam larutan akan

muncul menu pop up penjelasan kertas lakmus tersebut. Tombol kembali

(<<) berfungi untuk kembali ke layout menu pilihan animasi.

Gambar III.7. Rancangan Antarmuka Tampilan Animasi PH Larutan

<<

larutan larutan larutan larutan

Lakmus biru Lakmus merah

51

8. Rancangan Tampilan Menu Pilihan Play

Pada layout menu pilihan play ini berfungsi menampilkan pilihan permainan

yaitu permainan quiz dan tebak gambar. Tombol quiz berfungsi

menampilkan layout menu motivasi untuk memulai permainan quiz, tombol

Tebak gambar berfungsi menampilkan layout menu level untuk memulai

permainan tebak gambar, tombol (X) berfungsi kembali ke layout menu

utama.

Gambar III.8. Rancangan Antarmuka Tampilan Menu Pilihan Play

X

Quiz

Tebak Gambar

52

9. Rancangan Tampilan Menu Motivasi

Layout menu motivasi ini menampilkan text bertuliskan motivasi sebelum

memulai permaianan quiz. Kemudian terdapat 1 tombol menu yang bisa

dipilih yaitu tombol lanjut (>>) berfungsi menampilkan layout menu

permainan quiz.

Gambar III.9. Rancangan Antarmuka Tampilan Menu Motivasi

Logo

Gambar

loading

>>

Text motivasi

Logo

Gambar

Text Nama

53

10. Rancangan Tampilan Permainan Quiz

Layout permainan quiz berisi tentang pertanyaan soal quiz, dalam menjawab

soal diberikan waktu 60 detik untuk menjawab soal, jika jawaban benar

maka pilihan jawaban akan berwarna hijau dan mendapatkan skor 10 poin,

dan jika jawaban salah maka pilihan jawaban berwarna merah, juga

mengurangi 3 kali kesempatan bermaian dan tidak mendapatkan poin.

tombol next (>>) berfungsi melanjutkan kesoal berikutnya, tombol kembali

berfungsi untuk mengakhiri permaianan quiz dan kembali ke layout menu

utama.

Gambar III.10. Rancangan Antarmuka Tampilan Permainan Quiz

Waktu

Skor

Pertanyaan

Next >>

B. Pilihan Jawaban

C. Pilihan Jawaban

E. Pilihan Jawaban

F. Pilihan Jawaban

i

54

11. Rancangan Tampilan Nilai Skor Permainan Quiz

Pada layout nilai skor permainan quiz ini menampilakan skor dari

permaianan quiz, yaitu skor pertama dan skor tertinggi. Kemudian terdapat

2 tombol menu yang bisa dipilih yaitu tombol mulai berfungsi memulai lagi

permainan quiz, tombol kembali berfungsi untuk kembali ke layout menu

utama.

Gambar III.11. Rancangan Antarmuka Tampilan Nilai Skor Permainan

Quiz

Skor Pertama

Nilai Skor Pertama

Skor Tertinggi

Nilai Skor Tertinggi

i

55

12. Rancangan Tampilan Menu Pilihan Level Tebak Gambar

Layout menu pilihan level tebak gambar ini menampilkan pilihan level

sebelum memulai permainan tebak gambar. Jika level awal terselesaikan

maka akan otomatis level yang terkunci akan terbuka untuk lanjut ke level

berikutnya Kemudian terdapat 2 tombol menu yang bisa dipilih yaitu

tombol riset berfungsi meriset kembali tampilan level ketampilan awal,

tombol kembali berfungsi untuk kembali ke layout menu utama.

Gambar III.12. Rancangan Antarmuka Tampilan Menu Pilihan Level Tebak

Gambar

<<

Level 1

Level 2

Level 3

Level 4

Level 5

56

13. Rancangan Tampilan Permainan Tebak Gambar

Layout permainan tebak gambar ini berisi tentang permainan tebak gambar.

Text clue berfungsi untuk memberikan gambaran yang akan dijawab. Untuk

menjawab soal gambar, disediakan text jawaban untuk menjawab soal

gambar. Tombol kirim berfungsi mengirim text jawaban yang di isi, jika

jawaban benar maka objek gambar benar akan muncul. Kemudian jika

jawaban salah maka objek gambar salah akan muncul dan juga mengurangi

3 kali kesempatan bermaian. tombol kembali berfungsi untuk mengakhiri

permaianan tebak gambar dan kembali ke layout menu level.

Gambar III.13. Rancangan Antarmuka TampilanPermainan Tebak Gambar

Text Clue

Gambar

Kirim

i

Text Jawaban

Gambar

Benar

Gambar

Salah

57

14. Rancangan TampilanMenu Informasi

Layout menu ini berisi tentang text informasi animasi interaktif unsur dan

percobaan kimia, serta tujuan dikembangkannya animasi dan game untuk

pera pelajar SMA. Tombol kembali (<<) berfungi untuk kembali ke layout

menu pilihan animasi.

Gambar III.14. Rancangan Antarmuka Tampilan Menu Informasi

<<

Text Informasi

Logo

BSI

58

3.3. Implementasi dan Pengujian Unit

3.3.1. Implementasi

1. Tampilan Splash Screen

Tampilan ini berisi gambar splash screen beberapa detik untuk masuk ke

halaman layout menu utama.

Gambar III.15. Tampilan Splash Screen

59

2. Rancangan Tampilan Menu Utama

Layout menu utama ini berisi judul, tombol tabel periodik untuk

menampilkan layout menu tabel periodik, tombol daftar unsur untuk

menampilkan layout unsur berdasarkan golongan dari tabel periodik, tombol

percobaan kimia untuk menampilkan layout pilihan animasi, tombol play

untuk menampilkan pilihan menu layout permainan seperti quiz dan tebak

gambar yang akan dimainkan,. Tombol keluar untuk menampilkan layout

menu pilihan konfirmasi keluar.

Gambar III.16. Tampilan Menu Utama

60

3. Tampilan Menu Tabel Periodik

Pada layout menu tabel periodik ini berisi tentang tabel periodik dimana

setiap kotak berisi gambar unsur masing-masing, bentuk posisi tabel

periodik adalah landscape. Jika kotak tersebut dipilih maka akan menuju ke

layout berikutnya yang berisi penjelasan unsur dari tabel periodik tersebut.

Tombol kembali berfungi untuk kembali ke layout menu utama.

Gambar III.17. Tampilan Menu Tabel Periodik

61

4. Tampilan Penjelasan Tabel Periodik

Pada layout penjelasan tabel periodik ini berisi tentang gambar unsur yang

dipilih dari tabel periodik. Kemudian terdapat penjelesan tiap-tiap unsur

yang dipilih dari tabel periodik. Penjelasan unsur berbentuk dragdrob yang

bisa ditarik kebawah dan keatas. Tombol kembali berfungi untuk kembali ke

layout menu tabel periodik.

Gambar III.18. Tampilan Penjelasan Tabel Periodik

62

5. Tampilan Menu Daftar Unsur

Pada layout menu daftar unsur ini berisi tentang daftar unsur berdasarkan

golongan unsur periodik dimana setiap kotak berisi gambar unsur

berdasarkan golongan masing-masing. Jika kotak tersebut dipilih maka akan

menuju ke layout berikutnya yang berisi penjelasan unsur. Tombol lanjut

(>>) berfungsi menuju ke menu layout golongan unsur lainnya.Tombol

kembali berfungi untuk kembali ke layout menu utama.

Gambar III.19. Tampilan Menu Daftar Unsur

63

6. Tampilan Menu Percobaan Kimia

Pada layout menu percobaan kimia ini terdapat 3 tombol pilihan animasi

yang bisa dipilih dimana setiap animasi memiliki animasi yang

berbeda.Setiap animasi memiliki karakteristik animasi itu sendiri. Tombol

kembali (<<) berfungi untuk kembali ke layout menu utama.

Gambar III.20. Tampilan Menu Percobaan Kimia

64

7. Tampilan Animasi PH Larutan

Pada layout menu animasi PH larutan ini berisi tentang animasi PH larutan,

cara kerjanya dragdrob kertas lakmus merah maupun biru kedalam larutan

yang disediakan untuk mengetahui perubahan warna pada kertas lakmus

merah maupun biru. Setelah kertas lakmus dimasukan kedalam larutan akan

muncul menu pop up penjelasan kertas lakmus tersebut. Tombol kembali

(<<) berfungi untuk kembali ke layout menu pilihan animasi.

Gambar III.21. Tampilan Animasi PH Larutan

65

8. Tampilan Menu Pilihan Play

Pada layout menu pilihan play ini berfungsi menampilkan pilihan permainan

yaitu permainan quiz dan tebak gambar. Tombol quiz berfungsi

menampilkan layout menu motivasi untuk memulai permainan quiz, tombol

Tebak gambar berfungsi menampilkan layout menu level untuk memulai

permainan tebak gambar, tombol (X) berfungsi kembali ke layout menu

utama.

Gambar III.22. Tampilan Pilihan Play

66

9. Tampilan Menu Motivasi

Layout menu motivasi ini menampilkan text bertuliskan motivasi sebelum

memulai permaianan quiz, kemudian terdapat 1 tombol menu yang bisa

dipilih yaitu tombol lanjut (>>) berfungsi menampilkan layout menu

permainan quiz.

Gambar III.23. Tampilan Menu Motivasi

67

10. Tampilan Permainan Quiz

Layout permainan quiz berisi tentang pertanyaan soal quiz, dalam menjawab

soal diberikan waktu 60 detik untuk menjawab soal, jika jawaban benar

maka pilihan jawaban akan berwarna hijau dan mendapatkan skor 10 poin,

dan jika jawaban salah maka pilihan jawaban berwarna merah, juga

mengurangi 3 kali kesempatan bermaian dan tidak mendapatkan poin.

tombol next (>>) berfungsi melanjutkan kesoal berikutnya, tombol kembali

berfungsi untuk mengakhiri permaianan quiz dan kembali ke layout menu

utama.

Gambar III.24. Tampilan Permainan Quiz

68

11. Tampilan Nilai Skor Permainan Quiz

Pada layout nilai skor permainan quiz ini menampilakan skor dari

permaianan quiz, yaitu skor pertama dan skor tertinggi. Kemudian terdapat

2 tombol menu yang bisa dipilih yaitu tombol mulai berfungsi memulai lagi

permainan quiz, tombol kembali berfungsi untuk kembali ke layout menu

utama.

Gambar III.25. Tampilan Nilai Skor Permainan Quiz

69

12. Tampilan Menu Pilihan Level Tebak Gambar

Layout menu pilihan level tebak gambar ini menampilkan pilihan level

sebelum memulai permainan tebak gambar. Jika level awal terselesaikan

maka akan otomatis level yang terkunci akan terbuka untuk lanjut ke level

berikutnya Kemudian terdapat 2 tombol menu yang bisa dipilih yaitu

tombol riset berfungsi meriset kembali tampilan level ketampilan awal,

tombol kembali berfungsi untuk kembali ke layout menu utama.

Gambar III.26. Tampilan Menu Pilihan Level Tebak Gambar

70

13. Tampilan Permainan Tebak Gambar

Layout permainan tebak gambar ini berisi tentang permainan tebak gambar.

Text clue berfungsi untuk memberikan gambaran yang akan dijawab. Untuk

menjawab soal gambar, disediakan text jawaban untuk menjawab soal

gambar. Tombol kirim berfungsi mengirim text jawaban yang di isi, jika

jawaban benar maka objek gambar benar akan muncul. Kemudian jika

jawaban salah maka objek gambar salah akan muncul dan juga mengurangi

3 kali kesempatan bermaian. tombol kembali berfungsi untuk mengakhiri

permaianan tebak gambar dan kembali ke layout menu level.

Gambar III.27. Tampilan Permainan Tebak Gambar

71

14. Tampilan Menu Informasi

Layout menu ini berisi tentang text informasi animasi interaktif unsur dan

percobaan kimia, serta tujuan dikembangkannya animasi dan game untuk

pera pelajar SMA. Tombol kembali (<<) berfungi untuk kembali ke layout

menu pilihan animasi.

Gambar III.28. Tampilan Menu Informasi

72

3.3.2. Pengujian Unit

1. Blackbox Testing

Pengujian terhadap program yang dibuat menggunakan blackbox testing

yang fokus terhadap proses masukan dan keluaran program.

Pengujian Unit :

Tabel III.15.

Hasil Pengujian Black Box Testing

Input/Even Proses Output/Next

Stage

Hasil

Pengujian

Tombol

“Tabel

Periodik”

Menampilkan

MenuTabel

Periodik

Sesuai

Tombol

“Daftar

Unsur”

Menampilkan

Menu Daftar

Unsur

Sesuai

Tombol

“Percobaan

Kimia”

Menampilkan

Menu Pilihan

Animasi

Sesuai

Tombol

“Play”

Menampilkan

Menu Pilihan

Permainan

Sesuai

73

Tabel III.16.

Hasil Pengujian (Lanjutan 1)


Stage

Hasil

Pengujian

Tombol

“Informasi”

Menampilkan

Menu

Informasi

Sesuai

Tombol

“Keluar

(X)”

Menampilkan

Menu

Konfirmasi

Keluar

Sesuai

Tombol

“Permaianan

Quiz”

Menampilkan

Menu

Motivasi

Sesuai

Tombol

“Permainan

Tebak

Gambar”

Menampilkan

Menu Level

Sesuai

Tombol

“Kembali

(<<)”

Kembali Ke

Menu

Sebelumnya

Sesuai

Tombol

“Pilihan

Unsur Tabel

Periodik”

Menampikan

Menu

Penjelasan

Tabel

Periodik

Sesuai

74

Tabel III.17.

Hasil Pengujian (Lanjutan 2)


Stage

Hasil

Pengujian

Tombol

“Pilihan

Daftar

Unsur ”

Menampikan

Menu

Penjelasan

Daftar unsur

Sesuai

Tombol

“Riset”

Menampikan

Level

Ketamapilan

Semula

Sesuai

Tombol

“Pilihan

Level”

Menampilkan

Permainan

Tebak

Gambar

Sesuai

Tombol

“PH

Larutan”

Menampilkan

Animasi PH

Larutan

Sesuai

Tombol

“Menjawab

Quiz”

Menjawab

Soal, Dan

Menampilkan

Keterangan

Benar Atau

Salah

Sesuai

Tombol

“Keluar

Dari Quiz”

Keluar Dari

Qiuz, Dan

Kembali Ke

Menu

Sebelumnya

Sesuai

75

2. Penerimaan user terhadap animasi intrakatif unsur dan percobaan kimia

pertanyaan kuesioner dan grafiknya :

Tabel III.18.

Pengujian kuesioner

BINA SARANA INFORMATIKA

KUESIONER

Aplikasi Animasi Interaktif Unsur Dan

Percobaan Kimia

Untuk Mengetahui Pernerimaan User Terhadap Animasi Interaktif Unsur Dan Percobaan Kimia Kami sangat

berterima kasih apabila anda berkenan untuk meluangkan waktu mengisi kuesioner ini.

Profesi : Pelajar ( ) Guru( )

Umur :

Jenis Kelamin : ( ) Laki – Laki ( ) Perempuan

Berilah tanda centang ( √ ) pada kolom di masing-masing pernyataan di bawah ini yang menurut anda

sesuai dengan yang anda rasakan setelah mencoba Animasi Interakif Unsur Dan Percobaan Kimia.

SS : Sangat Setuju

S : Setuju

TS : Tidak Setuju

STS : Sangat Tidak Setuju

No Pertanyaan SS S TS STS

Tampilan Aplikasi

1.

Tampilan aplikasi Animasi Interakif Unsur Dan Percobaan Kimiasangat

menarik untuk dimainkan.

2. Warna pada aplikasi Animasi Interakif Unsur Dan Percobaan Kimia tidak

membosankan.

3. Tampilan aplikasi Animasi Interakif Unsur Dan Percobaan Kimia mudah

dipahami dan mudah untuk dimainkan.

Tujuan Aplikasi

4. Aplikasi Animasi Interakif Unsur Dan Percobaan Kimia dapat mengukur

kemampuan dalam menguasai mata pelajaran wajib Nasional.

5. Aplikasi Animasi Interakif Unsur Dan Percobaan Kimia dapat meningkatkan

kemampuan belajar siswa-siswi SMA.

6.

Aplikasi Animasi Interakif Unsur Dan Percobaan Kimia dapat mengetahui

peningkatan kemampuan belajar siswa-siswi SMA.

7. Aplikasi Animasi Interakif Unsur Dan Percobaan Kimi dapat digunakan

sebagai media belajar yang menyenangkan.

(Kemudahan penggunaan) User Friendly

8. Bentuk tombol pada aplikasi Animasi Interakif Unsur Dan Percobaan Kimia

mudah di pahami.

9. Aplikasi Animasi Interakif Unsur Dan Percobaan Kimia ini sangat

membantu pada waktu luang.

10. Aplikasi Animasi Interakif Unsur Dan Percobaan Kimia mudah untuk

dioperasikan.

76

Tabel III.19.

Rekapitulasi Jawaban Kuesioner Tampilan Aplikasi

Tampilan

Aplikasi SS S TS STS Jumlah

Pertanyaan 1 6 4 0 0 10



Total 19 11 0 0 30

Persentase 63,33% 36,67% 0 0 100%

Tabel III.20.

Rekapitulasi Jawaban Kuesioner Tujuan Aplikasi

Tampilan

Aplikasi SS S TS STS Jumlah





Total 25 15 0 0 40

Persentase 62,5% 37,5% 0 0 100%

77

Tabel III.21.

Rekapitulasi Jawaban Kuesioner Kemudahan Pengguna

Kemudahan

Pengguna SS S TS STS Jumlah




Total 18 12 0 0 30

Persentase 60% 40% 0 0 100%

Gambar III.29. Tampilan Grafik Kuesioner Responden

Dari hasil jawaban responden pada kuesioner pernerimaan user terhadap

aplikasi animasi interaktif unsur dan percobaan kimia diuji menggunakan

kuesioner dengan 10 pertanyaan dari 10 responden. Pada kategori tampilan

pertanyaan (1) mendapat respon sangat setuju 60% dan setuju 40% pengguna

0

1

2

3

4

5

6

7

8

SS

S

TS

STS

78

merasa aplikasi menarik untuk dimainkan, pada pertanyaan (2) responden

merespon 70% sangat setuju dan setuju 30% warna pada aplikasi animasi interakif

unsur dan percobaan kimia tidak membosankan, dan pada pertanyaan (3)

responden merespon sangat setuju 60% dan setuju 40% pada tampilan aplikasi

animasi interakif unsur dan percobaan kimia mudah dipahami dan mudah untuk

dimainkan.

Pada kategori tujuan aplikasi, pertanyaan (4) reponden merespon sangat

setuju 60% setuju 40% pada aplikasi animasi interakif unsur dan percobaan kimia

dapat mengukur kemampuan dalam menguasai mata pelajaran wajib Nasional,

pertanyaan (5) responden merespon sangat setuju 70% setuju 30% aplikasi

animasi interakif unsur dan percobaan kimia dapat meningkatkan kemampuan

belajar siswa-siswi SMA, pertanyaan (6) reponden merespon sangat setuju 60%

setuju 40% aplikasi animaasi interakif unsur dan percobaan kimia dapat

mengetahui peningkatan kemampuan belajar siswa-siswi SMA, pertanyaan (7)

responden merespon sangat setuju 60% setuju 40% aplikasi animasi interakif

unsur dan percobaan kimi dapat digunakan sebagai media belajar yang

menyenangkan.

Kemudian pada kategori kemudahan pengguna, pertanyaan (8) responden

merespon sangat setuju 40% setuju 60% bentuk tombol pada aplikasi animasi

interakif unsur dan percobaan kimia mudah di pahami. Pertanyaan (9) responden

merespon sangat setuju 70% setuju 30% aplikasi animasi interakif unsur dan

percobaan kimia ini sangat membantu pada waktu luang. pertanyaan (10)

responden merespon sangat setuju 70% setuju 30% aplikasi animasi interakif

unsur dan percobaan kimia mudah untuk dioperasikan.

bab iii pembahasan - repository.bsi.ac.id filepercobaan kimia yaitu salah satunya ph larutan yaitu...

Documents