Human Machine Interface (HMI) Mockup Designs ☝️

‍A Human Machine Interface (HMI) is anything that has a visual or graphical display that gives users a posibility to interact with a certain device. This can be using voice recognition to use Alexa or using specific triggers for complex machines.

What are HMI's?

Whether you decide to launch a smart bracelet, self-service kiosk, or medical laboratory equipment, you’ll want to make your product appealing, functionally rich, and convenient to use. To incorporate all these capabilities, your solution needs a high-performance UI, top-notch functionality (for both hardware and software), smooth human-to-machine interaction, and a mix of other things expected when developing a single HMI unit.

The global Human Machine Interface market is growing by leaps and bounds. According to forecasts, it will be worth $7.24 billion by 2025 (Compare: in 2019, it was valued at $3.71 billion).

Experts predict that the pharmaceutical industry, in particular, will see significant growth in automation, citing the current trend towards the use of high-precision contamination-free minimal human-interaction machines as a sign of things to come. In different countries, including the US, China, and India, the pharmaceutical sector is expected to witness a CAGT of around 150-200%, according to a recent market report. (Note: the base year is 2019 — before the COVID-19 outbreak).

Along with solutions for the pharmaceutical sector, HMI development is common across various industries, such as consumer electronics, robotics applications, transportation, and more. Advanced HMI examples can be found across many industries and solutions — wearables, payment terminals, security systems, cars and airline cockpits.

Why should you create HMI mockups?

1. Verify the design works as intended

This is usually the most important part of prototyping, ensuring that the developed HMI meets the requirements of the customer and controls the LCD display or touchscreen as intended. In prototyping, it is common to consult with your customer so they can provide functional feedback as well, and often it is possible to add, remove, or modify some of the less critical features or requirements of the product.

2. Ultimately save money by ensuring the performance is satisfactory for your customer

This is a big advantage that ties in to first advantage of prototyping. If the design team was not granted the award to develop a prototype, they may develop an HMI that functions to the customers requirements and can ship with confidence that it works to Epec’s standards. However, without a prototype and customer feedback, the product will not arrive for First Article Inspection with the customers recommendations. For example, do the buttons need to be larger because the operators must wear big bulky gloves and do those buttons require less force to press, etc. These issues can be addressed before reaching the quality department of the customer.

3. Discover which materials require a long-lead time

When we write up our bill of materials (BOM) to include the components used to build our product, it is uncommon to look up the lead time of each component, especially as some BOMs can be hundreds of components long.

Often times you can guess which products will have the longest lead time, such as an LCD display or a COM module, but sometimes it can be after the 12-week commitment to build and ship a product that it is discovered that the solid state relay has a 10-week lead time, leaving 2 weeks to complete the remainder of the build. When a prototype is built, all these components are ordered and any long-lead time parts are noticed immediately, ensuring that can be considered when committing to a deadline.

4. Determine complexities of assembly early-on

This is a big one. Often, an engineer will design the housings along with the user interface (UI) and circuit boards, and manufacturability is not accounted for because it is the last piece of the puzzle and fits just right. Prototyping really highlights these challenges early on because the engineer will get a good look at what they are asking the manufacturing team to build, and they will figure out whether a fixture or a jig is needed to make the UI assembly easier. The engineer can develop a set of work instructions during prototyping if they realize there is an easy or hard way to do something.

How can you create HMI mockups?

design your HMI as a graphical representation of your automated system to meet your needs. Like many technologies, newer HMI methods can deliver measurable efficiency improvements and cost savings. We believe the best HMIs use technology to organize data around your goals and cater to the way your operators process information and make decisions.


Pen and paper

As mentioned above, prototypes differ greatly in their implementation. As the simplest form of the prototype, it is quite sufficient to put first thoughts on paper as a simple sketch. These sketches are perfectly suited as a basis for discussion for all further steps.

Microsoft Power Point

Yes - Power Point!!! The big advantage of this tool is that nearly every person has already worked with it and knows how to handle it. With Power Point it is therefore possible to create an interactive prototype within a few minutes. This is often enough to validate that the fundamental concept will work.

Adobe Experience Design (Adobe XD)

Adobe XD is a tool specifically designed for the design of digital interfaces. From design to the creation of interactive prototypes, all steps are covered. Recently, Adobe XD has also been introduced as a free, full-featured entry-level solution.

Prototyping a user interface is a very powerful tool to ensure, that the HMI design concept you are developing is exactly what the user will need for the final system. There should be no excuse not to spend the extra effort for that, because your end product will be much more better!

Learn more 🙋‍♀️
Other resources 👓