In today’s post I’m going to talk about art asset creation for New Sokoban. My artistic skills are limited and I am an autodidact in this field. So, I needed to create the art for New Sokoban taking into account this limitations. My idea was to create abstract assets playing with plain colors and some basic effects like shadows and border strokes.

I started with the game screen because I felt that it was the most important one and that it would set the artistic path to follow. In the following image you can see what was my first try.

As you can see my general idea was to create some kind of frame that helped to create the illusion of having some kind of interface. So, at the top I would have something like the name of the current puzzle, at the bottom I would have some basic buttons like “Menu”, “Undo”, “Restart”… and in the middle of the screen there is the puzzle itself. I had been thinking about having more room for the playing area and designing the puzzles in some rectangular shape. However, I liked the squared shape of the puzzles I had designed until that moment and I thought (and still think) that the squared puzzles have something special. So, I kept the square space for the puzzles.

So, having decided the general layout of the game screen, I moved to the design of the board itself. On the image above you can also see my first try for that. Very simple and classic. And probably… boring. Curiously, the thing I liked the less was the walls. That bevel effect was horrible and I think that gives this first try a kind of amateurish feeling. So, it needed some more work…

Then I had some interesting idea. What about “emptying” the walls? I didn’t like the walls and made the game feel too much classic. So, I decided to try make the walls disappear. On the bellow images you can see the first tries of this new concept.

Mental note: art asset creation and, in general, any artistic activity is all about getting the right path. I mean, execution is easy. If you know Photoshop or Illustrator or whatever tool like these ones you will be able to replicate any asset you see in any game. However, reaching the idea, finding the inspiration, ringing the bell is very very difficult and sometimes frustrating. However, patience and keeping an opened mind helps preparing the path to the right idea.

New Sokoban art creation - Playing with empty walls

I felt much more comfortable with this concept. Therefore, I kept working on that direction until I reached a board design that I liked enough. On the image below you can see the final version of the board. You can also see the final version of the box and the target. I don’t know exactly why the basic boxes are red. This was the color I first chose for the first prototypes, without thinking, I simply picked that color. But, I get used to it and finally liked a lot. So I kept that red color for the basic box. With the target I wanted something with the feeling of a button, something that got activated when a box laid on it.

New Sokoban art creation - Final version of the board, basic box and target

Obviously, if I made the walls empty I needed to show something bellow the board. I decided to put some abstract background and add some shadows to the board to create the effect of the board levitating over the background. It got a kind of oneiric feeling that I liked a lot. Therefore, the idea was approved 😀 Moreover, to reinforce that oneiric feeling I slowly animated the background, moving it from left to right and vice-versa, very very slowly. You can appreciate this effect on the video included later.

The only thing left to do were the buttons. I tried lots of sophisticated designs but I finally decided for a very simple design. You can see the final version of the game screen on the image bellow.

New Sokoban art creation - Game screen final version

The basic layout was kept. I added descriptive labels to the buttons and a moves counter on the top right. If you tap this counter, it switches to a clock version. So, you can choose to see the moves you have made or the time elapsed. This are the two parameters that I use to evaluate a puzzle solution. The moves determine the stars you win and the stars + the time elapsed determine the final score.

When I reached that point I was sure that the hardest part was done. But as usually, I was wrong… The menus screens and the win screen were also very very difficult to create. My idea was to create these screens in some manner that the player felt some kind of feeling of continuity. Starting from the main menu screen and until the win screen.

In my first prototypes I tried to link the different screens with the boxes of the puzzles. But that didn’t worked. So, once more, I decided to keep things simple and reused the idea of the moving background to link all the menu screens and achieving the continuity effect I was looking for.

Mental note: keep things simple. Always and for every part of your game. Game design, art, code… everything. You will learn that when simplifying thinks not only everything gets easier but also better.

On the following video you can see all these things working together. This video also shows the current state of the game. It is in a quite advanced state 🙂

So, this should be very close to the final release. There are some things that I still doesn’t like. For example, I am not totally convinced about the win screen. It is a very important screen and I think that something is wrong with it.

Wow! Quite a large post! I hope you enjoy it 🙂 If you have any suggestion about the appearance of the game, leave a comment please 🙂 Any kind help would be appreciated.