Schnittstellendesign für Industriesteuerungen

Hallo! Mein Name ist George, ich bin Designer.

Während wir alle nach Hause gehen, habe ich beschlossen, meine Erfahrungen bei der Entwicklung des Schnittstellendesigns für die industrielle Automatisierung zu teilen. So kam es, dass eine große Anzahl von Fachleuten mit dem Anwendungsdesign und dem Website-Design befasst war. Es gibt jedoch nicht so viele gute spezialisierte Schnittstellen für die Verwaltung von Engineering-Systemen.

Aus irgendeinem Grund wird allgemein angenommen, dass Design in dieser Branche nicht benötigt wird. Wenn ein Ingenieur das System nicht verstehen kann, zeigt es eher seine Qualifikationen an und nicht, dass die Schnittstelle schlecht durchdacht werden kann. Die Informationen werden in einem chaotischen Satz dargestellt. in denen es unmöglich ist, schnell zu navigieren, was wiederum zu Überlastung und Benutzerfehlern führt.

Zunächst erkläre ich Ihnen, wie ich die Schnittstelle des Bedienfelds für das Lüftungssystem für die Segnetics-Software erstellt habe. Wir haben das Projekt mit der Untersuchung des Benutzers und der Betriebsumgebung begonnen. Wir haben detailliert untersucht und modelliert, wie und wo unser Panel verwendet wird. Oft handelt es sich dabei um halbdunkle technische Räume, eine Anordnung auf Brettern oder Installationen. Als sie dies erkannten, suchten sie nach Analoga und Wegen, um ähnliche Probleme zu lösen. Wir haben viele Schnittstellen durchgesehen: medizinische Geräte, Automobile, Management von Produktionssystemen usw. Wir haben beschlossen, dass uns der Schnittstellenstil moderner Flugzeuginstrumente gefällt. Der Hauptvorteil besteht darin, dass der Pilot nur wichtige Informationen lesen sollte, die so schnell wie möglich von visuellen Geräuschen befreit sind. Mit diesem Prinzip haben wir den Grundstein für die gesamte zukünftige Schnittstelle gelegt und sind zum Prototyping übergegangen.







In der Anfangsphase skizzierten wir die Hauptblöcke in der natürlichen Größe des Bildschirms und gossen das Programm in die Steuerung, um die Bereiche zu überprüfen, in denen die Elemente gedrückt wurden, die Übergangslogik.
Nachdem wir das Layout genehmigt hatten, wechselten wir zur Skizzensuche. Wir haben eine Vielzahl von Optionen für Skizzen und Stile durchlaufen. Sie verstanden ungefähr, was wir wollten, beschlossen, eine detailliertere Studie zu versuchen, aber ein kleines Fragment. Eben? Skeuomorphismus? Nehmen Sie vielleicht den Stil des Zeichnens von Grafiken?







Allmählich finden wir das Bild, das zu uns passt, und beginnen zu studieren. Der Hauptbildschirm, mit dem der Bediener interagiert, ist das Mimikdiagramm. Es sollte die wichtigen Parameter des Zu- und Abflusses, den Status und den Status der Geräte im System anzeigen. Wir schauen uns einige Tricks in Flugzeugen an, sammeln ein Mimikdiagramm, beobachten es bei maximaler Belastung und wie es in 90% der Fälle aussehen wird.











Wir genehmigen den allgemeinen Stil und fahren mit der Entwicklung der verbleibenden Bildschirme fort. Am interessantesten ist der Bildschirm für die Setup-Aufgabe. Wir haben verschiedene Optionen durchgesehen - eine Handyauswahl, die Eingabe einer Nummer über die Tastatur usw. Und sie entschieden, dass es cool ist, einen Touch-Dimmer für die grobe Einstellung einer Zahl und die + \ - Tasten für eine genauere zu machen. An dieser Stelle möchte ich mich ganz herzlich bei den Programmierern von Segnetics bedanken, die dafür gesorgt haben, dass sich das Stimmrad reibungslos dreht und während des Stopps gut spielt. Es ist wahr, es ist sehr hoch geworden.

