NOTE: I am now a freelance developer, and no longer an employee of Bloc.Over at
Bloc we recently launched
Meta4orce, a unique interactive sci-fi TV show which was broadcast on BBC2 and is also available globally via the
website. With a story created by legendary comic-book writer
Peter Milligan, it's a project I'm very proud to have worked on. When viewed online, the show integrates broadcast quality animation with high quality interactive games. (Please note, it's very much a
broadband only site as it features a lot of video, and the games do require a decent PC or Intel Mac to run smoothly). UPDATE: If you want to know
even more about the project, I've been answering game design questions over at the excellent
Brainy Gamer blog.
We wanted the site to invoke the gritty, futuristic feeling of the show, and also offer a gaming experience that resonated with console gamers. To this end we made extensive use of
PaperVision3D, specifically version 2.0, dubbed
Great White (at the moment this can only be downloaded via a
subversion client, but these are free and fairly easy to set up). As we did some fairly unusual things with PV3D, I thought it might be useful to document some of the solutions and work-arounds we came up with:
Mako User Interface
The
main user interface is implemented in Papervision3D, and makes extensive use of the MovieMaterial class to map 2D animations onto 3D planes. Developer Mat applied a custom displacement map to the Viewport to create the cool glitch effect. We found that setting the stage quality to LOW is a good way to get a bit of extra performance out of PV3D.
Deadsphere Pt. I
This
first-person perspective maze game uses a custom Model View Controller framework to link a 2D maze game mechanic to a Papervision3D view. I initially created the game in a 2D top-down view, then added another View to display the game in 3D. This is probably one of the few times it's actually sensible to use MVC on a Flash game (I think I'll cover this topic in more detail in a future post).
The main technical challenge was to stop PV3D from clipping the walls when they are close to the camera - basically it seems that planes are not drawn if PaperVision thinks any one of their 3 corners is outside the viewing area. I got around this by switching low polygon, 2 triangle plains for high polygon plains when the camera is close to them. I also used a lower resolution texture to render far-away walls. To improve memory usage and general performance, all the animated textures in the maze are created by swapping the BitmapMaterial of a plane every frame, rather than using MovieMaterial - this eliminates a lot of costly copyPixels operations. Again to try and reduce the amount of memory PV3D was using, I implemented a custom
object pooling system for textures and geometry - so that walls are re-used between different levels. The levels were created in a simple editor which saved out strings of 1s and 0s, so a basic 4x4 square level might look like "11110011001111".
Shock to the system
This
tower defence game uses PV3D to render a 3D view of a 2D game mechanic, again using MVC to separate game logic from graphics rendering. The main technical challenge was to stop the towers and enemies clipping strangely with the floor – when 2 polygons are close together they will flicker wildly as PV3D cannot decide which to draw on top of which. I got around this by rendering 2 separate PV3D scenes into 2 separate viewports – one for the interactive (clickable) floor grid, and one for the towers and enemies on top. As this slowed the frame rate dramatically, it only renders the scene every other frame, so while the game logic and user interface run at 30 frames per second, the 3D graphics effectively render at 15fps.
3D artist Matt modelled the defence towers in Maya and then opened in Blender and exported to ActionScript classes. PaperVision models have to be very low polygon if you want your game to run at all smoothly! To improve performance, the enemies are pre rendered animations mapped onto transparent 2 triangle plains, which are set to point at the camera every frame using PV3D's "lookAt" function (I couldn’t find a native “billboard” or “sprite” class in PV3D to handle this effect – I’m sure one must exist somewhere though - I know Away3D has them).
Under the surface
In this game the player
looks for clues beneath the waves of a flooded London street. For this game, developer / 3D guy Mark modelled a scene in Blender and exported the parts as AS classes. Unlike some of the other Meta4orce games, we didn’t use an MVC pattern – we directly control the camera in the scene using PV3D's built-in functions like moveForward, pitch, roll etc. This game also uses MovieMaterial for animation and 2D planes pointed at the camera to create the illusion of 3D objects. The built-in virtual mouse in PV3D makes it really easy to add interaction such as rollovers to 3D objects. This is one of PV3D's best points. Camera clipping was again a problem on this game, so we don’t allow the player to get too close to the walls or floor.
Deadsphere Pt. II
This
3rd person perspective maze game is implemented in a similar way to
Deadsphere Pt. I and
Shock to the system, with an MVC pattern, and all the game logic separated from the PV3D view. One cool thing on all the MVC games is that the sound is all handled as if it were another "view" onto the game "model", so none of the game classes need a reference to the sound code, or even know that sound exists. This kind of "loose coupling" is considered good practice in object oriented programming.
The avatar you control is very subtly animated by swapping between 10 separate models representing the frames of animation. This is a very inefficient method of animation that we wouldn’t recommend anyone else use (especially as it’s almost too subtle to notice anyway!). For future projects I definitely look forward to a work flow where 3D animation can easily be brought from Maya to Flash, maybe with "bones" (I’m sure someone is working on this if it doesn’t exist already).
Pandora
This is really just an extension of the
Mako user interface, with simple
2D mini-games rendered onto PV3D planes using MovieMaterial. We made sure to use the “animated” property very sparingly, to stop PV3D redrawing materials unnecessarily, as that was the main source of slow down. Also, when the games are full screen, they are removed from PaperVision and added to the main stage, as interactivity is more stable and fully featured this way.
Pier to Piers
A hovercraft chase through the flooded remains of London! Just a note here to say that this game doesn’t use Papervision3D at all, but our own custom mode7 engine, created by developer Mat, which we like to call Samuri7!
SummaryWe did some neat things on this project - one cool thing is that while you're playing the game we're buffering the next video in the background, so it's ready to watch when you finish playing. Please go and play with the site and tell me what you think - personally I love it, but understand that it's not to everybody's tastes (some people don't like sci-fi, some people don't like websites that use a lot of CPU and memory, etc etc). Either way, we achieved a lot and made PaperVision3D do some things it didn't want to, so it's all good!
If you want to read more about the project there are interviews with
Peter Milligan, with the
Director and Executive Producer and with the
design and development team at the excellent "Adventures in Primetime" blog. The BBC site also has the full
cast and crew credits for Meta4orce.
