How to create Android Games (.apk file) with HTML5?

I have just updated my list of how to create Android Games, with the newly added HTML5! Yes, i really mean using HTML5 to create Android Games in the format of .apk file which can be uploaded to the Google play store or other app stores. For those who are HTML or HTML5 savvy, I know you have yearned for this possibility. Why learning other languages (such as Java, Lua, Actionscript, etc) while you are already an expert in HTML5? Here, I would have some demo in this post.

Creating Android Games with HTML5 has been made possible and intuitive with the Intel XDK. FYI, the Intel XDK came from the acquisition of AppMobi. It can be downloaded for FREE. In fact, the Intel XDK can be used to create games which are compatible for iOS too.

The XDK is in the format of .jnlp. By following the instructions, you are able to setup the project folder containing the necessary javascript files after registering a new account on the fly. By default, it will use the localhost and port number 58888 as your emulator (better in Chrome browser).

Now, inside the emulator, click "START NEW" to create a new project:

Select "Create a new game app" and Click "Next". Then, to have a reference point, you can choose "Start with an Ejecta*-based Jump and Run sample" and click "Next". Rejoiced, you will reach the screen below:

Basically, you can have a taste on how good / smooth the game is. However, the demo isn't ended yet. Now click the 'Build for app store' (Build only) icon at the toolbar.

 You will reach the appcenter of Intel from where you can build your HTML5 games into an apk file.

Choose "Android Build Test" and click "Build App Now"

Congratulation! You have created an Android Game apk file with Intel XDK successfully! Easy right? Let's start creating Android Games with HTML5!

How to handle Back button event in Starling Framework?

When creating mobile games featuring intensive user interactions in Android, it is normal to notice that the players have a higher tendency to touch the back button (or the menu button) which is outside the region of your designed GUI. By default, the back button on the Android devices would immediately minimize your games' UI, without any warning. This is especially unfavorable when the player who intends to 'go back' to the previous game map, finally ends up having his home page popped up, and the game play experience is ruined.

Hence, it is a good practice to handle Back button event properly in Starling Framework. Below shows the necessary code snippets:

1. Import flash UI keyboard and keyboardEvent:
import flash.ui.Keyboard;
import flash.events.KeyboardEvent;
import starling.core.Starling;

2. Add an event listener in your main starling class:
Starling.current.nativeStage.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed);

3. Handle the Back button event with e.preventDefault function:
private function keyPressed(e:KeyboardEvent):void
{   
     if(e.keyCode == Keyboard.BACK)
     {
          e.preventDefault();
          e.stopImmediatePropagation();

          trace("Back button is pressed");
     }           
}
       

Where to download the free Ratebox Adobe ANE for Android?

When you reach this post, let me guess, you must have been spending the last few hours hunting for something like free "Rate My App" Adobe ANE to be used in the Android (with Adobe AIR actionscript).

At the same time, you have pretended not noticing the RateBox Mobile Extension ANE due to the obvious price tag $19.99. Furthermore, you may have temporarily overlooked the Rate App Air Native Extension as you wish you might get one with a much lower price or even a FREE Adobe ANE for the feature of "Rate My App" or "Rate this App". And finally, you could have been strongly determined that getting one that works in Android shouldn't charge any as there is one open source iRate that performs greatly in iOS.

HOWEVER, be ready to brace yourself... There ISN'T any free "Rate this App" Adobe ANE for
Android, at least at the time of writing.

Upset? You are not alone. As mentioned in my previous post, developing Android games with the Adobe AIR is sometimes frustrating.

Solution? I will update the post as soon as I found out the treasure. In the meantime, you are encouraged to create the feature of "Rate this app" by yourselves, since it isn't a very tough one.

Where to download the free Twitter Adobe ANE for Android?

One of the problems faced when developing Android Games with the Adobe AIR AS3 is that, most of the useful Social Networks and the Mobile Ads Networks companies do not officially release the framework or the libraries that integrate into the Adobe AIR. More often than not, the developers could either refer to the Adobe official sites which categorizes the Adobe Native Extension (ANE) into the commercial and the non-commercial group. In some cases, you may need to send a 'special request' to the customer support (eg: Vungle, Startapp) in order to get one.

In terms of the Facebook ANE, we are lucky that someone has produced a free and working one in github. But how about Twitter? Where to look for a Free yet working Twitter ANE for Android?

To our dismay, at least at the time of writing, there isn't any free Twitter ANE around from the search engine.

HOWEVER, there is a working Twitter API for Adobe AIR Flex Mobile project. Right, it is only for the Flex Mobile project, but not the Actionscript Mobile project. (T.T)

Anyway, I will update this post once I come across a working one. Stay tuned.

Why Candy Crush Saga Game could be so popular and successful?

