HMI-Oberfläche Einfach zu HTML5-Visualisierungslösungen – und ganz flexibel

Produktionsanlagen müssen in der Industrie 4.0 flexibel und offen sein. Das gilt auch für die Visualisierung.

Anbieter zum Thema

PFLITSCH GmbH & Co. KG

Micro-Epsilon Messtechnik GmbH & Co. KG

compmall GmbH

SIGMATEK GmbH & Co KG

Die technische Basis für das Visualisierungs-Tool Lasal VisuDesigner von Sigmatek bilden HTML5, CSS3 (Cascading Style Sheets) und JavaScript. Der Einsatz des Dateiformats svg (skalierbare Vektorgrafik) ermöglicht die einfache Anpassung grafischer Elemente an unterschiedliche Bildschirmformate und erleichtert es, flexible Visualisierungslösungen mit Varianten für verschiedene Zielgeräte zu erstellen. Der HMI-Code ist weitgehend herstellerunabhängig und von der Automatisierungslösung entkoppelt.

Bildergalerie

Entwicklungsumgebung wächst mit

Um eine Visualisierung auf HTML5-Basis bereit zu stellen, sind neue Ansätze in punkto Applikations-Entwicklungsumgebung gefragt. Webbasierte Visualisierung bedeutet einen Schritt in eine neue Welt, bei dem die Entwicklungstools eine entscheidende Rolle spielen: Sie sollen Standard-User gleichermaßen abholen wie Power-User – das war der Ansatz bei der Entwicklung des Lasal VisuDesigners.

Software-Ingenieure können die modernen Webtechnologien nutzen, ohne direkt mit ihnen in Berührung zu kommen. Im grafischen Editor lassen sich ansprechende Bedienoberflächen intuitiv durch reines Konfigurieren in einem einheitlichen Look-and-feel erstellen. Dazu gibt es moderne Design-Vorlagen (Themes) sowie umfangreiche Bibliotheken an vorgefertigten Anzeige- und Bedienelementen (Controls), die im grafischen Editor per Drag & Drop platziert werden.

Gleichzeitig stehen dem erfahrenen Power-User sämtliche Möglichkeiten der Webwelt offen. Er kann vorhandene Webkomponenten erweitern, eigene erstellen, bzw. im Internet frei verfügbare Grafiken und Controls nutzen. Animationen, Videos und Audiodateien lassen sich ebenfalls einbinden.

Konfigurieren statt programmieren mit dem HMI-Tool

Das komfortable HMI-Tool basiert auf Trennung von Programmlogik und Layout. Die Logik hinter den grafischen Elementen lässt sich ohne vertiefende Programmierkenntnisse aus puzzleähnlichen Bausteinen (Function Blocks) komfortabel zusammensetzen. Durch diese Trennung ist es möglich, ein Visualisierungsprojekt in zahlreichen Darstellungsvarianten und -größen zu erstellen. Und: Das Layout kann einfach und auch zu einem späteren Zeitpunkt angepasst oder optimiert werden, ohne die Logik angreifen zu müssen. Dies erleichtert die Wartbarkeit enorm und spart Zeit, weil die Logik nicht mehr getestet werden muss.

Ein weiterer Vorteil ist der objektorientierte Ansatz des Entwicklungstools. Dadurch ist es möglich, wiederkehrende Visualisierungselemente – die sich aus mehreren Bedien- und Ansichtscontrols zusammensetzen – in sogenannte „Composite Controls“ zu gruppieren. Diese Funktionseinheiten, zum Beispiel eine Temperaturregelzone, werden einmal definiert und anschließend beliebig oft eingesetzt.

Performancestark – dynamische Visualisierung

Bei der Entwicklung des Lasal VisuDesigners stand klar im Fokus auch mit kleinen Prozessoren eine ansprechende und schnelle Visualisierung zu ermöglichen. Der eingesetzte HTML5-Browser wurde dahingehend optimiert. Das Resultat ist eine dynamische Visualisierung, die selbst auf schlanken Prozessoren flüssig läuft. Multitouch-Interaktionen werden genauso unterstützt wie die Übertragung von Prozessdaten über OPC UA. So kann eine einfache Integration in einen smarten Maschinenverbund mit Steuerungen unterschiedlicher Hersteller erfolgen.

Reaktionszeiten ein wichtiges Argument

Sobald HTML5-Visualisierung ein Thema ist, geht es oft auch um responsive Design. Viele vergessen dabei, dass in der Automatisierungswelt vorrangig die Schnelligkeit zählt. Es gilt daher, die Prozessorleistung so effizient wie möglich zu nutzen, ohne die User-Experience zu vernachlässigen.

Sigmatek hat bei der Entwicklung des VisuDesigners berücksichtigt, was der Anwender in der Praxis benötigt und setzt standardmäßig auf ein adaptives Designkonzept. Das ermöglicht eine flexible Darstellung und die Kontrolle über das gesamte Design bei unterschiedlichen Displayformaten. Anstatt ein einziges Design auf jede mögliche Displaygröße und jedes Anzeigeprofil abzustimmen und zu testen, können für vordefinierte Formate eigene Designs erstellt werden, die alle unabhängig voneinander auf dieselbe Programmlogik zugreifen. So kann zum Beispiel für das Mobiltelefon eines Anlagensupervisors eine eigene Seite mit den wichtigsten Status-Meldungen erstellt werden, während die Bedienoberfläche an der Maschine weitere Einstelloptionen oder Animationen enthält.

Sigmatek

30 Jahre gute Ideen für die Automatisierung

4 Fragen an Lucia Krautgartner, Produktmanagement Software Tools bei Sigmatek:

Lucia Krautgartner, Produktmanagement Software Tools, Sigmatek: „Durch Trennung von Programmlogik und Darstellungsform lassen sich Oberflächen leicht anpassen“

Welchen Stellenwert wird das Bedienen und Beobachten durch den Menschen in der künftigen Industrie 4.0-Welt einnehmen?

Die Fabrik von morgen steuert sich selbständig und intelligent. Der Mensch legt die Produktionsstrategie fest, überwacht die Umsetzung innerhalb dieser Smart Factory und greift bei Bedarf ein. Deswegen wird es immer wichtiger, die steigende Anzahl der Informationsquellen aus diesen immer komplexer werdenden Prozessen einfach, übersichtlich und kompakt zur Verfügung zu stellen. Am besten zu jeder Zeit und an jedem Ort.

Wie werden sich dabei die Anforderungen an die Visualisierung in der Fertigung verändern?

Die moderne Visualisierung soll so einfach zu bedienen sein wie das Smartphone in der Hosentasche und natürlich Multitouchgesten unterstützen. Sie soll komplizierte Zusammenhänge sowie alle relevanten Daten effizient und übersichtlich darstellen. Zunehmend werden im Problemfall On-The-Fly-Erklärungen, zum Beispiel anhand eines eingebetteten Videos eingesetzt um den Anwender zu unterstützen. Des Weiteren soll die Visu-Plattform unabhängig sein, um die Maschine von jeglichem Endgerät aus bedienen und beobachten zu können. Mobile kabellose Bedieneinheiten sind im Vormarsch. Durch die Vernetztheit muss eine zukunftsorientiere Visualisierung auch alle Sicherheitsvorkehrungen mitbringen, um die Maschine vor unberechtigten Zugriffen zu schützen.

Sigmatek hat sich bei der Entwicklung des Lasal Visu Designers gegen ein responsives Design entschieden, wie es heute im Web Design üblich ist. Warum?

Reaktionszeiten sind und bleiben auch in Zukunft wichtig. Der Ressourcenverbrauch einer browserbasierten Visualisierung wird oft unterschätzt. Deswegen gilt es, die Prozessorleistungen so effektiv wie möglich zu nutzen. Wir haben bei der Entwicklung berücksichtigt, was der Anwender wirklich benötigt und setzen deswegen standardmäßig auf ein adaptives Designkonzept. Das ermöglicht eine flexible Darstellung und die Kontrolle über das gesamte Design bei unterschiedlichen Displayformaten. Sollte es doch notwendig sein, die Visualisierung responsiv zu gestalten, ist dies für Power-User selbstverständlich möglich.

Für welche Anwendungen eignet sich Ihre Visualisierungslösung?

Mit dem Lasal VisuDesigner lässt sich die moderne Visualisierung von morgen schon heute erstellen. Die erstellte Lösung nutzt einen optimierten und ressourcenschonenden HTML-Browser. So läuft die Visualisierung auch auf weniger leistungsfähiger und kostengünstiger Hardware flüssig, was sie besonders für Anwendungen, die unter hohem Kostendruck stehen, attraktiv macht.

Unter dem Kosten-Aspekt ist es wichtig, einfach und schnell eine wartbare Visualisierung erstellen zu können. Dank umfangreicher Bibliotheken an Anzeige- und Bedienelementen (Controls) ist dies mit dem VisuDesigner möglich, auch ganz ohne spezielle Programmierkenntnisse. Gleichzeitig stehen dem erfahrenen Power-User sämtliche Möglichkeiten der Webwelt offen. Ein weiterer wichtiger Bestandteil ist die Objektorientiertheit, die es ermöglicht, wiederkehrende Visualisierungselemente, die sich aus mehreren Bedien- und Ansichtscontrols zusammensetzen, nicht immer neu gestalten zu müssen, sondern diese in sogenannte ‚Composite Controls‘ zusammenzufassen und wieder zu verwenden. Mit der Trennung von Programmlogik und Darstellungsform können Oberflächen leicht angepasst und zu einem späteren Zeitpunkt optimiert werden, ohne die Logik neu angreifen zu müssen.

HMI

Was ist Human Machine Interface? Definition, Geschichte & Beispiele

Usability

So lassen sich Maschinen einfach bedienen

(ID:45731996)