Road to the IGF: State of Play's Lumino CityRoad to the IGF: State of Play's Lumino City

It doesn't take very long to be impressed with Lumino City. Once you emerge outside your grandfather's house, you're presented with a world that disappears into the blur of the depth of field, a world that is obviously and painstakingly handcrafted. Not only that, but the boldy-colored world and its inhabitants are hand-animated, too, with intricate mechanisms making the world come to life.

It's no surprise, then, that Lumino City has been nominated for Excellence in Visual Art at this year's IGF Main Competition. As part of our Road to the IGF series, we talked to Luke Whittaker of State of Play about Lumino City, as well as the prominent use of depth of field to really sell the intricacy of the sets that they built, and the unique difficulties of having to film your game instead of render it. 

What is your background making games?

I was making Flash games at university, then my first job involved designing them. I went freelance soon afterwards in 2004 and became a kind of indie developer - making games for online portals like Miniclip and the BBC in between making animations. By 2008 doing both the art and the code was too much. I’m an artist at heart, and I wanted to make larger games, so I teamed up with Katherine [Bidwell, studio co-founder] to create State of Play.

At around the same time the iPhone came about, Steam was getting really popular, and it seemed like there were opportunities to create great independent creative projects.  We now work with Dan, who’s the main developer, and Steffan, an artist. All our games have used some element of the hand-made - I was screen printing my graphics back at university for example - and this has culminated in Lumino City, where we built an entire model city to film for the game environment.

What development tools did you use?

Lumino City is actually built in Flash. It’s the only tool which allows easy syncing between video and animation. It meant I could use all the animation skills I’ve developed, and also employ other Flash animators to help out. Knowing the tool inside out helped us dive right into it and start making things happen, and we could then keep pushing it as far as it would go. We would make our own tools. For example Dan [Fountain] developed some great tricks to help us fit the characters into the scene and make sure they were blurred correctly and had the right amount of film-grain, while still remaining interactive. And some of the greatest fun we had was when we were looking at a scene, knowing what we wanted to achieve, but not exactly how we’d go about it. The "eureka" moments were all more more satisfying for it. 

How long have you been working on the game?

It was about three years from start to finish. That was longer than planned; somehow we thought it might just take a year and a half. We were running out of funds and I also wanted us to keep excited about things we were making. So Dan and I decided we would take a day off a week and work on a puzzle game called KAMI. It was refreshing to have another less epic project to think about, and after it was featured by Apple in the iOS Store it became pretty successful, helping fund the second half of Lumino City development and meaning we could stay completely independent. 

How did you come up with the concept?

We’d been wanting to make a puzzle adventure game for a long time, and in 2011 we did just that, working in our spare time to create Lume, which is also built entirely by hand and is the prequel to Lumino City.  We had plans to build a huge city back then, and we did a few tests with cardboard boxes, but we realised quickly that it was too ambitious and risky for us to pull off with so many questions as yet unanswered. Would it be possible to track our characters movements to all the big camera moves? How would we afford to build it? Would anyone even buy it?  So we decided to start small and took one scene from the big story -- Grandad’s house -- and turned that into the neat self-contained adventure Lume.  It helped us prove the technology, develop the backstory to the game world, and also allowed us to see if the idea was something people liked.  The game went on to get nominated for an IGF award in 2012, win a Develop Showcase award, and its success gave us the confidence to set about the grand vision of Lumino City.  I’m pleased we waited to begin the sequel. The gestation time allowed me to improve the design of the city, to employ people like the architect Catrina Stewart. We worked together for months at the start, designing the city and the games, and she helped bring the visions to life with her sketches and modelmaking techniques like laser cutting. The game became better because we gave the idea time to breathe.

One of the most striking elements of Lumino City's visual design is the use of focus. What was the process of designing the depth of field in the game?

Once you’re using a camera to record your environment, once of the first things you notice is the depth of field, and that’s what we picked up on way back in our early tests for Lume. Narrowing the depth of field so only a small area was in focus produced not only a beautiful effect, but one which could even enhance the experience of playing a game.  We learned we could narrow the depth of field to focus your attention on the foreground, or keep the background blurred to encourage a sense of intrigue as to what was there. By the time we made Lumino City, we were thinking about making this interactive too, so, for example, when you’re on top of the Gatehouse near the start of the game and your destination is blurred in the background, we knew we could allow you to shift the focus back there to see it.  On the day of shooting, all we were really doing was focusing between one area and another, then back. But we put it into Flash and allow the player to play that video themselves, giving them control of the focus.

In contrast to the simpler, bold colors of the world, the in-game "handy manual" is filled with architectural drawings and diagrams. Was that juxtaposition intentional?

The two go hand in hand to me. The environments themselves are architectural pieces and we designed them all to have a graphic look -- I wanted you to be theoretically able to make an abstract, side-on picture of any environment from a few colors and you’d know where it was in the game. So there is a relationship between the environments and the graphic nature of the book. But the book serves many functions -- it needs to be clear and bold so you can understand the hints it gives you for the puzzles, and I also wanted it to be able to relay some more complicated ideas about how certain technology works. Diagrams help with that. The book was also written by Grandad, and has his writing in there and his designs, and I like the fact that it’s an expression of his character, and it’s like he’s helping you along your way.  You don’t see him for much of the game yet you carry this with you -- it’s the link to your family.

The hand-made and hand-animated nature of the world is a big draw, and something that sets Lumino City apart. Was it more complicated to produce than computer animation and design?

It’s difficult to say how much more complicated it was. It was easier for me to get going with it, building wireframes and animating, than it would have been for me to learn a 3D engine like Unity first, then creating a 3D world and trying to make it look anywhere near as beautiful. All I know is that it pushed my own skills to the limit and we have had to push the technology in new directions, probably in directions it was never intended to go, so we have done some pretty complex things.  In the end, the result is what matters, and it simply wouldn’t be possible to get the effect we’ve achieved using a 3D environment.

Have you played any of the other IGF finalists? Any games you’ve particularly enjoyed?

I was so pleased to see 80 Days up there, as it’s been my favorite game this past year. What it’s done for the concept of interactive narrative is superb. I’ve also been loving Metamorphabet (as has my two-year old son). The animation on that still blows my mind. And am just getting into This War of Mine.