Download - HTML5 untuk Game by Neneng Purnama
![Page 1: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/1.jpg)
@agatestudio
HTML5Untuk Game
Oleh Neneng Purnama
![Page 2: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/2.jpg)
@agatestudio
Apa itu?
HTML5 adalah revisi standar terbaru untuk HTML.
HTML = markup language untuk menstrukturkan dan merepresentasikan content pada web
Didesain :
• mensupport multimedia terbaru dan lebih mudah dibaca oleh manusia dan dimengerti oleh komputer/devices
• menggantikan fungsi dari HTML 4 (1999), XHTML dan DOM Lv 2 HTML (bahasa konvensi untuk mewakili dan berinteraksi dengan objek di HTML)
![Page 3: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/3.jpg)
@agatestudio
Kelebihan HTML5
• Markup (tags) : lebih banyak dan spesifik, lebih simple, lebih fleksibel
• API for multimedia, etc– Canvas : 2D drawing
– Video, audio : like flash, but more simple
– Drag-and-drop : buat webmu lebih interaktif
– Cross-document messaging : you’ll free now to take your data from iframe atau popup window
– Web storage : a flash storage to save data your web games without use database! Like a cookies
• Error handling : tidak usah khawatir lagi tampilan web jadi kapal pecah (if you know what i mean)
![Page 4: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/4.jpg)
@agatestudio
HTML5 used for game?
• Canvas : sebagai stage untuk render objek-objek
• Tags <audio> : buat game web kamu lebih ramai dengan SFX dan BGM
• Drag-and-drop : if you want give another kind of playing experience
• Not only for web browser! You can make a game cross-platform with this
HTML5 + Javascript = game web-based
![Page 5: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/5.jpg)
@agatestudio
Kekurangannya…
Jika kamu hanya pakai HTML5 dan javascript murni :
• Tidak banyak pilihan untuk menganimasikan objek
• Lebih cocok untuk gameplay yang sederhana (tidak banyak management stage/view)
• Tidak cocok untuk browser mobile (tidak ada penanganan event touch) game web-based for browser
![Page 6: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/6.jpg)
@agatestudio
Solusinya?
Use Framework / Game Engine (with JS) for HTML5
Contoh : ImpactJS, EaselJS, Three.js
Ribet?
You can use a game-maker like Construct 2, GameMaker, Cocos2d-X
![Page 7: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/7.jpg)
@agatestudio
Tips memilih Framework / Game Engine
• Pilih struktur framework yang lebih familiar (flash-like, ios-like, jquery-like, game-maker), terutama bagi pemula Javascript.
• Lihat kelengkapan dokumentasi dari framework tersebut (lebih bagus jika banyak yang membahas / membuat / memuat tutorial di forum / blog untuk mempermudah saat membutuhkan yang tidak ada di dokumentasi)
![Page 8: HTML5 untuk Game by Neneng Purnama](https://reader030.vdokumen.com/reader030/viewer/2022020218/559c69e91a28abba5f8b4747/html5/thumbnails/8.jpg)
@agatestudio
Kesimpulan
• HTML5 adalah revisi standar baru untuk HTML
• Bisa digunakan untuk membuat game dengan memakai fitur-fitur baru dalam HTML5
• Menggabungkan HTML5 dan Javascript (murni) saja tidak cukup untuk membuat game dalam skala besar (lebih cocok untuk game sederhana)
• Solusinya, bisa memakai framework / game engine Javascript