Richtlinien für App-Einstellungen

App-Einstellungen sind die vom Benutzer anpassbaren Teile Ihrer Windows-App, auf die über die Seite mit Einstellungen einer App zugegriffen werden kann. Beispielsweise kann ein Benutzer in einer Newsreader-App angeben, welche neuen Quellen oder wie viele Spalten auf dem Bildschirm angezeigt werden sollen, und eine Wetter-App könnte dem Benutzer ermöglichen, zwischen Celsius und Fahrenheit zu wählen. Dieser Artikel enthält Empfehlungen und bewährte Methoden für das Erstellen und Anzeigen von App-Einstellungen.

Wann sollte eine Einstellungenseite angegeben werden?

Hier sind Beispiele für App-Optionen, die zu einer App-Einstellungsseite gehören:

• Konfigurationsoptionen, die sich auf das Verhalten der App auswirken und keine häufige Neuanordnung erfordern, z. B. die Auswahl zwischen Celsius oder Fahrenheit als Standardeinheiten für Temperatur in einer Wetter-App, Ändern von Kontoeinstellungen für eine Mail-App, Einstellungen für Benachrichtigungen oder Barrierefreiheitsoptionen.
• Optionen, die von den Einstellungen des Benutzers abhängig sind, z. B. Musik, Soundeffekte oder Farbdesigns.
• App-Informationen, auf die nicht sehr häufig zugegriffen wird, z. B. Datenschutzrichtlinie, Hilfe, App-Version oder Copyrightinformationen.

Befehle, die Teil des typischen App-Workflows sind (z. B. das Ändern der Pinselgröße in einer Grafik-App), sollten sich nicht auf einer Einstellungsseite befinden. Weitere Informationen zur Platzierung von Befehlen finden Sie unter Befehlsdesigngrundlagen.

Allgemeine Empfehlungen

• Halten Sie Einstellungsseiten einfach, und verwenden Sie binäre Steuerelemente (ein/aus). Ein Umschalter ist in der Regel das beste Steuerelement für eine binäre Einstellung.
• Für Einstellungen, mit denen Benutzer ein Element aus einer Gruppe von bis zu 5 sich gegenseitig ausschließenden, verwandten Optionen auswählen können, verwenden Sie Optionsfelder.
• Erstellen Sie einen Einstiegspunkt für alle App-Einstellungen auf der Seite Ihrer App-Einstellung.
• Halten Sie Ihre Einstellungen einfach. Definieren Sie intelligente Standardwerte, und halten Sie die Anzahl der Einstellungen auf ein Minimum.
• Wenn ein Benutzer eine Einstellung ändert, sollte die App sofort die Änderung widerspiegeln.
• Fügen Sie keine Befehle hinzu, die Teil des allgemeinen App-Workflows sind.

Eingangspunkt

Die Art und Weise, wie Benutzer zu Ihrer App-Einstellungsseite gelangen, sollte auf dem Layout Ihrer App basieren.

Navigationsbereich

Bei einem Navigationsbereichslayout sollten App-Einstellungen das letzte Element in der Liste der Navigationsoptionen sein und unten angeheftet werden:

Befehlsleiste

Wenn Sie eine Befehlsleiste oder Symbolleiste verwenden, platzieren Sie den Einstiegspunkt für einstellungen als eines der letzten Elemente im Überlaufmenü "Mehr". Wenn eine größere Auffindbarkeit für den Einstellungseinstiegspunkt für Ihre App wichtig ist, platzieren Sie den Einstiegspunkt direkt auf der Befehlsleiste und nicht innerhalb des Überlaufs.

Hub

Wenn Sie ein Hublayout verwenden, sollte der Einstiegspunkt für App-Einstellungen im Überlaufmenü "Mehr" einer Befehlsleiste platziert werden.

Registerkarten/Pivots

Für ein Registerkarten- oder Pivots-Layout wird nicht empfohlen, den Einstiegspunkt für App-Einstellungen als eines der wichtigsten Elemente in der Navigation zu platzieren. Stattdessen sollte der Einstiegspunkt für App-Einstellungen im Überlaufmenü "Mehr" einer Befehlsleiste platziert werden.

Liste-Details

Anstatt den Einstiegspunkt für App-Einstellungen innerhalb eines Liste/Details-Bereichs zu u verstecken, machen Sie ihn als letztes angeheftete Element auf der obersten Ebene des Listenbereichs verfügbar.

Layout

Das Fenster der App-Einstellungen sollte sich im Vollbildmodus öffnen und das gesamte Fenster ausfüllen. Wenn ihr App-Einstellungsmenü über bis zu vier Gruppen auf oberster Ebene verfügt, sollten diese Gruppen eine Spalte nach unten überlappen.

Einstellungen für den Farbmodus

Wenn Ihre App Benutzern die Auswahl des Farbmodus ermöglicht, machen Sie diese Optionen mit Optionsfeldern oder einem Kombinationsfeld mit dem Header „Wählen Sie einen App-Modus“ verfügbar. Die Optionen sollten lauten:

• Hell
• Dunkel
• Standard (Windows)

Wir empfehlen außerdem, einen Hyperlink zur Seite „Farben” der Windows-Einstellungen-App hinzuzufügen. Dort können Benutzer auf den aktuellen App-Standardmodus zugreifen und ihn ändern. Verwenden Sie die Zeichenfolge „Windows-Farbeinstellungen“ als Text für den Link und ms-settings:colors für den URI.

Abschnitt „Info” und Feedbackschaltfläche

Wir empfehlen Ihnen, den Abschnitt „Info/Über diese App” entweder als eigene Seite oder in einem eigenen Abschnitt in Ihrer App zu platzieren. Wenn Sie eine „Feedback senden”-Schaltfläche benötigen, platzieren Sie diese unten auf der Seite „Info/Über diese App”.

Unter einer Unterüberschrift „Rechtliches” können Sie alle „Nutzungsbedingungen” und „Datenschutzerklärung” (sollten Hyperlinkschaltflächen mit Textumbruch sein) sowie weitere rechtliche Informationen, wie z. B. das Urheberrecht, einfügen.

Empfohlene Seiteninhalte

Wenn Sie über eine Liste von Elementen verfügen, die Sie in Ihre App-Einstellungsseite aufnehmen möchten, sollten Sie die folgenden Richtlinien berücksichtigen:

• Gruppieren Sie ähnliche oder verwandte Einstellungen unter einer Einstellungsbezeichnung.

• Versuchen Sie, die Gesamtzahl der Einstellungen auf maximal vier oder fünf zu halten.

• Zeigen Sie die gleichen Einstellungen unabhängig vom App-Kontext an. Wenn einige Einstellungen in einem bestimmten Kontext nicht relevant sind, deaktivieren Sie diese im Flyout für App-Einstellungen.

• Verwenden Sie beschreibende Bezeichnungen mit einem Wort für Einstellungen. Nennen Sie z. B. die Einstellung "Konten" anstelle von "Kontoeinstellungen" für kontobezogene Einstellungen. Wenn Sie nur eine Option für Ihre Einstellungen wünschen und sich die Einstellungen nicht für eine beschreibende Bezeichnung eignen, verwenden Sie "Optionen" oder "Standardwerte".

• Wenn eine Einstellung direkt mit dem Web anstatt mit einem Flyout verknüpft ist, teilen Sie dem Benutzer dies mit einem visuellen Hinweis mit, z. B. "Hilfe (Online)" oder "Webforen", die als Link formatiert sind. Erwägen Sie das Gruppieren mehrerer Links zum Web in ein Flyout mit einer einzigen Einstellung. Eine Einstellung "Info" könnte z. B. ein Flyout mit Links zu Ihren Nutzungsbedingungen, Datenschutzrichtlinien und App-Support öffnen.

