Wednesday 16 November 2011

#022 GAD BA1 P2: iPhone Game - Game Interface Continued...

As mentioned in a previous post, I wanted to create a few examples of what the menu interface would look like. I mocked up a quick screen in Photoshop just laying out where the basic buttons and logo will go and then started to add in the detail. I created the buttons by using the Rounded Rectangle Edge tool and adding a stroke line in one colour, rasterized the layer and then adding another stroke like in another colour. I then added a slight leather texture over the top of the button and then added a bevel and emboss to make them pop out a little. The background was created using some stock photoshop brushes available for commercial use.

With the buttons and background sorted I decided that something was missing from menu screen, so I added in a preview of the game play. In the real game the preview will be a short repeated clip of a dragon flying through the games scenery. Here is the result:



With the main menu mock up done I thought it would be good to do more for each of the different sub-menus. For example, what the "Customize Your Dragon" or "Your Dragon" screen would look like. Below are the results for each of the screens I designed:

Story Mode - Level Select

Dragon Customisation Screen
Settings Menu Screen
Game Stats Screen

Exit Confirmation Screen

No comments:

Post a Comment