Japanese Interior Design

It’s nearly the end of the week, so my plan for today is to write up a first draft of my Game Design Document for this project. This will help get all my scatted ideas in one place!
Once that’s done, or probably if there’s nothing on TV at lunch time, I’m going to start reading my new book A Geek In Japan” which arrived in the post yesterday ^_^. The book is based on the content on Kirainet, a blog written by a Spanish guy living in Japan. It’s aimed at Otaku like me to give a really good insight into his new Japanese lifestyle with a slightly nerdy twist. His Blog is based around a lot of good quality photography, so I hope this is reflected in the book too!

I’m still unsettled on the graphical style I want to use for the game, but before I get comfortable with a definitive style I’ve carried on practising with tilesets inspired by Japanese interior design. Luckily for me, typical Japanese interior is very minimalist and easy to convert to square tiles!

I used the image as a basis for the tiles I wanted to create. It looks slightly pixelated because I actually scaled it down until the 16×16 pixel grid fit quite well. You can already see at this stage that all the objects in the photo are very angular, if not completely square atleast all the corners are rightangles! Basing tiles on this image also helped pick out colours with the colour picker. The colours I used would not have been my first choice if I had created this from scratch.

On a separate layer in Photoshop, I used the pencil tool to re-draw a part of the image to the grid.

By this point, you can already start to see some repetition of tiles in the cupboards, the vents and the frame of the cupboard. Obviously, the tiles were incredibly basic and boring, so I continued to use the pencil tool at a size of 1pixel to draw in some detail. For highlights and shadows I chose my own colours, based on the original colours that I had picked from the photo.

Using colours slightly lighter and slightly darker than the original, it was easy to add texture and depth. In addition to my tiles, I also picked out some misc objects which didn’t align to the grid, but which could be repeated and placed on shelves etc.

Once this was all done, it was time to put my tiles to the test. The point of a tileset is that each tile can be rearranged to create a completely new layout. A good tileset would have allowed me to do this seamlessly, but this experimental process helped me see where my tiles were slightly flawed. To rearrange my tiles, I cut out each unique tiles and placed it in the corner of my grid. This is what the “tileset” refers to- often when you see a tileset it is simply a group of squares which don’t correspond to each other until they are arranged by a designer. The squares are closely pushed together simply to make good use of space.

Example of a Mario game tileset

My Shelving Tileset:

Now, my traditional Japanese Shelving unit is transformed into a contemporary Swedish storage space:

Although, you can definitely see here where my tiles are less than perfect, especially in the corners and funny little places where I used half the tile for the cupboard frame etc. All in all, this new image was created without any editing to the original tiles, so most of the tiles here would be suitable to use for game backgrounds.
In addition to the shelf, I continued to recreate the room from the photo using tiles that aligned to my grid. The result is an image which represents just some distinct aspects of Japanese interior design which I would definitely like to use in my game!

With Grid

Without Grid