They were 11 Clones

Checkout my latest game for #onegameamonth project: They were 11 Clones! It’s a 3D top-down twin-stick shooter with a twist: you can clone yourself (up to 11 clones!) & make scores by depositing the clones.

they were 11 clones

The game is developed using Ash Framework, Starling framework and Away3D 4. You can check the source code at GitHub. Feel free to fork & modify the project as you like 😉

Motivation

I love twin-stick shooter. I’ve played mini gore, Age of Zombies, Guerilla Bob, & many more, but my favorite is still SisPri Gauntlet. It has chibi characters, big map & levels (instead of open arena), bullet hell, and epic big boss battles.

I’ve always wanted to make one with 3D character but back then Flash didn’t have GPU-acceleration. Now we have Stage3D but there aren’t many top-down shooters yet, so I decided to make one.

What’s with the name? The title was inspired by the movie They were elevenWhy eleven, why not 10 or 8? because the game development was started on November 🙂

I love Ash Framework

This is my second attempt with Ash Framework & I’m really into this framework. It takes time to get used to entity-component-system thingy, but once you get it, your game architecture will be cleaner & easier to manage. Coding will be much fun.

So I’ve decided to convert all my existed game prototypes into this framework. And just two days before I wrote this post, Rob Bateman from Away3D has also re-written his Inawayders using Ash Framework. That’s a good sign.

Finishing is hard

This game was originally made for GitHub Game Off last Nov 2012. Unfortunately, I didn’t make it on time. Luckily, I got my seconds chance through Indie Goodbye. I keep on polishing the game & submit it as my January onegameamonth project. Even the game is still not completed 100% yet (no sound, only blocky character, no character animations, no shiny FX) but I’ve decided to publish it anyway.

It takes discipline and lots of motivation to finish. That’s why I join onegameamonth project as an exercise & also bought McFunkypants’ GameJam Survival Guide book. It’s a really good book on how to finish your game. I totally recommend to read it even if you’re not joining any game jam soon 😉

So what’s next?

onegameamonth for February and playing with Ash Framework JavaScript. Stay tuned 😉

Experiment with Ash Framework

Months ago, I was experimenting with HTML5 game development. Since it’s a fresh start, I thought, why not start with a better game architecture? So I made an experiment with Backbone.js, one of the famous JavaScript frameworks, but I don’t think MVC/MV* would fit for game development. That’s when I found  entity-component based framework.

There are many famous game engines which already use this kind of framework like Unity3D or XNA. I found some on the list of JavaScript game engines but I was surprised when I found even more for ActionScript 3:

I tried to learn more about this and found a very good article by Richard Lord. He wrote a good explanation on what entity-component framework is and why it ‘s better for game development. He also developed Ash framework for ActionScript 3. It includes a simple Asteroid game, but once I’ve read the source code, I was immediately sold to this framework.

Ash framework is simple and minimalist. It only includes the basic components which means you can combine it with your favorite 2D/3D, game or physics engines, and can be easily ported to JavaScript or Haxe (someone have already done this. See HashDS and Ash-Haxe).

So I made an experiment, extending the Asteroid game so it can support Native Flash, Starling, and Away3D. All renderers in one game!

Checkout the demo at http://abiyasa.com/lab/away3d/ashteroids/

Using Ash framework, it is easy to switch between renderers. The game logic and other components stay the same; the only difference is which renderer system is being used. Check out the GitHub page for more info about this 😉

It’s funny how I started with HTML5 game development but end up with a better ActionScript framework 🙂

Bonus: Some other articles on Entity-component framework:

WebGL is not ready yet

I’ve been exploring WebGL for game development. So far, there are many things that I like. I love the fact that you don’t have to compile anything. Edit your source code, open it on a browser, and click refresh! You can even debug your code directly on the browser (I <3 Chrome)!

If you know Away3D, you might going to like Three.js. Three.js to WebGL is just like Away3D to Stage3D: easy to use, readable example codes, and has some high level functions for animations, particles, and models loading.

Everything sounds perfect, right? Unfortunately, when it comes to mobile and tablet support, WebGL is a big disappointment.

There is NO support for WebGL on mobile browser and tablet. If you check on caniuse.com, there is no WebGL on Android Browser, Chrome for Android, Firefox for mobile, nor the iOS Safari. Not even for the latest versions 😐

