Operator interface graphics 101

Graphics on an operator interface can range from very simple to extremely complex, so when creating them there are a few tips you should keep in mind.

03/18/2014


Most automation and process control projects provide an operator interface presenting the current state of the system. These can range from the very simple to the extremely complex. The one aspect that they exhibit—perceived or real—is a reflection of the total job quality. The quality of the graphics will certainly leave a lasting impression; after all they are in the operators view every day.

Developing a guide on how to create graphics would fill volumes. Add to that, some customers have standards on how graphics are to be done (adhere to these religiously, especially when you don’t agree with them). However, there are some design points that go a long way in making your graphical screens look polished.

To be honest, these are items that are also pet peeve’s when I review graphics.

Lines

Lines should be horizontal or vertical. Angled lines must appear intentional. Nothing looks worse than a line that has a slight ‘jog’ in it.

When lines are being used to represent process piping, lines meet to represent a ‘Tee’ as well as touch the equipment to indicate connection. Pipes in reality do not just hang in the air.

There are two basic choices when using lines: straight lines and poly-lines. The use of which has occasionally been a point of contention between designers. In the end, the only thing that really matters is consistency and construction. If you’re using line segments then once again, they must meet.

Colors

The color of screen items have meaning, this should be uniform throughout the system. Nothing is more disconcerting when the meaning of screen color changes when “Phase 2” is implemented for the same process element. For example, if water is blue on most of the graphics it should be blue on all of the graphics.

Valves

Valves are typically shown on process graphics as a “bowtie.” The bowtie needs to be centered on the pipe/line. The line representing the process piping is not to be visible behind the bowtie.

Text

There are more “do’s” and “don’t’s” for text than can be listed. We’ll just hit some highlights.

First off, it must be accurate (sounds simple, doesn’t it?). After accuracy, the rest is aesthetic. Align text appropriately (don’t assume that center alignment is appropriate for all cases). Pick one or two fonts and stick with them. By all means, do not change font size by dragging the sizing handles; some systems treat text as a drawing object and yield uneven results. Change text size by adjusting the font point size.

3-D and animated items

These items look great in the brochure. However, the excessive use of these types of items is distracting or consumes needless screen space. When you throw in animated pipes, fans, motors, and other gizmos the screen can be a “flashy” place—and not in a good way.

Screens need to provide a quick reference of information. Flashing and moving items catch your eye. Therefore, keep them for important things, such as alarms.

Location

To quote a realtor, “Location, Location, Location.” A screen needs to be developed around the center point. That doesn’t mean that the main equipment or device is in the center, but the screen is balanced around that point. Allowing the operator to focus their attention on the center allows for smoother screen to screen transitions.

While developing the focal point around the center of the screen there are elements that are consistent from screen to screen—such as menus and banners. It is extremely important that these are in the same location. Otherwise, screen to screen changes look like a bad 1920’s cartoon.

Spacing

Like location, this is somewhat subjective, but needs to be considered. Similar or related elements need to be evenly spaced. Nothing looks worse than seeing valves and the associated tag name haphazardly spaced and scattered around a screen. Fields also need to be consistent so that they appear more grid-like.

Navigation

The only thing to be said here is that the navigation must work and take the operator to the indicated. While seemingly self-evident a broken navigation pick is a major annoyance.

Plan for the future

It is important to leave graphics that are easily maintained. There are a couple of things that most systems provide, like Grid and Snap, which allow for rapid development and ease in modification. These also help with most of the points mentioned above. These are provided in so many systems for a reason. Use them. You might not be the developer who does the next phase or modifications, but then again you might.

In the end, none of these points will lead to a perfect system. Careful planning, layout, and execution will lead to a successful implementation. These points just make the system you deliver look professional and a cut above. Despite all of the wonderful, technical wizardry that you developed in the background, this is the lasting, visible impression you leave.

Final Note: For those who think that these items are just random points, think again. The author just spent several months cleaning up graphics and controls systems that are directly related to the points raised.

This post was written by Jeff Monforton. Jeff is a Senior Engineer at MAVERICK Technologies, a leading automation solutions provider offering industrial automation, strategic manufacturing, and enterprise integration services for the process industries. MAVERICK delivers expertise and consulting in a wide variety of areas including industrial automation controls, distributed control systems, manufacturing execution systems, operational strategy, business process optimization and more. 



Francisco , NJ, United States, 05/01/14 05:19 PM:

How do you see the advent of other development environments, in particular Visual Studio .NET as a way to develop custom HMIs, SCADAS?
Thanks
The Top Plant program honors outstanding manufacturing facilities in North America. View the 2013 Top Plant.
The Product of the Year program recognizes products newly released in the manufacturing industries.
The Engineering Leaders Under 40 program identifies and gives recognition to young engineers who...
The true cost of lubrication: Three keys to consider when evaluating oils; Plant Engineering Lubrication Guide; 11 ways to protect bearing assets; Is lubrication part of your KPIs?
Contract maintenance: 5 ways to keep things humming while keeping an eye on costs; Pneumatic systems; Energy monitoring; The sixth 'S' is safety
Transport your data: Supply chain information critical to operational excellence; High-voltage faults; Portable cooling; Safety automation isn't automatic
Case Study Database

Case Study Database

Get more exposure for your case study by uploading it to the Plant Engineering case study database, where end-users can identify relevant solutions and explore what the experts are doing to effectively implement a variety of technology and productivity related projects.

These case studies provide examples of how knowledgeable solution providers have used technology, processes and people to create effective and successful implementations in real-world situations. Case studies can be completed by filling out a simple online form where you can outline the project title, abstract, and full story in 1500 words or less; upload photos, videos and a logo.

Click here to visit the Case Study Database and upload your case study.

Maintaining low data center PUE; Using eco mode in UPS systems; Commissioning electrical and power systems; Exploring dc power distribution alternatives
Synchronizing industrial Ethernet networks; Selecting protocol conversion gateways; Integrating HMIs with PLCs and PACs
Why manufacturers need to see energy in a different light: Current approaches to energy management yield quick savings, but leave plant managers searching for ways of improving on those early gains.

Annual Salary Survey

Participate in the 2013 Salary Survey

In a year when manufacturing continued to lead the economic rebound, it makes sense that plant manager bonuses rebounded. Plant Engineering’s annual Salary Survey shows both wages and bonuses rose in 2012 after a retreat the year before.

Average salary across all job titles for plant floor management rose 3.5% to $95,446, and bonus compensation jumped to $15,162, a 4.2% increase from the 2010 level and double the 2011 total, which showed a sharp drop in bonus.

2012 Salary Survey Analysis

2012 Salary Survey Results

Maintenance and reliability tips and best practices from the maintenance and reliability coaches at Allied Reliability Group.
The One Voice for Manufacturing blog reports on federal public policy issues impacting the manufacturing sector. One Voice is a joint effort by the National Tooling and Machining...
The Society for Maintenance and Reliability Professionals an organization devoted...
Join this ongoing discussion of machine guarding topics, including solutions assessments, regulatory compliance, gap analysis...
IMS Research, recently acquired by IHS Inc., is a leading independent supplier of market research and consultancy to the global electronics industry.
Maintenance is not optional in manufacturing. It’s a profit center, driving productivity and uptime while reducing overall repair costs.
The Lachance on CMMS blog is about current maintenance topics. Blogger Paul Lachance is president and chief technology officer for Smartware Group.