Tag Archives: effects

CoolIris type thing in 30 lines


[AS]
package { // Piclens type thing in 30 lines (FP10+) Liam O’Donnell – spikything.com
import flash.display.Sprite;
import flash.events.Event;
public class Main extends Sprite {
private var container :Sprite;
private var imageGrid :Sprite;
private var images :Array = [];
public function Main():void {
container = addChild(new Sprite()) as Sprite;
imageGrid = container.addChild(new Sprite()) as Sprite;
for (var i:uint = 0; i < 200; i++) images.push(getItem(i));
images.sortOn(“z”, Array.NUMERIC | Array.DESCENDING);
for each (var item:Sprite in images) imageGrid.addChild(item);
addEventListener(Event.ENTER_FRAME, update);
}
private function getItem(index:uint):Sprite {
var item:Sprite = new Sprite();
item.x = -(200 / 3) * 210 / 2 + (index / 3) * 210;
item.y = (index % 3) * 160 – 40;
item.z = 100 + Math.random() * 2000;
item.graphics.beginFill(Math.random() * 0xffffff);
item.graphics.drawRect(0, 0, 200, 150);
return item;
}
private function update(e:Event):void {
imageGrid.x += ((stage.stageWidth / 2) – mouseX) * .2;
container.rotationY = ((stage.stageWidth / 2) – mouseX) * .2;
}
}
}
[/AS]

Mercedes Bend – Physics based banner animation

I don’t usually make banners, but made an exception in this case because it involved doing some challenging code-driven animation. The result is quite nice and won some awards appparently, including NMA Capmaign of the Month.

The line dynamics itself is just Hooke’s law stuff – basic physics. Took some experimentation to get a smooth curve drawn through a series of points (basicaly, the control points of your previous and next points need to be in line).

The cars follow one of the line’s points with differing elasticity and damping, but the real pain in the backside was drawing the dashed line.

Luckily there were some tutorials about this and I found by moving the first drawing point up-screen it creates the animated effect – job done! Check it out on Bannerblog.