I’ve tried FireFox Beta & Dolphin Beta for Android, both claim to have WebGL support. Firefox displayed nothing while Dolphin only managed to show rotating globe with less than 1 frame per seconds. FYI, I tested this using my demo on my Galaxy S with Android 2.3.

Same problem with HTML5 Canvas. Although it is has better support than WebGL, the performance suffers a lot on mobile/tablet devices. I played some HTML5 games and sometimes the framerate drops to 5 fps. It could be the hardware or browser problem since the games run smoothly on iPhone4S/iPad3, or maybe it’s just the common problem of HTML5 games?

Sometimes I wonder, what’s the point of having your game in WebGL if it’s only available for desktop browser. You could’ve done it using Stage3D. Even better, with the help of Adobe AIR, you can compile the same source code and have your game running on mobile and tablet, either it’s Android or iOS.

Don’t get me wrong, I don’t hate HTML5. I do believe HTML5 and WebGL could be the future of web gaming. It’s just that it’s too much hyped but not ready for the present.

Is it useless to learn HTML5? Definitlely not! I can say that learning JavaScript makes me a better ActionScript programmer. How? I’ll write more detailed post about this one 😉

Stay tuned!

Playing with WebGL & Three.js

I’ve been playing around with JavaScript lately: trying BackboneJS, developing a small project popup help, and reading good articles about ‘modern’ way to use JavaScript.

I still think ActionScript is better but there is one thing that I love most from JavaScript:

No compiling is needed!

I really really love this. You type your code (using Adobe Brackets or Notepad++), refresh your browser, and you see the result. That’s it 🙂 This allows faster workflow, you can easily try this and that and see the result immediately. With cool debugging tools from Google Chrome or Firebug on Firefox, you can check if there’s something wrong with your code on the browser.

Anyway, I’m currently trying Three.js for WebGL and so far I like it. The setup is easy, just like Away3D. Totally recommended if you’re familiar with Away3D or other 3D engine. Three.js also includes some python scripts for converting OBJ models into its on JSON-based model.

You can click the image below for my Milk Carton Boy model in WebGL using Three.js. Unfortunately, it only works if your browser support WebGL.

The source code is available on GitHub 😉

Re-learning Javascript

Lately, I’ve been re-learning Javascript.

Back then in 2004, I used to use Javascript for doing some DHTML stuff (popups, DOM manipulation, …). Nowadays, people start using JavaScript in more structure way to avoid spaghetti code. So I learn how to use some MVC frameworks (like backbone.js or ember.js) and also make myself familiar with JQuery.

Here are some wip learning projects on my GitHub:

    • backbone-cellar: Forked from Coenraet’s Backbone tutorial. I implement Node.JS for the backend support.
    • Alaycator, a simple bookmarklet for converting any website into alay, some kind of Indonesian leetspeak which is popular among teenies 😀
    • todotodo-bootstrap: A simple todo list webapp using Backbone, Require.JS, and Twitter Bootstrap for the UI. Supports mobile and desktop, and stores the data on local database. Contains simple Node.JS script for testing on webserver. I plan to make the JQuery Mobile version of this, stay tuned!

I still think that ActionScript, as a language, is still much better than JavaScript. But the thing is, ever since HTML5 got its hype, JavaScript  has gained LOTS of momentum. People get really excited about it and build amazing things using JavaScript, even on server side.

There are lots of open source projects; people trying to contribute for making better tools or libraries, and all of these grow so fast. Even some Adobe Flex evangelists start promoting JavaScript and HTML5.

At certain point, unless Adobe do something, JavaScript will catchup and will be able to do anything that Flash can do. Hey, maybe that’s not a bad thing 😉

I believe Flash will not be dead soon and will focus more on what its best: High performance and rich multimedia web/mobile app, including games. I’m not saying that all of these things cannot be done by JavaScript but right now, I still think Flash performance is still the best.

If you want to learn JavaScript the ‘modern’ way, here are some suggestions:

  • Douglas Crockford’s JavaScript: The Good Parts. This is a must read! I find this book helps me to switch my mindset to JavaScript specific things like object/prototype, function closure, the bad parts, and also tips & tricks to avoid the bad parts which make your code more structured 😉
  • Addy Osmani’s Essential JavaScript Design Pattern. This book is available for free on his GitHub project. This book give some examples how to build more modular and structured JavaScript development.
  • Addy Osmani’s Backbone Fundamentals. Another free book from Addy Osmani, if you want to develop structured, large, and scalable webapp using Backbone.