While designing an interface, the key factor is understanding the expected user. Is your application a general-purpose program that could be used by anyone in the population? Or, is it targeted for a specific category of users, such as doctors, who will be expected to know certain things about the program?
The user case can help determine how to best layout a GUI, what information to include on different screens, and even what type of interaction device will be used, such as a mouse pointer versus a fingertip. In the case of the doctor example, we may decide that the doctors will use the GUI on a tablet, so their fingers will be the main way to interact with the interface. Thus, buttons should be larger and spread apart more than a desktop computer, so their fingers can easily touch them.
In addition, a patient's information should probably be displayed on the home page, and reference material or other, non-critical information on secondary pages. Of course, it is recommended to talk to doctors first, and during development, to ensure that the final product meets their needs.
Regardless of the user, the following are some common design criteria to consider:
- Keep the interface simple. Avoid unnecessary elements and use clear and concise words in labels and messages.
- Use a common theme. Whenever possible, use the same widgets as the underlying OS, so the user doesn't have to guess what a particular widget does. For custom schemes, ensure a particular widget does the same thing every time, regardless of where it is implemented. For example, a clock icon should only pop up a calendar, or be used to insert the current date/time, but not allow different actions while using the same icon. Having different actions means the user never knows exactly what to expect when clicking on the icon.
- Consider spatial relationships. Like newspapers, non-information helps in getting the message across; in other words, white space is important. Don't clutter the interface with too much information, but also don't spread data needlessly around the interface. Consider where the most important information should be placed, and learn where people are apt to look first and where their eyes will scan to.
- Keep the user up to date. Notify the user whenever important events occur, such as saving documents, errors, and so on. Ensure that the user knows where they are within the interface and, at a minimum, how to get to the "home page". Provide tooltips to assist in learning about elements and, when using pop-up windows, determine whether the information is important enough to justify a modal dialog box.
- Consider default values. Anticipate the most common actions of users, and create default settings that account for them. If there are settings and configurations required for your application, attempt to preconfigure them so that a user could just accept the defaults and have an acceptable output.
- Use color and texture to aid in information retrieval. Not only color but also contrast and texture can be used to highlight information. There are a number of websites and books available that discuss the making of a color-blind-friendly interface; in addition to helping color-blind users, these changes can help others by quickly showcasing different information. Also, be wary of the trend toward minimalist, low-contrast GUIs that have minimal contrast between colors (like varying shades of gray) and rely on sans serif fonts, which can be hard for some people to read. The Nielson-Norman Group (https://www.nngroup.com/articles/low-contrast/) provides a good example and explanation of this.
- Use typography to showcase important information. Following on from the previous bullet, the type and size of the font used can clarify the information. For example, the following screenshot is a slide from a NASA report about the Space Shuttle Columbia explosion. What information is most important? In the following screenshot, some of the most critical information, such as Test results do show that it is possible at sufficient mass and velocity as well as Volume of ramp is 1920cu in vs 3 cu in for test, are not highlighted in any manner, even though they are probably the most critical elements of the slide. They have the same, or less, priority of information on the slide as any other bullet point.
The following screenshot is an example of identifying importance:
