Today, stunning technologies powered by HTML5 and CSS3, along with native apps for phones and tablets, are readily available. The adoption of mobile devices seems to have made them the preferred computing device, surpassing desktops. Think about all the incredible applications we use every day; what if we leveraged these technologies to create Human Machine Interface (HMI)/Supervisory and Data Acquisition (SCADA) applications? Well, let's find out.
Web browsers and web technologies have matured sufficiently for industrial applications, and these advancements are driving new approaches to HMI and SCADA implementations. Leveraging powerful web technologies and next-generation visualization systems in modern HMI and SCADA applications, users can build industrial applications that automatically respond to specific operating conditions. Modern tools also mobilize the power of the factory floor by empowering users to create aesthetically pleasing, responsive mobile industrial applications that can run natively on any mobile device and web browser.
Using a modern web browser, HMI and SCADA applications can be accessed from anywhere without plugins. Users can access Google apps on any device that supports a modern web browser. The same applies to HMI and SCADA applications. This is possible thanks to HTML5 and CSS3, as well as native apps for mobile phones and tablets.
A modern web browser integrating advanced mobile features. Image credit: Inductive Automation
HTML5 is the fifth version of Hypertext Markup Language, used to define and organize content on web pages. All web pages are implemented using HTML in one way or another. CSS stands for Cascading Style Sheets, and CSS3 is its latest version. CSS has revolutionized how web page layouts are defined, and most web pages are built upon HTML. CSS3 has some advanced styling features that allow for responsiveness using media queries. This means that such web pages will have an optimal look and feel for different screen sizes and resolutions.
New possibilities for industrial mobility
These mature technologies offer many possibilities for HMI and SCADA applications, including:
● Website-friendly;
● Custom navigation;
● Powerful web page components;
● Gestures and multi-touch;
● Mobile responsive design;
● Different styles;
● Federation Identity: Single Sign-On (SSO) and Two-Factor Authentication (2FA);
● Native apps for Apple iOS and Google Android.
Industrial web application designers need to control how users navigate and use the application. No two HMI and SCADA applications are the same, therefore no pre-installation is possible. Some applications have only one screen. Others allow users to navigate from one screen to another, delve into different sections, or open pop-ups for more details. During navigation, SCADA applications should be easy to use and update URLs.
Web applications function via URLs. These are addresses used to access various resources. In most cases, they are used to access websites on the internet. Users can copy a URL and send it to another user without navigating to that screen or resource. URLs also make it easy to understand where the user is within the application.
Powerful user interface components are available for the web and are easy to build. People frequently interact with these components, making them easy to integrate into HMI and SCADA environments. Robust components such as charts, menus, carousels, and embedded maps all support touch and gestures, including swipes and multi-touch for zooming. They are also mobile-responsive and designed to work with both desktops and smartphones.
Mobile-responsive design is one of the most important features of HTML5 and CSS3. It allows users to build applications that can automatically change to match screen size, whether it's a desktop, laptop, tablet, or mobile phone. All modern websites are based on mobile-responsive design and present the same data in different forms depending on the device.
Users get a more detailed view on desktop computers and a view optimized for mobile displays on smartphones. For example, if a user is viewing tabular data, they will get a traditional table with multiple columns on a desktop, but on a mobile device, each row will have a separate card. The table is no longer scaled down on mobile devices, thus losing column visibility. Every part of HMI and SCADA can be built this way, requiring a new approach when considering applications. Building separate applications for mobile devices is a thing of the past.
CSS provides styles for web pages. Users can develop reusable style classes (objects) but only need to define them in one place. Styles can be background colors, foreground colors, fonts, borders, and design elements. This allows users to switch styles or update parts of styles instantly without having to go to each screen. Defining styles is an important part of HMI and SCADA development, ensuring consistent styles across multiple applications.
CSS3 also provides animations. Animation style classes transition through two or more style configurations over a period of time. For example, using animation style classes can be a powerful way to display changes in data on a component over time (such as alarm status or machine status).
The motion-sensing design saves development time and can seamlessly adapt to different screen sizes.
Protect SCADA system
Security is one of the most critical aspects of any HMI and SCADA application, especially as more users gain access. Most companies already use multiple cloud applications, such as email, document sharing, and customer tracking. These applications use SSO with existing company credentials and allow access to all applications from a single point of view. This can be achieved using trusted federated identity technologies such as Secure Assertion Markup Language (SAML) and OpenID connectivity. These technologies can be used with SCADA systems. There's no need to share accounts; everyone can log in to securely access the data they need.
These systems can verify identity via two-factor authentication (2FA), which requires credentials and additional steps, such as sending a PIN to a mobile phone. For security reasons, many companies do not allow the use of SCADA applications on smartphones. However, this technology allows users to efficiently and securely retrieve data from various applications.
Smartphones are also incredible pieces of hardware technology. They incorporate an astonishing number of sensors, such as GPS, cameras, accelerometers, and Bluetooth. Applications can be provided to both web browsers and smartphones simultaneously. However, the ability to access these sensors within applications on a smartphone unlocks a wealth of opportunities.
Imagine GPS automatically switching to the appropriate screen as users walk around the factory or mark their location by entering data. Barcodes placed in key areas allow users to scan them for machine manuals, operating procedures, or other information. Even images or video streams of the process can be transmitted to the company's support team for remote troubleshooting. Now is the time to leverage modern networking technology in HMI and SCADA applications, and it's never been easier. (Author: Travis Cox)
