Download as ODP, PPTX
More Related Content
Similar to HTML5 Game Development frameworks overview
HTML5 Game Development frameworks overview
- 1. TECHNICAL PRESENTATION Merkur GamingIndia Pvt. Ltd. Noida. For : Online Gaming Team Presented By : Abhishek Singhal Senior Developer Online Gaming Team
- 2. HTML Gaming Frameworks Insight ●JavaScript 3D game engines is a hot topic right now with everyone building browser based 3D games using JavaScript, HTML5 and WebGL technology. The best thing about browser based games is platform independence they bring in and run on iOS, Android, Windows or any other platform. ● There are tons of JavaScript resources out there that can be used for building browser based games using HTML5 and WebGL. However, selecting the right gaming engine can be a real challenge at times and can end up making or breaking your project.
- 3.
- 4. ● Construct 2is an HTML5 game maker, meaning you are not actually writing JavaScript. Instead, you use actions, events and conditions to do the heavy lifting. ● The engine is heavily tested and used. It has a very active community and new releases weekly. HTML Gaming Frameworks Insight CONSTRUCT 2 : IMPACT JS :IMPACT JS : ● ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation. ● ImpactJS is designed to work on all devices, including mobile, and has the Ejecta Framework for publishing games to the iOS App Store with native-like performance. ● The engine includes both a level editor, and debug tools for much faster creation of games
- 5. EaselJS : ● EaselJSprovides a display list to allow you to work with display elements on a canvas as nested objects. It also provides a simple framework for providing shape based mouse interactions on elements in the display list. Phaser : ● Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years. ● The engine is relatively new, but has been actively maintained. ● EaselJS is part of a suite called CreateJS, which includes tools for sounds, preloading, and tweening. ● The engine is a good choice if you come from a Flash/AS3 background as it is inspired by Flash. HTML Gaming Frameworks Insight
- 6. Three.js : Voxel.js : ●If you are developing a 3d game, this is probably the engine for you. ● voxel.js makes it easy to create 3d voxel games (a la Minecraft). It requires webGL to run. ● The engine is frequently updated and maintained, and offers tools for everything from physics to user interface to networked multiplayer - all via separate modules. PlayCanvas : ● PlayCanvas is a cloud-based HTMl5 game engine and editor for 3D games, with a focus on real-time collaboration. ● Three.js is currently the most widely used 3D/WebGL game engine, developed and maintained by Mr. doob and AlteredQualia. The goal is to take the complicated webGL bindings and tack on an easy-to-use framework on top of it. HTML Gaming Frameworks Insight
- 7. HEART OF THEGAME – THE GAME LOOP All the code that makes the game interactive and dynamic goes in the game loop, but is separated into different pieces. The game loop itself is a controlled infinite loop that makes your game keep running; it's the place where all your little pieces will be updated and drawn on the screen. When everything is properly updated and ready, we enter the draw phase where all this information is put on the screen. This function should contain all the code to manage and draw the levels, layers, chars, HUD and so on. Initialize, Update and Draw :- The game loop is the central code of your game, split into different parts. Generally, these are: initialize, update and draw. The initialize phase is used to do any necessary game setup and prepare the environment for the update and draw phases. Here you should create your main entities, prepare the menu, detect default hardware capabilities, and so on. The main purpose of the update phase is to prepare all objects to be drawn, so this is where all the physics code, coordinate updates, health points changes, char upgrades, damage dealt and other similar operations belong. This is also where the input will be captured and processed.
- 8. In many waysa 2D game and a 3D are identical. You need input, entities to represent the game world, a rendering loop and so on. But... 3D requires a different set of disciplines to make the art assets and get them on screen. 3D art needs geometry, which is then UV-wrapped in textures. To render the scene needs a more sophisticated scene hierarchy (probably a tree). The representation of orientations needs matrices or quaternions (or both). We need to consider lighting in a different way. We need a 3D API like OpenGL to leverage hardware rendering. And there are problems to solve relating to the size and complexity of the world. In a 2D screen, only a segment of the world is visible, in a 3D setup it is possible to imagine a location from where the entire world is visible. Drawing everything could be bad for performance. DIFFERENCE in 2D and 3D Game Development
- 9. BENEFITS Cross-platform This is themain feature why developers have originally turned into web technologies looking to fulfil the promise of coding once and deploy everywhere. As some of the other advantages of the web, cross-platform is in its nature, as it is meant to run on any device (hardware) and operating system (software). Based on open standards This is more important than meets the eye. There have been various technologies in the past that made the cross-platform promise but did not completely deliver. Amongst other reasons, they failed because of being closed and tied to a specific company. Open standards allow both vendors and developers to contribute and improve the final product. This is one of the key success factors of the web. There is no head controlling it so it can evolve according to the needs and interests of many. Full technology stack HTML5 in itself is a full technology stack.
- 10. CHALLENGES Cross-platform is morethan devices and operating systems Cross-platform does not really mean same code or user interface/user experience Low performance, especially on mobile Access to the native features on each platform
- 11.
- 12.