Tuesday, 5 July 2011

How I implemented my interface part 5

I moved onto my option menu and did this very well with the same background as most of my other menus and I inputted the options to change like Screen Adjustment, Difficulty, Button Configuration. which were all hyperlinked to separate slides to make this work how I want it to.





The controller configuration screen is made up of the table tools in Power point and imported an Xbox 360 controller from Google Images, simply filled in the table with buttons and functions. I drew the corners of the screen myself having given the experience to use it in the days when screen alignment wasn't optimised was essential. Nowadays though this isn't necessary as HDMI does the alignment for the player, but I like to have the retro method of manually aligning the screen also.

How I implemented my interface part 4

I used the same background for the online screen with Lobby, Create lobby and Join Lobby followed by the lobby screen.


I used the rectangle tools on separate layers and I used the text tool to give the blockiness of the text and I added the X button on the Xbox controller. As for the lobby selection screen it was simply a table in Power point and a few auto shapes. I hyperlinked a random gamertag and went to this screen:

This sometimes happens when you have little to no signal to the router and you see this screen, it was a simple implication of the rectangle tool and text tool with a blue background layer.

How I implemented my Interface part 3

In Photoshop, I pushed the boundaries to create the HUD in my interface. In the file I have created 15 layers, this is by far the biggest file on my memory stick, I decided to give the player some instruction as to how to combat and how to open your inventory, so I displayed these on screen to help the player know how to play the game.













I have given the player a busy, but innovative HUD because I think that this is something that hasn't been in a platform game for some time, in fact the last time I saw a HUD like this was in 1999 when Spyro 3: Year of the Dragon, it had a map and gems. I also wanted to portray the colour scheme to be similar to this aspect of the genre that the PlayStation took with Spyro the Dragon. I started with distinctively separate the background to have the sky and the grassy areas. I then moved onto the hills and giving them a darker shade of green using the paint brush tool. I then went onto creating the jewel indicator and lives and health bar using many shape tools and I rasterised them to become shapes not text as they were originally. I coloured them in different colours and using the pencil tool, I switch colours to give the illusion of it changing colour.

I then imported my asset from Unit 34 2D Animation, it's a picture of Luna and I added some legs as the picture had no legs and wouldn't look right if I left it like it was. I then moved onto the enemies and the requirement message at the bottom using a combination of the rectangle tool, paint brush tool and paint bucket tool.

How I implemented my interface part 2





I set all the slides in Power point 16:9 screen orientation, I then copied the merged layers into the Power point and created a new slide and went to the previous one and drew an auto shape box over the text and rewrote it in a text-box. I then set up a hyperlink to the next slide which is the loading screen and I wanted it to look realistic as if it were running on the console and I did this by doing the first one and editing the original and placing them in sequence that the loading bar is filling up as shown above.
To get the loading screen to fill up in the slide show, I turned off  the on click check box in the animation tab in Power point and checked the automatically after and I set it to 00:02. This makes the loading screen look like it is running in a console.

How I implemented my user interface part 1

When I first began work on the interface, I had a clear idea of how I wanted it to look like and how you could interact with the interface. I started to draw designs and immediately like what I drawn and got approval.

After getting the approval and some advice from Dave Chipp, I started work on the interface and opened up two programmes, Powerpoint and Photoshop CS5 to create the interface. Using my sketches, I started drawing my first screen.
I first drew the background, in the default file, the background layer is locked, but I double clicked on the layer which makes it unlock. I then added many layers and Text layers, I also ran into problems when I didn't rasterise my layers when I tried to edit them I got an error message and this started to bug me. The next thing I did was the yellow and brown layers which were the rectangle tool and filled it with colours shown below. These are two separate layers because the program fills all shapes drawn on that layer the same colour that that I chose. I then had to figure out what type of text I wanted on the main menu of my interface and I decided to go for a serif font in a colour that will is visible on the background, I then added the highlight so that it would be behind the text which is blue.