Industrial Web-HMIs modern, responsiv und effizient entwickeln
Plattformübergreifend, responsive und performance-stark – Webtechnologien ermöglichen die modernste Form von HMIs, die aktuell auf dem Markt verfügbar sind. Im Interview mit Andreas Beu, Managing Director von Smart HMI GmbH, zeigen wir Euch, wie Ihr Industrial Web-HMIs effizient erstellen könnt – ganz ohne HTML-Programmierkenntnisse. Dabei stellt er Euch das herstellerunabhängige Visualisierungssystem WebIQ vor, das die Funktionalitäten eines HMI / SCADA-Systems mit den Vorteilen von Webtechnologien wie HTML5 & Co vereint.
UID: Ihr von Smart HMI bietet mit WebIQ eine HMI Visualisierungslösung für den Maschinenbau und die Automatisierung. Was genau ist WebIQ?
Andreas: WebIQ ist ein zukunftsweisendes und herstellerunabhängiges Visualisierungssystem, mit dem Maschinen- und Anlagenbauer Industrial Web-HMIs erstellen. Es vereint Funktionalitäten eines HMI / SCADA-Systems mit den Vorteilen moderner Webtechnologie.
UID: Wie unterstützt WebIQ Maschinen- und Anlagenbauer dabei, moderne HMIs zu entwickeln?
Andreas: Das HMI ist für den Maschinen- und Anlagenbauer das Fenster zu seinem Produkt. Unsere Erfahrung zeigt, dass er einerseits ein Visualisierungssystem mit umfassenden Design-Möglichkeiten und vielseitiger Funktionalität benötigt, um moderne HMIs zu erstellen. Andererseits muss er den Aufwand zur Entwicklung, Einführung und Pflege eines modernen HMIs im Griff haben. Salopp gesagt: der Maschinen- und Anlagenbauer hat einen hohen Anspruch an sein HMI, aber sehr eng begrenzte Ressourcen – eigentlich ein Widerspruch.

Als Tool-Hersteller stellen wir uns diesem Widerspruch. Das haben wir getan und bieten mit WebIQ eine einzigartige Lösung an. Auf der einen Seite steht unsere Engineering-Lösung – der WebIQ Designer – mit seinem integrierten und intuitiven WYSIWYG- Layout-Editor (What You See Is What You Get) für das Web-HMI. Dieser richtet sich an Projektierer*innen, Applikations-Ingenieur*innen und Automatisierungstechniker*innen. Das sind Generalisten mit breiter Erfahrung in der elektrischen Automation. Mit Hilfe des Designers kann diese Zielgruppe moderne Web-HMIs ganz ohne HTML-Programmierkenntnisse realisieren und pflegen. Dazu nutzen sie vorgefertigte Bausteine und Vorlagen, welche sie per Drag & Drop in den Layout-Editor ziehen und dort konfigurieren. WebIQ liefert eine Vielzahl an Bausteinen und Vorlagen, welche wir kontinuierlich erweitern. Aber oft kommt der Geschmack mit dem Essen: D. h. unser Kunde hat Bedarf an ganz individuellen Funktionen oder Bausteinen, mit dem sie sich vom Wettbewerb abheben oder die Web-HMI an einen ganz speziellen Cloud-Service anbinden können. Und hier kommt die andere Seite von WebIQ zum Tragen: WebIQ ist ebenfalls ein Entwicklungs-Framework mit umfangreichen Schnittstellen für kundenspezifische Erweiterungen. Dieses richtet sich an Software-Entwickler*innen. Damit können diese ein ganz individuelles Baukastensystem – das "Custom-Package" – erstellen. Dieses können sie wieder zu 100 % in den WYSIWYG-Layout-Editor integrieren. Das ist eine Besonderheit von WebIQ und ermöglicht, dass Projektierer*innen, Applikations-Ingenieur*innen und Automatisierungstechniker*innen diese Erweiterungen anschließend im WebIQ Designer verwenden können.
UID: User Experience wird auch im industriellen Kontext immer wichtiger. Wie wird WebIQ dem gerecht?
Andreas: Die User Experience ist das positive Nutzungserlebnis, welches der Nutzende bei der Interaktion mit einem Web-HMI erfährt. Die User Experience ist die Visitenkarte, die viel zu einem positiven Image eines Maschinen- und Anlagenbauers beisteuert. Dem tragen wir bei WebIQ Rechnung. Wir befähigen unsere Kund*innen, mit WebIQ einzigartige und einfach bedienbare Web-HMIs zu entwickeln – oder kurz gesagt: HMIs, die begeistern. Das ist unser Anspruch.
Wie bereits vorher von mir erwähnt, verfügt WebIQ über eine Vielzahl von vorinstallierten Bausteinen und Vorlagen – unsere IQ Widgets wie Buttons, Anzeige- und Eingabe-Elemente, Menü-Controls, Alarm- und Trendwertanzeigen, etc. Diese haben wir in Zusammenarbeit mit UX-Experten von UID gestaltet. Zusätzlich besteht jedes Widget nicht nur aus dem eigentlichen Bedienelement. Es beinhaltet zugleich Beschriftung, Icon und Einheit sowie eine Vielzahl von Styling-Optionen. Die unterschiedlichen Varianten können durch einfaches Umschalten ausgewählt werden. Mit ein paar Klicks ist das Widget erstellt, sieht sofort gut aus und fühlt sich gut an. Das ist für mich User Experience.

UID: Wie profitieren Kund*innen insbesondere in dieser Hinsicht von der Zusammenarbeit zwischen Smart HMI und UID?
Andreas: Smart HMI und UID können einen umfassenden gemeinsamen Service rund um die Gestaltung und Entwicklung einzigartiger Web HMIs anbieten: vom Konzept & Design, über Entwicklung von Bausteinen und Vorlagen bis zur schlüsselfertigen Realisierung der HMI und der Integration in die bestehende Automatisierung. Die Kund*innen bekommen alles aus einer Hand – von einem eingespielten Team. Maschinen- oder Anlagenbauer profitieren von der Zusammenarbeit speziell dann, wenn er ein individuelles Web-HMI mit einem individuellen Design und kundenspezifischen Erweiterung erstellen will.
WebIQ basiert zu 100% auf Webtechnologie? Warum setzt ihr auf HTML5? Warum ist HMTL5 die Technologie der Zukunft für den Maschinenbau? Welche Vorteile ergeben sich im Hinblick auf andere UI-Hochsprachen wie .NET etc?
Andreas: Webtechnologie basiert auf verschiedenen Standards, wie HTML5, JavaScript, CSS, SVG und vielen mehr. Viele namhafte Unternehmen treiben die Entwicklung dieser Technologien voran, aber diese besitzen die Technologie nicht. Im Gegenzug dazu gehört .NET Microsoft. Nutzende von .NET begeben sich bis zu einem gewissen Grad in Abhängigkeit zum Anbieter. Bei WebIQ setzen wir ausschließlich auf Standardtechnologien. Neben verschiedenen Webtechnologien ist das der industrielle Kommunikationsstandard OPC UA, welchen wir standardmäßig unterstützen. So sichern wir unseren Kund*innen eine langfristige Wertschöpfung mit deren Web-HMI. Daneben ist moderne Webtechnologie – unserer Meinung nach – eine der leistungsfähigsten und dynamischsten Entwicklungsplattformen, die man gegenwärtig finden kann. „Geht nicht“ gibt es bei Webtechnologie praktisch nicht. In der weltweiten Web-Community haben engagierte Entwickler*innen für viele Fragen bereits Antworten entwickelt. Das hat dazu geführt, dass – und mit dieser Meinung stehen wir nicht alleine – die moderne Webtechnologie heute als Schlüssel für den digitalen Wandel gesehen wird. Und eine weitere wichtige Stärke darf man nicht vergessen: Web-HMIs sind plattformunabhängig und laufen auf nahezu jedem System! Das kann ein HMI, das auf .NET basiert, nicht leisten.
Welcher Bedeutung kommt in diesem Zusammenhang eine Responsive Gestaltung bei?
Andreas: Dass ein Web-HMI technisch überall dargestellt werden kann, wo ein Web-Browser läuft, hat sich bereits herumgesprochen. Dank der responsiven Gestaltung passt sich ein und dasselbe Web-HMI automatisch an die unterschiedlichen Bildschirmgrößen und -orientierungen an – je nachdem, ob es auf einem Full-HD-Touch-Screen, einem 10‘‘ Tablet oder einem Smartphone dargestellt wird.


Unsere Erfahrungen mit verschiedenen Maschinen- und Anlagenbauern zeigen, dass diese Funktionalität für viele Unternehmen aus ganz unterschiedlichen Gründen interessant ist: Ein Grund ist die Möglichkeit, mobile Smart Devices, wie Tablets und Smartphones einzubinden. Eine andere Motivation ist mehr Flexibilität bei der Auswahl der Lieferanten der Touch-Panels. Hier sind vor allem sogenannte Web Panels – oft linux-basiert mit vorinstalliertem Web-Browser und günstigen Preisen – auf dem Vormarsch.
WebIQ liefert für die responsive Gestaltung eine Vielzahl von Funktionen wie den smarten Layout-Container mit dem leistungsfähigen Flex-Design, responsive Widgets und geräteabhängige Style-Funktionen. Allerdings ist die responsive Gestaltung für viele Maschinen- und Anlagenbauer anfangs sehr ungewohnt. Denn sie müssen sich beim Realisieren des HMI von etablierten Vorgehensweisen wie dem festen Positionieren von Controls an einer xy-Position verabschieden. Insbesondere ein Konzept für das responsive Verhalten auszuarbeiten, stellt eine Herausforderung dar. Hier hilft die Zusammenarbeit mit erfahrenen UI-Experten wie den Kollegen von UID, erste Hürden zu überwinden und ein initiales Konzept und Design zu erarbeiten.
UID: Was rätst Du Unternehmen, deren Anwendungen aktuell in .NET, Qt etc. entwickelt sind? Wann lohnt ein Wechsel? Kann WebIQ einen Wechsel erleichtern, wenn ja wie?
Andreas: Der Technologie-Umstieg beispielsweise von .NET oder Qt nach Web ist immer eine kniffelige Sache. Unternehmen haben vorher sehr viel in eine andere Technologie investiert. Und ich rede hier nicht nur von der Entwicklung an für sich. Unternehmen haben eine ganze Toolchain dafür aufgebaut und Mitarbeitende speziell für diese Technologie eingestellt und ausgebildet. Dazu kamen noch die ganzen Erfahrungen, die man sammeln musste, die ganzen Umwege, die man gehen musste, bis die Entwicklung mit einer bestimmten Technologie sattelfest war. Ganz klar: Der Umstieg von einer Technologie auf die Webtechnologie ist eine Herausforderung.
Daher sollten sich Unternehmen im Vorfeld immer überlegen, was sie aus einer bestehenden Entwicklung in die Webtechnologie „hinüberretten“ können. Die Kollegen von UID haben dazu speziell für das Thema HMI-Entwicklung ein wunderbares Whitepaper erstellt, welches hierbei eine gute Hilfestellung gibt. Ferner ist es wichtig, dass Unternehmen den Umstieg immer als Prozess begreifen. Selten gelingt der Umstieg mit einem großen Schritt. Viele kleine Schritte sind meines Erachtens die deutlich bessere Strategie. Und zu guter Letzt wünsche ich mir hier mehr Macher-Attitude – so wie es beispielsweise in den USA üblich ist. Wichtig ist vor allem, einfach anzufangen und Erfahrungen zu sammeln.

Ihr wollt mehr über WebIQ erfahren?
Du hast noch Fragen zu Web-HMIs im Allgemeinen oder zur HMI-Visualisierungslösung WebIQ? In unserer WebIQ-Demo beantworten wir alle Deine Fragen in einer individuellen 1:1 Session.
Interview-Partner
Andreas Beu ist Geschäftsführer und Gründer der Smart HMI GmbH. Er ist dort für die Geschäftsentwicklung und Kundenbetreuung zuständig. Der Diplom-Ingenieur ist Experte für die Gestaltung nutzungsfreundliche und mobile HMIs für Embedded Systeme, Maschinen und Anlagen sowie für Bedienoberflächen von Automatisierungssystemen. Davor arbeitete er unter anderen über dreizehn Jahre in verschiedenen Positionen bei UID. Andreas Beu ist im Forum "IT@Automation" des Verband Deutscher Maschinen- und Anlagenbau e.V. (VDMA) aktiv und leitet dort verschiedene Arbeitskreise.

Weitere Infos
- Whitepaper: Software zu HTML5 portieren
- Connected Industry: Aufbruch in die Industrie 4.0
- UID News: UX als Schlüssel zum Unternehmenserfolg
- UID News: Designsysteme: Mehr Konsistenz & Effizienz in Design und Software
- UID News: Hello, future – Dimensionen eines modernen HMI
- UID News: Einheitlich intuitiv – Erfolgsfaktoren fürs HMI
- UID News: Frontend: Welche UI Technologie für Euer Software-Projekt?
- Mehr über Smart HMI und WebIQ