New CA Tut Sneak Peek

Just finished another Computer Arts tutorial, this time with physics in it. You know – Box2D and that. So here are a couple of (COMPLETELY ORIGINAL, honestly…) sneaky peeky pics:

Computer Arts Tutorial Online

Now it’s out of print, Computer Arts have stuck my first AS3 tutorial from Feb up online, so it’s all yours for free. You lucky people.

U+262E: Two Fingers To War

Oh look, I’ve made a little video showing some of the best pics from our interactive photo booth/wall thing at United Underground 2 the other week for Ctrl.Alt.Shift.

Here’s me shepherding a couple of delightful young ladies into the booth. Then Me, Jamie and Jim signing off on the big screen. You can see there how it builds up a fullscreen wall of images and gracefully scales to take as many as we throw at it.

Photo Wall AIR App!

Off down to That London tomorrow with our video camera, a brand new iMac and a lovely AIR app by Jamie. Will report back. Looks like it works!

AS3 PrintCanvas update: Loupe and Display

Check out the demo. But don’t just click on the swf when it comes up. A click saves an A2, 300dpi PNG. Just be warned that this could crash your browser, depending on memory. Don’t say I didn’t warn you.

Got some nice new features into PrintCanvas. It’s all very well having a massive BitmapData for print, but it’d be nice to see what it’s doing on-screen without actually shoving the whole thing into the display list. Particularly when doing time-based generative stuff, I want to watch it happen!

I’ve built this into PrintCanvas using a matrix to pull out a scaled version for display. You can easily return this display Bitmap with

1
createDisplayBitmap($width:Number):Bitmap

Stick that on your stage, then in a Timer, EnterFrame or whenever you need it, call

1
updateDisplayBitmap();

to refresh the BitmapData linked to the Bitmap. Simple.

Then I thought well, this is nice and quick, but really I want to see what’s going on at pixel level. So I built in a loupe that returns a 100% window on the big BitmapData. Just pass a width and a point on the display Bitmap – usually the local mouse position – into

1
createLoupeBitmap($centre:Point, $width:Number):Bitmap

to get another Bitmap back. Then refresh it as above by calling

1
updateLoupeBitmap($centre:Point);

In the demo above, I’ve stuck the loupe Bitmap to the mouse and masked it with a circle because it looks nice. So there. And the blue squares aren’t intended as anything pretty – they’re just there to show it updating and give you something to look at with the loupe. I’ll get something nice going soon, I promise.

I’m pretty impressed with the performance on this, even on my 4 year old MacBook Pro! If you consider in the demo it’s getting both sets of data from an unseen A2 canvas at 300dpi, every frame, that’s not bad. Seems a good deal faster still in the standalone FP10 player/IDE for some strange reason.

So here, have the code if you must.

40199 Sids

40199 Sid James Heads

I’d been wanting to play with Mario’s “image foam” experiments since I saw him present them at FOTB a couple of years ago and finally got round to it yesterday. The Late, Great Sid James was just the first image to hand. Here’s a disturbing detail:

sid_closeup

Turns out Mario never posted the source, or at least I can’t find it. So I had to work it out for myself, which I suppose is better really. At least now I more or less understand Bitmapdata.hitTest(), getBounds() (yeah, never really needed it before), finding transparent pixels, etc. It’s set to keep scaling up the Sids to fill transparent areas till the space is 95% full, which equated to 40199 swirling Sid heads. Try not to stare at the big one on Flickr for too long. You’ll go into a Carry On trance.

So next I need to get this onto my PrintCanvas and try using different images and rotations for grey levels – like you would with perlin noise – to make up a huge picture. Should be fun. Might use porn…

Oh and cheers, Jamie, for putting me straight on some of the more complex Bitmapdata stuff!

Tut tut

Here’s a little sneak peek from my first Computer Arts tutorial on how to make proper freaks. Warped with AS3, of course. Six fingers crossed it should be in there sometime next month.

warp_preview