No matter you like it or not, the Candy Crush Saga Game by King.com is really really a golden example of a successful mobile game that tops the chart in terms of the downloads and the popularity.
Ok. The simplest fact is, it reaches the downloads of beyond 100,000,000 (100 millions), and is still counting day by day. Regardless of what types of advertising or in-app selling approaches, this company must have earned crazily.

The thing is, what makes Candy Crush Saga Game so special? It is just using a simple concept of match-3 game. Remember the PopCap game Bejeweled that was once so widespread in the facebook last time? Both of them apply the same concept. And the subsequent Candy Crush Saga Game is still able to penetrate the market so successfully. Why?

To make it short, here's shows some convincing facts about the Candy Crush Saga Game.

1. Simple Game Play Experience

Candy Crush Saga only requires the player to match 3 or above candies of the same type. With the touch play experience, it is even more intuitive and easier than playing with the mouse. The game has overcome the boundary of ages, genders, countries and ethnics. Anyone seeing the game would be able to pick up fast, and complete each round within minutes.

2. Almost endless stages (beyond 400)

Candy Crush Saga always updates its number of stages. Since the game is designed to be platform-based, the number of stages could always be increased with some complexity added. For example, it takes a few more times to break the jelly, or to collect more fruits in a single stage, or to achieve higher scores with fewer moves. Technically speaking, it can go almost endless, as long as the developers wish.

3. Social Network boosted (Facebook)

Candy Crush Saga game has a very critical element to which the success of the game attributes - widespread through Facebook social network. To surpass the barriers of the entry of some stages, you need to request tickets from your friends (through Facebook). Furthermore, if you fail to complete the stages for more than 5 times in a row and do not want to waste too much time on the regeneration, you can request the moves from your peers. In the end? More and more of your friends help spreading the game while joining it.


In short, even though the Candy Crush Saga is not a graphic-intensive game, it still stands out successfully, defeating any other Android Games due to the elements of simplicity, endless rounds and the dissemination through the social network.

How to choose the best Mobile Ads Network for Android games?

Like establishing a website, one of the greatest motivations of creating android apps/ games is that, you can earn money in return, through advertising. In fact, there are tons of choices in the market, with each boasting of the high eCPM and revenue. The thing is, some of them even pay for writing non-justified commercial reviews in the forums (or creating a website for that), which further misleads the developers like us when making decisions.

When asking "Which is the best Mobile Ads Network" or "How to choose the best Mobile Ads Network", it is really tough to identify which facts on the search engine could really be trusted. I am personally a developer who hasn't been 'bribed' or paid for writing a discriminated review. However, i think it is appropriate to share my own opinions from time to time, at least for your reference about which options that i have tried before. And you can always correct me if i am wrong.
* I will always update this post whenever possible.

Admob
After realizing that Admob has been acquired by the Google, it is my first priority (and first attempt) of the mobile Ads network. It features a banner Ads that i liked to place at the bottom of the game display. The thing is, with the 50-100 downloads per day, the earning of Admob is pitifully low at around $0.50 - $1.00 per day. I have to honestly say the figure isn't that impressive (but at least i did earn something). After obtaining like $50 for the first time, i looked for some alternatives.

Revmob
I came across this mobile ads network in the forum. Some of the members have highly recommended this for a high revenue. I am attracted by the clean insterstitial Ads interface. However, after 2 months of advertising with this network, the stats shows dismay figures as well. Sometimes the number of impressions and installs don't really reflect your potential revenue. And the eCPM is even lesser than  3 (not even closed to the figure claimed at here). The support did respond quickly, but it was said that the number of impressions are not sufficient for the analytics. I will see how before adding more comments here.

Updated on 01 Oct 2013
Alright. After 3 months of testing, I would say Revmob generates poor results, at least for my Android game, despite the facts that the majority of the downloads come from the advanced countries like US, Korea, etc.

Vungle
This is the mobile ads network that caught my eyes in the Techcrunch tech geek site.. It only features a 15-second video ads (but it is quite special). The HD video quality is amazing. The Ads is pre-cached as well, providing almost no overhead when loaded. However, at the time of writing, the SDK only supports a landscape mode of video. If your gaming experience would be affected by the landscape mode, perhaps you need to wait for the future release. I would make more comments after having enough stats.

In the end? You are right, so far I haven't really found out a special mobile Ads Network that could really stands out (but i hope i am able to in one day, and update here). Furthermore, since different games have different gaming experience (and hence the Ads display), the comparison of the performance could have a slight discrepancy, unless all the games (that are using the different networks) are designed in a similar way.

Below shows the Alexa Ranking of some, as a reference of how popular the Ads networks are:

Mobile Ads Network	Alexa Ranking
Admob	4909
Revmob	29427
Vungle	81393

Apart from that, you may get some information from here.

Note:

• Some Ads Network have 'biased' results. For example, Revmob claimed that it has a higher revenue in iOS than in Android.
• Different Ads Networks have a different threshold for payment. For example, Admob pays if the accumulated amount reaches $30, while figure of some others is $100.
• Since Admob is acquired by Google, i would say that it is much more stable than any new start-up. The Mobile Ads Network industry is very competitive, such that you may never know which one will shut down taking your money away tomorrow. Remember the death of Adbrite last time?

Hardest Game Play Walkthrough

Hardest Game Play is a puzzle solving Android Game (at the time of writing, only available in the Google Play Store). Below is the Game Walkthrough that could be useful if you are getting stuck at a certain stage and being unable to reach a higher grade. The home page shows 5 achievement grades (ie: Alien, Genius, Greenhorn, Monkey, Supermonkey). If you have attained any, you will get the batch.

Achievement Grade	Requirement
Alien	<201
Genius	<211
Greenhorn	<231
Monkey	<251
Supermonkey	>=251

Hardest Game Play Walkthough stages:

Stage	Description	*Maximum Touch
1	Touch the big Play button	1
2	Touch each box until it forms a word of "PLAY"	9
3	Slide the arrow button to the right	2
4	Create 3 BINGOs (best with 2 diagonals)	13
5	Pop the growing bloons ASAP	20
6	Use the glass to detect the black Play Button	3
7	Touch the box until it emits a Play Button	21
8	Touch the box until it emits 8 stars, and light them up	17
9	Touch the stars sequentially from left to right	6
10	Whack(touch) the play button 3 times to make it fully fade-in	4
11	Put the play buttons in the filter	4
12	Place the play button in the Black circle, and darken it with the magic	10
13	Touch the big duck, and then the smallest dark	3
14	Drag out the shortest rope	2
15	Drag the bottom 3 boxes to the bin, then unlock with 3 keys	7
16	Start the green button, and stop it when the moving color hits the first box	3
17	Touch the sticks from the top to the bottom, sequentially	9
18	Loosen the screws by holding the touch	5
19	Touch the play button which is in the correct transformation	1
20	Touch any place to shoot, and shoot the enemy accurately for 3 times	4
21	Time 23:30 (11.30pm, hinted by the moon and the star)	5
22	Touch the image sequentially from A to Z (Amazon, Apple, Bing, Blogspot, Facebook, LinkedIn, Microsoft, Skype, Twitter, Wordpress, Yahoo, Youtube)	13
23	Release all the bloons, and pop them all	19
24	Remember the box sequence from 1-6 before the boxes fade out, and touch them accordingly	7
25	Rock Scissor Paper versus mode. Touch the RSP at the bottom which defeats the one displayed above. Beware of the dynamically changing when it goes on.	13

*Maximum touch: The threshold of getting the best result, beyond which it is likely to drop your grade.

Overall, the total of the Maximum touch throughout the 25 stages are 191. But as long as you could make it lesser than 200, you are probably having an extraordinarily non-human capability.

 Note:

•  In some stages, it is important to wait until the images completely 'fade-out' before continuing to touch.
• The reset button which appears in some stages would only increases your touch count, instead of really restarting the current stage. So you have to avoid it :p

Hardest Game Play is available in the Google Play Store

 
Yeah~ Hardest Game Play is now available in the Google Play Store. So far this is my second Android Game after the Quoridor Board Game. Unlike the board game, the "Hardest Game Play" is a game of puzzles solving, in which there are 25 stages in total. In each stage, all the player needs to do is to find out the "Play" button, precisely the one in the black color as shown below:

Each stage in the Hardest Game Play presents a different kind of puzzle (and different level too). To go to the next stage, the players have to solve the puzzle and touch the play button (pretty intuitive right?). After completing all the 25 stages, an assessment will be made based on the total number of the 'Touch' used by the players throughout the game. The lesser the touch, the better the grade.

There is one important point to emphasize here: NO instruction is given throughout the game. With only 'Touch' and 'Drag', the players would be able to complete the game. To use the touch as minimum as possible, problem solving skills, dexterity, accuracy and consistency are required. Of course, practice makes perfect. :)

There is one good news. On and above the version of v1.0.4, the Hardest Game Play has included a "Trial Mode". The stages of higher difficulty are picked as the trials. If you are able to complete all the trial stages with the 3 stars rating, you would be probably able to do well in this game.

Feel free to drop some comments on how to improve the game play experience.

Note:

• The making of the Hardest Game Play is inspired by the Flash Game "Click Play". However, the former interprets the user activity as 'Touch' instead of the 'Click' due to the game play in different platform (mobile devices vs desktop)
• Again, thanks to the TexturePacker. Without such a efficient and user-friendly tool, this game wouldn't be able to be released within such a short period of time.

***Due to the game improvement and modification, this game is currently not available at the app store. It will be re-published again in October. Thanks.