38 3.1 Analisa Sistem yang dibutuhkan
Pembuatan aplikasi ini membutuhkan beberapa perancangan yang mendukung kerja sistem dan dapat memberi nilai lebih dari Greenfoot itu sendiri. Mulai dari perancangan antarmuka sampai cara kerja sistem itu sendiri. Langkah langkah pembuatan tersebut:
1. Mempersiapkan data yang dibutuhkan seperti image, music dan materi soal dan pertanyaan.
2. Mencari refrensi yang dapat mendukung terbuatnya aplikasi ini 3. Merancang story board untuk aplikasi ini
4. Melakukan eksplorasi Greenfoot dengan fitur-fitur yang sesuai dengan game ini.
3.1.1. Analisa terhadap Antarmuka dan Interaksi di dalam Aplikasi
Pada sistem permainan ini kita memerlukan perangkat lunak yang dapat memudahkan kita untuk membuat dan merancang game sesuai dengan kondisi dan yang identik dengan anak-anak. Anak-anak biasanya sangat cepat merasa bosa dan mereka biasanya memiliki rasa ingin tahu yang besar .
Sebagian besar anak-anak mempunyai minat yang lebih besar terhadap sebuah permainan dari pada sebuah pelajaran. Kebanyakan dari mereka hanya menggunakan waktu di sekolah untuk belajar dan setelah pulang sekolah waktu mereka banyak digunakan untuk bermain dengan teman-teman dirumah dan
biasanya waktu belajr dirumah dilakukan pada malam hari.Setelah seharian berkatifitas tentunya akan mengurangi konterasi anak-anak untuk belajar pada malam harinya.
Untuk menghindari kejadian diatas yang dapat membuat jatuhnya prestasi anak di sekolah,dan memanfaatkan perkembangan teknologi yang ada sekarang. Dengan game ini anak-anak bisa memanfaatkan waktu bermainnya juga untuk belajar. Dengan demikian anak-anak tidak hanya bermain tapi juga belajar, dalam hal ini khususnya pelajaran matematika.sehingga orang tua dan guru juga bisa memunculkan minat belajar kepada anak-anak dengan banyaknya fitur-fitur game ini yang diciptakan untuk menarik minat belajar.
Jenis antarmuka yang digunakan pada aplikasi ini cukup sederhana, yaitu user hanya perlu mencocokan objek soal yang ada pada layar dengan objek jawaban pada layar yang sama. Interaksi yang terjadi pada pencocokan soal dan jawaban ini adalah ketika pada pemilihan objek soal, di mana user melakukan drag kepada salah satu objek soal dan mencocokan dengan jawabannya dengan cara melakukan drop objek soal yang dipilihnya pada objek jawaban yang ada.
3.1.2. Analisa terhadap Teknologi yang dipergunakan untuk Membangun Aplikasi
Pada saat ini yang menimbulkan masalah pada anak-anak untuk belajar adalah karena belajar mungkin bagi mereka membosankan sedangkan bermain membuat mereka senang dan lepas. Dampak dari kegiatan itu tentunya dapat mempengaruhi pola pikir mereka dan membuat prestasi mereka disekolah bisa
menurun. Disini penulis mencoba memasukan pelajaran kedalam permainan anak-anak tersebut dangan memanfaatkan teknologi Greenfoot.
Kenapa penulis memilih teknologi Greenfoot: a. Penulis ingin mengeksplorasi Greenfoot
b. Penulis mencoba menciptakan aplikasi yang mendukung pembelajaran dengan Greenfoot yang belum begitu dikenal banyak orang.
c. Greenfoot memiliki free lisensi
d. Framework Greenfoot sangat mendukung visualisasi dalam bentuk dua dimensi
e. IDE Greenfoot menyediakan bentuk antarmuka yang dapat membuat pengguna dapat berinteraksi dengan objek-objek itu sendiri.
Proses yang akan berjalan pada sistem ini meliputi: A. Masukan (input)
Masukan dari user adalah pemilahan model modul yang ingin dia mainkan( penjulahan, pengurangan, perkalian dan penjumlahan).
B. Proses
Sistem akan memunculkan aplikasi yang dipilih oleh user yang kemudian, user akan berinteraksi langsung terhadap tampilan itu sendiri
C. Keluaran (Output)
Setelah user memilih modul dan memainkan game tersebut, user akan dapat mengukur kemampuannya dalam pelajaran metematika.
Berikut dibawah ini adalah beberapa penjelasan tentang analisis yang akan dibuat: 1. Area Permainan
Pada permainan ini akan dirancang 5 area permainan yang terdiri dari 1 halaman muka dan 4 lagi area yang berbeda pada setiap permainan
2. Objek
Pada aplikasi ini akan memuat banyak objek yang berbeda pada setiap modul permainan, seperti “awan”, ”keju”, ”apel”, ”jerry”, dan ”panda”. Kelima objek ini akan bergerak seseuai dengan sistem yang kemudian melakukan drag and drop oleh user.
3. Musik
Dalam permainan ini akan terdapat beberapa jenis musik yang akan menjadi backsound saat program berjalan dan pembuatan suara saat permainan berakhir.
3.2 Perancangan Sistem
Pada bagian ini penulis akan menjelaskan perancangan sistem yang akan dibuat mulai dari story board, Use case diagaram dan State Transition Diagram. Untuk mendukung aplikasi ini kita akan menggunakan beberapa kelas dalam Greenfoot,diantaranya kelas objek bergerak, drag and drop, dan lain-lain.
3.2.1 Story Board
Story board disini akan menjelaskan perancangan game dan kegiatan sistem saat game dijalankan.
3.2.1.1 Story Board Tampilan muka
Gambar 3.1 Strory board tampilan muka aplikasi Gambar 3.1 Story Board Tampilan Muka Aplikasi
Pada story board ini menjelaskan tampilan awal program yang akan membuat user memilih salah satu modul yang dinginkan oleh user. Tampilan awal ini kita menggunakan background pertama yang berada pada kelas land( world), di dalam kelas ini terdapat 5 background pilihan untuk memainkan modul yang diinginkan oleh user.
Judul Program
Pemilihan modul 1
Pemilihan modul 2
Pemilhan modul 3
3.2.1.2 Story board Game Penjumlahan dan Pengurangan
Gambar 3.2 Story board Game penjumlahan dan pengurangan
Tampilan di atas menampilkan soal, nilai, waktu, jawaban dan backsound. Dari dua game di atas akan menggunakan background 2 dan background 3 yang secara umum sketsa gamenya hampir sama,yang berbeda adalah background pada game ini. Untuk menampilkan background pada game ini penulis menggunakan method “ setBackground “ dan untuk menampilkan setiap backsound pada setiap modul,kita menggunakan ” Greenfoot.playSound("sound")” yang diletakan pada kelas world. Pada kedua tampilan diatas terdapat beberapa objek kelas yang
Soal 1 Soal 2 Soal 4
Soal 7 Soal 9 Jawaban6 Soal 8 Soal 3 Soal 10 Soal 5 Jawaban1 Soal 6 Jawaban9 Jawaban8 Jawaban7 Jawaban5 Jawaban4 Jawaban3 Jawaban2 Jawaban1 Nilai Waktu Memainkan Backsound
ditampikan seperti objek bergerak, drag and drop dan objek Sound. Pergerakan soal dan jawabanya dapat dilihat pada gambar di bawah ini.
Gambar 3.3 Story board pergerakan soal dan jawaban
Tampilan diatas menjelaskan pergerakan soal dan jawaban yang akan terus bergerak sebelum mengalami drag dan drop,dan jika benar maka keduanya akan menghilang. Dalam menampilkan soal dan jawaban di atas penulis menggunakan kelas aktor yang memanfaatkan fitur untuk mengerakan objek yaitu method “ setLocation(intX,intY) ”,pada intX kita tambahkan kode – atau + yang dapat menentukan arah gerak dari soal tersebut sesuai sumbu X.Interaksi user dengan soal dan jawaban akan dijelaskan pada gambar 3.14
Gambar 3.4 Story board drag dan drop
Soal 1 Soal 1 Soal 1
Jawaban
Gambar 3.4 menjelaskan cara kerja sistem, yaitu user langsung memilih soal yang dia pilih dan melakukan drag and drop soal tersebut kejawaban yang benar.Apabila jawabannya benar maka jawaban dan soal akan hilang.Untuk mendrag soal-soal diatas kita akan menggunakan method “Greenfoot.mouseDragged(this)”, method itu sendiri akan berfungsi apabila user
melakukan klik pada soal yang menggunakan method “
Greenfoot.mouseClicked(null) ” yang bermaksud apabila mouse dan soal mengalami pada posisi int X,dan int Y maka objek akan bergerak sesuai dengan pergerakan yang sudah benar. Untuk menghilangkan jawaban di atas, penulis memanfaatkan method “getOneObjectAtOffset(x , y, Aktor.class) “, kemudian menempatkan perintah “removeObject(this)” yang berarti akan menghapus objek yang diinginkan dari area permainan/world.
3.2.1.3 Story Board Game Perkalian
Soal 2
Soal 1 jawaban
Saat soal dan jawaban benar
Gambar 3.5 menjelaskan tampilan muka dari game perkalian, yaitu terdapat soal, waktu, nilai dan jawaban. Yang membedakannya dengan game penjumlahan adalah soal akan bergerak dari atas ke bawah dan apabila sudah terjawab dan pada titik koordinat tertentu barulah soal selanjutnya muncul seperti Gambar 3.6.
Gambar 3.6 Story board sistem pemunculan soal pada game perkalian
Gambar 3.7 Story board munculnya soal-soal selanjutnya
Gambar 3.6 menunjukan kemunculan soal baru jika soal pertama telah berada pada titik koordinat tertentu, sedangkan Gambar 3.7 menggambarkan soal ke 2 akan muncul jika soal sebelumnya telah terjawab dengan benar. Pada gambar
Soal 2 Soal 1 jawaban jawaban jawaban Saat soal (x,y)
diatas kita juga akan menggunakan method “ setLocation(intX,intY) “, tapi disini kode – atau + yang ditambahkan diletakkan pada intY agar objek bergerak sesuai sumbu Y.
Gambar 3.8 Story board drag dan drop pada game perkalian
Gambar 3.8 menjelaskan proses drag and drop yang terjadi pada game perkalian, yaitu soal yang turun dari atas ke bawah akan mengalami drag and drop ke arah objek jawaban yang benar, sehingga dapat memunculkan soal selanjutnya. Sedangkan jawaban yang dibawah dijelaskan lewat gambar di bawah ini.
Gambar 3.9 Story board jawaban pada game perkalian
Objek jawaban yang berada pada bagian bawah layar, yang dipelihatkan pada Gambar 3.9.
Jawaban
Jawaban
Jawaban Jawaban
3.2.1.4 Story board Game Pembagian
Gambar 3.10 Story board tampilan muka game pembagian
Gambar 3.10 adalah game pembagian, yaitu objek soal yang di atas akan bergerak ke arah kanan dan objek soal yang di bawah akan begerak sebaliknya. Sementara untuk objek jawaban di sini berfungsi juga sebagai waktu yang apabila mencapai titik koordinat akhir di pojok kanan akan mengakhiri permainan,Untuk lebih jelasnya lihat gambar di bawah ini.
Soal Soal Soal Jawaban/waktu Soal Soal Soal Nilai
Gambar 3.11 Story board sistem waktu pada game pembagian
Gambar 3.11 menunjukan perbedaan dalam penentuan waktu game ini dengan yang lainnya. Yaitu di sini kita memanfaatkan method “ getX=Kordinat x”,agar apabila objek waktu berada pada titik tersebut maka game akan berakhir. Sedangkan untuk proses Drag and Drop sama dengan game-game sebelumnya seperti yang ada pada Gambar 3.12.
Gambar 3.12 Story board drag and drop game pembagian Gambar 3.12 Story board drag and drop game pembagian
Soal Soal Soal
Soal
Soal Jawaban
Proses Drag and Drop
Waktu dan jawaban Hasil akhir
Proses yang terjadi
Untuk pergerakan objek soal yang ada terbagi 2 bagian dapat anda lihat pada Gambar 3.13, yaitu pergerakan soalnya sama dengan pergerakan soal lainya.
Gambar 3.13 Story board pergerakan soal pada game pembagian 3.2.1.5 Story Board Sistem Waktu
Dalam penentuan sistem waktu untuk menentukan lamanya waktu yang akan digunakan user untuk menyelesaikan game, penulis menggunakan objek waktu yang digerakan dari kanan kekiri. Tapi sistem ini hanya dipakai pada tiga aplikasi game yaitu Penjumlahan, Pengurangan dan Perkalian, sedangkan pada alpikasi game Pembagian sistem waktunya telah dijelaskan di atas. Pada sistem waktu ini kita mencoba menempatakan sebuah objek waktu yang akan melintasi area permainan dari titik koordinat X1 sampai koordinat X2. Method yang digunakan untuk objek ini sama dengan game pembagian. Untuk lebih jelasnya silahkan lihat Gambar 3.14
Gambar 3.14 Story board sistem waktu
Waktu Pergerakan Waktu berakhir
3.2.1.6 Story Board Sistem Nilai
Untuk membuat permainan ini menarik penulis mencoba memberikan nilai kepada user agar dapat mengetahui hasil dari permainan yang dimainkanya.Sistem nilai ini akan bertambah apabila user dapat mencocokan jawaban dan soal yang benar dengan memanfaatkan method “if(=xxx)” untuk menentukan waktu berakhir dan nilai akan muncul dan ”if(angka=xx)” untuk menentukan nilai tertinggi dari permainan ini. Aplikasi sistemnya dapat dilihat dari gambar berikut.
Gambar 3.15 Story board sistem nilai 3.2.2 Pemodelan Use Case Diagram
Dalam sistem ini Use Case diagram Menjelaskan hubungan antara user dan terhadap sistem.Diagram Use case antara user dan sistem dapat dilihat dari Gambar 3.16
Nilai akan bertambah
Jawaban dan soal cocok
Gambar 3.16 Pemodelan Use Case Diagram
Pada gambar diatas menjelaskan bahwa user langsung dapat berinterkasi langsung dengan sistem aplikasi ini yang berarti user dapat langsung memilih modul-modul permainan, yaitu modul penjumlahan, modul pengurangan, modul perkalian, dan modul pembagian.
3.2.3 Pemodelan State Transition Diagram
Dalam pemodelan aplikasi ini penulis menggunakan pemodelan State Transition Diagram untuk memodelkan perilaku dinamis satu kelas atau objek. State Transition Diagram akan menunjukan urutan-urutan keadaan sesaat (state) yang dilalui sebuah kelas, kejadian yang menyebabkan sebuah transisi dari satu state atau aktivitas ke state lainnya, dan aksi yang menyebabkan perubahan satu state atau aktifitas. State Transition Diagram khususnya digunakan untuk memodelkan taraf-taraf diskrit dari sebuah siklus objek.
Gambar 3.17 Pemodelan State Transition Diagram Game Penjumlahan, Pengurangan dan Perkalian.
Gambar 3.17 menunjukan cara kerja sistem game penjumlahan, pengurangan, dan perkalian,yaitu game dimulai user melakukan drag and drop dari objek soal ke objek jawaban. Jika objek soal didrag kearah objek jawaban yang benar, maka nilai akan bertambah. Namun jika terjadi kesalahan maka game akan tetap berjalan seperti awal. Game akan berakhir jika terjadi dua kejadian, yaitu saat waktu berakhir dan semua soal sudah terjawab dengan benar.
Aplikasi sedang berjalan Objek Soal bergerak Nilai bertambah Drag objek soal
Drop objek soal Start
[ salah ]
[ Benar ]
Kembali keaplikasi Soal dan jawaban
sudah habis Waktu berakhir
Permainan berakhir
Gambar 3.18 Pemodelan State Trasition Diagram Game Pembagian Gambar 3.18 menjelasakan objek jawaban yang berfungsi sebagai waktu dan dapat membuat game berakhir saat berada pada titik yang ditentukan.Selain itu objek jawaban juga akan muncul satu persatu,yaitu saat objek jawaban awal berada pada titik tertentu atau objek jawaban tersebut berhasil dicocokan dengan soal yang benar.
Aplikasi sedang berjalan Soal berada ditiik (x,y) Nilai bertambah Objek soal bergerak Drag Drop [ salah ] [ benar]
[Salah dan soal pertama bergerak kekanan]
Muncul objek soal baru
Kembali ke awal Soal dan jawaban
sudah habis
Soal sampai pada titik (x,y)terakhir