Sep 2, 2015

BEHIND THE SCENES: No Nodes Never Known

In this behind-the-scenes post we share early images of our puzzle object designs and some of the thought behind their development.

When beginning design and development we considered a few key elements:
1) The mechanics: How to visually communicate to the player that they need to tap on the node. (The less tutorial the better). 
2) The story: Not all puzzle games will put an emphasis here, but our story is a big part of the experience. While we want to accommodate players who aren't interested in this aspect, visual immersion will add significant value to those that do choose to follow along.
3) Awesome & Unique: We want to make sure that the elements that the player will see repeatedly are memorable and attractive, but not just ripped off of someone else's cool design.


(Functional, yet boring)
1) Mechanics - Maybe
2) Story - Nope
3) Awesome & Unique - lol, NO!
Our very first design was mostly developed for proof of concept and early mechanics testing. Though it was invaluable as a means of fleshing out mechanics, the design had to go.


(Swing and a miss!)
1) Mechanics - No!
2) Story - No!
3) Awesome & Unique - No!
This one is fun to make fun of.  Some days you're cooking with fire and some days it's all smoke and wasted breath. The animated version of this revision did have some interesting features that were ultimately included in the final cut. While certainly unique, this revision was never "awesome" - but the biggest problem with this design was mechanics confusion. You look at this and tell me what thing you are supposed to tap on.


(A simple approach)
1) Mechanics - Yeah
2) Story - No
3) Awesome & Unique - More unique than awesome.
Taking a step back, we looked for more simple solutions. The simplicity of these elements really appealed to us.  We also liked the general direction of the color scheme but it still lacked any tie to the story.


(Pretty cool, actually)
1) Mechanics - Yeah
2) Story - Better
3) Awesome & Unique - It was getting there.
We doubled down on the simplicity approach and hit on a key element shape that fit our purpose, the octagon. Using the octagon gives an 8-bit feeling and a mechanical appearance that facilitates the overall story well. Also, by hollowing out the nodes, it let us put other shapes or symbols in the center to illustrate the more advanced mechanics that are introduced later in the game.


(We found our happy place!)
1) Mechanics - Yes!
A quick glace will lend most people to tap the correct area of the screen (proven easily by a 3-year old tester). By using an outer ring we have the flexibility to show when nodes are in different states. Last, the inner shape is simple but leaves a lot of room to communicate more advanced mechanics by leveraging other symbols as well as colors.
2) Story - Yes!
The octagon is an easy tie to the feel of the story. However, we also made the edges much more relevant by giving them the appearance of a network connection, with "data signals" traveling in both directions. When you tap a node the communication stops as the edges go dark, illustrating them being "disabled."
3) Awesome but Unique - Yes!
Focusing on integrating our story helped us a long way here, giving us both interesting shapes and a cool edge design. We also threw in a whole lot of animations, but we will save those for another time.

To say this is a brief overview is an understatement, compared to the number of iterations and development time that went into the full design. However, we have focused here on a summary of the the key elements (Mechanics, Story and Awesome/Unique) we considered when drafting our game pieces and how we ultimately came to the final design.

No comments:

Post a Comment