Das Layout
Die Benutzeroberfläche der Bitergo WMS web Apps ist in vier Bereiche aufgeteilt:
- Header
enthält die Überschriften und ein Menü mit Basiszugriffen auf grundsätzliche Elemente - Footer
enthält Status-Informationen zur Session, Applikation, etc und copyright-Informationen. - Work
ist das eigentliche Arbeitsfenster, in dem die Daten angezeigt oder die Formulare zur Eingabe eingeblendet werden. - Navigation (klappbar)
ermöglicht die Anwahl von verschiedenen Work-Inhalten innerhalb der Applikation und evtl. Referenzen auf die anderen Apps. - Preview (klappbar)
enthält Daten zu einem selektierten Objekt innerhalb des Work-Containers bzw. weitere Zusatzdaten zu dem Inhalt des Work-Containers.
Generell ist eine Erweiterung der Bereiche über die Grenzen des Previews hinaus möglich. Die Trennung zwischen den Bereichen Navigation-Work-Preview ist nicht starr. Der Benutzer kann die Breite der drei Bereiche je nach Anforderung anpassen.
Das Grundlayout ist in erster Linie für die Desktop-Nutzung vorgesehen. Prinzipiell ist das Layout jedoch auch für die mobile Nutzung möglich. Der Bereich der Navigation-Work-Previews kann dann horizontal über eine "Wischen"-Geste leicht gewechselt werden. Header und Footer werden deutlich vereinfacht dargestellt und sehr schmal gehalten.
Konkret sieht der Aufbau am Beispiel der Stammdaten-App wie folgt aus:
Header
Der Header-Bereich wird ständig unverändert im oberen Bereich des Browserfensters angezeigt.
Er besteht aus
- dem App Icon zur Wiedererkennung
- der Bezeichnung der App-Gruppe "logistics mall Basis Apps"
eine einheitliche Gruppierung aller Basis-Apps als Ergänzung des Icons und für alle Basis-Apps einheitlich - der Bezeichnung der App
besteht aus dem Namen der App (hier: Lagerstammdaten) und der Zuordnung zum Funktionsbereich (hier: Artikelstamm). - dem Menü-Icon. Nach dem Betätigen des Icons wird ein Dropdown Menü mit folgenden Optionen angezeigt.
- Navigation sichtbar schaltet den Navigationsbereich ein und aus
- Preview sichtbar schaltet den PreViewbereich ein und aus
- Excel Export: Durch Klick auf Excel Esport wird ein generischer Export der im Workbereich sichtbaren Tabelle erstellt
- Sprache ändern: Wählen Sie zwischen deutsch und englisch als Sprache für die web App
- Einstellungen: Hier finden Sie weitere Einstellungen für die Apps, wie z.B. das Auswähöen eines Etikettendruckers
- Abmelden meldet den Benutzer von Bitergo WMS – Warehouse Star ab und schließt die App
Navigation
Über die Navigation können Sie zwischen den unterschiedlichen Funktionsbereichen für die jeweilige web App wechseln. Sie wird als Tree ausgeführt.
Neben den Funktionsbereichen (hier zum Beispiel Artikelstamm, Stückliste, Lagerplatz, Lagerplatz-Stamm etc) können hier auch Funktionsvarianten stehen, wie z.B. vordefinierte Filtereinstellungen.
Work – Arbeitsbereich
Der Work-Bereich beinhaltet die eigentlichen Dialoge der App und enthält mit Ausnahme der Sonderbereiche und des Sonderfensters (s.u.) alle Darstellungen und Bearbeitungsdialoge. Grundsätzlich sollten hier Inhalte gezeigt werden, mit denen über einen gewissen Zeitraum gearbeitet werden kann. Typischerweise verändern Funktionen (Buttons) die dargestellten Inhalte und nach der Funktionsausführung wird der Bereich in der geänderten Darstellung (z.B. andere Inhalte in der Tabelle) wieder dargestellt.
In der Ausprägung mit einer Liste ist der Aufbau vorgegeben. Zentraler Bestandteil ist eine Tabelle, die formatfüllend (horizontal) im Layout platziert wird.
- Tabelle
Tabelle mit Spaltenüberschriften und den zeilenorientierten Zellen. Es können eine oder mehrere Zeilen selektiert werden. Grundsätzlich werden mit einem Click ganze Zeilen selektiert. Ein Doppel-Click für die Bearbeitungsfunktion (Standardbearbeitung) durch bzw. öffnet ein entsprechenden Fenster. Die Tabelle nutzt die ganze Breite des Work-Layouts. Das Nachladen (lazy-loading) von Tabelleninhalten wird über die vertikale Scrollbar ausgelöst. Tabellen sind immer sortiert nach der ersten Spalte. - Filter
Oberhalb der Tabelle können Filter definiert werden bzw. Funktionen, die das Laden der Tabelle betreffen. Standardmäßig wird ein Filterbezeichner (Textfeld) vorgegeben und rechts daneben der Filter-Button. Über den Filter-Button wird ein Filterfenster geöffnet, in dem man die Tabelleneinträge nach bestimmten Kriterien filtern kann. Filter können mit Namen versehen werden. Diese Namen werden dann in dem Textfeld neben dem FilterButton gezeigt. - Tabellensummenbereich
direkt unterhalb der Tabelle ist eine rechtsbündige Anzeige von Summationsfeldern aus der Tabelle vorgesehen. Standardmäßig wird linksbündig die Selektion eingeblendet (n von m Zeilen selektiert). - Funktionsbereich
Unterhalb und wiederum rechtsbündig sind die Funktionselemente für das Auslösen von Funktionen zu den Tabellen-Inhalten untergebracht. Diese benötigen z.T. eine Selektion oder auch 1..n Selektionen. Buttons, die eine Selektion benötigen, werden auf inaktiv gesetzt, wenn keine Zeile selektiert wurde. Die Reihenfolge der Buttons ist von links nach rechts gemäß der Häufigkeit der Benutzung. Als Standardbeispiel für ist die Reihenfolge für Editieren: NEU..., BEARBEITEN..., KOPIERENund LÖSCHEN.... Da alle Buttons einen Folgedialog haben, erhalten die Labels drei Punkte angehängt.
Das Worklayout erhält standardmäßig keinen Schliessen-Button. Das Fenster kann nicht geschlossen werden. Es wird vom Benutzer entweder eine andere Funktionalität über die Navigation aufgerufen, oder die gesamte App verlassen.
Folgefenster werden über das Worklayout eingeblendet und ersetzten das aktuelle Worklayout. Folgefenster sind nicht über die Navigation erreichbar und enthalten außer den Funktionsbereichen noch einen Fertig Button.
Zusatzfenster bzw. Dialoge werden überlagernd mittig auf dem Worklayout mit einem Schatten dargestellt. Wenn ein Dialog eingebledet wird, ist keine Bedienung der Hintergrundfenster möglich. Die Dialoge müssen geschlossen werden, bevor weiter gearbeitet werden kann.
Standardmäßig sind entweder ein SCHLIESSEN oder ein OK und ABBRECHEN vorhanden, die zu einem Schließen des Fensters führen. Generell kann auch die Escape-Taste (ESC) benutzt werden, die das Fenster – ohne Buchen – schnell schließt.
Preview
Der Preview-Bereich zeigt alle Detailinformationen an für ein im Arbeitsbereich selektiertes Element.
Inbesondere falls im Arbeitsbereich eine Zeile ausgewählt wurde, ist dies praktisch, da man dann für die Details nicht unbedingt in der Tabelle horizontal scrollen muss.
Footer
Der Footer-Bereich wird ständig unverändert im unteren Bereich des Browserfensters angezeigt.
Er besteht aus
- Anmeldeinformationen des aktuellen Benutzers
- Verbundener Server für das Kundensystem
- Version der Software
- Copyright-Hinweise der Software
Sonderlayouts
Für besondere Arbeitsplätze kann von dem Grundlayout abgewichen werden.
Operative Dialoge
In operativen Dialogen werden gewerbliche Mitarbeiter in der Produktion bzw. im Lager unterstützt. Der Mitarbeiter (Werker) muss den Dialog schnell bedienen können. Hier gelten grundsätzlich andere Anforderungen, wie an Büro-Arbeitplätzen:
- Falls möglich nur mit einem zentralen Arbeitsfenster arbeiten
- Zusatzinformationen erscheinen nicht als getrennte Dialoge, sondern als Fenster (Overlay) , die mit Schließen (OK - Abbrechen) wieder geschlossen werden können
- Tastaturbedienung sollte schnell und vollständig möglich sein, das gilt insbesondere für die Verwendung von Funktionstasten
- Maus wird nur in Sonderfällen verwendet
- Differenzierung zwischen primären Informationen mit großen Schriftgrößen und Zusatzinformationen mit kleinen Schriftgrößen
- Anbindung eines Scanners mit Steuerung über Prefix und Postfix muss generell berücksichtigt werden.
Der Aufbau des Arbeitsfensters orientiert sich stark an der zu erfüllenden Aufgabe bzw. der Durchführung der geplanten Prozesse an dem Arbeitsplatz. Ein Beispiel hierfür ist die Web App Verpacken:
