Screenshots from Zoo Tycoon
I used the mechanics of Zoo Tycoon as a tool to develop a small in-game world similar to the one proposed for my game. I then used the various game modes in Zoo Tycoon to take screenshots from different positions. Because the pandas move around in the game, as well as displaying various emoticons in thought bubbles, it was very difficult and time consuming to get even these 5 screen shots, hence why I don't have many.
I had to brighten them up a bit in Photoshop because of the screenshot mechanics on the computer I used, as my macbook wasn't compatible with the games. also had to crop them down to a similar ratio to the screen size I was designing for, which left me with these.
Title Screen and Menu
I chose to use this screenshot for the title screen because the darker sky set it aside from the others. The positions of the pandas meant that I couldn't have the text placed centrally, so I placed it in a position and size that mirrored the pandas in order to balance the screen.
I looked at how the grey and the brown text and buttons would look and decided that the grey was more appropriate because of how it was a similar colour to the pandas fur.
I then realised that the text needed to be centrally aligned to fit with the menu screen, so I changed this, keeping the position and colour the same.
I continued to use the grey on the menu screen because of its similar colour to pandas, but couldn't get the title text to look right after trying with numerous colours.
Because of this I decided to use another of the screenshots as the background, and this worked fine. It gives a much more positive look to the game, which is an important vibe to give off at an early stage.
I found that the menu screen seem considerably more positive than the title screen, and the central text made the screen look more balanced, so I decided to change the background of the title screen to one where I could use centred text and keep the menu button in the place where it is on the loading screens for consistency. Whilst this variation of the menu screen is better than the old one, I'm not overly happy with the image, and so will probably get a new one at a later date.
Photography Mode
I used the last screenshot to illustrate how the icons and buttons would sit on the photography mode. The only issue I've found here from my storyboarding is that it isn't obvious that the camera icon at the top is the active one because there's no colour in it.
I decided that the simplest and most effective way to solve this issue was to give the active icon the light brown background, as I've already shown there's noticeable contrast between the light brown and light grey.
Overworld Screen
The one screenshot I got of the overworld worked well. Despite, having various things sitting on top of the overworld, there is still plenty of exposure of the screen, which is something I was worried about potentially being an issue form my storyboard. The background of the globe icon is brown for consistency with the photography mode screen.
The shape of the pointer above the pandas is taken from the map icon, and the colours are taken from the male and female symbols, both of these aid consistency. The number in the the pointer refers to the number in the message box.
I tried using tints of the blue and pink as I felt that they were slightly garish. Seeing the alternatives I realise that firstly, the garish colour is more functional as it helps the user locate the pandas, and secondly, the very slight difference it makes doesn't merit adding more colours to an already extensive colour palette.
No comments:
Post a Comment