Category Archives: Lfug

Yesterday I visited Flash Camp London ’09, an all day community-run Adobe sponsored event on all things Flash Platform.

Last September I attended Flex Camp ’08, (essentially the same, but obviously focused on Flex) so I expected much the same – cool demos, sneak previews, maybe some insight to what Adobe have in the pipeline for the future – and got pretty much exactly that.

Flash Camp '09

Serge Jespers‘ opening keynote held a lot of optimism and promise for the future of the Flash Platform, quoting the huge number of downloads to date and pointing to the constant growth in market share that the Flash Player and AIR are enjoying – throwing in a couple of digs to the various doubters in the sums while he was at it.

He spoke about the Open Screen Project and Adobe’s ongoing aim to achieve a level of open portability across multiple platforms – not only in the browser and onto the desktop, but to mobile devices too and television platforms. On the subject of the mobile platform, he discussed prototype versions of Flash Player 9 (and 10?) running on a few devices he had to hand (though unfortunately no demo) and expressed Adobe’s wish to have those ready for manufacturers by the end of the year, with intention to have them consumer ready for the end of 2010.

Seb Lee-Delisle was first up, showing off some of the Papervision work he’d recently completed with his agency. He also had some nice demos of the augmented reality tutorials that have been going around lately. These usually use nice applications of the ARToolKit, but Seb pointed to a Flash port I hadn’t yet come across called the FLARToolKit. Presumably with which, you have full control via Actionscript. The Papervision blog has a pretty cool example of the kind of things you can achieve with it.

Next up was Michael Chase, Senior Creative Developer at AKQA. He presented his latest work, Nike Football, which involved a lot of work with Pixel Bender – the new video processing and visual manipulation platform available with Flash Player 10.

Pixel Bender is a non-destructive way to manipulate the pixel data of images and videos by means of developing bespoke plug-ins that function in Flash in a similar way to the various visual effects and filters do in Photoshop or Illustrator.

He demonstrated the Pixel Bender Toolkit, the GUI software used to create these filters. It’s purposely almost identical to every other program in the Creative Suite. Adobe are really pushing for seamless integration across the whole family of software for creators – the vocabulary, workspace, tool sets – all feel very familiar.

For the Nike site, Michael basically developed one filter for use across all video and image content. This seems straightforward enough, but it’s an brilliant advancement only made possible by using Pixel Bender. This way, there’s no need to render of every piece of video with the filter on – or subsequently re-render when the filter is inevitably tweaked (which, of course, could only be the case if permission was given to manipulate supplied video footage in the first place). It also means the video filter doesn’t have to be designed by a creator skilled in After Effects or other video editing software – as said, the Toolkit handles very much like Photoshop, which most designers are fluent in – I think Michael said you could actually use Photoshop to create filters anyway.

It also means you can change the single filter once and apply the changes to all the assets rather than having to edit every piece individually – and as he suggested, not having manipulated the source material means the un-filtered source can be reused elsewhere. And of course because it’s just Actionscript before it’s compiled, the whole plug-in script can be manipulated by a Flash developer.

It was good to see this in use, I’d only really seen the default demo ‘Swirl’ effect that a lot of others there also seemed only to have seen (I’m not sure of the real name). That ‘swirl’ is so drastic it seems to have no possible use case, so I’d not really considered Pixel Bender since. Here though its use is subtle, well executed and well placed – I’ll have to give it a go.

Mike Chambers then discussed ‘Scripting with Actionscript 3.0′. Though relatively well-covered territory for the developers, he set about debunking popular misconceptions of Actionscript 3, going through the benefits of migration and giving some examples.

He started with a little background on the new Actionscript version, discussed how the Flash Player was hitting the limits of performance that AS2 could achieve, that Actionscript 3 was heavily driven by the need for application development – which by that point a lot of (the now) RIA developers were forcing into Actionscript 2. They also had Flex in mind.

As I agree with him, ultimately, AS3 isn’t that different to AS2, but it is just different. It’s not harder, or ‘slower’ per se. On a language level, the syntax is still simple and very much the same – it’s the APIs that might present more difficulty for those migrating. The APIs in Actionscript 2 grew organically, expanding where needed, but unfortunately did so inconsistently. It’s that realignment that’s a larger change to overcome.

Arguably, any developer with OOP experience, where consistency is promoted, wouldn’t struggle. He suggests that learning Actionscript 3 is future-proofing yourself for new languages that will be far more digestible now that Actionscript contends as a stronger language.

The Timeline is not Evil!

With that in mind, he did admit that the way Adobe present Actionscript 3 can be somewhat intimidating to those without that kind of basic knowledge. The documentation is very much aimed at developers – the code examples are in class and package structures, assuming programming experience where the previous help documentation never did.

Timeline coding is still possible, easily, but it isn’t documented anywhere near as much as class structured code. With one or two caveats, it actually works in almost exactly the same way.

As well as the ‘future-proofing’ mentioned, Actionscript 3 heralds a whole load of other advantages. It’s more verbose (probably where the argued ‘slower development process’ claim lies) but in that, offers better debugging – the compiler can be set to be more strict and to detect errors earlier, even – and it’s also the language for new libraries and APIs (think Papervision, Alchemy, the many tweening engines) both from Adobe and efforts from the community.

Richard Dean presented his work on the EA Spore microsite, specifically his efforts built using the Inverse Kinematics and 3D of Flash CS4 – demonstrating some nice timeline-based animation effects, the use of the new ‘Bone’ tool to build character skeletons (more about this later) – as well as some handy tips and best practices.

James Whittaker‘s presentation ‘Your First Custom Chrome AIR App With Flash CS4′ delivered exactly what it said on the tin. He offered a walkthrough on how to build your first AIR application, how to design a custom chrome and the various provisions that must be made in doing so, up to publishing an AIR application file and customising the various settings in the new CS4 GUI. He also spoke about handling icons, digital signing, then creating a nice installer badge at the end. His presentation files are already up online.

Lee Brimelow had a huge amount to say about the new CS4 version of Flash – apparently trying to cram a whole day session into his 45 minute slot. He spoke about the new animation model in Flash, how it’s more like After Effects now – again, the overlapping of software uses in the Creative Suite – how even the timeline in the standard workspace is at the bottom of the screen, more along the lines of video editing software.

So much more of the animation process is automated now, to great effect. Motion paths are automatically constructed, even for simple tweens. The path can be treated like any other line in Flash thereon, allowing curvature, adjustment of Bézier angles. Adding a keyframe and point in the middle of a tween no longer creates an awkward corner, but a curve to compliment the original motion path.

There’s far more control. The tween itself is handled as a unique object, so moving or resizing or changing the length of an animation is much easier and also independent of the clip being tweened – there’s no more clumsy attempt to select multiple frames to modify a complete tween.

Again there was demonstration of the native ’3D’ in Flash Player 10. Lee couldn’t emphasise enough though, that these is intentionally simple 3D effects for transitions and such – not for full 3D immersive environments, for which he recommends to look to Papervision or similar. When the 3D tools are in use though, it’s seamless. There’s a tool to rotate by the Z-axis as simply as there is one for the 2D axes – in doing this, Flash starts to look like 3D rendering software.

These renders are possible because of the ‘notorious’ inclusion of a constantly-running Flash Player on the stage – it’s how Adobe have addressed differences seen in author-time to run-time. In having an constantly running instance of the Flash Player, there should be far fewer discrepancies – although, as they are fully aware of – is a memory hog.

Lee also pointed out the code snippets panel Flash CS4 offers – something I thought Mike Chambers would have mentioned. They’re basically small templates of handy bits of code that anyone unfamiliar with Actionscript (or Actionscript 3, for migrating developers and designers alike) to add common bits of functionality – mouse or frame event handlers for example.

Again we saw Inverse Kinematics – these are great for character animations and (I think perfect) for mocking up prototypes when realistic proofs are required but perhaps the resource isn’t available to fully code them. They’re very quickly put together but equally very effective. Simply constraints applied to skeleton joints create faux-physics that look very convincing. Have a look here if you’ve not seen these in action.

All of that is possible with zero code. Also, all the drag-drop manipulation possible at author-time can also be translated for the user to play with at run-time with the tick of a box – still, with no coding.

Finally Lee demonstrated the new motion editor, which has also has given a huge amount of control to the author compared to what was available before. The complexity of a tween (whether an ‘x’ position or alpha value or whatever) can now be broken down into multiple channels of manipulation.

For example, previously the complexity of control over a tween was determined (and limited) by the tweening graph. This remains, but now different types of easing can be applied to the different parameters within that graph. Say a clip was moving diagonally across the stage – the horizontal movement could have an ease out whilst the vertical direction may have an elastic easing (or obviously any combination). All the tiny tweaks and nuances to animations that couldn’t be easily achieved in previous versions of Flash, or even those only achievable by code now look entirely possible on the timeline at author-time. Lee’s tutorial is a must-see.

Finally, Serge returned to discuss ‘Flex workflows with Flash CS4′. He demonstrated some good techniques in working across Flash and Flex within single projects – firstly how to use Flex metadata tags in Flash, then how to create classes using the Flex SDK and compile those as Flex Library Projects to use as SWC files within Flash (and the Flash CS4 use of SWCs is so much better – adding files to the library rather than to the classpath list) – then likewise compiling components in Flash to handle in Flex. The latter also maintains coded methods on the Flash components that can be handled within the Flex projects, easing the workflow between Flash and Flex developers no end.

Similarly, to ease the workflow between developers and designers (and as I thought would get a mention), Serge ended by demonstrating Flash Catalyst (previously ‘Thermo’). He created Flex components from Flash graphics, multi-layered PSD files and Illustrator assets – all of which generated MXML code that a developer can play with later.

