Interface style design
The console's human-machine interface uses a non-standard Windows style to meet users' personalized requirements. However, considering that most users are familiar with the standard Windows system, the dialog boxes, edit boxes, combo boxes, etc. used in the interface all use standard Windows controls, and the buttons in the dialog boxes also use standard buttons.
The default color of the form is light gray. Gray is easily distinguishable under different lighting conditions and avoids inconvenience for colorblind users. To differentiate between input and output, the input area uses white as the background color, making it easy for users to see that this is the active area of the form; the display area is set to gray (or the form color) to indicate to the user that it is a non-editable area. All controls in the form are arranged left-aligned according to Windows interface design standards.
Interface Layout
The layout design of a human-machine interface (HMI) should achieve simplicity, balance, and stylistic consistency according to ergonomic requirements. A typical industrial control interface consists of three parts: a title menu, a graphical display area, and buttons. Following the principle of consistency, all objects on the screen, such as windows, buttons, and menus, should maintain a consistent style. The size, embossing, and font of buttons at all levels should be consistent, and the button colors should match the background color of the interface.
Structural system
Users can only process a limited amount of information at a time, so a simple and permanent structure should be chosen so that operators can quickly understand how to open the interface.
To provide sufficient information while maintaining a concise interface, the design employs a hierarchical and layered layout for controls. Hierarchical arrangement means dividing controls into multiple groups based on function, with each group further subdivided into multiple levels according to their logical relationships. Using a first-level button to control the pop-up and hiding of second-level buttons ensures the interface's simplicity. Layering involves vertically expanding buttons of different levels into different areas with clear boundaries between them. Using a button to pop up a lower-level button hides other buttons at the same level, making the logical relationships clearer.
Typically, it consists of three layers. Layer 1 is the overview interface: This layer contains information about the different system components displayed within the system, and how these system components work together. Layer 2 is the process interface: This layer contains detailed information about a specified process component and displays which device object belongs to that process component. This layer also displays the device object corresponding to an alarm. Layer 3 is the detail interface: This layer provides information about individual device objects, such as controllers, control valves, control motors, etc., and displays messages, status, and process values.
Text Applications
All text in the console software interface uses the Chinese Song typeface, and the font size is adjusted to match the size of the controls, using two different font sizes to ensure clear display and consistent style.
Ergonomics requires concise text in the interface, using affirmative sentences and active voice as much as possible, and avoiding abbreviations for English words. The text used in the console HMI falls into two categories: label text and interactive text. Label text is written on controls such as buttons, indicating their functions, so it uses verbs describing operations such as "set operation" and "system settings." Interactive text is the text used for interaction between humans and the computer, as well as between the computer and the main control console, including input and output text. To ensure conciseness and clarity, interactive text uses familiar sentences and polite expressions such as "Please check AC voltage" and "System warning device locked." For large amounts of information, vertical scrolling is used instead of horizontal scrolling, as this is more in line with human operating habits.
Color selection
Color selection is also crucial in human-computer interface design. The human eye reacts to color faster than to text, so using color to distinguish different information is more effective than using text. Different colors evoke different physiological and psychological sensations, so the appropriateness of color selection also affects the operator's work efficiency. Different colors have different effects in specific areas. For example, foreground colors should be brighter for easy user identification, while background colors should be darker to avoid eye strain. Therefore, bright colors such as red, yellow, and grass green should not be used for backgrounds. Blue and gray are colors to which the human eye is less sensitive; their sensitivity is the same whether in the center or at the edge of the visual field, making them very suitable as background colors for human-computer interfaces. However, blue is not easily perceived in small areas, while red and yellow are very eye-catching. Therefore, red and yellow are suitable for signs indicating prompts and warnings.
Several points should be noted when using colors:
(1) Limit the number of colors displayed at the same time. Generally, no more than 4 or 5 colors should be displayed on the same screen.
(2) Active objects in the interface should be brightly colored, while inactive objects should be muted. Neutral colors (such as light gray) are often the best background colors.
(3) Avoid putting incompatible colors together (such as yellow and blue, red and green, etc.).
Graphics Applications
Graphics and icons can convey information more vividly than text. The console's human-computer interface uses visualization technology to convert various data into graphics and images displayed in the graphic area. When selecting icons, simplicity and standardization are prioritized, with a focus on using standardized graphics and icons that have already been created and are widely accepted.
