Dasar Pengembangan Game HTML5

Description

Buku ini membahas tentang pembuatan game berbasis HTML 5 Javascript. Pembahasan game meliputi game shot'em up, game platformer, puzzle dan boardgame. Pembuatan game menggunakan aplikasi notepad dan game dapat dijalankan pada web browser maupun gawai berbasis android maupun IOS DAFTAR ISI Kata Pengantar ........................................................................................................................................ i Daftar Isi ....................................................................................................................................................... iii Daftar Gambar........................................................................................................................................... v Daftar Tabel ............................................................................................................................................... ix BAB 1. PENGENALAN DASAR HTML CANVAS .......................................................................... 1 1.1 HTML Canvas........................................................................................................................................ 1 1.2 Struktur HTML Canvas..................................................................................................................... 2 1.3 Perangkat dalam Mengembangkan Aplikasi berbasis HTML Canvas....................... 3 1.4 Kerangka Kerja (Frame Work) dan Perpustakaan Kode (Library) Javascript....... 5 1.5 Cakupan Bahasan dalam Buku Ini.............................................................................................. 6 1.6 Target Pembaca................................................................................................................................... 8 1.7 File Sumber Buku............................................................................................................................... 9 1.8 Lisensi Buku.......................................................................................................................................... 9 BAB 2. PENGATURAN PROYEK PENGEMBANGAN GAME................................................. 11 2.1 Pengaturan Proyek (Project Setup)......................................................................................... 11 2.2 File HTML............................................................................................................................................... 11 2.3 File Javascript (.js).............................................................................................................................. 13 2.4 File Assets............................................................................................................................................... 13 2.5 Struktur Folder Proyek Game HTML 5 .................................................................................... 14 BAB 3. GERAKAN OBJEK...................................................................................................................... 17 3.1 Memahami Proses Kerja Canvas................................................................................................. 17 3.2 Tutorial 1 - Membuat halaman start......................................................................................... 19 3.3 Membuat halaman judul (cover/tittle).................................................................................... 24 3.4 Menambahkan halaman permainan ......................................................................................... 26 3.5 Menambahkan latar belakang (background)........................................................................ 30 3.6 Membatasi gerakan pesawat. ....................................................................................................... 32 iv BAB 4. DEBUGGING.................................................................................................................................. 35 4.1 Memahami teknik debugging ....................................................................................................... 35 4.2 Menguji kesalahan ............................................................................................................................. 36 4.3 Debugging dengan teknik print tracing ................................................................................... 36 BAB 5. OBJEK KOMPLEKS................................................................................................................... 39 5.1 Menambahkan Peluru...................................................................................................................... 39 5.2 Menambahkan Musuh...................................................................................................................... 42 5.3 Deteksi Tabrakan (Collision detection).................................................................................... 46 BAB 6. SUARA............................................................................................................................................. 53 6.1 Menambahkan Suara ........................................................................................................................ 53 BAB 7. GRAPHICAL USER INTERFACE (GUI / ANTAR MUKA) ......................................... 57 7.1 Graphical User Interface (GUI) ..................................................................................................... 57 7.2 Tombol resize ....................................................................................................................................... 58 7.3 GUI energi dan score......................................................................................................................... 59 7.4 Virtual Joystick dan Tombol Mobile............................................................................................ 62 BAB 8. GAME PLATFORMER................................................................................................................ 67 8.1 Konsep Game Platformer ................................................................................................................ 67 8.2 Membuat project template Game HTML 5............................................................................. 68 8.3 Menggerakkan Karakter Pemain ................................................................................................ 71 8.4 Mendesain Arena Permainan (Platform)................................................................................ 76 8.5 Menggerakkan Karakter di Arena Permainan (Platform).............................................. 84 8.6 Menambahkan bonus item ............................................................................................................ 87 8.7 Menambahkan Musuh...................................................................................................................... 91 8.8 Menambahkan Tujuan ..................................................................................................................... 94 8.9 Menambahkan Beberapa Level ................................................................................................... 96 BAB 9. GAME MENCOCOKAN GAMBAR........................................................................................ 101 9.1 Konsep Dasar Game Mencocokan Gambar............................................................................. 101 v 9.2 Persiapan Aset Grafis ....................................................................................................................... 103 9.3 Pemrograman Game Mencocokan Gambar ........................................................................... 104 BAB 10. KUIS .............................................................................................................................................. 113 10.1 Mengadaptasi Tutorial Program Lain (Porting)............................................................... 113 10.2 Asset untuk Game Kuis ................................................................................................................. 114 10.3 Database Soal..................................................................................................................................... 115 10.4 Pemrograman Antarmuka (interface)................................................................................... 116 10.5 Pemrograman Game Kuis ............................................................................................................ 119 BAB 11. GAME PAPAN (BOARD GAME) ....................................................................................... 125 11.1 Konsep Game Papan....................................................................................................................... 125 11.2 Aset Visual Game Papan.............................................................................................................. 126 11.3 Menentukan Koordinat Petak Permainan........................................................................... 128 11.4 Pemrograman Gerakan Bidak pada Papan ......................................................................... 132 11.5 Tahapan Selanjutnya ..................................................................................................................... 139 BAB 12. PENUTUP................................................................................................................................... 143 12.1 Pengembangan Lanjutan ............................................................................................................. 143 12.2 Diskusi Terkait Pengembangan Aplikasi ............................................................................. 144 Tentang Penulis ....................................................................................................................................... 145 DAFTAR PUSTAKA.................................................................................................................................. 147