Programme Miro Adobe XD Maze Google Präsentation Google Formulare Go Full Page Contrast Checker
Im Rahmen eines UX-Trainings bestand die Aufgabe darin, eine Case Study zur Startseite von Gelato Pack zu entwickeln – www.gelatopack.de
Gelato Pack stellt eine innovative Lösung für den sicheren und optimalen Transport von Eiskreationen dar. Diese speziell entwickelte Mehrweg-Umverpackung bietet umfassenden Schutz für kunstvolle Eisdekorationen und gewährleistet, dass die empfindlichen Eiskreationen in einwandfreiem Zustand beim Konsumenten ankommen.
In welche Gruppen lassen sich die Nutzer der unterteilen?
Die Zielgruppe lässt sich in zwei Hauptguppen unterteilen, eimal die Lieferdienste und die Eisdielen beide Parteien haben ein Interesse Eis optimal für den Transport zu liefern. Lieferdienste Wollen ihren Kunden neben gängigen Produkten, wie beispielsweise Pizza, Obst und Gemüse auch, dekoriertes Eis anbieten können
Hypothesen
Lieferdienste wollen durch ihr vielfältiges Angebot mehr Kunden für sich gewinnen
Sie wollen mehr Umsatz generieren
Eisdielen Wollen ihr Geschäft ausweiten und endlich Eis liefern können
Hypothesen
Eisdielen wollen mehr Reichweite bekommen und somit eine größere Kundschaft ansprechen
Sie wollen mehr Umsatz generieren
Problemstellung
Problem
Nutzer verlassen die Website schnell, ohne die Informationen angemessen aufzunehmen oder Kontaktanfragen zu generieren.
Problemstellung
Status Quo
Analyse & Forschung
Expert Review
Heuristische Analyse
Die Methode der Expert Review wurde angewendet, um die Website zu analysieren, bestehende Probleme zu identifizieren und anschließend die Usability zu verbessern. Dabei kam eine heuristische Analyse zum Einsatz, die die Website nach den Kriterien der ISO 9241 untersuchte. Die identifizierten Usability-Probleme wurden in eine Skala von Schweregraden eingeteilt, die von leicht bis schwerwiegend reicht. 1. Aufgabenangemessenheit
Der Header mit Bild und Text vermittelt nicht klar, worum es auf der Website geht.
Die Slideshow bietet keinen Mehrwert, da sie weder neue noch klare Informationen übermittelt.
Das Logo ist abgeschnitten und daher schwer lesbar.
schwer
2. Unzureichender Farbkontrast
Der Text (Menüpunkte und Header-Text) ist schwer lesbar, was die Barrierefreiheit beeinträchtigt. Sie wollen mehr Umsatz generieren
schwer
3. Erwartungskonformität
Nutzer erwarten, dass Datenschutzerklärung und Impressum im Footer zu finden sind.
mittel
1. Aufgabenangemessenheit
Der Text zieht falsche Schlüsse. Die Bilder lassen vermuten, dass es sich um verschiedene Kühlverpackungen handelt.
schwer
2. Erwartungskonformität
Aufgrund des Hover-Effekts erwartet der Nutzer eine Verlinkung hinter den Bildern, die jedoch nicht vorhanden ist. Sie wollen mehr Umsatz generieren
mittel
1. Aufgabenangemessenheit
Die beiden linken Felder sind trotz Hover-Effekt nicht klickbar.
Zudem enthalten die Felder teilweise zu viel Text.
schwer
2. Erwartungskonformität
Der Nutzer erwartet schnell zugängliche Kontaktinformationen.
Beim E-Mail-Feld wird erwartet, dass sich das E-Mail-Programm automatisch öffnet.
schwer
3. Selbstbeschreibungsfähigkeit
Der Nutzer erhält keine Rückmeldung darüber, ob die eingegebene Information korrekt ist.
mittel
Analyse & Forschung
Hypothesen
Aus der Expertenbewertung ließen sich drei Hypothesen ableiten, die einen strukturierten Rahmen für die Analyse bieten. Die Hypothesen geben eine klare Richtung vor, die durch Forschung und Tests systematisch überprüft oder widerlegt werden können.
01
Das Geschäftsmodell wird nicht deutlich vermittelt, weshalb die Nutzer die Seite nach kurzer Zeit wieder verlassen.
02
Die Suche nach Kontaktinformationen ist für den Nutzer zu zeitaufwendig. Er würde es bevorzugen, direkt eine Nachricht senden zu können.Das Geschäftsmodell wird nicht deutlich vermittelt, weshalb die Nutzer die Seite nach kurzer Zeit wieder verlassen.
03
Der Nutzer scrollt durch die Seite und möchte mehr über das Thema Nachhaltigkeit erfahren. Es ist jedoch nicht möglich, über einen CTA (Call-to-Action) zur entsprechenden Unterseite zu gelangen.Das Geschäftsmodell wird nicht deutlich vermittelt, weshalb die Nutzer die Seite nach kurzer Zeit wieder verlassen.
Analyse & Forschung
5-Sekunden-Test
Auf Grund der ersten Hypothese wurde der 5-Sekunden-Test mit 15 Teilnehmer:innen durchgeführt, um die Benutzerfreundlichkeit und Effektivität von der Website zu bewerten.
Dabei wurde den Testpersonen die Webseite für fünf Sekunden gezeigt. Anschließend wurde gefragt, was sie sich gemerkt haben und welchen Eindruck sie gewonnen haben.
Das Ziel ist, festzustellen, ob die wichtigsten Informationen und der Gesamteindruck schnell und klar erfasst werden konnten. Diese Methode hilft, Schwächen im Design zu erkennen und sicherzustellen, dass die wesentlichen Botschaften und visuellen Hierarchien sofort erkennbar sind.
Das Ergebnis ist eindeutig: Die Seite ist unklar. Die meisten Teilnehmer:innen vermuten, dass die Website Eis verkauft oder ein Lieferdienst für Eis ist.
Analyse & Forschung
Wettebewerberanalyse
Basierend auf den Erkenntnissen aus dem 5-Sekunden-Test wurden indirekte Wettbewerber analysiert, da GelatoPack keine direkten Wettbewerber hat.
Es wurde festgestellt, dass vergleichbare Anbieter ihr Produkt in der Headline klar benennen und im Fließtext knappe Informationen dazu geben. Zusätzlich bieten sie eine direkte Möglichkeit zur Kontaktaufnahme, häufig durch einen speziellen Menüpunkt im Menü.
Lösungsprozess
WKW-Fragen
Das Tool „Wie-können-wir-Fragen“ ist eine kreative Technik, die zur Problemlösung und Förderung von Innovationen verwendet wird. Es basiert auf der Formulierung von Fragen, die mit „Wie können wir…?“ beginnen, um Lösungen für bestimmte Herausforderungen zu finden. Diese Fragen regen dazu an, Probleme aus verschiedenen Perspektiven zu betrachten und kreative Lösungsansätze zu entwickeln.
Die entwickelten Fragen lauten: …den Nutzern helfen, das Produktangebot schneller zu verstehen? …den Nutzern die Hürde der Kontaktaufnahme nehmen? …den Nutzern am einfachsten von dem Angebot überzeugen? …den Nutzern das Thema Nachhaltigkeit zugänglicher aufbereiten?
Lösungsprozess
Wireframes
Basierend auf den formulierten „Wie-können-wir-Fragen“ (WKW-Fragen) wurden die Wireframes konzipiert und visualisiert. Die Wireframes zeichnen sich durch:
Eine klare Produkt-Botschaft aus
Zwei Call-to-Actions für eine verbesserte Kontaktaufnahme
Verwendung von Weißraum zur besseren Fokussierung
Aufgeräumte und klare Informationen
Verwendung von Weißraum zur besseren Fokussierung
Durch ein Fallbeispiel wurde eine Möglichkeit zur Identifikation geschaffen.
Zusätzlich erfolgt hier eine Emotionalisierung, um potenzielle Kunden durch Geschichten stärker an das Produkt zu binden.
Bei Kontaktaufnahme wird die Erwartungshaltung klargestellt: „Schreiben Sie uns gerne eine Nachricht mit Ihrem Anliegen. Wir melden uns in Kürze.“
Das Formular wurde auf die wesentlichen Punkte reduziert.
Es wurde ein Nachrichtenfeld integriert.
Ein deutlicher und gut sichtbarer Call-to-Action wurde implementiert.
Testen
Forschungsplan
Um ins Testen zu gehen, wurde vorher ein Forschungsplan erstellt, der Ziele und Fragen definiert.
Hintergrund
GelatoPack plant eine Überarbeitung der Website, um sicherzustellen, dass Nutzer schnell und einfach verstehen, worum es bei GelatoPack geht. Hierbei sollen das Produkt, die Marke und die Vision klar und eindeutig dargestellt werden. Die Nutzer sollen zudem in der Lage sein, sich intuitiv auf der Seite zu bewegen und zu interagieren, was unter anderem durch klare Call-to-Actions und eine unkomplizierte Möglichkeit zur Kontaktaufnahme erreicht werden soll.
Ziel der Forschung
Das Forschungsziel besteht darin sicherzustellen, dass die Nutzer der Website www.gelatopack.de in der Lage sind, in wenigen einfachen Schritten das Verständnis für das Produkt, die Marke und die Vision zu erlangen und/oder schnell Kontakt aufzunehmen können.
Forschungsfragen
Wie einfach und intuitiv können Nutzer mit GelatoPack in Kontakt treten?
Erkennen die Nutzer was GelatoPack anbietet?
Können sie Vorteile von dem Produkt nennen?
Forschungsmethode
Usability Test – unmoderiert
Testen
Auswertung
Die Auswertung zeigt nur einen Auszug und baut auf der Forschungsfrage „Wie einfach und intuitiv können Nutzer mit GelatoPack in Kontakt treten?“ auf.Nutzer Feedback in Worten: „Einfach“ „Alles gut funktioniert :)“ „Scrollt zu weit …“
Das Feedback „Scrollt zu weit …“ deutet darauf hin, dass der Kontaktbereich im Menü von den Nutzern nicht wahrgenommen wird.
Auf Grundlage des Feedbacks „Scrollt zu weit …“ wurde der Prototyp angepasst: Das Menü wurde fixiert und der Menüpunkt „Kontakt“ in einen hervorgehobenen Sekundärbutton umgewandelt, um mehr Aufmerksamkeit zu erzeugen und die Kontaktaufnahme zu erleichtern.
Testen
Prototyp
Erkenntnisse
Konkrete Learnings
Aus den Tests wurden Erkenntnisse gewonnen.
Für den Forschungsplan ist es wichtig, mehr Zeit für die Art der Fragestellung und zusätzlichen Kontext zur Fragestellung einzuplanen, um bessere Erkenntnisse aus den Tests zu gewinnen.
Außerdem sollte nach den Gründen für die Bewertung der Aufgabe gefragt werden, um die Bewertungen der Nutzer besser einordnen zu können.
Erkenntnisse
Nächste Schritte
1. Usability-Test 2.0 2. Anpassungen 3. High-Fidelty Prototyp bauen
