.png)
Date: 27.10.2023
Author: Habib KARA habib.kara@inscada.com
We will examine the most effective tools we can use when moving from user experience design to user interface and application in SCADA and IIoT Applications.
As a developer in the SCADA field, I think that writing something under this heading will be an innovative perspective for both me and SCADA application developers like me. In addition, this article will increase the interest of many software developers and designers who do UX and UI design and development in the field of SCADA applications.
So what do I want to say?
What I am actually trying to reach here is that there are two separate audiences who develop applications and design in the same disciplines. The first of these are those who already know UX and UI concepts well, are well versed in modern application development techniques, and develop web applications using the necessary modern tools. The other audience is those who develop SCADA applications, including me. In order for the first audience to fully pay attention to this article and understand the subject, they can open a new tab in their browsers while reading this article and search for 'scada mimic ISA-101' in the images search engine on Google. I suggest you write it down and look at the results.
Here are the results, pictures and screenshots you see, all of which are the user interfaces of SCADA applications. These interfaces you see are "Mimic Screens" in the SCADA field. It is called. Many of these designs are user interfaces made with different SCADA software. Even though these interfaces in SCADA software are designed by interpreting new design standards (ISA-101), similar results emerge. I feel like I hear the inner voice of the first audience who sees the results. 'These cannot be designs!' .
You are right, first audience. Try to understand why. You don't know the constraints and challenges we face and what tools we have to use to do these things. At this point, we have a solution suggestion.
Our partner, who develops automation solutions in the marine sector and has undertaken many domestic and international projects (Des Elektroteknik | Official Website) together with the inSCADA Platform, a ship's 'HVAC and Water System' We are developing a SCADA application related to i. While we continue to develop the application with the methods and methods we are accustomed to at the beginning, that is, we move towards similar results with the above outputs, we are aware that the project owner (Teknotherm Marine - Innovative Climate We realized that Cooling Solutions) has an innovative vision about the application, is working with a professional design team on this issue, and wants to move forward with some standards. When we took a look at the designs they shared with us, we saw that they put a lot of effort into UX, which included very fine details. Figma' The designs they made were waiting to be turned into a real application. See Picture 2 ' de figma ' The UI of a Water System designed in . is seen.
Thermal Energy Management System (TEMS) by Teknotherm Marine AS.
For more information contact sigbjorn.tyssen@teknotherm.no or jan.nordvik@teknotherm.no.
The design is based on the OpenBridge Design System 5.0
“Teknotherm (part of the Heinen & Hopman group) is one of the leading companies when it comes to Marine and Offshore systems Focusing on onboard energy consumption, they, together with their partners Ulmatec Thermal Solution, developed a complete thermal management system for ships. These systems are complex and require a high degree of automation. A good Scada system is essential to understand, monitor and optimize the operation of the system. Familiar and intuitive to operators Teknotherm based its designs on the OpenBridge Design system, with the aim of creating a Scada system that will make you feel the same. OpenBridge Design System is an open design system based on modern principles of user interface and workplace design, adapted to the maritime context and regulations.”
Teknotherm team developed many user interfaces similar to the one shown in Figure 2 using OpenBridge Design System 5.0 (OpenBridge Design System 5.0) design guide. At first glance, I think putting all these designs into practice, and especially into an application that requires real-time visualization as in SCADA applications, will seem like a very time-consuming task. But there is a simple way to do this on the inSCADA platform. First you can see the result in Picture 3 ' Let's see.
Thermal Energy Management System (TEMS) by Teknotherm Marine AS.
For more information contact sigbjorn.tyssen@teknotherm.no or jan.nordvik@teknotherm.no.
The design is based on the OpenBridge Design System 5.0
Picture 3 ' As seen in Figma' A UI designed in 2017 can be transferred to the inSCADA platform without spending too much time and without the need for front-end developments (css, javascript) and can be used immediately.
Figma' A UI designed in The main feature that enables the application to be turned into an application very quickly is inSCADA' 's ability to create SVG-based visualizations. We can print it in SVG format with appropriate settings via Figma and instantly transfer it to the inSCADA platform. Another question that comes to mind here is, how are visualizations or animations made? Here again, the animation application technique of the inSCADA platform stands out.
"On the inSCADA platform, you can add any animation type (get) to any object (text, rectangle, path ..etc.) on the mimic screens (SVG). , color, rotate, move .. etc.) and bind data."
The technique of animating and data binding objects on SVG, which the inSCADA platform uses for visualization, actually saves developers from going into many programming and development details. It allows you to focus only on the requirements and customer wishes. Moreover, your design team's designs can be used almost without loss. Revision requests between the design and implementation teams, meetings that need to be held in relation to revision requests and, accordingly, the time spent on the project decrease. In summary, productivity increases.
Recently, in design communities (https:/ I think that user interfaces for SCADA applications and digital twin designs of SCADA System instruments can also be found, such as presentations, web applications, brand and slogan designs (/www.figma.com/community etc.).
I intend to share our experience in this article in full detail as a successful implementation story after the project is completed. Thanks to the project stakeholders for choosing the inSCADA platform and collaborating with us.
Links ;
For more information contact turgay@deselekto.com