BAB IV PERANCANGAN - · PDF fileModul ini bertugas mengatur sifat-sifat fisika yang mungkin...
Transcript of BAB IV PERANCANGAN - · PDF fileModul ini bertugas mengatur sifat-sifat fisika yang mungkin...
IV-1
BAB IV
PERANCANGAN
Pada Bab IV ini, akan dijelaskan hasil perancangan XGate2D berdasarkan hasil analisis
pada Bab III. Hasil perancangan yang akan dibahas meliputi arsitektur XGate2D,
rancangan modul-modul yang membentuk XGate2D, diagram kelas dan struktur data
yang membentuk masing-masing modul, aksi yang perlu dilakukan oleh pengguna
XGate2D untuk setiap fiturnya, dan perancangan algoritma yang relatif kompleks
sehingga dirasa perlu untuk dijelaskan pada bab ini.
4.1 Arsitektur Game Engine
Gambar IV-1 Arsitektur XGate2D
Seperti judul Tugas Akhir ini, XGate2D dibangun di atas XNA framework. Dengan kata
lain, XGate2D memanfaatkan beberapa fitur yang disediakan oleh XNA framework.
XNA framework sendiri menggunakan DirectX sebagai graphic API untuk melakukan
IV-2
penggambaran sprite (Gambar IV-1). Adapun fitur-fitur XNA framework yang
digunakan oleh XGate2D adalah sebagai berikut:
1. Content Pipeline
Seperti yang telah dijelaskan pada Bab II, content pipeline digunakan untuk
melakukan konversi content yang formatnya tidak kompatibel dengan game agar
menjadi kompatibel dan langsung dapat digunakan pada game. XGate2D
menggunakan fitur ini untuk me-load file gambar dan suara yang akan
digunakan pada suatu game.
2. Rendering
XGate2D menggunakan kelas SpriteBatch XNA untuk menggambar sprite dan
teks ke layar.
3. Input
XGate2D menggunakan kelas input yang disediakan XNA untuk menangani
input dari keyboard, mouse, dan game pad.
4. Audio
XGate2D menggunakan kelas AudioEngine, WaveBank, dan SoundBank, untuk
menambahkan suara pada game.
4.2 Rancangan Modul
Mengacu pada hasil analisis pada Bab III, dilakukan pengelompokkan kelas, interface,
dan enumerasi berdasarkan fitur dan keterkaitan fungsionalitas masing-masing fitur
menjadi beberapa modul. Tabel pengelompokkan ini dapat dilihat pada Tabel IV-1.
Tabel IV-1 Pengelompokkan Kelas pada Setiap Fitur terhadap Modul XGate2D
No. Nama Fitur Modul
1. Input Handler XGate2DCore
2. Animasi XGate2DGraphic
3. GUI XGate2DUserInterface
4. Collision Detection XGate2DPhysic
5. Physics XGate2DPhysic
6. Particle System XGate2DGraphic
7. Tiling Engine XGate2DGraphic
8. Audio XGate2DCore
Modul-modul yang teridentifikasi ini berhubungan satu sama lain, dan diagram
keterhubungan modul-modul ini dapat dilihat pada Gambar IV-2.
IV-3
Gambar IV-2 Rancangan Modul XGate2D
Penjelasan masing-masing modul:
1. XGate2DCore
Modul ini merupakan modul inti XGate2D yang bertugas mengatur jalannya
game yang dibangun di atas XGate2D dan menangani beberapa hal yang umum
terdapat pada game, seperti input, audio, dan sebagainya. Modul ini dapat dibagi
lagi menjadi beberapa sub-modul yang lebih kecil, sebagai berikut:
a. Base
Modul ini bertugas mengatur jalannya game yang dibangun di atas
XGate2D dan mengelola objek-objek yang digunakan untuk
menggambarkan sprite ke layar.
b. Interface
Modul ini berisi interface yang harus diimplementasi oleh semua game yang
dibangun menggunakan XGate2D.
c. Input
Modul ini bertugas menangani input dari input device keyboard, mouse, dan
game pad Xbox360.
IV-4
d. Font
Modul ini bertugas melakukan load dan embed suatu jenis huruf dari suatu
file .spritefont ke dalam XGate2D atau ke dalam game yang dibangun
menggunakan XGate2D.
e. Control
Modul ini bertugas menangani dan membuat representasi objek yang dapat
memegang kontrol atau memegang fokus input. Contoh: text box.
f. Audio
Modul ini bertugas me-load, play, pause, dan stop semua suara dan musik
yang ada pada game yang dibangun menggunakan XGate2D.
g. Debug
Modul ini bertugas mengelola objek-objek yang digambarkan pada layar,
bersama dengan game, ketika game sedang dalam mode debug. Contoh
objek ini adalah penghitung FPS (Frame per Second), penghitung memory
usage, dan sebagainya.
2. XGate2DGraphic
Modul ini bertugas mengelola semua objek yang digambarkan ke layar dan
membuat representasi dunia pada game yang dibangun menggunakan XGate2D.
Modul ini dapat dibagi lagi menjadi beberapa sub-modul yang lebih kecil,
sebagai berikut:
a. Base
Modul ini berisi kelas dasar yang merepresentasikan objek yang digambar ke
layar. Dengan kata lain, pada XGate2D semua objek yang digambarkan ke
layar merupakan turunan dari kelas yang terdapat pada modul ini.
b. Sprite
Modul ini bertugas merepresentasikan objek sprite standar yang dapat
digambarkan ke layar.
c. Animation
Modul ini bertugas merepresentasikan objek sprite yang memiliki animasi
sehingga seolah-olah dapat bergerak.
IV-5
d. Particle
Modul ini bertugas merepresentasikan sistem partikel sebagai model dari
objek-objek abstrak, seperti asap, ledakan, dan sebagainya.
e. TilingEngine
Modul ini bertugas merepresentasikan objek “besar” yang dibentuk oleh
sebuah objek “kecil” yang digambar berulang-ulang.
f. Scene
Modul ini bertugas merepresentasikan dunia pada game yang dibangun
menggunakan XGate2D.
3. XGate2DPhysic
Modul ini bertugas mengatur sifat-sifat fisika yang mungkin dimiliki oleh objek-
objek pada game. Modul ini memiliki sebuah sub-modul Collision yang bertugas
merepresentasikan objek yang dapat “bertabrakan” dengan objek lainnya,
dengan cara mendeteksi adanya tabrakan pada objek-objek tersebut.
4. XGate2DUserInterface
Modul ini berisi objek-objek yang biasanya terdapat pada user interface
program, seperti label dan button. Karena sifatnya yang cukup spesifik, modul
ini tidak dibagi lagi menjadi sub-modul.
4.3 Rancangan Kelas, Interface, dan Enumerasi
Pada bagian ini, akan dijelaskan rancangan kelas, interface, dan enumerasi untuk
masing-masing modul XGate2D. Pembagian modul dapat dilihat pada sub-bab 4.2.
Untuk setiap modul, akan diberikan tabel berisi daftar kelas, interface, dan enumerasi
yang terdapat pada modul tersebut, dan penjelasan rinci masing-masing kelas, interface,
dan enumerasi tersebut akan dijelaskan pada sub-bagian modul tersebut.
Perlu diketahui bahwa terdapat kelas-kelas tambahan pada tahap perancangan yang
tidak terdapat pada rancangan kelas analisis. Ini disebabkan karena pendekatan
perancangan kelas pada tahap analisis dan perancangan agak berbeda, yaitu jika pada
tahap analisis, identifikasi kelas dilakukan melalui pendekatan fitur, sedangkan pada
tahap perancangan, identifikasi kelas dilakukan selain dengan menggunakan rancangan
IV-6
kelas analisis, juga mempertimbangkan aspek non-fungsionalitas sistem sebagai sebuah
game engine.
4.3.1 XGate2DCore
Pada Tabel IV-2 terdapat daftar kelas yang terdapat pada modul XGate2DCore
beserta deskripsi singkat untuk masing-masing kelas.
Tabel IV-2 Daftar Kelas pada Modul XGate2DCore
No. Nama Kelas Deskripsi
1. XGate2DSystem Kelas singleton yang mengatur penciptaan dan inisialisasi objek
game yang sedang dijalankan dan titik awal dari game loop.
Kelas ini tidak terdapat pada rancangan kelas analisis, karena
kelas ini bertugas untuk membentuk game loop pada game, yang
kurang cocok dijadikan sebagai sebuah fitur
2. XGate2DRenderer Kelas yang mengelola objek-objek yang digunakan untuk
menggambarkan semua objek ke layar. Kelas ini tidak terdapat
pada rancangan kelas analisis, karena fungsi kelas ini kurang
cocok untuk dijadikan sebuah fitur, namun sangat diperlukan
oleh sebuah game
3. IGame Interface yang berisi fungsi-fungsi yang harus diimplementasi
oleh kelas representasi game yang dibangun menggunakan
XGate2D
4. XGate2DInput Kelas yang merupakan representasi dari input device game pad
Xbox360
5. XGate2DInputManager Kelas yang mengelola semua input device: keyboard, mouse,
dan game pad Xbox360
6. XGate2DFont Kelas yang merupakan representasi dari font yang dapat
digunakan pada game yang dibangun menggunakan XGate2D.
Kelas ini tidak terdapat pada rancangan kelas analisis, karena
fungsi kelas ini kurang cocok untuk dijadikan fitur, namun
sangat diperlukan oleh sebuah game
7. XGate2DFontManager Kelas yang mengelola semua instance kelas XGate2DFont.
Kelas ini tidak terdapat pada rancangan kelas analisis, karena
fungsi kelas ini kurang cocok untuk dijadikan fitur, namun
sangat diperlukan oleh sebuah game
8. XGate2DControlObject Kelas yang merupakan representasi dari objek yang dapat
menerima kontrol atau fokus input user
9. XGate2DControlManager Kelas yang mengelola semua instance kelas XGate2DControlObject
10. XGate2DAudioManager Kelas yang mengelola semua file suara yang dibutuhkan oleh
game yang dibangun menggunakan XGate2D
11. IProfilerObject Interface yang berisi fungsi-fungsi yang harus diimplementasi
oleh semua objek yang ingin dituliskan oleh programmer ke
layar untuk keperluan debugging. Interface ini dan kelas
implementasinya tidak terdapat pada rancangan kelas analisis
karena berfungsi untuk memenuhi kebutuhan non-fungsional
dari game engine, yaitu debugging
12. XGate2DProfiler Kelas yang mengelola objek-objek yang ingin dituliskan oleh
programmer ke layar untuk keperluan debugging
13. XGate2DFPSCounter Kelas yang digunakan untuk menghitung jumlah frame per
second pada game, merupakan implementasi dari IProfilerObject
IV-7
Diagram kelas, interface, dan enumerasi untuk modul XGate2DCore dapat dilihat
pada Gambar IV-3.
IV-8
Gambar IV-3 Diagram Kelas Modul XGate2DCore
IV-9
4.3.2 XGate2DGraphic
Pada Tabel IV-3 terdapat daftar kelas yang terdapat pada modul XGate2DGraphic
beserta deskripsi singkat untuk masing-masing kelas.
Tabel IV-3 Daftar Kelas pada Modul XGate2DGraphic
No. Nama Kelas Deskripsi
1. XGate2DDrawable Kelas abstrak dasar untuk semua objek yang dapat digambar ke
layar
2. XGate2DSprite Kelas representasi sprite standar yang digambar ke layar
3. EAnimationLoop Enumerasi yang menyatakan jenis-jenis loop animasi
4. EAnimationState Enumerasi yang menyatakan state pada animasi
5. XGate2DAnimationInfo Kelas yang mengelola informasi terkait animasi
6. XGate2DAnimatedSprite Kelas representasi sprite yang dapat memiliki animasi
7. XGate2DParticle Kelas yang berisi atribut, properti, dan fungsi yang dimiliki
sebuah partikel yang menjadi bagian sistem partikel
8. XGate2DParticleSystem Kelas abstrak yang mengatur gerakan partikel-partikel yang
dikelolanya
9. XGate2DTiles Kelas representasi objek sprite besar yang dibentuk oleh sprite
kecil yang digambar berulang-ulang
10. XGate2DSceneManager Kelas yang mengelola instance kelas turunan
XGate2DDrawable dan menggambarkannya ke layar
11. XGate2DWorld Kelas representasi dunia dalam sebuah game
12. XGate2DCamera Kelas representasi kamera yang menentukan bagian mana dari
dunia yang sedang disorot, yakni yang digambarkan ke layar
Diagram kelas, interface, dan enumerasi untuk modul XGate2DGraphic dapat dilihat
pada Gambar IV-4.
IV-10
Gambar IV-4 Diagram Kelas Modul XGate2DGraphic
IV-11
4.3.3 XGate2DPhysic
Pada Tabel IV-4 terdapat daftar kelas yang terdapat pada modul XGate2DPhysic
beserta deskripsi singkat untuk masing-masing kelas.
Tabel IV-4 Daftar Kelas pada Modul XGate2DPhysic
No. Nama Kelas Deskripsi
1. ICollidableObject Interface yang mendefinisikan method yang
harus dimiliki oleh objek yang dapat
bertabrakan dengan benda lain
2. XGate2DRectangleCollidableObject Kelas yang merepresentasikan objek berbentuk
bujur sangkar yang dapat bertabrakan dengan
objek lain
3. XGate2DCircleCollidableObject Kelas yang merepresentasikan objek berbentuk
lingkaran yang dapat bertabrakan dengan objek
lain
4. XGate2DPerPixelCollidableObject Kelas yang merepresentasikan objek yang dapat
bertabrakan dengan objek lain dengan metode
per pixel
5. XGate2DPhysicObject Kelas yang merepresentasikan objek yang
memiliki sifat fisika sederhana
Diagram kelas, interface, dan enumerasi untuk modul XGate2DPhysic dapat dilihat
pada Gambar IV-5.
IV-12
Gambar IV-5 Diagram Kelas Modul XGate2DPhysic
4.3.4 XGate2DUserInterface
Pada terdapat daftar kelas yang terdapat pada modul XGate2DUserInterface
beserta deskripsi singkat untuk masing-masing kelas.
Tabel IV-5 Daftar Kelas pada Modul XGate2DUserInterface
No. Nama Kelas Deskripsi
1. XGate2DLabel Kelas yang merepresentasikan label berisi teks yang dapat
digambar
2. XGate2DTextBox Kelas yang merepresentasikan text box yang dapat menerima
fokus input dari user
3. EButtonState Enumerasi yang menyatakan state yang dimiliki oleh XGate2DButton
4. XGate2DButton Kelas yang merepresentasikan button yang dapat ditekan oleh
kursor mouse
5. XGate2DCheckBox Kelas yang merepresentasikan check box yang dapat dipilih
Diagram kelas, interface, dan enumerasi untuk modul XGate2DUserInterface
dapat dilihat pada Gambar IV-6.
IV-13
Gambar IV-6 Diagram Kelas Modul XGate2DUserInterface
IV-14
4.4 Rancangan Penggunaan Fitur
Pada sub-bab ini akan dijelaskan bagaimana cara game programmer menggunakan
fitur-fitur XGate2D melalui kelas-kelas yang telah dijelaskan pada sub-bab sebelumnya.
4.4.1 Input Handler
Kelas utama yang terkait dengan fitur input handler adalah XGate2DInputManager,
pada sub-modul Input modul XGate2DCore. Programmer tidak perlu membuat instance
dari kelas XGate2DInputManager, melainkan cukup melakukan invokasi method statik
yang disediakan oleh kelas tersebut untuk mendapatkan informasi dari input device.
Method statik yang disediakan oleh kelas XGate2DInputManager dapat dilihat pada
bagian Lampiran A.
4.4.2 Animasi
Kelas utama yang terkait dengan fitur animasi adalah XGate2DAnimatedSprite dan
XGate2DAnimationInfo. Berikut adalah langkah-langkah yang perlu dilakukan
programmer untuk membuat suatu sprite yang memiliki animasi:
1. Membuat instance kelas XGate2DAnimatedSprite
2. Menambahkan informasi animasi dengan menggunakan method
AddAnimation(animationInfo:XGate2DAnimationInfo)
3. Menjalankan animasi dengan indeks tertentu dengan menggunakan method
PlayAnimation(animationIdx:integer)
4.4.3 GUI
Kelas utama yang terkait dengan fitur GUI adalah XGate2DLabel, XGate2DTextBox,
XGate2DButton, XGate2DCheckBox, dan EButtonState. Berikut adalah langkah-
langkah yang perlu dilakukan programmer untuk membuat elemen GUI:
1. Membuat instance kelas XGate2DLabel, XGate2DTextBox, XGate2DButton,
atau XGate2DCheckBox
2. Melakukan invokasi method update pada instance GUI
IV-15
4.4.4 Collision Detection
Kelas utama yang terkait dengan fitur collision detection adalah
XGate2DRectangleCollidableObject dan XGate2DPerPixelCollidableObject. Berikut
adalah langkah-langkah yang perlu dilakukan programmer untuk membuat collidable
object:
1. Membuat kelas yang memiliki objek turunan ICollidableObject sebagai atribut
2. Melakukan pendeteksian tabrakan dengan menggunakan method yang
didefinisikan pada interface ICollidableObject
4.4.5 Physics
Kelas utama yang terkait dengan fitur physics adalah XGate2DPhysicObject. Berikut
adalah langkah-langkah yang perlu dilakukan programmer untuk membuat objek yang
memiliki sifat fisika:
1. Membuat kelas yang memiliki objek XGate2DPhysicObject sebagai atribut
2. Melakukan invokasi method yang berhubungan dengan perhitungan fisika yang
terdapat pada kelas XGate2DPhysicObject
4.4.6 Particle System
Kelas utama yang terkait dengan fitur particle system adalah XGate2DParticle dan
XGate2DParticleSystem. Berikut adalah langkah-langkah yang perlu dilakukan
programmer untuk membuat objek yang bentuknya abstrak dan dapat direpresentasikan
sebagai sebuah sistem partikel:
1. Membuat kelas turunan dari kelas abstrak XGate2DParticleSystem
2. Melakukan override method pada XGate2DParticleSystem, baik method yang
abstrak maupun method yang non-abstrak
3. Assign semua nilai atribut pada XGate2DParticleSystem yang menentukan
perilaku dari sistem partikel yang diinginkan
4. Membuat instance dari kelas tersebut
5. Membuat objek partikel baru setiap selang waktu tertentu
6. Melakukan invokasi method update pada sistem partikel untuk meng-update
nilai-nilai atribut yang menentukan gerakan partikel-partikel
7. Melakukan invokasi method draw pada sistem partikel untuk menggambar
sistem partikel
IV-16
4.4.7 Tiling Engine
Kelas utama yang terkait dengan fitur tiling engine adalah XGate2DTiles. Berikut
adalah langkah-langkah yang perlu dilakukan programmer untuk membuat objek tiles:
1. Membuat instance dari kelas XGate2DTiles
2. Melakukan invokasi terhadap method update pada tiles untuk melakukan update
terhadap nilai-nilai atribut
3. Melakukan invokasi terhadap method draw pada tiles untuk menggambar tiles
4.4.8 Audio
Kelas utama yang terkait dengan fitur audio adalah XGate2DAudioManager. Berikut
adalah langkah-langkah yang perlu dilakukan programmer untuk memainkan data
audio:
1. Melakukan inisialisasi terhadap kelas XGate2DAudioManager dengan masukan
berupa path file setting, wave bank, dan sound bank
2. Memainkan data audio dengan melakukan invokasi method statik yang
didefinisikan pada kelas XGate2DAudioManager