paper tugas akhir periode juli 2011 - Digilib ITS - Institut Teknologi ...

PAPER TUGAS AKHIR PERIODE JULI 2011

Implementasi Hukum Fisika dalam Game Physics Puzzle “Cannon Ball” Menggunakan Box2D Mahdi Bashroni Rizal - Imam Kuswardayan S.Kom., M.T. - Umi Laily Yuhana, S.Kom, M.Sc Jurusan Teknik Informatika, Fakultas Teknologi Informasi, Institut Teknologi Sepuluh Nopember, Email: [email protected] Abstrak Game physics puzzle adalah tipe game puzzle dimana pemain harus memanfaatkan physics yang terdapat dalam game untuk menyelesaikan setiap puzzle. Game physics menggunakan physics yang realitis agar game lebih menantang. Box2D adalah sebuah library untuk membantu mensimulasikan hukum fisika ke dalam sebuah aplikasi. Dalam Tugas akhir ini akan dibahas bagaimana mendesain game game physics puzzle dengan menggunakan library Box2D yang diperuntukkan untuk Flash Action Script 3. Dimana game ini dapat berjalan menggunakan platform flash player, sehingga dapat dimainkan langsung menggunakan browser. Dalam game ini juga terdapat fitur Leaderboard untuk mempertandingkan highscore antar pemain secara online.

ini flash adalah market leader dalam game berbasis web. Banyak jenis game yang telah dibuat menggunakan flash, mulai action, strategy, puzzle, shooting, adventure, sport, bahkan mmorpg. Salah satu genre yang digemari adalah game physics, yaitu game yang menonjolkan simulasi hukum fisika ke dalam game dan hal tersebut terbukti dengan kesuksesan game angry birds, sampai dirilis hampir di semua platform. Game physics berbasis web adalah tipe game yang banyak disukai karena menawarkan keunikan tersendiri dalam memainkannya tetapi masih sedikit game physics yang berbasis web yang tersedia saat ini. Disini physics game akan digabungkan dengan puzzle, yaitu game yang nemenkankan pemecahan tekateki untuk menyelesaikan suatu level.

Kata kunci : Game Physics Puzzle, Box2D, Highscore online

2.1.

1.

PENDAHULUAN

Game merupakan salah satu industri besar di dunia saat ini. Perkembangan game begitu pesat dengan jenis beragam, mulai dari game komputer, game konsol seperti playstation, xbox, ataupun perangkat game genggam seperti nintendo DS dan PSP. Saat ini mulai marak game berbasis web, dimana semua pemain bisa memainkan dengan browser. Game jenis ini mempunyai keunggulan yaitu, pemain tidak perlu repot menginstal client game seperti lazimnya game komputer lainya. Pemain yang ingin memainkan cukup berkunjung ke portal game seperti kongregate.com, newgrounds.com maupun situs portal game lainya. Sekarang dengan hadirnya facebook semakin banyak variasi tempat untuk bermain game berbasis web. Flash merupakan sebuah perangkat lunak yang pada dulunya digunakan untuk Membuat animasi, tetapi seiring dengan perkembangan saat ini flash banyak digunakan untuk hal-hal lain, misalnya pembuatan website, game dan lain sebagainya. Saat

Mahdi Bashroni Rizal - 5107100097

2.

DASAR TEORI Game Physics Puzzle

Game Puzzle (teka-teki) berfokus pada logika dan tantangan konseptual, walau terkadang didalam game ditambahi tantangan dengan batas waktu dan elemen aksi. Walau banyak game action (aksi) dan adventure (petualangan) melibatkan puzzle sebagai tambahan fitur seperti untuk mendapatkan benda di dalam game, tetapi game puzzle sejati hanya berfokus pada pemecahan puzzle (teka-teki) sebagai aktifitas utama permainan. Game biasanya melibatkan bentuk, warna, simbol dan pemain secara langsung maupun tidak langsung memanipulasi benda tersebut dalam pola yang spesifik. Daripada mempresentasikan koleksi acak dari puzzle untuk dipecahkan, game puzzle menawarkan seri dari puzzle yang mempunyai variasi dari satu tema. Tema ini dapat melibatkan pola recognition (pengenalan), logika dan pemahaman proses. Game tersebut biasanya mempunya sekumpulan aturan yang sederhana, dimana pemain memanipulasi potongan benda dalam sebuah grid, network atau ruang interaksi lain. Pemain harus menemukan petunjuk untuk memenuhi kondisi menang dimana akan

Page 1

