High Performance Displays
- Jose Porto
- Leonardo Porto
Using High Performance Graphics Screens is a design approach that transforms traditional displays into more intuitive and intelligent information. Information is displayed in styles with simpler colors to facilitate human understanding of the current state of the system.
High Performance Screens
The high-performance approach achieves its goals by following several fundamental features, which are listed below.
Man-Centered Design
Careful selection of colors
Layered graphic hierarchy
Man-Centered Design
The main objective of this method of graphic screen design is to increase the effectiveness of data processing and analysis.
People can only handle a certain number of information at a time. According to ISA SP 18.2, operators of a monitoring system must face only about 10 alarms per hour to accurately respond to each alarm. However, the alarm rate is usually higher in the real world.
Man-Centric Design allows users to create smart designs with color settings that help the operator's eyes easily focus on situations that require more attention.
Below are detailed several proven results of the operator's performance of the High Performance HMI Handbook
Traditional HMI | High Performance HMI | Findings | |
Detecting abnormal situations before alarms occur | 1 in 10 occurrences | 5 out of 10 occurrences |
5x improvement |
Success rate in the treatment of abnormal situations | 70% | 96% | 37% improvement |
Time to complete hits in abnormal situations | 18.1 minutes | 10.6 minutes | 41% improvement |
Careful selection of colors
Even if the HMI app is a visual/graphical interface, you should not choose colors or shapes simply to have a stylish screen. The focus should be to facilitate understanding of the project.
Below is a set of recommended color conventions for HMI projects.
Alarms: Use bright, intense colors that are not used anywhere else on the screen.
Background: Use unsaturated colors (e.g.: Light gray) with minimal interference with other colors.
Static equipment: Use dark gray or black for process lines.
Equipment status: the color selection of the equipment state should depend on additional appearance features, such as Fill, Shape, or Text.
Common living data: Use less intense cold colors (e.g., dark blue and dark green). These colors should be easily distinguished from static information so that they do not distract the operator
The table below illustrates the recommended color palette for a high-performance HMI project.
Layered graphic hierarchy
Refers to the way data is structured in views throughout the project. The recommended organization method is a series of levels and sub-levels where each level is more detailed than the previous one.
Level 1: High-level information, such as a performance indication or events that require immediate attention.
Level 2: The viewfinder used by operators to perform their tasks.
Level 3: Displays the controls of each equipment, as well as the information and status of the equipment.
Level 4: The most detailed view that provides information about individual components and equipment.
Symbol Library
Symbols are graphical objects that contain a series of internal dynamics. They can be added to a view as a representation of tags. See also more details about symbols in Managing Images and Symbol Library.
Mapping Symbols to Runtime Objects
To map a symbol added to a runtime object, double-click the symbol to display its defined properties.
Even if symbols have different runtime properties, they can all have similar appearances (such as colors) according to the state they are in. In the example below, each symbol that is On, Open, Running, or Energized appears blank to indicate that the item is in a "running" state. Because everyone is in a similar state, each of them would be mapped to the Value "1".
Value = 0 // Off/De-energized/Idle/Stopped/Closed
Value = 1 // On/Energized/Running/Open
Value = 2 // Disabled/Out of ServiceThe values listed above follow the color convention pattern for HMI displays and the different colors that a symbol can display are illustrated in the image below.
Themes and colors of symbols
The appearance of a symbol can be customized by changing the object theme. In Run-Dictionaries-Themes, you'll find theme palettes that are predefined and integrated with project templates. The ItemName property that is related to HPG symbols appears on the mentioned screen.
The user can use this page to easily create new themes or edit pre-existing themes. The following images show some examples using different themes.
Alarm Indicator
This symbol acts as an indicator of the alarm status of a specific tag. It can display the priority level of the alarm (low, medium or high), and has 3 different possible color settings, depending on the status of the alarm state. See the image below.
The property AlarmPriorityEnum is used to animate the Alarm Indicator symbol. The Enum property has the following settings:
Low Priority (Alarm Priority = 0 - value in the Alarm Items table)
1 - Acknowledged
2 - Normalized
3 - Active
Medium Priority (Alarm Priority = 1 - value in the Alarm Items table)
4 - Acknowledged 5- Normalized
6 - Active
High Priority (Alarm Priority = 2 - value in the Alarm Items table)
7 - Acknowledged
8 - Normalized
9 - Active |
At run time, the Alarm Indicator can display the following behaviors:
Número em símbolo:
1: Prioridade alta (2)
2: Prioridade média (1)
3: Prioridade baixa (0)
Borda externa e elemento interno:
Borda estática e elemento piscando: Alarme está ativo
Borda estática e elemento estático: o alarme é confirmado
Sem borda e elemento piscando: Alarme está normalizado
Sem borda e sem elemento: Alarme não ativoThe following images demonstrate the appearance of the screen when an alarm is in an active state.
On this page: