Flash 8 Professional Video: Alpha Channel and Video Cue Points Example at Aral Balkan

Screenshot of the Flash 8 Video Alpha and Cue Points example

If my previous post didn't alert you to the fact, I'm a very big fan of the new video functionality in Flash 8 Professional. The new video importer wizard is an amazing workflow enhancer and the new alpha channel and event/navigation cue points features offer a world of creative possibilities for integrating video into Flash sites and applications.

This past Thursday, we held a Flash 8 Special at the London Macromedia User Group wherein Mike Downey did a presentation and a couple of us -- Guy Watson, Richard Leggett, Stephen Downs (Tink) and myself -- took part in a Flash 8 Jam (short 10 minute sessions demonstrating a single new feature.) My topic was Flash 8 Video and I presented a quick-and-dirty example that took me at most fifteen minutes to create.

The sample demonstrates the use of alpha channel video (Betina walks by as the dynamic text field behind her displays constantly changing numbers (which you can select/edit) and event cue points (the pop-up speech bubbles are triggered by them at certain points in the video.) Oh yeah, and notice the drop shadows on the speech bubbles... ooooh, aaaah, ok, moving along now...

Here is the quick-and-dirty code for the example, showing you how to listen for cue point events and handle them:

ActionScript:



// 


// Array of speech bubbles


//


var nextBubbleIndex:Number = 0;


var bubbles:Array = [ bubble1, bubble2, bubble3 ];


 


//


// Listen for cuePoint events on the FLVPlayback component


//


myFlvPlayback.addEventListener ( "cuePoint", this );


 


//


// Event handler: cuePoint


// 


function cuePoint ( eventObj:Object )


{


	var nextBubble:MovieClip = bubbles [ nextBubbleIndex ];


	nextBubble.play();


 


	nextBubbleIndex++;


}


 


//


// Change the text field every frame to create


// flickering random text.


//


function onEnterFrame ()


{


	var numbersStr:String = "";


	for ( var i:Number = 0; i < 100; i ++ )


	{


		numbersStr += String ( Math.random() );


	}


	bgText.text = numbersStr;


}

Note: You can also have the cue points send properties back with the cue point event and I could have used those instead of keeping track of the cue point index manually. The only reason I did it this way was because I had already imported the video without setting event parameters and was pressed for time.

You can download the example files (~1.7MB due to the included FLV.) Thanks go out to Macromedia for letting me use the Betina movie for this.

The Flash 8 Professional Video: Alpha Channel and Video Cue Points Example article by Aral Balkan, unless otherwise expressly stated, is licensed under a Creative Commons Attribution-Noncommercial 2.0 UK: England License.

11 Responses to “Flash 8 Professional Video: Alpha Channel and Video Cue Points Example”

Feed for this Entry Trackback Address

1 barkest
Sep 21st, 2005 at 7:07 pm

first time i used video in flash and it works really well. not too sure on the code side of it so you ‘quick and dirty’ method worked well. i could not find any cuePoint method though (i assume you have a cuePoint method) as your function name was cuePoint.

thanks
2 steve
Sep 29th, 2005 at 4:35 pm

ok managed to get on top of this video stuff

http://www.barkerfamily.plus.com/flash/handshake/index.htm

early days but thanks for the inspiration
3 Laurence Wheway
Nov 7th, 2005 at 5:37 pm

Have a look at my very first experiment here:

http://www.wheway.com/alpha_channel_video/proof_of_concept/

more to come very soon…
4 sondz
Apr 25th, 2006 at 12:28 am

i’ve found this great example: http://son.ofabit.ch
5 Eva and Karin
Oct 6th, 2006 at 3:13 pm

We are really greatful for this example.
Now we understand how cuepoints works!!!!!

THANKS!!!!!!!
6 aral
Oct 8th, 2006 at 9:55 pm

Hi Eva, Karin — happy to hear that it was helpful!
7 Dave
Oct 18th, 2006 at 8:32 am

Very Helpful!

I hae a problem if I offer controls though.
When the video ends, and I choose to play it again by hitting the play buttons, the bubbles don’t appear the second time around…

Any would you do?
8 jeffery
Feb 28th, 2007 at 1:03 am

I have been “trying” (unsuccessfully) to link the end of a flash movie (.flv) to launch a website.

the .flv has been imported to the stage and has a cue point inserted at the time of encoding. the cue point has a name “end-movie”. I use flash 8 professional and am not too technical, but have a mid-level understanding of the technology and a couple of flash years of experience

If you have a minute and wouldn’t mind giving me some info it would be greatly appreciated

thanks

jb
9 alan
Sep 24th, 2007 at 7:19 pm

Thanks fo the tut a lot.
How did you add the cue points into the FLV?
I have de flash encoder 8 but I can only add 1 cuepoint
and I cant set up the time in it
10 How to Put Flash Alpha Channel Video On Website
Sep 27th, 2007 at 6:36 pm

I am developing another strategy for using “que points” but not actually encoded in the flash movie itself.

Instead I have created some software that allows me to open my flv or swf video and watch it and pause it and set what I call “trigger points” along a time line.

Then I can define a target for each trigger point as well as a play function. I can target and call new urls to iframes, open urls in new windows, or even redirect at any point during the play of the video.

I can also tell “trigger points” to stop or pause for a set period of time.

This way I can actually control the normal html content of a webpage changing various iframes in the page.

While my video software is still in development I have already integrated this technology into my swf audio player software which you can see a demo of here:

http://www.websitejukebox.com

I actually trigger video to display and play during the play of the audio for one of the points.

1 Amazing: Playstation-quality 3D in Flash! at Aral Balkan
Pingback on Feb 16th, 2007 at 4:31 pm

Aral Balkan