PAPER TUGAS AKHIR PERIODE JULI 2011 mendapatkan hak untuk melanjutkan ke level selanjutnya. Menyelesaikan setiap puzzle biasanya akan mengarahkan ke tantangan yang lebih sulit, walaupun beberapa game menghindarkan keletihan pemain dengan menyisipkan level yang lebih mudah di antara level yang sulit. Game physics adalah tipe game puzzle dimana pemain harus meggunakan game physics untuk menyelesaikan setiap puzzle. Game physics menggunakan physics yang realitis agar game lebih menantang. Tipe game ini populer khusunya di game flash online dan game mobile. 2.2. Adobe Flash Action Script 3 Action Script adalah bahasa pemrograman yang dibuat oleh Macromedia Inc (sekarang dimiliki oleh adobe) dan digunakan untuk mengembangkan website dan software pada platform Adobe FlashPlayer, dan digunakan di halaman web dalam bentuk file swf yang di embed. Flash MX 2004, sebuah scripting programming language yang lebih cocok untuk mengembangkan aplikasi flash, seringkali dalam sebuah kasus lebih menghemat tenaga dengan scripting daripada membuat animasinya dengan manual. Setelah kemunculan ActionScript 2 mulai bermunculan game berbasis platform flash. Sejak kemunculan Flash Player 9 (2006) versi baru dari ActionScript dirilis, ActionScript 3. Berbeda dari sebelumnya, ActionScript 3 adalah objek oriented programming language (OOP) sehingga developer lebih mempunyai kontrol dan code reusability ketika membangun sebuah aplikasi Flash yang kompleks. ActionScript 3 ditujukan untuk versi Flash Player 9 dan lebih tinggi. Performa ActionScript 3 lebih cepat 10 kali daripada action script versi sebelumnya. 2.3

Box2D Library untuk Action Script 3 Box2D adalah sebuah library tambahan untuk membantu mensimulasikan hukum fisika ke dalam sebuah aplikasi. Box2D pertama kali di presentasikan oleh Erin Catto di Game Developers Conference (GDC 2006). Pada 11 September 2007 di rilis sebagai open source di Sourceforge. Pada 17 Januari 2010 Box2D berpindah ke Google code untuk hosting. Box2D pada mulahnya dirilis dalam bahasa C++ dan telah digunakan pada Nintendo DS, Wii dan telepon genggam (termasuk Android dan Iphone). Sekarang Box2D telah di porting ke berbagai macam bahasa pemrograman lain


termasuk Adobe Flash (ActionScript dan haxe), Java, C# dan JavaScript. Fitur yang dapat digunakan dengan Box2D meliputiGravitasi  Gesekan  Momentum  Massa  Kelembaman  Kecepatan  Collision Box2D dapat mensimulasikan suatu benda yang terdiri dari convex, polygon, circles dan edge shapes (siku). Benda dapat dihubungkan dengan joints (sendi). Box2D memungkinkan simulasi hukum fisika dari banyak benda yang bergerak cepat bertumbukan dengan ringan. 2.4 Mochimedia API Leaderboard Leaderboad adalah fitur dari mochi untuk mengunggah score pemain dalam suatu game scara online. Developer dapat membuat sebanyak apapun leaderboard yang mereka inginkan untuk menyimpan score yang didapat oleh pemain. Score dan rangking ditracking dalam interval harian, mingguan, bulanan. Setiap game dapat mempunyai banyak leaderboard, tetapi minimal harus memiliki satu leader board untuk menggunakan Mochi Scores API. Fitur yang terdapat pada mochi scores API adalah sebagai berikut :  Dapat membuat banyak leaderboard untuk satu game.  Tracking setiap score berdasarkan waktu dan besar dan dapat disorting.  Dapat mengingat nama pemain, score terakhir dan memperlihatkan negara pemain  Delete score pemain atau melakukan ban kepada pemain.  Komunikasi terenkripsi dari game ke mochi score server.  Integrasi dengan social network seperti facebook, mochi publisher dan mochigames.

3. DESAIN DAN IMPLEMENTASI 3.1. Desain dan implementasi gameplay menggunakan Acrion Script 3 dan Box2D Dalam tugas akhir ini akan dibangun game yang memiliki konsep gameplay untuk menembakkan bola dengan cannon (meriam) ke dalam gol tetapi

Page 2

PAPER TUGAS AKHIR PERIODE JULI 2011 terdapat berbagai macam objek dengan sifat masing-masing dalam permainan, dalam setiap level memiliki desain yang berbeda dengan berbagai macam benda yag tersusun menjadi sebuah puzzle. Yang dimaksud puzzle disini pemain harus menemukan cara yang terbaik untuk memasukkan bola ke dalam gol dengan cepat, karena pada permainan dibatasi waktu dan semakin cepat pemain memenangkan level maka skor yang didapat semakin tinggi. Perancangan perangkat lunak dibagi menjadi beberapa bagian, yaitu perancangan Mohi Api untuk Leaderboard, perancangan Box2D, perancangan gameplay.

Tabel 1. Objek dalam game Cannon (Meriam) Meriam yang digunakan untuk Keterangan menembak bola //konfigurasi physics cannon ballshapeDef.friction = 0.3; ballshapeDef.restitution = 0.3; ballshapeDef.density = 0.0; Objek

Konfigurasi Box2D

//menembak bola var arah:b2Vec2 = new b2Vec2(direction.x, direction.y); var ba = new BallActor(this, launcherball.getLocationPoint(), arah);

Gambar

Objek Keterangan Gambar 3-1. Gambaran umum sistem

Konfigurasi Box2D

Penjelasan dalam Gambar 3-1 adalah ketika memulai awal game (start) pemain akan di bawah ke menu, dimana dalam menu tersebut pemain dapat memilih level yang dinginkan maupun membuka leaderboard untuk mensubmit score, dimana leaderboard tersebut menggunakan Mochimedia API. Dalam permainan, kelas level terintegrasi dengan library Box2D dan objek dalam permainan juga terintegrasi Box2D. Jenis objek dalam permainan dijelaskan pada Tabel 1. Pada tabel ini akan disertakan implementasi hukum fisika menggunakan Box2D dalam setiap benda.Secara umum benda memiliki 3 konfigurasi yaitu dalam Box2D yaitu friction atau gaya gesek (satuan : m/s2), restitution atau gaya pantul yang dimiliki benda dimana 0 adalah tidak memantulkan gaya sama sekali sedangkan 1 adalah memantulkan gaya sebesar yang diterima, density adalah berat jenis benda, dimana 0 adalah benda statik yaitu benda yang tidak berubah posisi asal walau dikenai gaya sebesar apapun (satuan : kg/m3)

Gambar Objek

Keterangan

Bola Bola yang ditembakkan meriam ballshapeDef.friction =0.3 ballshapeDef.restitution = 0.5; ballshapeDef.density = 3500; Gol Gol adalah Tempat tujuan bola, pemain harus menembakkan bola untuk masuk ke dalam gol, tetapi level didesain sedimikan rupa (puzzle) sehingga untuk memasukkan bola permain harus menemukan cara yang efektif.

Gambar

Objek Keterangan

Kayu berputar (Wooden Spin) Balok kayu yang berputar seperti jarum jam the_rev_joint.Initialize(poros.body, handclock.body, poros.body.GetWorldCenter()); the_rev_joint.enableMotor = true; the_rev_joint.motorSpeed = motorSpeed;

Gambar


Page 3

PAPER TUGAS AKHIR PERIODE JULI 2011

Objek Keterangan Konfigurasi Box2D

Trampolin Trampolin yang Berguna untuk mementalkan bola dengan lebih cepat recShapeDef.friction = 0.3; recShapeDef.restitution = 1.5; recShapeDef.density = 0.0;

Objek Keterangan

Gambar Konfiguras i Box2D Objek Keterangan Konfigurasi Box2D

Tembok Objek statik, tembok bata yang membentuk desain level recShapeDef.friction = 0.4; recShapeDef.restitution = 0.3; recShapeDef.density = 0.0;

Gambar

Balok kayu

Objek

Angin Sebuah kipas yang mengeluarkan angin dimana setiap benda yang terkena angin tersebut akan berubah arah //konfigurasi kipas recShapeDef.friction = 0.3; recShapeDef.restitution = 0.3; recShapeDef.density = 0.0; //konfigurasi angin theBola.body.ApplyForce(new b2Vec2(vx, vy),theBola.body.GetWorldCenter()) ;

Gambar

Objek

Keterangan

Konfigurasi Box2D

Objek dinamis, Balok kayu dimana player dalam permainan harus merubuhkan tumpukan balok kayu untuk membuka jalan agar bola dapat menuju gol recShapeDef.friction = 0.3; recShapeDef.restitution = 0.3; recShapeDef.density = 400;

Gambar

Objek

Paku

Keterangan

Paku rintangan, dimana apabila bola mengenaiknya maka akan pecah atau rusak

Gambar

Keterangan

Konfigurasi Box2D

