Page 1 of 1

About GUIs.

Posted: Wed Dec 07, 2011 8:40 am
by Aka-kami
So, let's talk about GUIs..

What do you think defines a good GUI? What buttons should be added or removed? How much of the screen should be taken up by the text box? stuff like that.

Other than the good, what do you think makes a bad GUI?

I'd like you guys to discuss this 8D

Re: About GUIs.

Posted: Wed Dec 07, 2011 10:21 am
by leon
Here's my 2 cents:

Keep it simplistic (doesn’t necessarily mean minimalist) and think of functionality first.

Things like how much of the screen should be taken up by the text box, really depend on many factors, such as resolution, transparency of the text box and your overall style.
Aka-kami wrote:What do you think defines a good GUI? What buttons should be added or removed?
“It seems that perfection is reached not when there is nothing left to add, but when there is nothing left to take away.”
Antoine de Saint-Exupéry,

Re: About GUIs.

Posted: Wed Dec 07, 2011 10:32 am
by herenvardo
Here is what I can share from some years of experience with this topic, and it's not limited to games or Ren'Py but applies to all kinds of GUIs:
  1. A GUI should be as intuitive and self-discoverable as possible. In other words, the user should be able to understand what each widget is for, and which widget/element is the appropriate one to achieve something. Tooltips and similar mechanisms can help a lot with this, but overdoing it can add too much clutter to the GUI.
  2. A GUI should be space-efficient: it should use as much space as needed to achieve 1), but not more.
  3. A good GUI must be responsive: whenever the user takes an action, they should see the program's reaction (or a proper indication that something has happened) almost immediately. For example, when an option from a radio-group is selected, it should be clearly distinguishable (if you look at the default themes included with Ren'Py, you may see some failing at this with nearly undistinguishable colors for selected and idle widgets). Also, if some action involves a long process (unlikely in Ren'py games, but may happen on other games and GUIs), an indication should be given that the program is working and not just "frozen" (for example, if a 3D game has to load a scene with hundreds of meshes and thousands of polygons, a loading screen with a progress bar is very appropriate).
  4. A good GUI needs to be consistent: if two widgets are used for similar tasks, they should look similar. Sometimes this means sacrificing a bit of space-efficiency (like making all the buttons in a column equally wide even when only one of them needs the full width), but it will make the GUI slightly more intuitive, so it's a good trade.
In order to achieve 1) and 2) together, you need to know your audience: there is stuff that would be obvious for some users, yet obscure an unclear for others. To make a good GUI, you need to find a baseline of knowledge about the relevant topics (what your GUI will expect the users to already know), and provide a separate source of information for those users that are below the baseline ("readme" and help files are excellent tools for this).

These are just the most basic foundations, there are lots of tiny details here and there that are normally learnt with experience and feedback. Let me emphasize a bit further the mention on feedback: the term GUI stands for Graphical User Interface; the opinions from users should have some weight.