Snapshots of the Universe

When we started a project with Penguin Random House to create an iPhone version of Stephen Hawking’s Snapshots of the Universe, we were thrilled – we’d get a chance to show off our user experience design skills in an educational game! Working on business apps is of course fun, but working on a game is a whole new level of design challenges. And the fun part? The app is reviewed and approved by Dr. Stephen Hawking himself.

iphone_1_1

We got our creative juices flowing, and everyone wanted to contribute with their own ideas. Let us share a few key things we learned.

Game ergonomics on the small screens

On bigger screens there is enough space to lay out all the necessary controls and information without interrupting the game flow. On a phone, however, we don’t have such a commodity, and serious adjustments have to be made.

The biggest difference is in holding the device. When playing the game on an iPad, most users have their device on a table or their knees, and interact with it using the index finger. On the iPhone in landscape mode, they are holding the device with the both hands and interacting with their thumbs. This means all interactions with the game must be put in the center of the screen, while the supporting controls like menu, pause and tooltips must be rearranged not to overlap active game elements (e.g. corners of the screen) and to be within the reach of the player’s thumb.

iphone_2_1

Let the players control the flow

We optimized and minimized the interactions and the flow, as mobile phones should offer a significantly different experience than the other platforms, whether it’s a PC, a console, or even an iPad. While playing games on a phone, you are often interrupted. Games should make it easy for the players to pause, resume, try again and quickly check their progress. We had known that and we’ve implemented all these functionalities on iPhone version of Snapshots for the Universe. Also what we’ve done, we’ve ditched the lengthy loading screens, players just don’t have time from them.

Provide just the right amount of information

For an educational game in which the player is exploring the world through a list of experiments, instructional tooltips are the ones that help with the game flow. The best approach to tooltips is that they should be visible at the same time with the other game elements, but without overlapping. It’s much easier for a player to understand the instructions by reading the tooltip and looking at the game elements at the same time. Sounds easy, but on a smaller iPhone screen it’s a very delicate task.

We’ve spent a great deal of time deciding when and how to show them, and even more importantly – when to hide them. Our goal was to provide relevant information clearly and quickly, and get out of the way once the job is done.

iphone_3_1

Design-build-play-learn loop

Without actually seeing the game in action, you cannot reliably anticipate how it will work. Nothing can hurt the games more than a broken gameplay. Bugs, dead ends, unreachable elements on a screen, and accidental crashes, just to name a few, will cause a burst of frustration. But testing in this case is fun, as it comes down to playing a game. We’ve implemented a constant design-build-test loop, fixing the issues as they arose, and adapting the design until it was perfect.

Size does matter

Snapshots of the Universe supports iPhone 4, 4s, 5, 5s, 6 and 6 plus. These are four different screen sizes. Simple resizing won’t do the trick here – something that looks spot-on on an iPhone 6 Plus, doesn’t look so good on an iPhone 5. There is no easy workaround, as we had to address each resolution separately to achieve the best possible experience on all screen sizes.

And this comes with the price – a huge file size. First step in optimization was arranging the layouts so they dynamically adapt to different screen sizes. Second step, finding the assets that contribute most to the size, as these are the best candidates for optimizing. We focused on reusability of assets whenever possible, and experimented with shrinking textures to the smallest possible size that looks good on the device. And the result? The size of the final build was nearly half the size of the original. It was all worth it, as we simply did not want our players to give up when seeing the file size or cancel the lengthy download.

So try it out the game – it explains how the universe works through 10 interactive and fun experiments. From understanding the laws of gravity by throwing a rock on different planets, through searching for black holes in the dark universe and traveling with the speed of light when the theory of relativity kicks in – you’ll master the basic theories that govern our lives on Earth as well as the movement of the stars and planets.

We enjoyed developing it, and now are still enjoying exploring and playing it. You can download Snapshot of the Universe on iTunes.