Tiang kayu Objek dinamis, Tiang kayu yang berfungsi sama dengan balok kayu tetapi berbentuk memanjang recShapeDef.friction = 0.3; recShapeDef.restitution= 0.3; recShapeDef.density = 400;

Gambar

Objek

Lubang teleportasi

Keterangan

Sebuat tempat teleportasi yang dapat memindahkan bola ke tempat lain, dimana terdapat 2 macam lubang teleportasi yaitu lubang teleportasi putih untuk bola masuk yang berwarna putih dan lubang teleportasi merah untuk bola keluar yang berwarna merah.

Konfigurasi Box2D


Page 4

PAPER TUGAS AKHIR PERIODE JULI 2011 Untuk menyimpan skor pemain setelah mereka memainkan game, maka fungsi dibawah ini yang digunakan

Gambar 3-2 User interface dalam permainan Pengaplikasian objek ke dalam game.

mochi.as3.MochiScores.showLeaderboard({bo ardID: ”xxx”, score: 128472}); Dimana 128472 adalah skor pemain. Ketika Leaderboard widget muncul akan terdapat form dimana pemain dapat menulis namanya. Setelah menulis nama pemain dapat men-submit skor 4.

UJI COBA

4.1. Uji Coba Menu Utama dan Menu Level Klik tombol continue pada menu utama

Gambar 3-3. Pengaplikasian Objek ke dalam game Terdapat 12 level dalam game ini, di menu level permain dapat memilih level yang diinginkan, tetapi level selanjutnya barus bisa dibuka setelah pemain menyelesaikan level sebelumnya 3.2. Implementasi Mochi Api untuk Leaderboard Untuk menggunakan fitur-fitur Mochi API maka diperlukan koneksi terlebih dahulu dengan mochi services menggunakan fungsi. Fungsi ini bertujuan untuk tes apakah komputer terkoneksi dengan internet. Fungsi ini diinisiasi pada awal dimulainya program. Connectconnect(id:String, clip:Object, onError:Function):Void Untuk menampilkan Leaderboard di game membutuhkan script dibawah ini, dimana ‘xxx’ adalah board ID. // stop the main timeline and display the leaderboard mochi.as3.MochiScores.showLeaderboard({boa rdID: ”xxx”}); Fungsi ini hanya untuk menampilkan highscore. Ini berguna jika developer mengiginkan pemain untuk melihat highscores sebelum memainkan game.


Setelah klik tombol continue pemain akan dibawa ke menú level

Gambar 4-1. Menu Level Untuk membuka level yang tergembok pemain harus memenangkan level sebelumnya. Sehingga setiap memenangkan suatu level akan dilakukan auto save pencapaian level dan skor tiap level yang telah dilalui

4.2. Uji Coba Menembakkan Cannon Pemain mengarahkan cannon dan klik tahan tombol mouse kiri untuk mengatur kekuatan cannon

Page 5

PAPER TUGAS AKHIR PERIODE JULI 2011 Power bar cannon terisi, power bar cannon terletak pada bagian atas user interface dengan tulisan power berwarna putih seperti Gambar 4-2 Gambar 4-2. Power bar

4.3. Uji Coba angin Pemain menembakkan bola kemudian bola tersebut mengenai angin. Kemudian Bole berubah arah sesuai tekanan angin seperti Gambar 4-3

Gambar 4-5. Bola mengenai trampolin

4.6. Uji Coba Balok kayu Pemain menembakkan bola kemudian bola tersebut mengenai Balok. Kemudian Balok terpental sesuai arah laju bola seperti gambar Gambar 4-6

Gambar 4-3. Bola mengenai angin dan terkena tekanan angin

4.4. Uji Coba Paku Pemain menembakkan bola kemudian bola tersebut mengenai angin dan bola mengenai Paku dan bola hancur

Gambar 4-6. Bola menumbuk balok

4.7. Uji Coba Tiang kayu Bola mengenai tiang kayu dan Tiang kayu terpental

Gambar 4-4. Bola hancur (berwarna oranye)

4.5. Uji Coba Trampolin Pemain menembakkan bola kemudian bola tersebut mengenai angin dan bola mengenai Trampolin. Bola memantul lebih keras dari kecepatan semua (1,5x lipat) seperti Gambar 4-5


Gambar 4-7. Bola menumbuk tiang kayu

4.8. Uji Coba Pause Game Pemain klik tombol pause dalam permainan dan Permainan akan berhenti dan muncul jendela pause seperti pada Gambar 4-8

Page 6

PAPER TUGAS AKHIR PERIODE JULI 2011 dan pemain harus mengulangi permainan dari awal untuk level tersebut.

