Alone in the Dark
Remaking GUI and HUD
Designing for the User
Alone In the Dark
Synopsis
Goals
Audience
Analysis
Content
Requirements
Structure
Design
Testing
Tester: Claire Jennifer Anthony
Tester: Liam Thomas Smith
Tester: Matthew Colin Hardiman
Evaluation
Menu
Health
Weapon/Item Switching
Profile
Synopsis
I plan to produce a HUD (Heads-Up Display) and a GUI (Graphical User Interface) for this game, in the actual version of the game there is no HUD in an attempt to create a very movie like experience, however their should be options to check various things such as the amount of ammo left in your gun with the click of a button.

(Original Selection Menu)
The original idea that I had from the start is a menu that drops down like in Crash Bandicoot games. This is so it doesn’t appear throughout the game and removing the movie-like experience to the game however it is there to inform the user. It seems like they took the game too far and removed the HUD, when they should have kept some things in such as the HUD.
The interface is also set out like a movie (see below)

While this is quite a good menu I want to keep the whole movie feel, just change the whole thing around a bit. Easier navigation would be good as the navigation isn’t exactly clear for a user.
Goals
I want to create a simple HUD that doesn’t involve going into another menu. For example a weapon change is shown by looking in the inside of the players leather jacket in which all the weapons are stored. However when in combat it is hard to switch to the different weapons, and quick switching, is available however, when you use your weapons (normally plastic explosive bottles that you can shoot) they are removed from the quick select (D-Pad).
The main goal for the GUI is for it to be easier to navigate to the checkpoints, as it isn’t all clear. If the GUI isn’t made clearer I won’t feel like I have accomplished much as, the way it was designed is good, I personally like it, however it’s not quite as simple as it should be and I think this is one of the things that affected the way I felt whilst playing this game.
Audience
My HUD will attempt to create something that shows the user exactly what they have in their inventory and also an easier select system. In the actual weapon select you have half a circle and you have to scroll around with the analogue stick to select the weapon of your choice, however with about 10 different inventory slots it gets hard to get the correct angle to select bullets to reload your gun and mix objects… especially in the middle of combat. This should make it easier to use for a wider audience. However as previously stated the audience for this game are mature teens to adults and this could be quite an easy HUD to use.
The GUI is quite well made however I think I could make it simpler to navigate through, you can select different scenes from checkpoints and you can even skip right to the end of the game, I think this feature should be taken out.
Analysis
I think a menu such as the resident evil system would be quite good; however it would remove that movie feel. However there is a line between a game and making a game like a movie but I think that this game crosses the line and is played more like a movie and it removes general game aspects of a Generally-simple User Interface.
The whole GUI is supposed to feel like a movie and in a movie you can skip to the final scene, as you can in this game; understandably, it helps if you get stuck at any point throughout the game (as I found I have done,) you are then able to skip a scene, but it also removes the element of trying and trying until you get it right. For example from other games I have spent a while trying and trying to kill a boss until I get the gist and defeat him, on this you can just skip through it although on the Xbox 360 you do not get achievements for completing the game if you miss any chapters.
Content
The main aspect I will focus on is the information displayed during the game as I want it to be easily accessible to display what items and weapons and items you have remaining. Such as quickly switching to the lighter when you wish to ignite something should be made easier. The mixing system could be better as well, as described earlier it relies on the accuracy of the analogue stick.
The content should stick to the same dark style, just because if you had bright vibrant colours it wouldn’t stick to the same style and would completely ruin the feel. There is currently no colour scheme for the HUD so I may try and use some colours from the menu system, any content I re-use will be pointed out but I am considering a complete redesign of all icons, and then I can place the content accordingly. The layout I am thinking of going for would be a bit like this.
Requirements
I think the game will be able to handle a simple HUD as it is quite graphic intensive so a 2D menu should be able to be added on to the game with no pressure on the hardware. It will require an animation of some types so that it does not seem at all dead, the game is quiet to give an eerie feel and I think that this should be kept so on the health bar it will not require any sound, however the animation will be required to link up to the gun shots as out of sync animations will look really unprofessional.
The main criteria my GUI and HUD will require will be simplicity and whilst the gaming audience is 15+ the game still has a lot of confusion with certain parts.

Structure
The way the menu system should be navigated would be like this.

It will start on the scene selection when you pause the game however when the game starts there should be a title menu. This will allow you to view things such as credits, start a new game, select a profile and load game.
Design


Menu Screen

Menu Screen

Logo I decided to use

Updated Menu Screen

Options Screen

Map Screen

Loading Screen video

Loading Screen

Switching items

In game menu
Testing
Tester: Claire Jennifer Anthony
What did you think of the menu?
The menu was quite good but I thought the “Alone in the Dark” at the top could be improved. I liked the video behind and I thought it looked like a real game menu.
What did you think of the HUD?
The HUD looked quite good I thought it was designed quite well and colours worked as it looked quite dark along with the game.
Is it easy to use?
It was easy to navigate through the menus although I thought the chapter select was a header saying which menu I was on as it was bigger than the rest.
What would you improve?
I would improve the title logo on the main menu as it looks a little plain.
Tester: Liam Thomas Smith
What did you think of the menu?
I think it’s good and I liked the video in the background.
What did you think of the HUD?
HUD is GOOD, I think it fit well with the game and I liked the bullet animation.
Is it easy to use?
It was easy to get to where I wanted but the Credits didn’t work.
What would you improve?
I would make the menu more interactive so you can use it with the keyboard and see how it feels to use.
Tester: Matthew Colin Hardiman
What did you think of the menu?
The menu was good but I didn’t like the video to much I think a still image would have been better to use or less animation in the background. It took my attention away from the menu more think that if there was less animation it would have looked a lot better. I think there should have been more animation in the options menu. The fire at the bottom right should have been animated as it looked a little bit boring as it was.
What did you think of the HUD?
The HUD was quite good it looked like it fit the game, the colours where a little bit out but it kept the dark style which I liked.
Is it easy to use?
It was easy to use but I think it could have been made easier to use and the profile could have been made easier to use.
What would you improve?
I would take away the video on the background and make the colours darker I think this would make it look a lot nicer.
Evaluation
Overall I went through a few changes. One was some feedback I got saying I should change the original Logo, simply because it was plain, it was just the same font. So for this I decided to take the original logo from the game as I think it is well designed. I then cut it up and rearranged it to fit along the top better. This looked a lot better and I am glad the tester informed that it looked a little boring. I decided to add a loading screen with a video also. I added a hint as most games including this one do as it gives you something to read whilst you are waiting to play the game, sometimes it is really informative and can help with game play.
Menu
![]()
![]()

The menu system makes it easy for you to navigate through your map, and options, you can also select the chapter you wish to play. I kept this style from the original and just redesigned the menu layout slightly instead of using icons used words.
I also decided to keep the eject idea as the game is set out to be like a film and I thought I would try and keep this whole idea. The original menu for the Xbox didn’t have a set menu for controls you had to find it through the options but I decided to give it a clear menu along with the options. The options also give the choice of resolution. This is only for the PC version and a quality menu which will remove anti-aliasing for slower machines
Health



The idea I got for the health came from Resident Evil I think it adds a really good horror style effect. When you die the health bar changes colour, it goes through 3 different changes:
Green – Good / Perfect
Yellow – Injured
Red – Bleeding / Dying
These let the user know of his current situation it is safe to be in yellow but you are still at risk of falling into red, in which case you will limp.
Weapon/Item Switching
The weapon switching is activated by using the left and right bumpers/triggers for the Xbox and Playstation versions and for the PC it is activated by “[“/ “]”
Profile
I also added a small profile extra so that you can change profiles instead of having saves and trying to remember which save file is which you can view on your profile how far you have got your name age completion how long you have spent on the game and bonuses found. You can also switch the profile at the bottom right and view the profile by clicking the name.