Erstellen einer komplexen Universal Windows Platform (UWP)-App

Die Microsoft-Designteams unterteilen den Prozess der App-Erstellung in fünf einzelne Phasen - Konzept, Struktur, Dynamik, Darstellung und Prototyp. Wir möchten Sie dazu ermutigen, einen ähnlichen Prozess anzuwenden, um der Welt neue und ansprechende Erfahrungen zu vermitteln.

Konzept

Fokussiere deine App

Wenn Sie Ihre Universal Windows Platform (UWP)-App planen, sollten Sie nicht nur bestimmen, was Ihre App tun wird und für wen sie bestimmt ist, sondern auch, was Ihre App besonders gut macht. Grundlage jeder guten App ist ein starkes Konzept, mit dem für ein solides Fundament gesorgt wird.

Nehmen wir einmal an, dass Sie eine Foto-App erstellen möchten. Wenn Sie über die Gründe nachdenken, aus denen Benutzer Fotos nutzen, speichern und teilen, kommen Sie zu dem Ergebnis, dass sie Erinnerungen wecken, mithilfe von Fotos mit anderen Personen in Verbindung bleiben und Fotos sicher aufbewahren möchten. Ziel ist es, dass Ihre App in diesen Punkten hervorragend ist, und nutzen Sie diese Erfahrungsziele, um Sie durch den weiteren Designprozess zu führen.

Wozu dient Ihre App? Beginnen Sie mit einem allgemeinen Konzept. Führen Sie alle Punkte auf, die Benutzern mit Ihrer App ermöglicht werden sollen.

Nehmen wir beispielsweise an, Sie möchten eine App erstellen, mit der Benutzer Reisen planen können. Hier sind einige Ideen, die Sie auf der Rückseite einer Serviette skizzieren könnten:

• Karten für alle Orte auf der Reiseroute abrufen und mit auf die Reise nehmen
• Informieren Sie sich über spezielle Veranstaltungen, die während Ihres Aufenthalts in einer Stadt stattfinden.
• Lassen Sie Reisebegleiter separate, aber freigabefähige Listen mit unverzichtbaren Aktivitäten und Sehenswürdigkeiten erstellen.
• Lassen Sie Reisefreunde alle ihre Fotos zusammenstellen, um sie mit Freunden und Familienmitgliedern zu teilen.
• Empfohlene Reiseziele basierend auf Flugpreisen abrufen
• Eine Übersicht mit Angeboten für Restaurants, Geschäfte und Aktivitäten in der Nähe des Reiseziels abrufen

Welche Stärken hat Ihre App? Treten Sie einen Schritt zurück und betrachten Sie Ihre Ideenliste, um zu sehen, ob ein bestimmtes Szenario wirklich hervorsticht. Kürzen Sie Ihre Liste auf ein Szenario, auf das Sie sich konzentrieren möchten. Dabei streichen Sie vielleicht viele gute Ideen, aber "nein" zu ihnen zu sagen ist entscheidend, um ein einzelnes Szenario großartig zu machen.

Entscheiden Sie nach der Auswahl eines Szenarios, wie Sie einem durchschnittlichen Benutzer erklären, wodurch sich Ihre App besonders auszeichnet, und schreiben Sie diesen Punkt in einem Satz nieder. Beispiel:

• Meine Reise-App zeichnet sich besonders dadurch aus, dass sie Freunde beim gemeinsamen Erstellen von Reiserouten für Gruppenreisen unterstützt.
• Meine Fitness-App ist großartig darin, Freunden zu ermöglichen, ihre Trainingsfortschritte zu verfolgen und ihre Erfolge miteinander zu teilen.
• Meine Lebensmittel-App zeichnet sich besonders dadurch aus, dass sie den wöchentlichen Einkauf in der Familie koordiniert. Der Einkauf wird dadurch weder vergessen noch doppelt durchgeführt.

Dies ist die „großartig in“-Aussage Ihrer App, und sie kann viele Designentscheidungen und Kompromisse leiten, die Sie beim Erstellen Ihrer App treffen. Konzentrieren Sie sich auf die Szenarien, die Sie Benutzern in Ihrer App anbieten möchten. Machen Sie daraus aber keine Liste mit Features. Beschreiben Sie, welche Vorteile die App den Benutzern bietet, und nicht, was sie kann.

