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.
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.
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.
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.