We have been working for five months on a medium-scale app for a large multi-national company. As we approached the beta phase, requests for new functionality started coming, but with 25,000 lines of ActionScript, it was already taking over 45 seconds for the app to compile from the Flash IDE. I made the call to migrate the project over to Flex, and this will be the basis of the discussion as to why every ActionScripter still using Flash as their compiler and IDE should move to Flex Builder.

Over a short series of articles, I hope to shed some light on the reasons. To sum them up:

1. Every time you save a class, your app compiles in the background – meaning you NEVER need to wait for that “Exporting SWF Movie” dialogue box ever again. This alone is enough once you get into a big app…
2. SVN support – in layman’s terms, great version control. You work on a class, and when you are happy, you save (”commit”) a new revised version with comments as to what you’ve done. When your app reaches a stable state, you can save it all as a safe working version and press on. You can always compare old versions and retrieve them if need be.
3. Profiling your apps – if you’ve been used to relying on “trace” statements to debug your apps, you will not believe the precision with which you can dig into the performance of your apps. As well as realtime memory graphs, there are many excellent tools available. For example – loitering objects – take two snapshots of your app’s memory usage over time as it runs, and you can compare the two, seeing not only what objects are still hanging around, but where they came from in the first place – astonishing!
4. Testing in the browser – you get a much better feel for how things will really work
5. Creating Flex libraries – for many Flash devs, this is a bit of a nightmare at the beginning, as we’ve been used to setting one preference to give all projects access to whatever classes we like. Its a bit more complex in Flex, but once you’ve compiled your most useful classes, its a breeze to export and use them, and all makes sense

The aforementioned app is built in PureMVC, and is due pretty soon, so I don’t imagine I’ll have a chance to publish anything before then… but I do hope it will help people through the “banging head off wall” phase that I went through on the early days of trying to make the app work in Flex Builder.

Just launched a minimalist 3D Flash showcase site for a lifestyle store in London – Bermondsey 167.

The idea was to use “tags” behind the scenes so that various “rooms” could be generated easily and quickly without any limitations. Tags can be visible frontside or hidden – for example, everything tagged *init appears on the homepage but that tag is never actually visible to users. This allows a more organic browsing experience that you would have if you went into the shop – one second you are looking at the beautiful shirts of Michael McGrath’s label M2CG, but you turn round and you’re looking at his equally stunning mirror tables and units. Similarly a bright top on the site tagged with “colour” can be clicked to generate a ‘room’ with just colourful items from bookends to photos to a cotton slipover.

Its a quirky shop, with quirky owners and a quirky little dog running around… but that is all part of the character, and it was a lot of fun.

(more…)

I love TweenLite, Jack Doyle’s lightweight tweening engine. Its a bit of a cheat, but we’ve all got to have our little tricks and time-saving moves when deadlines are looming and your fingertips are melting.

I’ve just been coding up a short script to crossfade video stills as you flick through using a navigator. I won’t go into the full code, but let’s suppose you have an array of display classes that hold images, and you are just looping through them. If you have a function called say 'showImage' with one parameter 'state' which is set to true or false – depending on whether you want to show or hide the image – then with TweenLite, you can do this:

public function showImage(state:Boolean) : void
{
  TweenLite.to(this, state?0.5:1, {alpha:Number(state), visible:state});
}

And that’s it. What that means is that if you call 'showImage(true)' on one of your objects, it will have its 'visible' property set to true, and fade to full visibility in 0.5 seconds. If you call 'showImage(false)' on one of your objects, it will fade to alpha zero in 1 second (causing a nice overlap), then have its 'visible' property set to false on completion. Nice one, Jack.

If you haven’t that many objects, and don’t want to have to load up your server with a stack of calls to reload images, this is a cool little routine. If you want source code, just comment… I’ll see what I can do.

Edit: following a comment by @Justin Flash I’ve found there is an even quicker way…

public function showImage(state:Boolean) : void
{
  TweenLite.to(this, state?0.5:1, {autoAlpha:Number(state)});
}

This assumes the “autoAlpha plugin” is activated in your TweenLite constructor.

Just delivered the beta version of Animals Are NOT Rubbish for Orion Children’s Books.

The idea behind it is a competition where children have to make models of animals from recycled rubbish. They have support from Waterstone’s booksellers and the Born Free Foundation so it should be a good campaign.

It was mostly done in straight HTML/CSS, but we thought it would be nice to actually make the recycled animals idea in an intro sequence where rubbish was whipped up and moved around to make some animals. The end result is fun, and quite hypnotic. Thanks to Jack Doyle for the excellent tweening engine TweenLite which we used on the project and recommend.

The artwork all came from books by Lauren St John whose site we did last year. The artist, David Dean, has commanded great respect from all at G-RAFF for such lovely attention to detail, which made it easy to recycle the work for a website.

Steve Jones, creative director here. I have decided to start using Twitter because I just liked it from the first moment I saw it, in the same way as I instantly hated Facebook.

First thing I noticed was that the API situation for Flash was pretty woeful, so I’m writing a bunch of new “TwitterService” classes right now – starting from scratch – and will “tweet” the URL to the ZIP of AS3 files when I’m done. If anyone else fancies jumping in to develop them, that will be cool.

G-RAFF ON TWITTER

Manically busy at the moment, hence the sorry lack of updates. Moving into a new office next week, writing a killer PureMVC/PaperVision3D app for a big company you all know, working on a lovely trio of sites for Nigerian superstar Dare Art Alade, microsite for Orion Books, a great new community-funded film site, new stuff for Suburbia Media as they launched LOVE magazine, just about to go live with Bermondsey 167… the list goes on.

We’re also looking for freelance Flash developers if anyone is around. Familiarity with PureMVC will be a good help. Please don’t even launch your email client unless you are serious.

EDIT: Now 00:10 on Sunday night (no, its not Monday morning until I wake up) and I have just launched FlashTwitter as an open-source beginning to a decent Flash API for Twitter. I’ve had fun during the day, and hope this will be of some use.