Game Interfaces, Take Two

Hey there, people. This is Alana, writing because Nick is in the midst of a punishing law school exam schedule, and I guess he’s being a baby about it or whatever. Sorry for the late update – this was supposed to be posted yesterday, but for some reason the post I wrote was eaten up by the Blogger monster and spat back out as nonsense text. What’s up with that?

So here’s the thing: I don’t know much about video games, and what I do know has pretty much been mined by my past posts on this blog. I didn’t want to do another post about Pokemon games I haven’t finished, so instead I thought I’d talk about something I do know about: interface design.

An interface is anything that stands in between a user and a function that allows them to interact. The dashboard of your car is the interface that allows you to control the engine. The dials on your stove are the interface that allow you to cook your food. Most of the time when we talk about interface design, however, we are talking about digital media. A start screen with instructions for controlling the game, for example, or a character designer, or absolutely anything on your screen that offers any interactive capability…these are all examples of interface design.

It is essential to good interface design that users be able to navigate quickly and intuitively with very little instruction on what to do. It needs to be incredibly clear when they are supposed to click something, for example. If it takes too long to figure out what to do, they become frustrated and no longer want to play. I thought it would be fun to look at some screen grabs from famous games and see if I, a person who has never played these games, can figure out from design alone what the interface is trying to tell me.  

1.       Classic paperdoll interface

The first thing I notice is that some sections are highlighted in gold. This stands out strongly against the gray background, and makes me think those sections must be important. One contains a figure. He might be the character you are playing as. He is surrounded by small squares with icons inside them. Some of the items seem brighter than others. Because they are highlighted, and because of the proximity to the figure, I think they might be items you have access to while playing. Some are just gradient colours, though, and I have no idea what they could mean. Along the right side is a section separated by a gold bar with a horizontal lineup of character faces. The one that is outlined in green is probably selected. I like the visual cue, but that green does not appear anywhere else in the design and seems out of place. The repetition of the gold suggests that the images along either side of the screen are important. The left shows gold icons. Because they are so bright, and separated from the information on the selected character, I assume they will not change if a different character is selected. It is difficult to tell what they might mean.  The only one that is immediately obvious to me is the compass. This is probably a map. To find out you may have to navigate to them and see a text pop-up or something. I find this inefficient. Going back to the centre panel, it is based on a grid, which is easy to look at, but there are big, empty spaces. Some sections have titles and others rely on icons. This is inconsistent. Overall, I think it’s fairly good. The sections are clearly defined and observation reveals much of the functionality (I think…I’d have to play with it to see if it works the way I think it does) but there are definitely aspects of the design that could be improved.
2.       Mass Effect

I don’t know which Mass Effect this is from. Sorry. What’s different about this screen is it is mid-gameplay. It is even more important that you be able to tell at a glance what to do, because you seem to be in a shooting match and therefore do not have time to be fussing around with mysterious navigation or overthinking icon meanings. The action is being framed by three panels: one on either side of the screen and one at the bottom. In the bottom left there is a list of names followed by red bars. The three names correspond to the presence of three characters, and the same names are repeated along the panels. This repetition tells me that they are related. The red bars seem likely to move. I know instinctively they represent player health, which is knowledge I bring from having seen similar games played before.  The red contrasts heavily with the green and blue tones of the design, which makes it stand out. That is a great choice, because player health is essential to the game. You don’t have to go searching for the information. In the bottom centre window there is the name Shepherd. Even without background information, I can guess that is your main character. The colour variations in the icons let me know which are selected, and the imagery is clear enough to tell me what thye likely mean, especially the guns. I also notice a circle on the bottom right corner that resembles a radar screen with a red dot. I immediately understand that it is pointing to an enemy location. Again this requires little to no conscious thought, which is perfect. Some of the icons in the left and right side panels, which are labeled with the other character names, are difficult for me to understand. The weapons are clear. The others may be telling me things about that character’s strengths or abilities. I am not sure. They require prior knowledge of the game. On the whole, however, I think this interface is very successful. It is easy to understand and does not pull focus from the action.

 

3.       World of Warcraft

I hate this. There is just a massive amount of visual information, and none of it makes sense. Everything is just thrown onto the screen, in a mass of clashing, conflicting colours, with no discernable care taken to guide the user through it at all. I can barely even tell what’s happening in the game behind the massive wall of meaningless icons, which are separate enough to suggest they represent different information, but too jammed together to make any logical sense. Some of the information is aligned in a grid, but then there is another grid that conflicts with that, and another, and then some circular navigation in the top right corner. This is an assault on the eyes. There is no hierarchy of information. An experienced user can probably tell at a glance what the game is telling him, but a new person would be totally overwhelmed.  This is terrible interface design. 
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s