Sunday, 28 November 2010

Imagine a media plan with 20 or 30 different formats where you need to do the .gif and the .swf. Well, these people from 4delite have created a tool to do all those formats all al once in the same process so the workflow would be really faster and cheaper than now.


The project runs under a Flex framework, at least that´s what they say in their blog. For the back side they ask for .NET, C#, WSDL and XML. Take a look at the video:



It looks great! Perhaps it´s too much to say that in a campaign you have to do seven thousand banners but the way it works looks fast and effective.
The cost is about 50 dollars every mont for little commerce, big customers should ask

Here is a slideshow about the tool:

Wednesday, 17 November 2010

flv Cuepoints Actionscript 3

We are hearing a lot lastly about the future of video in the web, moreover, here in Spain I´ve seen platforms improving video seo in the web as DigitalNovae does

Besides, we are also seeing really good sites in the FWA website, with what I would call interactive video, for example this one from ACTI or this other from Wrangler

I´m sorry about HTML5 boys, you can not do this by now, only Flash can. So, this is the question: Is it possible to move the video head with Actonscript? Can you play backward?

For the second question I don´t have the code (I welcome solutions), but for the first I do.
First, if you happen to load a video in a website, if you can it would be better to embed it in the timeline and then just use tags with gotoAndPlay or gotoAndStop.

The problem is more complicated if you have to load several videos in streaming and you want to interact with them.

Lastlly we had a project for a customer, he wanted to do something similar, you can see a
demo here. This is a microsite with four streaming videos, we load four .flv with the FlvPlayBack component. The briefing says that whenever the user interacts over or out the video, there must be a listener so that the video shows other message or not.

To do this, we followed some recomendations from our friend luckyPig, the best way is to make an array with the video cuepoints where you will work. For example, let´s take the video of the girl from the right.

If we see the complete video, we will do two loops, standby loop and movement loop. Also we will mark the cuepoints of the jumps from forward to backward. If you record this, you´d better use a croma and export if for .swf from AfterEffects.


//Cuepoints times:

1- Init
2- End Loop 1
3- Beginning of forward step 1
4- Beginning of loop 2
5- End loop 2
6- Beginning of forward step 2
7- End

So lets do an array:

Cuepoints for the young girl
0/10/14/22/36/37/40

Let´s go to the code:

import com.greensock.*;
import fl.video.*;
import fl.video.MetadataEvent;

var flv_chicajoven:FLVPlayback;

var tiempos_chicajoven:Array = [0,10,14,22,36,37,40];

//Adding the cuepoints
flv_chicajoven.addASCuePoint(tiempos_chicajoven[0], "chica_iniciobucle1");
flv_chicajoven.addASCuePoint(tiempos_chicajoven[1], "chica_finbucle1");
flv_chicajoven.addASCuePoint(tiempos_chicajoven[2], "chica_salto_adelante");
flv_chicajoven.addASCuePoint(tiempos_chicajoven[3], "chica_iniciobucle2");
flv_chicajoven.addASCuePoint(tiempos_chicajoven[4], "chica_finbucle2");
flv_chicajoven.addASCuePoint(tiempos_chicajoven[5], "chica_salto_atras");
flv_chicajoven.addASCuePoint(tiempos_chicajoven[6], "chica_final");

//Listeners of the flv
flv_chicajoven.addEventListener(MetadataEvent.CUE_POINT, chicajoven_listener);

//Boolean variables to control
var chica_enbucle1:Boolean=true;
var chica_ensalto:Boolean=false;

function chicajoven_listener(eventObject:MetadataEvent):void {
if (eventObject.info.name == "chica_finbucle1"){chica_irInicioBucle1();}
if (eventObject.info.name == "chica_finbucle2")
{
chica_irInicioBucle2();
chica_enbucle1=false;
}
if (eventObject.info.name == "chica_final")
{
chica_irInicioBucle1();
chica_enbucle1=true;
}
if (eventObject.info.name == "chica_iniciobucle1"){chica_ensalto=false;}
if (eventObject.info.name == "chica_iniciobucle2"){chica_ensalto=false;}
}

//Movement of the head in streaming
function chica_irInicioBucle1():void{flv_chicajoven.seek(tiempos_chicajoven[0]);};
function chica_irInicioBucle2():void{flv_chicajoven.seek(tiempos_chicajoven[3]);};
function chica_irSaltoAdelante():void{flv_chicajoven.seek(tiempos_chicajoven[2]);};
function chica_irSaltoAtras():void{flv_chicajoven.seek(tiempos_chicajoven[5]);};

//Events
chicajoven_bt.addEventListener(MouseEvent.MOUSE_OVER, fl_chicajovenON);
function fl_chicajovenON(event:MouseEvent):void
{
trace("fl_chicajovenON");
if(chica_enbucle1==true)
{
chica_irSaltoAdelante();
chica_enbucle1=false;
}
if(ejecutiva_enbucle1==false)
{
ejecutiva_irSaltoAtras();
}
if(viejuno_enbucle1==false)
{
viejuno_irSaltoAtras();
}
}

chicajoven_bt.addEventListener(MouseEvent.MOUSE_OUT, fl_chicajovenOUT);
function fl_chicajovenOUT(event:MouseEvent):void
{
trace("fl_chicajovenOUT");
if(chica_enbucle1==false)
{
if(chica_ensalto=true)
{

TweenMax.to(cuad_mc,0, {delay:2, y:-224, onComplete:onFinishTweenChica, onCompleteParams:[5, cuad_mc]}) function onFinishTweenChica(param1:Number, param2:MovieClip):void
{
chica_irSaltoAtras();
}
}
else
{
chica_irSaltoAtras();
}
chica_enbucle1=true;
}
}

//The same for the other videos...

Well, lastly the customer decided he wanted just static photos instead of videos. But it was a good R+D project.