UI-Konfiguration in App Studio

Das UI-Modell bietet die nötige Flexibilität, damit Entwickler Frontend-Komponenten effizient mit Backend-APIs verbinden können. Der UI-Layer in der Pega-Plattform-Architektur folgt dem Prinzip der Trennung von Belangen (auch „Separation-of-Concerns-Prinzip“) – ein Grundsatz der Softwareentwicklung zur Förderung der Software-Modularität, nach dem eine Anwendung unterschiedliche Teile für jede Problemstellung haben sollte.

Mit der Pega-Plattform vermeiden Sie unnötige Komplexität und eine uneinheitliche Benutzeroberfläche. Dafür wird ein UI-Modell verwendet, bei dem Sie Anwendungen mit Ansichten, Vorlagen und Widgets erstellen.

Klicken Sie in der folgenden Abbildung auf die Pluszeichen (+), um mehr über die UI-Elemente zu erfahren:

Für neue Anwendungen, die Sie mit der Pega-Plattform entwickeln, generiert das System automatisch mehrere Ansichten, mit denen Sie in App Studio sofort mit der UI-Konfiguration beginnen können. Diese Ansichten werden mit Vorlagen erstellt. Pega bietet viele verschiedene Ansichtstypen mit unterschiedlichen Vorlagen an. 

Vorlagen helfen Ihnen, das Layout und die Reaktionsfähigkeit einer Ansicht für ein optimales Benutzererlebnis zu steuern. Vorlagen umfassen beispielsweise Breakpoints, Verwaltung von leeren Bereichen und Umbrüche, um die Einhaltung der neuesten Standards für Barrierefreiheit direkt vorkonfiguriert sicherzustellen.

Jeder Ansichtstyp verwendet eine andere Vorlage. Je nach Typ und Platzierung Ihrer Ansicht können die verfügbaren Vorlagen und deren Verhalten variieren. 

Das folgende Thema enthält wichtige Informationen zum Verständnis von Ansichtsvorlagen, die Sie für die Zertifizierungsprüfung benötigen: Vorlagen für Ansichten.

Ein Beispiel für eine Ansicht, die automatisch mit einer Vorlage erstellt wird, ist die Ganzseitenansicht „Full Page View“.

Wenn Sie einen neuen Case-Typ oder ein neues Datenobjekt erstellen, fügt die Pega-Plattform automatisch eine zugehörige Ansicht (Ganzseitenansicht) hinzu, die den visuellen Rahmen für die Verarbeitung zugehöriger Informationen für den Case-Abschluss darstellt. Das Layout mit drei Fenstern der Ganzseitenansicht ist für nahezu jeden Case oder jedes Datenobjekt optimiert. Es bietet Platz für eine Vielzahl von Informationen, von denen viele ohne Scrollen oder Wechseln zu anderen Ansichten einsehbar sind. Sie können die Vollbildansicht im Tab „UX“ Ihres Case-Typs oder Datenobjekts bearbeiten.

Die Ganzseitenansicht „Full Page View“ oder „Full Case Page“, die Seite für den gesamten Case, stellt bei der Pega-Plattform einen einzelnen Case dar. Klicken Sie in der folgenden Abbildung auf die Pluszeichen (+), um mehr über die Hauptbereiche der Ganzseiten-Ansicht zu erfahren:

Das Überblickpanel zeigt wichtige Informationen zu einem Case an. Mit der Platzierung des Überblickpanels wird sichergestellt, dass Benutzer die wichtigsten Informationen des Datensatzes oben links im Hauptfenster der Anwendung sehen. Benutzer, die von links nach rechts lesen, blicken intuitiv in die obere linke Ecke einer beliebigen Ansicht, um den Kontext zu verstehen und sich zu orientieren.

Die Größe und Form sind bewusst einem Mobilgerät nachempfunden. Wenn Sie das Überblickpanel in der Vollansicht des Case minimieren, ändert sich die Anzeige in den responsiven Modus. Dieser Modus wird häufig auf Geräten mit kleineren Bildschirmen verwendet.

Standardmäßig enthält das Überblickpanel auch die Ansicht „Details“ und die Pulse-Ansicht.

Details

Die Ansicht „Details“ ist eine optionale Standardansicht zur Darstellung schreibgeschützter Case-Daten, wie wichtige Felder oder weitere Informationen. Standardmäßig ist die Detailansicht so konfiguriert, dass primäre Felder angezeigt werden. 

Pulse

Bei der Pulse-Ansicht handelt es sich um eine optionale Standardansicht  für Pulse. Benutzer können hier Nachrichten posten, anzeigen und beantworten, die sich auf den Case-Kontext beziehen.

Prüfen Sie mit der folgenden Interaktion Ihr Wissen:

In einer Ganzseitenansicht können Sie eine hervorgehobene Aktion konfigurieren. Hervorgehobene Aktionen geben Benutzern schnellen Zugriff auf häufig verwendete Aktionen, wie Change Stage (Phase ändern).

Eine hervorgehobene Aktion wird als Schaltfläche im Header eines Case angezeigt. Das Hinzufügen einer hervorgehobenen Aktion ist ein Standardkonfigurationsmuster, das keine Erstellung bzw. kein Hinzufügen einer Button-Komponente erfordert.  Hervorgehobene Aktionen verhalten sich wie folgt:
 

• Jeder Case-Typ unterstützt eine hervorgehobene Aktion.
• Die hervorgehobene Aktion ist die erste Aktion, die den gesamten Case betrifft.

Ein Beispiel für eine hervorgehobene Aktion namens „Change stage“ (Phase ändern) wird in der folgenden Abbildung gezeigt:

Das folgende Thema enthält wichtige Informationen zum Verständnis von hervorgehobenen Aktionen, die Sie für die Zertifizierungsprüfung benötigen: Konfigurieren von hervorgehobenen Aktionen in einer Ansicht für den gesamten Case, „Full Case View“.