Eine Experience Builder-App erstellen und Widgets hinzufügen

Sie erstellen eine Web Experience-App mit ArcGIS Experience Builder. Sie beginnen mit einer leeren Vorlage. Anschließend fügen Sie Widgets hinzu und konfigurieren diese, um die App einzurichten.

Leere Web Experience erstellen

Als Erstes erstellen Sie eine leere Web Experience-App.

  1. Melden Sie sich bei Ihrem ArcGIS-Organisationskonto an.
    Hinweis:

    Wenn Sie über kein Organisationskonto verfügen, informieren Sie sich über die Optionen für den Zugriff auf die Software.

  2. Klicken Sie auf die Registerkarte Inhalt und dann auf App erstellen.

    Schaltfläche "App erstellen"

  3. Wählen Sie Experience Builder aus.

    Die Option "Experience Builder"

  4. Klicken Sie auf der Startseite auf Neue erstellen.

    Schaltfläche "Neue erstellen"

    Die Seite Vorlage wird geöffnet, auf der eine Galerie der Vorlagenoptionen angezeigt wird. Bei Vorlagen handelt es sich um voreingestellte Layouts und Designs für die Apps, die Sie erstellen. Für diese App verwenden Sie die Vorlage Leer.

  5. Suchen Sie auf der Registerkarte Standard die Vorlage Leeres Vollbild, und klicken Sie auf Erstellen.

    Die Vorlage "Leeres Vollbild"

    Die App wird im Builder mit einer leeren Zeichenfläche geöffnet. Geben Sie der App einen aussagekräftigeren Titel.

  6. Klicken Sie im Menüband auf Unbenannte Experience 1, und geben Sie State health demographics ein.
    Hinweis:

    Der Standardtitel kann abweichen.

    Umbenannte App

    Nun können Sie der Web Experience Widgets hinzufügen. Die Widgets sind nach ihrer Funktionalität kategorisiert, z. B. Kartenbasiert, Datenbasiert oder Seitenelemente.

Widgets zur App hinzufügen

Als Nächstes fügen Sie der App das Widget Business Analyst, ein Karten-Widget und ein Text-Widget hinzu.

  1. Ziehen Sie im Bereich Widget einfügen unter Kartenbasiert das Widget Business Analyst auf die Zeichenfläche.

    Auf die Zeichenfläche gezogenes Widget

    Auf der rechten Seite wird der Bereich Business Analyst geöffnet, in dem standardmäßig der Modus Workflow ausgewählt ist. Im Modus Workflow werden dem App-Benutzer die Schritte zum Auswählen einer Position und zum Ausführen einer Infografik angezeigt. Da Sie jedoch wissen, welche Infografik Sie benötigen und welche Positionen Sie anzeigen möchten (Landkreise in Ihrem Bundesstaat), verwenden Sie stattdessen den Modus Voreinstellung.

  2. Klicken Sie im Bereich Business Analyst unter Modus auf Voreinstellung.

    Der Modus "Voreinstellung"

    Als Nächstes ergänzen Sie das Widget Business Analyst durch die Widgets Karte und Text.

  3. Ziehen Sie ein Widget des Typs Karte vom Abschnitt Kartenbasiert des Bereichs Widget einfügen auf die Zeichenfläche.

    Auf die Zeichenfläche gezogenes Karten-Widget

  4. Ziehen Sie ein Widget des Typs Text vom Abschnitt Seitenelemente auf die Zeichenfläche.
  5. Ordnen Sie die Widgets Text und Karte so an, dass sie die gleiche Breite haben und etwa ein Drittel der Zeichenfläche auf der linken Seite einnehmen. Passen Sie die Größe des Widgets Business Analyst so an, dass der restliche Platz auf der Zeichenfläche genutzt wird.

    App-Layout

    Nun ist das Erscheinungsbild der App ausgewogen. Sie können die Platzierung der Widgets jederzeit ändern. Fürs Erste sieht jedoch alles gut aus.

Sie haben eine App in Experience Builder erstellt, drei Widgets hinzugefügt und das Aussehen der App sowie die Platzierung der Widgets angepasst. Die Widgets weisen momentan die ihnen zugewiesene Standardfunktionalität auf. Als Nächstes passen Sie die Konfiguration der Widgets an Ihre Geschäftsanforderungen an.


Das Widget "Business Analyst" konfigurieren und die App veröffentlichen

Das Widget Business Analyst ermöglicht Ihnen das Anzeigen von Infografiken in einer App. Sie haben das Widget Business Analyst hinzugefügt und so eingerichtet, dass es im Modus "Voreinstellung" verwendet werden kann, d. h. es können eine Infografik eingebettet und die Standardposition sowie der Puffertyp und die Einheiten für Punktpositionen definiert werden.

Hinweis:

Durch Klicken auf Live-Ansicht können Sie jederzeit eine Vorschau des Widgets anzeigen und in der App damit interagieren.

Widgets konfigurieren

Sie konfigurieren das Widget Business Analyst für Ihre Gesundheitsbehörde, indem Sie es mit der Karte verknüpfen und die vordefinierte Position einstellen. Außerdem wählen Sie die Infografik aus, die in der App angezeigt werden soll, und legen einen Titel fest.

  1. Klicken Sie auf der Zeichenfläche auf das Widget Business Analyst, um es auszuwählen.

    Der Bereich Business Analyst wird angezeigt. Hier können Sie das Widget entsprechend Ihren Anforderungen konfigurieren.

  2. Wählen Sie im Dropdown-Menü Karten-Widget auswählen den Eintrag Karte aus.

    Option "Karte"

  3. Unter Positionseinstellungen muss der Eintrag United States ausgewählt sein. Klicken Sie auf Position festlegen.

    Schaltfläche "Position festlegen"

    Der Bereich Position festlegen wird angezeigt. Hier können Sie den geographischen Bereich für Infografiken definieren. In diesem Beispiel verwenden Sie als Position das Krankenhaus University of Kansas Health System.

  4. Geben Sie im Suchfeld 1700 SW 7th St. ein, und klicken Sie auf das Suchergebnis "Topeka, Kansas".

    Ergebnis der Adresssuche

    Die Position wird zur Karte hinzugefügt und wird Benutzenden, die Ihre App verwenden, als Standardposition ausgegeben. Als Nächstes richten Sie die Puffer ein, die Sie für die Berechnung der demografischen Informationen für die Infografiken verwenden.

  5. Klicken Sie im Bereich des Widgets Business Analyst auf Puffer festlegen.

    Option "Puffer festlegen"

    Der Bereich Puffer festlegen wird angezeigt.

  6. Klicken Sie im Bereich Puffer festlegen auf Fahrzeit und dann auf Übernehmen.

    Optionen für Fahrzeitpuffer

    Als Nächstes wählen Sie die Standard-Infografik aus, die in der App angezeigt werden soll. Da es sich um eine App für Demografie- und Gesundheitsdaten handelt, wählen Sie eine Infografik aus, die die entsprechenden Variablen bietet.

  7. Klicken Sie im Bereich Business Analyst auf Infografik auswählen.

    Option "Infografik auswählen"

    Der Bereich Infografik auswählen wird angezeigt.

  8. Erweitern Sie die Kategorie Esri Infografiken, und wählen Sie Health Care and Insurance Statistics aus.

    Dropdown-Liste "Infografik"

    Die Infografik wird im Widget angezeigt.

    Beispiel-Infografik

    Legen Sie als Nächstes einen Titel und eine Beschreibung für die Infografik fest, um den App-Benutzenden Kontext bereitzustellen.

  9. Doppelklicken Sie auf das Widget Text, und geben Sie Health Care and Insurance Report ein.

    Widget "Text" mit neuem Text

  10. Markieren Sie den Text im Widget Text. Ändern Sie im Bereich Text die Schriftgröße auf 28 px, klicken Sie auf die Schaltfläche Fett und dann auf Zentriert, um den Text mittig zu formatieren.

    Texteinstellungen

    Auf der Zeichenfläche wird der Text aktualisiert

    Aktualisierter Text im Widget

  11. Klicken Sie auf dem Menüband auf die Schaltfläche Speichern.

    Schaltfläche "Speichern"

    Sie haben die App nach Ihren Wünschen konfiguriert und sind nun bereit, sie im Modus Live-Ansicht zu betrachten und zu veröffentlichen.

Die App veröffentlichen und freigeben

