FITC – Amsterdam 2012

FITC monsters!I’ve just got back from Flash In The Can 2012, whoa, sorry I meant Future, Innovation, Technology, Creativity, 2012, in the lovely city of Amsterdam. I thought I’d do a quick brain dump of some interesting bits and pieces that I took away from the conference.

Adobe and the future of the Flash runtimes

Something I was interested to see was the way that Adobe handled themselves in response to recent ill-conceived communication decisions they’ve taken in regards to the future of the flash platform. On the whole I think they did very well, they offered a frank apology and backed this up with more information on the roadmap white paper they published on the 22nd of Feb 2012. Its worth a read, but in summary Adobe have selected two main directions they will be taking the flash platform in: gaming and premium video. They decided that the platform was growing in too many directions and being used in too many inapropriate places. I think its a good decision, the focussed approach should lead to more stable releases and more interesting features for us to play with! The release of Flash Player 11.2 and AIR 3.2 support this new direction with inclusion of mouse lock (for gaming and infinite scrolling), middle and right mouse click events (meaning the context menu can finally be overridden) and Stage3D for iOS and Android. Adobe also stressed that although these are the areas that they will be focussing on, the improvements in performance will benefit everyone. For example proper multi-threading will be introduced and I could use that right now in a project I’m working on instead of having to manually spread a complex process over multiple frames ;)

Create JS

Grant Skinner did some interesting talks about his HTML5 tool suite CreateJS and his company’s transition to doing more HMTL5 work. CreateJS looks like a great starting point for flash developers who want to dip their toes in the JS/CSS3/HTML5 sea! He also mentioned that his favourite JS IDE was WebStorm for what its worth!

ASFEAT

I, along with the rest of the room, was totally blown away by the amazing work Eugene Zatepyakin has been doing with his ASFEAT tools. For a taste of what he’s up to check out his Vimeo channel because, lets face it, looking at demos is fun! I’ve embedded one that is especially mind blowing, he uses the light from the room he’s in to create a light map for his AR 3D content. The result is that the 3D content appears to be lit in the same way as the rest of the room. Genius!

ASFEAT | real world light system for AR from Eugene Zatepyakin on Vimeo.

Stage 3D

Some of the most exciting stuff I saw was built using Stage3D, both for desktop and mobile (using AIR 3.2) the performance issues that have plagued Flash apps on mobile devices have been largely done away with now that AIR can leverage the power of the hardware’s GPU. We saw some stunning game demos for both mobile and desktop, my favourite was probably BlackSun firstly because it looks amazing and secondly because I love twin stick shooters! It is built by Aerys using their Minko framework.

Monocle

I almost forgot about Monocle (WIP name) an amazing new profiling tool from Adobe (you may have seen at Max 2011). It runs as a stand alone app and will profile any running swf. The interesting thing is that you don’t need to be running the (slow) debugger version of Flash Player to be able to use it. The up-coming versions of the player will automatically expose profile data. Thibault showed a demo where he stepped through each triangle draw of a Stage3D render to build up the scene in the profiler. Monocle looks ace and seems to expose a lot more data than the FDT profiler (sorry guys).

See you next year Amsterdam!

Facebook Game – Mountains out of Molehill

Facebook Game - Mountains out of MolehillSorry for the gratuitous pun but I couldn’t resist ;)

I’d been meaning to do this for a while but this weekend I replaced my BitmapData based renderer for my game with one that utilises the new hardware accelerated graphics of Flash Player 11 (formally Molehill). Rather than getting into the low level code required to make a custom renderer I decided to use one of the 2D frameworks that the Flash community have come up with. I chose the excellent ND2D by Lars Gerckens because it seemed to have all the features I’d need and the demos blew my socks off (press space to cycle through the demos on that page)! I like Lars’ implementation of Sprite Clouds (a group of sprites with a common texture), they work perfectly for game entities like projectiles and particle effects.

My renderer is un-optimised (I was eager to get something up and running as soon as possible without doing too much refactoring) and I’ll be making some changes to bring the game more in-line with the ND2D display list paradigm, but I think its a good start. I’ve noticed a huge performance boost already, the game is running at a smooth 60fps on my PC now. The next step will be to up the game viewport size as this was previously limited by how many tiles I could render every frame using BitmapData.copyPixels() without performance suffering. I’ve also noticed that screen tearing has completely disappeared (it was a real pain when using the BitmapData method).

If your planning to get involved with Flash Player 11 game developement then there are a few things to bear in mind when designing your application structure. The biggest one is that all Stage3D content is rendered on a layer (or layers) below the main flash stage. So, regardless of where your ND2D world is added to the display list, your game content will be behind all other display objects. As a result you need to cut a hole through all display objects that make up your UI (backgrounds etc) so the Stage3D content can shine through. Another thing thats worth implementing from the get-go is a time based (rather than frame based) update system. This is standard game dev practice but I’ve only just got into it. Instead of moving items the same distance every frame (I believe) it is better to move items based on the time since the last frame was rendered. All ND2D sprites have a step() method that accepts an ‘elapsed’ parameter. The ‘elapsed’ param is the number of seconds since the last update and all movement should be based on that (“sprite.x += 1 * elapsed” rather than “sprite.x += 10″). The resulting movement is much smoother as it compensates for variation in the number of milliseconds between updates caused by CPU/GPU usage.

Dabbling with this framework has got me really excited about the possibilities that will arise when this version of Flash Player penetrates through the market enough to start using it for client projects!

Money Timeline

Money Timeline

My girlfriend suggested I use a budget to keep a better grip on my finances. I never got around to doing one because I got sidetracked by making an AIR app which imports my bank statements and visualises my expenses over years, months and days. It was great fun to create a tool which I actually use and looks nice!

Money Timeline - Day View

Facebook Game – Work In Progress

Facebook Game - WIP
I’ve been working on this game for some time now. Its a twin stick shooter in which players settle a land and then defend it from attacks whilst attack lands owned by their Facebook friends. The graphics engine uses BitmapData blitting to render large numbers of assets quickly. The system generates landscapes using perlin noise which can be seen in this render of possible lands – http://www.flickr.com/photos/tomdanvers/5765825135/lightbox/. I’m allowing players to see my work in progress builds so I can get feedback as the game progresses.

http://apps.facebook.com/re-source/

AS3 UI Components

AS3 UI Components

I’ve been using these user interface components for a few years now, tweaking them as projects come and go. Click on the image above or here to see a working example of my ToggleButtonBase, ButtonBase, SliderBase, ToolTipBase and ScrollBase AS3 classes.

ButtonBase is a multistate button that works by extending a MovieClip in the Flash library with ButtonBase.as as the base class. It means the various visual states are controlled on the IDE timeline (see the gratuitous green button).

ToggleButtonBase uses two instances of ButtonBase and dispatches ToggleEvents when the user changes it’s state.

SliderBase dispatches SliderEvents which contain a ‘value’ property that changes from 0-1 as the user drags the slider from left to right.

ScrollBase takes various display objects (background sprites, content display object, and 2 or 3 ButtonBase instances) to create a vertical content scroller. See ComponentTestDoc.as for examples of how to do this.

The source files are zipped here if you want to have