Official website for Web Designer - defining the internet through beautiful design
FOLLOW US ON:
Subs House Ad
Apr
27

Add webcam fun with Flash

by Dave Harfield

21 Lion mask

152-052-step021

Create another layer above the lion video layer and call it ‘lion mask’. Now, using the Brush tool, colour in the lion face where you would like to see your own face. Do a kind of skull shape, right-click the layer and make it a mask.

22 Monkey and bear

152-052-step022

Using the previous steps of adding the video for the lion and mask as a guide, do the same for the bear and monkey so you should have six layers that are video and masks for all the pictures. Remember to name your videos ‘videoBear’ and ‘videoMonkey’.

23 Test the finished project
All that’s remaining is to delete the test video object and replace the line of code that reads ‘videoTest.attachCamera(camera);’ with the ones below. This is a little taster of some of the fun that can be had with your webcam. You could even add a Print button so that you can create your own Christmas cards!

videoLion.attachCamera(camera);
videoBear.attachCamera(camera);
videoMonkey.attachCamera(camera);

In detail
Capture camera events

Trigger your animations and functions based on when the user moves in front of the camera
Have you ever been to a shopping centre and walked past a huge plasma screen, which is on some sort of loop, then when you get close a different animation is triggered, or you’re suddenly the star of the TV? Well, this is done using camera motion detection. Camera motion detection can be as easy or complex as you want it to be, and is written in quite a few languages. Here, we will show you a few simple lines of ActionScript 3.0 code that will trigger a function call when the camera detects movement. It’s up to you what you do in that function, but if you’re after some inspiration, why not try playing an MP3 or shaking the browser each time the camera detects motion as experiments to get your creative juices flowing.
Select a new Flash File (ActionScript 3.0) and add a video object to the stage via the library as you have done in the tutorial, then open the Actions panel and add the code below. You should add your extra code into the function called cameraActivity.

import flash.media.Camera;
import flash.media.Video;
import flash.events.ActivityEvent;
var camera:Camera = Camera.getCamera();
if (camera != null) {
// Add the event to capture any movement
camera.addEventListener(ActivityEvent.ACTIVITY, cameraActivity);
video.attachCamera(camera);
} else {
trace(“You need a camera.”);
}
function cameraActivity(event:ActivityEvent):void {
trace(“activityHandler: “ + event);
/*
You could make the video jump or vanish when the person infront of
the camera moves here
*/
}

Pages: 1 2 3 4 5

3 Comments »

  • photo retouching said:

    A nice way to spice up webcams! nice tut

  • webcam fun with Flash | Designer Depot said:

    [...] webcam fun with Flash May 13, 2009 | In ActionScript 3.0, Adobe Flash | [...]

  • Ganry74 said:

    It drives not only the Boom but also a monocular projector that displays on a 4-foot by 6-foot screen at one end of a nearby conference table that seats eight. ,

What's your opinion?

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.