Ich erstelle viele Benutzeroberflächen mit JSL, einige sind einfach, andere viel komplizierter, aber die meisten folgen ähnlichen Prinzipien: Die Skripte verwenden ähnliche Vorlagen, sie haben ein ähnliches Layout im Launcher, Berichte sehen ähnlich aus usw.
In dieser Präsentation zeige ich, wie ich JSL zum Skripten von JMP-ähnlichen Benutzeroberflächen verwende, welche Arten von Vorlagen ich bevorzugt nutze und welche Entscheidungen ich bei der Entwicklung solcher Plattformen treffe. Außerdem demonstriere ich verschiedene Anzeigefelder, die Erstellung einer Benutzeroberfläche mit JSL, Skriptvorlagen, meinen Entscheidungsprozess beim Skripten von Benutzeroberflächen sowie einige Tipps und Best Practices für das JMP-Skripten.
Willkommen zu meiner Posterpräsentation über die Entwicklung von Benutzeroberflächen mit strukturiertem JSL. Kurz zu mir: Ich arbeite bei More of Electronics in Finnland und bin Spezialist für Datenintegration und Data Science im Datenintegrationsteam. Zu meinen Aufgaben gehört die Entwicklung kundenspezifischer JMP-Anwendungen. Wie ich diese erstelle, genauer gesagt, wie ich die Inhalte darin strukturiere, ist Thema dieses Posters. Ursprünglich war es als wissenschaftlicher Artikel geplant, daher musste ich es sehr schnell fertigstellen, aber es sollte in Ordnung sein.
Legen wir gleich los. Das Wichtigste an diesem Poster ist meiner Meinung nach, dass Sie versuchen sollten, JMP-Plattformen nachzuahmen. Der Grund dafür ist, dass die Nutzer damit bestens vertraut sind. Wenn Sie Ihre Inhalte ähnlich wie JMP strukturieren, können sie Ihre Tools viel schneller nutzen.
Hier sehen wir ein Beispiel der JMP-Plattform. In diesem Fall handelt es sich um eine einfache Distribution. Links befindet sich der Launcher, rechts der Bericht. Sowohl im Launcher als auch im Bericht ist ein Symbol für den Fenstertitel zu sehen. JMP organisiert Inhalte in Panels. Links können Sie Spaltenauswahlfelder im Filterspaltenauswahlfeld generieren. Darunter finden Sie gegebenenfalls weitere Optionen.
In der Mitte befinden sich diese Schaltflächen. Die beiden nächsten Schaltflächen sind Spaltenlisten, in denen der Benutzer die Spalten auswählen kann, die er analysieren oder mit denen er Aktionen durchführen möchte. Die Standardbezeichnung gibt auch Auskunft über den Verwendungszweck dieser Spalten. Auf der rechten Seite befinden sich die Aktionsschaltflächen.
In den Berichten ist die Struktur üblicherweise sehr vertikal. In diesem Fall verwende ich Statuten, um meine Meinung besser sichtbar zu machen. Der Inhalt ist in einer Eltern-Kind-Struktur, also einer Hierarchie, angeordnet und wird üblicherweise mit Rahmen und roten Dreiecken dargestellt. Wir verwenden diese Struktur, da Benutzer Architekturen und Analysen direkt über diese roten Dreiecke starten können. Der Inhalt ist durch Bereiche wie Tabellen und andere Gliederungsfelder strukturiert. JMP-Benutzer sind mit dieser Art von Struktur vertraut.
Wenn Sie über Ihr Tool und Ihre Nutzer nachdenken, überlegen Sie, wie diese Ihr Tool verwenden werden. Dafür können Sie beispielsweise Storyboards nutzen. Es muss nicht so aussehen wie dieses Diagramm hier. Sie können es auch im Comic-Stil gestalten. Wir haben auch diese Art der Ansicht: Zuerst wird eine Ansicht angezeigt, dann klickt der Nutzer auf etwas, und dann wird die nächste Ansicht angezeigt usw.
Beim Aufbau dieser Anwendung ist es hilfreich, sich die Funktionsweise der JMP-Plattform vorzustellen, um so wieder an die gewohnte Arbeitsweise zu gelangen. Ich werde das hier nicht im Detail erläutern. Dies ist lediglich ein Beispiel, wie es umgesetzt werden könnte.
Ein paar Mockup-Beispiele. Eine kurze Demonstration oder ein erster Entwurf für Ihre Benutzeroberfläche. Hier habe ich eine sehr einfache Papierversion. Damit fange ich gerne an. Sie lassen sich schnell anpassen und bei Bedarf aktualisieren. Falls etwas nicht stimmt, kann man sie einfach neu erstellen. Normalerweise wende ich mich dann direkt an jemanden mit JMP-Kenntnissen. Das hier ist sehr simpel, aber ich kann es ausprobieren. Das funktioniert, das nicht, und ich kann es bei Bedarf anpassen. Vielleicht kann ich meine Vorlage verwenden, um eine etwas übersichtlichere Version zu erstellen und zu sehen, wie sie in der Realität aussieht.
Nächstes Modell. Ähnlicher Bereich, zuerst Papier, dann habe ich ein separates Werkzeug verwendet. In diesem Fall heißt es Excalidraw. Erstellen Sie ein Modell. Ich könnte hier zusätzliche Notizen hinzufügen usw. und einen etwas fortgeschritteneren JMP-Prototyp zur Demonstration erstellen. Dies stammt bereits aus der Prototyp-Anwendung, aber Sie könnten dies teilweise selbst erstellen.
Es gibt einen Datenfilter und einen Diagrammgenerator. Dieser kann komplett separat sein. Er enthält Bilder aus einer anderen Quelle. Wenn Sie dieses Layout gerade konfiguriert haben, verschieben Sie diese Bilder in ein separates Tool. Ich werde höchstwahrscheinlich PowerPoint verwenden. Dort lassen sie sich leicht verschieben. Sie können die Struktur dort festlegen und sich so einen besseren Überblick über die Benutzeroberfläche verschaffen.
Als Nächstes sollten Sie Vorlagen verwenden und dabei die Benutzerfreundlichkeit nicht außer Acht lassen. Ich selbst nutze eigene Vorlagen im Skriptstil. Der Grund dafür ist, dass ich Apps dadurch schneller entwickeln kann. Diese Vorlagen sind robuster und sehen professioneller aus. Außerdem gestalte ich meine Benutzeroberflächen nicht für höhere Auflösungen, sondern eher für solche unterhalb von Full HD, da die meisten Nutzer diese Auflösung für höhere Auflösungen immer noch verwenden.
Die Benutzererfahrung. Da JMP ein sehr interaktives Tool ist, halte ich es für wichtig, auch die Benutzererfahrung zu berücksichtigen. Nicht nur die Benutzeroberfläche selbst. Ich habe einige Beispiele für eine schlechte Benutzererfahrung. Eines davon sind Modellfenster. Beispielsweise wird bei der LAN-Freigabe über ein Modellfenster ein Modellfenster verwendet. Der Benutzer kann nicht zur Datentabelle zurückkehren und sehen, welche Spalten er verwenden soll. Er muss zuerst den Launcher schließen, die Tabelle schließen und dann den Launcher erneut starten. Das ist meiner Ansicht nach eine schlechte Benutzererfahrung.
Ein weiterer Punkt ist, dass sich Fenstergrößen ändern, wenn man ausklappbare Rahmen usw. verwendet. Ich versuche, die Fenstergröße nach der Erstellung festzulegen und die Navigation dann über eine Scrollleiste zu steuern. Außerdem werden Symbolleisten und Menüs nicht ausgeblendet, da man in JMP separate Plattformen starten kann. Man kann eine Plattform geöffnet haben, über das Symbolleistenmenü die nächste Plattform starten, was die Analyse deutlich beschleunigt.
Ich vergleiche meine Plattformen mit den JMP-Plattformen. Oben sehen wir die JMP-Plattformen. In diesem Fall handelt es sich um eine schmalere Plattform, die sich unten stark ähnelt. Links befinden sich Spaltenauswahlen, rechts die allgemeinen Listen, in die der Benutzer Elemente hinzufügt, und Aktionen. Der größte Unterschied zum Launcher ist hier der Tabellenname, der gerade analysiert wird. Bei Maneve-Plattformen wäre der Anwendungsname möglicherweise auch sichtbar, hier jedoch nicht.
Aber dort gibt es größere Unterschiede als in unseren Berichten. Ich habe meine Felder nicht geöffnet, da ich bereits alle Optionen für den Benutzer definiert habe. Er muss nicht auf die Menüs mit den roten Dreiecken zugreifen. In JMP-Plattformen ist dieser Zugriff jedoch erforderlich. Ich kann Seitenfelder und Tabellenfeldfelder verwenden.
Ich denke, der noch größere Vorteil ist, dass ich meine Inhalte horizontal anordnen kann, da wir breitere und höhere Bildschirme haben. Viele JMP-Plattformen sind sehr lang. Ich bevorzuge die breitere Anordnung, da die Bildschirme kleiner sind und ich so mehr Platz habe. Hier ist außerdem die Tabelle und der Anwendungsname sichtbar.
Hier ist eine Beispielanwendung. Wir werden zwei Beispiele zeigen, aber ich habe sie schon kurz erläutert. Dies ist im Grunde das Skript, das der Benutzer ausführt, um meine Anwendung zu starten. Ich habe die verschiedenen Teile des Skripts mit ihren jeweiligen Verantwortlichkeiten aufgeteilt. Konfiguration, Hilfsprogramme und Benutzeroberfläche befinden sich in einem separaten Skript, was die Verwaltung meiner Meinung nach vereinfacht.
Dann folgt das Skript. Dieses Hauptskript gibt einen Starttext aus, der prüft, ob die Tabelle geöffnet ist, ob das Fenster bereits geöffnet ist und ob alle diese Bedingungen erfüllt sind – dann läuft die Anwendung. Abhängig vom Ergebnis dieser Prüfung wird dem Benutzer möglicherweise ein Fehler bezüglich des Modalfensters angezeigt. Wenn das Fenster beispielsweise bereits geöffnet ist und es sich nicht um ein Modalfenster handelt, wird die Anwendung in den Vordergrund gebracht, sodass der Benutzer weiterarbeiten kann.
Unten sehen Sie das Hauptfenster nach dem Start der Anwendung. Dadurch wird das Anwendungsfenster erstellt. Die einzelnen Ausdrücke sind hier in separate Ausdrücke unterteilt. Kleinere Ausdrücke außerhalb dieses neuen Fensters lassen sich viel einfacher verwalten als sehr lange, möglicherweise hunderte Zeilen umfassende Ausdrücke in einem neuen Fenster. Diese sind in der Regel schwer zu handhaben.
Manchmal sind einige Bewertungen und die Berücksichtigung verschiedener Fähigkeiten erforderlich, aber im Allgemeinen halte ich diese Vorgehensweise für besser. Ein Beispiel hierfür finden Sie in der Community, weitere Beispiele stammen aus einer Präsentation, die ich 2023 in einer finnischen Anwendergruppe gehalten habe.
Hier eine kurze Zusammenfassung für dieses Poster: Orientieren Sie sich an den Startvorgängen und Berichten der JMP-Plattform, da die Nutzer damit bereits vertraut sind. So können sie sich schneller an Ihr Tool gewöhnen. Überlegen Sie, wie Ihre Nutzer Ihre Anwendung verwenden werden. Erstellen Sie Storyboards und Mockups, um schnell zu sehen, wie es aussehen könnte. Fügen Sie Vorlagen hinzu. Sie können robuste und professionelle Anwendungen mit Schleifenfunktion erstellen. Machen Sie sich mit den gängigsten Anzeigefeldern und der Inhaltsorganisation in JSL vertraut.
Da JMP ein sehr interaktives Werkzeug ist, sollte die Benutzerfreundlichkeit nicht vernachlässigt werden, da sie bei JMP von großer Bedeutung ist. Achten Sie daher auf die Benutzerfreundlichkeit und die Benutzeroberfläche. Vielen Dank.
