Graphical Interface Design

Question

I have the following problem: Although I know some of color theory, and the interface design ideals (about how it must be usable, and etc...), my interfaces are REALLY ugly. fugly, eye bleed material, etc...

I am not finding anywhere, information on how to create the graphical part of a interface, how to choose the layout, objects, colours, cursor, etc...

I am doing now most by copying other games, or by "feeling", something that does not always work correctly...

So, what I need to know about it? Where I find it? How I do it?

Answer 1

Unfortunately, there are no real interface design standards in the game industry, which makes it difficult to find accurate information this topic. If game interface design is something you're seriously interested in, I would take the following steps:

• Learn as much as you can about interaction design patterns - A lot of the research done on design patterns doesn't directly relate to video games or software for that matter, but if you look hard enough, you'll find that there are a lot of parallels.
• Learn general computer UI theory - When is a text box better than a drop-down/combo-box? What are the strengths and weaknesses of each?
• Learn from the successes and failures of others - Look at, and dissect as many UIs as you can (and don't limit yourself just to games!). Go through each UI element, analyzing how and why the component behaves that way. For example:
  • In an FPS, why does the reticle expand when the player shoots? Why does it contract when you crouch or prone?
  • In a fighting game, when a player takes damage, why does their health bar deplete immediately, instead of fading over time?
  • In a RTS, what is the purpose of the minimap?
  • In any game, how do you know if you're winning/losing?
  • What steps does the player have to go through to start a new game, load a saved game, change the options, exit the game, etc.? Could this process be simplified?
• Practice, practice, practice! - Once you feel like you have a good understanding of what UIs are out there, and how they're composed, try your hand at creating UIs again. Remember to always analyze your work, in addition to having others critique it, from time to time.

I haven't run across any particularly good game UI reading material, but below are a few interaction design books I highly recommend looking into:

• Don't Make Me Think: A Common Sense Approach to Web Usability, 2nd Edition
• The Design of Everyday Things
• The Design of Future Things
• Universal Principles of Design

Answer 2

General purpose computer interface design techniques may be more helpful than game-specific ones. Computer interface design can be split into two parts, the aesthetics and the usability. However, it is important remember that the two are related, similar to the coloring/shading on a piece of art, and the composition/lineart.

For usability, consider things such as Fitt's Law to determine appropriate sizes for UI elements. Fitt's Law implies that objects in the corners of the screen are the easiest to hit. That only applies to mouse-based interaction though, which provides resistance on the edges of the screen.

As for aesthetics, consider basic principles of design, such as composition, and the "weight" attributed to things of different colors and shapes. Color theory will help you, as well as keeping in mind that the apparent color of an object is altered by the color of the things around it. Also consider other elements and principles of design.

When analyzing the UI of other games, take these basic elements into account. Where does your eye go first? How does it move though the interface? Understand what draws your attention and why as opposed to just copying the UI of another game.

Like others have said, design is an art, not a science. If you don't have the feel for it, perhaps it is not for you. Technical people tend to have a good sense of composition though, so not all is lost.