Tag Archives: 3D

How to correct 3-D projection on stage resize

The problem:
You’re using Flash 10′s native 3-D API and notice the projection goes a little skewiff when resizing the window.

The solution:
You need to reset the stage’s projection centre on stage resize, like so…

 

BBC A History of the World

A History of the World

I just finished a new project, called ‘A History of the World in 100 Objects‘, it’s a joint venture between BBC Radio 4 and the British Museum to chart human history in a new way. I developed the concept for the 3-D object explorer with the guys at GT/VML and built it using Flash 10′s native 3-D capabilities. Users are able to explorer objects from throughout human history in a potentially inifitely expanding 3-D time tunnel and even make history by uploading their own objects.

Here’s some footage of the 3-D explorer:

The main challenge facing the development of the 3-D explorer was to build something capable of handling up to 10,000 objects, loading in their images and displaying it all in glorious 3-D… all without crashing the user’s browser. Every object or filter set accessible within the explorer can be bookmarked, shared, or navigated with the browser back/forward buttons. For added accessibility, the explorer’s 3-D view itself can be navigated with the keyboard, mouse wheel or the on-screen controls.

I built the application strictly to optimise performance and memory management, while ensuring maximum stability. Coding techniques such as object pooling, typed arrays, load queueing, render deferral and the flyweight design pattern were used to maximise performance and minimise memory usage.

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]

Head tracking in 3D

I started trying to find useful things to do with face detection, but with limited success. I tried using the Libspark Haar Cascades implementation of face detection with Papervision3D to create a sort of head tracking effect, but it’s a little flaky – partly because of poor tracking accuracy and partly because it’s too CPU intensive. You can view it on its own page here.