Reducing HMI screen design time to increase productivity

As technology has evolved, so has the ability to create faster graphical interface with equipment. However, one component of that interface that may have been left behind is screen design.

A recent white paper by Schneider Electric suggests there are now ways to reduce the time it takes programmers to design effective HMI screens that still promote flexibility of use and better interface with the machines they are interacting with.

Before the advent of screen design software, it used to take a significant amount of programming knowledge and skill to design an HMI screen that was both effective and user-friendly. However, that changed when screen tags came of age allowing programmers to use special commands to somewhat speed up the ability to set up screens, but it was still cumbersome and required a good amount of effort and ability.

With Windows™, HMI screen design was able to change more fluidly and with even more ease than before. It eliminated the need to use screen tags, but other components such as part placement and attribute changing were still part of the process, making HMI design just as time-consuming as before.

But, as with many things technology-driven, today has brought about a new ability to simplify the process of screen design by automating and, in some cases, eliminating, most steps so that the process becomes simpler and less of an inefficient process. In the table below, Schneider Electric outlines the evolution of HMI design over the years:

In Schneider’s study, they found that the number of base screens on a large HMI can number more than 500 and the number of parts per screen can exceed 100 making the time spent on designing an HMI screen seem a bit excessive.

They found that more than 70 percent of HMI designers are still using scripts to design and that the “pain points” for customers in HMI design was developing customized features by 41 percent. Additionally, cost reduction is no longer the main motivator for

product differentiation. Because new technology has brought smartphones and tablets into the marketplace, customers are demanding better usability and performance/throughput as their primary important factors.

Before, to create HMI design, you drew parts on base screens and the resolution on those base screens needed to match the resolution on the HMI. You have absolute values (X and Y coordinates) that work against the screen resolution. This means, if you want to change any screen data on another unit with a different resolution, you would have to readjust the position of every part. You also could not simply change the position of the parts on the original screen, which means you wouldn’t have a lot of freedom to change the layout the way you want to.

But now that has changed. HMI 4.0 allows screen design different from the base screen that has no dependence on the base screen.

You can now use a grid layout with rows and columns like a table. If you draw a part on the screen, you drop the part into a cell and the part automatically sizes to the cell area. The size of the rows and columns are relative to the screen resolution. That means, if the screen resolution changes, the rows and columns will change accordingly.

You can also use the grid layout for a portion of the screen with a layout frame, meaning you can reuse content that you can resize at will.

Using a grid layout also means commands such as Align Left or Distribute Evenly are not necessary as the screens don’t require those finely tuned adjustments as before. This means less time drawing different parts on the screen.

Another benefit of using HMI 4.0 is the fact that the layout can also include cells within cells. You can increase the complexity of your screen by placing a grid within one or more cells or even combining cells within each other. Now, layouts can be more robust and screens can be reused without taking more and more of the programmer’s time and effort.

Templates

Another function that HMI 4.0 has made easier in terms of screen design is the use of templates. Theme templates allow programmers to choose the look and feel of the overall screen they want. Flexibility allows for changes even after the HMI design is complete so that adjustments made won’t change the overall design of the HMI.

Schneider noted that theme and color set templates allow for faster design of screens and the creation of unified screens with less effort. Themes can also allow programmers to change default values of part attributes and register that attribute for use in other parts. Set the font size for one part and set it as the default for that part. From there, you can select that default for that particular part without programming each individual part.

One more issue fixed with HMI 4.0 is screen structure. Now, instead of reviewing and editing the settings for all change screen switches, using navigation templates allows users and programmers to automatically configure screen changes.

Screen change menus are set up in navigation templates and screen numbers for screen changes are set up automatically, based on the screen structure set up. Programmers and users can replace the template to change the appearance of the menu and the screen structure doesn’t change. This means the user or programmer doesn’t’ have to review all of the screen settings.

What does all of this mean?

Simple. By employing elements of HMI 4.0, users and programmers can drastically cut down the amount of time spent programming screens and can focus on functionality of those screens to maximize usability of HMI screens.

Information contained in this post came from Schneider Electric’s white paper entitled Simplifying and Speeding Up HMI Screen Design is Finally a Reality: Leading the Way in HMI Design 4.0.