The Mountain in .NET Magazine

Sport Chalet: The Mountain was featured in April’s issue of .NET Magazine, which is called Practical Web Design here in the ‘States. I was just short and simple write up in their showcase gallery section. It was very cool to see a project I was lead developer for in print in an international magazine. Here’s the short writeup:

TM Advertising approached Firstborn to design
a microsite for its new retail client, Sport Chalet.
Firstborn’s solution used an entire mountain motif
as the gateway for the content. The mountain
itself is modelled in Cinema 4D and exported into
Papervision3D. The result is an exciting and vibrant
interface that provides users with access to winter
apparel and equipment. The mountain serves as a
showcase for brands and their sponsored athletes.
You can check out the rider page of athletes and
see them model their sponsored gear through
video clips as well. Papervision is best used in
conjunction with some Flash, good photography
and web video. The Mountain has an excellent
dose of each.

net1.jpg

net2.jpg

net3.jpg

Bitmap Filter Adventures

I ran across two little bitmap related issues in Flash during my last project (should be live by end or March) that I’d thought I share.

The first issue is regarding layers of transparency. Sometimes in a sprite I’ll have multiple shapes layered on top of each other, or various layers of shapes drawn. Now if you change the alpha of that sprite, it will affect all the objects it contains. So, for example, if in my sprite I have one sprite with contains a red rectangle, and on top of it there is another sprite with a blue circle, if I change the alpha of the container sprite, you’ll be able to see though the blue circle since it’s alpha is also being changed. If I want the whole thing to fade together, so I don’t see though the individual parts, I’m out of luck.

So I figured I could use cacheAsBitmap to essentially flatten the sprite, so when the alpha is applied it would be applying it to an image. However, this doesn’t work. Obviously, I could just do it manually and draw the contents to bitmapdata, and swap it out whenever I need to do a fade. I’d like to avoid that as much as possible, so I figured I would try a last ditch attempt – using a empty filter. Basically, if I put a blur filter (or any other) on the container sprite that I am applying the alpha change it, Flash will automatically cache it as a bitmap. Logically, this should be no different than just setting the cacheAsBitmap property to true, as I had done before and failed. However, this works. I don’t know why, but somehow setting a filter to the sprite forces it to cache differently then just using the property. Below is an example (The bars at the top are to show a side to side comparison of each color for each object. It shows that the alpha affects the colors the same way for all of them, since it appears as an optical illusion that the one on the right is different)

[flash http://testing.eric-decker.com/layercache/layer_alpha.swf w=550 h=400]

The other thing I’ve run into before, and I’m sure countless others have to, is applying a filter to an object which you have drawn something round in. What happens is that the right-most one or two pixels of the image get cut off.  It looks like Flash is converting the object to a bitmap (which we know it does), but is not taking anti-aliasing into account when setting up the bitmapdata width and height. The solution I used to get arround this issue is when drawing my shape I add a 2px transparent line around it. You won’t see the line, and since it’s a stroke it shouldn’t affect the active mouse area if the target is a button. If you’re drawing a shape  that already has a stroke around it, you’ll either need to draw it twice or do something to give the are just that little extra bit of padding on the edges. Here’s an image to help illustrate what I’m rambeling on about:

bitmap_circle_filter_bug.jpg