All in all, a great session – Chester and the guys were never going to disappoint. ;)

Various content online can be found in a number of places if you look for the ‘flashcamp_uk’ tag – there’s a whole heap of conversation on Twitter, I expect photos on Flickr and videos on Youtube and Vimeo will surface soon enough. I’ll also put up links to presentations files and source code as and when they find themselves uploaded online.

Update (09.03.09): Serge now has a video tutorial over on his blog demonstrating how to use simple Flex Library Projects in Flash.

I should have mentioned already what an awesome success Flex Camp 08 was a couple weeks back. London’s first go hosting the show, huge well done to the London Flex Platform User Group, the guys at Emak Mafu and everyone else involved in arranging the event. The day was made up of various show and tell sessions, panel discussions and workshops, all for free, needless to say those who couldn’t make it sorely missed out, irrelevant of the free beer and pizza by a long way.

Andrew Shorten, Adobe Platform Evangelist, opened with a keynote similar to Mark Anders‘ recently at 360 Flex (found via InsideRIA), reviewing Flash development since 1993 and looking at the roadmap ahead, toward Flex 4, Gumbo – and tools like Thermo and Degrafa. We got some sneak peeks at Flash Player 10, previously ‘Astro’, not only showing off some cool effects like Pixel Bender, but interestingly with those, further steps made by Adobe toward the more open source development community.

A couple highlights, I enjoyed Justin Clarke and Samuel Williams rattling through their presentation on PureMVC. I’ve used PureMVC before, but as frameworks go, I generally always adopt Cairngorm for the majority of Flash and Flex work, but they’ve definitely convinced me to have another look.

As good was Bryan Hunt of Emak Mafu delivering his brilliantly disgruntled thoughts on working with Flex and Java, something I’m yet to try, but he also touched upon developing with the Spring framework, which I’d recently come across working with Red5 – glad I caught up with him afterwards.

Perhaps the most useful was Peter Elst‘s class on using SQLite and AIR, in which he quickly put together an app with a simple straightforward relational database, using very little MXML and Actionscript, demonstrating the SQL database support in AIR as standard with AS3, as well as it’s capabilities in synchronising with online sources.

I’ve seen a couple requests around for any source code or presentation slides from the day, but I’ve yet to find any – if I do I’ll update here, I’m keen to see them myself.

So last night I was able to attend the my very first London Flex User Group meet, organised by the guys at Emak Mafu, kindly hosted by those at Poke.

First up was meant to be a walkthrough/demo/first look from the people at doof.com, who’ve developed a fully Flex-based ‘casual gaming and social networking site’, but a beta bug meant their presentation was prematurely cut short. I’d already had a play beforehand anyway without a hitch and it’s pretty nice. They’ve gone further than a lot of other Flex projects I’ve seen, it’ll be good to see it at full tilt when all the bugs have been ironed out.

Simon Gladman took over demonstrating WatchFaceBuilder, a CAD-like application process for designing custom built watch faces. His self-proclaimed debut outing in Flex, it also uses Cairngorm, which I first encountered a while back. I was surprised how easily Simon claims to have emigrated from Flash to Flex and how much of this he puts down to Cairngorm.

The night’s main event was a comprehensive an insightful talk with Mike Potter from Adobe’s Flex product marketing team. Running through the top picks in recent Flex and AIR development, he covered a fair amount of the usual apps as expected, but also some that deserve far more attention.

Firstly on behalf of Adobe, there’s Photoshop Express, essentially a lite Photoshop in the browser, online, but as he admits there’s already Picnik doing very well – which personally was probably the first Flex app I’d ever seen and catalyst to start learning. But he compares Photoshop Expresss to Premiere Express, Adobe’s parallel Flex/brower-based video editing software, which already powers YouTube’s video editing and MTV’s Remixer contest. Where a number of independent Flex apps lock features for premium users, Photoshop Express could be a angled as a could-be de facto standard to power any kind or number of image manipulation online platforms.

There’s Bluestring, from AOL, which lets users upload, store and share files, video and images, as if we need another, but what’s more interesting is even if the idea might be already becoming redundant, companies the size of AOL are investing considerable amounts in Flex.

Buzzword is impressive, this is basically for word processing what Picnik is for photo editing. Far more responsive and comprehensive than say Writerly, it pretty much is what-you-see-is-what-you-print unlike a lot of other online word processors. Needless to say, it handles Word .doc files and has an amount of saving/sharing options to boot.

Other links of interest, the Flex showcase (generally), Mike’s new blog RIApedia, Adobe Share (more file sharing), the new Adobe DevNet, the Adobe Media Player and eBay’s desktop/San Dimas project can now be found at http://desktop.ebay.com.

Followed was a lengthy, pretty sincere feedback session for Mike to take with him back to Adobe. Overall an insightful evening, good stuff.

Oh and free beer and FLEX STICKERS? – Sold ;)

Chrome wheeled, fuel injected.