HMI layout and correct display size

Before we start designing the layout for our visualization, it is important to have a clear idea of how much information we want to display and which graphic elements should be used to display this information. It's also crucial to consider the purpose of the visualization and how complex the system or the part of the system that we want to visualize is.

The correct display size is not just about aesthetics but, more importantly, about functionality and ergonomics. So, what needs to be considered when choosing the right display size?

Displayed text: The text on the display must be large enough to be easily readable (even for older people with weaker eyesight).

Buttons: In the case of a touchscreen display, the buttons must be large enough to be easily pressed with a finger. Additionally, there should be enough space between buttons to avoid accidental pressing of adjacent ones.

Grouping of information: Certain information must be displayed together on the same screen. The operator should not have to constantly switch between different screens to compare data or get an overview of multiple related parameters.

Use of graphical elements: Graphical elements, such as images or graphs, help to improve clarity and the overall comprehension of the visualization. Therefore, it is important to allocate enough space for these visual elements.

Logical division and clarity: The screen should not feel cluttered or overwhelming. Adequate space between logical blocks serves as an effective separator.

Although SVG (Scalable Vector Graphics) technology makes it possible to create visualizations that adapt to different screen sizes and resolutions, it is better to design the layout for a specific size and resolution of the display on which the visualization will be used. The idea of a universal layout for all screens leads to undesirable compromises when displaying on screens that are either smaller or larger or have a different format than the screen for which the layout was optimally designed.

From the start of development, it's beneficial to know which specific display model the visualization will be shown on because developing and testing on the actual device provides invaluable insights. This way, you can evaluate how user-friendly the device is, how it responds to touch, its performance, color accuracy, and whether it is bright enough for the intended operating conditions.

See more on www.radim-automation.com