Gambar 4-8. Pause

Gambar 4-11 Jendela kalah

4.9. Uji Coba Reset Level Ketika tombol reset di hud di klik maka level akan diulang dengan inisiasi awal, jumlah bola, tool papan bantuan, semua objek dalam layar akan kembali seperti semua. Tombol reset terletak di paling kiri pada

4.12. Uji coba mute musik dan sound effect (SFX) Tujuan uji coba ini adalah melakukan tes pada fungsi tombol Submit mute musik yang terdapat pada menu utama, menu level dan pada saat permainan. Ketika tombol mute di klik maka suara dihilangkan, dan klik tombol mute lagi untuk mengembalikan suara.

Gambar 4-9. Tombol reset

4.10.

Uji coba Menang

Pemain dapat memenangkan suatu level apabila berhasil memasukkan bola ke dalam gol. Kemudian akan muncul jendela yang berisi informasi mengenai perhitungan skor seperti gambar Error! Reference source not found..

Gambar 4-12. Tombol Mute

4.13.

Uji Coba Leaderboard (Highscores)

Pada menu utama game terdapat tombol highscore untuk memunculkan Leaderboard untuk highscore secara online, pemain dapat melihat highscore berdasarkan hari, minggu, bulan dan sepanjang masa seperti gambar Gambar 4-13. Disini pemain hanya dapat melihat highscore tanpa melakukan submit highscore

Gambar 4-10 Jendela menang

4.11.

Uji Coba kalah Kalah

Dalam game ini setiap level memiliki batas waktu untuk diselesaikan apabila pemain gagal memasukkan bola ke dalam gol dalam batas waktu yang disediakan akan muncul jendela kalah yang menyatakan waktu habis seperti Gambar 4-11


Gambar 4-13. Membuka Leaderboard

Page 7

PAPER TUGAS AKHIR PERIODE JULI 2011 Padamenu level terdapat tombol submit highscore untuk membuka leaderboard dan pemain dapat mengunggah skor dan memasukkan nama untuk skor tersebut dengan menggunakan mochi API seperti gambar Gambar 4-14

3.

Adobe Flash, 2011, ActionScript 3.0 Language and Components Reference, [online], (http://livedocs.adobe.com/flash/9.0/Actio nScriptLangRefV3/, diakses tanggal 8 Maret 2011)

4.

Mochimedia, 2010, Mochi Scores API, [online], (http://www.mochimedia.com/developers/ scores.html, diakses tanggal 8 Maret 2011)

5.

William, 2007, Designing games everyone can enjoy, [online], (http://www.casualgamedesign.com/?p=53 , diakses tanggal 8 Maret 2011)

6.

Erin Catto 2007, Box2D Manual, [online], (http://www.box2dflash.org/docs/2.0.2/ma nual, diakses tanggal 10 maret 2011)

7.

Andrew, Restituion, [online], (http://en.wikipedia.org/wiki/Restitution, diakses tanggal 5 mei 2011)

8.

ClueBot, Density, [online], (http://en.wikipedia.org/wiki/Density, diakses tanggal 5 mei 2011)

9.

ClueBot, Friction, [online], (http://en.wikipedia.org/wiki/Friction, diakses tanggal 5 mei 2011)

Gambar 4-14. Submit skor 5.

Kesimpulan Dari hasil pengamatan selama proses perancangan, implementasi dan uji coba perangkat lunak yang dilakukan, dapat diambil kesimpulan sebagai berikut : 1. Implementasi hukum fisika dalam game dapat dibantu dengan Box2D membuat skenario game terlebih dahulu. 2. Integrasi Box2D dapat dilakukan dengan membuat physics world Box2D dalam game dan mengkonfigurasi sifat fisika seperti density, friction, restituion setiap benda yang akan dikenai simulasi dan berdasarkan uji coba dapat disimpulkan bahwa simulasi berjalan dengan baik 3. Kemampuan mochimedia API untuk penggunaan submit Highscore secara online berjalan dengan baik selain itu dengan mochimedia API highscore dapat diposting ke social network seperti facebook tanpa dari dalam game 4. Implementasi permainan dapat berjalan sesuai dengan skenario yang dirancang. 6.

Daftar Pustaka 1. Todd, 2011, An introduction to Box2D, [online], (http://www.kerp.net/Box2D/, diakses tanggal 8 Maret 2011) 2.

Box2D site project, 2011, Box2DFlash , [online], (http://www.Box2Dflash.org, diakses tanggal 8 Maret 2011)


Page 8