Category Archives: Milk carton boy

Playing with WebGL & Three.js

Posted on by
3

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 😉

Exporting Metaseq to Away3d4

Posted on by
3

By the time I wrote this post, Away3D4 was still in alpha version. Unlike Away3D 3.X, there was no Metaseq parser/loader available 🙁 That’s not a problem since we can export MQO 3D model to OBJ using Metaseq itself. The problem is the export settings can be tricky and take some trials-and-errors to get it right.

Here’s what I did to export my MQO model to OBJ:

  • It’s better that you remove unnecessary layers like bone and anchor. Save your model as other file and remove those unnecessary layers.
  • Leave the size to 1.0
  • Away3D use different axis than Metaseq, we need to convert our module axis.Choose the axis to POV-RAY, this is the one that compatible with Away3D
  • Select the UV mapping and also select Invert V
  • Export Normal Vector and Grouping
  • You can export Material Library, which means Metaseq will export OBJ and MTL file. Since I prefer to embed my textures inside my SWF file, I uncheck this options and will assign the textures/materials later using ActionScript.
Export settings to OBJ

My export settings

If you have Flash Player 11 installed on your browser, you can click the image below to see the demo of loading OBJ exported for MQO.

Download the source code here (including MQO, OBJ, and FlashDevelop 4 project files)

Setting Up Metasequoia Plugin SDK

Posted on by
16

I’m currently making a 3D Flash game using Away3D. For 3D modeling and animation, I use Metasequoia with additional plugin called Keynote. They’re really great tools although at the beginning I had problem with the workflow.

My workflow was like:

  1. Create 3D model and animation using Metaseq and Keynote
  2. Save manually every animation frame as MQO file
  3. I create my own tool using Adobe AIR. This tool loads all MQO files and combine them into a XML file
  4. Away3D (Flash) loads MQO and XML file and convert them into vertex animation

The process #2 and #3 were very time consuming. So I decided to learn Blender. I was hoping I could export the animation into MD2 file directly from Blender file (shorter workflow).

It wasn’t the right decision for me. Learning Blender was so hard and frustating. Strangely, it’s not my first time learning Blender. I already did this several times and always forget everything once my project was done. This time, I tried the new Blender 2.5 beta, which they say, have better and intuitive UI.

There were a lot of hair pulling moments, problems with the UI, always fail to setup rigging for animation, confusing documentation, and there was no working MD2 exporter.

I know Blender is a good tool, in fact that there’s a lot of games and movies done using Blender, but this tool is just not for me.

So I switched back to Metaseq and dare myself to create Metaseq plugin. Yes, you can create your own Metaseq plugin. You can download Metaseq Plugin SDK for free and use Visual C++ to create the DLL files.

Milk Carton Boy, using Metasequoia and Keynote

The instruction was in Japanese and still using Visual Studio 2002 or 2008. Luckily, I managed to make it work using Visual Studio 2010 Express Edition on my Windows 7. Here’s what I did (can’t remember precisely.. sorry):

  • Install Visual Studio 2010 Express Edition C++
  • Install the latest Windows SDK, Windows SDK 7 & .Net Framework 4, version 7.1
  • Install the latest WTL library. I use the latest one, WTL81_9127. Extract them manually.
  • Download the latest Metaseq SDK ( mqsdk249c.zip) and extract the file.
  • Import MQSDK workspace file as VS2010 Solution file
  • Add WTL location to C++ include directory
  • Try to compile one of the project.
  • Copy the dll from release folder to metaseq plugin folder and test it

In the end, I managed make a simple plugin 🙂 It reads Keynote animation data and export them into my custom XML data. I had fun and realized that it’s been 2 years since the last time I am using C++.

Note: Only the non-shareware version of Metasequoia can use plugin. The shareware one does not. But it’s quite affordable, only $45. I could imagine if you use Blender, you could spend that much money for books and tutorial DVDs.