• Kombinieren Sie weniger verwendete Einstellungen in einem einzigen Eintrag, sodass häufigere Einstellungen jeweils über einen eigenen Eintrag verfügen können. Platzieren Sie Inhalte oder Links, die nur Informationen in einer Einstellung "Info" enthalten.

• Duplizieren Sie die Funktionalität nicht im Bereich "Berechtigungen". Windows stellt diesen Bereich standardmäßig bereit, und Sie können ihn nicht ändern.

• Hinzufügen von Einstellungsinhalten zu Einstellungen-Flyouts

• Präsentieren Sie Inhalte von oben nach unten in einer einzelnen Spalte, die bei Bedarf scrollbar ist. Beschränken Sie den Bildlauf auf maximal zweimal die Bildschirmhöhe.

• Verwenden Sie die folgenden Steuerelemente für App-Einstellungen:

  • Um Schalter ein- oder auszuschalten: So können Benutzer Werte ein- oder ausschalten.
  • Optionsfelder: Um Benutzern die Auswahl eines Elements aus einer Gruppe von bis zu 5 sich gegenseitig ausschließenden optionen zu ermöglichen.
  • Texteingabefeld: So können Benutzer Text eingeben. Verwenden Sie den Typ des Texteingabefelds, das dem Typ des Texts entspricht, den Sie vom Benutzer erhalten, z. B. eine E-Mail oder ein Kennwort.
  • Links: Um den Benutzer zu einer anderen Seite innerhalb der App oder zu einer externen Website zu bringen. Wenn ein Benutzer auf einen Link klickt, wird das Einstellungen-Flyout geschlossen.
  • Schaltflächen: Damit Benutzer eine sofortige Aktion initiieren können, ohne das aktuelle Einstellungen-Flyout zu schließen.

• Fügen Sie eine beschreibende Meldung hinzu, wenn eines der Steuerelemente deaktiviert ist. Platzieren Sie diese Meldung über dem deaktivierten Steuerelement.

• Animieren von Inhalten und Steuerelementen als einzelner Block, nachdem das Einstellungen-Flyout und die Kopfzeile animiert wurden. Animieren von Inhalten mithilfe der Animationen enterPage oder EntranceThemeTransition mit einem linken Offset von 100px.

• Verwenden Sie Abschnittsüberschriften, Absätze und Beschriftungen, um inhalte bei Bedarf zu organisieren und zu verdeutlichen.

• Wenn Sie Einstellungen wiederholen müssen, verwenden Sie eine zusätzliche Ui-Ebene oder ein Modell zum Erweitern/Reduzieren, vermeiden Sie jedoch Hierarchien, die tiefer als zwei Ebenen sind. Beispielsweise könnte eine Wetter-App, die einstellungen pro Ort bereitstellt, die Städte auflisten und dem Benutzer das Tippen auf die Stadt ermöglichen, um entweder ein neues Flyout zu öffnen oder zu erweitern, um die Einstellungsoptionen anzuzeigen.

• Wenn das Laden von Steuerelementen oder Webinhalten Zeit in Anspruch nimmt, verwenden Sie ein unbestimmtes Statussteuerelement, um Benutzern anzuzeigen, dass Informationen geladen werden. Weitere Informationen finden Sie unter Richtlinien für Statussteuerelemente.

• Verwenden Sie keine Schaltflächen für die Navigation oder zum Übernehmen von Änderungen. Verwenden Sie Links, um zu anderen Seiten zu navigieren, und anstatt eine Schaltfläche zum Übernehmen von Änderungen zu verwenden, speichern Sie automatisch Änderungen an App-Einstellungen, wenn ein Benutzer das Flyout "Einstellungen" schließt.

Verwandte Artikel

• Befehlsdesigngrundlagen
• Richtlinien für Statussteuerelemente
• Speichern und Abrufen von App-Daten
• EntranceThemeTransition