Wir arbeiten alle Bildschirme durch und animieren Geräte, heißt es. Unfälle, Gefrieren, Bandrisse, wie der Filter-BH beim Starten und Stoppen des Systems aufgeblasen und entleert wird. Wie Fortschrittsbalken gefüllt werden.









Im nächsten Schritt haben wir die Bedienfeldschnittstelle für die Verwendung in einem anderen Controller angepasst. Wir haben die Funktion zum Erstellen eines Zeitplans hinzugefügt und den Hauptbildschirm geändert, da dieser Controller nur eine bestimmte Installation steuern kann, während das Panel die Verwaltung mehrerer Systeme unterstützt.







Kunde des nächsten Projekts war das Autowaschnetzwerk Moscow Cooga in Moskau.

Ich habe einen befreundeten Programmierer, der hier exzellente Programmierkurse für Ingenieure leitet (plc-edu.pro). Er hat mir eine Frage gestellt. „Gog, ich mache hier ein Selbstbedienungs-Autowaschprogramm. Der Kunde möchte, dass alles professionell und cool aussieht. Können Sie uns dabei helfen? “

Als Designer musste ich die Logik der Interaktion zwischen Benutzern verschiedener Ebenen mit der Benutzeroberfläche formulieren. Verstehen Sie, welche Daten alle Benutzer sehen sollten und welcher Zugriff nur über ein Kennwort erforderlich ist. Wie kann die Logik der Einstellungsaufgabe so aufgebaut werden, dass sie intuitiv ist und kein mehrseitiges Handbuch erfordert?

Zu Beginn habe ich eine Liste der Rollen und der für sie wichtigen Schritte erstellt. Was muss getan werden, um dieses oder jenes Szenario zu implementieren?



Als Ergebnis haben wir in Abb. 1 einen interaktiven Prototyp erhalten, der alle grundlegenden Funktionen und Aktionen zeigt. An diesem Prototyp führte ich mehrere Tests durch, um die Entwurfshypothese und -logik zu testen.



Wie die Benutzeroberfläche am Ende aussieht, ist nicht weniger wichtig (obwohl viele Leute anders denken) als die Funktionsweise des Dienstes. Aussehen bildet den Eindruck des Dienstes. Es schafft eine Stimmung. Baut eine emotionale Verbindung zwischen dem Gerät einer Person auf. Es ist das Design, mit dem die Nutzung des Dienstes Spaß macht. Wenn Sie eine lange Beziehung zu Ihrem Kunden aufbauen möchten, achten Sie darauf. Nachdem wir alle Symbole, Schaltflächen und deren Status gezeichnet haben, fahren wir mit der Programmierung fort.







Hier möchte ich separat darüber sprechen, wie Figma das Leben leichter macht. Ich habe meine erste Lüftungsschnittstelle in Illustrator gezeichnet. Ich musste Hunderte von Elementen und deren Status in PNG schneiden, um viele Ordner zu speichern. Machen Sie Pixel für Pixel ein Markup der Position von Elementen auf dem Bildschirm. Zum Glück ist das alles heute nicht mehr nötig. Wir fügen den Programmierer der Arbeitsdatei der Figuren hinzu und er kann bereits im Prototypenstadium sehen, welche Mechanik verwendet wird, und seine eigene Einschätzung der Möglichkeit abgeben.

Ein weiteres kleines Projekt ist die Ausstellungsschnittstelle zur Nachahmung des Betriebs eines Wärmepumpenreglers für Thermex.

Ich werde mich nicht wiederholen, der Weg ist der gleiche - von den Nutzungszielen und dem Prototyp bis zur endgültigen Führung der Schönheit. Das Projekt wurde 2 Wochen von der Vertragsunterzeichnung bis zum endgültigen OK des Kunden abgeschlossen.











Parallel zu Automatisierungsprojekten arbeitete ich an Schnittstellen für medizinische Systeme. Ein Antrag für Ärzte der Zulassungsabteilung, ein Antrag für Bezirksärzte, die nach Hause gehen. Registrierungsschnittstelle und Design des Arzneimittelverschreibungssystems. Bei Interesse werde ich es Ihnen beim nächsten Mal sagen.

Offen für die Zusammenarbeit und ich werde für konstruktive Kritik dankbar sein!