This semester I attended “User Interface Design”, a class that encouraged us to think critically about the ways in which people interact with systems. While the course work naturally focused on software interfaces, the principles of good UI design are universal. Whether you’re creating a website, a toaster, a lamp or a door handle, intuitive design relies on understanding human psychology.
In my ongoing quest to contextualize everything I learn in terms of video games, I’d like to explore how the principles of user interface design might be applied to make games more accessible.
In his book The Design of Everyday Things, Donald Norman defines three principles of control design:
- Visibility: It Should Be Obvious What a Control Is Used For.
If I press this button, what will happen? If I want to unlock the door, which control should I use? A system with good visibility allows the user to easily translate goals into actions. - Affordance: It Should Be Obvious How a Control Is Used.
The system should provide “strong clues to the operation of things”. A button affords pushing, a lever affords pulling, etc. The user should know how to operate a control just by looking at it. - Feedback: It Should Be Obvious When a Control Has Been Used.
Once the user has pressed a button, the system should react in a manner that clearly communicates what has just been accomplished. If nothing has happened, this fact should also be obvious.
By following these principles, we can create systems where “the relationships between the user’s goals, the required actions, and the results are sensible, meaningful and not arbitrary.”
These principles can be applied to at least two layers of interaction in video games: the interface between the player and his/her agency in the game (usually an avatar) and the interface between the avatar and the game world. While a lot can be said about the latter1, I’d like to explore two ways in which these three UI principles can be applied to a game’s physical interface.
Visibility for Controllers
Because controllers are designed to support a wide range of games, their buttons cannot usually be labelled according to the functionality that they provide. Instead, buttons are labelled according to letters, numbers and symbols, and the game must provide additional documentation that translates A to “Jump” and R1 to “Shoot”. This violates the principle of visibility, and is a source of considerable frustration for inexperienced gamers.
However, some games use clever tricks to get around this problem. The Legend of Zelda series and Beyond Good & Evil, for instance, facilitate the translation by integrating the documentation right into the player’s heads-up display. Since the buttons cannot be physically relabelled, they are instead relabelled on screen. Not only does this improve visibility by mapping game functions directly to buttons, it also removes ambiguity for context-sensitive actions.
Eric Swain also pointed out the following about controls in Beyond Good & Evil:
It has a simple set of unified controls that transition from one mode to another. From this point of view, the R2 button is not the run button, but the move faster button. The hovercraft and the spaceship both use the same buttons to maneuver as Jade does on foot. On the PS2, the X button will always be action, the O button will always be item and the Square button will always be attack.
By using these kinds of labelling techniques, game designers can compensate for generic controller design and provide consistent visibility.
New Affordances
While traditional controllers have inherent visibility issues, the next generation of interfaces may circumvent the problem by harnessing new affordances. Touch screens and motion controls can actually improve visibility by reducing the representational gap between player action and game agency.
Consider a baseball game on the Wii: the player’s goal is for their avatar to swing at a ball. A motion controller affords physically imitating the desired action. Similarly, the touch screens found on the iPhone and Nintendo DS afford pressing directly on the object that the player wants to manipulate.
In both of these cases, “how the control is used” is conceptually very close to “what the control is used for”. There is effectively no translation or thought required between “what” and “how”. Therefore, the nature of the affordance provides visibility. I believe that this interface quality goes a long way in explaining the success of these consoles with non-traditional audiences.
To many people, video games are user-unfriendly software. Improving the UI design by applying proven principles will hopefully go a long way in opening up the medium to new audiences.
1 For instance, check out Iroquois Pliskin’s great post on affordance in puzzle design.
April 12th, 2009 at 3:26 pm
Fantastic! The more people that discuss DoET in the context of games, the better.
April 13th, 2009 at 4:16 pm
Hey Matt this is a good article. I think your point that the success of the Nintendo platforms stems from the userfriendliness of their hardware design is a great one. (When this really works– like with Boom Blox or Wii Sports– you get an instant sense of the connection between your movements and the game happening onscreen. )
On the other hand, I got stuck on this one puzzle in Phantom Hourglass because I had no idea the physical DS affords closing as a gameplay mechanic. Boo-urns for that one.
April 13th, 2009 at 9:57 pm
You two have both recommended DoET in the past, so I’m glad you approve of this post!
@Iroquois: Likewise figuring out that you had to blow out the candles with the DS microphone, ugh.
April 15th, 2009 at 6:11 am
Here’s a fun thought: unlike most software products, games derive their value from making it difficult to do a particular action. There’s still relatively little understanding about what actions should be intentionally obfuscated, becoming gameplay, and what should not — but it explains the reaction of players who complain that gameplay is being removed when an interface obfuscation from a game is removed in its sequel.
April 15th, 2009 at 8:09 am
Yeah, that’s a problematic one. I think Another Code was the first game to do this, although it’s a bit more obvious – you have a stamp on the top screen, paper on the bottom screen, and you have to transfer one to the other. The hinge affords the physical action you’d like to do – but ingrained behaviour tells us that will just send the DS to sleep. (Actually, I think it DOES send the DS to sleep – and if the DS wakes from sleep at this point, it registers as the puzzle being solved.
The new challenges are finding afforded-but-obvious interactions that aren’t hackneyed. I am fed up of using the microphone to blow out fire, but whistling for a cab in Chinatown Wars, or applauding somebody – these are at least creative uses of a sensible affordance.
The problem with the new kinds of input is limited, or restricted, thinking around what they’re capable of. Microphones, for instance, register more than just speech or even sound, and you can do interesting stuff with them if you think laterally.
April 15th, 2009 at 10:51 am
When the microphone is used in limited ways (Brain Age uses it properly – speech recognition, but limited on a handheld!) there is a problem.
I’m happy reading this but there was no mention of the keyboard/mouse combo on PC’s – there is some inherent known functionality there (ie; move the mouse, something on the screen will move or your viewpoint will, click and an action will occur) but unlike most PC interface design, the keyboard is a difficult one. At least it is pretty standardised for movement to be WASD (I remember when it used to be the arrow keys :) ).
The UI also isn’t very easy to show keyboard buttons on – a keyboard is huge, so even on a config menu it’s cumbersome to show all of it.
At least the mouse (and by extension wii remote) are pretty intuitive.
April 16th, 2009 at 1:52 pm
You showed some of the opening scenes from Braid above, and they’re definitely a good example of usability. I found it really exciting that the game never actually tells you about the time reversal mechanic, but still teaches it well enough for it to function as the core element of every puzzle in the game.
You might have already seen this, but the artist behind Braid posted a series of articles explaining the process behind its design. One of the things he discusses (starting in part 3) is how to create art which makes the world interesting without obfuscating it.
http://www.davidhellman.net/blog/the-art-of-braid-index/
April 16th, 2009 at 5:22 pm
Hi Matt,
Great thoughts on interface design. It inspired me to write a response to both your article, and Iroquois’s article here:
http://www.artfulgamer.com/2009/04/16/re-thinking-interface-design/
April 16th, 2009 at 6:17 pm
@Merus: There’s absolutely a point where games diverge from software, and UI principles cease to apply. “Challenging” is always a bad thing in software, for instance.
@Tom: I know Electroplankton had some neat voice recording/modulation effects.
@Andrew: I wasn’t intentionally slighting PC gamers, my first draft just looked silly with “controllers and keyboards” everywhere. A designer should definitely take the nature of the UI inputs into consideration.
@Henk: That looks like a fascinating series, I’ve bookmarked it for after finals. Thanks!
@Chris: Thanks Chris, I’m glad you enjoyed it.
April 16th, 2009 at 5:23 pm
[…] Matthew Gallant posted an interesting commentary that confronts video game interfaces with Donald Norman’s ubiquitous book on design, The Design of Everyday Things. There is some sense in the three design principles that Norman distils from his analyses of well-designed everyday objects, and Matthew has done a wonderful job of translating them for game designers. […]
April 18th, 2009 at 9:55 pm
Have you played another Trace Memory/Another Code? There was a section I was stuck on for days, where you’re staring at a piece of paper and you need to interact with it in some manner to move on. I discovered (accidentally) that you needed to close the DS and reopen it, as your character has a rubber stamp in her inventory (representative action). At first I was really pissed, but then I came to realize it was the first adventure game in decades to add something to my task vocabulary. Normally it’s point, click, press left… this game gave me a slap in the face and made me reconsider how I approached the hardware.
I think a lot of gamers would argue that as a negative, but (as frustrating as it was) I think anything that contributes a new mechanic like that is pretty neat.
April 18th, 2009 at 10:19 pm
@thesimplicity: I picked up a copy from a bargain bin not too long ago, but I haven’t had a chance to check it out yet.
I think using nontraditional input mechanisms in an adventure/puzzle game is somewhat legitimate. By nature, you’re expected to think laterally to solve puzzles, and solutions rarely repeat.
By contrast, action games like Zelda are usually built on a small set of repeated consistent mechanics. The puzzles are challenging, but must build on existing rules in a logical way.