Call us! 512-349-0334 or (877) INDUSOFT

Tips for Designing Multitouch HMI Applications in InduSoft Web Studio

Designing a top-notch interface for a touch-screen panel PC involves some careful planning. In addition to designing an HMI that is easy to use and intuitive, developers should also bear the medium in mind. Touch-screen technology represents some unique challenges to interface design, but by paying attention to details such as the physical environment the workspace and by adding in a margin of error, developers can design truly effective HMIs for touch-screens.

Plan for anticipated response time

When users use a touch screen, they generally expect a quick response from the equipment. This response time is registered in tenths of a second, and any response time longer than a quarter to half a second may cause the user to think their input has not registered. Pressing the button again may cause unfortunate results, particularly for important functions like starting or stopping a machine. A good way to prevent this is to ensure that the user is aware their input has been recorded. Having the button change color or shape, or otherwise indicate the response will help prevent users from growing frustrated or confused by the HMI.


Plan for varied input methods

Depending on the application of your interface, it may be used in situations where a variety of operators will need to access it. In addition to planning for the variations in human finger size, shape, and dexterity, developers should also plan for the possibility that users will be wearing protective gear, such as gloves. Gloves may considerably increase the size of the hand, and developers can anticipate this by spacing objects more widely, or by introducing confirmation requests into the HMI.

Another variation in input may come from users with impaired motor skills or sight. This can happen if the environment is dangerous or prone to elements like steam or heat that may obscure the screen. A parallax effect may also occur when users view the screen at angles other than a straight-on view. This can cause objects to appear to shift.

Plan for improperly selected options

It’s a common problem on touch-screen HMIs for an operator to inadvertently choose an object adjacent to the intended button. A good way to prevent the ‘fat-finger’ effect is to place all actionable buttons (such as those that start or stop the machine) as far apart from one another as is plausible. In addition, an HMI designed for touch screens should also include an easy way to undo or deselect accidental selections without restarting the screen. Design the HMI with safe operating procedures for the machine in mind.

Choose colors carefully

Color is often used as an indicator of various statuses on the machine. Bear in mind, however, that this color may be compromised by things like fingerprints, condensation, glare, sunlight, oil, or other things that may decrease visibility. Always use highly contrasting colors when possible, and avoid using similar colors in close proximity to one another on the HMI. Color is a great shorthand for information, and similar colors may confuse the user.

Practical Tips for InduSoft Web Studio HMIs

  • Do not configure actions on the right click event of commands using touch buttons.
  • Check the option ‘release’ from the command animation for actions triggered with the ‘on up’ event.
  • Enable the InduSoft Web Studio native virtual keyboard/keypad, and scale it according to the resolution of the screen.
  • Enable the option ‘Push-like’ for check boxes and radio buttons.
  • Avoid associating actions with the ‘Double-click’ event.
  • Avoid using tree-view controls.

Leave a Reply