BAB III ANALISA DAN PERANCANGAN. mendukung kerja sistem dan dapat memberi nilai lebih dari Greenfoot itu sendiri.

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN 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 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 38

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

3 40 menurun. Disini penulis mencoba memasukan pelajaran kedalam permainan anakanak 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.

4 41 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 Story Board Story board disini akan menjelaskan perancangan game dan kegiatan sistem saat game dijalankan.

5 Story Board Tampilan muka Pemilihan modul 1 Judul Program Pemilihan modul 2 Pemilhan modul 3 Pemilihan modul 4 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.

6 Story board Game Penjumlahan dan Pengurangan Soal 1 Soal 2 Soal 3 Soal 4 Soal 5 Soal 6 Soal 7 Soal 8 Soal 9 Soal 10 Nilai Memainkan Backsound Waktu 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

7 44 ditampikan seperti objek bergerak, drag and drop dan objek Sound. Pergerakan soal dan jawabanya dapat dilihat pada gambar di bawah ini. Soal 1 Soal 1 Soal 1 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

8 45 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 Story Board Game Perkalian Gambar 3.5 Story board tampilan game perkalian

9 46 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. Soal 2 (x,y) Soal 1 Saat soal jawaban jawaban jawaban Gambar 3.6 Story board sistem pemunculan soal pada game perkalian Soal 2 Soal 1 jawaban Saat soal dan jawaban benar 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

10 47 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.

11 Story board Game Pembagian Soal Soal Soal Soal Soal Soal Nilai /waktu 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.

12 49 Hasil akhir Proses yang terjadi Waktu dan Waktu dan Waktu dan jawaban 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 Soal Soal Soal Soal Proses Drag and Drop Soal Gambar 3.12 Story board drag and drop game pembagian Gambar 3.12 Story board drag and drop game pembagian

13 50 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 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 Hasil dari proses Waktu Pergerakan Waktu berakhir Gambar 3.14 Story board sistem waktu

14 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. Nilai akan bertambah dan soal cocok Gambar 3.15 Story board sistem nilai 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

15 52 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 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.

16 53 Start Waktu berakhir Objek Soal bergerak Aplikasi sedang berjalan Drag objek soal Drop objek soal [ Benar ] [ salah ] Permainan berakhir Nilai bertambah Kembali keaplikasi Soal dan jawaban sudah habis 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.

17 54 Aplikasi sedang berjalan Drag Objek soal bergerak Drop [ salah ] Soal sampai pada titik (x,y)terakhir [Salah dan soal pertama bergerak kekanan] [ benar] Soal berada ditiik (x,y) Muncul objek soal baru Kembali ke awal Nilai bertambah Soal dan jawaban sudah habis 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.