Maßgeschneiderte Lösungen,
die funktionieren und begeistern

Unser Designprozess beginnt mit der Analyse, gefolgt von der Konzeption, dem globalen Design und schließlich der Design Ausarbeitung. Die Entwicklung wird, mit den Designphasen verzahnt, parallel durchgeführt.
Unsere Herangehensweise ist nutzungsorientiert. Denn wir möchten nur sinnvolle und verständliche Produkte für die Endnutzer:innen gestalten. Das erreichen wir, indem wir genau diese auch ins Zentrum unseres Designprozesses stellen.

Zu Beginn recherchieren wir den Nutzungskontext und schlussfolgern daraus die passenden Nutzungsanforderungen. Hierbei ist uns methodisches Vorgehen wichtig. So können Ergebnisse jederzeit nachvollzogen und vergleichen werden. Im Anschluss werden die ersten funktionalen Prototypen gestaltet. Diese ermöglichen es uns die Designs frühzeitig mit Benutzer:innen zu testen und so zu überprüfen, ob die Nutzungsanforderungen korrekt abgeleitet wurden. Diesen Prozess wiederholen wir in Iterationen, um schließlich zu einem optimalen Ergebnis zu gelangen.

Wir legen großen Wert auf die Informationsgewinnung am Anfang des Projektes. Sie beinhaltet eine ausführliche Analysephase, in der exemplarische Produkte hinsichtlich ihrer Funktion und Bedienung untersucht werden. Um uns einen umfassenden Einblick in die Bedienung zu verschaffen, ist es erforderlich die Produkte gemeinsam mit den Experten des Herstellers hinsichtlich ihrer Funktionen zu analysieren. Zusätzlich ist geplant auch die Kunden des Herstellers zu besuchen und dort Interviews und Nutzer:innenbefragungen durchzuführen. Die Bedürfnisse unterschiedlicher Benutzergruppen können mit Hilfe von Interviews und Fragebögen (EN ISO 9241-110) erfasst werden. In enger Abstimmung mit dem Hersteller und seinen Fachabteilungen werden im Anschluss die Prinzipien und Strukturen erarbeitet, die als Basis für die anschließende Konzeptionsphase dienen. Diese werden in ein Backlog überführt und mit dem Hersteller gemeinsam priorisiert.

In der Konzeptphase wird das Interface hinsichtlich seiner Informationsarchitektur und Usability entwickelt. Mit Hilfe von Wireframes und Prototyping werden die Bedienabläufe dargestellt und abgestimmt. Das neue Bedienkonzept wird intuitiv und schnell zu erlernen sein. Die Navigationen sind logisch aufgebaut und die Usability steht im Vordergrund. Die Benutzer:innen haben die Möglichkeit, leicht die Prozesse zu überwachen, Parameter zu verändern, Meldungen zu erkennen und Störungen schnell zu beseitigen. Statistik- und Diagnoseinformationen werden übersichtlich dargestellt und unterstützen anstehende Service- und Wartungsarbeiten. Die Bedürfnisse der Anwender:innen spielen eine zentrale Rolle. Eine übersichtliche Gestaltung der alltäglichen Funktionen hat hohe Priorität.

In dieser Projektphase wird das Bedienkonzept sukzessive in das finale Design überführt. Im globalen Design entsteht die grafischen Gestaltung. Hier wird das Corporate Design des Herstellers aus den Bereichen Print und Web berücksichtigt und bei Bedarf für den Bereich Interfacedesign erweitert. Das User Interface ist für multilingualen Einsatz ausgelegt. Navigation und wichtige Funktionen werden durch Icons illustriert. Diese können für die Illustration von Funktionen, für Parametereingaben oder für die Abbildung modularer Produktkomponenten eingesetzt werden. Das Interfacedesign wird auf das Industriedesign des eingesetzten Bedienpanels abgestimmt und für Touch-Bedienung optimiert. Die Ausarbeitung des Designs baut auf dem vorgelagerten globalen Design auf und detailliert die konzeptionelle und gestalterische Ausarbeitung produktspezifisch.

Technischer Durchstich

Im Rahmen eines technischen Durchstichs wird das Frontend exemplarisch an die Steuerung/Backend des Herstellers angeschlossen und die Kommunikation getestet.. Die Anbindung an die Steuerung kann dabei vom Entwicklungsteam oder durch die Herstellungsfirma erfolgen. Das Frontend besteht aus einem Webinterface mit Ausgabe durch UI-Standardkomponenten. Es werden zwei Signale/Berechnungen angezeigt. Die Anzeige ist via JSON-Datei und Texteditor konfigurierbar. Bei der Lieferung handelt es sich um ein geschlossenes System aus Helio Modulen deren Nutzung lediglich auf den Verwendungszweck ausgerichtet sind.

Prototyp

In dieser Projektphase wird Software für den Funktionsumfang des Prototypen erarbeitet. Auf Basis von Software Standardmodulen wird ein Application Server zur Kommunikation mit der zur Verfügung gestellten Beckhoff Steuerung konfiguriert um Echtzeitdarstellung und Datenaufzeichung zu ermöglichen. Darauf aufbauend wird eine HTML5- Webanwendung entwickelt, welche die erhaltenen Daten visualisiert. Die grafische und inhaltliche Ausarbeitung des Frontends ergibt sich aus dem parallel laufenden Designprojekt.

Frontend

Wir arbeiten nach Prinzipien der agilen Entwicklung. Hierdurch erreichen wir ein hohes Maß an Transparenz und Flexibilität und können schnell auf neue oder geänderte Anforderungen reagieren. Gemeinsam mit dem Hersteller erarbeiten wir im Sprint Planning benötigte Features, priorisieren diese und erstellen daraus Arbeitspakete. Unser Ziel ist es, in kurzen Iterationsschritten – meist 4 Wochen – lauffähige Versionen zu entwickeln. Diese werden im Sprint Review mit der Herstellungsfirma abgestimmt und münden in die Planung für den folgenden Schritt. Die Frontend-Software wird am Frontend mit HTML5 & JavaScript umgesetzt. Die Daten werden dabei über vorhandene Steuerungen/Backends von der Herstellungsfirma geliefert. Zur Datenaufbereitung für das Frontend werden von uns entwickelte Standardbausteine verwendet um einen Node.js-Application-Server bereitzustellen.

HMI Management mit Helio

Für maximale Flexibilität kann das Frontend an unser HMI Management Systems Helio angeschlossen werden. Über den Helio Content Editor ist das komplette Frontend inhaltlich konfigurierbar und kann an neue Maschinentypen und Einsatzzwecke angepasst werden. Bei der Projektierung greift der Applikateur auf fertige Seiten- und Widget-Templates zurück, um neue Dashboard-Konfigurationen zu erstellen. Die Aufteilung des Dashboards passt sich dabei adaptiv auf die Anzahl der eingesetzten Widgets an. Je nach gewählter Aufteilung werden Inhalte in den Widgets zu- oder weggeblendet um eine gleichbleibende Lesbarkeit zu gewährleisten. Das alles erledigt Helio automatisch, ohne zusätzlichen Aufwand für den Applikateur. Die Datenpunkte sind über eine standardisierte OPC-UA Schnittstelle an die PLC angebunden und können einfach über den Helio Content Editor verknüpft werden.

Helio Website