Note #2: You can download the source code of my exporter plugin here: http://abiyasa.com/lab/away3d/mqoplugins/mqoPlugins.zip (around 54K). I use Keynote API (included if you download Keynote plugin) and use the example (ExportXS) as the basic for my plugins. Feel free to ask me if things are not clear 😉

Milk Carton Boy for Android

Posted on by
Reply

Two months ago, I released Milk Carton Boy Shake Well for Flash mobile. I developed it using FlashDevelop, Away3D, and Flex SDK 4.1 and didn’t use any mobile specific APIs (gesture, touch, or accelerometer). Basically I just adjust the screen size for 400×678 and the game works really well on Android Browser with Flash Player.

Now I have my Samsung Galaxy S, it’s much easier to test the game. It is quite easy to convert an existed FlashDevelop’s Flash project to Android AIR project. So I immediately convert the game to Adobe AIR app and tested on my Android.

Milk Carton Boy installed on Android

Milk Carton Boy installed on Android

Here are some interesting things that I found during the testing:

Milk Carton Boy for Adobe AIR performs (a little bit) slower compare to Flash Player! This is quite surprising since I expect that it could run faster, well at least runs at the same speed 😐 I’m using Adobe AIR 2.5.1.1774 and my Flash Player version is 10.1.92.8

I really need to implement a button to quit the game. I never see any Flash game with a quit button. That’s because we don’t need it 😀

When the user closes the browser or browses to other page, our Flash game will be gone automatically. However, Adobe AIR app, just like other Android app, will be moved to memory if the user press HOME button or BACK button. It will stay in the memory until the OS kills it (when it needs more memory). That’s why if you don’t explicitly quit your app, it will stay (or even keeps on playing) on background.

As a bonus, here’s what I did to convert my FlashDevelop project for Flash to FlashDevelop for Android 😉

  • Copy your FlashDevelop project to another file name, like myGameAndroid. You can have two project files on the same project folder
  • Now open you project file on any text editor (Don’t double click it). Modify the following properties:
    • Pre-Build command 
      <preBuildCommand>taskkill /f /fi "IMAGENAME eq adl.exe"</preBuildCommand></pre>
    • Build Option. Inside the <build>, change the <option additional=”” /> to <option additional=”+configname=air” />
    • Other project options 
      <!-- Other project options -->
<options>
   <option showHiddenPaths="False" />
   <option testMovie="Custom" />
   <option testMovieCommand="$(FlexSDK)binadl.exe;application.xml bin" />
</options>
  • Make sure that you have installed Adobe AIR SDK 2.5 on top of your Flex SDK, creates the application.xml, and the certificate file. See my previous post about creating Adobe AIR app for Android
  • Delete any files on obj folder before opening the project file

Enjoy!

My New Phone Samsung Galaxy S

Posted on by
Reply

Last Tuesday, I just bought my new mobile phone: Samsung Galaxy S. My old Nokia N80 was broken, the numpad is not working anymore.

Actually, it was hard a choice between iPhone4 and Samsung Galaxy S. Between iOS and Android.

iPhone 4 looks and feels really great. Eventhough I am a Flash developer, I think iOS is a great platform to develop. The App store is really a good channel for indie game developers. There are many good games on App Stores which make more people buying iPhone/iPod. The more people have it, the higher chance soneone will bought your game.

However, I don’t have a Mac computer. To develop a game for iPhone, you need a Mac computer.

On the other hand, Android supports Flash. I can use Flash to develop game for Android web browser, and also create Android App using Adobe AIR. And on the last 1 month, I’ve been working on Android projects on iconmobile, so buying Android is more benefecial for me right now.

That’s how I end up with Android, and Samsung Galaxy S is the best Android phone currently available 🙂

I believe I will have both iPhone and Android later, but right now, I’m buying Android first.

Just after I got my Android, I just check how my Milk Carton Boy performs on real device

Milk Carton Boy on Samsung Galaxy S

Milk Carton Boy on Samsung Galaxy S

I also convert Milk Carton Boy to Android App using Adobe AIR. It’s not that hard to setup Adobe Air for Android using Flash Develop.

Stay tune, I will create share some development tips for Android using Flash 😉