Jump to content
  • Advertisement
Sign in to follow this  

Drag'n'Drop HTML5 Game Development Framework And Component Sharing Community

This topic is 2176 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I'd like to announce our latest milestone release of oTakhi Platform - a drag'n'drop HTML5 game development engine and framework wherein users can share game assets and code logic as reusable components.


(Note: We will push out our 3D content via CDN before the end of year or early 2014.  Before that, 3D files are large and may take a while to load, especially true if you are outside of North America.)


(1) Collision detection, physics simulation, and post processing.


This scene below, Pandora's Box, was created in just under 66 lines of javascript.  

It is made of two separately rendered scenes and uses the following techniques:


a) The main scene uses Vignette, FXAA, and Focus post-processing filters.  The Vignette filter gives the scene a darkened edges.  The FXAA filter provides better anti-aliasing in removing jagged edges.  The Focus filter gives the background objects a slightly blurred effect while putting the box in focus.


b) The secondary scene (behind the main scene)  is used to generate occlusion buffer for the light object.  It uses VBlur, HBlur, and Radial Blur filter to create god rays effect.  It is then added / blended to the main scene per rendering cycle.


c) Collision detection is enabled between the lid and the box.  The scene is given a downward gravity and the lid a positive weight.  A Hinge joint is created connecting the lid and the box.  When you drag the lid using the mouse, an impulse force is applied on the lid.


(clicking on the image will take you to the scene)




Here is a video tutorial on how this scene was made.





(2) Skeletal, morph, and path animation with synchronized sound effect


This next scene demonstrates our timeline-based animation system as the property of each mesh, you can create a repertoire of behaviors, including skeletal, morph, path, and sound tracks, and save them with the mesh and the droplet containing it, as one shareable unit, which we call an automaton.


This scene was created in just 32 lines of Javascript.




And its tutorial:




Automata are software robots.  Once published and deployed to our repository, others will be able to integrate into their scenes and use the service they provide.  In the social networking context, they are like surrogates - software object that represents you and, through the surrogates, you interact with other users and/or their surrogates.


If you are not familiar with oTakhi CloudFormation Platform, please watch these three introductory videos first.


A Brave New Web: Web Of Objects

Top-Down Object-Oriented Design Framework

Particle System For The Impatient


We will push out our 3D content via CDN before the end of year or early 2014.  Before that, 3D files are large and may take a while to load, especially true if you are outside of North America.




Edited by mfdesigner

Share this post

Link to post
Share on other sites
Sign in to follow this  

  • Advertisement

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!