timeline toys December 29, 2008

Posted by headwinds in Blast Radius, Flash, Gaming, User Interface.
trackback

Over the last month, I worked with a local Flash contractor Robert Johnson, and we developed the wii music micro site. It had its fair share of technical hurdles involving heavy omniture tracking, multi-language support, and the ability to work on both the web and the wii console which only supports Flash 7 and suffers from poor memory management.

With the Flash 7 limitation, we decided to develop this site in AS2 but create two versions; one for the web and one for wii console.

The web version sits in one html container and is thus a more seamless experience with transitional animations than wii version which has several html pages. We needed to divide up the wii version so that we could completely flush wii browser’s memory and feed it smaller blocks of data. We also used slightly lower quality videos (higher compression) for the wii to help with the memory constraints.

After several months in the Flex 3 IDE, I found myself back in the Flash IDE coding a mix of AS1/2 and re-discovered the timeline. I know a lot of developers dismiss the timeline as being awkward and clunky; for some reason I get the feeling that it is not considered serious programming. The timeline seems to be more about configuring than coding. It can be used to quickly prototype complex interactions; and it can save you time and mental anguish.

Sometimes, I find I can be more creative visually with the timeline. Unlike Flex, I have pixel perfect control on placing objects on the stage. I also have access to guides that allow me to send sprites shooting off along hand-drawn arcs that would be very difficult to do mathematically. For instance, on the Play Your Way section, the video thumbnails have intricate animations and multiple states which could have been developed purely through code, but frankly I found it easier to use the timeline and a create a re-usable movieclip with a simple API to control it. Otherwise, most of our code was found in #includes and classed out; but in this case it made sense to me go this route and apply a good OOP strategy to encapsulate it. It does take some planning though.

You can vaguely see some of the layers in this screen grab, and I want to point out a couple essential layers. I’m using some old school tricks such as the click shield layer that capture mouse events and hides the mouse cursor when turned on. I’m also using a guide layer to help the sprite follow an arc as it swings out which would quite tricky to program if you’re not trig genius. Had I approached this with pure code, I probably wouldn’t have thought of that animation and did something easier with tweener like a horizontal slide. By looking at this visual easing guide, I was able to recreate the bounce effect manually by editing the motion path. The “as” and “labels” layer keep the timeline organized so that the code isn’t scattered all over the place and you can read the labels to learn its behavior.

Anyways, coding along the timeline isn’t for everyone but can occasionally help you be more creative and develop faster.

Its great to be working on media destined for both the web and the console. Its exciting to hear that the PS3 now supports Flash 9 although as this PS3 Flash 9 article describes, its not quite as good as the web. I’m keen on doing more cross-over media in 2009 and extending our campaigns onto all three consoles.

I would like to see more games drive some light traffic back to the web site. In Fable 2, you discover a locked chest in the game which can only be opened after visiting the site and learning about its origin. Web sites are perfect for developing back story; adding more depth and replay value to the game.

Ever since I heard Lucas Arts used Flash for the UI for one of their star wars games (nearly ten years ago), I have been looking for an opportunity to work on a game UI. I’ve experienced a lot of bad game interfaces that appear to be tacked on as an afterthought. We could create an interface that would both entertain and comfort the gamer [also secretly track and report on problem or never used areas], which would free up the game company to concentrate on what they do the best: developing the game world and game play.