So you made your game or some other app that has multiple sound effects produced by several audio files. It works great on your desktop, laptop, etc. browsers but then you realize that you have some major issues with multiple sounds (or even single) on mobile and tablet platforms like iOS and android browsers. Sad!
In one of my earlier posts I discussed some of the issues (or limitations) with HTML5 audio support in iOS and Android mobile and tablet platforms. In this article I am going to try to take a look at some of the ways we can overcome those limitations and quirks.
Few months back I was developing an HTML5 game where I really struggled with adding and playing the different sound/audio effects properly across different browsers and platforms, especially in mobiles and tablets. As I made some progress, I decided to document the support and behaviour of HTML5 Audio in mobile environments – iOS and Android – based on my trials.
First of all what is weighted random ? Let’s say you have a list of items and you want to pick one of them randomly. Doing this seems easy as all that’s required is to write a little function that generates a random index referring to one of the items in the list. Sometimes plain randomness is not enough, we want random results that are biased or based on some probability. This is where a simple weighted random generation algorithm can be used.
Few days ago, I wrote a post about why time based animations are better than frame based animations. However, in animations done as a function of time, some serious problems could arise. One of them is that your regular collision detection techniques might fail if the frame rate is lower than acceptable. Your object might pass through the walls or even fall through the floor!
So you got into Web Based Animations or Games (using that HTML5 thingie) and chances are high that you’re relying on
setTimeout or even better – requestAnimationFrame to reflow and repaint your frames (fancy terms for rendering each animation frame). Precisely, you’re basing your animations or game mechanics on the frame rate. There’s nothing wrong with that, but let me show you a more sophisticated approach which can actually enhance all sorts of user experience – time based animations.
Continue reading “Time Based Animations in HTML5 Games: Why and How to Implement them”
So I coded a game this month for the github game compo called “Pappu Pakia“. This is my first HTML5 Game with beautiful graphics by Kushagra. When I was finished with the coding part, it was pretty exciting until I played it a few times when my CPU was busy, then on an old laptop and finally on a mobile device. In all the cases it was laggy, except in the last one where it was super slow. So what do we do now ? Time to Optimize!