Der Design-Funnel

Wenn Ihnen eine Idee gefällt, ist es, nachdem Sie diese durchdacht haben, sehr verlockend, sofort mit der Entwicklung zu beginnen und möglicherweise sogar weit in die Produktion zu gehen. Es kann jedoch sein, dass Sie dies tun und Ihnen später eine andere interessante Idee einfällt. Dann ist die Wahrscheinlichkeit hoch, dass sie bei der Idee bleiben, in die Sie bereits investiert haben – unabhängig davon, welche relativen Vorteile die beiden Ideen jeweils bieten. Wenn Ihnen die zweite Idee nur zu einem früheren Zeitpunkt des Prozesses eingefallen wäre! Der Design Trichter ist eine Technik, die dabei hilft, die besten Ideen so früh wie möglich zu entdecken.

Der Ausdruck "Trichter" beruht auf der Form. Am breiten Ende des Trichters werden viele Ideen eingegeben, und jede wird als Designartefakt mit geringer Detailtreue umgesetzt (möglicherweise in Form einer Skizze oder als Textabsatz). Wenn sich diese Ideensammlung dann in Richtung des schmalen Endes des Trichters bewegt, wird die Anzahl von Ideen reduziert, während die Genauigkeit der Artefakte, die die Ideen repräsentieren, sich erhöht. Für jedes Artefakt sollten nur die Informationen erfasst werden, die zum Vergleichen der Ideen oder zum Beantworten einer bestimmten Frage wie „Ist dies benutzerfreundlich oder intuitiv?“ erforderlich sind. Betreiben Sie dafür keinen weiteren Zeit- und Arbeitaufwand. Einige Ideen werden durch die Raster fallen, wenn Sie sie testen, und das wird kein Problem sein, da Sie nicht mehr Aufwand investiert haben, als nötig war, um die Idee zu beurteilen. Ideen, die es schaffen, im Funnel weiterzukommen, werden schrittweise mit höherer Detailtreue behandelt. Am Ende steht ein einzelnes Designartefakt, das die Idee repräsentiert, die als Gewinner aus dem Prozess hervorgegangen ist. Die Idee hat gewonnen, aufgrund ihrer eigenen Vorzüge, und nicht nur, weil sie zuerst gekommen ist. Sie werden die beste App entworfen haben, die Sie können.

Struktur

Vereinfachung durch Organisation

Wenn Sie mit Ihrem Konzept zufrieden sind, können Sie zur nächsten Phase übergehen und den App-Entwurf erstellen. Mithilfe der Informationsarchitektur (IA) verleihen Sie Ihren Inhalten die erforderliche strukturelle Integrität. Dies ist beim Festlegen des Navigationsmodells für die App und später der App-Identität hilfreich. Indem Sie die Organisation der Inhalte planen – und wie Ihre Benutzer diese Inhalte entdecken können –, erhalten Sie einen besseren Eindruck, wie Benutzer die App erleben werden.

Gute Informationsarchitektur erleichtert nicht nur die Implementierung von Benutzerszenarien, sondern unterstützt auch die Entwurfsplanung der wichtigsten Bildschirme zu Beginn. Die Audible-App startet z. B. direkt in einen Hub, der Zugriff auf die Bibliothek, den Store, die Nachrichten und Statistiken des Benutzers ermöglicht. Die Erfahrung ist fokussiert, sodass Benutzer Hörbücher schnell abrufen und genießen können. Auf den unteren Ebene der App liegt der Schwerpunkt auf spezielleren Aufgaben.

Verwandte Richtlinien finden Sie unter Navigationsdesigngrundlagen.

Dynamics

Umsetzen des Konzepts

In der Konzeptphase geht es um das Festlegen des App-Zwecks, und in der dynamischen Phase geht es um die Ausführung und Erreichung dieses Zwecks. Dies kann auf verschiedene Weise erreicht werden, z. B. durch die Verwendung von Drahtmodellen, um Ihre Seitenflüsse zu skizzieren (wie man innerhalb der App von einem Ort zum nächsten gelangt, um die Ziele zu erreichen), und durch das Nachdenken über die Stimme und die Wörter, die in der gesamten Benutzeroberfläche Ihrer App verwendet werden. Drahtmodelle sind ein schnelles, einfaches Werkzeug mit niedriger Treue, mit dem Sie kritische Entscheidungen über den Benutzerfluss Ihrer App treffen können.

Der App-Fluss sollte eng mit der Aussage darüber, worin die App besonders gut ist, verbunden sein und den Nutzern dabei helfen, genau jenes spezifische Szenario zu erreichen, das sie verwirklichen möchten. Großartige Apps haben Abläufe, die leicht zu erlernen sind und nur geringen Aufwand erfordern. Denken Sie von Bildschirm zu Bildschirm: Betrachten Sie Ihre App so, als ob Sie sie zum ersten Mal verwenden würden. Wenn Sie die Erstellung der Seiten genau auf die Benutzerszenarien zuschneiden, erhalten die Nutzer genau das, was sie benötigen, ohne unnötig viele Bildschirmberührungen ausführen zu müssen. Bei Dynamik geht es auch um Bewegung. Die richtigen Bewegungsfunktionen sind die Grundlage eines guten Flusses und einfacher Wechsel von einer Seite zur nächsten.

Häufig verwendete Methoden für diesen Schritt:

• Skizzieren Sie den Fluss: Was kommt zuerst, was kommt danach?
• Stellen Sie den Ablauf in einem Storyboard dar: Wie sollen Benutzer die Benutzeroberfläche durchlaufen, um den Ablauf abzuschließen?
• Erstellen Sie einen Prototyp: Testen Sie schnell den Ablauf mit einem Prototyp.

Was möchten Sie Benutzern ermöglichen? Beispielsweise ist die Reise-App „großartig darin, Freunden zu helfen, gemeinsam Reisepläne für Gruppenreisen zu erstellen“. Listen Sie die Abläufe auf, die Sie aktivieren möchten:

• Erstellen Sie eine Reise mit allgemeinen Informationen
• Einladen von Freunden zur Teilnahme an einer Reise
• Teilnehmen an der Reise eines Freunds
• Sieh dir von anderen Reisenden empfohlene Reiserouten an.
• Hinzufügen von Reisezielen und Aktivitäten zu Reisen
• Bearbeiten und Kommentieren von Reisezielen und Aktivitäten, die von Freunden hinzugefügt wurden
• Teilen von Reiserouten mit Freunden und Familie

Visuell

Botschaften ohne Worte

Nachdem Sie die Dynamik der App festgelegt haben, können Sie Ihre App mit den richtigen visuellen Elementen ansprechend gestalten. Mit guten visuellen Elementen legen Sie nicht nur fest, wie Ihre App aussieht, sondern sorgen durch den Einsatz von Animationen und Bewegung auch für das App-Gefühl und Lebendigkeit. Ihre Auswahl an Farbpalette, Symbolen und Grafiken sind nur einige Beispiele für diese visuelle Sprache.

Alle Apps haben eine eigene Identität, und Sie haben freie Hand dabei, welche visuelle Richtung Sie für Ihre App einschlagen möchten. Lassen Sie die Inhalte das Erscheinungsbild leiten, und vermeiden Sie, dass das Aussehen die Inhalte bestimmt.

Prototyp

Optimieren Sie Ihr Meisterwerk

