Build a template with a permanent header, navigation and alarm line so every screen behaves identically. Keep a shallow hierarchy: overview, area, detail, with any detail screen two touches away. Use a calm grey background, reserve saturated colour for abnormal states, and never rely on colour alone to carry meaning.
- Everything permanent goes on the template, so a change is made once instead of on forty screens.
- Colour is a scarce resource; if the healthy plant is already colourful, an alarm has nowhere to stand out.
- Design for a gloved hand and a bright shop floor, not for a desk monitor.
Templates and Screen Structure
In TIA Portal, a screen template holds objects that appear on every screen assigned to it. Build it before you build any process screen.
| Zone | Contents | Why on the template |
|---|---|---|
| Header | Machine name, date and time, logged-in user, active mode | Identical position everywhere |
| Alarm line | Single-line alarm view showing the highest priority message | Visible from every screen |
| Navigation | Buttons to overview, alarms, trends, recipes, settings | One change updates all screens |
| Status strip | Communication status, running state, cycle counter | Constant reference |
| Work area | The process content of each screen | The only region that changes |
Keep the work area a fixed size and position across all screens. When the content region shifts by twenty pixels between screens, everything looks unstable and operators lose their place.
Panel resolution decides the layout, so fix the panel model early. Redesigning a 7-inch layout for a 15-inch panel late in a project is a rebuild, not a resize.
Navigation and Screen Hierarchy
Structure screens by how an operator thinks, not by how the project tree is organised.
- Overview: the whole machine or line on one screen, showing state at a glance.
- Area or unit screens: one per section, with the devices in that section.
- Detail screens and faceplates: a single device, its commands, status and parameters.
- Function screens: alarms, trends, recipes, reports, settings, reached from the permanent navigation.
Aim for any detail screen within two touches of the overview. Deep menus are where operators give up and call maintenance instead.
Faceplates
Build a faceplate for each device type: motor, valve, analog loop. Configure it once with its commands, status, interlock display and parameters, then place instances. Twenty motors then share one design, and improving the faceplate improves all twenty.
Open faceplates as a pop-up over the current screen rather than navigating away, so the operator keeps the process context. Control objects and their dynamics are covered in HMI buttons, status lamps and mode selection.
Colour, Contrast and Readability
The single most common HMI design mistake is a colourful normal state. If pipes are blue, tanks are green and every pump has a red border by default, an actual alarm has nowhere to stand out.
| Element | Recommended treatment |
|---|---|
| Background | Neutral mid or light grey, never white or black |
| Equipment at rest | Grey outline, no fill |
| Equipment running | Single consistent colour, used nowhere else |
| Warning | Amber, with a symbol as well as colour |
| Fault or trip | Red, flashing until acknowledged, plus a symbol |
| Not available or isolated | Dimmed and clearly non-operable |
| Text and values | Dark on light, at a size readable from two metres |
Add a shape or a text label alongside every colour signal. Around one in twelve men has some form of colour vision deficiency, and a red-versus-green indicator is invisible to them.
Check the screen on the actual panel under plant lighting before FAT. Colours that look distinct on a laptop can become indistinguishable on a matte panel screen under fluorescent light.
Design panels that pass FAT
Practical Siemens HMI sessions on KTP Comfort panels with real PLC connection and process signals.
Layout Rules That Survive Commissioning
- Group by process flow. Arrange equipment left to right or top to bottom in the direction material actually moves.
- Size for gloves. Touch targets need real area; small buttons produce mispresses that generate alarms.
- Separate commands from displays. A command button beside a numeric display invites accidental presses.
- Confirm destructive actions. Recipe download, counter reset and mode change deserve a confirmation dialog.
- Show units and setpoints. A value without its unit and target is half an answer.
- Keep one screen, one job. A sequence screen that also carries a full mimic does neither well.
- Design for the language. Leave room; German and Marathi labels are longer than English ones.
Before the panel goes to site
Walk the screens with an operator, not just an engineer. Ask them to start the machine, find why it will not start, acknowledge an alarm and change a setpoint. Anything they hesitate over is a design defect, not a training problem.
Then finish the security and runtime configuration described in HMI user administration and runtime settings, and take a backup before handover.
Hands-On Lab: Build a Template and a Two-Level Screen Set
Hands-on- TIA Portal with WinCC Comfort and a panel or panel simulation
- A PLC project with a few device status and command tags
- Estimated time: 40 minutes
Build the template
Create a template with header, permanent navigation, single-line alarm view and status strip.
Create the overview
Build an overview screen showing three devices with status lamps in process-flow order.
Build a faceplate
Create a motor faceplate with commands, status, interlock display and parameters, then place three instances.
Apply the colour standard
Set equipment at rest to grey outline, running to one colour, faulted to red with a symbol.
Test navigation
Confirm every detail screen is reachable within two touches and the alarm line is present everywhere.
One template drives every screen, one faceplate serves every motor, the healthy plant looks calm, and an operator can reach any detail in two touches.
Frequently asked questions
What belongs on an HMI template rather than on each screen?
Anything permanent: header with machine name and time, navigation buttons, the single-line alarm view and the status strip. Putting them on the template means one edit instead of forty.
What background colour should an HMI use?
A neutral mid or light grey. White glares under plant lighting and black hides low-contrast objects, and both make it harder for an alarm colour to stand out.
How deep should the screen hierarchy be?
Shallow. Overview, area, detail, with any detail screen reachable within two touches. Deeper structures get abandoned and operators call maintenance instead.
Why use faceplates instead of copying screen objects?
Because a faceplate is configured once and instanced many times. Improving the faceplate improves every device using it, while copied objects have to be edited one by one.