Thursday, November 28, 2013

Zen Garden Puzzle: Evolution of graphics design

My new game, Zen Garden Puzzle, is finally ready and is waiting for review from Apple. If nothing goes wrong, it should be on sale a couple of weeks from now, just in time for Christmas.

I had talked about this game almost exactly 6 months ago. My original intention was to write regular updates and release the game in September, but development was harder than expected and it absorbed me completely. I'll try to make up now for the lack of updates.

When I review games, I try to see past the presentation and judge the core mechanics, but it's undeniable that a good looking game is more enjoyable than a bad looking one.

I wanted this game to look good, but I do all the graphics myself and as an artist I'm not half as good as as a programmer. To overcome my limits, my initial plan was to make a minimalistic game, with very simple abstract graphics. Initial prototypes looked like this.
Eventually I settled on a palette that I liked, but the shape of the graphics didn't change much, and I was content with that for all the initial development.
When the time came to let other people test the game, however, it became clear that I had a lot of work to do. The mechanics were ok, and most people found them intriguing. The main gameplay screen, however, was lacking something to make it stand out. In my opinion, the most important shortcoming was the lack of a good reward after solving a puzzle.

At that point, I had to accept that a minimalist design wasn't the right thing for this game, and I needed a stronger theme. Since the puzzle involves moving blocks around the board, it seemed a fitting theme to make them be rocks in a zen garden. I focused first and foremost on the reward screen, to be shown after solving a puzzle. I wanted to capture an abstract representation of a zen garden with rake patterns circling the stones. The initial results were encouraging.
I was still uncertain about the gameplay screen, however. I made many experiments and eventually settled on rounded curves which tried to keep the same theme, but it felt very weak and not consistent with the reward screen.
Development dragged for a couple of months, as I completed all the other features in the game. I changed the stones to make them look like real stones instead of anonymous circles, which gave them character and significantly improved the overall effect, but the main game screen still felt unfinished.

Eventually, when I had lost hope of finding a good solution, I reached enlightenment and figured out that the reward screen shouldn't appear only at the end: it should always be there, peeking through the game board, being revealed as you solve parts of the puzzle.
Also, as taught by iOS 7, the content should extend to cover the whole screen.
I'm citing iOS 7 because the way I felt after this design breakthrough was like in this famous quote from Jonathan Ive:
True simplicity is, well, you just keep on going and going until you get to the point where you go, ‘Yeah, well, of course.’ Where there’s no rational alternative.
I was almost there, but it still looked a bit cluttered and unpolished. After repositioning the background to nicely align with the text at the top, revising the area borders, and adding a gradient to the stones to make them more three-dimensional, the final result was this.
It was a long road to get there. I hope you will enjoy the results.

©2013 Nicola Salmoria. Unauthorized use and/or duplication without express and written permission is strictly prohibited. Excerpts and links may be used, provided that full and clear credit is given to Nicola Salmoria and with appropriate and specific direction to the original content.