Die Prototyperstellung ist eine Phase des Designtrichters—einer Technik, die wir bereits besprochen haben—, in der das Artefakt, das Ihre Idee repräsentiert, weiterentwickelt wird. Es geht über eine Skizze hinaus, aber ist noch weniger komplex als eine vollständige App. Ein Prototyp kann beispielsweise eine Abfolge von mit der Hand gezeichneten Bildschirmen sein, die Benutzern gezeigt werden. Die Person, die den Test durchführt, kann auf Hinweise von Benutzern reagieren, indem sie verschiedene Bildschirme ablegt oder kleinere UI-Elemente auf den Seiten anbringt oder entfernt, um eine laufende App zu simulieren. Ein Prototyp kann auch eine sehr einfache App sein, mit der einige Workflows simuliert werden, vorausgesetzt, der Bediener hält sich an ein Skript und betätigt die richtigen Schaltflächen. In dieser Phase werden Ihre Ideen zum ersten Mal wirklich zum Leben erweckt, und Ihre harte Arbeit wird einem ersten richtigen Test unterzogen. Nehmen Sie sich bei der Prototyperstellung von Bereichen Ihrer App die Zeit zum Entwerfen und Verfeinern der Komponenten, die jeweils am wichtigsten sind.

An neue Entwickler: Wir können es nicht oft genug betonen: Die Erstellung großartiger Apps ist ein iterativer Prozess. Es ist ratsam, Prototypen zu einem frühen Zeitpunkt und häufig zu erstellen. Wie bei jedem kreativen Vorgang sind die besten Apps das Produkt intensiver Tests.

Überlegen, welche Features Sie bereitstellen möchten

Wenn Sie die Bedürfnisse der Benutzer kennen und wissen, wie Sie sie bei deren Erfüllung unterstützen können, sollten Sie sich mit den speziellen Tools der Toolbox beschäftigen. Erkunden Sie die Universal Windows Platform (UWP) und ordnen Sie die Features den Anforderungen Ihrer App zu. Beachten Sie bei jeder Funktion die Richtlinien für die Benutzererfahrung.

Allgemeine Methoden:

• Plattformrecherche: Finden Sie heraus, welche Features die Plattform bietet und wie Sie sie verwenden können.
• Assoziationsdiagramme: Verbinden Sie Ihre Flüsse mit Features.
• Prototyp: Testen Sie die Features, um sicherzustellen, dass sie wie gewünscht funktionieren.

App-Verträge Ihre App kann an App-Verträgen teilnehmen, die umfassende, App- und funktionsübergreifende Benutzerflüsse ermöglichen.

• Teilen Ermöglichen Sie Benutzern das Teilen von App-Inhalten mit Freunden über andere Apps sowie das Empfangen freigabefähiger Inhalte von anderen Benutzern und Apps.
• Wiedergeben auf Ermöglichen Sie Ihren Benutzern, Audio, Video oder Bilder von Ihrer App im Heimnetzwerk auf andere Geräte zu streamen, um sie zu genießen.
• Dateiauswahl und Dateiauswahlerweiterungen Ermöglichen Sie Benutzern das Laden und Speichern ihrer Dateien im lokalen Dateisystem, auf angeschlossenen Speichergeräten, in Heimnetzgruppen und sogar in anderen Apps. Außerdem können Sie eine Dateiauswahlerweiterung bereitstellen, sodass andere Apps den Inhalt Ihrer App laden können.

Weitere Informationen finden Sie unter App-Verträge und Erweiterungen.

Differente Ansichten, Formfaktoren und Hardwarekonfigurationen Windows stellt Benutzern die Verantwortung und Ihre App in den Vordergrund. Ihre App-UI soll auf jedem Gerät, mit jeder Eingabemethode, in jeder Ausrichtung, mit allen Hardwarekonfigurationen und unter allen Umständen überzeugen.

Touch first Windows bietet eine einzigartige und unverwechselbare Toucheingabe, die mehr als nur die Mausfunktionalität emuliert.

Der semantische Zoom beispielsweise stellt eine für Touchscreens optimierte Methode zum Navigieren in umfangreichen Inhalten dar. Benutzer können Inhaltskategorien verschieben oder durchscrollen und dann in diese Kategorien hineinzoomen, um weitere detailliertere Informationen anzuzeigen. Damit können Sie Ihre Inhalte auf besser fühlbare, bildlichere und aussagekräftigere Art und Weise darstellen als mit traditionellen Navigations- und Layoutmustern wie Registerkarten.

Selbstverständlich können Sie zahlreiche Touch-Gesten wie Drehen, Schwenken, Wischen und andere nutzen. Erfahren Sie mehr über Toucheingaben und andere Benutzerinteraktionen.

