Grant Skinner

The "g" in gskinner. Also the "skinner".

@gskinner

Camera Interaction In Flash Goes Public (w/video)!

We recently had the pleasure of working with Tequila (TBWA \ Chiat \ Day‘s interactive arm) to build a very unique interactive piece to market Nissan’s new Sentra model. The concept was based on the interactive webcam systems I’ve been playing with at incomplet.org[Moved to incomplet.gskinner.com]. Media vans (trucks with big screens on the side) in seven US cities would act as mobile installations, and users could play on screen via camera input.

Users standing in front of a red screen are masked out and projected over a video running in the background. Users can play with any of five interactive “lessons”: Catching virtual leaves, controlling the volume of different tracks of music with their movements, wiping fog and water drops off the screen, being chased by a swarm of fireflies, and kicking around a beachball sized soccer ball.

We even rigged it so that the software could all be operated by the van operators using a wireless remote from in front of the screen.

Continue reading →

Understanding DisplayObject.scrollRect

I recently had a very interesting discussion with Andreas Heim, Peter Hall and Werner Sharp (Flash Player Engineer) about DisplayObject.scrollRect, and learnt a lot about the specific mechanics of how it works in the current player.

DisplayObject.scrollRect lets you specify a Rectangle object that defines the region of the DisplayObject (Sprite, MovieClip, etc) to display. The masked region is always displayed at the origin of the display object, which lets you scroll the region by changing the x and y properties of the rectangle.

// Rectangle constructor params are x, y, width, height
mySprite.scrollRect = new Rectangle(0,20,50,50);

For instance, setting the scrollRect as above would mask a 50×50 region of the sprite starting 20 pixels down, but the masked view would still be placed at the sprite’s origin, so it would appear to be scrolled 20 pixels up.

Sort of handy, but scrollRect really becomes useful when you combine it with cacheAsBitmap. When cacheAsBitmap is false, scrollRect is basically treated the same as a normal vector mask by the renderer. Vector masks are very inefficient in Flash, because the whole DisplayObject is rendered, not just the visible portion. However, when you set cacheAsBitmap to true the renderer switches to an optimized mode where it only renders the masked area of the display object to the bitmap cache, and then uses a combination of bitmap routines and incremental rendering to scroll the content. This can be used to gain very substantial performance benefits.

mySprite.cacheAsBitmap = true;
// Rectangle constructor params are x, y, width, height
mySprite.scrollRect = new Rectangle(0,20,50,50);

Note that this has the same considerations that are usually associated with cacheAsBitmap. If the display object is dirtied (ie. it changes visually), the Flash player will re-render the bitmap cache, so this technique generally does not make sense for content that is likely to change each frame (though it might if the content is much larger than the masked area). It also has memory overhead from having to maintain the bitmap cache – though I assume it would be lower because it is limited to the masked area.

Library, Timeline and Multi-File Searches in Flash

As promised, I will be giving a more in-depth look at all of the panels in our recently released Panel Pack 1 over the next little while. Hopefully this doesn’t come across as a sales pitch (we actually lose money releasing these panels), I’m just hoping to share some of the work my team has put in over the past few months polishing these up for release.

I wanted to start with gSearch, because it is the most significant panel in terms of technical complexity and functionality.

We built gSearch to address three areas of searching that we felt were lacking (or completely missing) in the Flash IDE:

Continue reading →

GPSD’06 Results Are In!

After a week of voting, the results of the Great Pumpkin Showdown 2006 are in! As always, we pitted teams of two, based on company seniority (Team 1 is most senior, Team 4 is comprised of “the new guys”) against one another in a battle of epic proportions.

PumpkInvaders, by Team 1 took the easy win with 38% of the votes (151) – go team!

Jack Skellington, by Team 4, and Frank’n’Friends by last year’s winner Team 3 took a very tight 2nd and 3rd place with 23% (91 votes) and 21% (86 votes) respectively.

Team 2’s Grumpkin started strong, but lost a lot of ground in the final days of voting and came in a disappointing 4th with 16% of the votes (66 votes).

Continue reading →

John Grden’s New Blog

I rarely blog about blogs, but for John I’m happy to make an exception. John Grden is a very smart guy, and he has an infectious enthusiasm for Flash technology. I’ve known him for a couple years – online, hanging out a conferences, and doing some training with him once at Blitz – and beyond being impressed by his technical abilities and love of learning, I’ve found he’s one of the most genuinely nice people I’ve met.

He’s always coming up with crazy ideas and working on neat things with Flash and Flex (ex. XRay, Red5, FLEXible), so I’d definitely recommend keeping an eye on his new blog, RockOnFlash.com/blog/. It’s worth heading over there now to check out the video on his FitC talk combining live drumming, Flash, streaming video, real-time data transfer, and Rush.

Rock On John!

Panel Pack 1 for Flash released

We finally scraped together enough time in our busy production schedule to polish off Panel Pack 1 for release. PP1 is a set of 4 custom panels to help streamline your Flash workflow. These panels are handy for both designers and developers, and while not all of them may be useful to you, we’ve priced them so that (hopefully) any one of them is worth the price of the pack.

Just like gProject, these were built for our own internal use, then polished up to sell. We’re not looking to make money off of them, but we are hoping to recoup a portion of the development costs.

We’ll blog about each panel in more depth over the next few days, but here’s a quick overview of what’s included with the pack:

Continue reading →