UI/UX of Human-Machine Interface for Industrial

Application: Review and Preleminary Design

Siti Amira Kamizi
Faculty Computer Science and Information Technology, Universiti Malaysia Sarawak
94300, Kota Samarahan, Malaysia
s.amirakamizi@gmail.com

Abstract—Industrial workers usually control their machines

using conventional technique. However, the traditional way of
controlling the machines may slow the production process if the
user interface and experience (UI/UX) is not user friendly and
usable. This paper reviews and proposes the UI/UX of human-
machine interface (HMI) for industrial application. This
preliminary design is expected to improve the functionally and
minimize the fallacy of the machines.

Keywords-User experience (UX), dashboard, industrial, user

interface (UI), HMI

I. INTRODUCTION
The growing of technology in industrial work field in
Malaysia has transformed from traditional way to modern way
on using the machine. The researcher has started to explore Figure 1: Concepts and features of our cyberlearning environment evaluation
process for the UI / UX [1].
and come up with the new methods that are able to help
improving the manufacturing process in industrial work. HMI
is the medium for human and machine to communicate and Users also set out higher specifications for the mobile
cognition and it is the method for transmitting information. interface design process and material. In other terms, users can
HMI technology provides a visual representation of the achieve a good quality of service throughout the customer
operation of the machine. interface dimension, and reliable info-transformation among
suppliers and target customers, therefore implementing the
application efficiently and decisively [3]. UX is a common
In this project, the design of HMI is being proposed and
term throughout the field of human-computer interaction and
will be developed to produce an effectiveness and suitable to
designing interaction [4]. User interface also applies to a
use the technology in industrial work in Malaysia. The aims of
subjective psychological sensation that users generate during
this project are to increase the motivation and productivity of
the time of using products or services, which includes the
workers in their workplace, simultaneously change the
beliefs, feelings, desires, attitudes, physiology and
traditional way in industrial work to become more engaging
psychology, behavior, etc. of the users, and passes across the
and updated.
front, middle, and late stage of service or product usage.
II. USER INTERFACE (UI) AND USER INTERCATION (UX)
To develop a product that satisfies consumer needs, the
If using the build-in digital interface is confusing and it fails
actual and future requirements of the customer must be
to explain what the program does and what users can do, then
identified in advance [5]. User interface (UI) is a way to
users will probably just leave[1]. Consumers should not spend
communicate, interaction, and knowledge exchange between
a lot of time trying to figure out an interface, after all. The
the user and the device [6]. To complete the work and increase
easiest and most successful way to improve usability is to
performance, the user will interact with the device through the
carry out interface assessments that involve three key
UI. An improper interface design not also creates user
components: representative users, representative tasks and
discomfort, but also impacts user awareness and decreases the
user assessment. There are five recommended design features
desire to use it.
that should be considered to develop any apps: persuasive
instruction, clear textual interface, predictive icons, sleek
interaction, and direct navigation [2]. Besides that, the advancement of HMI technology in
industrial work has help translating control system into human
readable visual representations of the system and turn the
complex process variables into useful and actionable

1
information. Another benefit of HMI is to improve reliability
and maintainability as well as increase the production of the
industries.

Storyboards are one design method that is constantly that is

used to break this pattern and incorporate experiential
communication [7]. This is because they deliver a visual
communication mode that can contextualize evolving concepts
regarding user interaction and expected experience, much
faster without any investing in comprehensive VR or full-scale
prototyping. Positive user experience enables users to
accomplish the task quickly and effectively, improving trust,
security and a sense of performance. [8]. Tabletop software
shoddily designed and developed impact the outcome of the
UX.[9]. Figure 2 shows the overall UX Dimensions for
Evaluating 3D Car Catalog.

Figure 3: HMI design scenario of the defect detection prototype [10].

Any user using this HMI system must log in to start

Figure 2: Overall UX Dimensions for Evaluating 3D Car Catalog Application
Using Multi-touch Tabletop Display [9].
Figure 3 shows the Through multi-touch tabletop display the
entire UX score evaluating 3D car catalog application. Based
on the graph, satisfaction state the highest score which mean
the users are satisfied of using this application on multi-touch
tabletop display.
monitoring and operating the system. The HMI function for
this research is as a link between the consumer and the device.
The human-machine interface architecture of the user
experience is dependent on the program must always be user-
centric, addressing user needs in depth and situational features
for performing component and content design to achieve an
ideal user experience [11]. Figure 4 shows the HMI design, as
the homepage, shows the start button. There will be two
options on the homepage, which is to log in as the
identification operator or login as the classification operator.

III. REVIEW OF RELATED HMI FOR THE INDUSTRIAL WORK

As a technology enhancing, HMI is a new trend technology
in industrial work in Malaysia. It helps to connect an operator
to the controller for the industrial system. There is a lot of
invention from various industry are using HMI such as in
military, medical etc. Same goes to the industrial work in
Malaysia, a lot of effort has been made to improve the Figure 4: The organizational relationship of design object [11].
efficiency of the production of the company to be more
reliable and easier to control and monitor. HMI acts as a The results therefore indicate that the theory of knowledge
bridge enabling users to grasp the on-line processes [10]. management and interface design can still be seen as a
Users would have trouble tracking and regulating the system potential response to technical problems and barriers [12].
without an HMI. Upon the introduction of digital technology, the Industrial
Control Systems (ICSs) developed rapidly over a period [13].
Whereas nearly all ICSs provide HMI, the primary constituent
for controlling and monitoring complex industrial processes.

2
Current HMIs with simple UIs have been operational for
decades to reduce the complexities and the resulting in
production costs. Figure 5 shows within the human-machine
interface architecture, the design object is basically an
interface and another component. The design factors, design
carriers and design concept are included in design object.

Figure 6: Induction Motor Speed Control Using PLC and HMI [16].

IV. METHODOLOGY
RAD model is used to complete this project Throughout the
Figure 5: HMI based industrial control system [13]. preparation of requirements, the preliminary review of
requirements will be done by querying and collecting user
PLCs is a prerequisite for the great functioning in human- details. The next phase is a user design which involves
machine interface of the industrial machines. In order to developing the prototype, testing, and refining process. In this
monitoring and controlling there are several sensors of process, done based on the user’s feedback if it is necessary.
input/output that are connected to the industrial machines. The process in user design process is repeated until the results
After PLC device get data from the sensors, the HMI will of the refinement is good. Then, there will be a thorough
translate the data to the human readable format as shown in construction process of the proposed design. After the
Figure 6. constructing, the proposed design can be implemented by user.
Figure 7 shows the methodology of this project.
HMI is the essential to achieving effective, intuitive and
seamless processing to complete the tasks as a contact medium
between the user and the real equipment, device or virtual
environment [14]. Many challenging, high-precision processes
are and will continue to be handled manually and, thanks to
modern technical advancements in robotics and HMI, many of
them may be achieved collaboratively by human and robotic
collaboration [15]. Automation processes improve efficiency
and flexibility by using PLC, and thus reduce production
Figure 7: Rapid Application Development (RAD) Model) [17].
costs[16]. PLCs are interfaced with power converters, personal
computers, and other electrical equipment to obtain precise
industrial electric drive systems. Using PLC and HMI the A. Prototype Design/Interface
whole device can be tracked.
Figure 8 shows the use case diagram for HMI.
Figure 6 shows the block diagram of control speed of 3-
phase induction motor that is control by the system. In this
diagram, the specific equipment has been included for the
HMI proposed system.

Figure 8: Use case diagram for HMI design.

3
 This diagram shows easy user experience and device
design. User will start accessing the system from the main
page. Further details of the diagram will be discussed in the
use case scenario. Figure 9 shoes the sequence diagram.
Figure 9: Sequence diagram.
B. Flowchart
Figure 10 shows the flow of HMI from system start to
system closure design. In this project, the function of the HMI
as a connector among the user and machine.
Figure 10: Flowchart of the process.
V. CONCLUSION
In conclusion, this paper reviewed and proposed the UI/UX
of human-machine interface (HMI) for industrial application.
This preliminary design is expected to improve the
functionally and minimize the fallacy of the machines.
REFERENCES
[1] H. W. Alomari, V. Ramasamy, J. D. Kiper, and G. Potvin, “A User
Interface (UI) and User eXperience (UX) evaluation framework for
cyberlearning environments in computer science and software
engineering education,” Heliyon, vol. 6, no. 5, p. e03917, 2020, doi:
10.1016/j.heliyon.2020.e03917.
[2] M. H. A. Kalana, S. N. Junaini, and A. H. Fauzi, “Mobile augmented
reality for biology learning: Review and design recommendations,” J.
Crit. Rev., vol. 7, no. 12, pp. 579–585, 2020, doi:
10.31838/jcr.07.12.104.
[3] T. Ahram and S. Colsge, Chia-Chi Mao, Fei-Yi Chenon, Human
Interaction and Emerging Technologies, vol. 1018, no. Ihiet. Springer
International Publishing, 2020.
[4] X. He, H. Yan, and X. Gong, Advances in Usability and User
Experience, vol. 972. Springer International Publishing, 2020.
[5] W. Qi and J. Xue, “Visual design of smartphone APP interface based on
user experience,” Comput. Aided. Des. Appl., vol. 17, no. Special Issue
2, pp. 89–99, 2020, doi: 10.14733/cadaps.2020.S2.89-99.
[6] K. W. Su, S. C. Chen, P. H. Lin, and C. I. Hsieh, “Evaluating the user
interface and experience of VR in the electronic commerce environment:
a hybrid approach,” Virtual Real., vol. 24, no. 2, pp. 241–254, 2020, doi:
10.1007/s10055-019-00394-w.
[7] C. Ranscombe, J. Rodda, and M. Johnson, “Visualising user
experiences: Analysing embodiment of UX in autonomous vehicle
concepts,” Proc. Int. Conf. Eng. Des. ICED, vol. 2019-Augus, no.
August, pp. 4039–4048, 2019, doi: 10.1017/dsi.2019.411.
[8] J. Schwank, S. Schöffel, and A. Ebert, Advances in Usability, User
Experience and Assistive Technology, vol. 794. Springer International
Publishing, 2019.
[9] A. Abro, S. Sulaiman, S. Mahamad, F. O. Mean, D. R. Awang Rambli,
and F. M. Shuhaili, “Assessing User Experience (UX) Interacting with
Car Catalog Application Using Multi-touch Tabletop Display,” 2019
IEEE Conf. Open Syst. ICOS 2019, pp. 17–22, 2019, doi:
10.1109/ICOS47562.2019.8975704.
[10] T. Mulyana, R. Ibrahim, and E. Abd Rahim, “Human Machine Interface
Design Analysis of Defect Detection Prototype by Wonderware InTouch
Software,” J. Phys. Conf. Ser., vol. 1150, p. 12034, 2019, doi:
10.1088/1742-6596/1150/1/012034.
[11] L. Jiang, W. Xiu, L. Zhelin, and Z. Yu, Design, User Experience, and
Usability. Application Domains, vol. 11585, no. July. Springer
International Publishing, 2019.
[12] J. Friedrich, Max and Lieb, “A Novel Human Machine Interface to
Support Supervision and Guidance of Multiple Highly Automated
Unmanned Aircraft,” 2019 IEEE/AIAA 38th Digit. Avion. Syst. Conf.,
pp. 1--7, 2019.
[13] I. Qasim, M. W. Anwar, F. Azam, H. Tufail, W. H. Butt, and M. N.
Zafar, “A Model-Driven Mobile HMI Framework (MMHF) for
Industrial Control Systems,” IEEE Access, vol. 8, pp. 10827–10846,
2020, doi: 10.1109/ACCESS.2020.2965259.
[14] M. Zhu et al., “Haptic-feedback smart glove as a creative human-
machine interface (HMI) for virtual/augmented reality applications,”
Sci. Adv., vol. 6, no. 19, pp. 1–15, 2020, doi: 10.1126/sciadv.aaz8693.
[15] M. Peruzzini, F. Grandi, and M. Pellicciari, “Exploring the potential of
Operator 4.0 interface and monitoring,” Comput. Ind. Eng., vol. 139, no.
December 2018, p. 105600, 2020, doi: 10.1016/j.cie.2018.12.047.
[16] S. J. Suji Prasad, R. Suganesh, and R. Suresh Kumar, “Safe operation of
induction motor with programmable logic controller and human machine
interface,” Int. J. Innov. Technol. Explor. Eng., vol. 8, no. 12, pp. 2307–
2311, 2019, doi: 10.35940/ijitee.L3335.1081219.
[17] Z. A. Abd Ghadas, W. N. Wan Smail, A. Abd Aziz, N. A. Harun, M.
Jusop, and C. A. Abd Rahman, “LAFAMS: Account management
system for Malaysian small legal firms,” Pertanika J. Soc. Sci.
Humanit., vol. 23, no. SpecialIssue11, pp. 239–250, 2015.