Games by Andrex

4kg Revealed!

I am very excited to say that 4kg will launch later this month on the Chrome Web Store! Me being the known Google fanboy I am, I couldn’t resist. It’s pretty funny how 4kg was originally for Android and is now for Chrome, both starting and ending up on Google platforms.

First thing I want to address is cross-browser compatibility. When I started developing websites (my byline is “Hobbyist Web and Game Developer” after all), I took an oath to never write a line of code specific to one browser. Originally this meant IE, as I was sick and tired of hearing web designers constantly complain about having to support it, and I decided to actually do something about it.

A little while ago this oath was put to the test for something unexpected: Firefox and Chrome/Safari CSS extensions. Things like -webkit-border-radius, or -moz-opacity. This was the opposite problem, coding to a specific browser’s strengths rather than around its weaknesses. Again I passed and tried to do things standards-based whenever possible.

And now we have the Chrome Web Store, a seemingly walled garden approach to the web. To be certain, doing anything for the Web Store is like balancing on a tight-wire. You have to be careful.

So, here’s what I’ve decided. 4kg will hit the Chrome Web Store later this month, and at the same time I will be posting the .zip file I upload to it here. Aside from the manifest file, it will be pure standards-based HTML and JavaScript. In January, I will look into hosting the game myself so that users of other browsers don’t have to download anything to play it.

There is one snag, but… I’ll get to that in a second. Here’s some screens of the game being played (it’s a dummy level, of course.)

Here is the title screen. If you click to expand it, you’ll notice it’s fuzzy (as are the following screens), but that’s because I’ve halved the resolution and then scaled it up by 2x. The reason for this is the engine I’m using, but I’ll get to that in a second too.

And here’s the game itself, with the player robot, enemy (“Crawler”), HUD, and alpha background/tiles. It is all completely playable and in fact, even the music and sound effects are working. The player robot and the enemy even have the correct animations for walking and jumping! (Correct enemy AI and running animations to be added…)

So, how was I able to pull all this off in less than a week? Well I’m glad you asked. It is all thanks to the Akihabara game engine. This allows anyone to make an HTML5 canvas-based game with retro graphics, which was an absolute perfect fit for this project. I was so surprised! Then the Chrome Web Store launched, and, well, I couldn’t stop my excitement from reaching 4kg! 4kg will still be free of course, but I wonder if I should make a “Donate” version too. Input would be appreciated!

OK, so what’s that last snag? Well, a few days ago I got an idea for a very cool feature that I think sets 4kg (Chrome version) apart from other games, even Web Store ones. What is this feature?

Achievements, using Chrome’s desktop notifications! Unfortunately, it seems like the notifications API has been taken out of the HTML5 spec (at least by the W3C.) So I have to rely on Chrome’s webkitNotifications class to do the job. Many extensions already use this, as it’s a native (to the browser) way of displaying nuggets of info (like “New Tweet!”) Being native also means it looks consistent across the websites, extensions, and apps that use it, which is always a solid plus in my book.

As far as I know, no game in the Web Store currently does something like this, but I expect it will catch on quick if it proves popular. Unfortunately, due to the nature of JavaScript as well as my own coding ineptitude, leaderboards for such achievements just aren’t viable. JavaScript by nature is inspectable and freely changeable by the end-user, so ensuring that results aren’t tampered with is definitely a challenge. Thankfully, being first (I think), I think most users will let that slide.

Again, this is the only browser-specific code I’ve written, and I will update it to a standards-based version if one ever becomes available. I have always tried to be as native to a platform as possible, and now the Web Store has made Chrome its own platform. (It’s a weak justification, I know…) As it stands, achievements will most likely be disabled at least initially for non-Chrome browsers. 

Finally, as a packaged web app, 4kg for Chrome will always work offline. However, the Web Store imposes a 10 MB limit on everything, and making 4kg meet that restriction will be a challenge. Primarily, the 9-track soundtrack I’ve assembled comes in at just under 40 MB on its own. So I’m thinking of either streaming the music (meaning probably only one track available when played offline) or downloading the music when the game is first started up after installation. Either way will push my coding skills even further, so I’m looking forward to it.

All in all, I’m very happy with where 4kg is now. The platform just feels right. And on the upside, I get to hit the widest userbase possible. Chrome alone sits at 120 million active users right now, more than any smartphone platform including Android, but it doesn’t stop there; combined with the non-Web Store version, I get to reach beyond any one browser or operating system. I am so excited right now!

More later.
-Andrex