Skip to main content

Erstellen und Konfigurieren eines Designs

Sie können benutzerdefinierte Designs erstellen, um das Erscheinungsbild an die Markenrichtlinien Ihrer Organisation oder an die Tonalität des Inhalts anzupassen. Ein von Ihnen erstelltes Design wird als ArcGIS-Element StoryMap-Design gespeichert, sodass es auf verschiedene Inhalte angewendet werden kann, die Sie oder andere mit ArcGIS StoryMaps erstellen.

Erstellen eines Designs

Führen Sie zum Erstellen eines neuen Designs die folgenden Schritte aus:

  1. Melden Sie sich bei ArcGIS StoryMaps an.

  2. Klicken Sie auf der Inhaltsseite von ArcGIS StoryMaps auf Erstellen und dann auf Design, um ein neues StoryMap-Designelement zu erstellen und den Design-Builder zu starten.

    Im Design-Builder werden ein Fenster mit ersten Optionen und eine Beispiel-Story mit einer Vorschau der ausgewählten Konfiguration für das Design angezeigt.

    Tipp:

    Sie können auch ein neues Design in den ArcGIS StoryMaps-Buildern erstellen. Klicken Sie auf die Schaltfläche Design in der Kopfzeile und dann auf die Schaltfläche Neues Thema erstellen im Designbereich.

    Tipp:

    Sie können auch ein neues Design in den ArcGIS StoryMaps-Buildern erstellen. Klicken Sie auf die Schaltfläche Design in der Kopfzeile und dann auf die Schaltfläche Neues Thema erstellen im Designbereich.

  3. Klicken Sie im Fenster Startpunkt auswählen auf die Kacheln, um eine Vorschau der einzelnen Optionen anzuzeigen. Verfügbare Optionen können folgende sein:

    • Festgelegtes Design: Importiert die festgelegten Designeinstellungen Ihrer Organisation für den Hintergrund, die Textfarbe, die Textfarbe der Schaltflächen, die Hintergrundfarbe der Kopfzeile, die Textfarbe der Kopfzeile, die Farbe des Links, das Logo und den Logo-Link. Die Hintergrundfarbe der Schaltfläche des festgelegten Designs wird auch als Akzentfarbe des neuen Designs verwendet. Diese Option wird nur angezeigt, wenn ein Administrator ein festgelegtes Design konfiguriert hat.

    • Design-Assistent: Verwendet KI, um ein Design zu generieren. Diese Option wird nur angezeigt, wenn KI-Funktionen in Ihrer Organisation aktiviert sind. Weitere Informationen finden Sie unter ArcGIS StoryMaps-Assistent.

    • Standarddesigns: Wählen Sie ein Standarddesign aus. Die Eigenschaften der einzelnen Standarddesigns werden in der Designreferenz dokumentiert.

  4. Klicken Sie unter der Option, die als Startpunkt für Ihr benutzerdefiniertes Design dienen soll, auf Auswählen.

    Nachdem Sie einen Startpunkt ausgewählt haben, werden die Konfigurationsoptionen für Designs im Fenster angezeigt.

  5. Geben Sie dem Design einen Namen, indem Sie den Text Unbenanntes Design oben im Fenster ersetzen.

  6. Passen Sie die Konfigurationsoptionen ggf. an.

    In den folgenden Abschnitten werden die verfügbaren globalen Eigenschaften und Elementeigenschaften beschrieben.

    Bei der Erstellung eines Designs wird in der Beispiel-Story in einer Vorschau gezeigt, wie das Design nach dem Anwenden auf verschiedene Arten von Inhaltsblöcken aussieht.

  7. Klicken Sie auf Veröffentlichen, um den Veröffentlichungsprozess zu starten.

    Hinweis:

    Designs folgen denselben Veröffentlichungs-Workflows wie andere Elemente, die mit ArcGIS StoryMaps erstellt wurden.

Globale Eigenschaften

Globale Eigenschaften wirken sich auf den gesamten ArcGIS StoryMaps-Inhalt aus, auf den sie angewendet werden. Verfügbare globale Optionen sind Farben, Typografie, Abstand und Form.

Konfigurieren der Farben

