 |
| Tutorial Membuat Game dengan Framework Phaser |
Tutorial Dasar Membuat Game Menggunakan Framework Phaser - Bagi kawan-kawan yang ingin belajar membuat game yang nantinya bisa dibuat menjadi game android. Maka kita harus terus praktek membuat berbagai macam jenis game. Setelah sebelumnya Beriteknol memposting tentang Framework Phaser yang merupakan game engine open source yang bisa digunakan untuk pembuatan game tipe HTML 5, maka pada artikel kali ini akan dibahas tentang tuorial dasar pembuatan game menggunakan Framework Phaser. Untuk mempraktekkan membuat game menggunakan framework phaser kalu bisa jangan tinggal copas ya... hal ini agar kawan-kawan terbiasa untuk engetik code program lewat framework phaser.
Membuat Game dengan Framework Phaser
1. Yang pertama silahkan kawan-kawan download dulu framework phaser pada link ini. Setelah file zip framework phaser selesai di download extract-lah file tersebut maka di dalamnya berisi file dan folder seperti berikut ini.
 |
| Struktur Folder framework phaser |
2. Kemudian buka pada folder build, di situ terdapat berbagai file javascript yang nantinya akan kita butuhkan dalam pembuatan game dengan framework phaser. Untuk belajar, coba pilih file phaser.min.js dan copikan ke folder tempat kita berlatih membuat game dengan framework phaser.
 |
| File phaser.min.js |
3. Misal di sini kita membuat folder latihan di document. Kemudian kita mulai membuat file HTML gunakan sebuah program editor terserah. Jangan menggunakan MS Word ya... di sini kita bisa menggunakan notepad, namun saya sarankan menggunakan editor khusus untuk pemrograman contohnya sublime, notepad++, dll. Untuk notepad++ merupakan aplikasi editor gratis dan bisa kawan-kawan download DI SINI. gunakanlah gambar phaser.png berikut dan masukkan pada folder latihan.
4. Struktur folder latihan akan seperti berikut ini.
 |
| Struktur folder latihan |
Kemudian kita membuat file index.html sebagai file utama untuk menjalankan framework phaser. Ketikkan code program berikut.
<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<title>hello phaser!</title>
<script src="phaser.min.js"></script>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
//membuat code untuk tampilan layar dari game phaser.
var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create });
//function ini digunakan untuk meload asset sebelum game dijalankan
function preload () {
game.load.image('logo', 'phaser.png');
}
//menjalan create game yang membuat framework phaser menampilkan dan menjalankan game
function create () {
var logo = game.add.sprite(game.world.centerX, game.world.centerY, 'logo');
logo.anchor.setTo(0.5, 0.5);
}
};
</script>
</body>
</html>
5. Untuk menjalankan project file di atas gunakanlah aplikasi local web server seperti xamp ataupun wamp. Untuk xampp taruh folder latihan di htdoc kemudian jalankan file html yang telah kita buat tadi maka hasilnya akan seperti berikut. Dan selamat kita telah mengenal dasar pembuatan game dengan framework phaser.
 |
| Tampilan pembuatan game menampilkan hellophaser |
Demikian artikel sederhana tentang Tutorial Dasar Membuat Game dengan Framework Phaser, meskipun tutorial ini masih sangat sederhana semoga artikel ini bisa bermanfaat.
Terimakasih telah membaca artikel ini tentang Tutorial Dasar Membuat Game dengan Framework Phaser, saya berharap artikel ini dapat bermanfaat. Dan apabila kalian suka dengan artikel ini, jangan lupa untuk share ke berbagai sosial media kalian atau dengan meng-klik pada tombol sosial media di bawah... Beriteknol
terimakasih atas tutorialnya
BalasHapus