We are super happy to see our latest work EnergyLab selected today as Site Of The Day in The FWA. Congrats to Grupo W. ¡Que viva México!

So much energy has never before been contained in a bottle. You had better not touch it, one can never know what consequences it might have.

Our first commercial project as HelloEnjoy went live on July 22nd 2009. Built for our friends at Grupo W in Mexico, EnergyLab is a 3D puzzle where the fastest to complete it wins a trip to Russia to fly a L39 combat jet (like James Bond in Tomorrow Never Dies).

The game starts after the bottle explodes and your job is to piece it together. Click on the background and drag to navigate around the scene. Click and drag the pieces until you find their matching silhouette.

Behind the scenes

When building the 3D experience with the latest public version of Papervision3D, we dedicated a lot of time to get the lighting right. After trying out many solutions, we decided to implement two different shaders. Screen-space Phong shading is used when the pieces are floating on their own, creating a realistic lighting effect without a noticeable performance hit. But when the pieces are assembled, visual artifacts appear along the edges. To avoid this, we switch to a different shader texture taken from a separate bottle mesh rendered outside the viewport.

A low poly version of the bottle was created in Maya and divided in 26 separate pieces. At runtime, each piece is extruded to construct the geometry of the sides and interior. This approach enables us to remove adjacent sides when the pieces fall into place, avoiding sorting issues. To build realistic breakup geometry, we determine the extrusion direction using vertex normals.

Realtime extrusion was also used for the volumetric light that comes out of the explosion centre. In this case, we calculate the direction from the origin to each vertex world position. On every frame this single point extrusion is updated to maintain the illusion of a realistic light source. Once again, as the pieces are joined together we remove all redundant geometry keeping the borders of the resulting assembled shape.

A complex scene hierarchy handles rotation along the different axes, while keeping the pieces looking at the center. Quaternions and matrix math are required to keep the motion smooth and also for dynamic parenting during user interaction. Simple physics take care of the collision between pieces, while positive and negative radial forces keep them inside the play area.

Working with Grupo W has been a very rewarding experience, their minute attention to detail can be appreciated everywhere, from the fast-forwarded skip intro to the electrified feel of the user interface. Their talent and hard work has been essential to achieve their vision. We hope you enjoy it.