Führen Sie die folgenden Schritte aus, um Farboptionen für das Design zu konfigurieren:

  1. Wählen Sie eine Hintergrundfarbe.

    Hinweis:

    Die sekundäre Hintergrundfarbe wird automatisch als Variante der primären Hintergrundfarbe berechnet; sie kann nicht konfiguriert werden. Sie ist im Design-Builder verfügbar. Deshalb werden Warnungen angezeigt, wenn der Kontrast mit den entsprechenden Textfarben nicht ausreichend ist, um Barrierefreiheit zu erzielen.

  2. Wählen Sie eine Akzentfarbe.

    Diese primäre Akzentfarbe wird für andere Elemente wie Schaltflächen, Trennzeichen, Zitate und Links verwendet; Sie können diese Farbe jedoch in den Abschnitten zur Konfiguration der einzelnen Elemente überschreiben.

  3. Wählen Sie zwei zusätzliche Akzentfarben aus.

Wenn Autoren Ihr Design verwenden, sind diese Farben in der Farbauswahl verfügbar.

Konfigurieren der Typografie

Führen Sie die folgenden Schritte aus, um Typografieoptionen für das Design zu konfigurieren:

  1. Legen Sie eine Schriftart fest.

  2. Wählen Sie eine Schriftart und -farbe für den Titel und Überschriftentext aus.

  3. Wählen Sie eine Schriftart und -farbe für Absatztext aus.

  4. Wählen Sie eine Farbe für Beschriftungstext aus.

    Die Schriftfarbe für Absätze wird auch für Beschriftungen verwendet.

Hinweis:

Sie können eine Schriftfamilie aus Google Fonts hinzufügen, um bei der Erstellung eines Designs mehr Möglichkeiten zu haben. Sie können auch den Schriftschnitt der ausgewählten Schriftfamilie ändern.

Um beim Erstellen von Designs für ArcGIS Enterprise-Konten Google Fonts zu aktivieren, muss ein Administrator in den Organisationseinstellungen einen gültigen Google Fonts-API-Schlüssel bereitstellen.

Abstand

Die Abstandseigenschaft bestimmt die Größe der Lücke zwischen den Inhaltsblöcken in einer Story. Es stehen zwei Abstandsoptionen zur Auswahl: Großzügig oder Kompakt.

Form

Die Formeigenschaft wirkt sich auf das Runden der Ecken von Medienblöcken in Storys, Express-Karten-Pop-ups, Schaltflächen, Steuerelementen für Medien, Briefing-Bereichen und anderen visuellen Elementen aus. Sie können einen von drei Form-Styles auswählen: Scharf, Weich oder Geschwungen.

Elementeigenschaften

Elementeigenschaften wirken sich auf einen Block oder Aspekt eines Inhaltselements aus. Verfügbare Elementeigenschaften sind u. a. Kopfzeile, Schaltflächen, Zitate, Links, Trennzeichen, Grundkarte und Logo.

Konfigurieren der Kopfzeile

Führen Sie die folgenden Schritte aus, um die Kopfzeile für das Design zu konfigurieren:

  1. Wählen Sie eine Hintergrundfarbe für die Kopfzeile aus.

  2. Wählen Sie optional eine Textfarbe für die Kopfzeile aus.

    Wenn Sie keine Textfarbe für die Kopfzeile auswählen, wird vom Design-Builder automatisch weißer oder schwarzer Text verwendet, um einen ausreichenden Kontrast zur gewählten Hintergrundfarbe der Kopfzeile sicherzustellen.

Konfigurieren der Schaltflächen

Führen Sie die folgenden Schritte aus, um Schaltflächen für das Design zu konfigurieren:

  1. Wählen Sie eine Schaltflächenposition aus.

  2. Wählen Sie optional einen Schaltflächen-Style aus.

    Wenn Sie keinen Schaltflächen-Style wählen, wird die globale Formeigenschaft verwendet.

  3. Optional können Sie die Hintergrundfarbe der Schaltflächen auswählen.

    Wenn Sie keine Hintergrundfarbe für Schaltflächen auswählen, wird die globale Akzentfarbe verwendet.

  4. Wählen Sie optional eine Textfarbe für Schaltflächen aus.

    Wenn Sie keine Textfarbe für Schaltflächen auswählen, wird vom Design-Builder automatisch weißer oder schwarzer Text verwendet, um einen ausreichenden Kontrast zur gewählten Hintergrundfarbe für Schaltflächen sicherzustellen.

Konfigurieren von Zitaten

