Kunde
UX Design Institut
Projekt Typ
UX / Product Design
Projektjahr
Sep. 2022 – Feb. 2023
Meine Rolle
UX/ Product Design
Project Tool:
Das Projekt war für eine reaktionsfähige Webseite für ein fiktives Startup. Mein Ziel war es, ein rasches, unkompliziertes und benutzerfreundliches Online-Erlebnis zu schaffen, basierend auf den Bedürfnissen der beabsichtigten Nutzer. Die Frage war, wie der Benutzer Flüge kaufen oder vergleichen konnte. Wie erreicht der Benutzer auf minimale Weise drei grundlegende Aufgaben, um sein Ziel zu erreichen. Suchen, auswählen und kaufen
Ich begann mit der Überzeugung, dass UX in erster Linie darin besteht, Probleme zu identifizieren, die die Benutzer haben, um Lösungen für sie zu entwickeln und anzubieten. Deshalb begann ich die Erwartungen, Schwierigkeiten und positiven Aspekte der Nutzer zu studieren, um zu verstehen was sie in iherer Branche brauchen. Dann habe ich alle Erkenntnisse gesammelt und Triangulationsanalysemethoden verwendet, um Bereiche zu identifizieren, die Verbesserungen benötigten, um mich auf die Konzept- und Design-/Prototyp-Phasen zu konzentrieren.
Hauptarbeitsprozess
Research
Meine Strategie für dieses Projekt konzentrierte sich darauf, Einblicke in die Ziele, das Verhalten und den Kontext der Benutzer zu sammeln. Ich habe eine Mischung aus Methoden verwendet, einschließlich Benchmarking, Umfragen und Benutzertests, um Einblicke in andere Unternehmen auf dem Markt zu gewinnen und Daten zu sammeln. Dies ermöglichte es mir, die Benutzerziele und -Probleme zu verstehen und ein detailliertes Feedback zu Bereichen zu erhalten, die Verbesserungen benötigten.
Um die Zuverlässigkeit meiner Ergebnisse sicherzustellen, habe ich einen Triangulationsprozess verwendet, bei dem Daten aus mehreren Quellen verglichen und kontrastiert wurden, um wichtige Problempunkte zu identifizieren und zu validieren. Dieser Prozess beinhaltete die Triangulation von Quellen und Techniken, welches eine umfassendere Datenanalyse ermöglichte.
Wettbewerbsfähige Benchmarking
Dies ist eine entscheidende Komponente in jeder Analyse, insbesondere im Bereich der UX, da sie wertvolle Einblicke liefert, wie eine Designlösung im Vergleich zu anderen Unternehmen auf dem gleichen Markt abschneidet. In meinem Projekt habe ich eine Liste von vier Wettbewerbern zusammengestellt;; CheapTickets, United Airlines, SWOODOO und lastminute.
Der Überprüfungsprozess umfasst vier Kategorien (Homepage, Suche und Auswahl, Eingabe von Details und Web-Performance). Es half mir, die Bereiche zu identifizieren, in denen sie gut abschnitten, die ich nachahmen konnte, was sie weniger gut machten, was ich verbessern konnte, und welche Konventionen ich in meinem Projekt befolgen musste!
Haupterkenntnis
Flüge effizienter und einfacher finden.
Die Webssite benötigte eine Datenbank zum Speichern von Suchdaten, so dass Benutzer Flüge effizienter und einfacher finden konnten.
Personalisiert Angebote basierend auf dem Standort eines Benutzers.
Die Website personalisiert Angebote basierend auf dem Standort des Benutzers, bietet relevante Informationen und verbessert so die Benutzererfahrung.
Erfüllt die meisten Benutzerziele
Die Standardauswahl für Hin- und Rückflüge entspricht in der Regel den meisten Benutzerzielen.
Datumsauswahl Erfahrung
Die Datumsauswahl-Funktion bietet den Benutzern zwei Optionen: das Auswählen eines Datums oder das manuelle Eingeben in das Feld.
Uneinheitliche Schriftarten
Die uneinheitliche Verwendung verschiedener Schriftarten auf der Website wirkt sich negativ auf die Markenpräsentation aus.
Keine Autofill-Funktionalität
Haupterkenntnis
Trends bei der Buchung von Flugreisen.
Verstehen des Nutzerverhaltens
Was Benutzer auf Airline-Websites suchen
Online Umfrage
Während der Forschungsphase dieses UX-Projekts habe ich eine Online-Umfrage durchgeführt, um ein gründlicheres Verständnis der Ziele, des Verhaltens und des Kontexts der Benutzer zu erlangen. Die Online-Umfrage wurde so konzipiert, dass sie eine Kombination aus quantitativen und qualitativen Fragen enthält, um Erkenntnisse zu verschiedenen Aspekten zu sammeln, einschließlich, aber nicht beschränkt auf:
- Die Hauptziele der Benutzer beim Besuch der Airline-Website oder -App.
- Hindernisse oder Herausforderungen, die die Benutzer daran hindern, ihre Aufgaben zu erfüllen.
- Verbesserungsmöglichkeiten.
Reflexion:
Um umfassendere Erkenntnisse zu gewinnen, wäre es notwendig, eine grössere Auswahl an Daten zu sammeln. Während in dieser Studie Familienmitglieder und Freunde als Teilnehmer dienten, könnte die Verwendung eines Umfrageverteilungsdienstes mit Anreizen wahrscheinlich zu einer höheren Teilnahme und somit zu tieferen Erkenntnissen führen.
Benutzerinterview / Benutzerfreundlichkeitstest
Da Venus Airlines ein fiktives Produkt ist, das von Grund auf entwickelt werden musste, musste ich die Websites der Wettbewerber ChepTeckit und Swiss Airline für die Tests betreffend Benutzerfreundlichkeit nutzen. Der Teilnehmer war ein Freund, der kürzlich die Websites der Fluggesellschaften genutzt hatte, weshalb er ein ausgezeichneter Kandidat war, um wertvolles Feedback zu liefern. Der Test begann mit einem ausführlichen Interview, um weitere Informationen über die letzten Erfahrungen des Teilnehmers mit Airline-Websites/-Apps und seine allgemeinen Vorlieben bei der Buchung von Flügen zu sammeln. Anschließend wurde der Teilnehmer gebeten, Aufgaben auf den Websites von ChepTeckit und Swiss Airline zu erledigen und dabei Rückmeldung zur Benutzerfreundlichkeit und zum Gesamtnutzererlebnis zu geben. Zusammenfassend zielt dieser Test darauf ab, Schwachstellen und Bereiche zu identifizieren, die Verbesserungen erfordern, wenn Nutzer mit Fluggesellschaftswebsites interagieren, und ein besseres Verständnis ihres mentalen Modells zu gewinnen Des Weiteren können wir, indem wir positive Interaktionen während des Prozesses identifizieren, diese in unser Projekt einbeziehen.
- Die Präzisierung des Flughafennamens kann für Benutzer bei der Auswahl ihrer Abflugs- und Ankunftsorte zu Verwirrung führen.
- Schlecht platzierte Benachrichtigungen über die erneute Auswahl eines Abflugsfluges führten dazu, dass der Teilnehmer Zeit sparte, um herauszufinden, was schief gelaufen war und wie er weiter vorgehen sollte.
- Die Informationen zur Gepäckrichtlinie waren auf den Websites von ChepTeckit und Swiss Airline schwer zu finden, was bei den Benutzern Verwirrung und Frustration verursachte.
- Die Benutzer fanden es schwierig, die Umsteigezeiten zwischen den Flügen schnell zu erkennen, da sie zu wenig auffällig präsentiert wurden.
- Ein Popup, das eine Preisanpassung anzeigte, führte zu Zweifeln an der Zuverlässigkeit der Website.
- Probleme mit der Terminologie im Zusammenhang mit dem Ticketdienst
- Benötigt Unterstützung bei der Entscheidung, wie Flüge und Preise ausgewählt werden.
Analysis
Affinitätsdiagramm
Nach der Recherche des Problems ging ich zur Analyse über Dies umfasste das Zusammenstellen von Daten aus Wettbewerbsbenchmarking, Online-Umfragen und Benutzerfreundlichkeits-Tests. Die Rohdaten der Forschung wurden dann mit Kollegen zur Zusammenarbeit über die Miro-App geteilt, wobei Beobachtungsnotizen aus allen Quellen verwendet wurden.
Zuerst haben wir die Daten in Abschnitte wie Startseite, Flugauswahl, Passagierinformationen und Kasse usw. kategorisiert. Danach haben wir uns in jede Gruppe vertieft, um kleinere Unterkategorien mit Komponenten wie Datumsauswahl oder Flugkarten zu erstellen. Dies führte dazu, dass wir Muster identifizierten und Bereiche erkannten, die Verbesserungen erforderten. Anschließend erwies sich die Anordnung dieser Hauptkategorien in aufeinanderfolgender Reihenfolge basierend auf ihrer Position im Buchungsablauf als vorteilhaft bei der Entwicklung einer Kundenreisekarte.
Wie könnten wir (WKW) Statements
Nachdem ich eine umfangreiche Menge an Informationen gesammelt hatte, wurde mir klar, wie wichtig es ist, mich in meiner Untersuchung auf die Bedürfnisse und Anliegen der Benutzer zu konzentrieren. Dies führte mich dazu, „Wie könnten wir“ (WKW) Aussagen zu erstellen, die als Auslöser dienen, um Beobachtungen in Ansätze für Verbesserungen umzuformulieren und originale Strategien zur Bewältigung der während der Analyse aufgedeckten Probleme zu entwickeln. Die Anwendung dieses Ansatzes hat einen erheblichen Einfluss auf die Generierung frischer Ideen und die Formulierung innovativer Lösungen, die auf die Bedürfnisse der Benutzer zugeschnitten sind.
Wie könnten wir den Suchprozess für wiederkehrende Benutzer optimieren, um Preise und Zeiten schneller vergleichen zu können?
Wie könnten wir die Preisgestaltung transparenter und vorhersehbarer gestalten, um die Nutzerfrustration zu reduzieren?
Wie könnten wirUmsteigezeiten und -orte zwischen den Flügen für eine schnellere Erkennung durch Benutzer prominenter anzeigen?
Wie könnten wir die Auswahl von Flügen und Tarifen erleichtern?
Customer Journey Map
Ich habe ein Affinitätsdiagramm entwickelt, um prozessbezogene Anliegen zu kategorisieren. Anschliessend habe ich den Schritt unternommen, eine visuelle Darstellung dieser Analyse zu generieren, um mein Verständnis für die Anforderungen des Kunden zu vertiefen, die Zufriedenheit zu steigern und innovative Möglichkeiten zu identifizieren. In diesem Moment erinnerte es mich daran, dass der Satz, „UX beinhaltet nicht nur Problemlösung, sondern erzeugt auch positive Emotionen“ – nach wie vor gültigt ist.
Ich habe die Kundenreise vom Website-Besuch bis zur Flugbuchung skizziert und dabei die Benutzerziele und Interaktionen für jeden Schritt definiert. Durch die Identifizierung von Verhaltensweisen und Denkmodellen habe ich Trendlinien erstellt, die die insgesamt von den Benutzern während ihrer Reise erlebten Emotionen erfassten. Dieser Ansatz ermöglichte es mir, wesentliche Schmerzpunkte und Bereiche für Verbesserungen zu identifizieren, was zur Entwicklung gezielter Lösungen führte. Ich fügte direkte Benutzerzitate hinzu, um den Benutzern eine Stimme zu verleihen.
Flow Diagram
Nach der Analyse meiner Forschungsdaten habe ich Lösungen entwickelt und einen Benutzerfluss für die Buchung erstellt. Der iterative Prozess erforderte während der Designphase häufige Aktualisierungen, war aber entscheidend für das Schaffen einer soliden Projektgrundlage.
Dieser Benutzerfluss hat detailliert beschrieben, wie Benutzer sich von der Startseite bis zur Zahlungsbestätigung auf der Website bewegen würden, wobei Hauptanwendungsfälle dargestellt und individuelle Bildschirmdesigns angeleitet wurden.
Interaktionsdesign
Nachdem der Benutzerfluss abgeschlossen und die Benutzerreise und Interaktion bestimmt wurde, ist es an der Zeit für einen kreativen und unterhaltsamen Schritt, bei dem Stift und Papier zum Einsatz kommen. Das Skizzieren von Ideen, bevor man sich in digitale Designwerkzeuge stürzt, kann jedem Designer helfen, die Konzepte schnell zu überarbeiten und zu verfeinern, was zu einem effektiveren und benutzerfreundlicheren Endprodukt führt und dabei die Erkenntnisse aus Forschung und Analyse berücksichtigt.
Ich beginne damit, mehrere Designkonzepte zu skizzieren und iteriere daran, bis ich zu Ideen auf dem Papier gelange. Anschließend habe ich auf meinem iPad begonnen, weitere Details wie Farben und Beschreibungen für jeden Abschnitt oder jede Interaktion hinzuzufügen. Nachdem das digitale Design abgeschlossen war, habe ich die Bilder auf meinem iPad in die Adobe XD-App importiert, wo ich sie in eine Sequenz des zuvor erstellten Flusses geordnet habe. Das war für mich sehr hilfreich, um das Hauptelement zu identifizieren, das ich für meinen interaktiven Prototyp erstellen wollte.
„Wie könnten wir“ (WHW) Statements Lösungen
Wie können wir den Suchprozess für wiederkehrende Benutzer optimieren, um Preise und Zeiten schneller zu vergleichen?
Bieten Sie den Nutzern die Möglichkeit, auf Ihrer Website ein Konto anzulegen, um ihre Suchpräferenzen, persönlichen Informationen und Zahlungsdetails zu speichern.
Führen Sie eine „Suche speichern“-Funktion ein, die es Benutzern ermöglicht, ihre Suchpräferenzen für zukünftige Verwendung zu speichern, ohne sich anzumelden.
Verwenden Sie Cookies, um die Suchhistorie und Präferenzen der Benutzer zu speichern, damit die Website sich an ihre vorherigen Suchanfragen erinnern und passende Optionen vorschlagen kann, wenn sie zur Website zurückkehren.
Benachrichtigen Sie E-Mail-Benutzer, wenn sich die Preise für ihre gespeicherten Suchen ändern oder neue Angebote verfügbar werden.
Wie könnten wir die Preisgestaltung transparenter und vorhersehbarer gestalten, um die Benutzerfrustration zu lindern?
Zeigen Sie alle Gebühren und Steuern im Voraus an, sodass Benutzer die Gesamtkosten ihres Fluges vor der Buchung sehen können.
Ermöglichen Sie dem Benutzer, zur Suchergebnisseite zurückzukehren, ohne die Suchdaten zu verlieren.
Die Flugkarten sollten den Preis der Benutzerprioritäten abdecken, wie zum Beispiel Gepäckgebühren und Basispreise.
Stellen Sie sicher, dass die Preis-Aufschlüsselung gesehen wird und sich nach der Auswahl des Fluges aktualisiert.
Wie könnten wir die Umsteigezeiten und -orte zwischen den Flügen prominenter anzeigen, damit Benutzer sie schnell erkennen können?
Heben Sie Flüge mit Direktflügen oder kurzen Umsteigezeiten hervor.
Bieten Sie eine visuelle Darstellung der Flugroute, einschliesslich Umsteigezeiten, Dauer und Streckenverläufe, damit Benutzer ihre Reisepläne schnell visualisieren können.
Bieten Sie einen Filter an, der Benutzern hilft, beispielsweise nur Direktflüge oder Flüge mit mehr als zwei Zwischenstopps anzuzeigen.
Wie könnten wir die Auswahl von Flügen und Tarifen erleichtern?
Die Recherche zeigte, dass Benutzer häufig annehmen, dass der ausgewählte Tarif für die gesamte Hin- und Rückreise gilt, einschließlich der Abflugs- und Rückflüge.
Verwenden Sie ein klares, unkompliziertes Layout, das es Benutzern ermöglicht, ihr ausgewähltes Tarifsystem zu verstehen.
Vermeiden Sie es, den Benutzer auf eine andere Seite umzuleiten, um den Rückfahrttarif auszuwählen. Lassen Sie den Benutzer es auf derselben Seite auswählen, was Zeit, Daten, Aufwand und vor allem Missverständnisse reduzieren wird. Dies kann erreicht werden, indem ein Popup zur Abwicklung des Tarifprozesses präsentiert wird.
Design
Prototype
Ich begann, Bildschirme in Adobe XD zu gestalten, wobei ich mich an einem Drahtgitter orientierte, um mich bei der Erstellung der Komponenten und Steuerelemente wie Schalter, Schaltflächen, Eingabefelder usw. zu leiten, die später für die Erstellung des Prototyps verwendet werden würden. Ein Drahtgitter ist ein entscheidender Schritt im Designprozess, um das Layout zu visualisieren und zu organisieren, den Benutzerfluss zu validieren und die zuvor erstellten Skizzen zu überprüfen. Dies wird sicherstellen, dass das endgültige Produkt den Anforderungen des Kunden und den Designspezifikationen entspricht.
Nachdem ich die grundlegenden Elemente abgeschlossen hatte, habe ich den Prototyp mit mittlerer Fidelity erstellt, um dem Design eine realistischere Anmutung zu verleihen und die Benutzererfahrung natürlicher zu gestalten. Der Prototyp durchlief viele Iterationen, um das Design zu verfeinern und zu verbessern. Dabei flossen Rückmeldungen aus Benutzertests ein, um sicherzustellen, dass er intuitiv und leicht zu verwenden war. Die Schlüsselpunkte waren die Abschnitte „Tarife“ und „Kürzlich durchgeführte Suchanfragen“, einer auf der Suchergebnisseite und der andere auf der Startseite. Diese wurden entwickelt, um Benutzern den einfachen Zugriff auf Informationen zu ermöglichen, die sie während ihres Suchprozesses benötigen könnten.
Übergabe kommentierter Wireframes
Die Übergabe des annotierten Prototyps mit mittlerem/hohem Detaillierungsgrad war der letzte Schritt im UX-Prozess, der dazu beitrug, die Kluft zwischen Design und Entwicklung zu überbrücken.“ Es stellte sicher, dass die Designvision und die Benutzererfahrung klar an das Entwicklungsteam kommuniziert wurden, was zu einem effizienteren und effektiveren Entwicklungsprozess führte.“ Es war für mich von großer Bedeutung, so detailliert zu sein, da dies half, Unklarheiten oder Verwirrungen bezüglich der Designelemente und Funktionen zu beseitigen und die Notwendigkeit für einen umfangreichen Austausch zwischen Designern und Entwicklern zu reduzieren Das war für mich nicht ganz neu, da ich zuvor als Entwickler gearbeitet habe und während meiner Arbeit Dokumente dieser Art gesehen habe.
Vielen Dank für die Aufmerksamkeit
Ähnliche Projekte
Fintexa UI Kit – Design System
Benutzerfrustrationen in positive Nutzererfahrungen umwandeln
Alanis Siffert | VISUELLE IDENTITÄT
