Archive for the 'as3' Category



02
Mar
09

Keeping Lip-Sync in Sync

I’m currently working on a project where I have been handed a lot of movieclips with animated mouths to be sync-ed with spoken audio triggered from the library. Each sentence had been put together in a separate movieclip. Obviously this method exposes the frame rate on slow computers leading to loss of lip-synchronisation. I was told to go through all of the moveiclips and add the audio to the timeline – a very inelegant solution that would take a lot of time with poor results.

I came up with a simple solution that basically just pushes the playhead forward everytime it drops out of sync. I use the frame rate and getTimer to work out where the playhead should be on each iteration. If the playhead drops then it is moved to the position it should be at.

Very simple – saved me a lot of time.

private const FPS:int = 30//Current frame rate
private const ERROR_MARGIN:int=1
private var start_time:int
private var last_frame:int=0//Keep track of last frame to see if mc has stopped playing
private var loop_started:Boolean=false

public function sayPhrase(phrase:String) : void
{
mouth_mc.mouth.gotoAndPlay(phrase)
last_frame=0 //reset last frame
loop_started=false
start_time = getTimer()
addEventListener(Event.ENTER_FRAME,lipSyncTracking)
}

private function lipSyncTracking(e:Event = null):void
{
if (mouth_mc.mouth)
{
var cframe:int = mouth_mc.mouth.currentFrame //get the current frame
var ctime:int = getTimer() //current time
var time_expired:Number = (ctime – start_time )
var target_frame:int = Math.floor((FPS/1000)*time_expired)
if(target_frame>1 && cframe>1)loop_started=true //need to check for looping
if (cframe == last_frame || (cframe==1 && loop_started))
{//MC must have stopped or looped back to beginning
removeEventListener(Event.ENTER_FRAME,lipSyncTracking)
}
else
{//If frame is out by the margin of error then correct
if (target_frame >= cframe + ERROR_MARGIN)
{
mouth_mc.mouth.gotoAndPlay(target_frame)
}
}

last_frame = cframe
}
}

Advertisement
13
Feb
09

Global Gam Jam – The Deep – How to produce a string in water with AS3

I attended the Global Game Jam 2009 recently – forming the team ‘Fish Don’t Flock’. We produced a game called ‘The Deep’ – in 48 sleepless hours.

In the game you get to control a deep sea bio-luminescent creature that is formed from two orbs and a membrane. The creature eats plankton by enveloping it inside it’s membrane.

There were a couple of innovations we managed fit into the game. The first I will detail here, the other will be in my next post.

(i) We needed to make the membrane behave like a ribbon under water:

I’m a huge fan of Box2D, and have done a few AS3 rope experiments. To get the behaviour I wanted, I figured that I could chain together a series of balls within Box2D, turn off the gravity for the top-down underwater view effect. This way I could detect collisions and if all creatures have mass within the physics engine they would interact correctly with the membrane.

The Deep: Rope membrane

The Deep: Rope membrane

(1) Create a chain out of box2D circles.

(2) Link the chain circles using revolute joints.

(3) Draw membrane/rope by drawing from joint point to joint point and add orb sprite.

(4) Remove rendering of circles.

The source is available for this game here.
(Obviously it was a rush job so expect a lot of code imperfection.)




Categories

Reasons to be Creative 2012

FITC Amsterdam 2012

Flash on the Beach 2011

Flash on the Beach 2010

Swingpants at Flash on the Beach

Flash on the Beach 2009

Swingpants at FOTB2009

Twitter Updates