45
BAB III
PERANCANGAN
Aplikasi ini dirancang dengan tujuan untuk membantu anak dalam membantu pembelajaran matematika. Dengan menggunakan tampilan yang menarik dan dengan menggunakan permainan sehingga anak tidak bosan dalam menggunakan aplikasi ini.
Agar aplikasi ini sesuai dengan kurikulum yang berlaku, maka aplikasi ini dibuat dengan berdasarkan kurikulum pendidikan yang terbaru. Selain itu, agar anak-anak bisa lebih mudah memahami pengetahuan yang ada, maka skripsi ini dibuat dengan berkonsultasi dengan guru matematika.
3.1. Flowchart Program
Pada saat user pertama kali menjalankan program, maka akan tertampil halaman login, user bisa memilih untuk membuat ID terlebih dahulu atau tidak. Apabila user memilih untuk membuat ID terlebih dahulu, maka user akan diminta untuk memasukkan ID dan password yang nantinya akan menjadi ID yang baru. Apabila ID yang baru sudah dibuat, maka tampilan akan kembali ke login. Pada saat login, ID dan password akan diperiksa terlebih dahulu, apabila user login dengan ID dan password user, maka user akan masuk ke tampilan menu. Sedangkan apabila user login dengan menggunakan ID dan password admin, maka user akan masuk ke tampilan admin.
Buat id ya
tidak
tidak
Periksa id admin ya
tidak
Apakah id dan
password betul ya
Gambar 3.1. Flowchart untuk Login
Menu
Selesai
Modul Admin Mulai
Login
Input id dan password
Periksa id dan password
Periksa apakah
file ada tidak
ya
Gambar 3.2. Flowchart untuk Menulis Data ke File
Mulai
Cari file di lokasi yang ditentukan
Buat file
Cari akhir penulisan data di file
Tulis data di file
Periksa apakah
file ada tidak
ya
Gambar 3.3. Flowchart untuk Membaca Data dari File
Mulai
Cari file di lokasi yang ditentukan
Kembali ke tampilan sebelumnya (dengan pesan error)
Baca data dari file
Tampilkan data yang dibaca
Apakah ada
Interup ya
tidak
Gambar 3.4. Flowchart Pada Saat Memproses Audio
Yang pertama kali dilakukan pada saat akan memainkan audio adalah mengosongkan memory audio pada variabel terlebih dahulu, baru kemudian meload file suara / audio yang akan dimainkan. Hal ini dilakukan karena XNA memiliki batasan jumlah file audio yang di load pada suatu saat, yaitu kurang lebih 30 suara. Setelah itu suara yang dipilih akan dimainkan. Dan apabila ada
interupt, maka interupt tersebut akan dijalankan terlebih dahulu. Setelah interupt
selesai, maka suara yang sebelumnya terkena interup akan dimainkan lagi dari awal.
Mulai
Kosongkan variabel
Load data suara ke variabel
Mainkan suara yang dipilih
Selesai
3.2. Bagan Program
Berikut adalah bagan dari aplikasi yang dibuat:
Gambar 3.5. Bagan Cara Kerja Pada Saat Aplikasi Mulai Dijalankan
Pada saat aplikasi mulai dijalankan, user akan diminta untuk melakukan login, hal ini dilakukan untuk keamanan data user yang lain. Setelah proses login selesai, data user akan disimpan ke dalam variabel yang disediakan. Setelah data selesai diload, user akan masuk ke menu awal, dimana user diminta untuk memilih 1 dari 3 menu yang ada.
Gambar 3.6. Bagan Cara Kerja Aplikasi Saat User Memilih Teori Pada Pilihan Menu
Gambar 3.7. Bagan Cara Kerja Aplikasi Saat User Memilih Soal-Soal Pada Pilihan Menu
Apabila user memilih soal, maka pertama-tama user akan diminta untuk memilih topik dari soal yang ingin dikerjakan. Setelah memilih topik, maka user akan melihat soal-soal untuk topik yang dipilih. Setelah user selesai mengerjakan soal-soal yang ada, maka hasil dari pengerjaan soal yang dilakukan akan ditampilkan. Setelah itu, maka tampilan akan kembali ke pemilihan topik.
Gambar 3.8. Bagan Cara Kerja Aplikasi Saat User Memilih Permainan Pada Pilihan Menu
3.3. Contoh Program using System; using System.Collections.Generic; using System.Linq; using Microsoft.Xna.Framework; using Microsoft.Xna.Framework.Audio; using Microsoft.Xna.Framework.Content; using Microsoft.Xna.Framework.GamerServices; using Microsoft.Xna.Framework.Graphics; using Microsoft.Xna.Framework.Input; using Microsoft.Xna.Framework.Media; using Microsoft.Xna.Framework.Net; using Microsoft.Xna.Framework.Storage; namespace WindowsGame1 { /// <summary>
/// This is the main type for your game /// </summary>
public class Game1 : Microsoft.Xna.Framework.Game
{
GraphicsDeviceManager graphics; SpriteBatch spriteBatch;
public Game1() {
graphics = new GraphicsDeviceManager(this); Content.RootDirectory = "Content";
}
/// <summary>
/// Allows the game to perform any initialization it needs to before starting to run.
/// This is where it can query for any required services and load any non-graphic
/// related content. Calling base.Initialize will enumerate through any components
/// and initialize them as well. /// </summary>
protected override void Initialize() {
// TODO: Add your initialization logic here
base.Initialize(); }
/// <summary>
/// </summary>
protected override void LoadContent() {
// Create a new SpriteBatch, which can be used to draw textures. spriteBatch = new SpriteBatch(GraphicsDevice);
// TODO: use this.Content to load your game content here }
/// <summary>
/// UnloadContent will be called once per game and is the place to unload
/// all content. /// </summary>
protected override void UnloadContent() {
// TODO: Unload any non ContentManager content here }
/// <summary>
/// Allows the game to run logic such as updating the world, /// checking for collisions, gathering input, and playing audio. /// </summary>
/// <param name="gameTime">Provides a snapshot of timing values.</param>
protected override void Update(GameTime gameTime) {
// Allows the game to exit
if (GamePad.GetState(PlayerIndex.One).Buttons.Back ==
ButtonState.Pressed) this.Exit();
// TODO: Add your update logic here
base.Update(gameTime); }
/// <summary>
/// This is called when the game should draw itself. /// </summary>
/// <param name="gameTime">Provides a snapshot of timing values.</param>
protected override void Draw(GameTime gameTime) {
GraphicsDevice.Clear(Color.CornflowerBlue);
// TODO: Add your drawing code here
base.Draw(gameTime); }}}
Kode 3.1. Diatas adalah kode XNA yang muncul pada saat programmer membuat proyek baru. Dari kode tersebut dapat dilihat bahwa XNA memiliki 5 fungsi utama, yaitu:
a. protected override void LoadContent(), yaitu bagian untuk memasukkan data dari luar ke dalam variabel.
b. protected override void UnloadContent(), yaitu bagian untuk menghapus data yang berada pada variabel.
c. protected override void Initialize(), yaitu bagian dimana programmer melakukan inisialisasi
d. protected override void Update(GameTime gameTime), yaitu bagian dimana programmer menginput perintah-perintah atau fungsi-fungsi yang nantinya akan dipanggil secara terus menerus.
e. protected override void Draw(GameTime gameTime), yaitu bagian dimana programmer menaruh tampilan dari program XNA yang dibuat.
3.4. Setting Program
Setting yang digunakan oleh program ini adalah setting default untuk program XNA pada Window Aplication. Setting tersebut dapat dilihat pada Gambar 3.9.
3.5. Perancangan File
Untuk XNA, perancang tidak bisa menggunakan akses ke database seperti mikrosoft SQL, Opera, dan lain-lain. Sehingga untuk menyimpan data perancang hanya bisa menggunakan XML untuk pengganti database. File XML yang digunakan ada 3 jenis, yaitu:
a. User, file ini berisi data Id dan password milik user.
b. Soal, file ini berisi data soal-soal yang ada. Data didalamnya ditulis dengan digolongkan menjadi soal, pilihan jawaban, dan jawaban c. Hasil, file ini berisi data hasil yang didapat setelah selesai mengerjakan
soal. Data di dalamnya ditulis dengan digolongkan menjadi Id, nilai hasil, waktu pengerjaan, dan topik.
Tabel 3.1. Contoh Database dari File XML User Dalam Bentuk Tabel
Nomer Id Password
1 aaa aaa
2 bbb bbb
Tabel 3.2. Contoh Database dari File XML Soal Dalam Bentuk Tabel
Nomer Soal Pilihan A
Pilihan B
Pilihan C
Pilihan D
Jawaban
1 2+2 = 1 2 3 4 D
Tabel 3.3. Contoh Database dari File XML Hasil Dalam Bentuk Tabel
Nomer Id Topik Waktu Nilai
1 aaa pecahan 09/06/2011
01:19
9
2 aaa pecahan 10/06/2011
21:12