THE PASZ.COM BLOG

Saturday, February 25, 2006

Flash Video Avatar

Flash 8 has added some exciting video features, including the ability to add masks on top of a video. I created an avatar that "busts in", and introduces my About Me page. Click on the avatar to make him do some jumping jacks.

This was an ultra low budget project. I shot the video using a 4 year old Cannon 2 megapixel digital camera in my hallway. Using Windows Movie Maker, I edited it down into 7 sub clips -- "wave", "talk", "idle1", "idle2", "point left", "point right", "jump" -- and imported them into Flash. (In retrospect, I should have made the "talk" cycle a bit longer, since that's what appears most of the time.)

Once the video was in Flash, I laid out the videos on a timeline. I created a separate timeline for the audio, and using basic labels, and gotoAndPlay() functions, I synched up the 200 frames of video with the audio timeline.

Finally, I integrated the video with my web page. I found an excellent tutorial on CommunityMx.com that helped me get the transparency working correctly in my Flash movie, so that it appears behind the other layers on my web page.

Though SWF ended up being about 1MB in size, preloading is not an issue, because the video is the last thing on the page to load, and the user doesn't realize there's going to be video on the page until it's ready to play. A users with slow connections might miss the video entirely, but they won't notice that it's missing, and they can still enjoy the rest of the page.

Total Production Time: 8 hours
Total Production Cost: 0$
I think you could make a fantastic avatar using the same basic techniques, but a slightly more sophisticated production environment. You'd need a green screen to make it easy to extract the background, a better video camera, and a copy of Adobe After Effects.

17 Comments: