Our largest HTML5 game to date: Wolfblood: The Mystery of Stoneybridge for CBBC

titlepage

It is with great pleasure I can finally announce that our latest game has gone live. Wolfblood: The Mystery of Stoneybridge (mobile browser only) is a large multi-part adventure game based around the successful BBC TV show. Wolfblood is a fantasy/supernatural TV series focused around the exploits of two ‘wolfbloods’, Maddy Smith (played by Aimee Kelly) and Rhydian Morris (played by Bobby Lockwood) as they struggle living their double-lives as wolfbloods, and keeping the secret concealed from the outside world.

It was commissioned as a mobile browser and desktop HTML5 game, and is part of the BBCs Summer of Mobile campaign. The game involves taking the player through Stoneybridge, the location in which the show is set, as they unlock 19 different puzzles and challenges across the sprawling map. Optional branches allows the player to explore and unlock new areas trying to achieve a perfect rating. Successfully complete the game and you can view some exclusive shots from series 2 of the TV show which is currently in production. Wolfblood: The Mystery of Stoneybridge is a departure from traditional CBBC content in that it relies entirely on brain power rather than brawn. There are no timers or tests of reaction involved, instead you have to solve your way to victory.

map

Technical Challenges

As with all mobile browser games we had to support a wide range of devices, from top of the line iPads down to lowly Android handsets. All graphics were designed around a 1024 x 672 resolution and careful management of resources was needed to ensure no crashes across mobile. But even then the game was still too large for the Android stock browser to cope with so we had to employ a multi-load system to give the browser a chance to refresh memory and stop the canvas from overloading. Honestly we can’t wait for Chrome to become the default on Android!

As well as the graphics we also had to approach audio carefully. We ended up creating a split audio system supporting both legacy audio tag and the more advanced Web Audio API. So if your browser supports it (for example iOS6) we can overlay great effects on top of the music from the show. On legacy devices we deliver just the music layer. A lot of work went into building the audio subsystem, as you need to take into account mobile locking, file decoding and channel management, but it was time very well spent, and the end result is now part of our Phaser framework.

maze

Masters of the Pixels

Production of a game on this scale was a team effort all around. The consistently excellent artwork was the result of the mad skills of Antony Ward and Tom Waterhouse who went above and beyond to provide on-brand art, UI and animations. I’d also like to thank Ben Harding and Phil Wickliffe who helped produce all of the first round of prototypes from which a lot of the game concepts were born.

All development for the final version was handled by myself. Literally every single line of code for the entire framework and game. We don’t use any 3rd party libraries at all to ensure maximum control over every aspect of the game, and it paid off massively as a result. The desktop version that will launch shortly was built with the KiwiJS framework as we needed IE7/8 DOM support.

Finally I’d like to personally thank Jim Tonge, Jonathan Modley and Simon Clarke at the BBC for running production on such a demanding project.

pathfinder

Watch out for it on TV

Marketing for the game kicks off on the 20th July with promotion across the BBC and CBBC home pages, the CBBC Summer of Mobile TV trail and also an extended game specific TV promotion which we hope to be able to share with you here shortly. It’s always exciting to see work go live. It’s even more exciting to see it go live on major TV channels 🙂

So if you’d like to try and solve the Mystery of Stoneybridge then please point your mobile browser to http://www.bbc.co.uk/cbbc/games/wolfblood-mystery-of-stoneybridge-game.

hiddenobject

Posted on July 19th 2013 at 2:53 pm by .
View more posts in Clients. Follow responses via the RSS 2.0 feed.


3 Responses

Leave a comment

Make yourself heard