Führen Sie die folgenden Schritte aus, um Zitate für das Design zu konfigurieren:

  1. Wählen Sie einen Zitat-Style.

    Hinweis:

    Für Zitattext wird die Absatzfarbe verwendet, für den Quellennachweis des Zitats dagegen die Beschriftungsfarbe. Beides ist im Abschnitt Farben konfiguriert. Wenn Sie den gefüllten Zitat-Style wählen, werden die Farben des Zitattexts und des Quellennachweises des Zitats in Weiß oder Schwarz geändert, um ausreichenden Kontrast zu gewährleisten.

  2. Wählen Sie eine Zitatausrichtung aus.

  3. Wählen Sie optional eine benutzerdefinierte Zitatfarbe aus.

    Jeder Zitat-Style enthält Schnörkel, die mit einer Akzentfarbe versehen werden. Wenn Sie keine benutzerdefinierte Zitatfarbe auswählen, wird die globale Akzentfarbe verwendet.

Konfigurieren von Links

Führen Sie die folgenden Schritte aus, um Links für das Design zu konfigurieren:

  1. Wählen Sie einen Link-Style aus.

    Hinweis:

    Wenn Sie den gefüllten Link-Style wählen, wird die Farbe des Linktexts in Weiß oder Schwarz geändert, um ausreichenden Kontrast zu gewährleisten.

  2. Wählen Sie optional eine benutzerdefinierte Linkfarbe aus.

    Wenn Sie keine benutzerdefinierte Linkfarbe auswählen, wird die globale Akzentfarbe verwendet.

Konfigurieren der Trennzeichen

Führen Sie die folgenden Schritte aus, um Trennzeichen für das Design zu konfigurieren:

  1. Wählen Sie einen Trennzeichen-Style aus.

    Wenn Sie den Bildtrennzeichen-Style auswählen, werden Sie aufgefordert, ein Bild hochzuladen.

  2. Wählen Sie optional eine benutzerdefinierte Trennzeichenfarbe aus.

    Diese Option ist nicht verfügbar, wenn Sie ein Bildtrennzeichen hinzugefügt haben.

  3. Wählen Sie eine Trennzeichenposition aus.

Konfigurieren der Grundkarte

Die hier angegebene Webkarte wird als Standardgrundkarte für Express-Karten und Map Tours verwendet. Autoren, die Ihr Design verwenden, können für jeden Inhalt, den sie erstellen, eine andere Grundkarte auswählen.

Führen Sie die folgenden Schritte aus, um eine Standardgrundkarte für das Design zu konfigurieren:

  1. Klicken Sie auf die Grundkartenkachel, um die Grundkartenauswahl zu öffnen.

  2. Klicken Sie auf die Schaltfläche Weitere Karten durchsuchen, um eine Grundkarte aus einer Webkarte in Ihren ArcGIS-Inhalten oder -Gruppen oder Ihrer ArcGIS-Organisation auszuwählen.

  3. Wählen Sie optional eine Webkarte aus dem ArcGIS Living Atlas oder eine öffentlich verfügbare Webkarte aus.

    Hinweis:

    Die hier angegebene Karte muss in der Web Mercator-Projektion vorliegen.

Konfigurieren eines Logos

Führen Sie die folgenden Schritte aus, um ein Logo für das Design zu konfigurieren:

  1. Klicken Sie auf Logo hochladen, und wählen Sie eine Logodatei aus.

    Um die bestmögliche Qualität zu erhalten, laden Sie eine PNG-Datei mit einer Höhe von mindestens 80 Pixeln oder eine SVG-Datei hoch.

  2. Optional können Sie einen Logo-Link hinzufügen.

    Leser werden auf diese Website weitergeleitet, wenn sie auf das Logo in der Story-Kopfzeile klicken.

  3. Optional können Sie alternativen Logotext hinzufügen.

    Es wird empfohlen, alternativen Text hinzuzufügen, um die Barrierefreiheit zu verbessern.

Barrierefreiheit

Bei der Gestaltung eines Designs ist es wichtig, den Kontrast zwischen dem Text und dem Hintergrund zu berücksichtigen, um die Lesbarkeit des Textinhalts in Ihrer Story oder Sammlung zu gewährleisten. Der Design-Builder berechnet bei jeder Farbänderung das Kontrastverhältnis und warnt Sie, wenn der Kontrast zwischen den Farben nicht ausreicht.

Für die Kontrastberechnungen und Warnschwellenwerte werden die WCAG-Richtlinien zugrunde gelegt. Die möglichen Kontrastverhältnisse sind einsehbar, falls Sie sich für die Verwendung anderer Richtlinien entscheiden. Klicken Sie, um die Kontrastprüfung zu erweitern und weitere Details zu sehen.

Weitere Informationen finden Sie unter Barrierefreiheit in StoryMaps.