Interessant und aktuell Mit den folgenden Standardmechanismen stellen Sie sicher, dass Ihre App interessant ist und die Aufmerksamkeit der Benutzer erregt:

• Animationen Verwenden Sie Animationen aus unserer Bibliothek, um Benutzern eine schnelle und fließende App-Bedienung zu ermöglichen. Helfen Sie Benutzern, Kontextänderungen zu verstehen, und verbinden Sie Interaktionen mit visuellen Übergängen. Weitere Informationen zum Animieren der UI.
• Popupbenachrichtigungen Erinnern Sie Benutzer mithilfe von Popupbenachrichtigungen an Termine oder persönlich relevante Inhalte. Sie können sie damit auch zur Verwendung der App animieren, selbst wenn diese geschlossen ist. Weitere Informationen zu Kacheln, Abzeichen und Popupbenachrichtigungen.
• App-Kacheln Stellen Sie aktuelle und relevante Updates bereit, damit Benutzer Ihre App erneut aufrufen. Weitere Informationen hierzu erhalten Sie im nächsten Abschnitt. Weitere Informationen finden Sie unter App-Kacheln.

Personalisierung

• Einstellungen Ermöglichen Sie es den Benutzern, die App durch Speichern von Einstellungen an ihre Anforderungen anzupassen. Fassen Sie alle Einstellungen der App auf einem Bildschirm zusammen, und ermöglichen Sie Benutzern die Konfiguration der App mithilfe gängiger Methoden. Weitere Informationen zum Hinzufügen von App-Einstellungen.
• Benutzerkacheln Gestalten Sie Ihre App für Ihre Benutzer persönlicher, indem Sie ihr Benutzerkachelbild laden oder benutzern das Festlegen von Inhalten aus Ihrer App als persönliche Kachel über Windows ermöglichen.

Gerätefunktionen Stellen Sie sicher, dass Ihre App in vollem Umfang von den Funktionen moderner Geräte profitiert.

• Annäherungsgesten Lassen Sie Ihre Benutzer Geräte mit anderen Benutzern verbinden, die sich physisch in unmittelbarer Nähe befinden, indem sie die Geräte physisch aneinander tippen (z. B. bei Multiplayer-Spielen). Weitere Informationen hierzu finden Sie unter Näherung und Antippen.
• Kameras und externe Speichergeräte Sorgen Sie für Verbindungen zwischen den Benutzer und ihren integrierten oder angeschlossenen Kameras, damit sie chatten, Konferenzen durchführen, Vlogs oder Profilbilder aufnehmen, die Welt um sich herum dokumentieren oder sonstige Aktivitäten ausführen können, für die Ihre App geeignet ist. Weitere Informationen zum Zugreifen auf Inhalte auf Wechselspeichermedien.
• Beschleunigungssensoren und andere Sensoren Heutzutage sind Geräte mit einer Reihe von Sensoren ausgestattet. Ihre App kann die Bildschirmhelligkeit basierend auf der Umgebungshelligkeit erhöhen oder verringern, die UI bei Drehung des Bildschirms anpassen oder auf physische Bewegungen reagieren. Weitere Informationen zu Sensoren.
• Geolocationdienst Nutzen Sie Standortinformationen aus Standardwebdaten oder Standortsensoren, damit Benutzer sich besser zurechtfinden, ihre Position auf einer Karte ermitteln oder Benachrichtigungen über Personen, Aktivitäten und Zielorte in der Nähe erhalten können. Weitere Informationen zum geografischen Standort.

Betrachten Sie noch einmal das Beispiel der Reise-App. Um großartig darin zu sein, Freunden beim gemeinsamen Erstellen von Reiserouten für Gruppenreisen zu helfen, könnten Sie einige der folgenden Funktionen nutzen:

• Teilen: Benutzer teilen anstehende Reisen und ihre Reiserouten – und damit ihre Vorfreude auf die Reise – mit Freunden und Familie in zahlreichen sozialen Netzwerken.
• Suchen: Benutzer suchen und finden Aktivitäten oder Reiseziele in geteilten oder öffentlichen Reiserouten anderer Benutzer, die sie in ihre eigenen Reisen einbeziehen können.
• Benachrichtigungen: Benutzer werden benachrichtigt, wenn andere Reisende ihre Reiserouten aktualisieren.
• Einstellungen: Benutzer konfigurieren die App wunschgemäß, z. B. für welche Reise Benachrichtigungen angezeigt werden sollen oder welche sozialen Gruppen die Reiserouten der Benutzer durchsuchen dürfen.
• Semantischer Zoom: Benutzer navigieren durch den Reiseverlauf und zoomen, um ausführlichere Details zur langen Liste geplanter Aktivitäten anzuzeigen.
• Benutzerkacheln: Benutzer wählen das Bild aus, das angezeigt werden soll, wenn sie ihre Reise mit Freunden teilen.

Entscheiden Sie, wie Sie Ihre App monetarisieren

Ihnen stehen zahlreiche Möglichkeiten zur Verfügung, Gewinn mit Ihrer App zu erzielen. Wenn Sie Anzeigen oder Angebote in Apps verwenden, sollte die UI das auch unterstützen. Weitere Informationen finden Sie unter Planen der Monetisierung.

Entwerfen der UX für Ihre App

Hier geht es darum, die Grundlagen richtig festzulegen. Sie wissen nun, wodurch sich Ihre App besonders auszeichnet, und haben herausgefunden, welche Flüsse Sie unterstützen möchten. Jetzt können Sie über die Grundlagen der Benutzeroberfläche (UX) nachdenken.

Wie sollten UI-Inhalte organisiert werden?   Die meisten App-Inhalte können in Gruppen oder Hierarchien gegliedert werden. Das Element, das Sie als oberste Gruppierung Ihres Inhalts auswählen, sollte mit dem Schwerpunkt Ihrer "Stärken" Aussage übereinstimmen.

Im Beispiel der Reise-App stehen mehrere Methoden zum Gruppieren von Reiserouten zur Verfügung. Liegt der Fokus der App auf dem Entdecken interessanter Reiseziele, können Sie diese beispielsweise basierend auf dem jeweiligen Interessengebiet gruppieren, z. B. Abenteuer, Spaß in der Sonne oder romantische Ausflüge. Da der Fokus der App jedoch auf dem Planen von Reisen mit Freunden liegt, ist es sinnvoller, Reiserouten basierend auf sozialen Kreisen (z. B. Familie, Freunde oder Arbeit) zu gliedern.

Die Auswahl, wie Sie Ihre Inhalte gruppieren möchten, hilft Ihnen bei der Entscheidung, welche Seiten oder Ansichten Ihre App benötigt. Weitere Informationen finden Sie in den UI-Grundlagen.

Wie sollten UI-Inhalte präsentiert werden? Nachdem Sie entschieden haben, wie Sie die UI organisieren, können Sie UX-Ziele festlegen. Diese geben an, wie Ihre UI aufgebaut und dem Benutzer präsentiert wird. Sie sollten für alle Szenarien sicherstellen, dass Benutzer die App so schnell wie möglich wieder fortsetzen und nutzen können. Überlegen Sie dazu, welche Teile der UI zuerst angezeigt werden müssen. Stellen Sie sicher, dass diese Teile vollständig sind, bevor Sie Zeit in das Erstellen der unwichtigeren Teile investieren.

Bei der Reisen-App möchten Benutzer vermutlich zunächst nach einer bestimmten Reiseroute suchen. Um diese Infos schnellstmöglich zu präsentieren, sollte zuerst eine Liste der Reisen angezeigt werden. Verwenden Sie hierfür ein ListView-Steuerelement.

Nachdem die Liste mit den Reisen angezeigt wurde, können Sie mit dem Laden anderer Features wie etwa einem Newsfeed mit den Reisen von Freunden beginnen.

Welche Benutzeroberflächen und Befehle werden benötigt?   Überprüfen Sie die Flüsse, die Sie zuvor ermittelt haben. Erstellen Sie für jeden Fluss eine grobe Übersicht über die Schritte, die der Benutzer ausführt.