Als Nächstes sehen Sie die App so, wie ein Benutzer sie im Live-Modus sehen würde. Dann veröffentlichen und testen Sie die App und geben sie frei.

  1. Klicken Sie im oberen Menüband auf Live-Ansicht.

    Option "Live-Ansicht"

    Die App schaltet in die Live-Ansicht, was auch durch die wechselnde Farbe der Schaltfläche angezeigt wird.

    Modus "Live-Ansicht" aktiv

    In der Live-Ansicht können Sie die App aus der Perspektive der Benutzenden verwenden.

  2. Geben Sie in der Suchleiste des Karten-Widgets den Text Wesley Medical Center ein, und wählen Sie in der Ergebnisliste "550 N Hillside Street" in Wichita, Kansas aus.

    Suchergebnisse für "Medical Center"

    Die Kartenansicht wird auf das Wesley Medical Center vergrößert, und es werden um die Position herum Gehzeitpuffer von 5, 10 und 15 Minuten angelegt. In der Infografik werden Variablen für Gesundheitswesen und Krankenversicherung im Umkreis von 5 Fahrminuten von der Position aus angezeigt.

    Vorschau der App

  3. Klicken Sie in der Titelleiste der Infografik auf die Dropdown-Liste 5 minute drive, und wählen Sie 10 minute drive aus.

    Option "10 minute drive"

    Die Infografik wird aktualisiert und zeigt dann die demografischen Daten innerhalb des 10-Minuten-Puffers an.

    Infografik für eine Fahrzeit von 10 Minuten

    Nachdem Sie die App getestet und für funktionsfähig befunden haben, können Sie sie veröffentlichen und freigeben.

  4. Klicken Sie auf dem Menüband auf Speichern und dann auf Veröffentlichen, um die Anwendung zu veröffentlichen.

    Schaltfläche "Veröffentlichen"

  5. Klicken Sie auf dem Menüband auf die Schaltfläche Mehr, und wählen Sie Veröffentlichtes Element anzeigen aus.

    Option "Veröffentlichtes Element anzeigen"

    Daraufhin wird die App auf einer weiteren Browser-Registerkarte angezeigt.

  6. Testen Sie die App, indem Sie nach einer medizinischen Einrichtung suchen.
  7. Kehren Sie zu der anderen Browser-Registerkarte zurück, auf der die App im Bearbeitungsmodus angezeigt wird.
  8. Klicken Sie auf dem Menüband auf die Schaltfläche Mehr, und wählen Sie Link zu veröffentlichtem Element kopieren aus.

    Option "Link zu veröffentlichtem Element kopieren"

    Sie haben den Link zur veröffentlichen App kopiert und können ihn freigeben. Allerdings bezieht sich die Standardeinstellung für die Freigabe nur auf den Besitzer, d. h. dass die App erst für andere Benutzer zugänglich ist, wenn Sie die Einstellungen ändern. Sie können die Seite mit den Elementdetails der App in ArcGIS Online über die App aufrufen.

  9. Klicken Sie auf dem Menüband auf die Schaltfläche Mehr, und wählen Sie Freigabeeinstellungen ändern aus.

    Option "Freigabeeinstellungen ändern"

    Die Elementdetailseite der App wird angezeigt.

  10. Klicken Sie auf die Schaltfläche Freigeben.

    Schaltfläche "Freigeben"

    Das Fenster Freigeben mit verschiedenen Freigabeoptionen wird angezeigt. Aktuell hat nur der Besitzer der App Zugriff. Sie können jedoch eine Einstellung ändern, um die App für die eigene Organisation oder für alle (öffentlich) freizugeben.

  11. Klicken Sie im Fenster Freigeben auf Organisation und dann auf Speichern.

    Geben Sie die App für die Organisation frei.

    Die App ist nun freigegeben und kann von anderen Mitgliedern Ihrer Organisation verwendet werden.

In diesem Lernprogramm haben Sie eine Web-App erstellt, die Infografiken für bestimmte Positionen anzeigt, die die Anwendenden eingeben. Sie haben Business Analyst und weitere Widgets hinzugefügt, diese konfiguriert, die App getestet, veröffentlicht und freigegeben. Andere Benutzende können nun mithilfe Ihrer App für eine medizinische Einrichtung ihrer Wahl Informationen zum Gesundheitswesen und zur Krankenversicherung abrufen.

Weitere Lernprogramme finden Sie in der Lernprogrammgalerie.