Game Manual Design Development

I’ve started off designing the manual with the front cover, because it seemed like a good place to start. I wanted this to be similar to the opening screen of the game, so I started off by making a higher resolution version of the game’s logo. I tested out various ways that I could make the Hanko stamp in Illustrator, using various line styles and shapes.

Hanko stamps seem to come mainly in either square, circle or oval, although on some sites I’ve found rectangular ones. The problem with using Hiragana instead of the more appropriate Kanji is that it needs some sort of alignment to make sense, otherwise I would rearrange the letters to make a formation that best fit any of these shapes! For this reason, I felt that a rectangle would be best. I tested each shape out with the title, and definitely felt that rectangle suited best.

To accompany the logo, I’ve also been working on a background image for the pages of the manual. This pattern is based on the auspicious cloud patterns I researched earlier for cloud design. I used the pen tool in illustrator to create this outline first:

I’ve then adapted this in Photoshop. I’ve created two variations- one for the cover and a more subtle version to be used on the other pages of the manual. The more subtle variation uses a white version of this outline with a very pale purple background. This is the same colour as the menus and the title screen in the game.

The version I’ve made for the front cover is slightly more elaborate. I’ve used darker colours to closely resemble the game’s title screen, and I’ve merged the line colour with the background colour. I originally planned to place the logo in the first third of the grid, but after a little rearranging and testing I realised it actually had much more impact in the centre. I don’t want to add anything more to the cover now, so it makes sense to sit in the centre of the page.

I’ve started filling in the first few pages of the manual, but haven’t finished any single page yet. The contents page is looking the most finished right now, as there wasn’t much to put in it in the first place! I’m working on little bits like the number tabs on the side of the page which resemble the style of the game’s GUI to keep the document consistent with the game.

One addition I’ve made since I wrote up the original contents is a “travel guide” in the back, which contains a table of Hiragana and a few Japanese phrases that the player can look out for in the game, although not everything will be included. If the player really wanted to, they could use the Hiragana table and run the romaji through a translator to see what comes up. This could turn up some pretty good results. As a test, I ran one of the phrases I’ve used through Google Translate and ended up with this:

I have it under good authority that the phrase I typed, “onaka ga suite imasen”, means “I am not hungry”, although obviously this doesn’t translate well literally!

Auspicious Everything

Today I started to crack down on Hanami’s background imagery, not just the background tiles which in a way make up the foreground…But the actual far-distant background that doesn’t affect gameplay in any way. So far, my background has consisted of a grey colour which has been made a murky pink colour by the ambient overlay from the lighting system.

Obviously, one hugely important feature of the background is trees. I would consider myself a failure if I made a game about cherry blossoms and didn’t include the trees that they came from. This has always been a part of my level design thoughts, and although I’ve never mentioned it, the trees were among the first elements I started to think about when developing the art style.

As a I knew I was going to be using tiles but wasn’t sure what they would look like at the time, I wanted to make sure the trees didn’t conflict with the rest of the style too much. I tried to think of ways to make trees from tiles just in case making stand-alone tree objects didn’t work. From playing around with rock features etc. I’m pretty confident in saying that wavy tree objects aren’t going to be an issue against the square shapes of the buildings and other elements.

I discovered this photo a while ago and knew I had to make trees that looked like this! They fit in very well with the style and look naturally Japanese, which helps with the consistency of the game’s themes.

I reduced the size of the image and essentially traced the shapes in Photoshop to create these tree objects.

I imported these into the Game Maker project to see what they looked like with the rest of the tiles I’d already created, and here is the result:

They fit into the landscape better than I expected, however I felt that they needed rescaling to act as background elements. The background is better off made up of fewer large objects than lots of small objects cluttering everything up. I had a similar idea for a Sakura tree this time traced from a branch as opposed to an entire tree, which never really got finished.

Auspicious Clouds

Another element that’s been a part of my designs for a while now has been this swirly cloud pattern, which I’m hoping to use for cloud platforms towards the end of the level. It’s a very Eastern cloud drawing technique, started as the auspicious cloud pattern in China and adapted by the Japanese. Anime enthusiasts may recognise a similar pattern used as the Atatsuki symbol in Naruto.
It’s the spirals that really set this design apart from the standard cloud-like patterns you tend to see in Western productions, so I started arranging drawn spirals to get these cloud shapes:

This is actually an early page from my sketchbook which I cleaned up and recycled, which is why Hana has appeared in the bottom left corner!

Because I want everything to look Japanese, including things like clouds which tend to look the same all over the world, I started working on implementing this sort of design into the background. I used the previous screenshot to draw straight onto to try out a rough version.

From this I made a cleaner version, which I attempted to shade and make consistent with the rest of the game assets. I kept the scale roughly the same, as I thought the cover from one cloud was adequate. However, in the game I felt they may be slightly too big compared with other elements such as buildings, although I won’t change anything now until I’ve added in more background. These will definitely go in though, they don’t look as though the conflict or compete with the foreground and represent a part of Japanese culture.

This kind of gives you a rough impression of how they look in the game, although for now I’ve simply repeated the designs infinitely along the X and Y axis and seem to have created a cloud overload. In this example, I’ve added a slight blur and changed the opacity of both clouds to make them seem more cloud-like.

Auspicious Trees?
You can see from the sketches I did above that while I was drawing the clouds I thought to myself “I could use this pattern for trees also…” Although this decision has been a battle in my mind all day. Yes, it works well as a tree design in theory but how well does it work in practise? I tried both designs for the bonsai tree and the sakura tree out with this auspicious leaf pattern on the mock-up screenshot:

While both designs are nice on their own, I just don’t think its appropriate for implementation into the game, as this really does create clutter and mess. As competition for the design, I created a more realistic looking Sakura tree, inspired by this lovely painting. I wasn’t sure on the scale of the tree, so I made this second design slightly smaller and compared it with the “auspicious” design in the Game Maker project. This is the comparision (minus clouds!)

Unfortunately, I felt that neither of these designs were suitable. While the more realistic design works better in union with the game’s tiles, the “auspicious” design is much better in terms of scale. So, to put any tree designs into the game I have to increase the scale. I think the height that seems to be working is about 150 pixels.

Auspicious Bushes?
I had a real lightbulb moment this morning when I drew a spiral pattern at the base of the tree and realised that I could add bushes to my level design. These won’t be spirally, but expect bushes. There is a definite lack of plant-life in my game world so far.

Auspicious Everything Else
So I now know that I will have at least two types of tree in my background, as well as possibly some bushes if these don’t get into the foreground. I’ve mentioned before that the background will probably mainly consist of mountain shapes, to look like far distant mountains. Japan is full of mountains. It’s very much a Japanese thing.

I went back to the Photoshop screenshot mock-up again and drew in some really rough mountain shapes. These fill a great amount of negative space, and work so well in creating depth.

I’ve yet to develop these any further, but getting the background down is one of my top priorities now as I’ve realised how much difference it makes to the feel of the level. I will probably create a seamless string of mountains that will be repeated across the X axis at the top of the level like this.