Betrachten Sie den Ablauf "Teilen von Reiserouten, damit Freunde und Familien folgen können". Es wird angenommen, dass der Benutzer bereits eine Reise erstellt hat. Für das Teilen einer Reiseroute können beispielsweise folgende Schritte erforderlich sein:

1. Der Benutzer öffnet die App und sieht eine Liste der erstellten Reisen.
2. Der Benutzer tippt auf die Reise, die er teilen möchte.
3. Die Details zur Reise werden auf dem Bildschirm angezeigt.
4. Der Benutzer greift auf die UI zu, um das Teilen zu initiieren.
5. Die Benutzerin wählt die E-Mail-Adresse oder den Namen des Freundes aus oder gibt diese ein, mit der sie die Reise teilen möchte.
6. Der Benutzer greift auf die UI zu, um das Teilen abzuschließen.
7. Ihre App aktualisiert die Reisedetails mit der Liste der Personen, mit denen die Reise geteilt wurde.

Bei diesem Vorgang wird nach und nach deutlich, welche UI erstellt werden muss und welche zusätzlichen Details erforderlich sind (z. B. das Entwerfen eines E-Mail-Textbausteins für Freunde, die Ihre App noch nicht verwenden). Darüber hinaus können Sie überflüssige Schritte entfernen. Beispielsweise kann es sein, dass der Benutzer die Details der Reise vor dem Teilen nicht unbedingt sehen muss. Je sauberer der Fluss, desto benutzerfreundlicher.

Ausführlichere Informationen zur Verwendung der unterschiedlichen Oberflächen finden Sie unter .

Wie sollte sich der Fluss anfühlen? Nachdem Sie die Schritte definiert haben, die der Benutzer ausführt, können Sie diesen Fluss in Leistungsziele umwandeln. Weitere Informationen finden Sie unter Planen der Leistung.

Wie sollten Befehle organisiert werden?  Ermitteln Sie anhand der Übersicht über die Schritte im Fluss potenzielle Befehle, die ins Design aufgenommen werden müssen. Überlegen Sie dann, wo sich diese Befehle in der App befinden sollen.

• Versuchen Sie immer, den Inhalt zu nutzen.  Lassen Sie die Benutzer den Inhalt möglichst direkt auf der App-Canvas bearbeiten, anstatt Befehle für den Inhalt hinzuzufügen. Lassen Sie beispielsweise in der Reise-App zu, dass Benutzer ihre Reiseroute durch Ziehen und Ablegen von Aktivitäten in einer Liste auf der Canvas neu gestalten, anstatt die Aktivität auswählen und sie mithilfe der Befehlsschaltflächen zum Verschieben nach oben bzw. nach unten neu anordnen zu müssen.

• Falls Sie den Inhalt nicht nutzen können. Ordnen Sie Befehle in einer dieser UI-Oberflächen an, falls das Verwenden des Inhalts nicht möglich ist:

  • In der Befehlsleiste: Platzieren Sie die meisten Befehle in der Befehlsleiste. Diese bleibt in der Regel ausgeblendet, bis der Benutzer sie durch eine Tippbewegung einblendet.
  • Auf der App-Canvas: Befindet sich der Benutzer auf einer Seite oder in einer Ansicht mit nur einem Zweck, können Sie Befehle für diesen Zweck direkt auf der Canvas bereitstellen. Es sollte nur sehr wenige dieser Befehle geben.
  • In einem Kontextmenü: Sie können Kontextmenüs für Zwischenablageaktionen (z. B. Ausschneiden, Kopieren und Einfügen) oder für Befehle verwenden, die auf Inhalte angewendet werden, die nicht ausgewählt werden können (z. B. Hinzufügen einer Ortsmarke zu einem Standort auf einer Karte).

