Ash Thorp, FITC speaker, FITC Tokyo 2016

News

Creating games with Starling with Lee Brimelow and Tom Krcha at FITC Amsterdam

With a coffee under my belt, I was ready for Lee Brimelow and Tom Krcha to get me up to speed on creating games with Starling.

After a warm welcome, Lee dove into the workshop with an overview of what Starling is,“an ActionScript 3, 2D framework on top of the Stage3D API’s in Flash Player 11, that is fully GPU accelerated. So you don’t have to worry about the low level programming. And Starling is mostly targeted for games but you can use it for any type of content.” They also mentioned that the name Stage3D is a bit confusing, because it is not only for 3D content, but also for 2D. A name that would be better suited is StageGPU, since that is more explanatory. The Starling framework is a joint effort between a company called Gamua and Adobe.

The goal of this workshop is to let us create a tank shooter game, complete with enemies, sounds and different levels.

We start by downloading some libraries and the free “Introducing Starling” book by Thibault Imbert. After this it’s time to create a new project and add those libraries. While doing this I had two problems: the provided Nape Physics Engine did not work for me in FDT, but quickly found a fix for this, turns out this SWC is compiled from HaXe and needed some hacking. The second problem was that I wasn’t targeting Flash Player 11 (Debugger) so after downloading this from Adobe’s I was all set. Also, it turns out that in FDT’s compiler settings for that specific project you have to explicitly set the -target-player to version 11.

During this workshop we get a lot of tips and tricks straight from the core and here and there some sneak peeks to new software by Adobe. Did you already know the new CS6 will have a Sprite Sheet exporter? You can just right-click on a MovieClip or Sprite in your Library and export that animation as a Sprite Sheet. Cool! For now we are using TexturePacker to create Sprite Sheets. TIP: Be sure to choose “auto size” when creating Sprite Sheets, because it will make the smallest possible size for you. Also select 'Allow Free Sizes'. After creating all of this it’s time to write some code. We start by creating the assets class. Another useful tip: Be sure to include the mimeType when embedding XML in your class.

Lee goes on explaining about Starling and what you can and cannot do. It is not wise to mix normal DisplayList stuff with Stage3D stuff. Make sure you use the Stage3D version of classes otherwise it does not perform. Anything that needs to update visually over time, needs to be added to a special class called “The Juggler”. Avoid nested hierarchies - use the flatten and unflatten method for this. Exporting a debug build will make your movie slow; don’t blame this on Starling or the new Flash Player version.

When it comes to the physics to put on specific objects, we rely on a library called Nape. Nape is fast and especially good when it comes to mobile. Box3D is not that fast and the Alchemy version is actually slower than the normal version.

The second tool we use is PhysicsEditor to add physics to our enemy sprites. It’s easy to use and has an export option for Nape AS3 that exports an AS3 Class. The only thing left is to change this class a little bit so it works with Starling. We change the import flash.display.DisplayObject to starling.display.DisplayObject and remove the graphics rotation so it reads graphic.rotation = (b.rotation); and that’s all there is to it. When we come back to our code, we type some more to get the physics body to work with our enemy Sprite and make use of this exported class - it works! Almost there! Now I’m up until the point where we build a fully functional game that makes the enemies bounce with the gravity settings from Nape. Very cool indeed, and all this was done before lunch!

After the break, we started creating particle effects with a cool tool called Particle Designer that can be used for Starling.
Devon Wolfgang already created a web tool for creating particle effects. You can tweak your effect the way you like it and then even export it, so you can import and use it in your project.

Another cool thing we learned is creating our own levels using CS5.5. How does this work? Just place all the objects you need on the stage, export these object for AS, iterate over them and trace out the X, Y, width and height values so the trace looks like valid XML (here is a pastie). This code is then used in our project to create a level. Simple, but powerful stuff.

After the workshop has ended, Peter from blog.flash-core.com shows us some demos he has created with his own Genome2D library and tells us useful tips on reusing of code, object pooling, linkedlists, particle systems and ninjas!

In the end we have created a tank shooter with game states, actual bullets, sound effects, physics, levels and a score keeping mechanism. I can play this for hours! I learned a lot, so for me it was “Level Complete.”