Entscheiden Sie, welches Layout Ihre App in den einzelnen Ansichten erhält.  Windows unterstützt Quer- und Hochformatausrichtungen und unterstützt das Ändern der Größe von Apps auf eine beliebige Breite, von Vollbild bis zu einer Mindestbreite. Ihre App soll in jeder Größe, auf jedem Bildschirm und in jeder Ausrichtung richtig angezeigt werden und funktionieren. Dazu müssen Sie das Layout der UI-Elements für unterschiedliche Größen und Ansichten planen. In diesem Fall passt sich die App-UI einfach an die Anforderungen und Einstellungen der Benutzer an.

Weitere Informationen zur Berücksichtigung unterschiedlicher Bildschirmgrößen beim Design finden Sie unter Bildschirmgrößen und Haltepunkte für reaktionsfähiges Design.

Erzielen eines positiven ersten Eindrucks

Überlegen Sie, was Benutzer denken, fühlen oder tun sollen, wenn sie Ihre App zum ersten Mal starten. Beziehen Sie sich auf Ihre „Great at“-Aussage zurück. Auch wenn Sie keine Gelegenheit dazu haben, den Benutzern persönlich mitzuteilen, wodurch sich Ihre App besonders auszeichnet, können Sie ihnen diese Botschaft vermitteln, wenn Sie einen ersten Eindruck hinterlassen. Nutzen Sie dazu Folgendes:

Kacheln und Benachrichtigungen Die Kachel ist das Gesicht Ihrer App. Was bewegt Benutzer dazu, unter allen anderen Apps auf dem Startbildschirm genau Ihre App zu starten? Stellen Sie sicher, dass die Kachel die Marke der App hervorhebt und zeigt, wodurch sich die App besonders auszeichnet. Nutzen Sie Kachelbenachrichtigungen, sodass Ihre App immer aktuell und relevant wirkt und Benutzer sie immer wieder aufrufen.

Begrüßungsbildschirm Der Begrüßungsbildschirm sollte so schnell wie möglich geladen werden und nur bis zur Initialisierung des App-Status sichtbar bleiben. Die optische Gestaltung des Begrüßungsbildschirms sollte dem Charakter Ihrer App entsprechen.

Erster Start Was sehen Benutzer, bevor sie sich für Ihren Dienst registrieren, sich bei ihrem Konto anmelden oder eigene Inhalte hinzufügen? Demonstrieren Sie den Wert Ihrer App, bevor Sie Benutzer um Informationen bitten. Stellen Sie ggf. Beispielinhalte zum Ausprobieren für Benutzer bereit. So wird der Zweck Ihrer App verständlich, bevor Benutzer sich festlegen müssen.

Startseite Die Startseite ist der Ort, an den Sie die Nutzer jedes Mal bringen, wenn sie Ihre App starten. Der Inhalt auf dieser Seite sollte klar definiert sein und sofort deutlich machen, wozu Ihre App dient. Machen Sie diese Seite in einer Sache großartig und vertrauen Sie darauf, dass die Nutzer den Rest Ihrer App erkunden werden. Konzentrieren Sie sich darauf, Ablenkungen auf der Startseite zu beseitigen und nicht auf die Auffindbarkeit.

Überprüfen des Entwurfs

Bevor Sie sich der Entwicklung der App widmen, sollten Sie das Design oder den Prototyp anhand von Richtlinien, Benutzereindrücken und Anforderungen überprüfen. Sie vermeiden dadurch möglicherweise eine spätere Überarbeitung. Für jedes Feature sind Richtlinien für die Benutzerfreundlichkeit verfügbar, die Sie bei der optimalen Gestaltung Ihrer App unterstützen. Außerdem gelten für die Veröffentlichung von Apps im Microsoft Store eine Reihe von Store-Anforderungen. Sie können the Windows App Certification Kit verwenden, um die technische Einhaltung der Store-Anforderungen zu testen. Sie können auch die Leistungstools in Microsoft Visual Studio verwenden, um sicherzustellen, dass Sie Ihren Benutzern in jedem Szenario eine großartige Erfahrung bieten.

Mithilfe der detaillierten UX-Richtlinien für UWP-Apps behalten Sie die wichtigen Features der App im Blick. Verwenden Sie die Visual Studio-Leistungstools, um die Leistung der einzelnen App-Szenarien zu analysieren.